/* ===================================================================
   ØDIN — sistema visual compartido (Heim · Saga · Band)
   Páginas estáticas, sin scroll vertical. Scroll lateral donde haga falta.
   =================================================================== */

/* ===== TOKENS ===== */
:root{
  --brand:#001489;            /* Reflex Blue — solo isotipo */
  --g80:#333; --g70:#4d4d4d; --g60:#666; --g50:#808080;
  --g40:#999; --g30:#b3b3b3; --g20:#ccc; --g10:#e5e5e5;
  --g5:#f2f2f2; --g3:#f7f7f5; --white:#ffffff;
  --ease:cubic-bezier(.4,0,.2,1);

  /* LIGHT */
  --bg:#fafaf8;
  --surface:#ffffff;
  --line:#e5e5e5;
  --line-soft:#f2f2f2;
  --ink:#333333;
  --ink-2:#666666;
  --ink-3:#999999;
  --iso:#001489;
  --iso-fg:#ffffff;
  --btn-bg:#333333;
  --btn-fg:#ffffff;
  --data:#999999;
  --nav-accent:#001489;   /* azul ØDIN para hover del nav */
  --card-accent:#6c8cff;  /* azul para hover de links en la card (card oscura en light) */
  --mark:#e9e9e4;         /* logotipo gigante de fondo (cortado en la base) */

  /* card / pestaña contacto — inversa */
  --card-bg:#191919;
  --card-ink:#f4f4f2;
  --card-ink-2:#9a9a9a;

  /* ancho de la pestaña de contacto (≈ 1/4) */
  --cw:clamp(330px,25vw,460px);
  /* alturas de barras flotantes para padding seguro */
  --hdr-h:74px;
  --bar-h:80px;                        /* zona segura inferior (deck flotante) */
  --deck-m:clamp(10px,1.6vw,20px);     /* margen de la card flotante */
  --head-h:64px;                       /* alto de la franja = alto del header (HG = 64px) */
  --deck-h:clamp(280px,40vh,380px);    /* alto de la card abierta (BAJA, como HG) */
  --deck-pad:clamp(28px,6vw,72px);     /* inset: define largo de línea, margen de columnas y ancho del logotipo */
  --bar-radius:8px;                    /* radio de esquinas, igual en header y footer */
  --hdr-pad:clamp(16px,2vw,26px);      /* padding interno del header/franja */
  --iso-x:calc(var(--deck-m) + var(--hdr-pad));   /* x del borde izq del isotipo (guía 2) */
  --iso-end:calc(var(--iso-x) + 34px);            /* x del borde der del isotipo (guía 3) */
}
[data-theme="dark"]{
  --bg:#161616;
  --surface:#1c1c1c;
  --line:#2c2c2c;
  --line-soft:#242424;
  --ink:#f2f2f2;
  --ink-2:#b3b3b3;
  --ink-3:#808080;
  --iso:#ffffff;
  --iso-fg:#161616;
  --btn-bg:#f2f2f2;
  --btn-fg:#161616;
  --data:#6b6b6b;
  --nav-accent:#6c8cff;   /* azul más claro para hover del nav en dark */
  --card-accent:#001489;  /* azul ØDIN para hover de links en la card (card clara en dark) */
  --mark:#222222;         /* logotipo gigante de fondo en dark */
  --card-bg:#f2f2f2;
  --card-ink:#161616;
  --card-ink-2:#6b6b6b;
}

*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;overflow:hidden;}     /* SIN scroll vertical */
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
body{
  background:var(--bg);color:var(--ink);
  font-family:'Montserrat',sans-serif;
  transition:background .4s var(--ease),color .4s var(--ease);
  position:relative;
}

