/* ═══════════════════════════════════════════════
   AGENCY BRAND UP v3 — Multi-Page Site
   DM Serif Display · DM Sans
   #0A0A0A · #C9A84C · #FAFAF8
═══════════════════════════════════════════════ */
:root {
  --black:   #0A0A0A;
  --black2:  #111111;
  --black3:  #181818;
  --black4:  #222222;
  --gold:    #C9A84C;
  --gold-lt: #E0C06A;
  --white:   #FAFAF8;
  --w70:     rgba(250,250,248,.70);
  --w40:     rgba(250,250,248,.40);
  --w10:     rgba(250,250,248,.06);
  --serif:   'DM Serif Display', serif;
  --sans:    'DM Sans', sans-serif;
  --ease:    cubic-bezier(.4,0,.2,1);
  --nav-h:   72px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--sans);font-size:17px;line-height:1.75;background:var(--black);color:var(--white);overflow-x:hidden}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
button{cursor:pointer;border:none;background:none;font-family:inherit}
strong{font-weight:600}
ul{list-style:none}

/* ── Container ── */
.container{max-width:1160px;margin:0 auto;padding:0 2rem}
.section{padding:5rem 0}
.section-dark{background:var(--black2);border-top:1px solid rgba(201,168,76,.07);border-bottom:1px solid rgba(201,168,76,.07)}

/* ── Helpers ── */
.gold{color:var(--gold)}
.gold-italic{color:var(--gold);font-style:italic;font-family:var(--serif)}
.tag{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:3.5px;text-transform:uppercase;color:var(--gold);margin-bottom:.9rem}
.section-h{font-family:var(--serif);font-size:clamp(2rem,4vw,3rem);font-weight:400;line-height:1.15;margin-bottom:.8rem}
.section-p{font-size:1.05rem;color:var(--w70);line-height:1.75;max-width:600px}
.center{text-align:center}.center .section-p{margin:0 auto}

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

/* ══════ BUTTONS ══════ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;font-family:var(--sans);font-weight:700;font-size:.82rem;letter-spacing:1.5px;text-transform:uppercase;padding:.85rem 2rem;transition:.25s var(--ease);white-space:nowrap;border:2px solid transparent;cursor:pointer}
.btn-gold{background:var(--gold);color:var(--black);border-color:var(--gold)}
.btn-gold:hover{background:var(--gold-lt);border-color:var(--gold-lt)}
.btn-outline{background:transparent;color:var(--white);border-color:rgba(201,168,76,.35)}
.btn-outline:hover{border-color:var(--gold);color:var(--gold)}
.btn-ghost{background:var(--w10);color:var(--white);border-color:rgba(255,255,255,.1)}
.btn-ghost:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2)}
.btn-wa{background:var(--gold);color:var(--black);border-color:var(--gold)}
.btn-wa:hover{background:var(--gold-lt)}
.btn-wa-dark{background:rgba(201,168,76,.08);color:var(--white);border-color:rgba(201,168,76,.2)}
.btn-wa-dark:hover{background:rgba(201,168,76,.15);border-color:var(--gold)}
.btn svg{width:17px;height:17px;flex-shrink:0}

/* WA icon path */
.ico-wa path{fill:currentColor}

/* ══════ HEADER / NAV ══════ */
#header{position:fixed;top:0;left:0;right:0;z-index:1000;height:var(--nav-h);display:flex;align-items:center;transition:background .35s,box-shadow .35s}
#header.scrolled{background:rgba(10,10,10,.97);backdrop-filter:blur(16px);box-shadow:0 1px 0 rgba(201,168,76,.1)}
.header-inner{width:100%;max-width:1160px;margin:0 auto;padding:0 2rem;display:flex;align-items:center;gap:1.5rem}

/* Logo */
.logo{display:flex;align-items:center;gap:.7rem;flex-shrink:0}
.logo-icon{width:32px;height:32px}
.logo-text{display:flex;flex-direction:column;line-height:1.05}
.logo-main{font-size:.65rem;font-weight:700;letter-spacing:4px;color:var(--white)}
.logo-sub{font-size:.65rem;font-weight:700;letter-spacing:4px;color:var(--gold)}

/* Nav */
.nav{display:flex;align-items:center;gap:0;margin-left:auto}

/* Dropdown wrapper */
.nav-item{position:relative}
.nav-link{font-size:.82rem;font-weight:500;letter-spacing:.3px;color:var(--w70);padding:.5rem .9rem;display:flex;align-items:center;gap:.3rem;transition:color .2s;white-space:nowrap}
.nav-link:hover,.nav-link.active{color:var(--gold)}
.nav-link svg{width:10px;height:10px;transition:transform .2s}
.nav-item:hover .nav-link svg{transform:rotate(180deg)}

