/* ============================================================
   PREMIUM PAGES SHELL — batches 2–4
   (active-inventory, product detail, financing, contact,
   thank-you, admin). Requires /assets/theme.css loaded first.
   Client values via placeholders/config only.
   ============================================================ */

/* ---------- Base ---------- */
body{font-family:var(--body);color:var(--ink);background:#fff;font-size:16.5px;line-height:1.6;
  -webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overflow-x:clip;overflow-y:auto}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button,a{touch-action:manipulation}
[id]{scroll-margin-top:88px}
[hidden]{display:none!important}
h1,h2,h3,h4{font-family:var(--display);font-weight:800;line-height:1.08;letter-spacing:-.02em;color:var(--navy-deep);overflow-wrap:anywhere;word-break:break-word;max-width:100%}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
@media(min-width:1024px){.wrap{padding:0 24px}}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:80;border-bottom:1px solid rgba(11,37,89,.1);
  background:rgba(255,255,255,.85);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.header-inner{display:flex;align-items:center;gap:16px;min-height:64px;max-width:var(--wrap);margin:0 auto;padding:12px 20px}
.logo{display:flex;flex-direction:column;line-height:1;margin-right:auto}
.logo b{font-family:var(--display);font-size:1.14rem;font-weight:800;color:var(--navy-royal);overflow-wrap:anywhere}
.logo span{margin-top:4px;font-family:var(--mono);font-size:.5rem;font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-soft)}
.nav{display:none;gap:24px;align-items:center}
.nav a{position:relative;font-family:var(--display);font-weight:600;font-size:.8rem;letter-spacing:.07em;text-transform:uppercase;color:var(--ink);padding:8px 0;white-space:nowrap}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;border-radius:2px;
  background:linear-gradient(90deg,var(--gold),var(--gold-deep));transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease-out)}
.nav a:hover{color:var(--navy-royal)}
.nav a:hover::after{transform:scaleX(1)}
.header-actions{display:none;align-items:center;gap:16px}
.header-actions .phone-link{display:flex;flex-direction:column;align-items:flex-end;line-height:1.2}
.header-actions .phone-link b{font-family:var(--display);font-size:1.04rem;font-weight:700;color:var(--navy-royal)}
.header-actions .phone-link span{font-size:.7rem;font-weight:600;color:var(--ink-soft)}
.header-actions .btn{padding:11px 18px;font-size:.84rem;min-height:44px;border-radius:11px}
.mobile-menu{width:48px;height:48px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--navy-deep);font-size:1.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center}
@media(min-width:1000px){.nav,.header-actions{display:flex}.mobile-menu{display:none}.logo b{font-size:1.3rem}}

