/* ═══════════════════════════════════════════════════════════════
   ProtectFive - Main CSS  |  Light Theme 2026
   ═══════════════════════════════════════════════════════════════ */

/* ── Variables ─────────────────────────────────────────────── */
:root {
  --bg-primary:    #FFFFFF;
  --bg-secondary:  #F5F6FA;
  --bg-card:       rgba(0,0,0,.025);
  --bg-card-hover: rgba(0,0,0,.05);
  --border:        rgba(0,0,0,.09);
  --border-hover:  rgba(0,0,0,.18);

  --accent-red:    #D92822;
  --accent-dark:   #111827;
  --accent-teal:   #1565C0;
  --accent-orange: #D92822;

  --gradient:       #D92822;
  --gradient-teal:  #1565C0;
  --gradient-warm:  #D92822;

  --text-primary:   #0F172A;
  --text-secondary: #374151;
  --text-muted:     #6B7280;

  --radius-sm:  6px;
  --radius-md:  12px;
  --radius-lg:  20px;
  --radius-xl:  32px;

  --shadow-sm:  0 1px 4px rgba(0,0,0,.07);
  --shadow-md:  0 4px 24px rgba(0,0,0,.10);
  --shadow-lg:  0 12px 48px rgba(0,0,0,.14);
  --shadow-glow:0 0 40px rgba(217,40,34,.15);

  --transition: .25s cubic-bezier(.4,0,.2,1);

  --header-h: 40px;
  --nav-h:    64px;
  --total-h:  calc(var(--header-h) + var(--nav-h));
}

/* ── Reset ──────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; font-size:16px; -webkit-text-size-adjust:100%; }
body {
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;
  background: var(--bg-primary);
  color: var(--text-primary);
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img { max-width:100%; height:auto; display:block; }
a { color:inherit; text-decoration:none; }
ul,ol { list-style:none; }
button,input,select,textarea { font-family:inherit; }
textarea { resize:vertical; }

/* ── Container ──────────────────────────────────────────────── */
.container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

/* ── Typography ─────────────────────────────────────────────── */
h1,h2,h3,h4,h5 { font-weight:800; line-height:1.15; color: var(--text-primary); }
h1 { font-size:clamp(2.8rem,5.5vw,4.5rem); font-weight:900; letter-spacing:-.04em; }
h2 { font-size:clamp(2rem,3.8vw,3rem); font-weight:900; letter-spacing:-.03em; }
h3 { font-size:clamp(1.15rem,2vw,1.45rem); font-weight:700; letter-spacing:-.01em; }
p  { color: var(--text-secondary); }

.gradient-text {
  color: var(--accent-red);
}

/* ── Buttons ────────────────────────────────────────────────── */
.btn {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.75rem 1.5rem;
  border-radius: var(--radius-md);
  font-weight:600; font-size:.95rem;
  cursor:pointer; border:none;
  transition: var(--transition);
  white-space:nowrap; text-decoration:none;
  position:relative; overflow:hidden;
}
.btn::after {
  content:''; position:absolute; inset:0;
  background:rgba(0,0,0,.07);
  opacity:0; transition:opacity var(--transition);
}
.btn:hover::after { opacity:1; }

.btn--primary {
  background: #D92822;
  color: #fff;
  box-shadow: 0 2px 8px rgba(217,40,34,.20);
}
.btn--primary:hover { box-shadow: 0 4px 16px rgba(217,40,34,.35); transform:translateY(-2px); }

.btn--outline {
  background:transparent;
  border:1.5px solid var(--border-hover);
  color: var(--text-primary);
}
.btn--outline:hover { border-color: var(--accent-red); color: var(--accent-red); }

.btn--ghost {
  background:transparent;
  color: var(--text-secondary);
}
.btn--ghost:hover { color: var(--text-primary); }

.btn--sm { padding:.5rem 1rem; font-size:.875rem; }
.btn--lg { padding:1rem 2rem; font-size:1rem; }
.btn--full { width:100%; justify-content:center; }

.btn svg { width:18px; height:18px; flex-shrink:0; }
.spin { animation:spin 1s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }

/* ── Badges ─────────────────────────────────────────────────── */
.badge {
  display:inline-flex; align-items:center;
  padding:.25rem .75rem;
  border-radius:999px;
  font-size:.75rem; font-weight:600;
  background: rgba(232,77,32,.1);
  color: var(--accent-red);
  border:1px solid rgba(232,77,32,.2);
}
.badge--sector {
  background:rgba(17,24,39,.08);
  color: var(--accent-dark);
  border-color:rgba(17,24,39,.15);
}

/* ── Header ─────────────────────────────────────────────────── */
.site-header { position:fixed; top:0; left:0; right:0; z-index:1000; }