/* Dropdown menu */
.dropdown{position:absolute;top:calc(100% + .5rem);left:50%;transform:translateX(-50%);background:rgba(17,17,17,.98);backdrop-filter:blur(20px);border:1px solid rgba(201,168,76,.12);min-width:240px;opacity:0;visibility:hidden;transform:translateX(-50%) translateY(-8px);transition:opacity .25s var(--ease),transform .25s var(--ease),visibility .25s}
.nav-item:hover .dropdown{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.dropdown a{display:flex;align-items:center;gap:.7rem;padding:.85rem 1.4rem;font-size:.88rem;color:var(--w70);transition:color .2s,background .2s;border-bottom:1px solid rgba(255,255,255,.04)}
.dropdown a:last-child{border-bottom:none}
.dropdown a:hover{color:var(--white);background:rgba(201,168,76,.05)}
.dropdown a span{font-size:.85rem;opacity:.6}

/* Nav CTA & Lang */
.nav-cta{background:var(--gold);color:var(--black)!important;font-weight:700;font-size:.78rem;letter-spacing:1.5px;text-transform:uppercase;padding:.55rem 1.3rem;margin-left:.8rem;transition:background .2s}
.nav-cta:hover{background:var(--gold-lt)}
.lang{display:flex;align-items:center;gap:.2rem;margin-left:.8rem;flex-shrink:0}
.lang-btn{font-size:.72rem;font-weight:700;letter-spacing:1.5px;color:var(--w40);padding:.3rem .35rem;transition:color .2s}
.lang-btn:hover{color:var(--w70)}
.lang-btn.on{color:var(--gold)}
.lang-div{color:rgba(201,168,76,.2);font-size:.65rem}

/* Burger */
.burger{display:none;flex-direction:column;gap:5px;margin-left:auto;z-index:1001;padding:.4rem}
.burger span{display:block;width:22px;height:1.5px;background:var(--white);transition:.3s var(--ease)}
.burger.open span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

/* Mobile nav */
.mobile-nav{position:fixed;inset:0;background:rgba(10,10,10,.99);z-index:999;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0;transform:translateX(100%);transition:transform .4s var(--ease)}
.mobile-nav.open{transform:none}
.mobile-nav a{font-size:1.3rem;font-weight:500;color:var(--w70);padding:1rem 2rem;transition:color .2s;width:100%;text-align:center;border-bottom:1px solid rgba(255,255,255,.04)}
.mobile-nav a:hover{color:var(--gold)}
.mobile-nav .mobile-sub{font-size:.85rem;color:var(--w40);padding:.6rem 2rem;background:rgba(255,255,255,.02);border-bottom:1px solid rgba(255,255,255,.03)}
.mobile-nav .mobile-sub:hover{color:var(--w70)}
.mobile-nav .m-cta{margin-top:1.5rem;background:var(--gold);color:var(--black)!important;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;font-size:.85rem;padding:1rem 2.5rem;border-bottom:none}
.mobile-lang{display:flex;gap:1rem;margin-top:1.5rem;padding:1rem}
.mobile-lang button{font-size:.85rem;font-weight:700;letter-spacing:2px;color:var(--w40);background:none;border:none;cursor:pointer}
.mobile-lang button.on{color:var(--gold)}

/* Page offset for fixed header */
.page-content{padding-top:var(--nav-h)}

/* ══════ PAGE HERO (inner pages) ══════ */
.page-hero{padding:4.5rem 0 3.5rem;background:var(--black2);border-bottom:1px solid rgba(201,168,76,.08);position:relative;overflow:hidden}
.page-hero::before{content:'';position:absolute;top:0;right:0;width:600px;height:100%;background:radial-gradient(ellipse at 80% 50%,rgba(201,168,76,.06) 0%,transparent 60%);pointer-events:none}
.page-hero .tag{display:block}
.page-hero h1{font-family:var(--serif);font-size:clamp(2.2rem,5vw,3.8rem);font-weight:400;line-height:1.1;margin-bottom:1rem}
.page-hero p{font-size:1.1rem;color:var(--w70);max-width:560px;line-height:1.75}
.breadcrumb{display:flex;align-items:center;gap:.5rem;font-size:.78rem;color:var(--w40);margin-bottom:1.5rem}
.breadcrumb a{color:var(--w40);transition:color .2s}
.breadcrumb a:hover{color:var(--gold)}
.breadcrumb span{color:rgba(201,168,76,.4)}

/* ══════ HOME HERO ══════ */
.home-hero{min-height:100vh;display:flex;align-items:center;padding-top:var(--nav-h);position:relative;overflow:hidden}
.hero-bg{position:absolute;inset:0;pointer-events:none}
.hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(201,168,76,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(201,168,76,.03) 1px,transparent 1px);background-size:60px 60px}
.hero-glow{position:absolute;top:20%;right:10%;width:600px;height:600px;background:radial-gradient(circle,rgba(201,168,76,.07) 0%,transparent 65%);border-radius:50%}
.home-hero .container{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;position:relative;z-index:1}
.hero-badge{display:inline-flex;align-items:center;gap:.65rem;font-size:.75rem;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--gold);border:1px solid rgba(201,168,76,.2);padding:.4rem 1rem;margin-bottom:1.8rem}
.badge-dot{width:6px;height:6px;background:var(--gold);border-radius:50%;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.2}}
.hero-h1{font-family:var(--serif);font-size:clamp(3rem,5.5vw,5rem);font-weight:400;line-height:1.08;margin-bottom:1.5rem}
.hero-sub{font-size:1.1rem;color:var(--w70);max-width:480px;line-height:1.75;margin-bottom:2.5rem}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:3.5rem}
.hero-stats{display:flex;align-items:center;gap:2.5rem;flex-wrap:wrap}
.stat-n{display:block;font-family:var(--serif);font-size:2.2rem;color:var(--gold);line-height:1}
.stat-l{font-size:.8rem;color:var(--w40);margin-top:.2rem;line-height:1.4}
.stat-div{width:1px;height:40px;background:rgba(201,168,76,.15)}

