/* AXIOMA Storefront — CHROME GLOBAL (header/nav/footer/skip/X/motion).
   Cargado en todas las páginas. El cuerpo específico vive en home.css / pdp.css / lander.css. */

html{overflow-x:clip}

/* ===== Announcement bar ===== */
.ann{background:var(--charcoal);color:var(--white)}
.ann .wrap{display:flex;justify-content:center;gap:22px;height:38px;align-items:center;flex-wrap:wrap}
.ann span{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase}
.ann span.dim{color:var(--cool-gray)}

/* ===== Nav (sticky) ===== */
nav{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}
nav .wrap{display:flex;align-items:center;justify-content:space-between;height:74px}
nav .logo img{height:26px;display:block}
nav ul{display:flex;gap:34px;list-style:none;margin:0;padding:0}
nav ul a{font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--charcoal);opacity:.8}
nav ul a:hover{opacity:1;color:var(--acc)}
nav .cart{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--charcoal);padding:9px 16px;border-radius:var(--r);color:var(--charcoal)}
nav .cart:hover{background:var(--charcoal);color:#fff}

/* Mobile nav toggle (hamburguesa accesible) */
.nav-toggle{display:none;width:44px;height:44px;border:0;background:transparent;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px;padding:0}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--charcoal);transition:transform .25s ease,opacity .2s ease}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.nav-toggle:focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:4px}
.mnav{display:none;flex-direction:column;gap:0;padding:6px 24px 24px;border-top:1px solid var(--line);background:#fff}
.mnav a{font-family:var(--f-mono);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--charcoal);padding:16px 0;border-bottom:1px solid var(--line)}
.mnav a:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.mnav a.btn{border-bottom:0;margin-top:18px;justify-content:center;text-align:center;color:var(--white)}
.mnav[data-open]{display:flex}

/* ===== Skip-link (a11y) ===== */
.skip{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip:focus{position:fixed;left:16px;top:16px;width:auto;height:auto;overflow:visible;padding:10px 18px;background:var(--charcoal);color:#fff;font-family:var(--f-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;border-radius:var(--r);z-index:9999;outline:2px solid var(--acc);outline-offset:2px}

/* ===== Sistema X — glifo + exponente (compartido ficha/lander/home) ===== */
.xglyph{height:1.15em;width:auto;display:inline-block;vertical-align:-.18em}
.exp .xglyph+sup,.cat .xglyph+sup,.sci .xglyph+sup{font-size:.42em;color:var(--acc);margin-left:.14em;vertical-align:1.85em}
.exp .xglyph,.cat .xglyph,.sci .xglyph{vertical-align:-.06em}

.linkarrow{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--acc);display:inline-flex;align-items:center;gap:8px}

/* ===== Footer (sitio) ===== */
footer{padding:70px 0 50px}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr;gap:48px;align-items:start}
footer .logo img{height:38px;margin-bottom:18px}
.fdesc{max-width:400px;color:var(--muted);font-size:14px;line-height:1.7;margin:0}
footer .channels{font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;color:var(--muted);margin-top:22px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
footer .channels b{color:var(--charcoal);font-weight:500;text-transform:uppercase;letter-spacing:.14em;font-size:10px}
.compliance h2{font-family:var(--f-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--charcoal);margin:0 0 14px}
.compliance p{font-size:12.5px;color:var(--muted);line-height:1.85;margin:0}
.flegal{margin-top:44px}
.flegal ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px 24px}
.flegal a{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-decoration:none;transition:color .2s}
.flegal a:hover,.flegal a:focus-visible{color:var(--charcoal)}
.fbottom{margin-top:28px;padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
.fbottom span{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}

/* ===== Página de contenido (legal / informativa) — page.php ===== */
.pagedoc{padding:64px 0 48px}
.wrap-doc{max-width:760px;margin:0 auto;padding:0 22px}
.doc-title{font-family:var(--f-display);font-size:clamp(28px,4vw,40px);font-weight:700;letter-spacing:-.01em;color:var(--charcoal);line-height:1.1;margin:0 0 28px}
.doc-body{font-family:var(--f-body);color:var(--muted);font-size:16px;line-height:1.75}
.doc-body h2{font-family:var(--f-display);font-size:21px;font-weight:600;color:var(--charcoal);margin:34px 0 10px}
.doc-body h3{font-family:var(--f-display);font-size:17px;font-weight:600;color:var(--charcoal);margin:24px 0 8px}
.doc-body p{margin:12px 0}
.doc-body strong,.doc-body b{color:var(--charcoal);font-weight:600}
.doc-body ul,.doc-body ol{margin:12px 0;padding-left:22px}
.doc-body li{margin:6px 0}
.doc-body a{color:var(--acc);text-decoration:underline;text-underline-offset:2px}
.doc-body a:hover{color:var(--acc-deep)}
.doc-body hr{border:0;border-top:1px solid var(--line);margin:30px 0}
.doc-body blockquote{background:var(--acc-tint);border-radius:var(--r);padding:12px 16px;color:var(--charcoal);font-size:14px;margin:16px 0}

/* ===== Motion base — scroll-reveal + X que se exponencia (transform/opacity) ===== */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s cubic-bezier(.16,.84,.44,1),transform .7s cubic-bezier(.16,.84,.44,1)}
.reveal.in{opacity:1;transform:none}
.reveal[data-stagger]>*{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s cubic-bezier(.16,.84,.44,1)}
.reveal[data-stagger].in>*{opacity:1;transform:none}
.reveal[data-stagger].in>*:nth-child(1){transition-delay:.04s}
.reveal[data-stagger].in>*:nth-child(2){transition-delay:.12s}
.reveal[data-stagger].in>*:nth-child(3){transition-delay:.20s}
.reveal[data-stagger].in>*:nth-child(4){transition-delay:.28s}
.xrise sup{display:inline-block;opacity:0;transform-origin:left bottom;transform:translateY(.55em) scale(.32);transition:opacity .5s ease .15s,transform .75s cubic-bezier(.2,1.25,.3,1) .15s}
.xrise.in sup{opacity:1;transform:translateY(0) scale(1)}
@media(prefers-reduced-motion:reduce){
  .reveal,.reveal[data-stagger]>*,.xrise sup{opacity:1!important;transform:none!important;transition:none!important}
}

/* ===== Responsive (chrome) ===== */
@media(max-width:900px){
  nav ul{display:none}
  .nav-toggle{display:inline-flex}
  nav .cart.desktop-cta{display:none}
  .fgrid{grid-template-columns:1fr}
  .ann .wrap{height:38px;padding:0 14px;gap:10px;flex-wrap:nowrap;white-space:nowrap}
  .ann span{font-size:9.5px;letter-spacing:.13em}
  .ann .mid,.ann .sep1{display:none}
}