/* Top bar */
.top-bar {
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
  height: var(--header-h);
}
.top-bar__inner {
  display:flex; align-items:center; justify-content:space-between;
  height:100%;
}
.top-bar__contact { display:flex; gap:1.5rem; }
.top-bar__item {
  display:flex; align-items:center; gap:.4rem;
  font-size:.8rem; color: var(--text-muted);
  transition:color var(--transition);
}
.top-bar__item:hover { color: var(--accent-red); }
.top-bar__item svg { width:14px; height:14px; }
.top-bar__right { display:flex; align-items:center; gap:.75rem; }
.top-bar__social { display:flex; align-items:center; gap:.4rem; }
.top-bar__social-btn {
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; border-radius:6px;
  color:var(--text-muted);
  transition:color var(--transition), background var(--transition);
}
.top-bar__social-btn:hover { color:#0A66C2; background:rgba(10,102,194,.08); }
.top-bar__social-btn--whatsapp:hover { color:#25D366; background:rgba(37,211,102,.08); }

/* Language switcher */
.lang-switcher { display:flex; align-items:center; gap:.25rem; }
.lang-switcher__item {
  font-size:.75rem; font-weight:600; letter-spacing:.04em;
  padding:.2rem .45rem; border-radius:4px;
  color:var(--text-muted);
  transition:color var(--transition), background var(--transition);
}
.lang-switcher__item:hover { color:var(--accent-red); background:rgba(232,77,32,.07); }
.lang-switcher__item--active { color:var(--accent-red); background:rgba(232,77,32,.1); }

/* Main nav */
.main-nav {
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(20px) saturate(180%);
  border-bottom:1px solid var(--border);
  height: var(--nav-h);
  transition:background var(--transition), box-shadow var(--transition);
}
.main-nav.scrolled {
  background:rgba(255,255,255,.98);
  box-shadow: var(--shadow-md);
}
.main-nav__inner {
  display:flex; align-items:center; justify-content:space-between;
  height:100%;
}
.main-nav__logo {
  display:flex; align-items:center; gap:.75rem;
  font-size:1.15rem; font-weight:500; letter-spacing:-.02em; color: var(--accent-red);
}
.main-nav__logo img { border-radius:8px; }
.main-nav__logo strong { color: var(--text-primary); font-weight:900; }

.main-nav__menu {
  display:flex; align-items:center; gap:.25rem;
}
.nav-link {
  padding:.5rem .875rem;
  font-size:.9rem; font-weight:500;
  color: var(--text-secondary);
  border-radius: var(--radius-sm);
  transition: color var(--transition), background var(--transition);
}
.nav-link:hover { color: var(--accent-red); background:rgba(232,77,32,.06); }
.nav-link--cta { margin-left:.5rem; }

/* Language selector inside main nav (mobile only) */
.main-nav__language-selector { display:none; }

/* Mobile-only nav extras (lang + social) — hidden on desktop */
.nav-mobile-extras { display:none; }

/* Mobile toggle */
.main-nav__toggle {
  display:none; flex-direction:column; justify-content:center; gap:5px;
  background:none; border:none; cursor:pointer; padding:.5rem;
  width:40px; height:40px;
}
.main-nav__toggle span {
  display:block; height:2px; background:var(--text-primary);
  border-radius:2px; transition:transform var(--transition), opacity var(--transition);
}
.main-nav__toggle[aria-expanded="true"] span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.main-nav__toggle[aria-expanded="true"] span:nth-child(2) { opacity:0; }
.main-nav__toggle[aria-expanded="true"] span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* ── Hero ───────────────────────────────────────────────────── */
.hero {
  position:relative; overflow:hidden;
  min-height:100svh;
  display:flex; flex-direction:column; align-items:stretch;
  padding-top: var(--total-h);
  padding-bottom:0;
}

.hero__bg {
  position:absolute; inset:0; z-index:0;
  background: var(--bg-primary);
}
.hero__mesh { display:none; }

.hero__orb { display:none; }
@keyframes float1 { 0%,100%{transform:translate(0,0);} 50%{transform:translate(30px,-30px);} }
@keyframes float2 { 0%,100%{transform:translate(0,0);} 50%{transform:translate(-20px,20px);} }

/* Hero split layout */
.hero__inner {
  position:relative; z-index:1;
  flex:1; display:flex; align-items:center;
  padding-top:4rem; padding-bottom:4rem;
  width:100%;
}
.hero__content { max-width:780px; margin:0 auto; text-align:center; }
.hero__badge { margin-bottom:1.5rem; }
.hero__title {
  font-size:clamp(3rem,6.5vw,5rem);
  font-weight:900; letter-spacing:-.04em;
  margin-bottom:1.5rem;
  line-height:1.05;
  color: var(--text-primary);
}
.hero__subtitle {
  font-size:clamp(1rem,2vw,1.2rem);
  color: var(--text-secondary);
  max-width:600px; margin:0 auto 2.5rem; line-height:1.7;
}
.hero__cta { display:flex; flex-wrap:wrap; gap:1rem; margin-bottom:3.5rem; justify-content:center; }

.hero__stats {
  display:flex; gap:3rem; flex-wrap:wrap; justify-content:center;
  padding-top:2rem;
  border-top:1px solid var(--border);
}
.hero__stat strong {
  display:block;
  font-size:2.5rem; font-weight:900; letter-spacing:-.04em; line-height:1;
  color: var(--accent-red);
}
.hero__stat span { font-size:.7rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color: var(--text-muted); margin-top:.25rem; display:block; }

/* Hero banner (full-width, below content) */
.hero__banner {
  position:relative;
  height:240px;
  overflow:hidden;
}
.hero__banner-img {
  position:absolute;
  width:100%; height:145%;
  top:-22%;
  object-fit:cover;
  will-change:transform;
}
.hero__banner::after {
  content:'';
  position:absolute; inset:0;
  background:
    linear-gradient(to top,  rgba(0,0,0,.68) 0%, rgba(0,0,0,.08) 50%, transparent 70%),
    linear-gradient(to right, rgba(0,0,0,.20) 0%, transparent 50%);
  pointer-events:none;
  z-index:1;
}
.hero__banner .img-stat-slider { z-index:2; }

/* Image stat slider — shared between hero and about images */
.img-stat-slider {
  position:absolute; bottom:0; left:0; right:0;
  height:5.5rem;
  z-index:2; pointer-events:none;
}
.img-stat-slide {
  position:absolute; bottom:1.5rem; left:2rem;
  opacity:0; transform:translateY(8px);
  transition:opacity .5s ease, transform .5s ease;
}
.img-stat-slide--active { opacity:1; transform:translateY(0); }
.img-stat-slide strong {
  display:block;
  font-size:1.6rem; font-weight:900; letter-spacing:-.03em; line-height:1;
  color:#fff;
  text-shadow:0 2px 12px rgba(0,0,0,.55);
}
.img-stat-slide span {
  font-size:.58rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(255,255,255,.8);
  text-shadow:0 1px 6px rgba(0,0,0,.45);
  margin-top:.3rem; display:block;
}
.img-stat-dots {
  position:absolute; bottom:1.65rem; right:1.5rem;
  display:flex; gap:.4rem; align-items:center;
}
.img-stat-dot {
  width:5px; height:5px; border-radius:50%;
  background:rgba(255,255,255,.3);
  transition:background .3s, transform .3s;
}
.img-stat-dot--active { background:#fff; transform:scale(1.3); }

.hero__scroll-hint {
  position:absolute; bottom:2rem; left:50%; transform:translateX(-50%);
  z-index:1;
}
.hero__scroll-hint span {
  display:block; width:24px; height:40px;
  border:2px solid var(--border-hover); border-radius:12px;
  position:relative;
}
.hero__scroll-hint span::after {
  content:''; position:absolute; top:6px; left:50%; transform:translateX(-50%);
  width:4px; height:8px; background:var(--accent-red); border-radius:2px;
  animation:scrollHint 2s ease-in-out infinite;
}
@keyframes scrollHint { 0%,100%{opacity:1;top:6px;} 50%{opacity:0;top:18px;} }


/* ── Sections ───────────────────────────────────────────────── */
.section { padding:6rem 0; }
.section--dark { background: var(--bg-secondary); }
.section--clients { padding:4rem 0; background:rgba(0,0,0,.02); }

#soluciones { background: #ffffff; }
#metodologia { background: var(--bg-secondary); }
#casos { background: #ffffff; }

.section-header { text-align:center; max-width:680px; margin:0 auto 4rem; }
.section-label {
  display:inline-flex; align-items:center; gap:.6rem; margin-bottom:.75rem;
  font-size:.68rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase;
  color: var(--accent-red);
}
.section-label::before {
  content:''; display:inline-block; width:22px; height:2px;
  background: var(--accent-red); flex-shrink:0;
}
.section-title { margin-bottom:1rem; color: var(--text-primary); }
.section-subtitle { font-size:1.05rem; line-height:1.7; color: var(--text-secondary); }

/* ── Service Pillars ────────────────────────────────────────── */
.pillars {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1.5rem; margin-bottom:4rem;
}
.pillar {
  position:relative; overflow:hidden;
  padding:2.5rem;
  border-radius: var(--radius-lg);
  border:1px solid var(--border);
  border-top:3px solid transparent;
  background: #FFFFFF;
  box-shadow: var(--shadow-sm);
  transition:border-color var(--transition), border-top-color var(--transition), transform var(--transition), box-shadow var(--transition);
}
.pillar:hover { border-color:var(--border); border-top-color:var(--accent-red); transform:translateY(-6px); box-shadow:var(--shadow-md); }
.pillar--consulting:hover { border-top-color:var(--accent-teal); }
.pillar::before {
  content:''; position:absolute; inset:0; opacity:0;
  transition:opacity var(--transition);
}
.pillar--web::before  { background:rgba(217,40,34,.03); }
.pillar--app::before  { background:rgba(17,24,39,.04); }
.pillar--consulting::before { background:rgba(21,101,192,.03); }
.pillar:hover::before { opacity:1; }

.pillar__icon {
  width:64px; height:64px; margin-bottom:1.5rem;
  display:flex; align-items:center; justify-content:center;
  border-radius: var(--radius-md);
  border:1px solid var(--border);
  background:var(--bg-secondary);
}
.pillar--web .pillar__icon        { border-color:rgba(232,77,32,.25); background:rgba(232,77,32,.06); }
.pillar--app .pillar__icon        { border-color:rgba(17,24,39,.15); background:rgba(17,24,39,.06); }
.pillar--consulting .pillar__icon { border-color:rgba(21,101,192,.25); background:rgba(21,101,192,.07); }
.pillar__icon svg { width:28px; height:28px; color: var(--accent-red); }
.pillar--app .pillar__icon svg        { color: var(--accent-dark); }
.pillar--consulting .pillar__icon svg { color: var(--accent-teal); }

.pillar h3 { font-size:1.4rem; margin-bottom:.75rem; color: var(--text-primary); }
.pillar > p { margin-bottom:1.5rem; line-height:1.7; color: var(--text-secondary); }
.pillar__list { display:flex; flex-direction:column; gap:.5rem; }
.pillar__list li {
  display:flex; align-items:center; gap:.5rem;
  font-size:.9rem; color:var(--text-secondary);
}
.pillar__list li::before { content:'→'; color:var(--accent-red); font-weight:700; font-size:.8rem; }
.pillar--app .pillar__icon + * + * + .pillar__list li::before,
.pillar--app .pillar__list li::before { color:var(--accent-dark); }
.pillar--consulting .pillar__list li::before { color:var(--accent-teal); }

/* ── Services section divider ───────────────────────────────── */
.services-section-divider {
  display:flex; align-items:center; gap:1rem;
  margin:3rem 0 2rem;
}
.services-section-divider::before,
.services-section-divider::after {
  content:''; flex:1; height:1px; background:var(--border);
}
.services-section-divider span {
  font-size:.75rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--text-muted); white-space:nowrap;
}

/* ── Service Cards ──────────────────────────────────────────── */
.services-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1.25rem;
}
.service-card {
  padding:2rem;
  border-radius: var(--radius-md);
  border:1px solid var(--border);
  background: #FFFFFF;
  box-shadow: var(--shadow-sm);
  transition:all var(--transition);
  position:relative; overflow:hidden;
}
.service-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background: var(--accent-red);
  opacity:0; transition:opacity var(--transition);
}
.service-card:hover { border-color:var(--border-hover); box-shadow:var(--shadow-md); transform:translateY(-3px); }
.service-card:hover::before { opacity:1; }