/* Hero visual */
.hero-visual{position:relative;display:flex;align-items:center;justify-content:center;height:400px}
.hv-ring{position:absolute;border-radius:50%;border:1px solid rgba(201,168,76,.12)}
.ring-1{width:360px;height:360px;animation:spin 28s linear infinite}
.ring-2{width:240px;height:240px;animation:spin 20s linear infinite reverse}
@keyframes spin{to{transform:rotate(360deg)}}
.hv-center{position:relative;width:130px;height:130px;display:flex;align-items:center;justify-content:center}
.hv-svg{width:100%;height:100%}
.hv-label{position:absolute;font-family:var(--sans);font-weight:700;font-size:1rem;letter-spacing:6px;color:var(--gold)}
.chip{position:absolute;background:rgba(17,17,17,.95);border:1px solid rgba(201,168,76,.18);padding:.55rem 1.1rem;font-size:.8rem;font-weight:500;color:var(--w70);white-space:nowrap}
.chip-1{top:8%;left:0;animation:bob 4s ease-in-out infinite}
.chip-2{bottom:20%;left:-5%;animation:bob 5s ease-in-out infinite .5s}
.chip-3{top:38%;right:-5%;animation:bob 4.5s ease-in-out infinite 1s}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* ══════ CLIENTS BAR ══════ */
.clients-bar{background:var(--black2);border-top:1px solid rgba(201,168,76,.06);border-bottom:1px solid rgba(201,168,76,.06);padding:1.8rem 0;overflow:hidden}
.clients-label{text-align:center;font-size:.7rem;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--w40);margin-bottom:1.2rem}
.marquee{overflow:hidden}
.marquee-track{display:flex;align-items:center;gap:2rem;white-space:nowrap;animation:marquee 30s linear infinite}
.marquee-track span{font-size:.8rem;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--w40);flex-shrink:0}
.marquee-track .dot{color:var(--gold);font-size:.35rem}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ══════ SERVICES GRID (home) ══════ */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(201,168,76,.07);margin-top:3rem}
.svc-card{background:var(--black);padding:2.2rem;transition:background .3s;position:relative}
.svc-card:hover{background:var(--black3)}
.svc-card::after{content:'';position:absolute;inset:0;border:1px solid transparent;pointer-events:none;transition:border-color .3s}
.svc-card:hover::after{border-color:rgba(201,168,76,.15)}
.svc-num{font-size:.65rem;font-weight:700;letter-spacing:3px;color:var(--gold);margin-bottom:1.2rem}
.svc-ico{font-size:1.5rem;margin-bottom:.9rem;line-height:1;display:block}
.svc-card h3{font-family:var(--sans);font-size:1.1rem;font-weight:700;margin-bottom:.65rem}
.svc-card p{font-size:.95rem;color:var(--w70);line-height:1.7;margin-bottom:1.4rem}
.svc-card ul{margin-bottom:1.5rem}
.svc-card ul li{font-size:.9rem;color:var(--w70);padding:.35rem 0;border-bottom:1px solid rgba(255,255,255,.04);display:flex;align-items:center;gap:.5rem}
.svc-card ul li::before{content:'◆';color:var(--gold);font-size:.4rem;flex-shrink:0}
.svc-link{font-size:.82rem;font-weight:600;color:var(--gold);display:inline-flex;align-items:center;gap:.3rem;transition:gap .2s}
.svc-link:hover{gap:.6rem}

