/* ===================================================================
   NOESIS · A.I. Advisory — Capa de layout compartida (web)
   Depende de brand-v2-web.css (tokens + reglas base). Aquí vive todo lo
   que se repite en cada página: reset, wrap, header/nav, el andamiaje
   del hero y el bloque de contacto/footer oscuro. Cada página conserva
   su propio <style> solo para lo que le es exclusivo (la rejilla de
   servicios y la sección de firma en el home; niveles, entregables,
   pasos y "para quién es" en las páginas de servicio).

   Un solo lugar para el nav y el hero evita que un ajuste (por ejemplo,
   el alto del header) se tenga que repetir en cuatro archivos.
   =================================================================== */

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
::selection{background:var(--noesis-ink);color:var(--noesis-paper);}
a{color:inherit;text-decoration:none;}
.wrap{max-width:1120px;margin:0 auto;padding:0 40px;}

/* ---------- NAV ---------- */
header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  background:rgba(255,255,255,.86);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color .4s ease;
}
header.scrolled{border-bottom:1px solid var(--noesis-hairline);}
nav{height:74px;display:flex;align-items:center;justify-content:space-between;}
.nav-mark{display:flex;align-items:center;gap:12px;cursor:pointer;}
.nav-mark svg{width:24px;height:24px;display:block;}
.nm-word{font-size:14px;letter-spacing:.42em;padding-left:.42em;font-weight:300;}
.nm-descriptor{font-size:11px;letter-spacing:.12em;font-weight:300;color:var(--noesis-gray-text);padding-left:5px;padding-top:1px;line-height:1;}
.nav-links{display:flex;gap:44px;align-items:center;}
.nav-links a{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--noesis-gray-text);position:relative;padding-bottom:2px;transition:color .25s ease;}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:1px;background:var(--noesis-accent);transition:width .3s ease;}
.nav-links a:hover{color:var(--noesis-ink);}
.nav-links a:hover::after{width:100%;}
.nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:6px;}
.nav-toggle span{width:22px;height:1px;background:var(--noesis-ink);transition:transform .3s ease,opacity .3s ease;}

/* ---------- HERO (andamiaje compartido) ---------- */
.hero{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:150px 40px 30px;position:relative;}
.hero-symbol{width:118px;height:118px;margin-bottom:48px;}
.hero-symbol .spin-wrap{width:100%;height:100%;opacity:0;transform:scale(.9) rotate(-14deg);}
.loaded .hero-symbol .spin-wrap{animation:symbolIn 1.2s cubic-bezier(.22,.61,.36,1) .1s forwards;}
@keyframes symbolIn{from{opacity:0;transform:scale(.9) rotate(-14deg);}to{opacity:1;transform:scale(1) rotate(0);}}
.hero-antetitulo{font-size:11px;letter-spacing:.34em;text-transform:uppercase;color:var(--noesis-gray-text);margin-bottom:26px;}
.hero h1{font-weight:300;font-size:clamp(30px,5.2vw,56px);line-height:1.16;letter-spacing:-.015em;max-width:34ch;margin:0 auto 32px;text-wrap:balance;}
.hero h1 .accentline{position:relative;white-space:nowrap;}
.hero h1 .accentline::after{content:"";position:absolute;left:0;right:0;bottom:.06em;height:.08em;background:var(--noesis-accent);transform:scaleX(0);transform-origin:left;}
.js-motion .hero h1 .accentline::after{transition:transform 1s var(--noesis-ease) .9s;}
.loaded .hero h1 .accentline::after{transform:scaleX(1);}
.hero-sub{font-size:clamp(15px,1.7vw,18px);color:#3a3a3a;max-width:56ch;margin:0 auto 20px;font-weight:300;}
.hero-sub + .hero-sub{margin-top:-4px;}
.hero-cta{display:flex;gap:28px;align-items:center;flex-wrap:wrap;justify-content:center;margin-top:16px;margin-bottom:10px;}
.hero-cta-secondary{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--noesis-gray-text);border-bottom:1px solid var(--noesis-hairline);padding-bottom:3px;transition:color .25s ease,border-color .25s ease;}
.hero-cta-secondary:hover{color:var(--noesis-accent);border-color:var(--noesis-accent);}
/* Solo la línea que cae, sin la etiqueta "Scroll": la animación ya comunica que hay más contenido. */
.hero-scroll{display:flex;justify-content:center;}
.hero-scroll .line{width:1px;height:42px;background:var(--noesis-hairline);position:relative;overflow:hidden;}
.hero-scroll .line::after{content:"";position:absolute;top:-42px;left:0;width:1px;height:42px;background:var(--noesis-ink);animation:drop 2.6s cubic-bezier(.6,0,.4,1) infinite;}
@keyframes drop{0%{top:-42px;}60%{top:42px;}100%{top:42px;}}

/* Enlace de regreso en páginas de servicio */
.svc-back{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--noesis-gray-text);margin-bottom:28px;transition:color .25s ease;}
.svc-back:hover{color:var(--noesis-accent);}

/* ---------- SECTION SHELL ---------- */
section{padding:120px 0;}
.eyebrow-row{display:flex;align-items:center;gap:16px;margin-bottom:52px;}
.eyebrow-row::after{content:"";flex:1;height:1px;background:var(--noesis-hairline);}

/* ---------- CONTACTO / FOOTER (oscuro, compartido) ---------- */
.contact{padding:90px 0 60px;}
.contact-text h2{font-size:clamp(24px,3vw,34px);font-weight:300;line-height:1.35;max-width:24ch;margin-bottom:20px;text-wrap:balance;}
.contact-text p{font-size:14.5px;color:#B8B8B8;max-width:52ch;line-height:1.7;margin-bottom:14px;}
.contact-text p:last-of-type{margin-bottom:28px;}
.contact-inner{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap;padding-bottom:44px;border-bottom:1px solid #2A2A2A;margin-bottom:26px;}
.contact-meta{display:flex;flex-direction:column;gap:10px;font-size:12.5px;color:#B8B8B8;letter-spacing:.02em;}
.foot-inner{display:flex;justify-content:space-between;align-items:center;}
.foot-left{display:flex;align-items:center;gap:12px;}
.foot-left .nm-word{font-size:12px;}
.foot-left svg{width:20px;height:20px;}
.foot-meta{font-size:11px;color:var(--noesis-gray-text);letter-spacing:.04em;}

@media (max-width:640px){
  .wrap{padding:0 24px;}
  .nav-links{position:fixed;top:74px;left:0;right:0;background:#fff;flex-direction:column;gap:0;max-height:0;overflow:hidden;transition:max-height .35s ease;border-bottom:1px solid var(--noesis-hairline);}
  .nav-links.open{max-height:260px;}
  .nav-links a{padding:16px 24px;width:100%;}
  .nav-toggle{display:flex;}
  .contact-inner,.foot-inner{flex-direction:column;align-items:flex-start;gap:20px;}
}