.service-card:nth-child(3n+2) .service-card__icon { background:rgba(21,101,192,.07); border-color:rgba(21,101,192,.2); }
.service-card:nth-child(3n+2) .service-card__icon svg { color:var(--accent-teal); }
.service-card:nth-child(3n+2) .service-card__subtitle { color:var(--accent-teal); }
.service-card:nth-child(3n+2)::before { background: var(--accent-teal); }

.service-card:nth-child(3n) .service-card__icon { background:rgba(240,120,32,.07); border-color:rgba(240,120,32,.2); }
.service-card:nth-child(3n) .service-card__icon svg { color:var(--accent-orange); }
.service-card:nth-child(3n) .service-card__subtitle { color:var(--accent-orange); }
.service-card:nth-child(3n)::before { background: var(--accent-orange); }

.service-card__icon {
  width:48px; height:48px; margin-bottom:1.25rem;
  display:flex; align-items:center; justify-content:center;
  border-radius:var(--radius-sm);
  background:rgba(232,77,32,.07); border:1px solid rgba(232,77,32,.15);
}
.service-card__icon svg { width:22px; height:22px; color:var(--accent-red); }
.service-card__title { font-size:1.05rem; margin-bottom:.5rem; color: var(--text-primary); }
.service-card__subtitle { font-size:.8rem; color:var(--accent-red); font-weight:600; margin-bottom:.5rem; }
.service-card__desc { font-size:.9rem; line-height:1.6; color: var(--text-secondary); }