/* ===== HEADER FLOTANTE (pill centrado, estilo HG) ===== */
.hdr{
  position:fixed;top:var(--deck-m);left:var(--deck-m);right:var(--deck-m);z-index:70;
  height:var(--head-h);box-sizing:border-box;
  display:flex;align-items:center;justify-content:space-between;gap:clamp(12px,1.8vw,26px);
  padding:0 var(--hdr-pad);
  background:color-mix(in srgb,var(--surface) 88%,transparent);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border:.5px solid var(--line);border-radius:var(--bar-radius);
  box-shadow:0 8px 30px rgba(0,0,0,.07);
  transition:background .4s var(--ease),border-color .4s var(--ease);
}
.iso{
  width:34px;height:34px;background:var(--iso);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  border-radius:4px;transition:background .4s var(--ease);
}
.iso svg{width:24px;height:24px;}
.nav-links{display:flex;align-items:center;gap:clamp(10px,1.5vw,22px);}
.navlink{
  font-family:'Josefin Sans';font-size:12px;font-weight:500;
  letter-spacing:2px;color:var(--ink-3);cursor:pointer;
  text-decoration:none;transition:color .2s var(--ease);white-space:nowrap;
}
.navlink:hover{color:var(--ink);}
.navlink[aria-current="page"]{color:var(--ink);font-weight:600;}
/* scramble: letras intermedias atenuadas + palabra final en azul ØDIN */
.navlink{display:inline-block;text-align:center;white-space:nowrap;overflow:hidden;}
.navlink .dud{color:var(--ink-3);opacity:.8;}
.navlink.nav-hot{color:var(--nav-accent);}
.sep{color:var(--line);font-weight:300;}
.toggle{
  width:34px;height:34px;background:transparent;border:.5px solid var(--line);
  border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;
  color:var(--ink-2);transition:all .2s var(--ease);flex-shrink:0;
}
.toggle:hover{color:var(--ink);border-color:var(--ink-3);}
.toggle svg{width:15px;height:15px;}

/* ===== MENÚ (4 cuadraditos que se juntan en hover) ===== */
.menu-wrap{position:relative;flex-shrink:0;}
.menu-btn{position:relative;width:34px;height:34px;background:transparent;border:.5px solid var(--line);border-radius:4px;cursor:pointer;padding:0;transition:border-color .2s var(--ease);}
.menu-btn:hover{border-color:var(--ink-3);}
.menu-btn span{position:absolute;width:7px;height:7px;background:var(--ink-2);transition:all .3s var(--ease);}
.menu-btn span:nth-child(1){top:8px;left:8px;}
.menu-btn span:nth-child(2){top:8px;right:8px;}
.menu-btn span:nth-child(3){bottom:8px;left:8px;}
.menu-btn span:nth-child(4){bottom:8px;right:8px;}
.menu-btn:hover span,.menu-wrap.open .menu-btn span{top:50%;left:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);background:var(--ink);}
.menu-panel{position:absolute;top:calc(100% + 12px);right:0;min-width:168px;background:var(--surface);border:.5px solid var(--line);border-radius:5px;padding:6px;display:none;flex-direction:column;gap:2px;box-shadow:0 12px 30px rgba(0,0,0,.12);z-index:80;}
.menu-wrap.open .menu-panel{display:flex;}
.menu-row{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:10px 13px;background:transparent;border:none;cursor:pointer;font-family:'Josefin Sans';font-size:11px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--ink-2);}
.menu-row:hover{background:var(--line-soft);color:var(--ink);}
.menu-row .mr-val{font-family:'Josefin Slab',serif;font-size:10px;font-weight:700;letter-spacing:1px;color:var(--ink-3);}
.menu-nav{display:none;flex-direction:column;gap:2px;padding-bottom:6px;margin-bottom:6px;border-bottom:.5px solid var(--line);}
.menu-navlink{padding:10px 13px;font-family:'Josefin Sans';font-size:12px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--ink-2);text-decoration:none;}
.menu-navlink:hover{background:var(--line-soft);color:var(--ink);}
.menu-navlink[aria-current="page"]{color:var(--ink);}

