/* ============================================================
   laOra · LUNAR v2 — HOJA DE LA PÁGINA DE PRUEBAS
   ------------------------------------------------------------
   PORTADO TAL CUAL del material aprobado el 05/08/2026
   (`laora-lunar-aprobado-2026-08-05.zip` → `app/globals.css`),
   por encargo de Óscar: «respeta fuentes, tamaños, colores,
   absolutamente todo; no cambies nada».

   SOLO la sirve /lunarv2.html. No toca `laora.css`, así que la
   web publicada no se entera de nada de lo que pase aquí.

   El original venía sobre Tailwind, así que el primer bloque
   replica su «preflight», igual que en laora.css. Sin él se
   descuadran decenas de medidas.

   La ÚNICA desviación es la que pidió Óscar: el logotipo. El
   material traía un wordmark con la O de la tipografía; aquí van
   los PNG del logotipo canónico (círculo con el triángulo
   invertido). Por eso la cabecera ya no necesita volver negro el
   logotipo con un filtro: se sirve el archivo oscuro. La regla
   original queda justo debajo, comentada y sin tocar.
   ============================================================ */

/* ---------- preflight de Tailwind ---------- */
*,::before,::after{box-sizing:border-box;border:0 solid;margin:0;padding:0}
html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:ui-sans-serif,system-ui,sans-serif}
h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}
a{color:inherit;text-decoration:inherit}
ol,ul,menu{list-style:none}
img,svg,video,canvas{display:block;vertical-align:middle}
img,video{max-width:100%;height:auto}
button,input,select,textarea{font:inherit;color:inherit;background-color:transparent}
button{cursor:pointer}
table{border-collapse:collapse}
fieldset,legend{padding:0}

/* ---------- globals.css del zip, verbatim ---------- */

:root {
  --ivory: #f4f0e8;
  --paper: #fbfaf6;
  --ink: #1c1d1b;
  --muted: #6c6c64;
  --line: rgba(28, 29, 27, .16);
  --gold: #b48744;
  --green: #315347;
  --dark: #151715;
  --white: #fffdf8;
  --serif: Arial, Helvetica, sans-serif;
  --sans: Arial, Helvetica, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--ivory); color: var(--ink); font-family: var(--sans); font-size: 16px; }
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
button, a, input, select { -webkit-tap-highlight-color: transparent; }
img { display: block; max-width: 100%; }
main { overflow: hidden; }
em { font-family: var(--serif); font-weight: 400; }

.site-header { height: 76px; padding: 0 3.5vw; display: flex; align-items: center; justify-content: space-between; gap: 28px; background: rgba(255,255,255,.98); border-bottom: 1px solid rgba(0,0,0,.08); position: sticky; inset: 0 0 auto; z-index: 50; backdrop-filter: blur(14px); }
.brand { min-width: 150px; }
.brand-logo { width: 118px; display: inline-flex; align-items: center; }
.brand-logo img { width: 100%; height: auto; }
/* .site-header .brand-logo img { filter: brightness(0); }  ← el logotipo
   canónico ya se sirve en su color: el filtro lo dejaba TODO negro y se
   comía el ámbar del triángulo. Es la única desviación, la del logo. */
.main-nav { display: flex; align-items: center; gap: clamp(20px, 2.3vw, 42px); }
/* `align-items: baseline` en vez de `center`: es la otra mitad del ajuste
   del logotipo. Dentro de un flex centrado no hay línea base que
   compartir, y el logotipo quedaba 4,5 px por debajo del texto de al
   lado. El documento de entrega pide expresamente que el logotipo y la
   palabra pegada —«Por qué», «Club», «teca»— compartan línea base.
   Original: ... display: inline-flex; align-items: center; ... */
.main-nav a, .account-link { min-height: 44px; display: inline-flex; align-items: baseline; gap: 4px; font-size: 14px; line-height: 1; font-weight: 500; letter-spacing: 0; position: relative; white-space: nowrap; }
/* AJUSTE DEL LOGOTIPO — la excepción que autorizó Óscar (05/08/2026).
   El material centraba el logotipo con un inline-flex y lo subía 1 px a
   mano, porque su wordmark traía aire por debajo del dibujo. El nuestro
   está recortado a hueso: su borde inferior ES la línea base. Medido en
   el navegador, aquello lo dejaba 5 px POR DEBAJO de la línea del texto.
   Con `inline` y la imagen en `baseline`, el logotipo y la palabra de al
   lado —«Por qué», «Club», «teca»— se apoyan en la misma línea, que es
   justo lo que pide el documento de entrega.
   Original:
   .brand-word { height: 14px; display: inline-flex; align-items: center; gap: 0; line-height: 14px; vertical-align: middle; }
   .brand-word img { width: auto; height: 12px; display: block; flex: 0 0 auto; transform: translateY(-1px); } */
.brand-word { display: inline; }
.brand-word img { width: auto; height: 11px; display: inline; vertical-align: baseline; }
.main-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -9px; height: 1px; background: var(--ink); transition: right .25s ease; }
.main-nav a:hover::after, .main-nav a.active::after { right: 0; }
.header-actions { display: flex; align-items: center; gap: 20px; min-width: 150px; justify-content: flex-end; }
.header-icon { width: 31px; height: 38px; display: grid; place-items: center; position: relative; }
.header-icon > span { display: block; position: relative; color: var(--ink); }
.support-icon > span { width: 21px; height: 17px; border: 1.8px solid currentColor; border-bottom-color: transparent; border-radius: 14px 14px 4px 4px; }
.support-icon > span::before, .support-icon > span::after { content: ""; position: absolute; top: 9px; width: 4px; height: 8px; border: 1.8px solid currentColor; background: white; }
.support-icon > span::before { left: -4px; border-radius: 4px 1px 1px 4px; }
.support-icon > span::after { right: -4px; border-radius: 1px 4px 4px 1px; }
.profile-icon > span { width: 23px; height: 23px; border: 1.8px solid currentColor; border-radius: 50%; }
.profile-icon > span::before { content: ""; position: absolute; width: 6px; height: 6px; left: 6.5px; top: 4px; border: 1.6px solid currentColor; border-radius: 50%; }
.profile-icon > span::after { content: ""; position: absolute; width: 11px; height: 6px; left: 4px; bottom: 3px; border: 1.6px solid currentColor; border-bottom: 0; border-radius: 10px 10px 0 0; }
.bag-icon > span { width: 20px; height: 19px; border: 1.8px solid currentColor; border-radius: 2px; margin-top: 4px; }
.bag-icon > span::before { content: ""; position: absolute; width: 8px; height: 6px; left: 4px; top: -7px; border: 1.8px solid currentColor; border-bottom: 0; border-radius: 6px 6px 0 0; }
.bag-icon b { position: absolute; right: -4px; top: 1px; min-width: 15px; height: 15px; padding: 0 3px; display: grid; place-items: center; border-radius: 9px; background: var(--ink); color: white; font-size: 8px; line-height: 1; }
.menu-toggle { display: none; width: 44px; height: 44px; border: 0; background: transparent; position: relative; }
.menu-toggle span { width: 22px; height: 1px; background: var(--ink); position: absolute; left: 11px; top: 18px; }
.menu-toggle span:last-child { top: 25px; }