/* ── Consulting highlight (within pillar) ───────────────────── */
.consulting-highlight {
  display:inline-flex; align-items:center; gap:.4rem;
  margin-top:1.25rem; padding:.4rem .85rem;
  border-radius:999px;
  background:rgba(21,101,192,.08);
  border:1px solid rgba(21,101,192,.18);
  font-size:.75rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  color:var(--accent-teal);
}

/* ── About ──────────────────────────────────────────────────── */
.about__content { max-width:720px; margin:0 auto 3.5rem; text-align:center; }
.about__content .section-label { text-align:center; }
.about__content .section-title { text-align:center; margin-bottom:1.5rem; }
.about__text-blocks { display:flex; flex-direction:column; gap:1.25rem; margin-bottom:2.5rem; }
.about__lead {
  font-size:1.15rem; font-weight:500; line-height:1.75;
  color: var(--text-primary);
}
.about__lead strong { color: var(--accent-red); font-weight:700; }
.about__body { font-size:.95rem; line-height:1.8; color: var(--text-secondary); }
.about__body strong { color: var(--text-primary); font-weight:700; }
.about__callout {
  background: rgba(217,40,34,.05);
  border:1px solid rgba(217,40,34,.15);
  border-radius: var(--radius-md);
  padding:1.1rem 1.5rem;
}
.about__callout p {
  font-size:.95rem; line-height:1.7;
  color: var(--text-secondary); font-style:italic;
  margin:0;
}
.about__callout strong { color: var(--accent-red); font-weight:700; font-style:normal; }
.about__values { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.value-item {
  display:flex; flex-direction:column; align-items:center; text-align:center;
  padding:2rem 1.75rem;
  border-radius:var(--radius-md);
  background:#FFFFFF; border:1px solid var(--border);
  box-shadow: var(--shadow-sm);
  position:relative; overflow:hidden;
  transition:all var(--transition);
}
.value-item::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background: var(--accent-red);
  opacity:0; transition:opacity var(--transition);
}
.value-item:hover { border-color:var(--border-hover); box-shadow:var(--shadow-md); transform:translateY(-4px); }
.value-item:hover::before { opacity:1; }
.value-item:nth-child(2) .value-item__icon { background:rgba(21,101,192,.07); border-color:rgba(21,101,192,.2); }
.value-item:nth-child(2) .value-item__icon svg { color:var(--accent-teal); }
.value-item:nth-child(2)::before { background: var(--accent-teal); }
.value-item:nth-child(3) .value-item__icon { background:rgba(240,120,32,.07); border-color:rgba(240,120,32,.2); }
.value-item:nth-child(3) .value-item__icon svg { color:var(--accent-orange); }
.value-item:nth-child(3)::before { background: var(--accent-orange); }
.value-item__icon {
  width:56px; height:56px; margin-bottom:1.25rem; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  border-radius:var(--radius-sm);
  background:rgba(217,40,34,.07); border:1px solid rgba(217,40,34,.15);
}
.value-item__icon svg { width:24px; height:24px; color:var(--accent-red); }
.value-item h4 { font-size:1rem; margin-bottom:.5rem; color: var(--text-primary); }
.value-item p  { font-size:.875rem; line-height:1.6; color: var(--text-secondary); }