/* ══════ PROCESS STEPS ══════ */
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:0;background:rgba(201,168,76,.06);margin:3rem 0}
.step{background:var(--black2);padding:1.8rem 1.4rem;text-align:center;border-right:1px solid rgba(201,168,76,.06)}
.step:last-child{border-right:none}
.step-n{font-family:var(--serif);font-size:2.5rem;color:rgba(201,168,76,.1);line-height:1;margin-bottom:.8rem}
.step h3{font-size:.95rem;font-weight:700;margin-bottom:.5rem}
.step p{font-size:.85rem;color:var(--w70);line-height:1.6}

/* ══════ CONSULTING CARDS ══════ */
.co-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(201,168,76,.07)}
.co-card{background:var(--black);padding:2.4rem;transition:background .3s;position:relative}
.co-card.featured{background:rgba(201,168,76,.025);border-top:3px solid var(--gold)}
.co-badge{position:absolute;top:-1px;right:1.8rem;background:var(--gold);color:var(--black);font-size:.62rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:.22rem .7rem}
.co-tag{font-size:.65rem;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--gold);margin-bottom:.7rem}
.co-price{font-family:var(--serif);font-size:2.6rem;font-weight:400;color:var(--gold);line-height:1;margin-bottom:.8rem}
.co-price sub{font-family:var(--sans);font-size:.85rem;color:var(--w40);font-style:normal}
.co-card h3{font-family:var(--sans);font-size:1.15rem;font-weight:700;margin-bottom:.7rem}
.co-card>p{font-size:.97rem;color:var(--w70);line-height:1.7;margin-bottom:1.4rem}
.co-list li{font-size:.92rem;color:var(--w70);padding:.4rem 0;border-bottom:1px solid rgba(255,255,255,.04);display:flex;align-items:flex-start;gap:.5rem}
.co-list li::before{content:'✓';color:var(--gold);font-size:.85rem;flex-shrink:0;margin-top:.1rem}
.co-list{margin-bottom:1.8rem}

/* ══════ PLANS ══════ */
.plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(201,168,76,.07)}
.plan-card{background:var(--black);padding:2.2rem;position:relative;transition:background .3s}
.plan-card.pop{background:rgba(201,168,76,.025);border-top:3px solid var(--gold)}
.plan-crown{font-size:.65rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin-bottom:.6rem}
.plan-name{font-size:.72rem;font-weight:700;letter-spacing:4px;text-transform:uppercase;color:var(--gold);margin-bottom:.2rem}
.plan-desc{font-size:.88rem;color:var(--w70);margin-bottom:.9rem}
.plan-price{font-family:var(--serif);font-size:2.6rem;font-weight:400;color:var(--white);line-height:1;margin-bottom:.3rem}
.plan-price sub{font-family:var(--sans);font-size:.85rem;color:var(--w40)}
.plan-features{margin:1.4rem 0 1.8rem}
.plan-features li{font-size:.9rem;padding:.45rem 0;border-bottom:1px solid rgba(255,255,255,.04);display:flex;align-items:flex-start;gap:.5rem;line-height:1.4}
.plan-features li::before{flex-shrink:0;margin-top:.1rem;font-size:.85rem}
.plan-features li.yes{color:var(--white)}
.plan-features li.yes::before{content:'✓';color:var(--gold)}
.plan-features li.no{color:var(--w40)}
.plan-features li.no::before{content:'—';color:rgba(255,255,255,.15)}
.plan-note{text-align:center;font-size:.82rem;color:var(--w40);margin-top:1.5rem;padding:1rem;border-top:1px solid rgba(201,168,76,.07)}

/* ══════ BRAND PERSONAL LEVELS ══════ */
.bp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:2.5rem}
.bp-card{background:var(--black3);border:1px solid rgba(201,168,76,.1);padding:2.2rem;transition:border-color .3s}
.bp-card:hover{border-color:rgba(201,168,76,.3)}
.bp-card.feat{border-color:rgba(201,168,76,.35);background:rgba(201,168,76,.02)}
.bp-lvl{font-family:var(--serif);font-size:2.4rem;color:rgba(201,168,76,.12);line-height:1;margin-bottom:.7rem}
.bp-card h3{font-size:1.05rem;font-weight:700;margin-bottom:.6rem}
.bp-card>p{font-size:.92rem;color:var(--w70);margin-bottom:1.2rem;line-height:1.65}
.bp-card ul li{font-size:.88rem;color:var(--w70);padding:.4rem 0;border-bottom:1px solid rgba(255,255,255,.04);display:flex;align-items:center;gap:.5rem}
.bp-card ul li::before{content:'◆';color:var(--gold);font-size:.4rem;flex-shrink:0}
.bp-card ul{margin-bottom:1.5rem}

