/* ── FUENTES LOCALES ─────────────────────────────────────────────────
       Montserrat: todos los pesos disponibles (locales en /font/)
       Gentona: fuente display moderna para headings de alto impacto
       Inter: desde Google Fonts (sin archivo local), usado en body y forms
    ──────────────────────────────────────────────────────────────────── */

    /* Montserrat Thin (100) */
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-Thin.otf') format('opentype');
      font-weight: 100;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-ThinItalic.otf') format('opentype');
      font-weight: 100;
      font-style: italic;
      font-display: swap;
    }

    /* Montserrat ExtraLight (200) */
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-ExtraLight.otf') format('opentype');
      font-weight: 200;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-ExtraLightItalic.otf') format('opentype');
      font-weight: 200;
      font-style: italic;
      font-display: swap;
    }

    /* Montserrat Light (300) */
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-Light.otf') format('opentype');
      font-weight: 300;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-LightItalic.otf') format('opentype');
      font-weight: 300;
      font-style: italic;
      font-display: swap;
    }

    /* Montserrat Regular (400) */
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-Regular.otf') format('opentype');
      font-weight: 400;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-Italic.otf') format('opentype');
      font-weight: 400;
      font-style: italic;
      font-display: swap;
    }

    /* Montserrat Medium (500) */
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-Medium.otf') format('opentype');
      font-weight: 500;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-MediumItalic.otf') format('opentype');
      font-weight: 500;
      font-style: italic;
      font-display: swap;
    }

    /* Montserrat SemiBold (600) */
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-SemiBold.otf') format('opentype');
      font-weight: 600;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-SemiBoldItalic.otf') format('opentype');
      font-weight: 600;
      font-style: italic;
      font-display: swap;
    }

    /* Montserrat Bold (700) */
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-Bold.otf') format('opentype');
      font-weight: 700;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-BoldItalic.otf') format('opentype');
      font-weight: 700;
      font-style: italic;
      font-display: swap;
    }

    /* Montserrat ExtraBold (800) */
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-ExtraBold.otf') format('opentype');
      font-weight: 800;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-ExtraBoldItalic.otf') format('opentype');
      font-weight: 800;
      font-style: italic;
      font-display: swap;
    }

    /* Montserrat Black (900) */
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-Black.otf') format('opentype');
      font-weight: 900;
      font-style: normal;
      font-display: swap;
    }
    @font-face {
      font-family: 'Montserrat';
      src: url('font/Montserrat-BlackItalic.otf') format('opentype');
      font-weight: 900;
      font-style: italic;
      font-display: swap;
    }

    /* ── TOKENS ──────────────────────────────── */
    :root {
      --navy:       #00018d;
      --blue:       #3839bc;
      --lavender:   #7e71b7;
      --teal:       #08b8b5;
      --teal-d:     #069896;
      --white:      #ffffff;
      --bg:         #f4f6fb;
      --border:     #e8ecf5;
      --muted:      #7a8499;
      --dark:       #12132a;
      --grad-hero:  linear-gradient(140deg, #00018d 0%, #0a0a7a 45%, #0d2e7a 100%);
      --grad-mid:   linear-gradient(135deg, #3839bc 0%, #00018d 100%);
      --shadow-s:   0 4px 16px rgba(0,1,141,.07);
      --shadow-m:   0 10px 40px rgba(0,1,141,.11);
      --r:          16px;
      --rl:         24px;
      --t:          .3s ease;

      /* Sistema tipográfico */
      --font-display:  'Montserrat', sans-serif;               /* Headings hero y section h2 */
      --font-heading:  'Montserrat', sans-serif;               /* UI labels, botones, stats */
      --font-body:     'Inter', sans-serif;                    /* Body text, formularios */
    }

    /* ── RESET ───────────────────────────────── */
    *, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
    html { scroll-behavior:smooth; font-size:16px; }
    body { font-family: var(--font-body); color:var(--dark); background:var(--white); overflow-x:hidden; -webkit-font-smoothing:antialiased; }
    img  { max-width:100%; display:block; }
    a    { text-decoration:none; }

    /* ── LAYOUT ──────────────────────────────── */
    .wrap { width:100%; max-width:1200px; margin:0 auto; padding:0 2rem; }
    section { padding:6rem 0; }

    /* ── TYPE ────────────────────────────────── */
    .lbl {
      display:inline-block;
      font-family: var(--font-heading); font-weight:700;
      font-size:.72rem; letter-spacing:.22em; text-transform:uppercase;
      color:var(--teal); margin-bottom:1rem;
    }
    .lbl-w { color:rgba(8,184,181,.9); }

    .h2 {
      font-family: var(--font-display); font-weight:400;
      font-size:clamp(1.9rem,4vw,2.8rem); line-height:1.18; color:var(--navy);
      letter-spacing:-.01em;
    }
    .h2-w  { color:var(--white); }
    .h2-c  { text-align:center; }

    .sub { font-size:1.05rem; line-height:1.82; color:var(--muted); margin-top:1rem; }
    .sub-w { color:rgba(255,255,255,.72); }
    .sub-c { text-align:center; margin-left:auto; margin-right:auto; max-width:580px; }

    /* ── BUTTONS ─────────────────────────────── */
    .btn {
      display:inline-flex; align-items:center; gap:.5rem;
      font-family: var(--font-heading); font-weight:700;
      font-size:.92rem; letter-spacing:.04em;
      padding:.9rem 2.2rem; border-radius:50px;
      cursor:pointer; transition:all var(--t); border:2px solid transparent;
    }
    .btn-teal  { background:var(--teal); color:#fff; box-shadow:0 6px 24px rgba(8,184,181,.38); }
    .btn-teal:hover { background:var(--teal-d); transform:translateY(-2px); box-shadow:0 10px 32px rgba(8,184,181,.48); }
    .btn-ghost { background:transparent; color:#fff; border-color:rgba(255,255,255,.45); }
    .btn-ghost:hover { border-color:#fff; background:rgba(255,255,255,.1); transform:translateY(-2px); }

    /* ── REVEAL ──────────────────────────────── */
    .rv { opacity:0; transform:translateY(28px); transition:opacity .72s ease, transform .72s ease; }
    .rv.in { opacity:1; transform:translateY(0); }
    .d1{transition-delay:.08s} .d2{transition-delay:.16s} .d3{transition-delay:.24s}
    .d4{transition-delay:.32s} .d5{transition-delay:.40s} .d6{transition-delay:.48s}

    /* ══════════════════════════════════════════
       NAVBAR
    ══════════════════════════════════════════ */
    #nav {
      position:fixed; top:0; left:0; right:0; z-index:1000;
      padding:1.4rem 2rem;
      display:flex; align-items:center; justify-content:space-between;
      transition:background var(--t), padding var(--t), box-shadow var(--t);
    }
    #nav.up {
      background:rgba(0,1,141,.97);
      backdrop-filter:blur(12px);
      padding:.9rem 2rem;
      box-shadow:0 2px 30px rgba(0,0,0,.28);
    }
    .nav-logo img { height:46px; filter:brightness(0) invert(1); transition:height var(--t); }
    #nav.up .nav-logo img { height:40px; }

    .nav-ul { display:flex; list-style:none; gap:2.2rem; align-items:center; }
    .nav-ul a {
      font-family: var(--font-heading); font-weight:600;
      font-size:.82rem; letter-spacing:.08em; text-transform:uppercase;
      color:rgba(255,255,255,.85); position:relative; transition:color var(--t);
    }
    .nav-ul a::after {
      content:''; position:absolute; bottom:-4px; left:0;
      width:0; height:2px; background:var(--teal); transition:width var(--t);
    }
    .nav-ul a:hover, .nav-ul a.on { color:var(--teal); }
    .nav-ul a:hover::after, .nav-ul a.on::after { width:100%; }
    .nav-cta { background:var(--teal)!important; color:#fff!important; padding:.55rem 1.35rem!important; border-radius:30px; }
    .nav-cta::after { display:none!important; }
    .nav-cta:hover { background:var(--teal-d)!important; }

    /* hamburger */
    .hbg { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:5px; z-index:1001; }
    .hbg span { display:block; width:24px; height:2px; background:#fff; border-radius:2px; transition:all var(--t); }
    .hbg.x span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
    .hbg.x span:nth-child(2) { opacity:0; }
    .hbg.x span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

    /* mobile overlay */
    .mob-nav {
      display:none; position:fixed; inset:0;
      background:var(--navy); z-index:999;
      flex-direction:column; align-items:center; justify-content:center; gap:2.5rem;
    }
    .mob-nav.open { display:flex; }
    .mob-nav a {
      font-family: var(--font-heading); font-weight:700;
      font-size:1.4rem; color:rgba(255,255,255,.85);
      text-transform:uppercase; transition:color var(--t);
    }
    .mob-nav a:hover { color:var(--teal); }

    /* ══════════════════════════════════════════
       HERO
    ══════════════════════════════════════════ */
    #inicio {
      position:relative; min-height:100vh;
      background:var(--grad-hero);
      display:flex; align-items:center; justify-content:center; overflow:hidden;
    }
    /* grid lines */
    .hero-grid {
      position:absolute; inset:0;
      background-image:
        linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
      background-size:48px 48px;
    }
    /* ambient glows */
    .glow { position:absolute; border-radius:50%; filter:blur(80px); pointer-events:none; animation:pulse 6s ease-in-out infinite alternate; }
    .g1 { width:700px; height:700px; top:-250px; right:-200px; background:radial-gradient(circle,rgba(8,184,181,.14) 0%,transparent 70%); animation-delay:0s; }
    .g2 { width:500px; height:500px; bottom:-150px; left:-100px; background:radial-gradient(circle,rgba(126,113,183,.12) 0%,transparent 70%); animation-delay:2s; }
    .g3 { width:300px; height:300px; top:38%; left:14%; background:radial-gradient(circle,rgba(8,184,181,.08) 0%,transparent 70%); animation-delay:4s; }
    @keyframes pulse { from{transform:scale(1) translate(0,0);opacity:.7} to{transform:scale(1.1) translate(15px,-10px);opacity:1} }
    /* rings */
    .ring { position:absolute; border-radius:50%; border:1px solid rgba(8,184,181,.1); }
    .r1 { width:500px; height:500px; top:50%; left:75%; transform:translate(-50%,-50%); }
    .r2 { width:720px; height:720px; top:50%; left:75%; transform:translate(-50%,-50%); }
    .r3 { width:940px; height:940px; top:50%; left:75%; transform:translate(-50%,-50%); }

    .hero-inner {
      position:relative; z-index:2;
      text-align:center; padding:9rem 2rem 7rem; max-width:840px;
    }
    .hero-logo { height:88px; width:auto; filter:brightness(0) invert(1); margin:0 auto 2.5rem; }
    .hero-badge {
      display:inline-flex; align-items:center; gap:.5rem;
      background:rgba(8,184,181,.15); border:1px solid rgba(8,184,181,.35);
      color:var(--teal); padding:.45rem 1.3rem; border-radius:30px;
      font-family: var(--font-heading); font-weight:700; font-size:.75rem;
      letter-spacing:.18em; text-transform:uppercase; margin-bottom:2rem;
    }
    .hero-badge::before {
      content:''; width:6px; height:6px; border-radius:50%;
      background:var(--teal); box-shadow:0 0 8px var(--teal);
      animation:blink 2s ease-in-out infinite;
    }
    @keyframes blink { 0%,100%{opacity:1} 50%{opacity:.25} }
    .hero-h1 {
      font-family: var(--font-display); font-weight:400;
      font-size:clamp(2.4rem,5.8vw,4rem); color:#fff; line-height:1.1; margin-bottom:1.5rem;
      letter-spacing:-.02em;
    }
    .hero-h1 span { color:var(--teal); }
    .hero-p { font-size:clamp(1rem,2vw,1.18rem); color:rgba(255,255,255,.7); max-width:540px; margin:0 auto 3rem; line-height:1.75; }
    .hero-btns { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }
    /* scroll hint */
    .scroll-hint {
      position:absolute; bottom:2.5rem; left:50%; transform:translateX(-50%);
      display:flex; flex-direction:column; align-items:center; gap:.6rem;
      color:rgba(255,255,255,.38); font-size:.68rem;
      font-family: var(--font-heading); letter-spacing:.15em; text-transform:uppercase;
    }
    .mouse { width:22px; height:36px; border:1.5px solid rgba(255,255,255,.22); border-radius:11px; position:relative; }
    .mouse::after {
      content:''; position:absolute; width:3px; height:7px;
      background:rgba(255,255,255,.38); border-radius:2px; top:6px; left:50%;
      transform:translateX(-50%); animation:ms 1.6s ease-in-out infinite;
    }
    @keyframes ms { 0%{opacity:1;top:6px} 100%{opacity:0;top:20px} }

    /* wave utility */
    .wave { line-height:0; overflow:hidden; }
    .wave svg { display:block; width:100%; }

    /* ══════════════════════════════════════════
       ABOUT
    ══════════════════════════════════════════ */
    #nosotros { background:var(--bg); }
    .about-g { display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center; }
    .about-vis { position:relative; }
    .about-card {
      background:var(--navy); border-radius:var(--rl);
      padding:3rem 2.5rem 3.5rem; position:relative; overflow:hidden;
    }
    .about-card::before {
      content:''; position:absolute; top:-80px; right:-80px;
      width:260px; height:260px; border-radius:50%; background:rgba(8,184,181,.1);
    }
    .about-card::after {
      content:''; position:absolute; bottom:-40px; left:-40px;
      width:180px; height:180px; border-radius:50%; background:rgba(126,113,183,.08);
    }
    .about-iso { width:70px; filter:brightness(0) invert(1); margin-bottom:2rem; position:relative; z-index:1; }
    .about-big {
      font-family: var(--font-heading); font-weight:900;
      font-size:5.5rem; color:var(--teal); line-height:1; position:relative; z-index:1;
    }
    .about-lbl { font-family: var(--font-heading); font-weight:500; font-size:.95rem; color:rgba(255,255,255,.62); margin:.3rem 0 2rem; position:relative; z-index:1; }
    .about-pts { font-size:.72rem; color:rgba(255,255,255,.36); font-family: var(--font-heading); letter-spacing:.06em; position:relative; z-index:1; }
    .about-float {
      position:absolute; bottom:-1.5rem; right:-1.5rem;
      background:var(--teal); border-radius:var(--r);
      padding:1.6rem 1.8rem; color:#fff;
      box-shadow:0 12px 36px rgba(8,184,181,.42); min-width:148px;
    }
    .af-n { font-family: var(--font-heading); font-weight:900; font-size:2rem; line-height:1; }
    .af-l { font-size:.78rem; opacity:.88; margin-top:.3rem; line-height:1.35; }
    .pillars { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:2.2rem; }
    .pill {
      background:var(--white); border-radius:12px;
      padding:1.2rem 1.3rem; border-left:3px solid var(--teal); box-shadow:var(--shadow-s);
    }
    .pill-t { font-family: var(--font-heading); font-weight:700; font-size:.88rem; color:var(--navy); margin-bottom:.3rem; }
    .pill-d { font-size:.8rem; color:var(--muted); line-height:1.5; }

    /* ══════════════════════════════════════════
       SERVICES
    ══════════════════════════════════════════ */
    #servicios { background:var(--white); }
    .srv-intro { text-align:center; margin-bottom:4rem; }
    .srv-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
    .srv-card {
      background:var(--bg); border-radius:var(--rl);
      padding:2.4rem 2rem; position:relative; overflow:hidden;
      transition:transform var(--t), box-shadow var(--t), background var(--t); cursor:default;
    }
    .srv-card::after {
      content:''; position:absolute; top:0; left:0; right:0;
      height:3px; background:var(--teal);
      transform:scaleX(0); transform-origin:left; transition:transform var(--t);
    }
    .srv-card:hover { transform:translateY(-6px); box-shadow:var(--shadow-m); background:var(--white); }
    .srv-card:hover::after { transform:scaleX(1); }
    .srv-ico {
      width:60px; height:60px; border-radius:14px;
      background:linear-gradient(135deg,var(--navy) 0%,var(--blue) 100%);
      display:flex; align-items:center; justify-content:center;
      margin-bottom:1.6rem; transition:background var(--t);
    }
    .srv-card:hover .srv-ico { background:linear-gradient(135deg,var(--teal) 0%,var(--teal-d) 100%); }
    .srv-ico svg { width:28px; height:28px; fill:#fff; }
    .srv-t { font-family: var(--font-heading); font-weight:700; font-size:1.06rem; color:var(--navy); margin-bottom:.75rem; }
    .srv-d { font-size:.88rem; color:var(--muted); line-height:1.72; }

    /* ══════════════════════════════════════════
       STATS
    ══════════════════════════════════════════ */
    #stats { background:var(--grad-mid); padding:5rem 0; }
    .stats-g { display:grid; grid-template-columns:repeat(4,1fr); }
    .stat { text-align:center; padding:2.5rem 1.5rem; position:relative; }
    .stat:not(:last-child)::after {
      content:''; position:absolute; right:0; top:25%; bottom:25%;
      width:1px; background:rgba(255,255,255,.15);
    }
    .stat-n {
      font-family: var(--font-heading); font-weight:900;
      font-size:clamp(2.8rem,5vw,4rem); color:var(--teal); line-height:1; display:block;
    }
    .stat-sup { font-size:.5em; vertical-align:super; }
    .stat-l { font-family: var(--font-heading); font-weight:600; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.72); margin-top:.6rem; }

    /* ══════════════════════════════════════════
       WAREHOUSE
    ══════════════════════════════════════════ */
    #almacen { background:var(--grad-mid); padding-bottom:6rem; }
    .alm-g { display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center; padding-top:2rem; }
    .alm-text { color:#fff; }
    .alm-list { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:2rem; }
    .alm-i {
      background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12);
      border-left:3px solid var(--teal); border-radius:12px; padding:1.2rem 1.3rem;
    }
    .alm-it { font-family: var(--font-heading); font-weight:700; font-size:.85rem; color:#fff; margin-bottom:.3rem; }
    .alm-id { font-size:.8rem; color:rgba(255,255,255,.6); line-height:1.5; }
    .alm-cards { display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; }
    .alm-card {
      background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12);
      border-radius:var(--r); padding:2rem 1.6rem; text-align:center;
      transition:background var(--t), transform var(--t);
    }
    .alm-card:hover { background:rgba(255,255,255,.12); transform:translateY(-4px); }
    .alm-card.feat {
      grid-column:1/-1; background:rgba(8,184,181,.2); border-color:rgba(8,184,181,.4);
      display:flex; align-items:center; gap:2.5rem; text-align:left; padding:2rem 2.5rem;
    }
    .alm-big { font-family: var(--font-heading); font-weight:900; font-size:3.2rem; color:var(--teal); line-height:1; white-space:nowrap; }
    .alm-card:not(.feat) .alm-big { font-size:2.5rem; }
    .alm-unit { font-family: var(--font-heading); font-weight:600; font-size:.82rem; color:rgba(255,255,255,.55); margin-top:.2rem; }
    .alm-lbl { font-family: var(--font-heading); font-weight:600; font-size:.9rem; color:rgba(255,255,255,.88); line-height:1.35; }
    .alm-card:not(.feat) .alm-lbl { margin-top:.4rem; }

    /* ══════════════════════════════════════════
       WHY US
    ══════════════════════════════════════════ */
    #porque { background:var(--white); }
    .why-hd { text-align:center; margin-bottom:4rem; }
    .why-g { display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; }
    .why-card { text-align:center; padding:2.6rem 1.6rem; border-radius:var(--rl); transition:all var(--t); }
    .why-card:hover { background:var(--bg); transform:translateY(-5px); }
    .why-ico {
      width:78px; height:78px; border-radius:50%;
      background:linear-gradient(135deg,rgba(0,1,141,.07) 0%,rgba(8,184,181,.1) 100%);
      display:flex; align-items:center; justify-content:center;
      margin:0 auto 1.6rem; transition:background var(--t);
    }
    .why-card:hover .why-ico { background:linear-gradient(135deg,var(--navy) 0%,var(--blue) 100%); }
    .why-ico svg { width:34px; height:34px; fill:var(--navy); transition:fill var(--t); }
    .why-card:hover .why-ico svg { fill:#fff; }
    .why-t { font-family: var(--font-heading); font-weight:700; font-size:.98rem; color:var(--navy); margin-bottom:.65rem; }
    .why-d { font-size:.86rem; color:var(--muted); line-height:1.65; }

    /* ══════════════════════════════════════════
       PERMISOS BAND
    ══════════════════════════════════════════ */
    .perm-band { background:linear-gradient(135deg,var(--teal) 0%,var(--teal-d) 100%); padding:3.5rem 2rem; }
    .perm-inner {
      max-width:1200px; margin:0 auto;
      display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap;
    }
    .perm-txt h3 { font-family: var(--font-display); font-weight:400; font-size:1.65rem; color:#fff; margin-bottom:.4rem; letter-spacing:-.01em; }
    .perm-txt p { color:rgba(255,255,255,.82); font-size:.96rem; }
    .perm-tags { display:flex; gap:.8rem; flex-wrap:wrap; }
    .ptag {
      background:rgba(255,255,255,.2); border:1px solid rgba(255,255,255,.38);
      color:#fff; padding:.5rem 1.1rem; border-radius:8px;
      font-family: var(--font-heading); font-weight:700; font-size:.82rem; letter-spacing:.05em;
    }

    /* ══════════════════════════════════════════
       CONTACT
    ══════════════════════════════════════════ */
    #contacto { background:var(--bg); }
    .cnt-g { display:grid; grid-template-columns:1fr 1.5fr; gap:5rem; align-items:start; }
    .cit { display:flex; align-items:flex-start; gap:1.1rem; }
    .cit-items { display:flex; flex-direction:column; gap:1.4rem; margin-top:2.2rem; }
    .cit-ico {
      width:44px; height:44px; background:var(--navy); border-radius:10px;
      display:flex; align-items:center; justify-content:center; flex-shrink:0;
    }
    .cit-ico svg { width:20px; height:20px; fill:#fff; }
    .cit-l { font-family: var(--font-heading); font-weight:700; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--teal); margin-bottom:.25rem; }
    .cit-v { font-size:.94rem; color:var(--dark); line-height:1.5; }
    .frm-wrap { background:var(--white); border-radius:var(--rl); padding:3rem 2.5rem; box-shadow:var(--shadow-m); }
    .frm-title { font-family: var(--font-heading); font-weight:800; font-size:1.35rem; color:var(--navy); margin-bottom:1.8rem; }
    .frm-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
    .fg { margin-bottom:1.2rem; }
    .fg label { display:block; font-family: var(--font-heading); font-weight:700; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--navy); margin-bottom:.5rem; }
    .fg input, .fg select, .fg textarea {
      width:100%; padding:.9rem 1.15rem;
      border:2px solid var(--border); border-radius:10px;
      font-family: var(--font-body); font-size:.94rem; color:var(--dark);
      background:#fff; outline:none;
      transition:border-color var(--t), box-shadow var(--t); appearance:none;
    }
    .fg input:focus, .fg select:focus, .fg textarea:focus {
      border-color:var(--teal); box-shadow:0 0 0 3px rgba(8,184,181,.12);
    }
    .fg textarea { min-height:116px; resize:vertical; }
    .fg select {
      background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%237a8499' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
      background-repeat:no-repeat; background-position:right 1rem center; padding-right:2.5rem;
    }
    .btn-send {
      width:100%; background:var(--navy); color:#fff; border:none;
      padding:1.05rem 2rem; border-radius:10px;
      font-family: var(--font-heading); font-weight:700; font-size:.95rem; letter-spacing:.05em;
      cursor:pointer; transition:all var(--t); margin-top:.4rem;
    }
    .btn-send:hover { background:var(--teal); transform:translateY(-2px); box-shadow:0 8px 28px rgba(8,184,181,.38); }
    .btn-send.ok { background:var(--teal); }

    /* ══════════════════════════════════════════
       FOOTER
    ══════════════════════════════════════════ */
    footer { background:var(--dark); padding:4.5rem 2rem 2rem; color:rgba(255,255,255,.52); }
    .ft-g {
      max-width:1200px; margin:0 auto;
      display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:3rem;
      padding-bottom:3rem; border-bottom:1px solid rgba(255,255,255,.07);
    }
    .ft-logo { height:44px; filter:brightness(0) invert(1); margin-bottom:1.2rem; }
    .ft-brand p { font-size:.86rem; line-height:1.72; max-width:240px; }
    .ft-social { display:flex; gap:.7rem; margin-top:1.6rem; }
    .soc {
      width:36px; height:36px; border-radius:8px;
      background:rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center;
      transition:all var(--t);
    }
    .soc:hover { background:var(--teal); transform:translateY(-2px); }
    .soc svg { width:17px; height:17px; fill:#fff; }
    .ft-col h5 { font-family: var(--font-heading); font-weight:700; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:#fff; margin-bottom:1.3rem; }
    .ft-col ul { list-style:none; }
    .ft-col li { margin-bottom:.7rem; }
    .ft-col a { font-size:.86rem; color:rgba(255,255,255,.5); transition:color var(--t); }
    .ft-col a:hover { color:var(--teal); }
    .ft-bot {
      max-width:1200px; margin:0 auto; padding-top:2rem;
      display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem;
    }
    .ft-bot p { font-size:.8rem; }
    .ft-pts { font-size:.72rem; color:rgba(255,255,255,.3); }

    /* ══════════════════════════════════════════
       RESPONSIVE
    ══════════════════════════════════════════ */
    @media (max-width:1024px) {
      .srv-grid { grid-template-columns:repeat(2,1fr); }
      .stats-g  { grid-template-columns:repeat(2,1fr); }
      .why-g    { grid-template-columns:repeat(2,1fr); }
      .ft-g     { grid-template-columns:1fr 1fr; gap:2rem; }
    }
    @media (max-width:900px) {
      .about-g, .alm-g, .cnt-g { grid-template-columns:1fr; gap:3rem; }
      .about-float { display:none; }
    }
    @media (max-width:768px) {
      .nav-ul  { display:none!important; }
      .hbg     { display:flex; }
      section  { padding:4rem 0; }
      .srv-grid { grid-template-columns:1fr; }
      .stats-g  { grid-template-columns:repeat(2,1fr); }
      .stat:not(:last-child)::after { display:none; }
      .why-g    { grid-template-columns:1fr; }
      .frm-row  { grid-template-columns:1fr; }
      .ft-g     { grid-template-columns:1fr; }
      .ft-bot   { flex-direction:column; text-align:center; }
      .perm-inner { flex-direction:column; text-align:center; }
      .alm-list { grid-template-columns:1fr; }
      .r1,.r2,.r3 { display:none; }
    }
    @media (max-width:500px) {
      .stats-g  { grid-template-columns:1fr; }
      .pillars  { grid-template-columns:1fr; }
      .alm-cards { grid-template-columns:1fr; }
      .alm-card.feat { flex-direction:column; gap:.8rem; text-align:center; }
    }

/* ── PAGE HERO (service landing pages) ──────────────────────────────── */
.page-hero { padding:9rem 0 4rem; background:var(--grad-hero); color:var(--white); }
.page-hero .wrap { max-width:900px; }
.breadcrumb {
  font-family:var(--font-heading); font-size:.8rem; font-weight:600;
  letter-spacing:.04em; opacity:.75; margin-bottom:1rem;
}
.breadcrumb a { color:var(--white); text-decoration:underline; text-underline-offset:3px; }
.page-hero h1 {
  font-family:var(--font-display); font-size:clamp(2rem,4.5vw,3rem);
  font-weight:800; line-height:1.15; margin-bottom:1rem;
}
.page-hero p { font-size:1.1rem; max-width:640px; opacity:.9; line-height:1.6; }
.page-hero .btn-row { display:flex; gap:1rem; flex-wrap:wrap; margin-top:2rem; }

/* ── SERVICE DETAIL BLOCK ────────────────────────────────────────────── */
.svc-block { padding:5rem 0; }
.svc-block .wrap { max-width:900px; }
.svc-block h2 { font-family:var(--font-display); font-size:1.8rem; font-weight:800; color:var(--navy); margin-bottom:1.2rem; }
.svc-block p { color:var(--muted); line-height:1.75; margin-bottom:1rem; font-size:1.05rem; }
.svc-block p strong { color:var(--dark); }

/* ── FAQ ─────────────────────────────────────────────────────────────── */
.faq { padding:5rem 0; background:var(--bg); }
.faq .wrap { max-width:800px; }
.faq h2 { font-family:var(--font-display); font-size:1.8rem; font-weight:800; color:var(--navy); margin-bottom:2rem; text-align:center; }
.faq-item { background:var(--white); border:1px solid var(--border); border-radius:var(--r); padding:1.5rem; margin-bottom:1rem; box-shadow:var(--shadow-s); }
.faq-item h3 { font-family:var(--font-heading); font-size:1.05rem; font-weight:700; color:var(--dark); margin-bottom:.5rem; }
.faq-item p { color:var(--muted); line-height:1.6; font-size:.95rem; }

/* ── CROSS-LINKS ("otros servicios") ─────────────────────────────────── */
.cross-links { padding:5rem 0; }
.cross-links h2 { font-family:var(--font-display); font-size:1.8rem; font-weight:800; color:var(--navy); margin-bottom:2rem; text-align:center; }
.cross-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1.5rem; }
.cross-card { display:block; background:var(--white); border:1px solid var(--border); border-radius:var(--r); padding:1.5rem; box-shadow:var(--shadow-s); transition:transform var(--t), box-shadow var(--t); }
.cross-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-m); }
.cross-card h3 { font-family:var(--font-heading); font-size:1rem; font-weight:700; color:var(--navy); margin-bottom:.4rem; }
.cross-card p { color:var(--muted); font-size:.9rem; line-height:1.5; }

/* ── SERVICE CARDS AS LINKS (homepage #servicios) ────────────────────── */
a.srv-card { display:block; cursor:pointer; }