/* Full-width parallax banner */
.about__banner {
  position:relative;
  height:320px;
  overflow:hidden;
}
.about__banner-img {
  position:absolute;
  width:100%; height:145%;
  top:-22%;
  object-fit:cover;
  will-change:transform;
}
.about__banner::after {
  content:'';
  position:absolute; inset:0;
  background:
    linear-gradient(to top,  rgba(0,0,0,.68) 0%, rgba(0,0,0,.08) 50%, transparent 70%),
    linear-gradient(to right, rgba(0,0,0,.20) 0%, transparent 50%);
  pointer-events:none;
  z-index:1;
}
.about__banner .img-stat-slider { z-index:2; }
#nosotros { padding-bottom:0; }

/* ── Methodology ────────────────────────────────────────────── */
.methodology-steps {
  display:grid; grid-template-columns:repeat(5,1fr);
  gap:1rem; position:relative;
}
.methodology-steps::before {
  content:''; position:absolute;
  top:48px; left:10%; right:10%; height:1px;
  background: var(--border);
  z-index:0;
}
.method-step {
  position:relative; z-index:1;
  text-align:center; padding:1.5rem 1rem;
  border-radius:var(--radius-md);
  border:1px solid var(--border);
  background:#FFFFFF;
  box-shadow: var(--shadow-sm);
  transition:all var(--transition);
}
.method-step:hover {
  border-color:var(--accent-red);
  transform:translateY(-4px);
  box-shadow:var(--shadow-md);
}
.method-step__number {
  font-size:3.5rem; font-weight:900; line-height:1; letter-spacing:-.05em;
  color: var(--accent-red);
  opacity:.9;
  margin-bottom:.75rem;
}
.method-step__icon {
  width:48px; height:48px; margin:0 auto 1rem;
  display:flex; align-items:center; justify-content:center;
  border-radius:var(--radius-sm);
  background:rgba(232,77,32,.07); border:1px solid rgba(232,77,32,.15);
}
.method-step__icon svg { width:22px; height:22px; color:var(--accent-red); }
.method-step__content h3 { font-size:.95rem; margin-bottom:.5rem; color: var(--text-primary); }
.method-step__content p { font-size:.8rem; line-height:1.5; color: var(--text-secondary); }

/* ── Client Logos Carousel ──────────────────────────────────── */
.section--clients { overflow:hidden; }

.clients-carousel {
  --logo-gap: 3.5rem;
  overflow:hidden;
  -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 10%,#000 90%,transparent 100%);
  mask-image:linear-gradient(to right,transparent 0%,#000 10%,#000 90%,transparent 100%);
}
.clients-carousel__track {
  display:flex; align-items:center;
  gap:var(--logo-gap);
  width:max-content;
  animation:clients-marquee 28s linear infinite;
}
.clients-carousel:hover .clients-carousel__track { animation-play-state:paused; }

@keyframes clients-marquee {
  from { transform:translateX(0); }
  to   { transform:translateX(-50%); }
}

.client-logo {
  flex:0 0 auto;
  display:flex; align-items:center; justify-content:center;
  padding:1.25rem 2rem;
  border-radius:var(--radius-md);
  transition:background var(--transition), transform var(--transition);
}
.client-logo:hover { background:rgba(0,0,0,.04); transform:translateY(-3px); }
.client-logo img {
  max-height:52px; max-width:140px; width:auto;
  filter:grayscale(1) opacity(.4);
  transition:filter var(--transition), transform var(--transition);
}
.client-logo:hover img { filter:grayscale(0) opacity(1); transform:scale(1.05); }
.client-logo__text {
  font-size:.85rem; font-weight:600; color:var(--text-muted);
  text-align:center; white-space:nowrap;
}

/* ── Case Studies ───────────────────────────────────────────── */
.cases-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1.5rem;
}
.case-card {
  border-radius:var(--radius-lg); overflow:hidden;
  border:1px solid var(--border);
  background:#FFFFFF;
  box-shadow: var(--shadow-sm);
  transition:all var(--transition);
}
.case-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-md); border-color:var(--border-hover); }
.case-card__image {
  height:210px; overflow:hidden;
  background: var(--bg-secondary);
  position:relative;
}
.case-card__image img { width:100%; height:100%; object-fit:cover; transition:transform var(--transition); }
.case-card:hover .case-card__image img { transform:scale(1.05); }
.case-card__image--placeholder {
  display:flex; align-items:center; justify-content:center;
}
.case-card__image--placeholder svg { width:48px; height:48px; color:var(--border-hover); }
.case-card__body { padding:1.5rem; }
.case-card__meta { display:flex; align-items:center; gap:.75rem; margin-bottom:.75rem; }
.case-card__client { font-size:.8rem; color:var(--text-muted); }
.case-card__title { font-size:1.05rem; margin-bottom:.75rem; color: var(--text-primary); }
.case-card__desc { font-size:.875rem; line-height:1.6; margin-bottom:1rem; color: var(--text-secondary); }
.case-card__result {
  display:flex; align-items:flex-start; gap:.5rem;
  padding:.75rem 1rem;
  border-radius:var(--radius-sm);
  background:rgba(21,101,192,.07); border:1px solid rgba(21,101,192,.2);
  font-size:.85rem; color:var(--accent-teal);
}
.case-card__result svg { width:16px; height:16px; flex-shrink:0; margin-top:2px; }

