/* Section overlay for background images */
.section-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.55)); mix-blend-mode: normal; z-index: 0; pointer-events: none; }
/* Blue tinted overlay variant */
.section-overlay--blue { background: linear-gradient(180deg, rgba(13,110,253,.38), rgba(0,0,0,.72)); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
/* Delta Tech S.A. Theme (Dell-like palette) */
:root {
  --dt-dark: #0b0f14;
  --dt-blue: #0e2a47;
  --dt-primary: #0d6efd;
  --dt-gray: #6c757d;
}

html { scroll-behavior: smooth; }
body { font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif; color: #111; }

/* Subtle background pattern utility */
.bg-pattern {
  background-image:
    radial-gradient(rgba(255,255,255,.65) 1.4px, transparent 1.4px),
    radial-gradient(rgba(255,255,255,.5) 1.4px, transparent 1.4px);
  background-size: 20px 20px;
  background-position: 0 0, 10px 10px;
}

/* Header */
.header .navbar { background: rgba(0,0,0,.92) !important; backdrop-filter: saturate(1.2) blur(6px); }
.navbar-brand { letter-spacing: .3px; }

/* Preloader */
.preloader { position: fixed; inset: 0; background: var(--dt-dark); display: grid; place-items: center; z-index: 2000; transition: opacity .4s ease; }
.preloader.hidden { opacity: 0; pointer-events: none; }
.preloader-inner { text-align: center; color: #fff; }
/* Preloader brand layout */
.preloader-brand { display: inline-flex; align-items: center; gap: .75rem; padding: .75rem 1rem; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.15); border-radius: .75rem; }
.preloader-logo { display: block; height: clamp(44px, 8vw, 72px); width: auto; object-fit: contain; filter: drop-shadow(0 0 1px rgba(0,0,0,.2)); }
.preloader-name { font-weight: 700; font-size: clamp(1.125rem, 2.2vw, 1.5rem); letter-spacing: .2px; color: #fff; white-space: nowrap; }

/* Sections */
.py-6 { padding-top: 4rem; padding-bottom: 4rem; }
section { scroll-margin-top: 84px; }

/* Hero */
.hero-section { position: relative; min-height: 85vh; background-color: var(--dt-dark); background-position: center; background-size: cover; background-repeat: no-repeat; }
.hero-section .overlay { position: absolute; inset: 0; background: radial-gradient(ellipse at top, rgba(13,110,253,.28), rgba(0,0,0,.7) 60%), linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.7)); }
.hero-section .lead { color: rgba(255,255,255,.88); }

/* Servicios */
.service-card { border: 0; background: #0f141a; color: #eaeef2; }
.service-card .card-body { padding: 1.25rem; }
.service-card p,
.service-card .text-body-secondary { color: #cfe2ff !important; }
.icon-wrap { width: 48px; height: 48px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; font-size: 1.25rem; }

/* About / Nosotros enhancements */
.about-section .feature-item { align-items: center; gap: .75rem; }
.about-section .feature-item .icon-wrap { width: 44px; height: 44px; border-radius: 12px; }
.stat-card { background: #fff; border: 1px solid #e9ecef; border-radius: .75rem; box-shadow: 0 .25rem .75rem rgba(0,0,0,.05); }
.stat-card .h3 { font-weight: 700; }

/* Portfolio */
.portfolio-grid .card { transition: transform .2s ease, box-shadow .2s ease; }
.portfolio-grid .card:hover { transform: translateY(-4px); box-shadow: 0 1rem 2rem rgba(0,0,0,.15) !important; }
/* Uniform image height inside portfolio cards (robust across browsers) */
.portfolio-grid .card .card-img-top { width: 100%; height: clamp(200px, 30vw, 340px) !important; object-fit: cover; object-position: center; display: block; }
@supports not (height: clamp(1px, 2vw, 3px)) {
  .portfolio-grid .card .card-img-top { height: 260px !important; }
}
/* Portfolio filters: container neutral (let Bootstrap row/cols handle layout) */
.portfolio-filters { display: block; max-width: 100%; overflow-x: hidden; }
.portfolio-filters .btn + .btn { margin-left: 0 !important; }
/* Always keep filter labels on a single line with ellipsis if needed */
.portfolio-filters .btn { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; word-break: keep-all; hyphens: none; -webkit-hyphens: none; -ms-hyphens: none; }
@media (max-width: 991.98px) {
  /* Buttons fill their columns; single line with ellipsis */
  .portfolio-filters { display: block; width: 100%; }
  .portfolio-filters .btn { width: 100%; flex: initial; margin: 0 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
}
/* On small screens, show exactly 2 buttons per row without overflow */
@media (max-width: 767.98px) {
  .portfolio-filters { width: 100%; }
  .portfolio-filters .btn { padding-inline: .65rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: center; min-width: 0; font-size: .9rem; }
}

/* Partners */
.partner-tile { height: clamp(96px, 12vw, 128px); background: #e9ecef; border-radius: .5rem; display: flex; align-items: center; justify-content: center; padding: clamp(10px, 1.5vw, 16px); overflow: hidden; }
.partner-logo { height: clamp(56px, 8vw, 80px); max-width: 100%; width: auto; filter: drop-shadow(0 0 1px rgba(0,0,0,.25)); opacity: 1; transition: transform .28s ease, filter .28s ease; will-change: transform; }
.partner-logo:hover { transform: scale(1.12); }
/* Trigger zoom when hovering the entire tile (desktop) or focusing inside */
.partner-tile:hover .partner-logo, .partner-tile:focus-within .partner-logo { transform: scale(1.12); filter: drop-shadow(0 4px 12px rgba(0,0,0,.25)); }
/* Touch devices: use :active for a subtle zoom */
@media (hover: none) and (pointer: coarse) {
  .partner-tile:active .partner-logo { transform: scale(1.06); }
}
/* Size modifiers for specific tiles */
.partner-logo.partner-logo--sm { height: clamp(48px, 6vw, 64px); }
.partner-logo.partner-logo--lg { height: clamp(68px, 9vw, 92px); }
.partner-tile--compact { padding: clamp(6px, 1vw, 12px); }
/* Taller tile variant for oversized logos */
.partner-tile--tall { height: clamp(120px, 14vw, 144px); }

/* Testimonios */
/* ERROR (2025-09-21): Un item del carrusel (#testimoniosCarousel) estaba FUERA de .carousel-inner (Cargill),
   lo que rompía la navegación/visibilidad. Se corrigió en index.html moviendo el bloque dentro de .carousel-inner.
   Nota: Este CSS no era la causa del problema; se deja asentado aquí por pedido del usuario. */
.testimonial-card { border: 0; background: #f8f9fa; height: clamp(340px, 38vw, 420px); display: flex; }
/* Center testimonial content vertically */
.testimonial-card .card-body { flex: 1 1 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; }
/* Larger testimonial logo/avatar size */
.testimonial-card .card-body img { width: clamp(120px, 16vw, 180px) !important; height: auto; background: #fff; padding: 8px; border-radius: 12px; border: 1px solid rgba(0,0,0,.08); box-shadow: 0 0 0 4px rgba(255,255,255,.95), 0 .25rem .75rem rgba(0,0,0,.12); }
/* Clamp blockquote to 3 lines to keep card heights consistent */
.testimonial-card blockquote { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
/* Standard property for broader compatibility */
.testimonial-card blockquote { line-clamp: 3; }

/* Lazy background placeholder */
.lazy-bg { background-color: var(--dt-dark); background-position: center; background-size: cover; background-repeat: no-repeat; }
/* Parallax utility (desktop only) */
.bg-parallax { background-attachment: fixed; will-change: background-position; }
@media (max-width: 991.98px) { .bg-parallax { background-attachment: scroll; } }

/* Floating WhatsApp removed (replaced by inline CTA under map) */

/* Animations */
.fade-in { animation: fadeIn .6s ease both; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(8px);} to { opacity: 1; transform: none;} }
.reveal-on-scroll { opacity: 0; transform: translateY(12px); transition: all .6s ease; }
.reveal-on-scroll.is-visible { opacity: 1; transform: none; }

/* Map embed */
.map-embed { border: 0; }

/* Footer */
.footer small { color: #adb5bd; }