/* ══════ NOSOTROS ══════ */
.nos-grid{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:start}
.nos-reasons{border:1px solid rgba(201,168,76,.1)}
.nr{display:flex;gap:1.2rem;align-items:flex-start;padding:1.4rem 1.8rem;border-bottom:1px solid rgba(201,168,76,.06);transition:background .2s}
.nr:last-child{border-bottom:none}
.nr:hover{background:rgba(201,168,76,.025)}
.nr-n{font-family:var(--serif);font-size:1.8rem;color:rgba(201,168,76,.18);line-height:1;flex-shrink:0;width:38px}
.nr strong{display:block;font-size:.95rem;font-weight:700;margin-bottom:.25rem}
.nr p{font-size:.9rem;color:var(--w70);line-height:1.6}
.manifesto{margin-top:2rem;display:flex;flex-direction:column;gap:.8rem}
.manifesto div{display:flex;align-items:center;gap:.7rem;font-size:.95rem;font-weight:500;color:var(--w70)}
.manifesto div::before{content:'◆';color:var(--gold);font-size:.4rem;flex-shrink:0}

/* ══════ CONTACT ══════ */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
.contact-links{display:flex;flex-direction:column;gap:.75rem;margin:1.5rem 0 2rem}
.contact-links a{font-size:1rem;color:var(--w70);display:flex;align-items:center;gap:.65rem;transition:color .2s}
.contact-links a:hover{color:var(--gold)}
.form-box{background:var(--black3);border:1px solid rgba(201,168,76,.1);padding:2.5rem}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.fg{margin-bottom:1.2rem}
.fg label{display:block;font-size:.72rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--w40);margin-bottom:.45rem}
.fg input,.fg select,.fg textarea{width:100%;background:rgba(255,255,255,.03);border:1px solid rgba(201,168,76,.12);color:var(--white);font-family:var(--sans);font-size:.97rem;padding:.8rem 1rem;outline:none;transition:border-color .2s;-webkit-appearance:none;border-radius:0}
.fg input::placeholder,.fg textarea::placeholder{color:rgba(250,250,248,.2)}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:rgba(201,168,76,.45)}
.fg select option{background:var(--black2)}
.fg textarea{resize:vertical;min-height:110px}
.form-note{font-size:.8rem;color:var(--w40);text-align:center;margin-top:.9rem}

/* ══════ FAQ ══════ */
.faq-list{max-width:800px;margin:2.5rem auto 0}
.faq{border-bottom:1px solid rgba(201,168,76,.08)}
.faq-q{width:100%;text-align:left;padding:1.3rem 0;font-size:1rem;font-weight:600;color:var(--white);display:flex;justify-content:space-between;align-items:center;gap:1rem;transition:color .2s}
.faq-q:hover,.faq-q.open{color:var(--gold)}
.faq-chevron{width:16px;height:16px;color:var(--gold);flex-shrink:0;transition:transform .3s}
.faq-q.open .faq-chevron{transform:rotate(180deg)}
.faq-a{font-size:.97rem;color:var(--w70);line-height:1.75;max-height:0;overflow:hidden;transition:max-height .4s ease,padding .3s}
.faq-a.open{max-height:300px;padding-bottom:1.3rem}

/* ══════ PORTFOLIO ══════ */
.clients-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:rgba(201,168,76,.06)}
.client-cell{background:var(--black);padding:1.2rem;text-align:center;font-size:.78rem;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--w40);transition:color .2s,background .2s}
.client-cell:hover{color:var(--gold);background:var(--black3)}

/* ══════ FINAL CTA ══════ */
.final-cta{padding:7rem 0;text-align:center;position:relative;overflow:hidden}
.fca-glow{position:absolute;inset:0;background:radial-gradient(ellipse at 30% 50%,rgba(201,168,76,.07),transparent 60%),radial-gradient(ellipse at 70% 50%,rgba(201,168,76,.05),transparent 60%)}
.fca-inner{position:relative;z-index:1}
.fca-inner h2{font-family:var(--serif);font-size:clamp(2.4rem,5vw,4rem);font-weight:400;line-height:1.1;margin-bottom:1rem}
.fca-inner p{font-size:1.05rem;color:var(--w70);margin-bottom:2.5rem}
.fca-btns{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

/* ══════ FOOTER ══════ */
footer{background:var(--black2);border-top:1px solid rgba(201,168,76,.1);padding:4rem 0 0}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:3rem;padding-bottom:3rem;border-bottom:1px solid rgba(201,168,76,.07)}
.footer-brand p{font-size:.92rem;color:var(--w70);max-width:240px;margin:1rem 0 1.5rem;line-height:1.65}
.footer-socials{display:flex;gap:.6rem}
.footer-socials a{font-size:.65rem;font-weight:700;letter-spacing:2px;color:var(--w70);border:1px solid rgba(201,168,76,.15);padding:.35rem .65rem;transition:color .2s,border-color .2s}
.footer-socials a:hover{color:var(--gold);border-color:var(--gold)}
.footer-col h4{font-size:.68rem;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--gold);margin-bottom:1.2rem}
.footer-col a{display:block;font-size:.9rem;color:var(--w70);padding:.3rem 0;transition:color .2s}
.footer-col a:hover{color:var(--white)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding:1.4rem 0;font-size:.78rem;color:rgba(250,250,248,.25);flex-wrap:wrap;gap:.8rem}
.footer-bottom div{display:flex;gap:1.5rem}