/* ── Contact ────────────────────────────────────────────────── */
.contact__header { margin-bottom:3rem; }
.contact__header .section-label { text-align:left; }
.contact__header .section-title { text-align:left; margin-bottom:1rem; }
.contact__subtitle { font-size:1rem; line-height:1.7; margin-bottom:0; color: var(--text-secondary); }
.contact-grid { display:grid; grid-template-columns:1fr 1.4fr; gap:5rem; align-items:stretch; }
.contact__info { display:flex; flex-direction:column; }

.contact__details {
  display:flex; flex-direction:column; gap:0; margin-top:0; margin-bottom:1rem;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  overflow:hidden;
  box-shadow: var(--shadow-sm);
  background:#FFFFFF;
}
.contact__detail {
  display:flex; gap:1rem; align-items:center;
  padding:.875rem 1.25rem;
  border-bottom:1px solid var(--border);
}
.contact__detail:last-child { border-bottom:none; }
.contact__detail-icon {
  width:38px; height:38px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  border-radius:var(--radius-sm);
  background:rgba(232,77,32,.07); border:1px solid rgba(232,77,32,.15);
}
.contact__detail-icon svg { width:18px; height:18px; color:var(--accent-red); }
.contact__detail strong { display:block; font-size:.8rem; color:var(--text-muted); margin-bottom:.1rem; }
.contact__detail a, .contact__detail span { font-size:.95rem; color: var(--text-primary); }
.contact__detail a:hover { color:var(--accent-red); }

/* Contact map */
.contact__map {
  position:relative;
  flex:1; min-height:160px;
  border-radius:var(--radius-md);
  overflow:hidden;
  border:1px solid var(--border);
  margin-bottom:0;
}
.contact__map iframe {
  width:100%; height:100%; border:none; display:block;
}
.contact__map-pin {
  position:absolute; top:50%; left:50%;
  transform:translate(-50%, -100%) translateY(-4px);
  z-index:10; pointer-events:none;
  width:36px; height:36px;
  background:#fff;
  border-radius:50%;
  border:2px solid var(--accent-red);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 2px 8px rgba(0,0,0,.3);
}
.contact__map-pin img { width:20px; height:20px; object-fit:contain; }
.contact__map-pin::after {
  content:'';
  position:absolute; bottom:-9px; left:50%;
  transform:translateX(-50%);
  width:0; height:0;
  border-left:5px solid transparent;
  border-right:5px solid transparent;
  border-top:9px solid var(--accent-red);
}

/* Contact social buttons */
.contact__social { display:flex; gap:.75rem; flex-wrap:wrap; margin-top:1.25rem; }
.btn--whatsapp {
  background:#25D366; color:#fff;
  border:2px solid #25D366;
}
.btn--whatsapp:hover { background:#1ebe59; border-color:#1ebe59; }

/* Section CTA blocks */
.section-cta-block {
  margin-top:3rem; padding:2.5rem;
  background:var(--bg-secondary);
  border-radius:var(--radius-lg);
  border:1px solid var(--border);
  text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:1.25rem;
}
.section-cta-block--dark {
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.1);
}
.section-cta-block--dark .section-cta-block__text { color:rgba(255,255,255,.85); }
.section-cta-block__text {
  font-size:1.15rem; font-weight:600;
  color:var(--text-primary);
  max-width:600px;
}