.kicker, .section-number { margin: 0; font-size: 11px; text-transform: uppercase; letter-spacing: .2em; font-weight: 700; }
.kicker.light, .light { color: var(--white); }
h1, h2, h3, p { margin-top: 0; }
h1 { font-size: clamp(48px, 6.3vw, 104px); letter-spacing: -.065em; line-height: .9; font-weight: 500; }
h2 { font-size: clamp(40px, 5vw, 74px); letter-spacing: -.055em; line-height: .96; font-weight: 500; }
.button { min-height: 50px; padding: 0 25px; border: 1px solid transparent; display: inline-flex; justify-content: center; align-items: center; gap: 22px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; transition: background .2s ease, color .2s ease, transform .2s ease; }
.button:hover { transform: translateY(-2px); }
.button.primary { color: var(--white); background: var(--ink); }
.button.gold { color: var(--ink); background: #d1a355; }
.button.outline { border-color: var(--ink); background: transparent; }
.button.light-button { background: var(--white); color: var(--ink); }
.button.full { width: 100%; }
.text-link { display: inline-flex; min-height: 44px; align-items: center; font-size: 13px; border-bottom: 1px solid currentColor; }
.text-link.light { color: var(--white); }
.button-row { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }

.home-hero { min-height: calc(100svh - 76px); position: relative; background: #020202; color: white; }
.lunar-hero-media { position: absolute; inset: 0; overflow: hidden; }
.lunar-hero-image { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center top; transition: transform .9s cubic-bezier(.2,.8,.2,1), object-position .9s ease; }
.lunar-hero-media.is-close .lunar-hero-image { transform: scale(1.2); object-position: center 64%; }
.lunar-hero-veil { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.59) 0%, rgba(0,0,0,.19) 34%, rgba(0,0,0,.04) 64%, rgba(0,0,0,.36) 100%); pointer-events: none; }
.home-hero-copy.lunar-home-copy { position: absolute; z-index: 3; top: 5.5%; left: 50%; width: min(720px, 92%); margin: 0; padding: 0; transform: translateX(-50%); text-align: center; text-shadow: 0 2px 20px rgba(0,0,0,.75); }
.lunar-eyebrow { margin: 0 0 2px; font-size: 13px; line-height: 1.1; font-weight: 400; }
.lunar-title { margin: 0 0 2px; display: flex; align-items: baseline; justify-content: center; gap: 12px; line-height: 1; }
.lunar-title img { width: clamp(140px, 14.6vw, 210px); height: auto; }
.lunar-title span { font-size: clamp(58px, 6.25vw, 90px); line-height: 1; font-weight: 400; letter-spacing: -.055em; }
.lunar-specs { margin: 0; color: white; font-size: 14px; line-height: 1.25; font-weight: 400; }
.lunar-specs i { padding: 0 6px; font-style: normal; color: rgba(255,255,255,.68); }
.lunar-price { margin: 5px 0 0; color: white; font-size: 15px; line-height: 1.2; font-weight: 500; }
.lunar-actions { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 11px; }
.lunar-action { width: min(230px, 34vw); min-height: 48px; display: inline-flex; align-items: center; justify-content: center; border-radius: 4px; font-size: 14px; font-weight: 500; text-shadow: none; transition: transform .2s ease, background .2s ease; }
.lunar-action:hover { transform: translateY(-2px); }
.lunar-action.reserve { background: white; color: #111; border: 1px solid white; }
.lunar-action.more { background: rgba(5,5,5,.92); color: white; border: 1px solid rgba(255,255,255,.68); }
.lunar-hero-arrow { position: absolute; z-index: 4; top: 57%; width: 46px; height: 52px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 4px; background: rgba(250,250,248,.91); color: #111; font: 38px/1 Arial, sans-serif; cursor: pointer; transform: translateY(-50%); }
.lunar-hero-arrow.previous { left: 3vw; }
.lunar-hero-arrow.next { right: 3vw; }
.lunar-hero-dots { position: absolute; z-index: 4; left: 50%; bottom: 18px; display: flex; gap: 9px; transform: translateX(-50%); }
.lunar-hero-dots button { position: relative; width: 10px; height: 10px; padding: 0; border: 1px solid white; border-radius: 50%; background: transparent; cursor: pointer; }
/* Con ocho relojes se pulsan mucho más, y un punto de 10 px es un blanco
   diminuto para un dedo. Esta zona invisible de 32 px lo hace pulsable sin
   mover ni un píxel de lo que se ve. */
.lunar-hero-dots button::after { content: ""; position: absolute; inset: -11px; }
.lunar-hero-dots button.active { background: white; }

.lunar-dialogue { min-height: calc(100svh - 76px); position: relative; overflow: hidden; isolation: isolate; background: #eee7e0; color: #171513; }
.lunar-dialogue::before { content: ""; position: absolute; z-index: 0; inset: -40px; background: url("/assets/img/lunar-v2/lunar-wrist.jpg") center top / cover no-repeat; filter: blur(32px); opacity: .18; transform: scale(1.06); }
.lunar-dialogue-image { position: absolute; z-index: 1; top: 105px; left: 50%; width: min(850px, 100vw); height: auto; max-width: none; transform: translateX(-50%); }
.lunar-dialogue-veil { position: absolute; z-index: 2; inset: 0; background: linear-gradient(180deg, rgba(244,239,234,.97) 0%, rgba(244,239,234,.78) 25%, rgba(244,239,234,.08) 49%, rgba(244,239,234,0) 100%); }
.lunar-dialogue-copy { position: absolute; z-index: 3; top: 35px; left: 50%; width: min(1080px, 92vw); transform: translateX(-50%); text-align: center; text-shadow: none; }
.lunar-dialogue-copy h2 { margin: 0 0 16px; font: 500 clamp(38px, 4vw, 60px)/1 var(--sans); letter-spacing: -.05em; }
.lunar-dialogue-copy p { max-width: 1030px; margin: 0 auto; font-size: clamp(18px, 1.7vw, 26px); line-height: 1.28; letter-spacing: -.025em; }
/* AJUSTE DEL LOGOTIPO — la excepción que autorizó Óscar (05/08/2026).
   Medido contra la captura aprobada `lunar-pantalla-2-desktop.png`: allí
   el logotipo mide 19 px de alto contra los 17 px de la «E» de «Es», o
   sea 1,12 veces la mayúscula, y las dos líneas base coinciden. Con
   3.2em y −.18em el nuestro salía a 1,46 veces la mayúscula y 4,4 px
   hundido, porque esas medidas estaban calibradas para un wordmark con
   aire alrededor. 2.45em deja el logotipo en esas 1,12 veces, y
   `baseline` lo apoya en la línea del texto sin corregir nada a mano.
   Original:
   .dialogue-brand { display: inline-block; width: 3.2em; margin: 0 .04em; vertical-align: -.18em; } */
.dialogue-brand { display: inline-block; width: 2.45em; margin: 0 .04em; vertical-align: baseline; }
.dialogue-brand img { width: 100%; height: auto; }
.lunar-dialogue-number { position: absolute; z-index: 3; right: 3vw; bottom: 22px; font-size: 11px; letter-spacing: .15em; }

.lunar-pride { min-height: calc(100svh - 76px); position: relative; overflow: hidden; background: #7697af; color: white; }
.lunar-pride-image { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center top; }
.lunar-pride-veil { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.48) 0%, rgba(0,0,0,.22) 28%, rgba(0,0,0,.03) 55%, rgba(0,0,0,.12) 100%); }
.lunar-pride-copy { position: absolute; z-index: 2; top: 5%; left: 50%; width: min(1000px, 92vw); transform: translateX(-50%); text-align: center; text-shadow: 0 2px 22px rgba(0,0,0,.52); }
.lunar-pride-copy p { margin: 0; font: 400 clamp(19px, 1.8vw, 27px)/1.05 var(--sans); letter-spacing: -.025em; }
.lunar-pride-copy h2 { margin: 3px 0 5px; font: 500 clamp(46px, 5vw, 72px)/.98 var(--sans); letter-spacing: -.052em; }
.lunar-pride-number { position: absolute; z-index: 2; right: 3vw; bottom: 22px; font-size: 11px; letter-spacing: .15em; }

.trust-carousel { position: relative; padding: 22px 0 26px; overflow: hidden; background: #111; }
.trust-carousel-track { display: flex; gap: 18px; padding: 0 max(5vw, 28px); overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: x mandatory; scroll-padding-inline: max(5vw, 28px); scrollbar-width: none; }
.trust-carousel-track::-webkit-scrollbar { display: none; }
.trust-card { flex: 0 0 min(68vw, 990px); height: clamp(360px, 50svh, 520px); position: relative; overflow: hidden; scroll-snap-align: start; scroll-snap-stop: always; background: #1d1c1a; color: white; }
.trust-card > img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center; }
.trust-card-veil { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.68) 0%, rgba(0,0,0,.31) 36%, rgba(0,0,0,.03) 62%, rgba(0,0,0,.26) 100%); }
.trust-card-copy { position: absolute; z-index: 2; top: 8%; left: 50%; width: min(780px, 90%); transform: translateX(-50%); text-align: center; text-shadow: 0 2px 20px rgba(0,0,0,.7); }
.trust-card-copy h2 { margin: 0 0 7px; font: 500 clamp(36px, 4.4vw, 64px)/1 var(--sans); letter-spacing: -.052em; }
.trust-card-copy p { margin: 0; font: 400 clamp(17px, 1.6vw, 23px)/1.2 var(--sans); letter-spacing: -.025em; }
.trust-card-number { position: absolute; z-index: 2; right: 22px; bottom: 18px; font-size: 11px; font-weight: 500; letter-spacing: .15em; text-shadow: 0 2px 10px rgba(0,0,0,.7); }
.trust-carousel-arrow { position: absolute; z-index: 4; top: 50%; width: 46px; height: 52px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 4px; background: rgba(250,250,248,.92); color: #111; font: 38px/1 Arial, sans-serif; cursor: pointer; transform: translateY(-50%); }
.trust-carousel-arrow.previous { left: 2vw; }
.trust-carousel-arrow.next { right: 2vw; }
.trust-carousel-arrow:focus-visible { outline: 2px solid white; outline-offset: 3px; }

.editorial-intro, .belief, .club-promise, .workshop-intro { padding: 130px 6vw; display: grid; grid-template-columns: 22% 1fr; gap: 6vw; border-bottom: 1px solid var(--line); }
.editorial-intro > div { display: grid; grid-template-columns: 1.25fr .8fr; gap: 8vw; align-items: end; }
.editorial-intro h2, .belief h2, .club-promise h2, .workshop-intro h2 { margin: 0; }
.editorial-intro > div > p, .belief > div:last-child, .club-promise > div:last-child, .workshop-intro > div > p { color: var(--muted); font-size: 17px; line-height: 1.7; }

.market-map { padding: 105px 6vw 90px; background: var(--paper); border-bottom: 1px solid var(--line); }
.market-map-head { display: grid; grid-template-columns: 1.25fr .75fr; gap: 7vw; align-items: end; margin-bottom: 46px; }
.market-map-head h2 { margin: 24px 0 0; max-width: 820px; }
.market-map-intro > p { margin: 0 0 24px; color: var(--muted); font-size: 15px; line-height: 1.65; }
.market-tabs { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--ink); }
.market-tabs button { min-height: 50px; padding: 10px 14px; border: 0; border-right: 1px solid var(--ink); background: transparent; color: var(--ink); cursor: pointer; font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.market-tabs button:last-child { border-right: 0; }
.market-tabs button.active { background: var(--ink); color: var(--white); }
.market-context { display: flex; justify-content: space-between; gap: 35px; padding: 17px 0; border-top: 1px solid var(--line); }
.market-context strong { font: 25px var(--serif); }
.market-context span { max-width: 720px; color: var(--muted); font-size: 12px; line-height: 1.55; }
.market-zones { display: grid; grid-template-columns: 3fr 2fr; gap: 8px; margin: 8px 0; }
.market-zones span { padding: 9px 12px; background: #dedbd3; font-size: 9px; font-weight: 700; letter-spacing: .15em; text-align: center; text-transform: uppercase; }
.market-zones span:last-child { background: #2a211e; color: #f0c8ad; }
.market-cards { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.market-card { min-height: 205px; padding: 19px; border: 1px solid var(--line); display: flex; flex-direction: column; background: #f2efe8; }
.market-card > p { margin: 0 0 27px; color: var(--gold); font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.market-card h3 { min-height: 40px; margin: 0; font: 18px/1.12 var(--serif); }
.market-card > strong { margin: auto 0 10px; font-size: 20px; letter-spacing: -.03em; }
.market-card small { color: var(--muted); font-size: 10px; line-height: 1.42; }
.market-card.irregular { background: #1b1d1b; color: var(--white); border-color: #1b1d1b; }
.market-card.irregular > p { color: #e7a26e; }
.market-card.irregular small { color: #b9bbb4; }
.market-bottom { display: grid; grid-template-columns: 1fr 1.12fr; gap: 8px; margin-top: 8px; }
.market-alternatives { padding: 22px; border: 1px solid var(--line); }
.market-alternatives > div { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-top: 18px; }
.market-alternatives span { min-height: 74px; padding: 13px; background: #e8e4db; display: flex; flex-direction: column; justify-content: space-between; }
.market-alternatives b { font-size: 11px; line-height: 1.3; }
.market-alternatives small { color: var(--muted); font-size: 11px; }
.laora-value { min-height: 138px; padding: 22px 22px 20px 150px; display: grid; grid-template-columns: auto 1fr auto; gap: 18px 24px; align-items: center; background: #c89b51; position: relative; overflow: hidden; }
.laora-value > img { position: absolute; inset: 0 auto 0 0; width: 128px; height: 100%; object-fit: cover; mix-blend-mode: multiply; opacity: .82; }
.laora-value-price { display: grid; gap: 3px; }
.laora-value-price span { font-size: 9px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.laora-value-price strong { font: 32px var(--serif); white-space: nowrap; }
.laora-value > p { margin: 0; font-size: 11px; line-height: 1.5; }
.laora-value > p b { display: inline; }
.laora-value > a { min-height: 42px; display: inline-flex; align-items: center; border-bottom: 1px solid currentColor; font-size: 10px; font-weight: 700; text-transform: uppercase; white-space: nowrap; }
.market-footnote { margin: 15px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }

.decision-act { height: calc(100svh - 76px); min-height: 650px; padding: 22px 4vw 12px; display: grid; grid-template-rows: auto minmax(0, 1fr) auto auto; gap: 9px; overflow: hidden; background: #e9e5dc; }
.decision-head { display: grid; grid-template-columns: 1.35fr .65fr; gap: 5vw; align-items: end; }
.decision-kicker { margin: 0 0 5px; font-size: 9px; font-weight: 700; letter-spacing: .16em; }
.decision-head h2 { margin: 0; font: 500 clamp(34px, 3.3vw, 50px)/.93 var(--sans); letter-spacing: -.055em; }
.decision-head h2 em { font-style: normal; color: #8c6832; }
.decision-head > p { max-width: 510px; margin: 0 0 2px; color: #5d5c56; font-size: 12px; line-height: 1.45; }
.decision-mobile-switch { display: none; }
.decision-main { min-height: 0; display: grid; grid-template-columns: minmax(0, 1.38fr) minmax(390px, .92fr); gap: 8px; }
.decision-price-panel, .decision-movement-panel { min-width: 0; min-height: 0; padding: 11px; display: grid; overflow: hidden; border: 1px solid rgba(28,29,27,.13); background: #f8f6f0; }
.decision-price-panel { grid-template-rows: 34px auto 22px minmax(0, 1fr) 52px; }
.decision-model-tabs { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid #1d1e1c; }
.decision-model-tabs button { padding: 0 9px; border: 0; border-right: 1px solid #1d1e1c; background: transparent; color: #1d1e1c; font-size: 9px; font-weight: 700; letter-spacing: .05em; cursor: pointer; }
.decision-model-tabs button:last-child { border-right: 0; }
.decision-model-tabs button.active { background: #1d1e1c; color: white; }
.decision-panel-intro { min-height: 52px; padding: 8px 1px 7px; display: grid; grid-template-columns: auto 1fr; gap: 18px; align-items: center; }
.decision-panel-intro strong { font-size: 17px; white-space: nowrap; }
.decision-panel-intro span { color: #686760; font-size: 9px; line-height: 1.35; }
.decision-market-labels { display: grid; grid-template-columns: 3fr 2fr; gap: 4px; }
.decision-market-labels span { display: grid; place-items: center; background: #ddd8cd; font-size: 7px; font-weight: 700; letter-spacing: .12em; }
.decision-market-labels span:last-child { background: #2a211e; color: #efc6a8; }
.decision-routes { min-height: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; }
.decision-routes article { min-width: 0; padding: 9px 8px 7px; display: flex; flex-direction: column; border: 1px solid rgba(28,29,27,.13); background: #efebe2; }
.decision-routes article.irregular { background: #1d1f1d; color: #fffdf8; border-color: #1d1f1d; }
.decision-routes article > span { min-height: 27px; color: #9b6f32; font-size: 9px; font-weight: 700; line-height: 1.25; letter-spacing: .04em; }
.decision-routes article.irregular > span { color: #e4a478; }
.decision-routes article b { min-height: 48px; font-size: 13px; line-height: 1.2; }
.decision-routes article strong { margin: auto 0 8px; font-size: clamp(19px, 1.65vw, 25px); line-height: 1; letter-spacing: -.035em; }
.decision-routes article small { color: #706f68; font-size: 9px; line-height: 1.3; }
.decision-routes article.irregular small { color: #babbb6; }
.decision-alternatives { min-width: 0; padding-top: 5px; display: grid; grid-template-columns: 1.15fr repeat(3, 1fr); gap: 4px; }
.decision-alternatives > span, .decision-alternatives > div { min-width: 0; padding: 6px 8px; display: flex; flex-direction: column; justify-content: center; background: #e2ddd2; }
.decision-alternatives > span { font-size: 7px; font-weight: 700; line-height: 1.35; letter-spacing: .09em; }
.decision-alternatives b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; }
.decision-alternatives small { color: #66655f; font-size: 10px; }
.decision-movement-panel { grid-template-rows: auto minmax(0, 1fr); gap: 9px; }
.movement-intro { padding-bottom: 7px; border-bottom: 1px solid rgba(28,29,27,.14); }
.movement-intro > p { margin: 0 0 4px; font-size: 8px; font-weight: 700; letter-spacing: .14em; }
.movement-intro h3 { margin: 0 0 6px; font: 500 clamp(23px, 2.2vw, 33px)/.98 var(--sans); letter-spacing: -.045em; }
.movement-intro h3 em { color: #8c6832; font-style: normal; }
.movement-intro > span { display: block; color: #62615b; font-size: 9px; line-height: 1.36; }
.movement-intro > span b { color: #1d1e1c; }
.movement-table { min-height: 0; display: grid; grid-template-rows: 24px repeat(6, minmax(31px, 1fr)); }
.movement-row { min-width: 0; padding: 0 6px; display: grid; grid-template-columns: .7fr 1.85fr .75fr .7fr .7fr .65fr; gap: 5px; align-items: center; border-bottom: 1px solid rgba(28,29,27,.11); font-size: 7px; }
.movement-row > * { min-width: 0; }
.movement-row b { overflow: hidden; text-overflow: ellipsis; line-height: 1.18; }
.movement-row strong { font-size: 9px; white-space: nowrap; }
.movement-header { color: #77756d; font-size: 6px; font-weight: 700; letter-spacing: .04em; }
.movement-row.laora { background: #c79a51; color: #171512; }
.movement-row.laora b, .movement-row.laora strong { font-weight: 700; }
.decision-answer { min-height: 86px; padding: 9px 13px 9px 115px; display: grid; grid-template-columns: 190px 125px 1fr 105px; gap: 16px; align-items: center; position: relative; overflow: hidden; background: #171918; color: white; }
.decision-answer > img { position: absolute; left: 0; top: 0; width: 105px; height: 100%; object-fit: cover; object-position: center 42%; }
.decision-product { display: grid; gap: 2px; }
.decision-product > span { font-size: 7px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.decision-product > div { display: flex; align-items: center; gap: 7px; }
.decision-product img { width: 74px; height: auto; }
.decision-product b { font-size: 13px; letter-spacing: .04em; }
.decision-price { font-size: 25px; line-height: 1; letter-spacing: -.035em; }
.decision-answer > p { margin: 0; font-size: 11px; line-height: 1.35; }
.decision-answer > a { min-height: 38px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.65); font-size: 9px; font-weight: 700; }
.decision-footnote { margin: 0; color: #696861; font-size: 7px; line-height: 1.25; text-align: center; }

.lunar-spec-act { height: calc(100svh - 76px); min-height: 650px; position: relative; overflow: hidden; isolation: isolate; background: #151616; color: white; }
.lunar-spec-stage { position: absolute; z-index: -2; inset: 0; display: grid; place-items: center; background: radial-gradient(circle at 50% 48%, #3a3b3a 0, #232424 34%, #111212 72%); }
.lunar-spec-stage::before { content: ""; position: absolute; z-index: 1; inset: 0; background: linear-gradient(180deg, rgba(8,9,9,.72) 0%, transparent 23%, transparent 70%, rgba(8,9,9,.92) 100%); }
.lunar-spec-stage::after { content: ""; position: absolute; inset: 6% 25%; border: 1px solid rgba(255,255,255,.055); border-radius: 50%; box-shadow: 0 0 0 9vw rgba(255,255,255,.012), 0 0 0 18vw rgba(255,255,255,.009); }
.lunar-spec-stage img { width: min(63vw, 890px); height: 112%; object-fit: contain; object-position: center 45%; filter: contrast(1.03) brightness(1.1); }
.lunar-spec-intro { position: absolute; z-index: 2; top: clamp(24px, 4.2vh, 42px); left: 50%; width: min(940px, 82vw); transform: translateX(-50%); text-align: center; }
.lunar-spec-intro > p { margin: 0 0 8px; color: #d4a961; font-size: 15px; font-weight: 700; letter-spacing: .14em; }
.lunar-spec-intro h2 { margin: 0; font: 500 clamp(43px, 4.4vw, 66px)/.96 var(--sans); letter-spacing: -.055em; text-wrap: balance; }
.lunar-spec-intro h2 em { color: #d3a357; font-style: normal; }
.lunar-spec-highlights { margin: 0; padding: 0; list-style: none; }
.lunar-spec-highlights li { width: clamp(210px, 20vw, 285px); position: absolute; z-index: 2; display: grid; grid-template-columns: 28px 1fr; gap: 12px; align-items: start; color: white; }
.lunar-spec-highlights li::after { content: ""; position: absolute; top: 32px; width: clamp(72px, 8vw, 130px); border-top: 1px solid rgba(255,255,255,.36); }
.lunar-spec-highlights li:nth-child(odd) { left: 5.4vw; text-align: right; grid-template-columns: 1fr 28px; }
.lunar-spec-highlights li:nth-child(odd) > span { grid-column: 2; grid-row: 1; }
.lunar-spec-highlights li:nth-child(odd) > div { grid-column: 1; grid-row: 1; }
.lunar-spec-highlights li:nth-child(odd)::after { left: calc(100% + 18px); }
.lunar-spec-highlights li:nth-child(even) { right: 5.4vw; }
.lunar-spec-highlights li:nth-child(even)::after { right: calc(100% + 18px); }
.lunar-spec-highlights li:nth-child(1), .lunar-spec-highlights li:nth-child(2) { top: 27%; }
.lunar-spec-highlights li:nth-child(3), .lunar-spec-highlights li:nth-child(4) { top: 47%; }
.lunar-spec-highlights li:nth-child(5), .lunar-spec-highlights li:nth-child(6) { top: 67%; }
.lunar-spec-highlights li > span { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid rgba(212,169,97,.75); border-radius: 50%; color: #e4b96e; font-size: 12px; font-weight: 700; }
.lunar-spec-highlights strong { display: block; margin: -4px 0 3px; font-size: clamp(21px, 2vw, 30px); line-height: 1; letter-spacing: -.04em; }
.lunar-spec-highlights p { margin: 0; color: rgba(255,255,255,.72); font-size: 16px; line-height: 1.3; letter-spacing: .01em; }
.lunar-spec-footer { position: absolute; z-index: 3; left: 4vw; right: 4vw; bottom: 21px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; }
.lunar-spec-footer > span { color: rgba(255,255,255,.64); font-size: 14px; font-weight: 700; letter-spacing: .12em; }
.lunar-spec-footer button { min-height: 52px; padding: 0 30px; border: 1px solid rgba(255,255,255,.72); background: rgba(17,18,18,.68); color: white; backdrop-filter: blur(12px); font-size: 14px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; cursor: pointer; }
.lunar-spec-footer button:hover { background: white; color: #171818; }
.lunar-spec-footer strong { justify-self: end; font-size: 17px; white-space: nowrap; }

.technical-overlay { position: fixed; z-index: 200; inset: 0; padding: 28px 3.5vw 20px; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; gap: 19px; overflow-y: auto; background: #151616; color: white; }
.technical-overlay::before { content: "LO—01"; position: fixed; right: -1vw; bottom: -5vw; color: rgba(255,255,255,.018); font: 500 22vw/.8 var(--sans); letter-spacing: -.08em; pointer-events: none; }
.technical-overlay-head { display: grid; grid-template-columns: 1fr auto 52px; align-items: start; gap: 34px; }
.technical-overlay-head p { margin: 0 0 7px; color: #d4a961; font-size: 14px; font-weight: 700; letter-spacing: .12em; }
.technical-overlay-head h2 { margin: 0; font: 500 clamp(36px, 3.7vw, 56px)/.94 var(--sans); letter-spacing: -.055em; }
.technical-overlay-head h2 em { color: #d3a357; font-style: normal; }
.technical-reference { padding-top: 10px; display: grid; gap: 5px; text-align: right; }
.technical-reference span { color: rgba(255,255,255,.58); font-size: 13px; letter-spacing: .08em; text-transform: uppercase; }
.technical-reference strong { font-size: 16px; font-weight: 500; }
.technical-overlay-head > button { width: 52px; height: 52px; flex: 0 0 auto; border: 1px solid rgba(255,255,255,.46); background: transparent; color: white; font: 35px/1 Arial, sans-serif; cursor: pointer; }
.technical-groups { min-height: 0; display: grid; grid-template-columns: .88fr 1.12fr 1.18fr; border-top: 1px solid rgba(255,255,255,.16); border-left: 1px solid rgba(255,255,255,.16); }
.technical-group { min-width: 0; padding: 19px 21px 15px; border-right: 1px solid rgba(255,255,255,.16); border-bottom: 1px solid rgba(255,255,255,.16); }
.technical-group > header { display: flex; align-items: center; gap: 12px; margin-bottom: 11px; }
.technical-group > header span { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid rgba(212,169,97,.65); border-radius: 50%; color: #e1b66b; font-size: 12px; }
.technical-group h3 { margin: 0; font-size: 23px; font-weight: 500; }
.technical-group dl { margin: 0; }
.technical-group dl > div { padding: 10px 0 11px; display: grid; grid-template-columns: minmax(112px, .42fr) 1fr; gap: 15px; border-top: 1px solid rgba(255,255,255,.095); }
.technical-group dt { color: #d4a961; font-size: 14px; font-weight: 700; letter-spacing: .04em; }
.technical-group dd { margin: 0; color: rgba(255,255,255,.84); font-size: 16px; line-height: 1.35; }
.technical-overlay-footer { display: flex; align-items: center; justify-content: space-between; gap: 22px; }
.technical-overlay-footer p { margin: 0; color: rgba(255,255,255,.58); font-size: 13px; letter-spacing: .08em; text-transform: uppercase; }
.technical-close-bottom { min-height: 46px; padding: 0 28px; border: 1px solid rgba(255,255,255,.55); background: white; color: #171818; font-size: 14px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; cursor: pointer; }

.featured-products { padding: 0 6vw 140px; text-align: center; }
.featured-products .button { margin-top: 52px; }
.product-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 72px 24px; }
.product-grid.compact { grid-template-columns: repeat(4, 1fr); }
.product-card { text-align: left; min-width: 0; }
.product-visual { height: min(50vw, 590px); background: #e8e5de; display: block; overflow: hidden; position: relative; }
.compact .product-visual { height: min(34vw, 470px); }
.product-visual img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.8,.2,1); }
.product-card:hover .product-visual img { transform: scale(1.035); }
.product-code { position: absolute; left: 16px; top: 16px; padding: 8px 10px; background: rgba(250,248,242,.9); font-size: 9px; letter-spacing: .15em; }
.product-arrow { position: absolute; right: 16px; top: 16px; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: rgba(250,248,242,.92); }
.product-meta { display: flex; justify-content: space-between; gap: 12px; margin: 20px 0 6px; text-transform: uppercase; letter-spacing: .13em; font-size: 9px; }
.product-meta p { margin: 0; }
.product-card h3 { font: 34px var(--serif); margin: 0 0 10px; }
.product-line { min-height: 42px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
.homage-label { margin: 13px 0 0; padding-top: 13px; border-top: 1px solid var(--line); font-size: 10px; text-transform: uppercase; letter-spacing: .12em; color: var(--muted); }
.product-tools { display: flex; justify-content: space-between; align-items: center; margin-top: 18px; }
.product-tools label { font-size: 12px; display: flex; align-items: center; gap: 8px; }
.product-tools input { width: 18px; height: 18px; accent-color: var(--ink); }
.product-tools a { min-height: 44px; display: inline-flex; align-items: center; gap: 18px; font-size: 12px; font-weight: 700; }

.homage-manifesto { display: grid; grid-template-columns: 1.15fr .85fr; background: var(--dark); color: var(--white); }
.manifesto-media { min-height: 760px; }
.manifesto-media img { width: 100%; height: 100%; object-fit: cover; }
.manifesto-copy { padding: 110px 7vw; align-self: center; }
.manifesto-copy h2 { margin: 25px 0 30px; }
.manifesto-copy > p:not(.kicker) { font-size: 17px; line-height: 1.7; color: #c8c9c3; }
.manifesto-copy ul { list-style: none; padding: 0; margin: 30px 0; border-top: 1px solid rgba(255,255,255,.2); }
.manifesto-copy li { padding: 17px 0; border-bottom: 1px solid rgba(255,255,255,.2); display: flex; gap: 14px; }
.manifesto-copy li span { color: var(--gold); }

.quality-section { padding: 130px 6vw; background: var(--paper); }
.section-head { display: flex; justify-content: space-between; gap: 60px; align-items: flex-start; margin-bottom: 70px; }
.section-head h2 { max-width: 830px; margin: 0; }
.quality-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 7vw; align-items: center; }
.quality-watch { min-height: 650px; background: #e6e1d8; overflow: hidden; position: relative; }
.quality-watch img { width: 100%; height: 100%; position: absolute; object-fit: cover; }
.orbit { position: absolute; border: 1px solid rgba(180,135,68,.45); border-radius: 50%; pointer-events: none; }
.orbit-a { width: 42%; aspect-ratio: 1; left: 29%; top: 29%; }
.orbit-b { width: 62%; aspect-ratio: 1; left: 19%; top: 19%; }
.quality-grid ol, .exploded-copy ol { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--line); }
.quality-grid li, .exploded-copy li { display: flex; gap: 24px; padding: 24px 0; border-bottom: 1px solid var(--line); }
.quality-grid li > span, .exploded-copy li > span { color: var(--gold); font-size: 11px; }
.quality-grid li b, .exploded-copy li b { font-size: 14px; }
.quality-grid li p, .exploded-copy li p { margin: 6px 0 0; color: var(--muted); font-size: 13px; line-height: 1.5; }

.madrid-section { min-height: 820px; position: relative; background: var(--dark); color: var(--white); }
.madrid-section > img { position: absolute; width: 100%; height: 100%; object-fit: cover; opacity: .6; }
.madrid-overlay { position: relative; z-index: 1; padding: 135px 6vw; max-width: 1000px; }
.madrid-overlay h2 { margin: 26px 0 55px; }
.madrid-overlay ol { list-style: none; padding: 0; margin: 0 0 42px; display: grid; grid-template-columns: repeat(3, 1fr); max-width: 720px; counter-reset: steps; border-top: 1px solid rgba(255,255,255,.25); }
.madrid-overlay li { padding: 20px 10px 20px 0; border-bottom: 1px solid rgba(255,255,255,.25); counter-increment: steps; }
.madrid-overlay li::before { content: "0" counter(steps) " "; color: #d1a355; font-size: 10px; margin-right: 9px; }

.club-preview { padding: 130px 8vw; display: grid; grid-template-columns: .9fr 1.1fr; gap: 10vw; align-items: center; background: #e8e3d9; }
.club-copy h2 { margin: 28px 0; }
.club-copy > p:not(.section-number) { color: var(--muted); font-size: 17px; line-height: 1.7; max-width: 580px; }
.club-phone-wrap { min-height: 720px; position: relative; display: grid; place-items: center; }
.club-phone-wrap::before { content: ""; position: absolute; width: 520px; height: 520px; border: 1px solid rgba(49,83,71,.25); border-radius: 50%; }
.float-card { position: absolute; right: 2%; bottom: 18%; padding: 20px 25px; background: var(--white); box-shadow: 0 25px 60px rgba(0,0,0,.15); display: grid; gap: 5px; }
.float-card b { font-size: 13px; }
.float-card span { font-size: 10px; color: var(--muted); letter-spacing: .1em; }

.phone { width: 310px; min-height: 630px; background: #f8f6f1; color: var(--ink); border: 8px solid #20211f; border-radius: 45px; padding: 20px 17px; box-shadow: 0 45px 80px rgba(0,0,0,.28); position: relative; z-index: 2; overflow: hidden; }
.phone-bar { display: flex; justify-content: space-between; font-size: 9px; margin-bottom: 28px; }
.phone-bar i { width: 66px; height: 18px; border-radius: 10px; background: #20211f; position: absolute; top: 8px; left: 50%; transform: translateX(-50%); }
.phone-greeting { display: flex; justify-content: space-between; align-items: center; }
.phone-greeting div { display: grid; gap: 4px; }
.phone-greeting small { color: var(--muted); }
.phone-greeting > span { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--green); color: #fff; font-size: 10px; }
.phone-member { display: flex; justify-content: space-between; font-size: 7px; letter-spacing: .11em; margin: 19px 0 12px; }
.phone-watch { height: 240px; position: relative; overflow: hidden; background: #222; }
.phone-watch img { width: 100%; height: 100%; object-fit: cover; }
.phone-watch::after { content: ""; position: absolute; inset: 55% 0 0; background: rgba(0,0,0,.52); }
.phone-watch div { position: absolute; z-index: 1; left: 15px; bottom: 15px; display: grid; color: #fff; }
.phone-watch small { font-size: 7px; letter-spacing: .13em; }
.phone-watch b { font: 24px var(--serif); margin: 4px 0; }
.phone-watch span { font-size: 8px; }
.phone-actions { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; margin: 10px 0; }
.phone-actions span { height: 58px; background: #ebe7df; display: grid; place-items: center; align-content: center; gap: 5px; font-size: 8px; }
.phone-actions b { font-size: 16px; }
.phone-notice { background: var(--green); color: white; padding: 14px; display: grid; gap: 4px; }
.phone-notice small { font-size: 7px; letter-spacing: .12em; color: #d9c297; }
.phone-notice b { font-size: 11px; }
.phone-notice span { font-size: 8px; }
.phone-nav { position: absolute; left: 0; right: 0; bottom: 0; height: 53px; border-top: 1px solid #ddd8cf; display: grid; grid-template-columns: repeat(4,1fr); align-items: center; text-align: center; background: #f8f6f1; }

.final-cta { padding: 150px 6vw; text-align: center; }
.final-cta h2 { margin: 28px auto 42px; max-width: 1050px; }
.final-cta .button-row { justify-content: center; }

.site-footer { background: #111311; color: #d9dbd4; padding: 80px 6vw 28px; }
.footer-top { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 8vw; padding-bottom: 75px; }
.footer-top .logo-word { font-size: 42px; color: #fff; }
.footer-top p { max-width: 450px; margin: 25px 0 0; font-size: 14px; line-height: 1.7; color: #94988f; }
.footer-links { display: grid; align-content: start; gap: 18px; font-size: 12px; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.15); padding-top: 22px; display: grid; grid-template-columns: 1fr 3fr; gap: 8vw; font-size: 9px; line-height: 1.6; color: #858981; }
.footer-bottom p { margin: 0; }

.page-hero { padding: 135px 6vw 90px; min-height: 520px; display: flex; flex-direction: column; justify-content: flex-end; border-bottom: 1px solid var(--line); }
.page-hero h1 { margin: 28px 0; }
.page-hero > p:last-child { max-width: 720px; color: var(--muted); font-size: 18px; line-height: 1.65; }
.collection-page { padding: 70px 6vw 150px; }
.filter-row { display: flex; gap: 9px; flex-wrap: wrap; margin-bottom: 50px; }
.filter-row button { min-height: 44px; padding: 0 20px; border: 1px solid var(--line); background: transparent; cursor: pointer; }
.filter-row button.selected { background: var(--ink); color: white; border-color: var(--ink); }
.compare-bar { position: sticky; left: 2vw; right: 2vw; bottom: 18px; z-index: 30; margin: 35px auto; width: min(900px, 92vw); background: var(--ink); color: white; padding: 17px 20px; display: flex; align-items: center; justify-content: space-between; gap: 25px; box-shadow: 0 18px 50px rgba(0,0,0,.28); }
.compare-bar div { display: grid; gap: 5px; }
.compare-bar span { font-size: 9px; text-transform: uppercase; letter-spacing: .14em; color: #b7b9b3; }
.compare-bar strong { font-size: 13px; }
.compare-bar button { min-height: 44px; border: 0; padding: 0 20px; background: #d1a355; cursor: pointer; font-size: 11px; font-weight: 700; text-transform: uppercase; }
.comparison-table { padding-top: 130px; }
.comparison-table table, .finish-table table { border-collapse: collapse; width: 100%; min-width: 720px; }
.comparison-table th, .comparison-table td, .finish-table th, .finish-table td { padding: 20px; text-align: left; border-bottom: 1px solid var(--line); font-size: 13px; }
.comparison-table thead th, .finish-table thead th { background: var(--ink); color: white; }
.table-scroll, .finish-table { overflow-x: auto; }
.finish-system { padding: 130px 6vw; border-top: 1px solid var(--line); }
.finish-system > div:first-child { display: grid; grid-template-columns: 1fr 2fr; margin-bottom: 60px; }
.finish-cards { display: grid; grid-template-columns: repeat(4,1fr); }
.finish-cards article { min-height: 330px; padding: 30px; border: 1px solid var(--line); border-right: 0; display: flex; flex-direction: column; }
.finish-cards article:last-child { border-right: 1px solid var(--line); }
.finish-cards article.dark { background: var(--dark); color: white; }
.finish-cards span { color: var(--gold); font-size: 11px; }
.finish-cards h3 { font: 46px var(--serif); margin: auto 0 4px; }
.finish-cards b { font-size: 10px; text-transform: uppercase; letter-spacing: .13em; }
.finish-cards p { color: var(--muted); line-height: 1.55; font-size: 13px; margin: 20px 0 0; }
.finish-cards .dark p { color: #afb2aa; }

.pdp-hero { min-height: calc(100svh - 76px); display: grid; grid-template-columns: 1.1fr .9fr; }
.pdp-gallery { padding: 25px; background: #e9e5dc; display: grid; grid-template-columns: 76px 1fr; gap: 18px; min-width: 0; }
.pdp-main-image { grid-column: 2; min-width: 0; }
.pdp-main-image img { width: 100%; height: calc(100svh - 126px); object-fit: cover; }
.pdp-thumbs { grid-row: 1; grid-column: 1; display: grid; align-content: start; gap: 10px; }
.pdp-thumbs button { width: 76px; height: 90px; border: 1px solid transparent; padding: 0; background: #ddd8cf; cursor: pointer; }
.pdp-thumbs button.active { border-color: var(--ink); }
.pdp-thumbs img { width: 100%; height: 100%; object-fit: cover; }
.pdp-buy { padding: 7vh 6vw; align-self: center; }
.pdp-buy h1 { margin: 20px 0 12px; }
.pdp-homage { text-transform: uppercase; font-size: 10px; letter-spacing: .14em; color: var(--gold); }
.pdp-description { font-size: 16px; line-height: 1.6; color: var(--muted); max-width: 560px; }
.pdp-price { display: flex; align-items: baseline; gap: 14px; padding: 20px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin: 26px 0; }
.pdp-price strong { font: 34px var(--serif); }
.pdp-price span { font-size: 10px; color: var(--muted); }
.finish-selector { border: 0; padding: 0; margin: 0 0 22px; display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; }
.finish-selector legend { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; margin-bottom: 13px; }
.finish-selector button { min-height: 72px; padding: 12px; display: grid; grid-template-columns: 1fr auto; text-align: left; border: 1px solid var(--line); background: transparent; cursor: pointer; }
.finish-selector button.active { border: 2px solid var(--ink); padding: 11px; background: var(--paper); }
.finish-selector button span { font-weight: 700; }
.finish-selector button small { grid-row: 2; color: var(--muted); }
.finish-selector button b { grid-row: 1/3; grid-column: 2; align-self: center; font-size: 12px; }
.live-specs { margin: 0 0 25px; }
.live-specs div { display: grid; grid-template-columns: 110px 1fr; gap: 14px; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 11px; }
.live-specs dt { text-transform: uppercase; letter-spacing: .08em; color: var(--muted); }
.live-specs dd { margin: 0; }
.buy-note { text-align: center; font-size: 10px; color: var(--muted); margin: 13px 0 0; }
.pdp-story { padding: 140px 8vw; display: grid; grid-template-columns: 1.2fr .8fr; gap: 10vw; }
.pdp-story h2 { margin: 30px 0 0; }
.pdp-story > div:last-child { padding-top: 70px; font-size: 18px; color: var(--muted); line-height: 1.75; }
.exploded-section { display: grid; grid-template-columns: 1.15fr .85fr; background: var(--paper); }
.exploded-media { min-height: 740px; }
.exploded-media img { width: 100%; height: 100%; object-fit: cover; }
.exploded-copy { padding: 90px 6vw; align-self: center; }
.exploded-copy h2 { margin: 25px 0 45px; }
.finish-comparison { padding: 130px 6vw; }
.finish-table th small { display: block; margin-top: 5px; color: var(--muted); font-weight: 400; }
.pdp-service { background: var(--green); color: white; padding: 120px 7vw; }
.pdp-service h2 { margin: 24px 0 50px; }
.pdp-service ol { list-style: none; padding: 0; margin: 0 0 45px; display: grid; grid-template-columns: repeat(6,1fr); counter-reset: work; border-top: 1px solid rgba(255,255,255,.25); }
.pdp-service li { padding: 22px 8px 22px 0; border-bottom: 1px solid rgba(255,255,255,.25); font-size: 12px; counter-increment: work; }
.pdp-service li::before { content: "0" counter(work); display: block; color: #d9bd88; margin-bottom: 12px; }
.mobile-buy { display: none; }

.philosophy-hero, .workshop-hero { min-height: calc(100svh - 76px); position: relative; display: flex; align-items: flex-end; background: var(--dark); color: white; }
.philosophy-hero img, .workshop-hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .58; }
.philosophy-hero > div, .workshop-hero > div { position: relative; z-index: 1; padding: 10vh 6vw; max-width: 1100px; }
.philosophy-hero h1, .workshop-hero h1 { margin: 25px 0; }
.philosophy-hero > div > p:last-child, .workshop-hero > div > p:last-child { max-width: 700px; font-size: 18px; line-height: 1.65; color: #d7d8d2; }
.belief, .club-promise { grid-template-columns: 20% 1.1fr .7fr; }
.belief > div:last-child p, .club-promise > div:last-child p { margin-bottom: 20px; }
.honesty-block { background: var(--dark); color: white; padding: 130px 6vw; display: grid; grid-template-columns: .8fr 1.2fr; gap: 8vw; }
.honesty-block h2 { margin: 24px 0; }
.honesty-columns { display: grid; grid-template-columns: 1fr 1fr; }
.honesty-columns article { padding: 35px; border: 1px solid rgba(255,255,255,.2); }
.honesty-columns article + article { border-left: 0; }
.honesty-columns article > span { color: #d1a355; font-size: 10px; letter-spacing: .14em; }
.honesty-columns h3 { font: 28px var(--serif); margin: 45px 0 25px; }
.honesty-columns ul { padding-left: 18px; color: #bcbfb7; line-height: 1.7; font-size: 13px; }
.honesty-columns li { margin-bottom: 12px; }
.process-section, .benefits-section { padding: 130px 6vw; }
.process-grid, .benefits-grid { display: grid; grid-template-columns: repeat(3,1fr); }
.process-grid article, .benefits-grid article { min-height: 290px; padding: 30px; border: 1px solid var(--line); margin: -1px 0 0 -1px; display: flex; flex-direction: column; }
.process-grid span, .benefits-grid article > span { color: var(--gold); font-size: 11px; }
.process-grid h3, .benefits-grid h3 { font: 32px var(--serif); margin: auto 0 14px; }
.process-grid p, .benefits-grid p { color: var(--muted); font-size: 14px; line-height: 1.6; margin: 0; }
.benefits-grid article > b { font-size: 10px; margin-top: 22px; }
.origin-section { display: grid; grid-template-columns: .85fr 1.15fr; background: #dcd7cd; }
.origin-section > div { padding: 120px 7vw; align-self: center; }
.origin-section h2 { margin: 28px 0; }
.origin-section p:last-child { color: var(--muted); line-height: 1.75; }
.origin-section img { width: 100%; height: 100%; min-height: 700px; object-fit: cover; }

.club-hero { min-height: calc(100svh - 76px); background: var(--green); color: white; display: grid; grid-template-columns: 1fr .8fr; align-items: center; padding: 80px 8vw; overflow: hidden; }
.club-hero > div:first-child { max-width: 850px; position: relative; z-index: 2; }
.club-hero h1 { margin: 25px 0 30px; }
.club-hero > div:first-child > p:last-of-type { font-size: 18px; line-height: 1.7; max-width: 700px; color: #d2dbd5; }
.club-hero-device { min-height: 700px; position: relative; display: grid; place-items: center; }
.device-glow { position: absolute; width: 530px; height: 530px; border-radius: 50%; border: 1px solid rgba(255,255,255,.18); }
.benefits-section { background: var(--paper); }
.club-journey { padding: 130px 7vw; background: var(--dark); color: white; display: grid; grid-template-columns: .8fr 1.2fr; gap: 8vw; }
.club-journey h2 { margin: 24px 0; }
.club-journey ol { list-style: none; padding: 0; margin: 0; }
.club-journey li { display: grid; grid-template-columns: 65px 1fr; padding: 24px 0; border-bottom: 1px solid rgba(255,255,255,.18); }
.club-journey li span { color: #d1a355; font-size: 11px; }
.club-journey li p { margin: 0; font-size: 16px; }
.privacy-section { padding: 130px 8vw; display: grid; grid-template-columns: 1fr .7fr; gap: 10vw; }
.privacy-section h2 { margin: 26px 0; }
.privacy-section > div:last-child { color: var(--muted); line-height: 1.7; }
.privacy-section li { margin-bottom: 11px; }

.workshop-intro { grid-template-columns: 25% 1fr; }
.workshop-steps { display: grid; grid-template-columns: repeat(3,1fr); padding: 0 6vw 130px; }
.workshop-steps article { min-height: 270px; padding: 30px; border: 1px solid var(--line); margin: -1px 0 0 -1px; display: flex; flex-direction: column; }
.workshop-steps span { color: var(--gold); font-size: 11px; }
.workshop-steps h3 { font: 32px var(--serif); margin: auto 0 14px; }
.workshop-steps p { color: var(--muted); font-size: 14px; line-height: 1.6; }
.service-panel { background: var(--green); color: white; padding: 120px 7vw; display: grid; grid-template-columns: .8fr 1.2fr; gap: 9vw; }
.service-panel h2 { margin: 24px 0; }
.service-panel > div:first-child > p:not(.kicker) { color: #c9d3cc; line-height: 1.7; }
.service-list { display: grid; grid-template-columns: 1fr 1fr; }
.service-list article { min-height: 220px; padding: 25px; border: 1px solid rgba(255,255,255,.18); margin: -1px 0 0 -1px; display: flex; flex-direction: column; }
.service-list span { color: #d1a355; font-size: 10px; }
.service-list h3 { font: 27px var(--serif); margin: auto 0 10px; }
.service-list p { color: #c7d0ca; font-size: 13px; line-height: 1.6; }

.account-page { min-height: calc(100svh - 76px); background: var(--green); padding: 7vw; }
.account-panel { min-height: 720px; display: grid; grid-template-columns: 1.1fr .9fr; max-width: 1320px; margin: auto; }
.account-copy { color: white; padding: 65px 6vw 65px 0; align-self: center; }
.account-copy h1 { margin: 26px 0; }
.account-copy > p:not(.kicker) { color: #d0d9d3; font-size: 18px; line-height: 1.7; }
.account-copy ul { list-style: none; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-top: 35px; }
.account-copy li::before { content: "✓"; color: #d1a355; margin-right: 8px; }
.login-card { background: var(--paper); padding: 65px; align-self: center; }
.login-card h2 { font-size: 42px; margin: 22px 0 35px; }
.login-card label, .cart-summary label { display: grid; gap: 9px; margin: 0 0 18px; text-transform: uppercase; font-size: 10px; letter-spacing: .12em; }
.login-card input, .cart-summary input { width: 100%; min-height: 50px; border: 1px solid var(--line); background: white; padding: 0 14px; font-size: 14px; letter-spacing: 0; text-transform: none; }
.text-button { width: 100%; min-height: 44px; border: 0; background: transparent; font-size: 12px; text-decoration: underline; cursor: pointer; }
.form-divider { height: 42px; display: grid; place-items: center; position: relative; color: var(--muted); }
.form-divider::before { content: ""; position: absolute; left: 0; right: 0; height: 1px; background: var(--line); }
.form-divider span { position: relative; background: var(--paper); padding: 0 12px; }
.form-note { font-size: 10px; color: var(--muted); line-height: 1.5; margin: 18px 0 0; text-align: center; }
.back-link { display: block; color: white; max-width: 1320px; margin: 30px auto 0; font-size: 12px; }

.cart-page { padding: 100px 6vw 140px; display: grid; grid-template-columns: 1.25fr .75fr; gap: 8vw; min-height: 75vh; }
.cart-lines h1 { font-size: 68px; margin: 22px 0 45px; }
.cart-line { display: grid; grid-template-columns: 130px 1fr 100px 110px; gap: 24px; align-items: center; padding: 24px 0; border-top: 1px solid var(--line); }
.cart-line img { width: 130px; height: 150px; object-fit: cover; }
.cart-line p { font-size: 10px; text-transform: uppercase; letter-spacing: .12em; color: var(--muted); margin: 0 0 6px; }
.cart-line h2 { font: 32px var(--serif); margin: 0; }
.cart-line button { border: 0; padding: 12px 0; background: transparent; text-decoration: underline; color: var(--muted); font-size: 11px; cursor: pointer; }
.cart-line label { display: grid; gap: 8px; font-size: 9px; text-transform: uppercase; }
.cart-line select { min-height: 44px; border: 1px solid var(--line); background: transparent; }
.cart-summary { background: var(--paper); padding: 40px; align-self: start; position: sticky; top: 100px; }
.cart-summary > div { display: flex; justify-content: space-between; gap: 20px; padding: 17px 0; border-bottom: 1px solid var(--line); font-size: 13px; }
.cart-summary .kicker { margin-bottom: 20px; }
.cart-summary .total { margin-bottom: 30px; font-size: 17px; }
.cart-summary > p:last-child { font-size: 10px; line-height: 1.5; color: var(--muted); text-align: center; margin: 15px 0 0; }
.cart-empty { min-height: 70vh; padding: 130px 6vw; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.cart-empty h1 { margin: 25px 0; }
.cart-empty > p:not(.kicker) { max-width: 620px; color: var(--muted); line-height: 1.7; }
.cart-empty .button { margin-top: 25px; }
.success-mark { width: 70px; height: 70px; display: grid; place-items: center; border-radius: 50%; background: var(--green); color: white; font-size: 28px; margin-bottom: 28px; }

@media (max-width: 1050px) {
  .site-header { padding: 0 22px; }
  .menu-toggle { display: block; order: 3; }
  .brand { min-width: auto; }
  .header-actions { min-width: auto; margin-left: auto; }
  .account-link { display: none; }
  .main-nav { position: fixed; top: 76px; left: 0; right: 0; background: white; border-bottom: 1px solid var(--line); padding: 20px 24px 30px; display: none; flex-direction: column; align-items: flex-start; gap: 0; }
  .main-nav.open { display: flex; }
  .main-nav a { width: 100%; min-height: 52px; display: flex; align-items: center; border-bottom: 1px solid var(--line); }
  .trust-card { flex-basis: 78vw; }
  .product-grid, .product-grid.compact { grid-template-columns: repeat(2,1fr); }
  .product-visual, .compact .product-visual { height: 54vw; }
  .homage-manifesto, .quality-grid, .exploded-section { grid-template-columns: 1fr 1fr; }
  .club-preview, .club-hero { grid-template-columns: 1fr 1fr; gap: 4vw; }
  .club-phone-wrap::before, .device-glow { width: 390px; height: 390px; }
  .pdp-hero { grid-template-columns: 1fr; }
  .pdp-main-image img { height: 75svh; }
  .pdp-buy { padding: 65px 7vw; }
  .pdp-service ol { grid-template-columns: repeat(3,1fr); }
  .belief, .club-promise { grid-template-columns: 1fr 1.2fr; }
  .belief > .section-number, .club-promise > .section-number { grid-column: 1 / -1; }
  .cart-page { grid-template-columns: 1fr; }
  .cart-summary { position: static; }
}

@media (max-width: 720px) {
  h1 { font-size: clamp(46px, 14vw, 66px); }
  h2 { font-size: clamp(38px, 11.5vw, 54px); }
  .site-header { height: 68px; }
  .site-header .brand-logo { width: 104px; }
  .header-actions { gap: 13px; }
  .support-icon { display: none; }
  .main-nav { top: 68px; }
  .cart-link span { display: none; }
  .home-hero { min-height: calc(100svh - 68px); }
  .lunar-hero-image { object-position: center center; }
  .lunar-hero-media.is-close .lunar-hero-image { transform: scale(1.28); object-position: center 62%; }
  .home-hero-copy.lunar-home-copy { top: 5%; width: 94%; }
  .lunar-eyebrow { margin-bottom: 1px; font-size: 12px; }
  .lunar-title { gap: 8px; margin-bottom: 1px; }
  .lunar-title img { width: 120px; }
  .lunar-title span { font-size: 56px; }
  .lunar-specs { font-size: 11px; }
  .lunar-specs i { padding: 0 3px; }
  .lunar-price { margin-top: 4px; font-size: 13px; }
  .lunar-actions { gap: 7px; margin-top: 9px; padding: 0 14px; }
  .lunar-action { width: 148px; min-height: 45px; font-size: 13px; }
  .lunar-hero-arrow { top: 59%; width: 38px; height: 46px; font-size: 32px; }
  .lunar-hero-arrow.previous { left: 10px; }
  .lunar-hero-arrow.next { right: 10px; }
  .lunar-hero-dots { bottom: 13px; }
  .lunar-dialogue { min-height: calc(100svh - 68px); }
  .lunar-dialogue::before { inset: -30px; filter: blur(25px); opacity: .14; }
  .lunar-dialogue-image { top: 170px; width: 465px; }
  .lunar-dialogue-veil { background: linear-gradient(180deg, rgba(244,239,234,.99) 0%, rgba(244,239,234,.9) 25%, rgba(244,239,234,.3) 42%, rgba(244,239,234,0) 61%); }
  .lunar-dialogue-copy { top: 24px; left: 50%; right: auto; width: calc(100% - 36px); transform: translateX(-50%); }
  .lunar-dialogue-copy h2 { margin-bottom: 13px; font-size: clamp(31px, 8.6vw, 36px); line-height: 1; }
  .lunar-dialogue-copy p { max-width: 360px; font-size: 17px; line-height: 1.26; }
  .lunar-dialogue-number { right: 16px; bottom: 16px; }
  .lunar-pride { min-height: calc(100svh - 68px); }
  .lunar-pride-image { object-position: center top; }
  .lunar-pride-veil { background: linear-gradient(180deg, rgba(0,0,0,.57) 0%, rgba(0,0,0,.28) 29%, rgba(0,0,0,.04) 58%, rgba(0,0,0,.14) 100%); }
  .lunar-pride-copy { top: 4%; width: calc(100% - 28px); }
  .lunar-pride-copy p { font-size: clamp(16px, 4.6vw, 19px); line-height: 1.05; }
  .lunar-pride-copy h2 { margin: 2px 0 4px; font-size: clamp(30px, 8.5vw, 36px); line-height: 1; letter-spacing: -.04em; }
  .lunar-pride-number { right: 16px; bottom: 16px; }
  .trust-carousel { padding: 14px 0 18px; }
  .trust-carousel-track { gap: 10px; padding-inline: 16px; scroll-padding-inline: 16px; }
  .trust-card { flex-basis: calc(100vw - 48px); height: clamp(350px, 46svh, 420px); }
  .trust-card-copy { top: 8%; width: calc(100% - 26px); }
  .trust-card-copy h2 { margin-bottom: 5px; font-size: clamp(30px, 9vw, 38px); line-height: 1; letter-spacing: -.045em; }
  .trust-card-copy p { max-width: 310px; margin-inline: auto; font-size: clamp(15px, 4.4vw, 18px); line-height: 1.18; }
  .trust-card-number { right: 15px; bottom: 14px; }
  .trust-carousel-arrow { display: none; }
  .decision-act { height: calc(100svh - 68px); min-height: 660px; padding: 10px 12px 7px; grid-template-rows: auto 34px minmax(0, 1fr) auto auto; gap: 6px; }
  .decision-head { display: block; }
  .decision-kicker { margin-bottom: 3px; font-size: 7px; }
  .decision-head h2 { font-size: clamp(27px, 7.8vw, 32px); line-height: .94; }
  .decision-head > p { margin-top: 5px; max-width: none; font-size: 9px; line-height: 1.3; }
  .decision-mobile-switch { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid #1d1e1c; }
  .decision-mobile-switch button { border: 0; border-right: 1px solid #1d1e1c; background: transparent; color: #1d1e1c; font-size: 9px; font-weight: 700; }
  .decision-mobile-switch button:last-child { border-right: 0; }
  .decision-mobile-switch button.active { background: #1d1e1c; color: white; }
  .decision-main { display: block; min-height: 0; }
  .decision-price-panel, .decision-movement-panel { display: none; width: 100%; height: 100%; padding: 7px; }
  .decision-price-panel.mobile-active, .decision-movement-panel.mobile-active { display: grid; }
  .decision-price-panel { grid-template-rows: 30px auto 18px minmax(0, 1fr) 48px; }
  .decision-model-tabs button { padding-inline: 4px; font-size: 7px; letter-spacing: .02em; }
  .decision-panel-intro { min-height: 42px; padding: 5px 0; grid-template-columns: auto 1fr; gap: 10px; }
  .decision-panel-intro strong { font-size: 14px; }
  .decision-panel-intro span { max-height: 28px; overflow: hidden; font-size: 7px; line-height: 1.3; }
  .decision-market-labels { grid-template-columns: 3fr 2fr; }
  .decision-market-labels span { font-size: 5.5px; letter-spacing: .05em; }
  .decision-routes { display: flex; gap: 4px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .decision-routes::-webkit-scrollbar { display: none; }
  .decision-routes article { flex: 0 0 134px; padding: 7px; scroll-snap-align: start; }
  .decision-routes article > span { min-height: 24px; font-size: 8px; }
  .decision-routes article b { min-height: 44px; font-size: 12px; line-height: 1.18; }
  .decision-routes article strong { font-size: 19px; }
  .decision-routes article small { font-size: 8px; line-height: 1.25; }
  .decision-alternatives { overflow-x: auto; grid-template-columns: 112px repeat(3, 128px); scrollbar-width: none; }
  .decision-alternatives::-webkit-scrollbar { display: none; }
  .decision-alternatives > span, .decision-alternatives > div { padding: 5px 6px; }
  .decision-alternatives > span { font-size: 6px; }
  .decision-movement-panel { grid-template-rows: auto minmax(0, 1fr); gap: 5px; }
  .movement-intro { padding-bottom: 5px; }
  .movement-intro > p { margin-bottom: 2px; font-size: 6px; }
  .movement-intro h3 { margin-bottom: 4px; font-size: 22px; }
  .movement-intro > span { font-size: 7.5px; line-height: 1.28; }
  .movement-table { grid-template-rows: repeat(6, 1fr); }
  .movement-header { display: none; }
  .movement-row { min-height: 0; padding: 4px 6px; grid-template-columns: 58px minmax(0, 1fr) 62px; grid-template-rows: auto auto; gap: 1px 6px; font-size: 7px; }
  .movement-row > span:first-child { grid-row: 1 / 3; align-self: center; }
  .movement-row b { font-size: 8px; }
  .movement-row strong { font-size: 9px; text-align: right; }
  .movement-row > span:nth-child(n+4) { color: #6a6963; font-size: 6px; }
  .movement-row.laora > span:nth-child(n+4) { color: #2d2417; }
  .decision-answer { min-height: 104px; padding: 8px 8px 8px 79px; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto 29px; gap: 3px 8px; }
  .decision-answer > img { width: 72px; }
  .decision-product img { width: 59px; }
  .decision-product b { font-size: 10px; }
  .decision-price { font-size: 19px; }
  .decision-answer > p { grid-column: 1 / 3; font-size: 8.5px; }
  .decision-answer > a { grid-column: 1 / 3; min-height: 29px; font-size: 8px; }
  .decision-footnote { font-size: 5.5px; line-height: 1.18; }
  .lunar-spec-act { height: calc(100svh - 68px); min-height: 600px; }
  .lunar-spec-stage { align-items: start; }
  .lunar-spec-stage::before { background: linear-gradient(180deg, rgba(7,8,8,.68) 0%, rgba(7,8,8,.12) 29%, rgba(7,8,8,.22) 48%, rgba(7,8,8,.97) 72%); }
  .lunar-spec-stage::after { inset: 4% -22% 37%; }
  .lunar-spec-stage img { width: 118vw; height: 66%; object-position: center 33%; }
  .lunar-spec-intro { top: 18px; width: calc(100% - 28px); }
  .lunar-spec-intro > p { margin-bottom: 5px; font-size: 12px; letter-spacing: .1em; }
  .lunar-spec-intro h2 { max-width: 350px; margin-inline: auto; font-size: clamp(30px, 8.7vw, 36px); line-height: .93; }
  .lunar-spec-intro h2 em { display: block; }
  .lunar-spec-highlights { position: absolute; left: 14px; right: 14px; top: 51%; display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid rgba(255,255,255,.17); border-left: 1px solid rgba(255,255,255,.17); }
  .lunar-spec-highlights li, .lunar-spec-highlights li:nth-child(odd), .lunar-spec-highlights li:nth-child(even) { width: auto; min-width: 0; min-height: 84px; position: static; padding: 10px 8px; display: grid; grid-template-columns: 28px 1fr; gap: 8px; text-align: left; border-right: 1px solid rgba(255,255,255,.17); border-bottom: 1px solid rgba(255,255,255,.17); }
  .lunar-spec-highlights li::after { display: none; }
  .lunar-spec-highlights li:nth-child(odd) > span, .lunar-spec-highlights li:nth-child(odd) > div { grid-column: auto; grid-row: auto; }
  .lunar-spec-highlights li > span { width: 28px; height: 28px; font-size: 11px; }
  .lunar-spec-highlights strong { margin: 0 0 3px; font-size: clamp(20px, 5.5vw, 23px); }
  .lunar-spec-highlights p { font-size: 12px; line-height: 1.25; }
  .lunar-spec-footer { left: 14px; right: 14px; bottom: 12px; grid-template-columns: 1fr auto; gap: 10px; }
  .lunar-spec-footer > span { display: none; }
  .lunar-spec-footer button { min-height: 44px; padding: 0 12px; font-size: 12px; }
  .lunar-spec-footer strong { font-size: 15px; }
  .technical-overlay { padding: 16px 12px 12px; display: block; }
  .technical-overlay::before { display: none; }
  .technical-overlay-head { padding-bottom: 18px; grid-template-columns: 1fr 42px; gap: 12px; }
  .technical-overlay-head p { font-size: 12px; }
  .technical-overlay-head h2 { font-size: 31px; line-height: .94; }
  .technical-reference { grid-column: 1 / -1; grid-row: 2; padding-top: 0; text-align: left; }
  .technical-reference span { font-size: 12px; }
  .technical-reference strong { font-size: 15px; }
  .technical-overlay-head > button { grid-column: 2; grid-row: 1; width: 42px; height: 42px; font-size: 29px; }
  .technical-groups { display: block; border: 0; }
  .technical-group { padding: 15px 0 7px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.18); }
  .technical-group:first-child { border-top: 1px solid rgba(255,255,255,.18); }
  .technical-group > header { margin-bottom: 10px; }
  .technical-group h3 { font-size: 22px; }
  .technical-group dl > div { padding: 11px 0; grid-template-columns: 112px 1fr; gap: 12px; }
  .technical-group dt { font-size: 12px; }
  .technical-group dd { font-size: 14px; }
  .technical-overlay-footer { padding-top: 14px; }
  .technical-overlay-footer p { display: none; }
  .technical-close-bottom { width: 100%; min-height: 42px; }
  .editorial-intro, .belief, .club-promise, .workshop-intro { padding: 90px 24px; grid-template-columns: 1fr; gap: 38px; }
  .editorial-intro > div { grid-template-columns: 1fr; gap: 28px; }
  .market-map { padding: 85px 24px 75px; }
  .market-map-head { grid-template-columns: 1fr; gap: 32px; margin-bottom: 36px; }
  .market-map-intro > p { font-size: 14px; }
  .market-tabs { grid-template-columns: 1fr; }
  .market-tabs button { border-right: 0; border-bottom: 1px solid var(--ink); }
  .market-tabs button:last-child { border-bottom: 0; }
  .market-context { display: grid; gap: 10px; }
  .market-zones { display: none; }
  .market-cards { grid-template-columns: repeat(5, minmax(245px, 78vw)); overflow-x: auto; margin-inline: -24px; padding: 8px 24px 14px; scroll-snap-type: x mandatory; scrollbar-width: thin; }
  .market-card { min-height: 230px; scroll-snap-align: start; }
  .market-bottom { grid-template-columns: 1fr; }
  .market-alternatives > div { grid-template-columns: 1fr; }
  .market-alternatives span { min-height: 62px; }
  .laora-value { padding: 190px 22px 24px; grid-template-columns: 1fr; gap: 14px; }
  .laora-value > img { width: 100%; height: 170px; object-position: center 45%; }
  .laora-value > a { justify-self: start; }
  .product-grid, .product-grid.compact { grid-template-columns: 1fr; }
  .featured-products, .collection-page { padding: 0 24px 100px; }
  .product-visual, .compact .product-visual { height: 118vw; max-height: 620px; }
  .homage-manifesto, .quality-grid, .club-preview, .exploded-section, .origin-section, .honesty-block, .club-journey, .privacy-section, .service-panel, .account-panel, .club-hero { grid-template-columns: 1fr; }
  .manifesto-media, .exploded-media, .origin-section img { min-height: 520px; }
  .manifesto-copy, .exploded-copy { padding: 80px 24px; }
  .quality-section, .process-section, .benefits-section, .finish-system, .pdp-story, .finish-comparison { padding: 90px 24px; }
  .section-head { display: block; margin-bottom: 45px; }
  .section-head .section-number { margin-bottom: 26px; }
  .quality-watch { min-height: 460px; }
  .madrid-section { min-height: 780px; }
  .madrid-overlay { padding: 90px 24px; }
  .madrid-overlay ol { grid-template-columns: 1fr 1fr; }
  .club-preview { padding: 90px 24px; }
  .club-phone-wrap { min-height: 690px; }
  .final-cta { padding: 100px 24px; }
  .footer-top, .footer-bottom { grid-template-columns: 1fr; }
  .footer-top { gap: 42px; }
  .page-hero { min-height: 470px; padding: 90px 24px 65px; }
  .filter-row { overflow-x: auto; flex-wrap: nowrap; margin-inline: -24px; padding: 0 24px 10px; }
  .filter-row button { white-space: nowrap; }
  .finish-system > div:first-child { grid-template-columns: 1fr; gap: 25px; }
  .finish-cards { grid-template-columns: 1fr; }
  .finish-cards article { border-right: 1px solid var(--line); min-height: 240px; }
  .pdp-gallery { grid-template-columns: 1fr; padding: 0; }
  .pdp-main-image { grid-column: 1; }
  .pdp-main-image img { height: 68svh; min-height: 500px; }
  .pdp-thumbs { grid-row: 2; grid-column: 1; display: flex; padding: 10px 20px; overflow-x: auto; }
  .pdp-buy { padding: 60px 24px 90px; }
  .pdp-buy h1 { font-size: 64px; }
  .pdp-story { gap: 20px; }
  .pdp-story > div:last-child { padding-top: 15px; font-size: 16px; }
  .finish-selector { grid-template-columns: 1fr; }
  .pdp-service { padding: 90px 24px; }
  .pdp-service ol { grid-template-columns: 1fr 1fr; }
  .mobile-buy { position: fixed; z-index: 45; left: 0; right: 0; bottom: 0; min-height: 64px; padding: 10px 14px; background: var(--paper); border-top: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
  .mobile-buy span { font-size: 11px; }
  .mobile-buy button { min-width: 110px; min-height: 44px; border: 0; background: var(--ink); color: white; font-size: 11px; }
  .philosophy-hero, .workshop-hero { min-height: 760px; }
  .philosophy-hero > div, .workshop-hero > div { padding: 75px 24px; }
  .honesty-block { padding: 90px 24px; }
  .honesty-columns { grid-template-columns: 1fr; }
  .honesty-columns article + article { border-left: 1px solid rgba(255,255,255,.2); border-top: 0; }
  .process-grid, .benefits-grid, .workshop-steps { grid-template-columns: 1fr; }
  .process-grid article, .benefits-grid article, .workshop-steps article { min-height: 230px; }
  .origin-section > div { padding: 90px 24px; }
  .club-hero { padding: 75px 24px 0; }
  .club-hero-device { min-height: 680px; }
  .club-journey, .privacy-section, .service-panel { padding: 90px 24px; }
  .workshop-steps { padding: 0 24px 90px; }
  .service-list { grid-template-columns: 1fr; }
  .account-page { padding: 60px 20px; }
  .account-copy { padding: 20px 4px 60px; }
  .account-copy ul { grid-template-columns: 1fr; }
  .login-card { padding: 36px 24px; }
  .cart-page { padding: 80px 24px; }
  .cart-line { grid-template-columns: 90px 1fr; }
  .cart-line img { width: 90px; height: 115px; grid-row: 1/3; }
  .cart-line label, .cart-line > strong { grid-column: 2; }
  .cart-summary { padding: 30px 22px; }
  .cart-empty { padding: 100px 24px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .hero-slide { transform: none; }
}

/* ============================================================
   EL MAPA DEL PRECIO, REHECHO  (05/08/2026)
   ------------------------------------------------------------
   Óscar: «las tarjetas son muy grandes y los textos deberían ser mucho
   más grandes; ahora mismo eso no es nada atractivo de ver».

   Lo que había: cinco tarjetas de media pantalla de alto, con el nombre
   a 11 px, la nota a 9 px y el precio suelto dentro de la caja. Para
   comparar cinco precios había que leer cinco cajas y acordarse.

   Lo que hay: una fila por canal, todas contra la misma escala. La
   comparación se ve; no hay que reconstruirla leyendo. Y los cuerpos
   suben al mínimo que pide el propio documento de entrega —14 px en el
   ordenador—, que es lo que el diseño anterior incumplía.

   EL COLOR es «emphasis»: una sola marca en oro, la nuestra, y el resto
   en gris. Se probó con tres colores —legítimo, irregular y laOra— y el
   validador de paletas lo tumbó: los dos grises de color no llegaban a
   distinguirse ni con visión normal. Así que el mercado irregular se
   separa con su rótulo y con la trama diagonal, no con otro color.
   ============================================================ */
.mp{ margin-top: 26px; }

.mp-grupo{
  margin: 26px 0 10px;
  font-size: 14px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--muted);
}
.mp-grupo-irregular::before{
  content: ""; display: inline-block; vertical-align: -1px;
  width: 13px; height: 13px; margin-right: 8px; border-radius: 3px;
  border: 1px solid rgba(28,29,27,.28);
  /* la trama, que es lo que distingue al mercado irregular sin recurrir
     a un segundo color que nadie sabría separar del primero */
  background: repeating-linear-gradient(135deg,#d9d5cb 0 4px,#b9b4a8 4px 8px);
}
.mp-grupo-nuestro{ color: #7c5d2a; }

.mp-lista{ display: flex; flex-direction: column; gap: 2px; }

.mp-fila{
  display: grid; grid-template-columns: minmax(0,1.05fr) minmax(0,1.25fr) auto;
  gap: clamp(14px,2.2vw,32px); align-items: center;
  padding: 15px clamp(12px,1.6vw,20px);
  background: var(--paper); border: 1px solid rgba(28,29,27,.08);
}
.mp-fila + .mp-fila{ border-top: 0; }

.mp-canal{ font-size: 14px; letter-spacing: .04em; color: var(--muted); margin-bottom: 2px; }
.mp-fila h3{ font-size: clamp(17px,1.5vw,21px); font-weight: 700; letter-spacing: -.02em; line-height: 1.15; }
.mp-nota{ margin-top: 5px; font-size: 14px; line-height: 1.35; color: var(--muted); }

/* la pista y la barra */
.mp-pista{
  position: relative; height: 16px; border-radius: 999px;
  background: rgba(28,29,27,.07);
}
.mp-solido, .mp-rango{ position: absolute; top: 0; height: 100%; }
.mp-solido{ left: 0; border-radius: 999px; background: #8e8b82; }
/* el tramo hasta el precio más alto del canal: se ve que sigue, sin
   afirmar que ese sea el precio */
.mp-rango{ border-radius: 999px; background: repeating-linear-gradient(135deg,#b3afa5 0 5px,#c8c4ba 5px 10px); }
.mp-irregular .mp-solido{ background: repeating-linear-gradient(135deg,#8e8b82 0 5px,#6f6c64 5px 10px); }
.mp-indefinido{ background: repeating-linear-gradient(135deg,#cfcbc1 0 6px,#e0ddd4 6px 12px); }

/* las cifras, que es lo que se venía a leer */
.mp-cifras{ text-align: right; min-width: clamp(120px,13vw,190px); }
.mp-precio{ font-size: clamp(20px,2vw,26px); font-weight: 700; letter-spacing: -.02em; line-height: 1.1; }
.mp-multiplo{
  margin-top: 3px; font-size: 16px; font-weight: 700; color: var(--muted);
  display: flex; flex-direction: column; align-items: flex-end; line-height: 1.15;
}
.mp-multiplo span{ font-size: 13px; font-weight: 400; }
.mp-sincifra{ font-size: 14px; font-weight: 400; }

/* NUESTRA FILA · la única con color, que es de lo que va «emphasis» */
.mp-fila.nuestro{
  background: #fff9ec; border-color: rgba(156,114,51,.42);
  padding-top: 19px; padding-bottom: 19px;
}
.mp-fila.nuestro .mp-canal{ color: #7c5d2a; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.mp-fila.nuestro .mp-solido{ background: #9c7233; }
.mp-fila.nuestro .mp-pista{ background: rgba(156,114,51,.14); }
.mp-fila.nuestro .mp-precio{ color: #7c5d2a; }
.mp-fila.nuestro .mp-multiplo{ color: #7c5d2a; }
.mp-fila.nuestro h3{ display: flex; align-items: baseline; gap: 8px; }
.mp-logo img{ height: 17px; width: auto; display: inline; vertical-align: baseline; }

/* alternativas */
.mp-alternativas{
  margin-top: 22px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 26px;
  padding-top: 18px; border-top: 1px solid rgba(28,29,27,.14);
}
.mp-alternativas > span{
  font-size: 14px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted);
}
.mp-alternativas div{ display: flex; align-items: baseline; gap: 9px; }
.mp-alternativas b{ font-size: 15px; font-weight: 700; }
.mp-alternativas small{ font-size: 14px; color: var(--muted); }

/* la tabla del movimiento: se queda como estaba, pero legible. El
   material la traía a 7 y 9 px, por debajo del mínimo de su propio
   documento de entrega. */
.decision-movement-panel{ margin-top: 34px; }
.movement-row span, .movement-row b, .movement-row strong{ font-size: 14px !important; }
.movement-header span{ font-size: 13px !important; letter-spacing: .1em; }
.movement-intro p{ font-size: 14px !important; }
.movement-intro span{ font-size: 15px !important; line-height: 1.4; }
.decision-footnote{ font-size: 14px !important; line-height: 1.45; }

@media (max-width:899px){
  .mp-fila{
    grid-template-columns: minmax(0,1fr) auto;
    grid-template-areas: "quien cifras" "pista pista";
    gap: 10px 14px; padding: 14px;
  }
  .mp-quien{ grid-area: quien; }
  .mp-cifras{ grid-area: cifras; min-width: 0; }
  .mp-pista{ grid-area: pista; height: 14px; }
  .mp-fila h3{ font-size: 17px; }
  .mp-precio{ font-size: 20px; }
  .mp-canal, .mp-nota{ font-size: 13px; }
  .mp-multiplo{ font-size: 15px; }
  .mp-grupo{ font-size: 13px; margin: 20px 0 8px; }
}

/* ============================================================
   EL MAPA DEL PRECIO, A DOS PANTALLAS  (05/08/2026)
   ------------------------------------------------------------
   Óscar: «hay que hacer esa tarjeta mucho más alta para que quepa
   todo; con esa misma estructura, el doble de alta, dos pantallas. Y
   las cajas de los botones más altas también».

   Aquí estaba la raíz del problema: el acto venía con
   `height: calc(100svh - 76px)` y `overflow:hidden`, o sea, obligado a
   caber en UNA pantalla. De ahí salía todo lo demás —tarjetas
   apelotonadas, nombre a 11 px, nota a 9— porque no había sitio. Con
   dos pantallas, el contenido respira y los cuerpos se sostienen solos.
   ============================================================ */
.decision-act{
  height: auto;
  min-height: calc(200svh - 76px);
  overflow: visible;
  padding: clamp(30px,5vh,64px) 4vw clamp(26px,4vh,48px);
  grid-template-rows: auto auto auto auto auto;
  gap: clamp(16px,2.4vh,34px);
  align-content: center;
}
/* la entradilla, al mínimo legible del documento de entrega */
.decision-head > p{ font-size: 15px; line-height: 1.5; max-width: 560px; }

/* LAS PESTAÑAS · cajas altas, no una banda de 9 px */
.decision-model-tabs{ border-radius: 3px; overflow: hidden; }
.decision-model-tabs button{
  min-height: 66px; padding: 16px 18px;
  font-size: clamp(14px,1.15vw,17px); letter-spacing: .1em; line-height: 1.2;
}

/* LAS FILAS · con sitio de verdad */
.mp{ margin-top: 6px; }
.mp-fila{ padding: clamp(20px,2.4vh,30px) clamp(16px,1.8vw,26px); }
.mp-pista{ height: 20px; }
.mp-grupo{ margin: clamp(20px,3vh,34px) 0 12px; font-size: 15px; }
.mp-nota{ font-size: 15px; }
.mp-canal{ font-size: 15px; }
.mp-fila h3{ font-size: clamp(19px,1.7vw,24px); }
.mp-precio{ font-size: clamp(22px,2.2vw,30px); }
.mp-multiplo{ font-size: 17px; }
.mp-multiplo span{ font-size: 14px; }

@media (max-width:899px){
  .decision-act{
    min-height: calc(200svh - 68px);
    padding: 26px 18px 30px;
    gap: 14px;
  }
  .decision-model-tabs button{ min-height: 58px; font-size: 13px; padding: 12px 10px; }
  .decision-head > p{ font-size: 14px; }
  .mp-fila{ padding: 16px 15px; }
  .mp-fila h3{ font-size: 18px; }
  .mp-precio{ font-size: 21px; }
  .mp-nota, .mp-canal{ font-size: 14px; }
  .mp-multiplo{ font-size: 16px; }
  .mp-pista{ height: 16px; }
}

/* La garantía del taller, donde estaba el botón «Conocer el proceso»
   (Óscar, 05/08/2026). Va con el cuerpo de un titular, no de un
   párrafo: es lo que se viene a leer de esta pantalla. */
.madrid-garantia{
  margin-top: clamp(18px,3vh,32px);
  font: 500 clamp(26px,3.1vw,44px)/1.05 var(--sans);
  letter-spacing: -.04em; color: #fffdf8;
}
.madrid-garantia em{ font-style: normal; color: rgba(255,253,248,.66); }
@media (max-width:899px){
  .madrid-garantia{ font-size: 25px; margin-top: 16px; }
}

/* Lo destacado del diálogo (Óscar, 05/08/2026): los mecanismos. Va en
   negrita y en la tinta plena, sobre el gris del párrafo, para que sea
   lo que se lee primero de la frase. */
.lunar-dialogue-copy b{ font-weight: 700; color: #171513; }

/* LA PRIMERA TARJETA, la del Cóctel  (Óscar, 05/08/2026)
   ------------------------------------------------------------
   La foto buena es la apaisada del bar, la que trae el logotipo y el
   nombre del modelo POR ENCIMA del eje de las agujas. Al ser apaisada
   —casi la proporción de la tarjeta— llena la tarjeta entera sin
   recortar el reloj, así que no hacen falta las dos mitades.

   El rótulo se queda a la izquierda, sobre la copa desenfocada y el
   fondo oscuro, que es la mitad donde no hay reloj. Así no tapa nada. */
.trust-carousel-track .trust-card:first-child{ background: #0b0c0a; }
.trust-carousel-track .trust-card:first-child > img{
  inset: 0; left: 0; right: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center center;
}
.trust-carousel-track .trust-card:first-child .trust-card-veil{
  background: linear-gradient(90deg, rgba(0,0,0,.80) 0%, rgba(0,0,0,.55) 34%, rgba(0,0,0,.05) 58%, rgba(0,0,0,0) 100%);
}
.trust-carousel-track .trust-card:first-child .trust-card-copy{
  top: 50%; left: 4.5%; width: 42%; transform: translateY(-50%);
  text-align: left;
}
@media (max-width:899px){
  /* la tarjeta se estrecha y el encuadre se corre hacia el reloj, que
     en esta foto está a la derecha; el texto baja al pie */
  .trust-carousel-track .trust-card:first-child > img{ object-position: 64% center; }
  .trust-carousel-track .trust-card:first-child .trust-card-veil{
    background: linear-gradient(180deg, rgba(0,0,0,.28) 0%, rgba(0,0,0,.05) 34%, rgba(0,0,0,.72) 70%, rgba(0,0,0,.88) 100%);
  }
  .trust-carousel-track .trust-card:first-child .trust-card-copy{
    top: auto; bottom: 7%; left: 50%; width: 88%;
    transform: translateX(-50%); text-align: center;
  }
}

/* EL MENÚ · centrado en la altura de la cabecera (Óscar, 05/08/2026).
   Al alinear el logotipo con la palabra puse `align-items: baseline` en
   el enlace, y con eso el texto se pegaba a la parte de arriba de los
   44 px del enlace en vez de quedarse en medio. El enlace deja de ser
   flex: con una línea de texto normal, el logotipo y la palabra
   comparten línea base por sí solos —que era lo que se buscaba— y el
   `line-height` centra el conjunto. */
.main-nav a, .account-link{ display: block; line-height: 44px; }


/* EL AVISO DE MARCAS · Óscar lo quiere a 9 px, en gris y con margen
   (05/08/2026). Iba pegado a los bordes de la ventana. */
.aviso-marcas{
  margin: 0; padding: 26px clamp(18px,5vw,64px) 34px;
  background: var(--ivory);
}
.aviso-marcas p{
  max-width: 1100px; margin: 0 auto;
  font-size: 9px; line-height: 1.55; color: #7b7a72; text-align: center;
}
@media (max-width:899px){
  .aviso-marcas{ padding: 20px 20px 28px; }
}
