/* ORBIT® — Ideas in motion. Sistema visual del sitio. */
:root{
  --k:#0D0D0E; --b:#F2EFE8; --blue:#3047FF; --or:#FF4F2E; --ac:#D9FF45;
  --k2:#161617; --k3:#242426; --b2:#E4E0D6; --g:#8C8A84;
  --sans:"Inter Tight","Neue Montreal","Helvetica Neue",Arial,sans-serif;
  --serif:"Playfair Display","Canela",Georgia,"Times New Roman",serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --pad:clamp(16px,4vw,56px);
  --ease:cubic-bezier(.7,0,.2,1);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0}
body{background:var(--k);color:var(--b);font-family:var(--sans);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
[hidden]{display:none!important}
::selection{background:var(--blue);color:var(--b)}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
svg{display:block}

/* type */
.mono{font-family:var(--mono);font-size:11px;line-height:1.45;letter-spacing:.08em;text-transform:uppercase;font-weight:400}
.it{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.02em;text-transform:none}
.dim{opacity:.55}
.display{font-weight:800;text-transform:uppercase;letter-spacing:-.05em;line-height:.84;text-wrap:balance;margin:0}
/* con líneas apiladas y poco ancho, .84 le come la tilde a la Ñ y los signos de apertura */
@media (max-width:760px){.display{line-height:.94}}
.display .it{letter-spacing:-.03em}
.lead{font-size:clamp(17px,1.5vw,20px);line-height:1.45;max-width:46ch;text-wrap:pretty}
p{text-wrap:pretty}

/* layout */
.sec{position:relative;padding-inline:var(--pad);padding-block:clamp(72px,9vw,140px);overflow:hidden}
/* ---- área táctil mínima de 44×44 en pantallas de dedo ----
   No cambia lo que se ve: agranda la zona que recibe el toque con un recuadro
   invisible centrado sobre el control. Medido con Playwright, quedaban 53
   controles por debajo de 44 px (enlaces del pie, chips, flechas, la barra). */
@media (pointer:coarse){
  .foot .cols a, .drawer nav a, .langsw button, .nav .logo, .nav .cart-btn,
  .nav .acc-link, .nav .menu, .darrows button, .opts .chip, .drawer-top .chip,
  .puertas nav a{position:relative}
  .foot .cols a::after, .drawer nav a::after, .langsw button::after, .nav .logo::after,
  .nav .cart-btn::after, .nav .acc-link::after, .nav .menu::after, .darrows button::after,
  .opts .chip::after, .drawer-top .chip::after, .puertas nav a::after{
    content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
    width:max(100%,44px);height:max(100%,44px)}
  /* en los campos no sirve el pseudo-elemento: van con alto mínimo */
  input,textarea,select{min-height:44px}
}

/* Cada sección de la home mide una pantalla y centra su contenido: con el
   relleno de 140px encima quedaban casi 500px muertos entre una y otra. */
@media (min-width:1000px){
  [data-page="home"] main > section.sec:not(.hero){padding-block:clamp(48px,4.4vw,72px)}
}
.light{background:var(--b);color:var(--k)}
.dark{background:var(--k);color:var(--b)}
.wrap{max-width:1440px;width:100%;margin-inline:auto;position:relative}
.shead{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;padding-top:14px;border-top:1px solid currentColor;margin-bottom:clamp(36px,5vw,72px)}
.shead b{display:block;font-weight:500}

/* wordmark + symbol */
.wm{display:inline-flex;align-items:baseline;font-weight:900;letter-spacing:-.03em;line-height:.8;white-space:nowrap;font-family:var(--sans)}
.wm .o{width:.745em;height:.745em;margin-right:.03em;transform:translateY(.012em);overflow:visible;flex:none}
.wm sup{font-size:.16em;font-weight:600;letter-spacing:0;align-self:flex-start;margin-left:.12em;margin-top:.05em;line-height:1}
.sym{overflow:visible}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 20px;font-weight:600;font-size:15px;text-decoration:none;transition:transform .3s var(--ease),background .2s,color .2s;white-space:nowrap}
.btn .ar{transition:transform .3s var(--ease)}
.btn:hover .ar{transform:translateX(4px)}
.btn-acid{background:var(--ac);color:var(--k)}
.btn-blue{background:var(--blue);color:var(--b)}
.btn-line{border:1px solid currentColor}
.btn-line:hover{background:currentColor}
.dark .btn-line:hover{color:var(--k);background:var(--b)}
.light .btn-line:hover{color:var(--b);background:var(--k)}
.btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed}
.chip{display:inline-flex;align-items:center;gap:8px;border:1px solid currentColor;border-radius:999px;padding:7px 14px;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;transition:background .2s,color .2s}
.dark .chip[aria-pressed="true"],.dark .chip:hover{background:var(--b);color:var(--k)}
.light .chip[aria-pressed="true"],.light .chip:hover{background:var(--k);color:var(--b)}