/* Contact form */
.contact__form-wrap {
  background:#FFFFFF;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:2rem;
  box-shadow: var(--shadow-md);
}
.contact-form .form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-group { margin-bottom:1rem; }
.form-group label {
  display:block; font-size:.85rem; font-weight:500; margin-bottom:.4rem;
  color:var(--text-secondary);
}
.form-group input,
.form-group select,
.form-group textarea {
  width:100%; padding:.75rem 1rem;
  background:#FAFAFA;
  border:1.5px solid var(--border);
  border-radius:var(--radius-sm);
  color:var(--text-primary);
  font-size:.95rem;
  transition:border-color var(--transition), box-shadow var(--transition);
}
.form-group input::placeholder,
.form-group textarea::placeholder { color:var(--text-muted); }
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  outline:none;
  border-color:var(--accent-red);
  box-shadow:0 0 0 3px rgba(232,77,32,.1);
}
.form-group select { cursor:pointer; background:#FAFAFA; }
.form-group select option { background:#FFFFFF; color: var(--text-primary); }

.form-submit { margin-top:1.25rem; }
.form-feedback {
  margin-top:1rem; padding:1rem;
  border-radius:var(--radius-sm);
  font-size:.9rem; text-align:center;
}
.form-feedback.success { background:rgba(21,101,192,.08); color:var(--accent-teal); border:1px solid rgba(21,101,192,.2); }
.form-feedback.error   { background:rgba(232,77,32,.07); color:var(--accent-red); border:1px solid rgba(232,77,32,.2); }

.g-recaptcha { margin-bottom:.5rem; }

/* ── Footer ─────────────────────────────────────────────────── */
.site-footer {
  background: var(--bg-secondary);
  border-top:1px solid var(--border);
  padding:5rem 0 2rem;
}
.footer__grid { display:grid; grid-template-columns:2fr 1fr 1fr 1.5fr; gap:3rem; margin-bottom:4rem; }
.footer__logo { display:flex; align-items:center; gap:.75rem; font-size:1.1rem; font-weight:500; margin-bottom:1rem; color: var(--text-primary); }
.footer__logo img { border-radius:8px;  }
.footer__logo strong { font-weight:900; color:var(--accent-red); }
.footer__tagline { font-size:.875rem; line-height:1.6; margin-bottom:1.5rem; color: var(--text-secondary); }
.footer__social { display:flex; gap:.75rem; }
.footer__social a {
  width:38px; height:38px;
  display:flex; align-items:center; justify-content:center;
  border-radius:var(--radius-sm);
  border:1px solid var(--border);
  color:var(--text-muted);
  transition:all var(--transition);
}
.footer__social a svg { width:16px; height:16px; }
.footer__social a:hover { border-color:var(--accent-red); color:var(--accent-red); background:rgba(232,77,32,.06); }
.footer__social--whatsapp:hover { border-color:#25D366 !important; color:#25D366 !important; background:rgba(37,211,102,.06) !important; }

.footer__heading { font-size:.85rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; margin-bottom:1.25rem; color:var(--text-secondary); }
.footer__links { display:flex; flex-direction:column; gap:.6rem; }
.footer__links a { font-size:.875rem; color:var(--text-muted); transition:color var(--transition); }
.footer__links a:hover { color:var(--accent-red); }
.footer__contact-list { display:flex; flex-direction:column; gap:.75rem; }
.footer__contact-list li { display:flex; align-items:center; gap:.6rem; font-size:.875rem; color:var(--text-muted); }
.footer__contact-list svg { width:14px; height:14px; flex-shrink:0; }
.footer__contact-list a:hover { color:var(--accent-red); }

.footer__bottom {
  display:flex; align-items:center; justify-content:space-between;
  padding-top:2rem; border-top:1px solid var(--border);
  font-size:.8rem; color:var(--text-muted);
}
.footer__legal { display:flex; gap:1.5rem; }
.footer__legal a:hover { color:var(--accent-red); }

/* ── CTA Banner ─────────────────────────────────────────────── */
.section--cta-banner { padding:0; }
.cta-banner {
  position:relative; overflow:hidden;
  padding:6rem 0;
}
.cta-banner__bg {
  position:absolute; inset:0; z-index:0;
  background: #D92822;
}
.cta-banner__bg::after { display:none; }
.cta-banner__inner {
  position:relative; z-index:1;
  display:grid; grid-template-columns:1fr auto;
  gap:4rem; align-items:center;
}
.cta-banner__label {
  display:inline-block; margin-bottom:.75rem;
  font-size:.7rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase;
  color:rgba(255,255,255,.6);
}
.cta-banner__title {
  font-size:clamp(2rem,4vw,3.2rem);
  font-weight:900; letter-spacing:-.04em; line-height:1.1;
  color:#fff; margin-bottom:1rem;
}
.cta-banner__sub {
  font-size:1.05rem; line-height:1.7;
  color:rgba(255,255,255,.75); margin-bottom:2rem;
}
.cta-banner__actions { display:flex; gap:1rem; flex-wrap:wrap; }

.btn--white {
  background:#fff; color:var(--accent-red);
  box-shadow:0 4px 20px rgba(0,0,0,.2);
}
.btn--white:hover { background:#fff; box-shadow:0 6px 28px rgba(0,0,0,.3); transform:translateY(-1px); }
.btn--outline-white {
  background:transparent; color:#fff;
  border:1.5px solid rgba(255,255,255,.45);
}
.btn--outline-white:hover { border-color:#fff; background:rgba(255,255,255,.1); }

.cta-banner__stats {
  display:flex; flex-direction:column; gap:2rem;
  padding:2.5rem 3rem;
  border-radius:var(--radius-xl);
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.15);
  flex-shrink:0;
}
.cta-banner__stat { text-align:center; }
.cta-banner__stat strong {
  display:block; font-size:2.2rem; font-weight:900; color:#fff; line-height:1;
}
.cta-banner__stat span { font-size:.8rem; color:rgba(255,255,255,.65); margin-top:.25rem; display:block; }

/* ── Cookie Banner ──────────────────────────────────────────── */
.cookie-banner {
  position:fixed; bottom:1.5rem; left:1.5rem; right:1.5rem; z-index:9999;
  max-width:700px; margin:0 auto;
  background:rgba(255,255,255,.97);
  backdrop-filter:blur(20px);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:1.5rem;
  box-shadow:var(--shadow-lg);
  transform:translateY(200%);
  transition:transform .4s cubic-bezier(.4,0,.2,1), opacity .4s;
  opacity:0;
}
.cookie-banner.visible { transform:translateY(0); opacity:1; }
.cookie-banner__inner { display:flex; align-items:center; gap:1.5rem; }
.cookie-banner__icon { color:var(--accent-red); flex-shrink:0; }
.cookie-banner__text { flex:1; font-size:.875rem; color: var(--text-secondary); }
.cookie-banner__text a { color:var(--accent-red); text-decoration:underline; }
.cookie-banner__actions { display:flex; gap:.75rem; flex-shrink:0; }

/* ── Pulse glow on primary CTA ──────────────────────────────── */
@keyframes pulse-glow {
  0%,100% { box-shadow: 0 2px 8px rgba(217,40,34,.20); }
  50%      { box-shadow: 0 4px 20px rgba(217,40,34,.40); }
}
.btn--primary.btn--lg:not(:hover) { animation: pulse-glow 3s ease-in-out infinite; }

/* ── Number counter ─────────────────────────────────────────── */
.count-up { display:inline; }

/* ── Reveal animations ──────────────────────────────────────── */
.reveal {
  opacity:0;
  transform:translateY(24px);
  transition:opacity .6s ease, transform .6s ease;
  transition-delay:var(--delay, 0s);
}
.reveal.visible { opacity:1; transform:translateY(0); }

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width:1024px) {
  .hero__content { max-width:100%; }
  .hero__banner { height:200px; }
  .pillars { grid-template-columns:1fr 1fr; }
  .services-grid { grid-template-columns:repeat(2,1fr); }
  .about__values { grid-template-columns:1fr; }
  .about__banner { height:240px; }

  .contact-grid { grid-template-columns:1fr; gap:3rem; }
  .footer__grid { grid-template-columns:1fr 1fr; }
  .methodology-steps { grid-template-columns:repeat(3,1fr); }
  .methodology-steps::before { display:none; }
  .cases-grid { grid-template-columns:repeat(2,1fr); }
  .cta-banner__inner { grid-template-columns:1fr; gap:2.5rem; }
  .cta-banner__stats { flex-direction:row; justify-content:center; padding:2rem; }
}

@media (max-width:768px) {
  :root { --nav-h:64px; --header-h:0px; }
  .top-bar { display:none; }

  .main-nav__toggle { display:flex; }
  .main-nav__menu {
    position:fixed; inset:0; top:var(--nav-h);
    background-color:#ffffff;
    z-index:1000;
    display:flex; flex-direction:column; align-items:stretch;
    justify-content:flex-start;
    gap:0;
    padding:0;
    transform:translateX(100%);
    transition:transform var(--transition);
    border-top:1px solid var(--border);
    height:calc(100vh - var(--nav-h));
    overflow-y:auto;
  }
  .main-nav__menu.open { transform:translateX(0); }
  /* Nav items distributed evenly across full height */
  .main-nav__menu > li:not(.nav-mobile-extras) {
    flex:1; display:flex; align-items:center; justify-content:center;
  }
  .nav-link {
    font-size:1.2rem; font-weight:600;
    padding:0 2rem; width:100%; height:100%;
    display:flex; align-items:center; justify-content:center;
    color:var(--text-primary); letter-spacing:.01em;
  }
  .nav-link--cta { margin-left:0; border:none !important; }
  .main-nav__language-selector { display:none; }

  /* Mobile extras: lang switcher + social */
  .nav-mobile-extras {
    display:flex; flex-direction:column; align-items:center;
    gap:1.25rem; width:100%; padding:1.5rem 1rem;
  }
  .nav-mobile-lang {
    display:flex; gap:.5rem;
  }
  .nav-mobile-lang a {
    padding:.45rem 1rem; border-radius:var(--radius-sm);
    font-size:.9rem; font-weight:600;
    color:var(--text-secondary); border:1px solid var(--border);
    transition:color var(--transition), background var(--transition), border-color var(--transition);
  }
  .nav-mobile-lang a.active,
  .nav-mobile-lang a:hover { color:var(--accent-red); border-color:var(--accent-red); background:rgba(217,40,34,.06); }
  .nav-mobile-social {
    display:flex; gap:.75rem;
  }
  .nav-mobile-social a {
    display:flex; align-items:center; gap:.5rem;
    padding:.6rem 1.25rem; border-radius:var(--radius-sm);
    font-size:.875rem; font-weight:500;
    border:1px solid var(--border); color:var(--text-secondary);
    transition:color var(--transition), background var(--transition), border-color var(--transition);
  }
  .nav-mobile-social a:hover { color:var(--accent-red); border-color:var(--accent-red); background:rgba(217,40,34,.06); }
  .nav-mobile-social a.whatsapp:hover { color:#25D366; border-color:#25D366; background:rgba(37,211,102,.06); }

  .hero__stats { gap:1.5rem; }
  .services-grid { grid-template-columns:1fr; }
  .pillars { grid-template-columns:1fr; }
  .methodology-steps { grid-template-columns:1fr 1fr; }
  .cases-grid { grid-template-columns:1fr; }
  .footer__grid { grid-template-columns:1fr; gap:2rem; }
  .footer__bottom { flex-direction:column; gap:1rem; text-align:center; }

  .contact__form-wrap { padding:1.5rem; }
  .contact-form .form-row { grid-template-columns:1fr; }

  .hero__banner { height:160px; }
  .about__banner { height:200px; }
  .cta-banner__stats { flex-direction:column; gap:1.5rem; align-items:center; }
  .cta-banner__actions { flex-direction:column; }
  .cta-banner__actions .btn { width:100%; justify-content:center; }

  .cookie-banner { left:.75rem; right:.75rem; bottom:.75rem; }
  .cookie-banner__inner { flex-direction:column; align-items:flex-start; }

}

@media (max-width:480px) {
  .methodology-steps { grid-template-columns:1fr; }
  .hero__cta { flex-direction:column; }
  .hero__cta .btn { width:100%; justify-content:center; }
}