/* ===== BOTONES ===== */
.btn{
  position:relative;font-family:'Josefin Sans';font-size:12px;
  font-weight:600;letter-spacing:2.5px;cursor:pointer;
  padding:14px 30px;border:none;
  transition:all .2s var(--ease);
  display:inline-flex;align-items:center;justify-content:center;
  text-decoration:none;
  --cut:13px;
}
/* Un solo corte por botón. En par: izq corta abajo-izq, der corta arriba-der; el medio queda recto. */
.btn--cl{clip-path:polygon(0 0, 100% 0, 100% 100%, var(--cut) 100%, 0 calc(100% - var(--cut)));}
.btn--cr{clip-path:polygon(0 0, calc(100% - var(--cut)) 0, 100% var(--cut), 100% 100%, 0 100%);}
/* sin corchetes: el corte diagonal es el detalle */
.btn-solid::before,.btn-solid::after,.btn-ghost::before,.btn-ghost::after,.btn-card::before,.btn-card::after{display:none;}
.btn-solid{background:var(--btn-bg);color:var(--btn-fg);}
.btn-solid::before,.btn-solid::after{content:'';position:absolute;top:7px;bottom:7px;width:1.5px;background:var(--btn-fg);opacity:0;transition:all .2s var(--ease);}
.btn-solid::before{left:9px;}
.btn-solid::after{right:9px;}
.btn-solid:hover::before,.btn-solid:hover::after{opacity:.55;}
.btn-solid:hover::before{left:13px;}
.btn-solid:hover::after{right:13px;}
.btn-solid:active{transform:scale(.98);}
.btn-ghost{background:var(--brand);color:#fff;}
.btn-ghost:hover{background:#0a26b3;color:#fff;}
.btn-ghost:active{transform:scale(.98);}

/* ===== STAGE (scroll lateral, sin vertical) ===== */
.stage{
  position:fixed;inset:0;
  overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x proximity;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.stage::-webkit-scrollbar{display:none;}
.track{display:flex;height:100%;align-items:stretch;}
.panel{
  flex:0 0 auto;height:100%;
  display:flex;flex-direction:column;justify-content:center;
  padding:var(--hdr-h) clamp(28px,6vw,96px) var(--bar-h) var(--iso-end);  /* contenido alineado al fin del isotipo */
  scroll-snap-align:start;
}
.panel--full{width:100vw;}
.panel--content{width:min(94vw,760px);border-left:.5px solid var(--line);}
.panel--content:first-child{border-left:none;}

/* ===== HERO (Heim) ===== */
.eyebrow{font-family:'Josefin Sans';font-size:11px;font-weight:700;letter-spacing:4px;color:var(--ink-3);margin-bottom:22px;}
.hero{
  max-width:1060px;display:grid;align-items:center;
  grid-template-columns:1.1fr .9fr;column-gap:clamp(40px,5.5vw,100px);
  grid-template-areas:"title desc" "actions desc" "dots desc";
}
.hero h1{
  grid-area:title;
  font-family:'Josefin Sans',sans-serif;font-weight:600;
  font-size:clamp(2.5rem,6.5vw,5.25rem);
  line-height:1.02;letter-spacing:-.5px;color:var(--ink);margin-bottom:26px;
}
.hero p{
  grid-area:desc;align-self:center;
  font-family:'Montserrat';font-weight:300;
  font-size:clamp(.9375rem,1.4vw,1.0625rem);line-height:1.7;color:var(--ink-2);
  max-width:40ch;margin-bottom:0;
}
.hero-actions{grid-area:actions;display:flex;gap:12px;flex-wrap:wrap;}
/* dots de navegación del titular ciclante */
.hero-dots{grid-area:dots;display:flex;gap:11px;margin-top:clamp(26px,5vh,48px);}
.hero-dot{width:8px;height:8px;border-radius:50%;border:1px solid var(--ink-3);background:transparent;cursor:pointer;padding:0;transition:background .25s var(--ease),border-color .25s var(--ease),transform .25s var(--ease);}
.hero-dot:hover{border-color:var(--ink);transform:scale(1.25);}
.hero-dot.on{background:var(--ink);border-color:var(--ink);}
.scroll-hint{
  margin-top:clamp(28px,5vh,56px);
  font-family:'Josefin Slab',serif;font-size:12.5px;font-weight:700;letter-spacing:2px;color:var(--ink-2);
  display:inline-flex;align-items:center;gap:10px;
}
.scroll-hint .arr{display:inline-block;animation:nudge 1.8s var(--ease) infinite;}
@keyframes nudge{0%,100%{transform:translateX(0);}50%{transform:translateX(6px);}}

/* ===== FIGURA ØDIN (marca de agua, cortada vertical, derecha de Heim) ===== */
.odin-figure{
  position:fixed;right:0;bottom:0;height:94vh;aspect-ratio:861/1850;
  transform:translateX(44%);z-index:0;pointer-events:none;
  background:var(--mark);
  -webkit-mask:url(assets/odin-drawing.svg) no-repeat center / contain;
          mask:url(assets/odin-drawing.svg) no-repeat center / contain;
  transition:background .4s var(--ease);
}

/* ===== PANELES DE CONTENIDO (Saga / Band) ===== */
.p-index{font-family:'Josefin Slab',serif;font-size:12.5px;font-weight:700;letter-spacing:1px;color:var(--data);margin-bottom:18px;}
.p-label{font-family:'Josefin Sans';font-weight:700;text-transform:uppercase;letter-spacing:3px;font-size:12.5px;color:var(--ink-3);margin-bottom:20px;}
.p-title{font-family:'Josefin Sans',sans-serif;font-weight:600;font-size:clamp(2rem,4.4vw,3.4rem);line-height:1.04;letter-spacing:-.5px;color:var(--ink);margin-bottom:24px;}
.p-text{font-family:'Montserrat';font-weight:300;font-size:clamp(.95rem,1.3vw,1.0625rem);line-height:1.7;color:var(--ink-2);max-width:44ch;}
/* ===== ACORDEÓN (Saga · Qué hacemos) — palabra + "+", explicación debajo ===== */
.acc{display:flex;flex-direction:column;margin-top:8px;border-top:.5px solid var(--line);}
.acc-item{border-bottom:.5px solid var(--line);}
.acc-head{width:100%;background:none;border:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 0;text-align:left;}
.acc-word{font-family:'Josefin Sans';font-weight:500;text-transform:uppercase;letter-spacing:1.5px;font-size:.98rem;color:var(--ink);transition:color .2s var(--ease);}
.acc-head:hover .acc-word{color:var(--nav-accent);}
.acc-ico{position:relative;width:15px;height:15px;flex-shrink:0;transition:transform .32s var(--ease);}
.acc-ico::before,.acc-ico::after{content:'';position:absolute;background:var(--ink-3);transition:background .2s var(--ease);}
.acc-ico::before{top:50%;left:0;right:0;height:1.5px;transform:translateY(-50%);}
.acc-ico::after{left:50%;top:0;bottom:0;width:1.5px;transform:translateX(-50%);}
.acc-head:hover .acc-ico::before,.acc-head:hover .acc-ico::after{background:var(--nav-accent);}
.acc-head[aria-expanded="true"] .acc-ico{transform:rotate(45deg);}   /* + → × */
.acc-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .38s var(--ease);}
.acc-head[aria-expanded="true"] + .acc-panel{grid-template-rows:1fr;}
.acc-inner{overflow:hidden;}
.acc-inner p{font-family:'Montserrat';font-weight:300;font-size:.92rem;line-height:1.6;color:var(--ink-2);max-width:42ch;padding-bottom:18px;}

/* ===== SCRIM ===== */
.scrim{
  position:fixed;inset:0;z-index:72;background:rgba(0,0,0,.32);
  opacity:0;visibility:hidden;transition:opacity .4s var(--ease),visibility .4s var(--ease);
}
body.contact-open .scrim{opacity:1;visibility:visible;}

/* ===== DECK — footer que es el header de una card que sube ===== */
.deck{
  position:fixed;left:var(--deck-m);right:var(--deck-m);bottom:var(--deck-m);z-index:74;
  height:var(--head-h);box-sizing:border-box;
  background:var(--card-bg);color:var(--card-ink);
  border:.5px solid var(--line);border-radius:var(--bar-radius);overflow:hidden;
  display:flex;flex-direction:column;
  transition:height .55s var(--ease),background .4s var(--ease);
  box-shadow:0 12px 40px rgba(0,0,0,.10);
}
body.contact-open .deck{height:var(--deck-h);}

.deck-chevron{
  position:fixed;left:50%;bottom:calc(var(--deck-m) + var(--head-h) + 8px);z-index:95;
  transform:translateX(-50%);
  width:46px;height:26px;display:flex;align-items:center;justify-content:center;
  background:transparent;border:none;cursor:pointer;color:var(--ink-3);
  transition:transform .55s var(--ease),color .2s var(--ease);
}
.deck-chevron:hover{color:var(--ink);}
.deck-chevron svg{width:20px;height:20px;transition:transform .45s var(--ease);}
.deck-chevron:hover svg{transform:translateY(-2px);}
body.contact-open .deck-chevron{transform:translateX(-50%) translateY(calc(-1 * (var(--deck-h) - var(--head-h))));}
body.contact-open .deck-chevron svg{transform:rotate(180deg);}
body.contact-open .deck-chevron:hover svg{transform:rotate(180deg) translateY(-2px);}

.deck-head{
  flex:none;height:var(--head-h);
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  padding:0 var(--hdr-pad);   /* misma sangría que el header → fecha bajo el isotipo, USD bajo el menú */
  font-family:'Josefin Slab',serif;font-size:12px;font-weight:700;letter-spacing:.5px;color:var(--card-ink-2);
}
.deck-head #env{text-align:left;}
.deck-head .deck-copy{text-align:center;white-space:nowrap;color:var(--card-ink);letter-spacing:1.5px;}
.deck-head #usd{text-align:right;}

.deck-body{
  flex:1;min-height:0;position:relative;overflow:hidden;
  display:flex;flex-direction:column;
  padding:clamp(24px,3vw,38px) var(--hdr-pad) 0;   /* misma grilla que la fecha/USD */
}
/* línea divisoria: alineada a la grilla del isotipo → izq bajo la fecha/temperatura, der bajo el USD */
.deck-body::before{content:'';position:absolute;top:0;left:var(--hdr-pad);right:var(--hdr-pad);height:.5px;background:color-mix(in srgb,var(--card-ink) 16%,transparent);}
.deck-cols{display:flex;justify-content:space-between;gap:clamp(24px,5vw,60px);}
.deck-col{display:flex;flex-direction:column;gap:10px;align-items:flex-start;}
.deck-col:last-child{align-items:flex-end;text-align:right;}
.dc-link{font-family:'Montserrat';font-weight:400;font-size:clamp(.85rem,1.1vw,.98rem);color:var(--card-ink);text-decoration:none;opacity:.82;transition:color .2s var(--ease),opacity .2s var(--ease);display:inline-block;}
.dc-link:hover{opacity:1;}
.dc-link.nav-hot{color:var(--card-accent);opacity:1;}
.dc-link .dud{color:var(--card-ink-2);opacity:.85;}
.dc-muted{font-family:'Montserrat';font-weight:400;font-size:clamp(.85rem,1.1vw,.98rem);color:var(--card-ink);opacity:.82;}

/* ØDIN troquelado GRANDE, ancho = span de la línea, cortado abajo del todo */
.logomatrix{
  position:absolute;left:var(--hdr-pad);right:var(--hdr-pad);bottom:0;height:clamp(150px,22vh,210px);
  transform:translateY(50%); /* medio del logotipo alineado a la base de la isla, mitad inferior cortada */
  opacity:0;transition:opacity .6s var(--ease);pointer-events:none;
  -webkit-mask:url(logo-mask.svg) no-repeat center bottom / contain;
          mask:url(logo-mask.svg) no-repeat center bottom / contain;
}
body.contact-open .logomatrix{opacity:1;}
.logomatrix canvas{width:100%;height:100%;display:block;}

/* ===== CHAT / POPUP DE WHATSAPP ===== */
.wa-pop{position:fixed;inset:0;z-index:200;display:none;}
.wa-pop.on{display:block;}
.wa-scrim{position:absolute;inset:0;background:rgba(0,0,0,.42);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;transition:opacity .25s var(--ease);}
.wa-pop.on .wa-scrim{opacity:1;}
.wa-card{
  position:absolute;right:clamp(14px,2vw,28px);bottom:clamp(14px,2vw,28px);
  width:min(360px,calc(100vw - 28px));
  background:var(--surface);color:var(--ink);
  border:.5px solid var(--line);border-radius:var(--bar-radius);overflow:hidden;
  box-shadow:0 18px 50px rgba(0,0,0,.22);
  transform:translateY(16px) scale(.98);opacity:0;transition:transform .3s var(--ease),opacity .3s var(--ease);
}
.wa-pop.on .wa-card{transform:none;opacity:1;}
.wa-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;background:var(--brand);color:#fff;}
.wa-id{display:flex;align-items:center;gap:10px;}
.wa-dot{width:9px;height:9px;border-radius:50%;background:#36d65a;box-shadow:0 0 0 3px rgba(54,214,90,.25);flex-shrink:0;}
.wa-id b{font-family:'Josefin Sans';font-weight:600;letter-spacing:1px;font-size:.95rem;display:block;}
.wa-id i{font-family:'Montserrat';font-style:normal;font-weight:300;font-size:.74rem;opacity:.85;}
.wa-x{background:none;border:none;color:#fff;font-size:24px;line-height:1;cursor:pointer;padding:0 2px;opacity:.85;}
.wa-x:hover{opacity:1;}
.wa-body{padding:16px;}
.wa-intro{font-family:'Montserrat';font-weight:300;font-size:.86rem;line-height:1.5;color:var(--ink-2);margin-bottom:14px;}
.wa-form{display:flex;flex-direction:column;gap:10px;}
.wa-form label{display:flex;flex-direction:column;gap:5px;font-family:'Josefin Sans';font-weight:600;text-transform:uppercase;letter-spacing:1.5px;font-size:10.5px;color:var(--ink-3);}
.wa-form input,.wa-form textarea{
  font-family:'Montserrat';font-weight:400;font-size:.9rem;color:var(--ink);
  background:var(--bg);border:.5px solid var(--line);border-radius:5px;padding:9px 11px;width:100%;resize:none;
  transition:border-color .2s var(--ease);
}
.wa-form input:focus,.wa-form textarea:focus{outline:none;border-color:var(--brand);}
.wa-send{margin-top:4px;width:100%;}
.wa-msg{font-family:'Montserrat';font-size:.8rem;min-height:1em;}
.wa-msg.err{color:#c0392b;}
.wa-msg.ok{color:#1f9d4d;}

/* ===== PANELES SPLIT (texto + visual) ===== */
.panel--split{
  width:100vw;display:grid;grid-template-columns:1.05fr 1fr;
  gap:clamp(36px,5vw,96px);align-items:center;
}
.panel--split.reverse .split-visual{order:-1;}
.split-text{max-width:34rem;}
.split-visual{height:100%;display:flex;align-items:center;}
.frame{
  position:relative;width:100%;height:min(60vh,520px);
  border:.5px solid var(--line);border-radius:5px;overflow:hidden;
  background:var(--surface);display:flex;align-items:center;justify-content:center;
  transition:background .4s var(--ease),border-color .4s var(--ease);
}
.frame .fiso{width:46%;opacity:.06;}
.frame .fiso svg{width:100%;height:100%;}
.frame .flabel{position:absolute;left:16px;bottom:14px;font-family:'Josefin Slab',serif;font-size:11px;font-weight:700;letter-spacing:1px;color:var(--ink-3);}

/* Saga · landing: la cara de ØDIN (mismo dibujo del home), cortada; se completa al hacer scroll */
.split-visual--face{overflow:visible;align-items:center;justify-content:flex-end;}
.saga-face{
  height:min(92vh,820px);aspect-ratio:861/1850;flex:none;
  background:var(--mark);
  -webkit-mask:url(assets/odin-drawing.svg) no-repeat center / contain;
          mask:url(assets/odin-drawing.svg) no-repeat center / contain;
  transform:translateX(30%);   /* cortada a la derecha */
  transition:background .4s var(--ease);pointer-events:none;
}

/* ===== TRIADA (Misión · Visión · Valores) ===== */
.panel--triple{width:100vw;padding-left:clamp(28px,6vw,96px);}   /* full-width → snap limpio, sin retazo del panel anterior */
.triad{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(30px,4vw,72px);width:100%;max-width:1180px;margin:0 auto;align-items:start;}
.triad .col .p-label{margin-bottom:14px;}
.triad .t-title{font-family:'Josefin Sans';font-weight:600;font-size:clamp(1.3rem,2vw,1.7rem);line-height:1.08;letter-spacing:-.3px;color:var(--ink);margin-bottom:16px;}
.triad .t-text{font-family:'Montserrat';font-weight:300;font-size:.95rem;line-height:1.65;color:var(--ink-2);}
.vals{display:flex;flex-direction:column;}
.vals .v{padding:9px 0;border-bottom:.5px solid var(--line);font-family:'Josefin Sans';font-weight:500;text-transform:uppercase;letter-spacing:1.5px;font-size:.82rem;color:var(--ink);}
.vals .v:first-child{border-top:.5px solid var(--line);}

/* ===== BAND — grilla de clientes/proveedores ===== */
.logos{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:.5px solid var(--line);border-radius:5px;overflow:hidden;width:100%;}
.logo-cell{background:var(--bg);aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;font-family:'Josefin Sans';font-weight:500;letter-spacing:1.5px;font-size:11px;color:var(--ink-3);transition:background .3s var(--ease),color .3s var(--ease);}
.logo-cell:hover{background:var(--surface);color:var(--ink);}

/* ===== BAND · página estática: título fijo (izq) + dial 3D de marcas (der) ===== */
.band-page{
  position:fixed;inset:0;display:grid;grid-template-columns:1fr 1fr;align-items:center;
  gap:clamp(30px,6vw,90px);
  padding:var(--hdr-h) clamp(28px,6vw,96px) var(--bar-h);
}
.band-left .p-label{margin-bottom:18px;}
.band-left h1{font-family:'Josefin Sans',sans-serif;font-weight:600;font-size:clamp(2.6rem,6vw,5rem);line-height:1.02;letter-spacing:-.5px;color:var(--ink);}
.band-dial{height:100%;display:flex;align-items:center;justify-content:center;perspective:1200px;overflow:hidden;}
.dial-item{
  display:block;text-decoration:none;color:var(--ink);max-width:34ch;
  transform-style:preserve-3d;backface-visibility:hidden;will-change:transform,opacity;
}
.dial-logo{font-family:'Josefin Sans';font-weight:600;font-size:clamp(1.9rem,3.8vw,3rem);letter-spacing:-.3px;line-height:1.05;color:var(--ink);margin-bottom:16px;}
.dial-text{font-family:'Montserrat';font-weight:300;font-size:clamp(.92rem,1.25vw,1.05rem);line-height:1.65;color:var(--ink-2);}
.dial-cta{margin-top:20px;font-family:'Josefin Sans';font-weight:600;font-size:10px;letter-spacing:2.5px;text-transform:uppercase;color:var(--ink-3);transition:color .2s var(--ease);}
.dial-item:hover .dial-cta{color:var(--ink);}

/* ===== BIFRÖST ===== */
body[data-page="bifrost"] .bifrost-home{position:fixed;top:22px;left:22px;z-index:80;width:34px;height:34px;border-radius:4px;}
.bifrost{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(26px,7vh,72px);overflow:hidden;}
.bifrost .b-eyebrow{font-family:'Josefin Sans';font-weight:600;letter-spacing:4px;font-size:10px;color:var(--ink-3);text-transform:uppercase;opacity:0;transform:translateY(20px);transition:opacity .8s var(--ease),transform .8s var(--ease);}
.gate{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;text-decoration:none;transform:translateY(120%);opacity:0;transition:transform .85s var(--ease),opacity .85s var(--ease);}
.gate .g-word{font-family:'Josefin Sans',sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:3px;font-size:clamp(2.4rem,7vw,4.75rem);line-height:1;color:var(--ink-3);transition:color .25s var(--ease);}
.gate .g-cap{font-family:'Josefin Slab',serif;font-size:10px;letter-spacing:2px;color:var(--ink-3);opacity:0;transition:opacity .3s var(--ease);}
.gate:hover .g-word{color:var(--ink);}
.gate:hover .g-cap{opacity:1;}
body[data-page="bifrost"].ready .b-eyebrow{opacity:1;transform:none;}
body[data-page="bifrost"].ready .gate{transform:none;opacity:1;}
body[data-page="bifrost"].ready .gate:nth-of-type(1){transition-delay:.15s;}
body[data-page="bifrost"].ready .gate:nth-of-type(2){transition-delay:.3s;}

/* ===== RESPONSIVE — MOBILE (scroll vertical, todo más grande) ===== */
@media (max-width:768px){
  /* scroll vertical normal */
  html,body{height:auto;min-height:100%;overflow-x:hidden;overflow-y:auto;}

  /* ---- HEADER: más alto + logo más grande; todo el nav va al menú ---- */
  .hdr{left:14px;right:14px;transform:none;width:auto;justify-content:space-between;top:14px;height:76px;padding:0 18px;}
  .hdr .nav-links{display:none;}
  .iso{width:48px;height:48px;border-radius:6px;}
  .iso svg{width:33px;height:33px;}
  .menu-btn{width:48px;height:48px;border-radius:6px;}
  .menu-btn span{width:9px;height:9px;}
  .menu-btn span:nth-child(1){top:13px;left:13px;}
  .menu-btn span:nth-child(2){top:13px;right:13px;}
  .menu-btn span:nth-child(3){bottom:13px;left:13px;}
  .menu-btn span:nth-child(4){bottom:13px;right:13px;}

  /* ---- MENÚ: dropdown ancho hacia abajo (4 palabras + tema + sonido) ---- */
  .menu-panel{
    position:fixed;top:calc(14px + 76px + 10px);left:14px;right:14px;min-width:0;
    padding:8px;border-radius:var(--bar-radius);box-shadow:0 16px 40px rgba(0,0,0,.16);
  }
  .menu-nav{display:flex;border-bottom:.5px solid var(--line);margin-bottom:6px;padding-bottom:6px;}
  .menu-navlink{font-size:18px;letter-spacing:2.5px;padding:17px 16px;}
  .menu-row{font-size:14px;letter-spacing:2.5px;padding:17px 16px;}
  .menu-row .mr-val{font-size:12px;}

  /* ---- DIBUJO DE ØDIN de fondo (faint), detrás del contenido (solo home) ---- */
  .odin-figure{display:block;position:fixed;top:50%;left:50%;right:auto;bottom:auto;
    transform:translate(-50%,-48%);height:60vh;aspect-ratio:861/1850;z-index:0;opacity:1;}

  /* ---- STAGE: lateral -> apilado vertical ---- */
  .stage{position:static;overflow:visible;height:auto;scroll-snap-type:none;}
  .track{flex-direction:column;height:auto;}
  .panel{position:relative;z-index:1;width:100% !important;height:auto;min-height:auto;border-left:none;
    justify-content:flex-start;padding:clamp(104px,16vh,132px) 22px clamp(48px,8vh,72px);}
  .panel--content,.panel--triple,.panel--split{width:100% !important;}
  .panel--split{grid-template-columns:1fr;gap:10px;}
  .split-visual{display:none;}
  .triad{grid-template-columns:1fr;gap:30px;}
  .logos{grid-template-columns:repeat(2,1fr);width:100%;}

  /* ---- HERO: centrado X/Y y grande (palabra, explicación, botones) ---- */
  .panel--full{min-height:100vh;justify-content:center;}
  .hero{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:none;}
  .hero h1{font-size:clamp(2.6rem,11vw,3.4rem);line-height:1.02;letter-spacing:-1px;margin-bottom:22px;overflow-wrap:anywhere;}
  .hero p{font-size:1.18rem;line-height:1.6;max-width:34ch;margin-bottom:32px;color:var(--ink-2);}
  .hero-actions{flex-direction:column;align-items:center;gap:14px;margin-bottom:0;}
  .hero-dots{justify-content:center;margin-top:clamp(30px,5vh,44px);}

  /* botones más grandes */
  .btn{font-size:13.5px;letter-spacing:2px;padding:18px 36px;}

  /* títulos/textos de secciones más grandes */
  .p-title{font-size:clamp(2.4rem,11vw,3.4rem);}
  .p-text,.t-text{font-size:1.12rem;line-height:1.7;}
  .p-label{font-size:13px;}
  .acc-word{font-size:1.18rem;}
  .acc-inner p{font-size:1.02rem;}

  /* band: apilado, aliados en lista (más grande) */
  .band-page{position:relative;z-index:1;height:auto;grid-template-columns:1fr;gap:24px;
    padding:clamp(104px,16vh,132px) 22px clamp(48px,8vh,72px);}
  .band-left h1{font-size:clamp(2.6rem,12vw,3.6rem);}
  .band-dial{display:block;height:auto;min-height:0;overflow:visible;perspective:none;}
  .band-dial .ally{display:block;text-decoration:none;padding:22px 0;border-top:.5px solid var(--line);}
  .band-dial .ally:last-child{border-bottom:.5px solid var(--line);}
  .band-dial .dial-logo{font-size:1.7rem;margin-bottom:10px;}
  .band-dial .dial-text{font-size:1.05rem;}

  /* bifrost: estático, gates grandes */
  body[data-page="bifrost"] .bifrost{position:relative;z-index:1;height:auto;min-height:84vh;padding:120px 24px 70px;}
  .gate .g-word{font-size:clamp(3rem,16vw,4.6rem);}

  /* ---- FOOTER (deck): franja ≈ alto del header; 2 columnas; texto más grande ---- */
  .scrim{display:none;}
  .deck-chevron{display:none;}
  /* card flotante (estilo HG): margen + radio 16 + fondo oscuro + logotipo cortado abajo */
  .deck{position:relative;z-index:1;left:auto;right:auto;bottom:auto;transform:none !important;height:auto;
        margin:6px 18px 18px;border-radius:16px;border:.5px solid var(--line);overflow:hidden;
        box-shadow:0 14px 44px rgba(0,0,0,.16);}
  .deck-head{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;
    height:auto;min-height:72px;padding:16px 22px;}
  .deck-head #env,.deck-head .deck-copy,.deck-head #usd{text-align:left;font-size:12px;}
  .deck-body{display:block;padding:26px 22px 0;}
  .deck-body::before{left:22px;right:22px;}
  .deck-cols{display:flex;flex-direction:row;justify-content:space-between;gap:18px;}
  .deck-col{gap:14px;}
  .deck-col:last-child{align-items:flex-end;text-align:right;}
  .dc-link,.dc-muted{font-size:14px;}
  .logomatrix{position:relative;left:auto;right:auto;bottom:auto;height:170px;margin-top:34px;transform:translateY(26%);}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important;}
}