/* ---------- Legacy button aliases (premium look) ---------- */
.btn-outline{background:transparent;color:var(--navy-royal);border-color:var(--line)}
.btn-outline:hover{border-color:var(--navy-royal);background:rgba(22,70,155,.06)}
.btn-blue{color:#fff;background:linear-gradient(180deg,var(--navy-royal),var(--navy-deep));box-shadow:0 12px 26px -12px rgba(11,37,89,.65)}
.hero .btn-outline{background:rgba(255,255,255,.04);color:#fff;border-color:rgba(255,255,255,.3);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.hero .btn-outline:hover{border-color:rgba(255,255,255,.85);background:rgba(255,255,255,.1)}

/* ---------- Dark "night water" hero ---------- */
.hero{position:relative;overflow:hidden;color:#fff;
  background:radial-gradient(900px 480px at 50% -10%,rgba(22,70,155,.55),transparent 60%),
    radial-gradient(760px 420px at 88% 110%,rgba(255,184,28,.11),transparent 62%),
    linear-gradient(180deg,var(--navy-night),var(--navy-abyss))}
/* Gold shimmer hairline on the hero's bottom (dark band) edge.
   (On page-thankyou the more specific .page-thankyou .hero::after steam rule wins.) */
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;z-index:3;
  background:linear-gradient(90deg,transparent,#FFD46A 50%,transparent) no-repeat,rgba(255,184,28,.28);
  background-size:38% 100%;
  animation:pp-sweep 5.5s ease-in-out infinite}
@keyframes pp-sweep{0%{background-position:-80% 0}55%,100%{background-position:180% 0}}
.hero-inner{position:relative;z-index:2;display:grid;gap:32px;padding:56px 20px 64px;max-width:var(--wrap);margin:0 auto}
.hero h1{font-size:clamp(2.1rem,7vw,3.9rem);color:#fff;margin-bottom:14px}
.hero p{max-width:640px;color:#C9D5EE;font-size:clamp(1rem,2vw,1.1rem)}
.hero-actions{display:flex;flex-direction:column;gap:12px;margin-top:22px}
.hero-card{position:relative;z-index:2;border-radius:26px;
  background:linear-gradient(168deg,rgba(255,255,255,.94),rgba(255,255,255,.84));
  backdrop-filter:blur(26px) saturate(1.3);-webkit-backdrop-filter:blur(26px) saturate(1.3);
  border:1px solid rgba(255,255,255,.7);padding:26px;color:var(--ink);
  box-shadow:0 44px 90px -28px rgba(3,12,32,.65),inset 0 1px 0 rgba(255,255,255,.9)}
.hero-card::before{content:"";position:absolute;top:0;left:24px;right:24px;height:3px;border-radius:0 0 4px 4px;
  background:linear-gradient(90deg,var(--gold-soft),var(--gold) 40%,var(--gold-deep))}
.hero-card h3, .hero-card .h3{font-size:1.3rem;margin-bottom:8px}
.hero-card p{color:var(--ink-soft);font-size:.95rem;max-width:none}
.hero-card-media{padding:10px}
.hero-card-media .media-frame{border-radius:18px;border:0;box-shadow:none}
@media(min-width:760px){.hero-actions{flex-direction:row}}
@media(min-width:1000px){.hero-inner{grid-template-columns:1.02fr .82fr;align-items:center;padding:76px 24px 88px}}

/* ---------- Sections ---------- */
.section{padding:72px 0}
.section.alt{background:var(--sand)}
.section-head{display:flex;flex-direction:column;margin-bottom:26px}
.kicker{display:inline-flex;align-items:center;gap:11px;font-family:var(--mono);font-weight:600;font-size:.68rem;
  letter-spacing:.26em;text-transform:uppercase;color:var(--gold-dark);margin-bottom:16px;align-self:flex-start}
.kicker::before{content:"";width:28px;height:1px;background:linear-gradient(90deg,var(--gold-deep),transparent);flex:none}
.section h2{font-size:clamp(1.75rem,5.2vw,2.85rem);margin-bottom:16px}
.section p.lead{max-width:720px;color:var(--ink-soft);font-size:1.02rem;line-height:1.65}
@media(min-width:1024px){.section{padding:104px 0}}

/* ---------- Grids, panels, cards ---------- */
.grid{display:grid;gap:18px}
.grid-3{grid-template-columns:1fr}
.grid-2{grid-template-columns:1fr}
.panel,.card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;
  box-shadow:0 8px 22px -14px rgba(6,24,61,.16);
  transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out),border-color .3s}
.panel:hover,.card:hover{transform:translateY(-4px);border-color:rgba(232,164,0,.4);box-shadow:0 28px 54px -22px rgba(6,24,61,.32)}
.panel h3, .card h3, .panel .h3, .card .h3{font-size:1.18rem;margin-bottom:8px}
.panel p,.card p{color:var(--ink-soft);font-size:.95rem}
.media-frame{border-radius:20px;overflow:hidden;border:1px solid var(--line);
  background:linear-gradient(155deg,#eef2f8,#e2e9f4);box-shadow:0 8px 22px -14px rgba(6,24,61,.16)}
.media-frame img{width:100%;height:100%;object-fit:cover;min-height:280px;transition:transform .7s var(--ease-out)}
@media(min-width:760px){.grid-3{grid-template-columns:repeat(3,1fr)}.grid-2{grid-template-columns:repeat(2,1fr)}}

/* ---------- Product cards (active inventory) ---------- */
.product-grid{display:grid;grid-template-columns:1fr;gap:22px}
.product-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);
  border-radius:20px;overflow:hidden;box-shadow:0 8px 22px -14px rgba(6,24,61,.16);
  transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out),border-color .3s}
.product-card:hover{transform:translateY(-4px);border-color:rgba(232,164,0,.4);box-shadow:0 28px 54px -22px rgba(6,24,61,.32)}
.availability-bar{display:inline-flex;align-items:center;justify-content:center;font-family:var(--mono);
  font-weight:600;font-size:.6rem;letter-spacing:.09em;text-transform:uppercase;color:#fff;
  background:linear-gradient(180deg,#2A3244,#141927);padding:9px 12px;text-align:center;
  box-shadow:0 8px 18px -10px rgba(6,24,61,.5)}
.product-image{position:relative;aspect-ratio:1.55/1;overflow:hidden;background:linear-gradient(155deg,#eef2f8,#e2e9f4)}
.product-image img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease-out)}
.product-card:hover .product-image img{transform:scale(1.045)}
.sale-badge{position:absolute;right:12px;top:12px;display:inline-flex;align-items:center;border-radius:999px;
  padding:7px 13px;font-family:var(--mono);font-weight:600;font-size:.6rem;letter-spacing:.09em;text-transform:uppercase;
  color:var(--navy-night);background:linear-gradient(180deg,#FFD46A,#F5AD0E);
  box-shadow:0 10px 22px -8px rgba(232,164,0,.6)}
.product-body{display:flex;flex-direction:column;flex:1;padding:22px}
.product-body h3, .product-body .h3{font-size:clamp(1.3rem,3vw,1.6rem)}
.product-body>p{color:var(--ink-soft);font-size:.92rem;margin-top:4px}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0 10px}
.facts span{display:flex;align-items:center;justify-content:center;text-align:center;min-height:44px;padding:8px;
  border:1px solid var(--line);border-radius:10px;background:#F7F9FD;
  font-family:var(--mono);font-weight:600;font-size:.6rem;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft)}
.price{margin-top:auto;border-top:1px solid var(--line);padding-top:14px}
.price span:first-child{display:block;font-family:var(--mono);font-weight:600;font-size:.6rem;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-soft)}
.price b{display:block;font-family:var(--display);font-weight:800;font-size:2rem;line-height:1.1;color:var(--navy-deep)}
.price span:last-child{display:block;margin-top:2px;font-family:var(--display);font-weight:800;font-size:.92rem;
  background:linear-gradient(180deg,#D9A50E 8%,#B98200 70%);-webkit-background-clip:text;background-clip:text;color:transparent}
/* No price on record: "Text-back pricing" replaces the dollar figure */
.price--ask b{font-size:1.4rem;line-height:1.2}
.product-actions{display:grid;gap:10px;margin-top:16px}
.btn-financing{background:linear-gradient(180deg,var(--navy-royal),var(--navy-deep));color:#fff;border-color:transparent;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 12px 26px -12px rgba(6,24,61,.55)}
.btn-financing:hover{color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 16px 34px -12px rgba(6,24,61,.7)}
@media(min-width:760px){.product-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:901px){
  .product-grid{grid-template-columns:1fr;max-width:980px}
  .product-card{display:grid;grid-template-columns:42% 1fr}
  .availability-bar{grid-column:1/-1}
  .product-image{aspect-ratio:1/1;height:100%}
  .product-actions{grid-template-columns:1fr 1fr}
  .product-actions .btn-financing{grid-column:1 / -1}
}

/* ---------- Forms ---------- */
.form-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:26px;padding:26px;
  box-shadow:0 24px 60px -24px rgba(6,24,61,.35)}
.form-card::before{content:"";position:absolute;top:0;left:24px;right:24px;height:3px;border-radius:0 0 4px 4px;
  background:linear-gradient(90deg,var(--gold-soft),var(--gold) 40%,var(--gold-deep))}
.form-card h3, .form-card .h3{font-size:1.25rem;margin-bottom:12px}
.form-grid{display:grid;gap:12px}
.form-grid input,.form-grid select,.form-grid textarea{width:100%;min-height:48px;padding:11px 14px;border-radius:13px;
  border:1px solid rgba(11,37,89,.16);background:rgba(255,255,255,.85);color:var(--ink);font-size:16px;
  transition:border-color .25s,box-shadow .25s;-webkit-appearance:none;appearance:none}
.form-grid select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%230B2559' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;padding-right:40px}
.form-grid textarea{min-height:110px;resize:vertical}
/* Group headers inside long forms (admin product form) */
.form-group-label{display:flex;align-items:center;gap:10px;margin:10px 0 0;
  font-family:'Spline Sans Mono',monospace;font-size:.62rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep)}
.form-group-label::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(232,164,0,.4),transparent)}
.form-group-label:first-child{margin-top:0}
.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{outline:none;border-color:var(--navy-royal);box-shadow:0 0 0 4px rgba(22,70,155,.12)}
.form-grid input::placeholder,.form-grid textarea::placeholder{color:#8892A6}
.form-grid input[type="checkbox"]{accent-color:var(--navy-royal);min-height:0;width:auto}
.form-grid input[type="file"]{padding:10px;background:#F7F9FD}
.form-grid input[type="range"]{accent-color:var(--gold-deep);border:0;background:transparent;box-shadow:none;padding:0}
.fine-print{font-size:.72rem;color:var(--ink-soft);line-height:1.5}
.fine-print:empty{display:none}
@media(min-width:1024px){.form-grid input,.form-grid select{min-height:52px}}
@media(max-height:650px){.form-card{padding:20px}.form-grid{gap:9px}.form-grid input,.form-grid select{min-height:44px;padding:9px 12px}.fine-print{font-size:.6rem}}
@media(max-height:520px){.fine-print{font-size:.56rem}}
.inventory-gate-form-honeypot{position:absolute;left:-9999px;opacity:0}
.inventory-gate-form-error,.dealer-lead-error{color:var(--red);font-weight:600;font-size:.85rem}

/* ---------- Lead drawer (data-lead-panel aside) ---------- */
aside.form-card[data-lead-panel]{position:fixed;z-index:200;left:50%;bottom:0;transform:translateX(-50%);
  width:min(480px,calc(100vw - 24px));margin-bottom:12px}
aside.form-card[data-lead-panel] [data-close-lead]{float:right;min-height:44px;padding:10px 16px;font-size:.8rem;margin:0 0 8px 8px}
@media(max-height:480px){aside.form-card[data-lead-panel]{max-height:calc(100vh - 16px);overflow-y:auto}}

/* ---------- Tables (admin) ---------- */
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 8px 22px -14px rgba(6,24,61,.16)}
table{width:100%;border-collapse:collapse;min-width:720px}
th,td{padding:14px 16px;border-bottom:1px solid var(--line);text-align:left}
th{font-family:var(--mono);font-weight:600;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:#fff;background:var(--navy-deep)}
td{font-size:.9rem;color:var(--ink-soft)}
.status{display:inline-flex;align-items:center;border-radius:999px;padding:6px 12px;font-family:var(--mono);font-weight:600;font-size:.6rem;letter-spacing:.09em;text-transform:uppercase}
.status.available{background:#EAF8EF;color:#12603A}
.status.pending{background:#FFF5D7;color:#8A5B00}
.status.hidden{background:#EEF1F7;color:#536078}

/* ---------- Footer ---------- */
.site-footer{position:relative;overflow:hidden;color:#C6D4EF;padding:56px 0 40px;
  background:radial-gradient(900px 480px at 50% -10%,rgba(22,70,155,.55),transparent 60%),
    linear-gradient(180deg,var(--navy-night),var(--navy-abyss))}
.site-footer::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:rgba(255,184,28,.28)}
.site-footer::after{content:"";position:absolute;top:0;height:1px;width:38%;
  background:linear-gradient(90deg,transparent,#FFD46A 50%,transparent);
  animation:sweep 5.5s ease-in-out infinite}
.footer-grid{display:grid;gap:26px}
.site-footer .footer-h{line-height:1.4;letter-spacing:.24em}
.site-footer h4,.site-footer .footer-h{font-family:var(--mono);font-weight:600;font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-soft);margin-bottom:12px}
.site-footer p{font-size:.9rem;line-height:1.7;color:#C6D4EF}
.site-footer a{color:#fff}
.site-footer a:hover{color:var(--gold-soft)}
@media(min-width:760px){.footer-grid{grid-template-columns:1.3fr repeat(3,1fr)}}

/* ---------- Admin (calm: no sheen, no lift) ---------- */
.admin-shell{display:grid;min-height:calc(100vh - 72px)}
.admin-sidebar{position:relative;color:#fff;padding:28px 24px;
  background:radial-gradient(700px 380px at 50% -10%,rgba(22,70,155,.5),transparent 60%),
    linear-gradient(180deg,var(--navy-night),var(--navy-abyss))}
/* Static gold hairline on the sidebar's top edge (calm — never animated) */
.admin-sidebar::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,212,106,.55) 50%,transparent)}
.admin-sidebar h1{color:#fff;font-size:1.35rem;margin-bottom:8px}
.admin-sidebar h1::before{content:"Back Office";display:block;margin-bottom:10px;
  font-family:var(--mono);font-weight:600;font-size:.62rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--gold)}
.admin-sidebar p{color:#C6D4EF;font-size:.88rem;line-height:1.6}
.admin-sidebar nav a{display:flex;align-items:center;gap:10px;padding:13px 15px;
  border:1px solid rgba(255,255,255,.14);border-radius:13px;background:rgba(255,255,255,.04);
  font-family:var(--display);font-weight:700;font-size:.9rem;color:#fff;
  transition:border-color .2s,background .2s,color .2s}
.admin-sidebar nav a::before{content:"";width:7px;height:7px;flex:none;
  background:linear-gradient(135deg,#FFD46A,#F0A400);transform:rotate(45deg);border-radius:1.5px}
.admin-sidebar nav a:hover{border-color:rgba(255,184,28,.6);background:rgba(255,184,28,.09);color:var(--gold-soft)}
/* min-width:0 — as a grid item, the main column must be allowed to shrink
   below the table's min-width so .table-wrap scrolls instead of blowing out */
.admin-main{min-width:0;padding:28px 24px 44px;background:var(--sand)}
.admin-main .section{padding:32px 0}
/* Centered login panel */
.admin-main [data-admin-login] .form-card{max-width:480px;margin:6vh auto 0}
/* Stats: night cards with gradient-gold numerals (homepage stats canon) */
.admin-stat{position:relative;overflow:hidden;border-radius:18px;padding:22px;
  border:1px solid rgba(255,184,28,.28);
  background:radial-gradient(360px 200px at 85% -30%,rgba(255,184,28,.14),transparent 60%),
    linear-gradient(168deg,var(--navy-night),var(--navy-abyss));
  box-shadow:0 18px 40px -24px rgba(3,12,32,.55)}
.admin-stat h3, .admin-stat .h3{font-size:1.7rem;letter-spacing:-.01em;
  background:linear-gradient(94deg,#FFE29A 0%,#FFB81C 48%,#F0A400 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.admin-stat p{font-family:var(--mono);font-weight:600;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.62);margin-top:6px}
/* Table polish: zebra + row hover */
.admin-shell tbody tr:nth-child(even) td{background:#FAFBFE}
.admin-shell tbody tr:hover td{background:#F3F7FE}
.admin-shell .btn,.admin-shell .panel,.admin-shell .card{transition:none}
.admin-shell .btn:hover{transform:none}
.admin-shell .btn-gold{box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 8px 18px -10px rgba(232,164,0,.5)}
.admin-shell .btn-gold::after{display:none}
.admin-shell .panel:hover,.admin-shell .card:hover{transform:none;border-color:var(--line);box-shadow:0 8px 22px -14px rgba(6,24,61,.16)}
/* Recipe F: back office is calm — no ambient sweeps anywhere on the admin page */
body:has(.admin-shell) .site-footer::after{animation:none;display:none}
@media(min-width:760px){
  .admin-shell{grid-template-columns:280px 1fr}
  .admin-sidebar{min-height:calc(100vh - 72px)}
  /* Gold hairline seam between sidebar and workspace */
  .admin-sidebar::after{content:"";position:absolute;top:0;right:0;bottom:0;width:1px;
    background:linear-gradient(180deg,rgba(255,184,28,.5),rgba(255,184,28,.06))}
}
/* Mobile back office: compact header bar + pill nav, comfortable tap targets */
@media(max-width:759px){
  .admin-sidebar{padding:18px 16px 16px}
  .admin-sidebar h1{font-size:1.15rem;margin-bottom:2px}
  .admin-sidebar h1::before{margin-bottom:6px}
  .admin-sidebar p{display:none}
  .admin-sidebar nav.grid{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px !important}
  .admin-sidebar nav a{padding:10px 14px;font-size:.82rem;border-radius:999px}
  .admin-main{padding:22px 16px 40px}
  .admin-main .section{padding:22px 0}
  .admin-main .form-card{padding:22px 18px}
  /* 16px inputs: below that iOS Safari zooms the page on focus */
  .admin-shell .form-grid input,.admin-shell .form-grid select,.admin-shell .form-grid textarea{font-size:16px}
  .admin-shell table{min-width:640px}
  .admin-shell .table-wrap{-webkit-overflow-scrolling:touch}
}

/* ---------- Financing survey — locked full-screen funnel ----------
   No nav, no footer, no page scroll: the visitor finishes the survey
   (→ /book/) or taps the phone number. The card scrolls internally if a
   step ever outgrows a short viewport, so nothing is ever unreachable. */
html:has(body.financing-lock){overflow:hidden}
body.financing-lock{height:100vh;height:100dvh;overflow:hidden}
.fin-scene{position:relative;height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden;color:#fff;
  background:radial-gradient(900px 480px at 50% -10%,rgba(22,70,155,.55),transparent 60%),
    radial-gradient(700px 420px at 90% 100%,rgba(255,184,28,.1),transparent 62%),
    linear-gradient(180deg,var(--navy-night),var(--navy-abyss))}
/* Animated gold shimmer hairline along the top edge — same canon as the
   homepage and category bands */
.fin-scene::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;z-index:3;
  background:linear-gradient(90deg,transparent,#FFD46A 50%,transparent) no-repeat,rgba(255,184,28,.28);
  background-size:38% 100%;animation:pp-sweep 5.5s ease-in-out infinite}
/* Drifting glow orbs behind the card */
.fin-scene::after{content:"";position:absolute;z-index:0;border-radius:9999px;filter:blur(72px);pointer-events:none;
  width:520px;height:340px;left:-8%;bottom:-14%;background:rgba(22,70,155,.5);animation:drift1 16s ease-in-out infinite}
.fin-topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;position:relative;z-index:2;
  padding:14px clamp(16px,4vw,40px)}
.fin-brand{font-family:var(--display);font-weight:800;font-size:1.1rem;letter-spacing:.01em;color:#fff}
.fin-phone{text-align:right}
.fin-phone b{display:block;color:#fff;font-family:var(--display);font-weight:800}
.fin-phone span{display:block;font-family:'Spline Sans Mono',monospace;font-size:.58rem;font-weight:500;
  letter-spacing:.14em;text-transform:uppercase;color:rgba(255,212,106,.85)}
.fin-main{flex:1;min-height:0;position:relative;z-index:2;display:flex;flex-direction:column;
  align-items:center;justify-content:center;padding:6px 16px 16px}
.fin-main .financing-survey-card{width:min(680px,100%);max-height:100%;overflow-y:auto;overscroll-behavior:contain}
.fin-trust{flex:none;margin:14px 0 0;font-family:'Spline Sans Mono',monospace;font-size:.62rem;font-weight:500;
  letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.55);text-align:center}
.financing-survey-card{position:relative;border-radius:26px;padding:clamp(20px,4vw,34px);color:var(--ink);
  background:linear-gradient(168deg,rgba(255,255,255,.96),rgba(255,255,255,.88));
  backdrop-filter:blur(26px) saturate(1.3);-webkit-backdrop-filter:blur(26px) saturate(1.3);
  border:1px solid rgba(255,255,255,.7);overflow:hidden;
  box-shadow:0 44px 90px -28px rgba(3,12,32,.65),inset 0 1px 0 rgba(255,255,255,.9)}
.financing-survey-card::before{content:"";position:absolute;top:0;left:24px;right:24px;height:3px;border-radius:0 0 4px 4px;
  background:linear-gradient(90deg,var(--gold-soft),var(--gold) 40%,var(--gold-deep))}
.financing-survey-progress{height:6px;background:rgba(11,37,89,.08);border-radius:999px;overflow:hidden;margin-bottom:18px}
.financing-survey-progress span{display:block;height:100%;width:25%;
  background:linear-gradient(90deg,var(--gold-deep),var(--gold),var(--gold-soft));transition:width .3s var(--ease-out)}
.financing-survey-card h1{font-size:clamp(1.9rem,5vw,3rem);margin:6px 0 10px}
.financing-survey-card .lead{color:var(--ink-soft);font-size:1rem}
.financing-q{font-size:clamp(1.25rem,3vw,1.7rem);margin:18px 0 14px}
.financing-answers{display:grid;gap:10px}
.financing-answer{min-height:56px;border:1px solid rgba(11,37,89,.16);border-radius:14px;background:rgba(255,255,255,.85);
  color:var(--navy-deep);font-family:var(--display);font-weight:700;font-size:1rem;text-align:left;padding:14px 16px;cursor:pointer;
  transition:transform .3s var(--ease-out),border-color .25s,background .25s,box-shadow .3s var(--ease-out)}
.financing-answer:hover,.financing-answer:focus{border-color:var(--gold-deep);background:#FFF9EA;outline:none;
  transform:translateY(-2px);box-shadow:0 14px 28px -16px rgba(232,164,0,.55)}
.financing-back{margin-top:14px;min-height:46px;width:100%}
.financing-note{color:var(--ink-soft);margin:0 0 14px;font-size:.95rem}
.financing-done{padding:10px 0 4px}
.financing-done h2{font-size:clamp(1.9rem,5vw,2.7rem);margin:8px 0 12px}
.financing-done p{color:var(--ink-soft);font-size:1.02rem}
.financing-done-actions{display:grid;gap:10px;margin-top:22px}
@media(min-width:760px){.financing-done-actions{grid-template-columns:1fr 1fr}.financing-back{width:auto}}
@media(max-height:650px){
  .financing-survey-hero{padding:12px 0}
  .financing-survey-card{padding:18px}
  .financing-survey-card .lead{display:none}
  .financing-survey-card h1{font-size:clamp(1.5rem,4.5vw,2.2rem)}
  .financing-note{display:none} /* compaction ladder: shed the lead paragraph */
  .financing-answer{min-height:48px;padding:10px 14px}
  .financing-q{margin:12px 0 10px}
  .financing-survey-card .form-grid{gap:9px}
  .financing-survey-card .fine-print{font-size:.6rem}
}

/* ---------- Product detail (SLUG) — Paradise sales structure, premium skin
   (TVD-027). Slim strip → dark ambient hero → two-column body with a sticky
   glass price card (recipe C). Rich sections hide when their field is empty. */

/* Slim strip — animated gold sweep hairline on its bottom edge (top of page) */
.pdp-strip{position:relative;background:var(--navy-abyss);color:#fff}
.pdp-strip::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,#FFD46A 50%,transparent) no-repeat,rgba(255,184,28,.28);
  background-size:38% 100%;animation:pp-sweep 5.5s ease-in-out infinite}
/* padding-block only — .wrap owns the horizontal padding */
.pdp-strip-inner{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;padding-block:10px}
.pdp-back{font-family:'Spline Sans Mono',monospace;font-size:.66rem;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:rgba(255,255,255,.72);text-decoration:none;transition:color .2s}
.pdp-back:hover{color:var(--gold)}
.pdp-strip-note{font-family:'Spline Sans Mono',monospace;font-size:.62rem;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gold)}

/* Dark ambient hero */
.pdp-hero{position:relative;overflow:hidden;color:#fff;
  padding:clamp(40px,6vw,64px) 0 clamp(36px,5.4vw,56px);
  background:radial-gradient(900px 460px at 84% -12%,rgba(255,184,28,.1),transparent 60%),
    radial-gradient(820px 480px at 6% 112%,rgba(22,70,155,.45),transparent 62%),
    linear-gradient(180deg,var(--navy-abyss),var(--navy-night))}
.pdp-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,#FFD46A 50%,transparent) no-repeat,rgba(255,184,28,.28);
  background-size:38% 100%;animation:pp-sweep 5.5s ease-in-out infinite}
.pdp-hero-grid{display:grid;gap:26px;align-items:center}
.pdp-kicker{display:inline-flex;align-items:center;gap:10px;margin:0 0 14px;
  font-family:'Spline Sans Mono',monospace;font-size:.66rem;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.pdp-kicker::before{content:"";width:26px;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}
.pdp-hero h1{font-family:var(--display);font-weight:800;color:#fff;
  font-size:clamp(1.9rem,4.6vw,2.9rem);line-height:1.08;letter-spacing:-.01em;margin:0 0 14px;max-width:640px}
/* Plain model name under the benefit headline (Paradise pattern) */
.pdp-model{margin:-6px 0 12px;font-family:var(--display);font-weight:700;font-size:1.08rem;
  background:linear-gradient(94deg,#FFE29A 0%,#FFB81C 48%,#F0A400 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.pdp-sub{max-width:560px;margin:0 0 22px;color:rgba(255,255,255,.78);
  font-size:clamp(.98rem,2.3vw,1.08rem);line-height:1.6}
.pdp-hero-actions{display:flex;gap:12px;flex-wrap:wrap}
/* Breathing gold frame around the product photo: a 2px gradient ring with a
   bright arc that travels around the image, plus a soft glow that breathes. */
.pdp-hero-media .media-frame{position:relative;border-radius:20px;overflow:hidden;padding:2px;
  box-shadow:0 34px 70px -30px rgba(0,0,0,.7);
  animation:pdp-breathe 4.6s ease-in-out infinite}
.pdp-hero-media .media-frame::before{content:"";position:absolute;left:50%;top:50%;
  width:230%;aspect-ratio:1/1;transform:translate(-50%,-50%);
  background:conic-gradient(from 0deg,
    rgba(255,184,28,.22) 0deg 268deg,
    rgba(255,212,106,.85) 306deg,
    #FFB81C 322deg,
    rgba(255,184,28,.22) 352deg 360deg);
  animation:pdp-orbit 7s linear infinite}
.pdp-hero-media img{position:relative;z-index:1;display:block;width:100%;height:100%;
  aspect-ratio:1.25/1;object-fit:cover;border-radius:18px}
@keyframes pdp-orbit{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes pdp-breathe{
  0%,100%{box-shadow:0 34px 70px -30px rgba(0,0,0,.7),0 0 26px -8px rgba(255,184,28,.22)}
  50%{box-shadow:0 34px 70px -30px rgba(0,0,0,.7),0 0 46px -4px rgba(255,184,28,.5)}}
@media(prefers-reduced-motion:reduce){
  .pdp-hero-media .media-frame,.pdp-hero-media .media-frame::before{animation:none}}
@media(min-width:900px){.pdp-hero-grid{grid-template-columns:1.05fr .95fr;gap:44px}}

/* Two-column body */
.pdp-layout{display:grid;gap:28px;padding-top:30px;padding-bottom:56px}
.pdp-main{min-width:0}
.pdp-section{margin:0 0 clamp(28px,4.6vw,44px)}
.pdp-section h2{font-family:var(--display);font-weight:800;color:var(--navy-deep);
  font-size:clamp(1.3rem,3vw,1.7rem);letter-spacing:-.01em;margin:0 0 16px}
@media(min-width:900px){
  .pdp-layout{grid-template-columns:minmax(0,1fr) 360px;gap:44px}
  .pdp-aside{order:2}
}
/* Mobile: price card rides directly under the hero, before the content */
@media(max-width:899px){.pdp-aside{order:-1}}

/* Sticky glass price card */
.pdp-price-card{position:relative;border-radius:22px;padding:26px 24px 24px;
  background:linear-gradient(168deg,rgba(255,255,255,.96),rgba(255,255,255,.88));
  backdrop-filter:blur(26px) saturate(1.3);-webkit-backdrop-filter:blur(26px) saturate(1.3);
  border:1px solid rgba(255,255,255,.7);
  box-shadow:0 30px 70px -28px rgba(3,12,32,.4),inset 0 1px 0 rgba(255,255,255,.9)}
.pdp-price-card::before{content:"";position:absolute;top:0;left:24px;right:24px;height:3px;border-radius:0 0 4px 4px;
  background:linear-gradient(90deg,var(--gold-soft),var(--gold) 40%,var(--gold-deep))}
@media(min-width:900px){.pdp-price-card{position:sticky;top:92px}}
.pdp-price-label{margin:0 0 4px;font-family:'Spline Sans Mono',monospace;font-size:.62rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.pdp-price{margin:0;font-family:var(--display);font-weight:800;font-size:2.2rem;line-height:1.05;color:var(--navy-deep)}
.pdp-price--ask{font-size:1.3rem;line-height:1.3}
.pdp-monthly{margin:4px 0 0;font-family:var(--display);font-weight:800;font-size:1.02rem;
  background:linear-gradient(180deg,#D9A50E 8%,#B98200 70%);-webkit-background-clip:text;background-clip:text;color:transparent}
/* Out-the-door promise line — the no-surprises hook */
.pdp-otd{margin:10px 0 0;padding-left:12px;border-left:2px solid var(--gold);
  font-size:.82rem;line-height:1.5;font-weight:600;color:var(--navy-deep)}
/* Status callout (pending/sold) — sand box with gold edge, Paradise pattern */
.pdp-status-note{margin:14px 0 0;padding:14px 16px;border:1px solid rgba(232,164,0,.45);
  border-radius:12px;background:#FBF7EE}
.pdp-status-note b{display:block;margin-bottom:4px;font-family:var(--display);font-weight:800;
  font-size:.95rem;color:var(--gold-deep)}
.pdp-status-note p{margin:0;font-size:.84rem;line-height:1.55;color:var(--ink)}
.pdp-fin-line{margin:12px 0 0;font-size:.8rem;line-height:1.5;color:var(--ink-soft)}
.pdp-cta-stack{display:grid;gap:10px;margin-top:16px}
.pdp-availability{margin:14px 0 0;font-family:'Spline Sans Mono',monospace;font-size:.6rem;font-weight:500;
  letter-spacing:.08em;text-transform:uppercase;line-height:1.6;color:var(--ink-soft)}
/* Booking invite — night-glass card revealed under the form confirmation */
.pdp-book-invite{margin-top:18px;padding:24px 22px;border-radius:18px;color:#fff;
  background:radial-gradient(420px 220px at 85% -20%,rgba(255,184,28,.14),transparent 60%),
    linear-gradient(168deg,var(--navy-night),var(--navy-abyss));
  border:1px solid rgba(255,184,28,.35);
  animation:pdp-invite-in .45s ease both}
.pdp-book-kicker{margin:0 0 8px;font-family:'Spline Sans Mono',monospace;font-size:.62rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.pdp-book-invite h3, .pdp-book-invite .h3{margin:0 0 8px;font-family:var(--display);font-weight:800;font-size:1.3rem;color:#fff}
.pdp-book-copy{margin:0 0 16px;font-size:.92rem;line-height:1.6;color:rgba(255,255,255,.78)}
.pdp-book-invite .btn{width:100%}
.pdp-book-addr{display:flex;flex-direction:column;gap:2px;margin:14px 0 0;
  font-family:'Spline Sans Mono',monospace;font-size:.66rem;font-weight:500;
  letter-spacing:.08em;text-transform:uppercase;line-height:1.7;color:rgba(255,255,255,.6)}
.pdp-book-addr a{color:var(--gold);text-decoration:none}
.pdp-book-addr a:hover{text-decoration:underline}
@keyframes pdp-invite-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.pdp-book-invite{animation:none}}

/* Live scarcity variant: pulsing dot + red stock count */
.pdp-availability--live{display:flex;align-items:flex-start;gap:8px;color:var(--ink)}
.pdp-availability--live b{color:#E03131;font-weight:700}
.pdp-live{width:8px;height:8px;border-radius:50%;background:#FF4A41;flex:none;margin-top:3px;
  animation:pdp-pulse 1.8s infinite}
@keyframes pdp-pulse{0%,100%{box-shadow:0 0 0 0 rgba(255,74,65,.55)}55%{box-shadow:0 0 0 8px rgba(255,74,65,0)}}
@media(prefers-reduced-motion:reduce){.pdp-live{animation:none}}

/* Sticky mobile CTA bar — same night-glass canon as the homepage quick bar */
.pdp-mbar{position:fixed;bottom:0;left:0;right:0;z-index:70;display:grid;grid-template-columns:1fr 2.2fr;gap:9px;
  padding:10px 12px calc(10px + env(safe-area-inset-bottom));
  background:rgba(4,15,38,.88);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border-top:1px solid rgba(255,184,28,.4);
  transform:translateY(110%);transition:transform .3s ease}
.pdp-mbar.show{transform:translateY(0)}
.pdp-mbar a{display:flex;align-items:center;justify-content:center;gap:6px;min-height:52px;padding:14px 4px;
  border-radius:12px;font-family:var(--display);font-weight:700;font-size:.85rem;text-decoration:none}
.pdp-mbar-call{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.22)}
.pdp-mbar-cta{background:linear-gradient(180deg,#FFD46A,#F0A400);color:var(--navy-night)}
@media(min-width:1024px){.pdp-mbar{display:none}}

/* Quick facts — icon + mono label grid */
.pdp-facts-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media(min-width:640px){.pdp-facts-grid{grid-template-columns:repeat(3,1fr)}}
.pdp-fact{display:flex;align-items:center;gap:10px;min-height:52px;padding:10px 14px;
  background:#F7F9FD;border:1px solid var(--line);border-radius:12px}
.pdp-fact::before{content:"";flex:none;width:8px;height:8px;transform:rotate(45deg);border-radius:2px;
  background:linear-gradient(135deg,var(--gold-soft),var(--gold-deep))}
.pdp-fact-label{font-family:'Spline Sans Mono',monospace;font-size:.66rem;font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;color:var(--navy-deep);line-height:1.4}

/* Why it stands out — gold check bullets */
.pdp-why-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.pdp-why-list li{position:relative;padding-left:34px;font-size:.98rem;line-height:1.6;color:var(--ink)}
.pdp-why-list li::before{content:"\2713";position:absolute;left:0;top:1px;width:22px;height:22px;
  display:flex;align-items:center;justify-content:center;border-radius:50%;
  background:linear-gradient(135deg,var(--gold-soft),var(--gold-deep));
  color:var(--navy-night);font-size:.72rem;font-weight:800}

/* About */
.pdp-about-copy{margin:0;font-size:1.02rem;line-height:1.75;color:var(--ink)}

/* Best for — sand callout with gold edge */
.pdp-bestfor{border-left:3px solid var(--gold);border-radius:0 14px 14px 0;
  background:#FBF7EE;padding:18px 22px}
.pdp-bestfor-label{margin:0 0 6px;font-family:'Spline Sans Mono',monospace;font-size:.62rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep)}
.pdp-bestfor-copy{margin:0;font-family:var(--display);font-weight:700;font-size:1.08rem;line-height:1.5;color:var(--navy-deep)}

/* Inline lead form card */
.pdp-form-card{position:relative;border-radius:22px;padding:28px 26px 26px;
  background:linear-gradient(168deg,rgba(255,255,255,.97),rgba(255,255,255,.9));
  border:1px solid var(--line);
  box-shadow:0 30px 64px -30px rgba(3,12,32,.35)}
.pdp-form-card::before{content:"";position:absolute;top:0;left:24px;right:24px;height:3px;border-radius:0 0 4px 4px;
  background:linear-gradient(90deg,var(--gold-soft),var(--gold) 40%,var(--gold-deep))}
.pdp-form-card h2{margin-bottom:6px}
.pdp-form-lead{margin:0 0 12px;font-size:.94rem;line-height:1.55;color:var(--ink-soft)}
.pdp-selected{margin:0 0 16px;font-family:'Spline Sans Mono',monospace;font-size:.66rem;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.pdp-selected b{color:var(--navy-royal)}

/* FAQ accordion */
.pdp-faq-item{border-bottom:1px solid var(--line)}
.pdp-faq-item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:14px;
  padding:16px 2px;font-family:var(--display);font-weight:700;font-size:1rem;color:var(--navy-deep)}
.pdp-faq-item summary::-webkit-details-marker{display:none}
.pdp-faq-item summary::after{content:"+";flex:none;font-family:var(--display);font-weight:800;font-size:1.2rem;
  color:var(--gold-deep);transition:transform .25s}
.pdp-faq-item[open] summary::after{transform:rotate(45deg)}
.pdp-faq-item p{margin:0 0 16px;padding:0 2px;font-size:.94rem;line-height:1.65;color:var(--ink-soft)}
.pdp-faq-item p a{color:var(--navy-royal);font-weight:700}

/* ---------- Thank-you scene ---------- */
.page-thankyou main{position:relative;overflow:hidden;display:flex;align-items:center;
  min-height:calc(100vh - 64px);min-height:calc(100dvh - 64px)}
.page-thankyou .hero{background:none;flex:1}
.page-thankyou main::before{content:"";position:absolute;inset:0;z-index:0;
  background:radial-gradient(900px 480px at 50% -10%,rgba(22,70,155,.55),transparent 60%),
    radial-gradient(760px 420px at 85% 108%,rgba(255,184,28,.12),transparent 62%),
    linear-gradient(180deg,var(--navy-night),var(--navy-abyss))}
.page-thankyou main::after{content:"";position:absolute;top:0;left:0;right:0;height:1px;z-index:1;
  background:linear-gradient(90deg,transparent,#FFD46A 50%,transparent) no-repeat,rgba(255,184,28,.28);
  background-size:38% 100%;
  animation:pp-sweep 5.5s ease-in-out infinite}
.page-thankyou .hero::before{content:"";position:absolute;z-index:1;border-radius:9999px;filter:blur(72px);pointer-events:none;
  width:520px;height:340px;left:-8%;bottom:-14%;background:rgba(22,70,155,.5);animation:drift1 16s ease-in-out infinite}
.page-thankyou .hero::after{content:"";position:absolute;z-index:1;border-radius:9999px;filter:blur(72px);pointer-events:none;
  width:460px;height:300px;right:-6%;top:-16%;background:rgba(255,184,28,.13);animation:drift2 20s ease-in-out infinite}
.page-thankyou .hero-inner{align-items:center}
.page-thankyou .hero .btn-outline{background:rgba(255,255,255,.04);color:#fff;border-color:rgba(255,255,255,.3)}
.page-thankyou .hero-card h3, .page-thankyou .hero-card .h3{display:flex;align-items:center;gap:10px}
.page-thankyou .hero-card h3::before, .page-thankyou .hero-card .h3::before{content:"";flex:none;width:34px;height:34px;border-radius:50%;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2306183D' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E"),linear-gradient(180deg,#FFD46A,#F5AD0E);
  background-repeat:no-repeat,no-repeat;background-position:center,center;background-size:16px 16px,100% 100%;
  box-shadow:0 10px 22px -8px rgba(232,164,0,.6)}

/* ============ Booking page (/book/) — premium conversion scene ============
   Full-height night-water background (same recipe as financing/thank-you),
   glass booking card + expectation steps and showroom info. No nav exits. */
.page-book main.book-scene{position:relative;overflow:hidden;display:grid;align-content:center;
  min-height:calc(100vh - 64px);min-height:calc(100dvh - 64px);
  background:radial-gradient(900px 480px at 50% -10%,rgba(22,70,155,.55),transparent 60%),
    radial-gradient(760px 420px at 88% 110%,rgba(255,184,28,.11),transparent 62%),
    linear-gradient(180deg,var(--navy-night),var(--navy-abyss))}
.page-book main.book-scene::after{content:"";position:absolute;top:0;left:0;right:0;height:1px;z-index:3;
  background:linear-gradient(90deg,transparent,#FFD46A 50%,transparent) no-repeat,rgba(255,184,28,.28);
  background-size:38% 100%;
  animation:pp-sweep 5.5s ease-in-out infinite}
.book-grid{position:relative;z-index:2;display:grid;gap:30px;padding-top:44px;padding-bottom:64px}
.book-intro .kicker{color:var(--gold-soft)}
.book-intro .kicker::before{background:linear-gradient(90deg,var(--gold),transparent)}
.book-intro h1{color:#fff;font-size:clamp(2.1rem,6.5vw,3.6rem);margin-bottom:14px}
.book-sub{color:#C9D5EE;font-size:clamp(1rem,2vw,1.1rem);max-width:560px}
.book-panel{min-width:0}
.book-points{list-style:none;display:grid;gap:18px}
.book-points li{display:flex;gap:14px;align-items:flex-start}
.book-points span{flex:none;font-family:var(--mono);font-weight:600;font-size:.66rem;letter-spacing:.18em;
  color:var(--gold-soft);border:1px solid rgba(255,184,28,.35);border-radius:999px;
  min-width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;margin-top:2px}
.book-points b{display:block;font-family:var(--display);font-weight:700;font-size:1.02rem;color:#fff;margin-bottom:3px}
.book-points p{color:#C9D5EE;font-size:.92rem;line-height:1.55}
.book-visit{margin-top:26px;border:1px solid rgba(255,255,255,.14);border-radius:20px;padding:20px 20px 22px;
  background:rgba(255,255,255,.04);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.book-visit-title{font-family:var(--mono);font-weight:600;font-size:.66rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--gold-soft);margin-bottom:14px}
.book-visit-list{list-style:none;display:grid;gap:11px;margin-bottom:16px}
.book-visit-list li{display:flex;gap:11px;align-items:flex-start;color:#C6D4EF;font-size:.92rem;line-height:1.55}
.book-visit-list svg{flex:none;color:var(--gold-soft);margin-top:3px}
.book-visit-list a{color:#fff}
.book-visit-list a:hover{color:var(--gold-soft)}
.book-card{max-width:560px;padding:26px 22px 24px;
  background:linear-gradient(168deg,rgba(255,255,255,.96),rgba(255,255,255,.88));
  backdrop-filter:blur(26px) saturate(1.3);-webkit-backdrop-filter:blur(26px) saturate(1.3);
  border:1px solid rgba(255,255,255,.7);
  box-shadow:0 44px 90px -28px rgba(3,12,32,.65),inset 0 1px 0 rgba(255,255,255,.9)}
.page-book .book-trust{color:#8FA6D2}
@media(min-width:1000px){
  .book-grid{grid-template-columns:1.04fr .9fr;grid-template-areas:"intro panel" "aside panel";
    column-gap:56px;row-gap:34px;align-items:start;padding-top:72px;padding-bottom:96px}
  .book-intro{grid-area:intro}
  .book-panel{grid-area:panel;position:sticky;top:92px}
  .book-aside{grid-area:aside}
  .book-card{margin-inline:0}
}
.book-label{font-family:'Spline Sans Mono',monospace;font-weight:600;font-size:.66rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--gold-dark);margin:4px 0 10px}
.book-step + .book-step{margin-top:18px}
.book-step.on{animation:bookIn .35s var(--ease-out)}
@keyframes bookIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.book-chips{display:flex;gap:9px;flex-wrap:wrap}
.book-chip{min-height:48px;min-width:48px;padding:8px 14px;border-radius:13px;cursor:pointer;
  border:1px solid rgba(11,37,89,.16);background:rgba(255,255,255,.85);
  font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:.92rem;color:var(--navy-deep);
  transition:transform .2s var(--ease-out),border-color .2s,background .2s,box-shadow .2s}
.book-chip:hover{transform:translateY(-2px);border-color:rgba(232,164,0,.5)}
.book-chip.sel{background:linear-gradient(180deg,var(--navy-royal),var(--navy-deep));color:#fff;
  border-color:var(--navy-deep);box-shadow:0 10px 22px -10px rgba(6,24,61,.55)}
.book-chip-day{display:flex;flex-direction:column;align-items:center;gap:1px;min-width:64px;padding:9px 10px}
.book-chip-day span{font-family:'Spline Sans Mono',monospace;font-weight:600;font-size:.56rem;
  letter-spacing:.14em;text-transform:uppercase;opacity:.75}
.book-chip-day b{font-size:1.25rem;line-height:1.15}
.book-chips-time{max-height:224px;overflow-y:auto}
.book-picked{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:.95rem;
  color:var(--navy-deep);background:linear-gradient(180deg,rgba(255,184,28,.18),rgba(255,184,28,.1));
  border:1px solid rgba(232,164,0,.42);border-radius:11px;padding:10px 14px;margin:0 0 12px}
.book-error{color:var(--red);font-weight:600}
.book-success{text-align:center;padding:14px 4px 6px}
.book-success.on{animation:bookIn .4s var(--ease-out)}
/* Promoted h3 -> h2 for a valid outline; pin the size so it still renders at
   the original h3 scale instead of inheriting the h2 default. */
.book-success h3, .book-success .book-success-h, .book-success .h3{margin-bottom:8px;font-size:1.17rem}
.book-success .hero-actions{justify-content:center;margin-top:16px}
.book-trust{margin-top:16px;font-family:'Spline Sans Mono',monospace;font-size:.62rem;font-weight:500;
  letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
.page-book .site-footer .footer-grid{grid-template-columns:1fr;text-align:center}
@media(max-width:420px){.book-chip{flex:1 1 auto}}
.book-loading{font-family:'Spline Sans Mono',monospace;font-size:.68rem;font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-soft);padding:14px 2px;animation:bookPulse 1.4s ease-in-out infinite}
@keyframes bookPulse{0%,100%{opacity:.45}50%{opacity:1}}

/* ---- Legal document pages (privacy policy). Deliberately plain: a policy is
   read, not sold, so it gets comfortable measure and clear hierarchy rather
   than the gold treatment used on selling pages. ---- */
.legal-page{padding:clamp(40px,7vw,84px) 20px clamp(56px,9vw,110px)}
.legal-wrap{max-width:70ch;margin:0 auto}
.legal-wrap h1{font-family:var(--display);font-size:clamp(1.9rem,5vw,2.7rem);line-height:1.1;margin:0 0 6px}
.legal-meta{font-family:var(--mono);font-size:.7rem;font-weight:500;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-soft);margin:0 0 28px}
.legal-wrap h2{font-family:var(--display);font-size:clamp(1.05rem,2.4vw,1.25rem);line-height:1.25;
  margin:34px 0 8px;padding-top:18px;border-top:1px solid var(--line)}
.legal-wrap p{margin:0 0 14px;line-height:1.72;color:var(--ink-soft)}
.legal-wrap a{color:var(--gold);text-underline-offset:3px}
.legal-wrap a:hover{color:var(--gold-soft)}

/* ---- Sold / pending default product card (active-inventory grid). ----
   Only sold loses its colour: a pending unit still wants a backup buyer, so
   greying it out would suppress the inquiry the CTA is asking for. */
[data-inventory-status="sold"] .sale-badge,
[data-inventory-status="pending"] .sale-badge{
  background:linear-gradient(180deg,#2A3244,#141927);color:#fff;box-shadow:none}
[data-inventory-status="sold"] .product-image img{filter:grayscale(.55) brightness(.93)}
/* This card is the only one with two buttons, so the muted CTA goes navy rather
   than outline: it drops the red "buy" signal but stays the primary action next
   to View Details. An outline here would sit on white with no contrast and read
   as the weaker of the two. */
[data-inventory-status="sold"] .product-actions .btn-red,
[data-inventory-status="pending"] .product-actions .btn-red{
  background:linear-gradient(180deg,var(--navy-royal),var(--navy-deep));
  color:#fff;box-shadow:0 12px 26px -14px rgba(11,37,89,.55)}