/* WA Float */
.wa-float{position:fixed;bottom:1.8rem;right:1.8rem;width:52px;height:52px;background:#25D366;border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:998;box-shadow:0 4px 20px rgba(37,211,102,.4);transition:transform .3s,box-shadow .3s}
.wa-float:hover{transform:scale(1.08);box-shadow:0 6px 28px rgba(37,211,102,.55)}
.wa-float svg{width:26px;height:26px;color:#fff}

/* ══════ RESPONSIVE ══════ */
@media(max-width:1024px){
  .home-hero .container{grid-template-columns:1fr}
  .hero-visual{display:none}
  .svc-grid{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:1fr}
  .step{border-right:none;border-bottom:1px solid rgba(201,168,76,.06)}
  .step:last-child{border-bottom:none}
  .co-grid{grid-template-columns:1fr}
  .plan-grid{grid-template-columns:1fr}
  .bp-grid{grid-template-columns:1fr 1fr}
  .nos-grid{grid-template-columns:1fr;gap:3rem}
  .contact-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .clients-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:768px){
  :root{--nav-h:64px}
  body{font-size:16px}
  .nav{display:none}
  .burger{display:flex}
  .lang{display:none}
  .svc-grid{grid-template-columns:1fr}
  .co-grid{grid-template-columns:1fr}
  .plan-grid{grid-template-columns:1fr}
  .bp-grid{grid-template-columns:1fr}
  .nos-grid{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .clients-grid{grid-template-columns:repeat(2,1fr)}
  .hero-h1{font-size:2.6rem}
  .hero-actions{flex-direction:column}
  .hero-actions .btn{width:100%;max-width:300px}
  .fca-btns{flex-direction:column;align-items:center}
  .fca-btns .btn{width:100%;max-width:320px}
  .footer-bottom{flex-direction:column;text-align:center}
  .section-h{font-size:1.9rem}
}
@media(max-width:480px){
  .container{padding:0 1.2rem}
  .section{padding:3.5rem 0}
  .svc-card,.co-card,.plan-card,.bp-card{padding:1.6rem}
  .form-box{padding:1.6rem}
  .clients-grid{grid-template-columns:repeat(2,1fr)}
  .hero-stats{gap:1.2rem}
}


/* ══════════════ SVG ICON SYSTEM ══════════════ */
.svc-svg {
  width: 28px;
  height: 28px;
  color: var(--gold);
  display: block;
  margin-bottom: 1rem;
  flex-shrink: 0;
}
.step-svg {
  width: 26px;
  height: 26px;
  color: var(--gold);
  display: block;
  margin: 0 auto .9rem;
  opacity: .85;
}
.contact-ico {
  width: 17px;
  height: 17px;
  flex-shrink: 0;
  color: var(--gold);
  vertical-align: middle;
}
.who-ico {
  width: 26px;
  height: 26px;
  color: var(--gold);
  flex-shrink: 0;
  margin-bottom: .8rem;
  display: block;
}
.ico-check {
  width: 15px;
  height: 15px;
  color: var(--gold);
  flex-shrink: 0;
  margin-top: .15rem;
}
.ico-dash {
  width: 15px;
  height: 15px;
  color: rgba(250,250,248,.2);
  flex-shrink: 0;
  margin-top: .15rem;
}

/* Remove old svc-ico span — replaced by svc-svg */
.svc-ico { display: none; }

/* Step icon container */
.step { text-align: center; }
.step-n { display: none; }  /* replaced by step-svg */

/* Contact links with SVG */
.contact-links a {
  display: flex;
  align-items: center;
  gap: .75rem;
}

/* Who-it-for grid */
.who-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: rgba(201,168,76,.07);
  margin-top: 0;
}
.who-card {
  background: var(--black);
  padding: 2.2rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.who-card h3 { font-size: 1rem; font-weight: 700; margin-bottom: .5rem; }
.who-card p  { font-size: .9rem; color: var(--w70); line-height: 1.65; }

/* plan-crown upgrade */
.plan-crown {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: .6rem;
}

/* plan-note upgrade */
.plan-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  flex-wrap: wrap;
}

/* Manifesto list */
.manifesto div {
  display: flex;
  align-items: center;
  gap: .6rem;
}

/* Responsive SVG icons */
@media (max-width: 768px) {
  .svc-svg  { width: 24px; height: 24px; }
  .step-svg { width: 22px; height: 22px; }
  .who-grid { grid-template-columns: 1fr; }
  .co-grid  { grid-template-columns: 1fr; }
}
@media (max-width: 1024px) {
  .who-grid { grid-template-columns: 1fr; }
}

/* ══ Plan features with SVG ══ */
.plan-features li {
  display: flex;
  align-items: flex-start;
  gap: .55rem;
}
.plan-features li span { flex: 1; }
.plan-features li::before { display: none !important; }

/* ══ Co-list with SVG ══ */
.co-list li {
  display: flex;
  align-items: flex-start;
  gap: .55rem;
}
.co-list li span { flex: 1; }
.co-list li::before { display: none !important; }

/* ══ Step icon container ══ */
.step-icon {
  display: flex;
  justify-content: center;
  margin-bottom: .6rem;
}
.step-n {
  display: block !important;
  font-family: var(--sans);
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: 3px;
  color: var(--gold);
  text-align: center;
  margin-bottom: .5rem;
}

/* ══ svc-ico now shows SVG ══ */
.svc-ico { display: block !important; }
.svc-ico .svc-svg { margin-bottom: 0; }

/* ══ Responsive tweaks ══ */
@media (max-width: 480px) {
  .plan-features li { font-size: .88rem; }
  .co-list li { font-size: .9rem; }
  .ico-check, .ico-dash { width: 14px; height: 14px; margin-top: .1rem; }
}

/* ══════════════════════════════════════════════
   RESPONSIVE OVERHAUL v3.1
   Tested breakpoints: 1200px, 1024px, 768px, 480px, 360px
══════════════════════════════════════════════ */

/* ── Base reset for all grids ── */
.svc-grid, .co-grid, .plan-grid, .bp-grid,
.nos-grid, .contact-grid, .footer-grid,
.steps, .who-grid, .clients-grid {
  width: 100%;
}

/* ── Service grid subpages: 2-col layout ── */
.svc-detail-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: start;
}

/* ── Page hero responsive ── */
.page-hero { padding: 3.5rem 0 2.8rem; }
.page-hero h1 { font-size: clamp(1.9rem, 5vw, 3.5rem); }
.page-hero p { font-size: 1rem; max-width: 100%; }
.breadcrumb { margin-bottom: 1rem; }

/* ── Hero responsive ── */
@media (max-width: 1100px) {
  .home-hero .container {
    grid-template-columns: 1fr;
    padding-top: 2rem;
    padding-bottom: 3rem;
  }
  .hero-visual { display: none; }
  .hero-h1 { font-size: clamp(2.4rem, 6vw, 4rem); }
  .hero-sub { max-width: 100%; }
}

/* ── Tablet: 1024px ── */
@media (max-width: 1024px) {
  :root { --nav-h: 68px; }
  .container { padding: 0 1.5rem; }
  .section { padding: 4rem 0; }

  .svc-grid         { grid-template-columns: repeat(2, 1fr); }
  .co-grid          { grid-template-columns: 1fr; }
  .plan-grid        { grid-template-columns: 1fr; }
  .bp-grid          { grid-template-columns: repeat(2, 1fr); }
  .nos-grid         { grid-template-columns: 1fr; gap: 2.5rem; }
  .contact-grid     { grid-template-columns: 1fr; }
  .footer-grid      { grid-template-columns: 1fr 1fr; gap: 2rem; }
  .clients-grid     { grid-template-columns: repeat(3, 1fr); }
  .who-grid         { grid-template-columns: 1fr; }
  .svc-detail-grid  { grid-template-columns: 1fr; gap: 2rem; }

  .steps {
    grid-template-columns: repeat(3, 1fr);
  }
  .step { border-right: 1px solid rgba(201,168,76,.06); }
  .step:nth-child(3) { border-right: none; }
  .step:nth-child(4), .step:nth-child(5) { border-top: 1px solid rgba(201,168,76,.06); }

  .fca-inner h2 { font-size: 2.4rem; }
}

/* ── Mobile: 768px ── */
@media (max-width: 768px) {
  :root { --nav-h: 62px; }
  body { font-size: 15.5px; }
  .container { padding: 0 1.1rem; }
  .section { padding: 3rem 0; }

  /* Nav */
  .nav, .lang { display: none !important; }
  .burger { display: flex !important; }

  /* Header inner */
  .header-inner { padding: 0 1.1rem; }

  /* Hero */
  .hero-h1 { font-size: 2.2rem; line-height: 1.12; }
  .hero-sub { font-size: 1rem; }
  .hero-badge { font-size: .7rem; }
  .hero-actions {
    flex-direction: column;
    align-items: flex-start;
  }
  .hero-actions .btn { width: 100%; max-width: 340px; justify-content: center; }
  .hero-stats { gap: 1.2rem; }
  .stat-n { font-size: 1.9rem; }
  .stat-l { font-size: .75rem; }

  /* Grids */
  .svc-grid         { grid-template-columns: 1fr; }
  .co-grid          { grid-template-columns: 1fr; }
  .plan-grid        { grid-template-columns: 1fr; }
  .bp-grid          { grid-template-columns: 1fr; }
  .nos-grid         { grid-template-columns: 1fr; }
  .contact-grid     { grid-template-columns: 1fr; }
  .footer-grid      { grid-template-columns: 1fr; }
  .clients-grid     { grid-template-columns: repeat(2, 1fr); }
  .who-grid         { grid-template-columns: 1fr; }
  .svc-detail-grid  { grid-template-columns: 1fr; }
  .form-row         { grid-template-columns: 1fr !important; }
  .steps            { grid-template-columns: 1fr; }
  .step             { border-right: none !important; border-bottom: 1px solid rgba(201,168,76,.06); }
  .step:last-child  { border-bottom: none; }

  /* Cards */
  .svc-card, .co-card, .plan-card, .bp-card { padding: 1.6rem; }
  .form-box { padding: 1.6rem; }

  /* Section titles */
  .section-h { font-size: 1.75rem; }
  .page-hero h1 { font-size: 1.9rem; }

  /* CTA */
  .fca-btns { flex-direction: column; align-items: center; }
  .fca-btns .btn { width: 100%; max-width: 320px; justify-content: center; }
  .fca-inner h2 { font-size: 2rem; }

  /* Footer */
  .footer-bottom { flex-direction: column; text-align: center; gap: .6rem; }
  .footer-bottom div { justify-content: center; }

  /* WA float - smaller on mobile */
  .wa-float { width: 46px; height: 46px; bottom: 1.2rem; right: 1.2rem; }
  .wa-float svg { width: 22px; height: 22px; }

  /* Dropdown — hidden on mobile (uses mobile-nav) */
  .dropdown { display: none !important; }

  /* Page hero CTA buttons */
  .page-hero .btn { width: 100%; max-width: 320px; justify-content: center; }
  .page-hero div[style*="display:flex"] {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
}

/* ── Small mobile: 480px ── */
@media (max-width: 480px) {
  :root { --nav-h: 58px; }
  body { font-size: 15px; }
  .container { padding: 0 .9rem; }
  .section { padding: 2.5rem 0; }

  .hero-h1 { font-size: 1.9rem; }
  .section-h { font-size: 1.55rem; }
  .page-hero h1 { font-size: 1.65rem; }

  .clients-grid { grid-template-columns: repeat(2, 1fr); }
  .client-cell { padding: .85rem .6rem; font-size: .7rem; }

  .co-price { font-size: 2rem; }
  .plan-price { font-size: 2rem; }

  /* Nosotros reasons */
  .nr { padding: 1.1rem 1.2rem; }
  .nr-n { font-size: 1.4rem; }

  /* Buttons full width on tiny screens */
  .btn { padding: .8rem 1.4rem; font-size: .78rem; }

  /* FAQ */
  .faq-q { font-size: .95rem; }

  /* Hero stats in a row even on small */
  .hero-stats { flex-wrap: wrap; gap: 1rem; }
  .stat-div { display: none; }
}

/* ── Extra small: 360px ── */
@media (max-width: 360px) {
  .logo-text { display: none; }
  .co-card, .plan-card, .svc-card { padding: 1.3rem; }
  .hero-h1 { font-size: 1.7rem; }
  .clients-grid { grid-template-columns: 1fr; }
}

/* ── Fix overflow issues ── */
.marquee-track { min-width: max-content; }
.clients-bar { overflow: hidden; }
.mobile-nav a { word-break: break-word; }

/* ── Prevent button overflow ── */
.btn {
  max-width: 100%;
  box-sizing: border-box;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── Fix svc-detail page 2-col on mobile ── */
@media (max-width: 768px) {
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns:1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
  [style*="display:grid"] {
    grid-template-columns: 1fr !important;
  }
}

/* ── Fix who-grid inline styles on consultoria ── */
@media (max-width: 768px) {
  div[style*="repeat(3,1fr)"],
  div[style*="repeat(3, 1fr)"] {
    grid-template-columns: 1fr !important;
  }
}

/* ── Mobile nav improvements ── */
.mobile-nav {
  overflow-y: auto;
  padding-bottom: env(safe-area-inset-bottom, 1.5rem);
}
.mobile-nav .mobile-lang {
  padding: 1.2rem 2rem;
  gap: 1.2rem;
}

/* ── Safe area for modern phones ── */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
  .wa-float {
    bottom: calc(1.2rem + env(safe-area-inset-bottom));
  }
}