:root{
    --navy:#0A0A0A;
    --navy-deep:#000000;
    --paper:#FFFFFF;
    --white:#FFFFFF;
    --gold:#E4362F;
    --gold-bright:#E4362F;
    --steel:#4D4D4D;
    --steel-light:#B3B3B3;
    --line:#E2E2E2;
    --line-dark:rgba(255,255,255,0.14);
    --font-display:'Space Grotesk', sans-serif;
    --font-body:'IBM Plex Sans', sans-serif;
    --font-mono:'IBM Plex Mono', monospace;
  }

  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    font-family:var(--font-body);
    color:var(--navy);
    background:var(--paper);
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  a{color:inherit;text-decoration:none;}
  img,svg{display:block;}
  ul{list-style:none;}

  @media (prefers-reduced-motion: reduce){
    *{animation-duration:0.001ms !important; transition-duration:0.001ms !important;}
    html{scroll-behavior:auto;}
  }

  .eyebrow{
    font-family:var(--font-mono);
    font-size:12px;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--gold);
    display:flex;
    align-items:center;
    gap:10px;
  }
  .eyebrow::before{
    content:"";
    width:22px;height:1px;
    background:var(--gold);
    display:inline-block;
  }

  h1,h2,h3{font-family:var(--font-display);letter-spacing:-0.01em;}

  .wrap{
    max-width:1180px;
    margin:0 auto;
    padding:0 32px;
  }

  /* Blueprint grid backgrounds */
  .grid-dark{
    background-color:var(--navy);
    background-image:
      linear-gradient(rgba(255,255,255,0.045) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.045) 1px, transparent 1px);
    background-size:44px 44px;
  }
  .grid-light{
    background-color:var(--paper);
    background-image:
      linear-gradient(rgba(0,0,0,0.06) 1px, transparent 1px),
      linear-gradient(90deg, rgba(0,0,0,0.06) 1px, transparent 1px);
    background-size:44px 44px;
  }

  /* Registration / drawing-sheet marks */
  .sheet{position:relative;}
  .sheet::before, .sheet::after{
    content:"";
    position:absolute;
    width:14px;height:14px;
    border-color:inherit;
    opacity:0.5;
  }
  .reg{
    position:absolute;
    font-family:var(--font-mono);
    font-size:10.5px;
    letter-spacing:0.08em;
    color:var(--steel-light);
    display:flex;
    align-items:center;
    gap:8px;
    z-index:2;
    pointer-events:none;
  }
  .reg .crosshair{
    width:11px;height:11px;
    position:relative;
    flex:none;
  }
  .reg .crosshair::before,.reg .crosshair::after{
    content:"";
    position:absolute;
    background:currentColor;
  }
  .reg .crosshair::before{ width:100%; height:1px; top:50%; left:0; }
  .reg .crosshair::after{ height:100%; width:1px; left:50%; top:0; }

  .reg-tl{top:24px;left:32px;}
  .reg-tr{top:24px;right:32px;}
  @media (max-width:720px){ .reg{display:none;} }

  /* NAV */
  header{
    position:fixed;
    top:0;left:0;right:0;
    z-index:100;
    padding:20px 0;
    transition:background 0.35s ease, padding 0.35s ease, border-color 0.35s ease;
    border-bottom:1px solid transparent;
  }
  header.scrolled{
    background:rgba(0,0,0,0.92);
    backdrop-filter:blur(8px);
    padding:14px 0;
    border-bottom:1px solid var(--line-dark);
  }
  .nav-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
  }
  .logo{
    font-family:var(--font-display);
    font-weight:700;
    font-size:19px;
    letter-spacing:0.02em;
    color:var(--white);
  }
  .logo span{color:var(--gold-bright);}
  .logo .logo-red{color:#E4362F;}
  nav ul{display:flex;gap:34px;}
  nav a{
    font-family:var(--font-mono);
    font-size:12.5px;
    letter-spacing:0.05em;
    color:var(--steel-light);
    transition:color 0.2s ease;
  }
  nav a:hover{color:var(--white);}
  .nav-cta{
    font-family:var(--font-mono);
    font-size:12px;
    letter-spacing:0.06em;
    color:var(--navy);
    background:var(--white);
    padding:10px 18px;
    border-radius:2px;
    transition:background 0.2s ease;
  }
  .nav-cta:hover{background:#E2E2E2;}
  .nav-toggle{
    display:none;
    width:38px;height:38px;
    padding:0;
    border:1px solid var(--line-dark);
    border-radius:2px;
    background:transparent;
    position:relative;
    cursor:pointer;
  }
  .nav-toggle span{
    position:absolute;left:9px;right:9px;
    height:1px;background:var(--white);
    transition:transform 0.25s ease, opacity 0.2s ease;
  }
  .nav-toggle span:nth-child(1){top:14px;}
  .nav-toggle span:nth-child(2){top:19px;}
  .nav-toggle span:nth-child(3){top:24px;}
  nav.open .nav-toggle span:nth-child(1){transform:translateY(5px) rotate(45deg);}
  nav.open .nav-toggle span:nth-child(2){opacity:0;}
  nav.open .nav-toggle span:nth-child(3){transform:translateY(-5px) rotate(-45deg);}

  @media (max-width:880px){
    nav ul{
      position:fixed;
      top:0;right:0;
      height:100vh;
      width:min(78vw, 320px);
      flex-direction:column;
      gap:0;
      background:var(--navy-deep);
      border-left:1px solid var(--line-dark);
      padding:100px 32px 40px;
      transform:translateX(100%);
      transition:transform 0.35s ease;
      z-index:99;
    }
    nav.open ul{
      display:flex;
      transform:translateX(0);
    }
    nav ul li{
      border-bottom:1px solid var(--line-dark);
    }
    nav ul a{
      display:block;
      padding:18px 0;
      font-size:14px;
    }
    .nav-toggle{
      display:block;
      z-index:100;
      position:relative;
    }
  }

  /* HERO */
  .hero{
    min-height:100vh;
    display:flex;
    flex-direction:column;
    justify-content:center;
    position:relative;
    color:var(--white);
    padding-top:120px;
    padding-bottom:80px;
    background:var(--navy);
  }
  .hero-bg{
    position:absolute;
    inset:0;
    z-index:0;
    background-image:url('../assets/images/hero-puente.png');
    background-size:cover;
    background-position:center 55%;
    animation:heroKenBurns 26s ease-in-out infinite alternate;
  }
  @keyframes heroKenBurns{
    0%{transform:scale(1) translate(0,0) rotate(0deg);}
    30%{transform:scale(1.05) translate(-1.2%,0.6%) rotate(0.3deg);}
    60%{transform:scale(1.09) translate(0.6%,-0.8%) rotate(-0.2deg);}
    100%{transform:scale(1.14) translate(-0.8%,0.4%) rotate(0.15deg);}
  }
  .hero-bg::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0.72) 55%, rgba(0,0,0,0.92) 100%);
  }
  .hero-inner{position:relative;z-index:2;}
  .hero .eyebrow{margin-bottom:28px;}
  .hero h1{
    font-size:clamp(38px, 6vw, 74px);
    line-height:1.04;
    font-weight:700;
    max-width:920px;
    text-transform:uppercase;
  }
  .hero h1 em{
    font-style:normal;
    color:var(--gold-bright);
  }
  .hero h1 em.white{
    color:var(--white);
  }
  .hero p.lede{
    font-size:18px;
    color:var(--steel-light);
    max-width:520px;
    margin-top:26px;
    line-height:1.6;
  }
  .hero-disciplines{
    margin-top:56px;
    display:flex;
    flex-wrap:wrap;
    gap:0;
    border-top:1px solid var(--line-dark);
  }
  .hero-disciplines span{
    font-family:var(--font-mono);
    font-size:12.5px;
    letter-spacing:0.04em;
    color:var(--steel-light);
    padding:16px 22px 16px 0;
    margin-right:22px;
    position:relative;
  }
  .hero-disciplines span b{
    color:var(--gold);
    font-weight:500;
    margin-right:8px;
  }
  .scroll-cue{
    position:absolute;
    bottom:38px;left:32px;
    display:flex;
    align-items:center;
    gap:10px;
    font-family:var(--font-mono);
    font-size:11px;
    color:var(--steel-light);
    letter-spacing:0.1em;
    z-index:2;
  }
  .scroll-cue .line{
    width:1px;height:34px;
    background:linear-gradient(var(--gold-bright), transparent);
    position:relative;
    overflow:visible;
  }
  .scroll-cue .line::after{
    content:"";
    position:absolute;
    left:-1.5px;top:0;
    width:4px;height:4px;
    border-radius:50%;
    background:var(--gold-bright);
    animation:scrollDot 2s cubic-bezier(0.6,0,0.3,1) infinite;
  }
  @keyframes scrollDot{
    0%{top:0;opacity:0;transform:scale(0.6);}
    12%{opacity:1;transform:scale(1);}
    80%{opacity:0.9;}
    100%{top:30px;opacity:0;transform:scale(0.4);}
  }

  /* SECTION SHELL */
  section{position:relative;padding:120px 0;}
  .section-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:40px;
    margin-bottom:64px;
    flex-wrap:wrap;
  }
  .section-head h2{
    font-size:clamp(28px, 3.4vw, 42px);
    font-weight:600;
    max-width:640px;
    line-height:1.15;
    margin-top:14px;
  }
  .light-section h2{color:var(--navy);}
  .dark-section, .dark-section .eyebrow{color:var(--white);}
  .dark-section{color:var(--white);}
  .dark-section .steel-text{color:var(--steel-light);}
  .light-section .steel-text{color:var(--steel);}

  .index-num{
    font-family:var(--font-mono);
    font-size:13px;
    color:var(--steel);
    white-space:nowrap;
  }
  .dark-section .index-num{color:var(--steel-light);}

  /* QUIÉNES SOMOS */
  .about-grid{
    display:grid;
    grid-template-columns:1.1fr 0.9fr;
    gap:70px;
    align-items:start;
  }
  .about-copy p{
    font-size:16.5px;
    line-height:1.75;
    color:var(--steel);
    max-width:560px;
  }
  .about-copy p + p{margin-top:18px;}

  .value-cards{display:flex;flex-direction:column;gap:1px;background:var(--line);border:1px solid var(--line);}
  .value-card{
    background:var(--white);
    padding:28px 30px;
    display:flex;
    gap:20px;
    position:relative;
    transition:box-shadow 0.25s ease;
  }
  .value-card:hover{
    box-shadow:inset 3px 0 0 var(--gold), 0 10px 24px -16px rgba(0,0,0,0.25);
    z-index:1;
  }
  .value-card .ic{
    flex:none;
    width:38px;height:38px;
    color:var(--gold);
  }
  .value-card h3{
    font-family:var(--font-mono);
    font-size:13px;
    letter-spacing:0.06em;
    text-transform:uppercase;
    color:var(--navy);
    margin-bottom:8px;
  }
  .value-card p{font-size:14.5px;color:var(--steel);line-height:1.55;}

  .norms{
    margin-top:80px;
    border-top:1px solid var(--line);
    padding-top:40px;
  }
  .norms-label{
    font-family:var(--font-mono);
    font-size:12px;
    letter-spacing:0.1em;
    text-transform:uppercase;
    color:var(--steel);
    margin-bottom:22px;
  }
  .norms-list{display:flex;flex-wrap:wrap;gap:14px;}
  .norms-list li{
    font-family:var(--font-mono);
    font-size:13px;
    letter-spacing:0.03em;
    color:var(--navy);
    border:1px solid var(--line);
    padding:9px 16px;
    background:var(--white);
  }

  /* SERVICE DETAIL SECTIONS */
  .service-detail .intro{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:28px;
    align-items:flex-start;
    margin-bottom:70px;
  }
  .service-detail .ic-big{
    width:56px;height:56px;
    color:var(--gold);
    flex:none;
  }
  .dark-section .ic-big{color:var(--gold-bright);}
  .service-detail .intro-text p{
    font-size:16.5px;
    line-height:1.75;
    max-width:640px;
    margin-top:14px;
  }
  .light-section .intro-text p{color:var(--steel);}
  .dark-section .intro-text p{color:var(--steel-light);}

  /* process timeline (01) */
  .timeline{display:flex;flex-direction:column;}
  .t-step{
    display:grid;
    grid-template-columns:70px 1fr;
    gap:28px;
    padding:30px 0;
    border-top:1px solid var(--line);
  }
  .t-step:last-child{border-bottom:1px solid var(--line);}
  .t-step .t-num{
    font-family:var(--font-mono);
    font-size:28px;
    font-weight:500;
    color:var(--gold);
  }
  .t-step h4{
    font-size:17px;
    font-weight:600;
    margin-bottom:10px;
  }
  .t-step ul li{
    font-size:14.5px;
    color:var(--steel);
    line-height:1.65;
    padding-left:16px;
    position:relative;
  }
  .t-step ul li::before{
    content:"—";
    position:absolute;
    left:0;
    color:var(--gold);
  }

  /* category grid (02, 04, 05) */
  .cat-grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:1px;
    background:var(--line);
    border:1px solid var(--line);
  }
  .dark-section .cat-grid{background:var(--line-dark);border-color:var(--line-dark);}
  .cat-item{
    background:var(--white);
    padding:32px 34px;
  }
  .dark-section .cat-item{background:var(--navy);}
  .cat-item .ic{width:26px;height:26px;color:var(--gold);margin-bottom:16px;}
  .cat-item h4{font-size:16px;font-weight:600;margin-bottom:8px;}
  .cat-item p{font-size:14px;line-height:1.55;}
  .light-section .cat-item p{color:var(--steel);}
  .dark-section .cat-item p{color:var(--steel-light);}
  @media (max-width:720px){.cat-grid{grid-template-columns:1fr;}}

  /* diagnostico / solucion (03) */
  .two-col{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
  }
  .two-col .col-label{
    font-family:var(--font-mono);
    font-size:12.5px;
    letter-spacing:0.1em;
    text-transform:uppercase;
    color:var(--gold);
    padding-bottom:16px;
    border-bottom:1px solid var(--line-dark);
    margin-bottom:22px;
  }
  .two-col ul li{
    font-size:15px;
    line-height:1.7;
    color:var(--steel-light);
    padding:14px 0;
    border-bottom:1px solid var(--line-dark);
  }
  @media (max-width:720px){.two-col{grid-template-columns:1fr;gap:36px;}}

  /* dictamen / asesoria list (04, 05) reused via cat-grid with 3 cols */
  .cat-grid.cols-3{grid-template-columns:repeat(3,1fr);}
  @media (max-width:880px){.cat-grid.cols-3{grid-template-columns:1fr 1fr;}}
  @media (max-width:560px){.cat-grid.cols-3{grid-template-columns:1fr;}}

  /* analysis section (06) */
  .analysis-layout{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:70px;
    align-items:center;
  }
  .chart-box{
    background:rgba(255,255,255,0.03);
    border:1px solid var(--line-dark);
    padding:28px 24px 18px;
  }
  .chart-caption{
    font-family:var(--font-mono);
    font-size:11.5px;
    color:var(--steel-light);
    letter-spacing:0.04em;
    margin-top:14px;
    text-align:center;
  }
  .legend{
    display:flex;
    gap:24px;
    justify-content:center;
    margin-top:6px;
    font-family:var(--font-mono);
    font-size:11.5px;
  }
  .legend span{display:flex;align-items:center;gap:8px;color:var(--steel-light);}
  .legend .dot{width:9px;height:9px;border-radius:50%;}
  .analysis-lists{display:grid;grid-template-columns:1fr 1fr;gap:36px;}
  @media (max-width:880px){.analysis-layout{grid-template-columns:1fr;}}
  @media (max-width:560px){.analysis-lists{grid-template-columns:1fr;}}

  /* SERVICES SHOWCASE (rows) */
  .services-shell{padding:0 !important;}
  .services-banner{
    position:relative;
    min-height:280px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    text-align:center;
  }
  .services-banner .truss{position:absolute;inset:0;width:100%;height:100%;opacity:0.6;}
  .services-banner-inner{position:relative;z-index:2;}
  .services-banner-inner .eyebrow{justify-content:center;}
  .services-banner-inner h2{
    font-size:clamp(32px, 5vw, 54px);
    color:var(--white);
    margin-top:14px;
    text-transform:uppercase;
    font-weight:700;
  }

  /* quick-nav de disciplinas */
  .services-quicknav{
    position:relative;
    z-index:2;
    background:var(--navy-deep);
    border-bottom:1px solid var(--line-dark);
  }
  .services-quicknav ul{
    display:flex;
    gap:2px;
    overflow-x:auto;
    scrollbar-width:none;
  }
  .services-quicknav ul::-webkit-scrollbar{display:none;}
  .services-quicknav a{
    flex:none;
    display:flex;
    align-items:baseline;
    gap:8px;
    font-family:var(--font-mono);
    font-size:12px;
    letter-spacing:0.03em;
    color:var(--steel-light);
    padding:18px 20px;
    border-bottom:2px solid transparent;
    transition:color 0.2s ease, border-color 0.2s ease;
    white-space:nowrap;
  }
  .services-quicknav a b{color:var(--gold);font-weight:500;}
  .services-quicknav a:hover{color:var(--white);border-color:var(--gold);}

  .services-rows{padding:76px 0 90px;}
  .service-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:64px;
    align-items:center;
    padding:56px 0;
    scroll-margin-top:90px;
  }
  .service-row.reverse{direction:rtl;}
  .service-row.reverse > *{direction:ltr;}
  .service-row .visual{
    background:var(--white);
    border:1px solid var(--line);
    border-radius:6px;
    padding:20px;
    aspect-ratio:480/320;
    overflow:hidden;
    box-shadow:0 1px 2px rgba(0,0,0,0.04);
    transition:transform 0.4s ease, box-shadow 0.4s ease;
  }
  .service-row:hover .visual{
    transform:translateY(-4px);
    box-shadow:0 22px 40px -20px rgba(0,0,0,0.28);
  }
  .service-row .visual svg{width:100%;height:100%;}
  .service-row .visual.visual-photo{padding:0;}
  .service-row .visual.visual-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
  }
  .service-row .visual.visual-dark{
    background:var(--navy);
    padding:0;
  }

  /* Modelo isométrico estructural (encabezado y sección 02) */
  .iso-stage{
    width:100%;height:100%;
    position:relative;
    display:flex;align-items:center;justify-content:center;
    background:
      linear-gradient(rgba(255,255,255,0.045) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.045) 1px, transparent 1px);
    background-size:22px 22px;
  }
  .iso-stage svg{width:100%;height:100%;}
  .iso-caption{
    position:absolute;
    bottom:16px;left:0;right:0;
    text-align:center;
    font-family:var(--font-mono);
    font-size:10.5px;
    letter-spacing:0.1em;
    color:var(--steel-light);
  }
  .iso-compass{transform-origin:410px 60px;animation:northPulse 6s ease-in-out infinite;}
  .iso-beacon{transform-origin:240px 7px;animation:towerBlink 2.2s ease-in-out infinite;}
  .iso-beacon-ring{
    transform-origin:240px 7px;
    fill:none;
    stroke:var(--gold-bright);
    stroke-width:1.2;
    animation:beaconPing 2.2s cubic-bezier(0.2,0.6,0.4,1) infinite;
  }
  @keyframes beaconPing{
    0%{transform:scale(1);opacity:0.75;}
    70%{opacity:0.08;}
    100%{transform:scale(5.5);opacity:0;}
  }
  @media (prefers-reduced-motion: reduce){
    .iso-compass, .iso-beacon, .iso-beacon-ring{animation:none !important;opacity:1 !important;transform:none !important;}
  }

  /* 01 · Plano dibujándose */
  .draw{
    stroke-dasharray:var(--len);
    stroke-dashoffset:var(--len);
    opacity:0;
    animation:drawLine 5s ease-in-out infinite;
    animation-delay:var(--dly, 0s);
  }
  @keyframes drawLine{
    0%{stroke-dashoffset:var(--len);opacity:0;}
    8%{opacity:1;}
    55%{stroke-dashoffset:0;opacity:1;}
    88%{stroke-dashoffset:0;opacity:1;}
    100%{stroke-dashoffset:0;opacity:0;}
  }
  .anim-blueprint .north-pulse{
    transform-origin:335px 75px;
    animation:northPulse 6s ease-in-out infinite;
  }
  @keyframes northPulse{
    0%{opacity:0.4;transform:rotate(-7deg) scale(0.9);}
    15%{opacity:0.7;transform:rotate(5deg) scale(0.97);}
    32%{opacity:1;transform:rotate(-3deg) scale(1.05);}
    48%{opacity:1;transform:rotate(3deg) scale(1);}
    64%{opacity:1;transform:rotate(-1.5deg) scale(1.04);}
  80%{opacity:0.85;transform:rotate(1deg) scale(0.98);}
    100%{opacity:0.4;transform:rotate(-7deg) scale(0.9);}
  }
  @keyframes towerBlink{
    0%,100%{opacity:1;transform:scale(1);}
    8%{opacity:0.15;transform:scale(0.6);}
    16%{opacity:1;transform:scale(1.4);}
    24%{opacity:0.25;transform:scale(0.75);}
    34%{opacity:1;transform:scale(1);}
  }

  /* 03 · Sismógrafo en vivo */
  .seismo-scroll{
    animation:seismoScroll 6s cubic-bezier(0.45,0,0.55,1) infinite;
  }
  @keyframes seismoScroll{
    0%{transform:translate(0,0);}
    18%{transform:translate(-76px,-1.4px);}
    36%{transform:translate(-152px,1.2px);}
    54%{transform:translate(-228px,-0.8px);}
    72%{transform:translate(-304px,1.6px);}
    90%{transform:translate(-380px,-0.6px);}
    100%{transform:translate(-420px,0);}
  }
  .seismo-cursor{
    animation:seismoCursor 6s linear infinite;
  }
  @keyframes seismoCursor{
    0%{transform:translateX(0);opacity:0.4;stroke-width:1;}
    50%{opacity:0.9;stroke-width:1.6;}
    100%{transform:translateX(420px);opacity:0.4;stroke-width:1;}
  }

  /* 04 · Checklist y sello girando */
  .check-item{
    transform-origin:180px 190px;
    opacity:0;
    animation:checkIn 4.5s ease-in-out infinite;
    animation-delay:var(--dly, 0s);
  }
  @keyframes checkIn{
    0%,4%{opacity:0;transform:scale(0.3) rotate(-25deg);}
    11%{opacity:1;transform:scale(1.3) rotate(10deg);}
    16%{transform:scale(0.88) rotate(-6deg);}
    20%{transform:scale(1.06) rotate(2deg);}
    25%,86%{opacity:1;transform:scale(1) rotate(0deg);}
    94%,100%{opacity:0;transform:scale(0.5) rotate(14deg);}
  }
  .stamp-spin{
    transform-origin:345px 210px;
    animation:stampSpin 10s ease-in-out infinite;
  }
  @keyframes stampSpin{
    0%{stroke-dashoffset:0;transform:scale(1) rotate(0deg);}
    45%{stroke-dashoffset:30;transform:scale(1.05) rotate(190deg);}
    50%{transform:scale(1.05) rotate(198deg);}
    100%{stroke-dashoffset:56;transform:scale(1) rotate(360deg);}
  }
  @media (prefers-reduced-motion: reduce){
    .draw, .anim-blueprint .north-pulse, .seismo-scroll, .seismo-cursor, .check-item, .stamp-spin{
      animation:none !important;
      opacity:1 !important;
      stroke-dashoffset:0 !important;
      transform:none !important;
    }
  }

  /* 05 · Red de coordinación */
  .link-pulse line{
    stroke-dasharray:6 6;
    animation:linkFlow 1.6s linear infinite, linkGlow 4s ease-in-out infinite;
    animation-delay:var(--dly, 0s), var(--dly, 0s);
  }
  @keyframes linkFlow{
    to{stroke-dashoffset:-24;}
  }
  @keyframes linkGlow{
    0%,100%{opacity:0.55;}
    50%{opacity:1;}
  }
  .hub-pulse{
    transform-origin:240px 160px;
    animation:hubPulse 3s ease-in-out infinite;
  }
  @keyframes hubPulse{
    0%,100%{transform:scale(1) rotate(0deg);}
    50%{transform:scale(1.08) rotate(4deg);}
  }
  .hub-ring{
    transform-origin:240px 160px;
    fill:none;
    stroke:var(--gold);
    stroke-width:1.3;
    animation:hubRipple 3s cubic-bezier(0.2,0.6,0.4,1) infinite;
    animation-delay:var(--dly, 0s);
  }
  @keyframes hubRipple{
    0%{transform:scale(1);opacity:0.55;}
    100%{transform:scale(2.1);opacity:0;}
  }
  .node-in{
    opacity:0;
    transform-origin:center;
    animation:nodeIn 4s ease-in-out infinite;
    animation-delay:var(--dly, 0s);
  }
  @keyframes nodeIn{
    0%,4%{opacity:0;transform:scale(0.4) rotate(-16deg);}
    12%{opacity:1;transform:scale(1.18) rotate(6deg);}
    18%,88%{opacity:1;transform:scale(1) rotate(0deg);}
    96%,100%{opacity:0;transform:scale(0.5) rotate(10deg);}
  }

  /* 06 · Curva de capacidad */
  .curve-dot{
    offset-path:path("M55,260 L135,195 L215,132 L295,105 L375,92 L450,86");
    animation:curveDotMove 5s ease-in-out infinite;
  }
  @keyframes curveDotMove{
    0%{offset-distance:0%;opacity:0;transform:scale(0.6);}
    8%{opacity:1;transform:scale(1.5);}
    14%{transform:scale(1);}
    40%{transform:scale(1.25);}
    55%{offset-distance:100%;opacity:1;transform:scale(1);}
    70%{transform:scale(1.35);}
    88%{offset-distance:100%;opacity:1;transform:scale(1);}
    100%{offset-distance:100%;opacity:0;transform:scale(0.6);}
  }
  .curve-dot-trail{
    offset-path:path("M55,260 L135,195 L215,132 L295,105 L375,92 L450,86");
    animation:curveDotTrail 5s ease-in-out infinite;
  }
  @keyframes curveDotTrail{
    0%{offset-distance:0%;opacity:0;transform:scale(0.4);}
    10%{opacity:0.35;transform:scale(2.4);}
    20%{opacity:0;transform:scale(3.2);}
    55%{offset-distance:100%;}
    100%{offset-distance:100%;opacity:0;}
  }
  @media (prefers-reduced-motion: reduce){
    .link-pulse line, .hub-pulse, .hub-ring, .node-in, .curve-dot, .curve-dot-trail{
      animation:none !important;
      opacity:1 !important;
      transform:none !important;
    }
  }

  /* Hero · modelo estructural isométrico */
  .hero-structure{
    position:absolute;
    top:104px;
    right:44px;
    width:260px;
    z-index:2;
    text-align:center;
    pointer-events:none;
  }
  .hero-structure .iso-stage{
    height:310px;
    background:none;
  }
  .hero-structure-label{
    margin-top:12px;
    font-family:var(--font-mono);
    font-size:10px;
    letter-spacing:0.1em;
    color:var(--steel-light);
  }
  @media (max-width:1150px){
    .hero-structure{display:none;}
  }
  .row-head{display:flex;align-items:center;gap:14px;margin-bottom:16px;}
  .row-head .ic{width:28px;height:28px;color:var(--gold);flex:none;}
  .row-head h3{
    font-size:19px;font-weight:600;text-transform:uppercase;
    letter-spacing:0.01em;color:var(--navy);line-height:1.3;
  }
  .row-lede{font-size:14.5px;color:var(--steel);line-height:1.6;margin-bottom:16px;}
  .row-bullets li{
    font-size:14.5px;color:var(--steel);line-height:1.6;
    padding:10px 0 10px 20px;position:relative;
    border-bottom:1px solid var(--line);
  }
  .row-bullets li::before{content:"—";position:absolute;left:0;color:var(--gold);}
  .row-bullets li:last-child{border-bottom:none;}
  .cta-pill{
    display:inline-flex;align-items:center;gap:10px;
    font-family:var(--font-mono);font-size:12px;letter-spacing:0.06em;
    background:var(--navy);color:var(--white);
    padding:14px 24px;border-radius:30px;margin-top:26px;
    transition:background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
  }
  .cta-pill:hover{
    background:#1A1A1A;
    transform:translateY(-2px);
    box-shadow:0 10px 20px -8px rgba(0,0,0,0.35);
  }

  .row-divider{display:flex;justify-content:center;margin:8px 0;position:relative;z-index:3;}
  .row-divider .chev{
    width:40px;height:40px;border-radius:50%;
    background:var(--navy);color:var(--gold-bright);
    display:flex;align-items:center;justify-content:center;
    border:5px solid var(--paper);
  }

  @media (max-width:820px){
    .service-row, .service-row.reverse{grid-template-columns:1fr;direction:ltr;gap:26px;padding:36px 0;}
  }

  /* CONTACT */
  .contact-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:1px;
    background:var(--line-dark);
    border:1px solid var(--line-dark);
    margin-top:60px;
  }
  .contact-card{
    background:var(--navy);
    padding:34px 28px;
    transition:background 0.25s ease;
  }
  .contact-card:hover{background:#1A1A1A;}
  .contact-card .ic{width:26px;height:26px;color:var(--gold-bright);margin-bottom:20px;}
  .contact-card .clabel{
    font-family:var(--font-mono);
    font-size:11px;
    letter-spacing:0.1em;
    text-transform:uppercase;
    color:var(--steel-light);
    margin-bottom:10px;
  }
  .contact-card .cval{font-size:16px;font-weight:500;color:var(--white);}
  @media (max-width:880px){.contact-grid{grid-template-columns:1fr 1fr;}}
  @media (max-width:560px){.contact-grid{grid-template-columns:1fr;}}

  .cta-head h2{
    font-size:clamp(30px, 4.6vw, 52px);
    max-width:760px;
    line-height:1.15;
    color:var(--white);
  }
  .cta-head p{
    font-size:17px;
    color:var(--steel-light);
    max-width:540px;
    margin-top:20px;
    line-height:1.6;
  }

  /* FOOTER */
  footer{
    background:var(--navy-deep);
    padding:44px 0;
    border-top:1px solid var(--line-dark);
  }
  .footer-inner{
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:20px;
  }
  .footer-inner .logo{font-size:16px;}
  .footer-links{display:flex;gap:26px;}
  .footer-links a{
    font-family:var(--font-mono);
    font-size:12px;
    color:var(--steel-light);
  }
  .footer-copy{
    font-family:var(--font-mono);
    font-size:11.5px;
    color:var(--steel);
  }

  /* UTIL */
  .btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    font-family:var(--font-mono);
    font-size:13px;
    letter-spacing:0.05em;
    background:var(--gold-bright);
    color:var(--navy);
    padding:15px 26px;
    border-radius:2px;
    margin-top:34px;
    transition:background 0.2s ease;
  }
  .btn:hover{background:#B82A22;}

  a:focus-visible, button:focus-visible{
    outline:2px solid var(--gold-bright);
    outline-offset:3px;
  }

  .reveal{
    opacity:0;
    transform:translateY(24px);
    transition:opacity 0.7s ease, transform 0.7s ease;
  }
  .reveal.in{opacity:1;transform:none;}

  @media (max-width:880px){
    .about-grid{grid-template-columns:1fr;gap:50px;}
    section{padding:84px 0;}
  }