/* nav */
.nav{position:fixed;left:0;right:0;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:calc(14px + env(safe-area-inset-top,0px)) var(--pad) 14px;color:#F2EFE8;background:transparent;border-bottom:1px solid transparent;transition:background .35s var(--ease),border-color .35s,backdrop-filter .35s}
.nav.solid{background:rgba(13,13,14,.78);-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3);border-bottom-color:rgba(242,239,232,.08)}
.nav .logo{text-decoration:none}
.nav .logo .wm{font-size:24px}
.nav ul{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.nav ul a{text-decoration:none;font-size:14px;font-weight:500;position:relative}
.nav ul a[aria-current="page"]::after,.nav ul a:hover::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1px;background:currentColor}
.nav .cta{border:1px solid currentColor;padding:8px 14px;font-size:13px;text-decoration:none;font-weight:500}
.nav .cta:hover{background:#F2EFE8;color:#0D0D0E}
.nav .menu{display:none;font-family:var(--mono);font-size:11px;letter-spacing:.08em;border:1px solid currentColor;padding:8px 12px;border-radius:999px}
.nav .right{display:flex;align-items:center;gap:16px}
.nav .acc-link{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid currentColor;transition:background .2s,color .2s}
.nav .acc-link svg{width:21px;height:21px}
.nav .acc-link:hover,.nav .acc-link:focus-visible{background:#F2EFE8;color:#0D0D0E}
.nav .acc-link.on{border-color:var(--ac);color:var(--ac)}
.nav .acc-link .ini{font-weight:800;font-size:15px;line-height:1;letter-spacing:-.02em;text-transform:uppercase}
.nav .acc-link.on:hover,.nav .acc-link.on:focus-visible{background:var(--ac);color:#0D0D0E}
.langsw{display:flex;align-items:center;gap:4px;font-family:var(--mono);font-size:11px;letter-spacing:.08em}
.langsw span{opacity:.4}
.langsw button{padding:4px 2px;opacity:.45;transition:opacity .2s}
.langsw button[aria-pressed="true"]{opacity:1;text-decoration:underline;text-underline-offset:4px}
.langsw button:hover{opacity:1}
@media (max-width:760px){.nav ul,.nav .cta{display:none}.nav .menu{display:block}}
.mnav{position:fixed;inset:0;z-index:60;background:var(--k);color:var(--b);padding:calc(90px + env(safe-area-inset-top,0px)) var(--pad) 40px;display:flex;flex-direction:column;justify-content:space-between}
.mnav a{display:block;text-decoration:none;font-weight:800;font-size:clamp(44px,12vw,80px);letter-spacing:-.05em;text-transform:uppercase;line-height:1;padding:8px 0;border-top:1px solid var(--k3)}
.mnav .x{position:absolute;right:var(--pad);top:calc(14px + env(safe-area-inset-top,0px))}

/* idioma: se muestra solo el texto del idioma activo */
html[data-lang="es"] [data-l="en"],html[data-lang="en"] [data-l="es"]{display:none!important}

/* pantalla de entrada */
html.gate-on{overflow:hidden}
html.gate-on body>main,html.gate-on body>.nav,html.gate-on body>.foot{visibility:hidden}
.gate{position:fixed;inset:0;z-index:100;background:var(--k);color:var(--b);display:flex;flex-direction:column;justify-content:space-between;padding:calc(20px + env(safe-area-inset-top,0px)) var(--pad) calc(24px + env(safe-area-inset-bottom,0px));clip-path:circle(150% at var(--gx,50%) var(--gy,50%));transition:clip-path 1s var(--ease)}
.gate.out{clip-path:circle(0 at var(--gx,50%) var(--gy,50%))}
.g-top{display:flex;justify-content:space-between;gap:20px}
.g-mid{flex:1;display:flex;align-items:center}
.g-word{font-size:clamp(64px,min(24vw,36vh),400px);cursor:crosshair;user-select:none}
.g-bot{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:24px;align-items:end;border-top:1px solid var(--k3);padding-top:18px}
.g-ask{margin:0}
.g-opts{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,2vw,28px)}
.g-opts button{display:flex;align-items:baseline;gap:14px;text-align:left;font-weight:800;font-size:clamp(30px,min(5.4vw,10vh),92px);letter-spacing:-.05em;text-transform:uppercase;line-height:.9;padding:10px 0;border-bottom:2px solid var(--b);transition:color .25s,border-color .25s}
.g-opts button .ar{margin-left:auto;font-size:.5em;transition:transform .35s var(--ease)}
.g-opts button:hover,.g-opts button:focus-visible{color:var(--ac);border-color:var(--ac);outline:none}
.g-opts button:hover .ar,.g-opts button:focus-visible .ar{transform:translateX(8px)}
@media (max-width:760px){.g-bot{grid-template-columns:1fr}.g-opts{grid-template-columns:1fr}}

/* carrito */
.nav .cart-btn{position:relative;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid currentColor;transition:background .2s,color .2s}
.nav .cart-btn svg{width:20px;height:20px}
.nav .cart-btn:hover,.nav .cart-btn:focus-visible{background:#F2EFE8;color:#0D0D0E}
.nav .cart-btn b{position:absolute;top:-5px;right:-5px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:var(--blue);color:var(--b);font-family:var(--mono);font-size:10px;display:grid;place-items:center;transform:scale(0);transition:transform .3s var(--ease)}
.nav .cart-btn.has b{transform:scale(1)}
.drawer{position:fixed;inset:0;z-index:95;display:flex;justify-content:flex-end;background:rgba(13,13,14,.7);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;pointer-events:none;transition:opacity .35s var(--ease)}
.drawer.on{opacity:1;pointer-events:auto}
.drawer-box{background:var(--k);color:var(--b);width:min(460px,100%);height:100%;display:flex;flex-direction:column;border-left:1px solid var(--k3);transform:translateX(100%);transition:transform .45s var(--ease)}
.drawer.on .drawer-box{transform:none}
.drawer-top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:calc(20px + env(safe-area-inset-top,0px)) 22px 18px;border-bottom:1px solid var(--k3)}
.drawer-top h3{margin:0;font-weight:800;font-size:26px;letter-spacing:-.04em;text-transform:uppercase}
.drawer-items{flex:1;overflow:auto;padding:8px 22px}
.ci{display:grid;grid-template-columns:62px 1fr auto;gap:14px;align-items:center;padding:18px 0;border-bottom:1px solid var(--k3)}
.ci .cover{width:62px}
.ci b{display:block;font-weight:800;font-size:16px;letter-spacing:-.03em;text-transform:uppercase;line-height:1.05}
.ci .qty{display:flex;align-items:center;gap:8px;margin-top:8px}
.ci .qty button{width:26px;height:26px;border:1px solid var(--k3);border-radius:50%;line-height:1}
.ci .qty button:hover{background:var(--b);color:var(--k)}
.ci .qty span{font-family:var(--mono);font-size:12px;min-width:18px;text-align:center}
.ci .rm{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;opacity:.5;margin-top:8px;display:block}
.ci .rm:hover{opacity:1;color:var(--or)}
.ci .pr{font-weight:700;font-size:16px;white-space:nowrap}
.drawer-empty{padding:60px 22px;text-align:center;opacity:.6}
.drawer-foot{border-top:1px solid var(--k3);padding:20px 22px calc(22px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:14px}
.drawer-foot .tot{display:flex;justify-content:space-between;align-items:baseline}
.drawer-foot .tot b{font-size:30px;font-weight:800;letter-spacing:-.04em}
.drawer-foot input{width:100%;font:inherit;font-size:16px;padding:12px 14px;background:transparent;border:1px solid var(--k3);color:var(--b)}
.drawer-foot input:focus{outline:2px solid var(--blue);outline-offset:0}
.drawer-foot .btn{justify-content:center}
.drawer-foot .err{color:var(--or);font-size:13px;min-height:1.1em}
.drawer-foot .note{font-size:12px;opacity:.55}

/* checkout */
.co{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:var(--pad);background:rgba(13,13,14,.82);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.co-box{background:var(--k);color:var(--b);border:1px solid var(--k3);width:min(560px,100%);max-height:90svh;overflow:auto;padding:clamp(20px,3vw,34px);display:flex;flex-direction:column;gap:18px}
.co-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.co-box h3{margin:0;font-weight:800;font-size:clamp(26px,3vw,40px);letter-spacing:-.04em;text-transform:uppercase;line-height:.95}
.co-price{font-weight:800;font-size:clamp(22px,2.4vw,32px);letter-spacing:-.03em}
.co-box label{display:block;margin-bottom:8px}
.co-box input{width:100%;font:inherit;font-size:16px;padding:13px 15px;background:transparent;border:1px solid var(--k3);color:var(--b)}
.co-box input:focus{outline:2px solid var(--blue);outline-offset:0}
.co-pays{display:grid;gap:10px}
.co-pays .btn{justify-content:space-between;width:100%}
.co-note{font-size:13px;opacity:.6}
.co-err{color:var(--or);font-size:14px;min-height:1.2em}

/* volver arriba */
.totop{position:fixed;right:calc(var(--pad) - 4px);bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:45;height:50px;padding:0 18px 0 8px;border-radius:999px;background:rgba(13,13,14,.85);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(242,239,232,.22);color:var(--b);display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;opacity:0;transform:translateY(16px);pointer-events:none;transition:opacity .35s var(--ease),transform .35s var(--ease),background .2s,color .2s}
.totop.on{opacity:1;transform:none;pointer-events:auto}
.totop:hover,.totop:focus-visible{background:var(--b);color:var(--k)}
.totop svg{width:34px;height:34px;flex:none;transition:transform .3s var(--ease)}
.totop:hover svg{transform:translateY(-3px)}
/* en el celular queda solo el círculo: la etiqueta tapaba texto */
@media (max-width:760px){
  .totop{height:44px;width:44px;padding:0;justify-content:center;bottom:calc(14px + env(safe-area-inset-bottom,0px))}
  .totop span{display:none}
  .totop svg{width:26px;height:26px}
}
body:has(.buybar.on) .totop{bottom:calc(92px + env(safe-area-inset-bottom,0px))}

/* reveal */
.pre{opacity:0;transform:translateY(34px)}
.rv{transition:opacity .9s var(--ease),transform .9s var(--ease)}

/* photos */
.photo{background:#555 center/cover no-repeat;filter:grayscale(1) contrast(1.05);position:relative}

/* marquee */
.ticker{overflow:hidden;white-space:nowrap;border-block:1px solid var(--k3);padding:14px 0}
.ticker>div{display:inline-block;animation:mq 34s linear infinite;font-weight:800;font-size:clamp(28px,4vw,60px);letter-spacing:-.045em;text-transform:uppercase}
.ticker span{margin:0 .35em}
.ticker i{font-family:var(--serif);font-weight:400;color:var(--blue)}
@keyframes mq{to{transform:translateX(-50%)}}

/* portadas: cada producto, un libro distinto */
.cover{position:relative;aspect-ratio:3/4;overflow:hidden;container-type:inline-size;display:grid;grid-template-columns:13% 1fr;background:var(--b);color:var(--k);box-shadow:0 10px 30px -18px rgba(0,0,0,.7)}
.cover .mono{font-size:max(8px,3.2cqw);letter-spacing:.07em}
.cover .badge{font-size:max(8px,3cqw);background:var(--k);color:var(--b);padding:1cqw 2cqw;white-space:nowrap}
.cover .num{font-weight:800;letter-spacing:-.05em;line-height:.78}
.cover .ttl{font-family:var(--serif);letter-spacing:-.02em;text-transform:uppercase;line-height:.95}
/* lomo */
.cover .spine{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:5cqw 0;overflow:hidden}
.cover .spine .wm{transform:rotate(-90deg);font-size:7.5cqw;white-space:nowrap}
.cover .spine .sp-code{writing-mode:vertical-rl;transform:rotate(180deg);font-size:max(7px,2.4cqw);opacity:.75}
/* cuerpo + pliegue */
.cover .body{position:relative;padding:6cqw 7cqw 5cqw;display:flex;flex-direction:column;overflow:hidden}
.cover .body::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6cqw;background:linear-gradient(90deg,rgba(0,0,0,.28),rgba(0,0,0,0));pointer-events:none;z-index:4}
/* canto de hojas */
.cover .pages{position:absolute;right:0;top:1.4cqw;bottom:1.4cqw;width:3.2cqw;z-index:5;background:repeating-linear-gradient(90deg,#efece4 0 1px,rgba(0,0,0,.35) 1px 2.6px);box-shadow:inset 2px 0 4px rgba(0,0,0,.35)}
.cover::after{content:"";position:absolute;left:5cqw;right:1.4cqw;top:0;height:1.6cqw;z-index:6;background:linear-gradient(180deg,#f6f3ec,#cdc9c0 60%,rgba(0,0,0,.5));border-radius:1px}

/* 01 archivo — tapa bone, lomo negro */
.cv-archive .spine{background:var(--k);color:var(--b)}
.cv-archive .body>.wm{font-size:7cqw}
.cv-archive .badge{position:absolute;top:5cqw;right:6cqw;z-index:3}
.cv-archive .num{font-size:27cqw;margin-top:7cqw;position:relative;z-index:2}
.cv-archive .ttl{font-size:9.5cqw;margin-top:3cqw;position:relative;z-index:2}
.cv-archive .art{position:absolute;right:-22%;bottom:-12%;width:72%;z-index:1}
.cv-archive .meta{margin-top:auto;position:relative;z-index:2;max-width:50%}

/* 02 poster — tapa naranja, lomo bone */
.cv-poster .spine{background:var(--b);color:var(--k)}
.cv-poster .body{background:var(--or);color:var(--k);justify-content:space-between}
.cv-poster .arcs{position:absolute;right:-30%;top:-14%;width:88%;display:grid;gap:3cqw;opacity:.9;z-index:0}
.cv-poster .t{display:flex;justify-content:space-between;align-items:flex-start;gap:6px;position:relative;z-index:2}
.cv-poster .t .wm{font-size:7cqw}
.cv-poster .badge{background:var(--b);color:var(--k)}
.cv-poster .mid{position:relative;z-index:2;margin-top:auto}
.cv-poster .num{font-size:36cqw;color:transparent;-webkit-text-stroke:1.2cqw var(--k)}
.cv-poster .ttl{font-size:10cqw;margin-top:-1cqw;font-style:italic;color:var(--b)}
.cv-poster .meta{position:relative;z-index:2;margin-top:3cqw}

/* 03 grilla — tapa negra, lomo ácido */
.cv-grid .spine{background:var(--ac);color:var(--k)}
.cv-grid .body{background:var(--k);color:var(--b);justify-content:space-between}
.cv-grid .lines{position:absolute;inset:0;display:grid;grid-template-columns:repeat(5,1fr);pointer-events:none;z-index:0}
.cv-grid .lines i{border-right:1px solid rgba(242,239,232,.14)}
.cv-grid .t{display:flex;justify-content:space-between;align-items:flex-start;gap:6px;position:relative;z-index:2}
.cv-grid .t .wm{font-size:7cqw}
.cv-grid .badge{background:var(--ac);color:var(--k)}
.cv-grid .ttl{position:relative;z-index:2;font-size:12cqw;margin-top:6cqw}
.cv-grid .b{display:flex;justify-content:space-between;align-items:flex-end;gap:8px;position:relative;z-index:2}
.cv-grid .num{font-size:32cqw}
.cv-grid .meta{text-align:right}
.cv-grid .dot{position:absolute;width:13cqw;height:13cqw;border-radius:50%;background:var(--ac);right:7cqw;top:38cqw;z-index:1}

/* 04 trayectoria — tapa azul, lomo negro */
.cv-tra .spine{background:var(--k);color:var(--b)}
.cv-tra .body{background:var(--blue);color:var(--b);justify-content:space-between}
.cv-tra .paths{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.cv-tra .t{display:flex;justify-content:space-between;align-items:flex-start;gap:6px;position:relative;z-index:2}
.cv-tra .t .wm{font-size:7cqw}
.cv-tra .badge{background:var(--b);color:var(--k)}
.cv-tra .num{position:relative;z-index:2;font-size:30cqw;color:transparent;-webkit-text-stroke:1.2cqw var(--b);margin-top:4cqw}
.cv-tra .b{position:relative;z-index:2;margin-top:auto;display:flex;flex-direction:column;gap:2cqw}
.cv-tra .ttl{font-size:10cqw;font-style:italic}

.pcard{display:flex;flex-direction:column;gap:14px;text-decoration:none;color:inherit}
/* 05 libro — tapa hueso con rayado de planilla, lomo azul */
.cv-libro .spine{background:var(--blue);color:var(--b)}
.cv-libro .body{background:var(--b);color:var(--k);justify-content:space-between}
.cv-libro .rayas{position:absolute;inset:0;display:grid;grid-template-rows:repeat(7,1fr);pointer-events:none;z-index:0}
.cv-libro .rayas i{border-bottom:1px solid rgba(48,71,255,.22)}
.cv-libro .t{display:flex;justify-content:space-between;align-items:flex-start;gap:6px;position:relative;z-index:2}
.cv-libro .t .wm{font-size:7cqw}
.cv-libro .badge{background:var(--blue);color:var(--b)}
.cv-libro .ttl{position:relative;z-index:2;font-size:12cqw;margin-top:6cqw;color:var(--k)}
.cv-libro .b{display:flex;justify-content:space-between;align-items:flex-end;gap:8px;position:relative;z-index:2}
.cv-libro .num{font-size:32cqw;color:var(--blue)}
.cv-libro .meta{text-align:right}
/* la doble raya del total, al pie de la columna */
.cv-libro .suma{position:absolute;left:7cqw;right:7cqw;bottom:37cqw;height:2.6cqw;z-index:1;
  border-top:.8cqw solid var(--k);border-bottom:.8cqw solid var(--k)}

.pcard .cover{transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.pcard:hover .cover{transform:translateY(-8px) rotate(-1deg);box-shadow:0 30px 60px -30px rgba(0,0,0,.6)}
.pcard .row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-top:1px solid currentColor;padding-top:12px}
.pcard h3{margin:0;font-size:clamp(20px,2vw,28px);font-weight:800;letter-spacing:-.035em;text-transform:uppercase;line-height:1}
.pcard .price{font-weight:600;font-size:18px;font-variant-numeric:tabular-nums}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:clamp(14px,2vw,28px)}
@media (max-width:1000px){.pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.pgrid{grid-template-columns:1fr}}

/* 3D box */
.boxstage{perspective:1400px;display:grid;place-items:center;min-height:clamp(420px,46vw,600px);cursor:grab;touch-action:pan-y;position:relative;background:radial-gradient(60% 60% at 50% 55%,#2a2a2d 0,var(--k) 70%)}
.box{--w:250px;--h:330px;--d:64px;width:var(--w);height:var(--h);position:relative;transform-style:preserve-3d;transform:rotateX(-8deg) rotateY(-28deg)}
.box .f{position:absolute;left:0;top:0;backface-visibility:hidden}
.box .front{width:var(--w);height:var(--h);transform:translateZ(calc(var(--d)/2))}
.box .front .cover{width:100%;height:100%;aspect-ratio:auto}
.box .side{width:var(--d);height:var(--h);left:calc((var(--w) - var(--d))/2);transform:rotateY(90deg) translateZ(calc(var(--w)/2));background:#131314;color:var(--b);display:flex;align-items:center;justify-content:center}
.box .side .wm{transform:rotate(90deg);font-size:30px}
.box .lside{width:var(--d);height:var(--h);left:calc((var(--w) - var(--d))/2);transform:rotateY(-90deg) translateZ(calc(var(--w)/2));background:var(--k)}
.box .back{width:var(--w);height:var(--h);transform:rotateY(180deg) translateZ(calc(var(--d)/2));background:var(--k);color:var(--b);padding:18px;display:flex;flex-direction:column;justify-content:space-between}
/* la contratapa: el texto en cursiva iba en 21px fijos y llenaba toda la
   cara. Atado al ancho de la caja respira y no se amontona. */
.box .back .it{font-size:calc(var(--w) * .066);line-height:1.22;max-width:16ch;opacity:.92}
.box .top{width:var(--w);height:var(--d);top:calc((var(--h) - var(--d))/2);transform:rotateX(90deg) translateZ(calc(var(--h)/2));background:#E4E0D6}
.box .bottom{width:var(--w);height:var(--d);top:calc((var(--h) - var(--d))/2);transform:rotateX(-90deg) translateZ(calc(var(--h)/2));background:#0a0a0a}
.boxstage .hint{position:absolute;left:16px;bottom:14px;opacity:.45}
@media (max-width:480px){.box{--w:210px;--h:280px;--d:54px}}

/* faq */
.faq details{border-top:1px solid currentColor}
.faq details:last-child{border-bottom:1px solid currentColor}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:20px 0;font-weight:700;font-size:clamp(18px,1.8vw,24px);letter-spacing:-.02em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";width:18px;height:18px;flex:none;border-radius:50%;border:2px solid currentColor;border-bottom-color:transparent;transition:transform .4s var(--ease)}
.faq details[open] summary::after{transform:rotate(180deg);background:var(--blue);border-color:var(--blue)}
.faq details p{margin:0 0 22px;max-width:62ch;opacity:.75}

/* footer */
.foot{background:var(--k);color:var(--b);padding-inline:var(--pad);padding-block:clamp(72px,9vw,130px) 28px;border-top:1px solid var(--k3)}
.foot h2{font-size:clamp(64px,14vw,240px)}
.foot .cols{display:grid;grid-template-columns:repeat(5,1fr);gap:24px;margin-top:clamp(48px,7vw,100px);padding-top:18px;border-top:1px solid var(--k3)}
.foot .cols a{display:block;text-decoration:none;padding:4px 0;opacity:.8}
.foot .cols a:hover{opacity:1;color:var(--ac)}
.foot .base{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-top:48px;flex-wrap:wrap}
.foot .base .wm{font-size:44px}
@media (max-width:1100px){.foot .cols{grid-template-columns:repeat(3,1fr)}}
@media (max-width:760px){.foot .cols{grid-template-columns:1fr 1fr}}

.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);opacity:0;background:var(--blue);color:var(--b);padding:10px 16px;z-index:80;transition:.3s var(--ease);pointer-events:none;max-width:calc(100% - 32px);text-align:center}
.toast.on{opacity:1;transform:translate(-50%,0)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .pre{opacity:1;transform:none}
}

/* títulos largos: un paso menos de cuerpo para que la palabra entre entera */
.cover .ttl.long{font-size:8.6cqw!important}

/* aviso de cookies: barra abajo, no bloquea. Los botones pesan lo mismo.
   Mientras está abierta, la barra de compra de la ficha, el botón de
   volver arriba y el toast suben su altura para no quedar tapados. */
/* ---- una sección de pantalla completa no termina bajo el aviso ----
   El body ya reserva --ck-h, pero una sección de 100svh igual llega hasta el
   borde y el aviso le tapaba el final: el botón del hero quedaba 58 px abajo.
   Acá la sección misma deja ese lugar libre. */
@media (max-width:860px){
  html.ck-on .pant{padding-bottom:calc(56px + var(--ck-h,0px) + env(safe-area-inset-bottom,0px))}
  /* en el teléfono se apoyaba sobre las tapas del riel y tapaba un producto;
     la barra de arriba ya lleva al inicio desde el logo */
  .totop{display:none}
  .pant{padding-bottom:calc(72px + env(safe-area-inset-bottom,0px))}
}

.ck{position:fixed;left:0;right:0;bottom:0;z-index:55;background:var(--k);color:var(--b);border-top:1px solid var(--k3);padding:14px var(--pad) calc(14px + env(safe-area-inset-bottom,0px));display:flex;align-items:center;justify-content:space-between;gap:16px 32px;transform:translateY(100%);transition:transform .35s var(--ease)}
.ck.on{transform:none}
.ck p{margin:0;display:flex;align-items:baseline;gap:8px 16px;flex-wrap:wrap;font-size:14px;line-height:1.45;max-width:760px}
.ck .ck-l{color:var(--ac);flex:none}
.ck a{color:var(--b);text-decoration:underline;text-underline-offset:3px;opacity:.75;white-space:nowrap}
.ck a:hover{opacity:1}
.ck-b{display:flex;gap:8px;flex:none}
.ck-b button{min-height:44px;min-width:112px;padding:0 18px;border:1px solid var(--b);font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;transition:background .2s,color .2s}
.ck-b button:hover,.ck-b button:focus-visible{background:var(--b);color:var(--k)}
.ck-b button:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
html.ck-on body{padding-bottom:var(--ck-h,0px)}
html.ck-on .buybar{bottom:var(--ck-h,0px)}
html.ck-on .totop{bottom:calc(var(--ck-h,0px) + 14px)}
html.ck-on body:has(.buybar.on) .totop{bottom:calc(var(--ck-h,0px) + 92px)}
html.ck-on .toast{bottom:calc(var(--ck-h,0px) + 16px)}
@media (max-width:640px){
  .ck{gap:10px 12px;padding-top:10px;padding-bottom:calc(10px + env(safe-area-inset-bottom,0px))}
  .ck p{font-size:12.5px;line-height:1.35;gap:4px 10px}
  .ck .ck-l{display:none}            /* el rótulo COOKIES sobra: ya se entiende */
  .ck-b button{min-width:0;flex:1;padding:0 12px;font-size:11px}
  .ck-b{flex:none;gap:6px}
  .ck p{font-size:13px}
  .ck-b button{flex:1}
}
@media (prefers-reduced-motion:reduce){.ck{transition:none}}
