/* NIBELVIT — sistema visual v3 */
:root{
  --papel:#F7F7F4; --hueso:#EFEEE8; --blanco:#FFFFFF;
  --tinta:#26251E; --tinta-2:#3A392F; --tinta-suave:#6F6D63;
  --filete:#E3E2DC; --filete-fuerte:#D3D2C9;
  --noche:#1A1A17; --noche-2:#24231F; --noche-borde:#33322C; --noche-texto:#CFCEC6;
  --fucsia:#A6246B;
  --salvia:#8FB3A4; --lila:#B9A7D6; --arena:#E3B38C;
  --ancho:1300px; --prosa:62ch;
  --curva:cubic-bezier(.23,1,.32,1);
  --sans:'Instrument Sans',system-ui,-apple-system,'Segoe UI',Helvetica,Arial,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --serif:'Instrument Serif',Iowan Old Style,Palatino,Georgia,serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--papel);color:var(--tinta);
  font:400 16px/1.55 var(--sans);letter-spacing:-.006em;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
p{margin:0 0 1em}
h1,h2,h3,h4{margin:0;font-weight:500;letter-spacing:-.025em;line-height:1.14}
h1{font-size:clamp(29px,3.6vw,42px)}
h2{font-size:clamp(22px,2.3vw,27px);letter-spacing:-.022em}
h3{font-size:18px;letter-spacing:-.015em}
small,.chico{font-size:13px}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:0;color:var(--tinta-suave)}
:focus-visible{outline:2px solid var(--fucsia);outline-offset:3px;border-radius:3px}
::selection{background:#E8D3DF;color:var(--tinta)}

.env{max-width:var(--ancho);margin-inline:auto;padding-inline:20px}
.seccion{padding-block:clamp(52px,6.4vw,86px)}
.seccion--ap{padding-block:clamp(34px,4vw,54px)}
.prosa{max-width:var(--prosa)}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.saltar{position:absolute;left:-9999px;top:0;background:var(--tinta);color:var(--papel);padding:10px 16px;border-radius:999px;font-size:13px;z-index:200}
.saltar:focus{left:12px;top:12px}

/* ---------- barra ---------- */
.barra{position:sticky;top:0;z-index:100;background:rgba(247,247,244,.86);backdrop-filter:saturate(180%) blur(12px);-webkit-backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid transparent;transition:border-color .25s ease,background-color .25s ease}
.barra.pegada{border-bottom-color:var(--filete)}
.barra-in{max-width:var(--ancho);margin-inline:auto;padding:0 20px;height:56px;display:flex;align-items:center;gap:28px}
.marca{display:inline-flex;align-items:center;gap:9px;font-size:15px;font-weight:600;letter-spacing:.02em}
.marca svg{width:19px;height:19px;flex:none}
.menu{display:flex;align-items:center;gap:4px;margin-left:8px}
.menu a{font-size:13.5px;color:var(--tinta-2);padding:7px 11px;border-radius:999px;transition:background-color .18s ease,color .18s ease}
.menu a:hover{background:var(--hueso);color:var(--tinta)}
.menu a[aria-current="page"]{color:var(--tinta);background:var(--hueso)}
.barra-fin{margin-left:auto;display:flex;align-items:center;gap:8px}
.hamb{display:none;margin-left:auto;width:40px;height:40px;align-items:center;justify-content:center;background:none;border:1px solid var(--filete);border-radius:999px;cursor:pointer;color:var(--tinta)}
.hamb span{display:block;width:15px;height:1.5px;background:currentColor;position:relative;transition:transform .2s var(--curva)}
.hamb span::before,.hamb span::after{content:"";position:absolute;left:0;width:15px;height:1.5px;background:currentColor;transition:transform .2s var(--curva),opacity .15s ease}
.hamb span::before{top:-5px}.hamb span::after{top:5px}
.hamb[aria-expanded="true"] span{transform:rotate(45deg)}
.hamb[aria-expanded="true"] span::before{transform:translateY(5px) rotate(-90deg)}
.hamb[aria-expanded="true"] span::after{opacity:0}
.movil{display:none;border-bottom:1px solid var(--filete);background:var(--papel)}
.movil.abierto{display:block}
.movil a{display:block;padding:13px 20px;border-top:1px solid var(--filete);font-size:16px}
.movil a:first-child{border-top:none}

/* ---------- botones ---------- */
.pill{display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:999px;
  padding:10px 18px;font:500 14px/1 var(--sans);letter-spacing:-.01em;border:1px solid transparent;cursor:pointer;
  transition:transform .16s var(--curva),background-color .2s ease,border-color .2s ease,color .2s ease}
.pill:active{transform:scale(.97)}
.pill-sol{background:var(--tinta);color:var(--papel)}
.pill-sol:hover{background:#3A392F}
.pill-lin{border-color:var(--filete-fuerte);color:var(--tinta)}
.pill-lin:hover{background:var(--hueso);border-color:var(--tinta-suave)}
.pill-claro{background:var(--papel);color:var(--tinta)}
.pill-claro:hover{background:#fff}
.enlace{border-bottom:1px solid var(--filete-fuerte);padding-bottom:1px;transition:border-color .2s ease,color .2s ease}
.enlace:hover{color:var(--fucsia);border-color:var(--fucsia)}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;padding-top:clamp(52px,7vw,96px);padding-bottom:clamp(120px,14vw,200px)}
.hero .env{position:relative;z-index:1}
.hero-fondo{position:absolute;left:0;right:0;top:0;height:min(128%,980px);z-index:0;pointer-events:none;
  background:
   radial-gradient(58% 68% at 10% 6%,#D4E6DA 0%,rgba(212,230,218,0) 62%),
   radial-gradient(54% 62% at 90% 0%,#E7D4E3 0%,rgba(231,212,227,0) 64%),
   radial-gradient(78% 76% at 62% 100%,#F4E2C9 0%,rgba(244,226,201,0) 62%),
   linear-gradient(180deg,#EDECE4 0%,#F7F7F4 88%);
  -webkit-mask-image:linear-gradient(180deg,#000 56%,rgba(0,0,0,0) 100%);
  mask-image:linear-gradient(180deg,#000 56%,rgba(0,0,0,0) 100%)}
.hero-fondo .relieve{position:absolute;left:0;right:0;bottom:0;width:100%;height:76%;opacity:.8}
.halo{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;pointer-events:none}
.halo-a{width:min(46vw,540px);height:320px;left:2%;top:4%;background:#B9D6C5}
.halo-b{width:min(40vw,460px);height:300px;right:4%;top:-4%;background:#DCC3D8}
@media (prefers-reduced-motion:no-preference){.hero-fondo{will-change:transform}}
.hero h1{max-width:19ch}
.hero .bajada{margin-top:18px;max-width:54ch;color:var(--tinta-suave);font-size:17px}
.hero-acc{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}

/* ---------- lienzo + paneles ---------- */
.lienzo{position:relative;border:1px solid var(--filete);border-radius:16px;overflow:hidden;
  background:
   radial-gradient(56% 74% at 12% 16%,#CFE0D4 0%,rgba(207,224,212,0) 64%),
   radial-gradient(50% 68% at 88% 10%,#E4D2DF 0%,rgba(228,210,223,0) 66%),
   radial-gradient(76% 94% at 64% 106%,#F0DFC7 0%,rgba(240,223,199,0) 64%),
   linear-gradient(176deg,#F1F0EA 0%,#E6E5DC 100%)}
.lienzo--hero{margin-top:clamp(30px,4vw,52px)}
.relieve{display:block;width:100%;height:clamp(230px,27vw,400px)}
.lienzo--hero .relieve{height:clamp(260px,31vw,440px)}
.relieve .capa{will-change:transform}
.filas--seco{border-top:none}
.filas--seco .fila{grid-template-columns:1fr;gap:5px;padding:16px 2px}
.filas--seco .fila:first-child{border-top:1px solid var(--filete)}
.lienzo::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='r'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23r)' opacity='.25'/%3E%3C/svg%3E")}
/* movimiento: filas que entran en cascada */
.filas.cascada>*{opacity:0;transform:translateY(10px)}
.filas.cascada.visible>*{opacity:1;transform:none;
  transition:opacity .5s ease,transform .55s var(--curva);transition-delay:calc(var(--i,0) * 55ms)}

/* movimiento: revelado del panel al entrar */
.revela{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .65s var(--curva)}
.revela.visible{opacity:1;transform:none}

/* movimiento: barrido de la cita */
.cita blockquote{clip-path:inset(0 100% 0 0);transition:clip-path .85s var(--curva)}
.cita.visible blockquote{clip-path:inset(0 0 0 0)}

/* ---------- ilustraciones por capas ---------- */
.ilu{position:absolute;inset:0;overflow:hidden;z-index:0;pointer-events:none}
.ilu .capa-ilu{position:absolute;left:-3%;width:106%;max-width:none;height:auto;bottom:0;will-change:transform}
.ilu .cielo-ilu{top:0;bottom:auto;height:100%;object-fit:cover;object-position:50% 40%}
.ilu--hero{top:auto;bottom:0;height:min(46%,330px);
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,0) 0%,#000 42%,#000 100%);
  mask-image:linear-gradient(180deg,rgba(0,0,0,0) 0%,#000 42%,#000 100%)}
.ilu--hero .cielo-ilu{object-position:50% 72%}
.cita--ilu{color:var(--tinta)}
.ilu--cita{-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,0),#000 24%,#000 78%,rgba(0,0,0,0));
  mask-image:linear-gradient(180deg,rgba(0,0,0,0),#000 24%,#000 78%,rgba(0,0,0,0));opacity:.85}
.ilu--cierre::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(26,26,23,.94) 0%,rgba(26,26,23,.72) 46%,rgba(26,26,23,.34) 100%)}
.ilu--cab{-webkit-mask-image:linear-gradient(180deg,#000 62%,rgba(0,0,0,0));
  mask-image:linear-gradient(180deg,#000 62%,rgba(0,0,0,0));opacity:.9}
.cab--ilu{padding-bottom:clamp(60px,8vw,110px)}
@media (max-width:860px){.ilu .capa-ilu{left:-14%;width:128%}}

/* ---------- auras de color y marcas dibujadas ---------- */
body{overflow-x:visible}
.seccion,.seccion--ap,.cita,.cab{position:relative;overflow:hidden}
.seccion>.env,.seccion--ap>.env,.cita>.env,.cab>.env{position:relative;z-index:1}
.aura{position:absolute;z-index:0;border-radius:50%;filter:blur(70px);pointer-events:none;opacity:.55;
  animation:deriva 26s ease-in-out infinite alternate;will-change:transform}
.aura-1{width:min(42vw,480px);height:340px;left:-7%;top:-8%;background:#B9DBCB}
.aura-2{width:min(38vw,440px);height:320px;right:-8%;top:4%;background:#E2C5DD;
  animation-duration:31s;animation-direction:alternate-reverse}
.aura-3{width:min(46vw,540px);height:360px;left:20%;bottom:-16%;background:#F2D9B6;animation-duration:36s}
.aura-4{width:min(34vw,400px);height:300px;right:10%;top:-14%;background:#CFCAE8;
  animation-duration:28s;animation-direction:alternate-reverse}
@keyframes deriva{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(4%,-5%,0) scale(1.1)}}

.deco{position:absolute;z-index:0;pointer-events:none}
.deco-destello{width:34px;height:34px;right:8%;top:58px;color:var(--fucsia);opacity:.42;animation:gira 20s linear infinite}
.deco-anillo{width:30px;height:30px;left:3%;bottom:54px;color:#7E9DBE;opacity:.5;animation:flota 9s ease-in-out infinite alternate}
.deco-onda{width:72px;height:26px;right:11%;bottom:44px;color:#C27FA3;opacity:.5}
.deco-cruz{width:15px;height:15px;right:14%;top:44px;color:var(--tinta);opacity:.22;animation:gira 30s linear infinite}
@keyframes gira{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@keyframes flota{from{transform:translateY(0)}to{transform:translateY(-10px)}}
@media (max-width:860px){.deco{display:none}.aura{opacity:.34;filter:blur(60px)}}

/* ---------- marquesina, chips, riel, luz ---------- */
.tira-marco{background:linear-gradient(180deg,#FBFAF7,#F3F2EC);border-top:1px solid var(--filete);border-bottom:1px solid var(--filete)}
.tira-marco .tira{border:none;padding-block:15px;flex-wrap:nowrap;gap:0 22px}
.marquesina{flex:1;min-width:0;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.marquesina-pista{display:flex;gap:36px;width:max-content;animation:correr 38s linear infinite}
.marquesina-pista span{font-size:13.5px;color:var(--tinta-suave);white-space:nowrap}
.marquesina:hover .marquesina-pista,.marquesina:focus-within .marquesina-pista{animation-play-state:paused}
@keyframes correr{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.chip{display:inline-block;font:500 11.5px/1 var(--mono);color:var(--tinta-2);padding:6px 11px;
  border-radius:999px;margin-bottom:13px;border:1px solid}
.chip-a{background:#E8F0EB;border-color:#CFE0D6}
.chip-b{background:#F1E9F0;border-color:#E1D3DF}
.chip-c{background:#F7EBDC;border-color:#EAD9C1}

.cols--riel{position:relative}
.cols--riel>.riel{padding:0;border-left:none}
.cols--riel>div:first-of-type{border-left:none;padding-left:4px}
.riel{position:absolute;left:0;right:0;top:0;height:1px;background:var(--filete);overflow:hidden;z-index:1}
.riel i{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,rgba(166,36,107,0),var(--fucsia),rgba(166,36,107,0));transition:width 1.6s var(--curva)}
.cols--riel.visible .riel i{width:100%}
.paso{position:relative}
.paso .nodo{position:absolute;left:-4px;top:-4.5px;width:9px;height:9px;border-radius:50%;background:var(--filete-fuerte);
  transition:background-color .45s ease,box-shadow .45s ease;transition-delay:var(--d,0s)}
.cols--riel.visible .paso .nodo{background:var(--fucsia);box-shadow:0 0 0 4px rgba(166,36,107,.13)}
.paso:nth-child(2) .nodo{--d:.25s}.paso:nth-child(3) .nodo{--d:.5s}
.paso:nth-child(4) .nodo{--d:.75s}.paso:nth-child(5) .nodo{--d:1s}

.cierre{position:relative;overflow:hidden}
.cierre .brillo{position:absolute;left:0;top:0;width:560px;height:560px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(190,70,130,.38),rgba(190,70,130,0) 62%);filter:blur(28px);
  opacity:0;transform:translate(-50%,-50%);transition:opacity .45s ease}
.cierre:hover .brillo{opacity:1}
.cierre .env{position:relative;z-index:1}

/* ---------- tiras y filetes ---------- */
.tira{display:flex;flex-wrap:wrap;gap:8px 26px;align-items:center;padding-block:18px;border-top:1px solid var(--filete);border-bottom:1px solid var(--filete)}
.tira span{font-size:13.5px;color:var(--tinta-suave)}
.tira .et{font-family:var(--mono);font-size:11.5px;color:var(--tinta-suave);margin-right:6px}

.filas{border-top:1px solid var(--filete)}
.fila{position:relative;display:grid;transition:background-color .22s ease,transform .22s var(--curva),box-shadow .28s ease;grid-template-columns:minmax(220px,.42fr) 1fr;gap:12px 32px;align-items:baseline;
  padding:19px 14px;border-bottom:1px solid var(--filete);transition:background-color .2s ease}
a.fila::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--fucsia);
  transform:scaleY(0);transform-origin:50% 100%;transition:transform .28s var(--curva)}
a.fila:hover::before{transform:scaleY(1)}
a.fila{border-radius:11px}
a.fila:hover{background:#FDFDFB;transform:translateY(-1px);
  box-shadow:0 1px 2px rgba(38,37,30,.04),0 16px 32px -20px rgba(38,37,30,.4)}
.filas--num .fila{grid-template-columns:52px 1fr;align-items:start;gap:12px 20px}
.filas--fecha .fila{grid-template-columns:150px 1fr;align-items:start}
.fila>div>h3{margin-bottom:5px}
.filas--num .fila h3{font-weight:400;letter-spacing:-.018em}
.fila .titulo{display:flex;align-items:center;gap:13px}
.fila .ico{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;flex:none;
  border:1px solid var(--filete);border-radius:10px;background:#FBFBF8;color:var(--tinta-2);
  transition:color .22s ease,border-color .22s ease,background-color .22s ease,transform .22s var(--curva)}
.fila .ico svg{width:19px;height:19px}
a.fila:hover .ico{color:var(--fucsia);border-color:#E4C6D8;background:#fff;transform:translateY(-1px)}
.fila h3{font-size:17px}
.fila p{margin:0;color:var(--tinta-suave);font-size:15px}
.fila .mono{align-self:center}

.cols{display:grid;grid-template-columns:repeat(var(--n,3),1fr);border-top:1px solid var(--filete);border-bottom:1px solid var(--filete)}
.cols>*{padding:26px 24px;border-left:1px solid var(--filete)}
.cols>*:first-child{border-left:none;padding-left:4px}
.cols h3{margin-bottom:9px}
.cols p{margin:0;color:var(--tinta-suave);font-size:15px}
.cols .n{font-family:var(--mono);font-size:11.5px;color:var(--tinta-suave);display:block;margin-bottom:12px}

.dos{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:center}
.dos--arriba{align-items:start}
.dos--texto-der{direction:rtl}
.dos--texto-der>*{direction:ltr}
.bloque-txt h2{margin-bottom:14px}
.bloque-txt p{color:var(--tinta-suave);max-width:46ch}
.bloque-txt .pill{margin-top:8px}

.lista-check{list-style:none;padding:0;margin:0}
.lista-check li{position:relative;padding:11px 0 11px 26px;border-top:1px solid var(--filete);font-size:15.5px}
.lista-check li::before{content:"";position:absolute;left:4px;top:19px;width:7px;height:7px;border-radius:50%;background:var(--tinta);opacity:.25}

.caja{border:1px solid var(--filete);border-radius:12px;padding:20px 22px;background:var(--hueso)}
.caja h4{font-family:var(--mono);font-weight:400;font-size:11.5px;color:var(--tinta-suave);margin-bottom:12px}
.caja ul{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.caja a{font-size:15px;border-bottom:1px solid transparent;transition:border-color .2s ease}
.caja a:hover{border-color:var(--tinta-suave)}

/* ---------- cita ---------- */
.cita{border-top:1px solid var(--filete);border-bottom:1px solid var(--filete);padding-block:clamp(44px,6vw,74px)}
.cita blockquote{margin:0;font-family:var(--serif);font-size:clamp(26px,3.3vw,38px);line-height:1.22;letter-spacing:-.015em;max-width:22ch}
.cita p{margin-top:18px;color:var(--tinta-suave);max-width:46ch}

/* ---------- opiniones ---------- */
.ops-cab{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:22px}
.ops-nav{display:flex;gap:8px}
.ops-nav button{width:36px;height:36px;border-radius:999px;border:1px solid var(--filete-fuerte);background:transparent;cursor:pointer;color:var(--tinta);display:grid;place-items:center;transition:background-color .2s ease,transform .16s var(--curva)}
.ops-nav button:hover{background:var(--hueso)}
.ops-nav button:active{transform:scale(.94)}
.carril{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(290px,1fr);gap:0;overflow-x:auto;scroll-snap-type:x mandatory;
  border-top:1px solid var(--filete);border-bottom:1px solid var(--filete);scrollbar-width:none}
.carril::-webkit-scrollbar{display:none}
.op{scroll-snap-align:start;padding:24px;border-left:1px solid var(--filete)}
.op:first-child{border-left:none;padding-left:4px}
.op p{font-size:15px;color:var(--tinta-2)}
.op .quien{font-size:14px;font-weight:500;margin-top:14px}
.estrellas{display:flex;gap:2px;margin-bottom:12px}
.estrellas svg{width:13px;height:13px}
.estrellas .ll{fill:var(--tinta)}
.estrellas .va{fill:none;stroke:var(--tinta);stroke-opacity:.3}
.promedio{font-family:var(--mono);font-size:12px;color:var(--tinta-suave)}

/* ---------- formularios ---------- */
.form{display:grid;gap:14px;max-width:520px}
.campo{display:grid;gap:6px}
.campo label{font-size:13.5px;color:var(--tinta-2)}
.campo label .op-txt{color:var(--tinta-suave)}
.campo input,.campo textarea,.campo select{font:400 15px/1.4 var(--sans);color:var(--tinta);background:var(--blanco);
  border:1px solid var(--filete-fuerte);border-radius:9px;padding:11px 13px;width:100%;
  transition:border-color .2s ease,box-shadow .2s ease}
.campo textarea{min-height:120px;resize:vertical}
.campo input:focus,.campo textarea:focus{outline:none;border-color:var(--tinta);box-shadow:0 0 0 3px rgba(38,37,30,.07)}
.campo .ayuda{font-size:12.5px;color:var(--tinta-suave)}
.campo .error{font-size:12.5px;color:#9B2226}
.hp{position:absolute;left:-9999px;opacity:0;height:0;width:0}
.aviso{font-size:14px;padding:11px 14px;border-radius:9px;border:1px solid var(--filete-fuerte);background:var(--hueso)}
.aviso[data-estado="ok"]{border-color:#BBD2C0;background:#EAF2EC}
.aviso[data-estado="mal"]{border-color:#E3C2C2;background:#F6EAEA}
.puntuar{display:flex;gap:4px}
.puntuar button{background:none;border:none;padding:3px;cursor:pointer;line-height:0}
.puntuar svg{width:22px;height:22px;fill:none;stroke:var(--tinta);stroke-opacity:.35;transition:fill .15s ease}
.puntuar button[data-on="1"] svg{fill:var(--tinta);stroke-opacity:1}

/* ---------- preguntas ---------- */
.preg{border-top:1px solid var(--filete)}
.preg details{border-bottom:1px solid var(--filete)}
.preg summary{list-style:none;cursor:pointer;padding:18px 14px;font-size:16.5px;display:flex;gap:16px;align-items:center;transition:background-color .2s ease}
.preg summary::-webkit-details-marker{display:none}
.preg summary:hover{background:var(--hueso)}
.preg summary::after{content:"";margin-left:auto;width:9px;height:9px;border-right:1.5px solid var(--tinta-suave);border-bottom:1.5px solid var(--tinta-suave);transform:rotate(45deg) translateY(-2px);transition:transform .2s var(--curva)}
.preg details[open] summary::after{transform:rotate(225deg) translateY(-2px)}
.preg .resp{padding:0 14px 20px;color:var(--tinta-suave);max-width:70ch}

/* ---------- pie ---------- */
.cierre{background:var(--noche);color:var(--noche-texto)}
.cierre .env{padding-block:clamp(56px,7vw,92px)}
.cierre h2{color:#F3F2EC;max-width:17ch;font-size:clamp(26px,3.4vw,40px)}
.cierre p{margin-top:16px;max-width:46ch}
.cierre .pill{margin-top:26px}
.pie{background:var(--noche);color:var(--noche-texto);border-top:1px solid var(--noche-borde)}
.pie .env{padding-block:44px}
.pie-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:32px}
.pie h4{font-family:var(--mono);font-weight:400;font-size:11.5px;color:#8C8B82;margin-bottom:12px}
.pie ul{list-style:none;padding:0;margin:0;display:grid;gap:9px}
.pie a{font-size:14px;color:var(--noche-texto);transition:color .18s ease}
.pie a:hover{color:#fff}
.pie .marca{color:#F3F2EC;font-size:15px}
.pie .desc{margin-top:14px;font-size:13.5px;max-width:34ch;color:#8C8B82}
.pie-fin{margin-top:38px;padding-top:20px;border-top:1px solid var(--noche-borde);display:flex;flex-wrap:wrap;gap:8px 24px;font-size:13px;color:#8C8B82}

/* ---------- interiores ---------- */
.ruta{font-family:var(--mono);font-size:11.5px;color:var(--tinta-suave);padding-top:26px}
.ruta a:hover{color:var(--tinta)}
.cab{padding-block:clamp(26px,3vw,40px) clamp(30px,4vw,48px);border-bottom:1px solid var(--filete)}
.cab h1{max-width:20ch}
.cab p{margin-top:16px;color:var(--tinta-suave);max-width:58ch;font-size:17px}
.art{max-width:68ch}
.art h2{margin:34px 0 12px}
.art p{color:var(--tinta-2)}
.art p:first-of-type{font-size:17.5px;color:var(--tinta)}
.meta{font-family:var(--mono);font-size:11.5px;color:var(--tinta-suave)}
.sig{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--filete)}
.sig a{padding:22px 18px 22px 0;border-right:1px solid var(--filete);transition:background-color .2s ease}
.sig a:last-child{border-right:none}
.sig a:hover{background:var(--hueso)}
.sig span{display:block;font-family:var(--mono);font-size:11px;color:var(--tinta-suave);margin-bottom:8px}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .menu{display:none}
  .barra-fin{display:none}
  .hamb{display:flex}
  .pie-grid{grid-template-columns:1fr 1fr;gap:28px}
}
@media (max-width:860px){
  .escena{position:static;height:auto;display:grid;gap:14px;margin:16px}
  .escena .panel{position:static;width:100%}
  .dos{grid-template-columns:1fr;gap:28px}
  .dos--texto-der{direction:ltr}
  .cols{grid-template-columns:1fr}
  .cols>*{border-left:none;border-top:1px solid var(--filete);padding:22px 4px}
  .cols>*:first-child{border-top:none;padding-left:4px}
  .fila{grid-template-columns:1fr;gap:8px;padding:17px 10px}
  .fila .ico{width:32px;height:32px}
  .fila .ico svg{width:17px;height:17px}
  .sig{grid-template-columns:1fr}
  .sig a{border-right:none;border-bottom:1px solid var(--filete);padding:18px 0}
  .sig a:last-child{border-bottom:none}
}
@media (max-width:860px){
  .cols--riel>.riel{left:0;right:auto;top:0;bottom:0;width:1px;height:auto}
  .cols--riel>.riel i{top:0;bottom:auto;left:0;width:100%;height:0;
    background:linear-gradient(180deg,rgba(166,36,107,0),var(--fucsia),rgba(166,36,107,.6));
    transition:height 1.6s var(--curva)}
  .cols--riel.visible>.riel i{height:100%}
  .cols--riel>div,.cols--riel>div:first-of-type{padding-left:24px}
  .cols--riel .paso .nodo{left:-4px;top:26px}
  .hero-fondo{height:min(118%,760px)}
  .tira-marco .tira{flex-wrap:wrap;gap:10px 16px}
}
@media (max-width:560px){
  body{font-size:16px}
  .op{min-width:82vw}
  .cita blockquote{max-width:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .escena .panel{opacity:1;transform:none}
  .revela{opacity:1;transform:none}
  .marquesina-pista{animation:none}
  .filas.cascada>*{opacity:1;transform:none}
  .cols--riel .riel i{width:100%}
  .cita blockquote{clip-path:none}
  .consola.tipeando>div{opacity:1}
  .consola .cursor-bl{opacity:1}
}
@media (hover:none){
  a.fila:hover,.preg summary:hover,.menu a:hover{background:transparent}
}