/* ===========================================================
   tlg78.css — the concierge-card landing (2026-09-09)
   Loads after tlg77-elevate.css. Only landing-level layout and the
   pieces that changed; every colour comes from tokens.css.
   =========================================================== */

/* ---- Type: Newsreader carries the voice, Public Sans does the work ---- */
.hero77__headline{ font-family:var(--font-display); font-weight:500; letter-spacing:-.02em; line-height:1.04; font-size:clamp(2.4rem,5vw,4.3rem); max-width:15ch; text-wrap:balance; }
.hero77__headline em{ font-style:italic; font-weight:400; color:var(--accent-2); background:none; box-shadow:none; white-space:normal; display:inline; padding:0; }
.hero77__headline em::after{ display:none; }
.hero77__eyebrow{ font-family:var(--font-body); font-weight:700; letter-spacing:.14em; font-size:11.5px; color:var(--accent-2); }
.hero77__sub{ font-size:clamp(1.05rem,1.3vw,1.2rem); line-height:1.6; max-width:52ch; color:var(--text-muted); }
.hero77__sub b{ color:var(--text); font-weight:600; }
.hero77__trust{ color:var(--text-faint); }
.hero77__credtxt b{ color:var(--text); }
.sample__title, .lockstrip__title, .sh__h2, .who78__h2, .nbgrid78__h2, .buycard__h1, .barlist__title{ font-family:var(--font-display); font-weight:500; letter-spacing:-.015em; }
.sample__title em, .lockstrip__title em, .who78__h2 em, .nbgrid78__h2 em, .buycard__h1 em{ font-style:italic; font-weight:400; color:var(--accent-2); }
.sample__kick, .lockstrip__kick, .sh__kick, .who78__kick, .nbgrid78__kick, .buycard__kick, .barlist__kick{ color:var(--accent-2); font-weight:700; letter-spacing:.14em; text-transform:uppercase; font-size:11.5px; }

/* ---- Buttons: one verb colour, pill for the primary ---- */
.btn77--primary, .buycard__cta, .pitch__cta, .lockstrip__cta, .maplock__cta, .appbar__cta, .leadin__form .btn77--primary{ background:var(--accent); color:var(--text-on-accent); border-color:var(--accent); box-shadow:var(--shadow-cta); }
.btn77--primary:hover, .buycard__cta:hover, .pitch__cta:hover, .lockstrip__cta:hover, .appbar__cta:hover{ background:var(--accent-deep); border-color:var(--accent-deep); }
.btn77--ghost{ background:var(--surface-1); color:var(--text); border:1px solid var(--border-strong); box-shadow:none; }
.btn77--ghost:hover{ border-color:var(--text); }

/* ---- Statband: four checkable numbers ---- */
.statband{ border-top:1px solid var(--border); border-bottom:1px solid var(--border); background:var(--surface-1); }
.stat__num{ font-family:var(--font-display); font-weight:500; letter-spacing:-.02em; color:var(--text); }
.stat__num .accent{ color:var(--accent-2); }

/* ---- Outcomes row: paper cards, ink text ---- */
.win{ background:var(--surface-1); border:1px solid var(--border); border-radius:var(--r-md); box-shadow:var(--shadow-1); }
.win b{ color:var(--text); font-family:var(--font-display); font-size:1.1rem; font-weight:500; }

/* ---- The concierge card (sample entry): brass hairline + three labelled lines ---- */
.sample__card{ background:var(--surface-1); border:1px solid var(--border); border-top:3px solid var(--gold); border-radius:var(--r-lg); box-shadow:var(--shadow-2); }
.sample__name{ font-family:var(--font-display); font-weight:500; font-size:1.5rem; letter-spacing:-.01em; }
.sample__why{ font-family:var(--font-display); font-style:italic; font-size:1.12rem; line-height:1.45; color:var(--text); }
.srow dt{ font-family:var(--font-body); font-weight:700; letter-spacing:.12em; text-transform:uppercase; font-size:10.5px; color:var(--text-faint); }
.srow dd{ color:var(--text); }
.sample__open{ color:var(--accent-2); border-color:var(--border-strong); }

/* ---- Who's behind it ---- */
.who78{ padding:clamp(48px,7vw,96px) var(--edge); border-top:1px solid var(--border); background:var(--surface-2); }
.who78__inner{ max-width:var(--container); margin:0 auto; display:grid; gap:clamp(24px,4vw,56px); align-items:center; }
@media(min-width:900px){ .who78__inner{ grid-template-columns:minmax(0,5fr) minmax(0,7fr); } }
.who78__photos{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.who78__photos img{ width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:var(--r-lg); box-shadow:var(--shadow-2); display:block; }
.who78__photos img:last-child{ margin-top:32px; }
.who78__h2{ font-size:clamp(1.8rem,3.2vw,2.6rem); line-height:1.1; margin:.4em 0 .6em; }
.who78__copy p{ font-size:1.05rem; line-height:1.65; color:var(--text-muted); max-width:58ch; }
.who78__copy p em{ color:var(--text); font-family:var(--font-display); font-style:italic; }
.who78__copy a{ color:var(--accent-2); text-decoration:underline; text-underline-offset:3px; }
.who78__sig{ font-family:var(--font-display); font-style:italic; font-size:1.3rem; color:var(--text) !important; }

/* ---- The offer on the landing (buycard moved out of About) ---- */
.offer78{ padding:clamp(40px,6vw,80px) var(--edge) 0; }
.offer78__inner{ max-width:var(--container); margin:0 auto; }
.offer78 .buycard{ background:var(--surface-1); border:1px solid var(--border); color:var(--text); box-shadow:var(--shadow-2); }
.offer78 .buycard__film, .offer78 .buycard__filmscrim{ display:none; }
.offer78 .buycard__h1, .offer78 .buycard__amount, .offer78 .buycard__list li, .offer78 .buycard__frac, .offer78 .bterm, .offer78 .buycard__freeline, .offer78 .buycard__risk, .offer78 .buycard__support, .offer78 .buycard__recover{ color:var(--text); }
.offer78 .buycard__frac, .offer78 .buycard__risk, .offer78 .buycard__support{ color:var(--text-muted); }
.offer78 .buycard__amount{ font-family:var(--font-display); font-weight:500; letter-spacing:-.03em; }
.offer78 .bterm{ background:var(--surface-2); border:1px solid var(--border); }
.offer78 .c-buy__check{ background:var(--accent); color:var(--text-on-accent); }
.offer78 .buycard__ghost{ color:var(--accent-2); }
.offer78 .buycard__key input{ background:var(--surface-2); color:var(--text); border:1px solid var(--border-strong); }
.offer78 .buycard__key button{ background:var(--text); color:var(--bg); }
.offer78 .buycard__support a, .offer78 .buycard__risk a{ color:var(--accent-2); }
.offer78 .hanko{ border-color:var(--gold); color:var(--gold); }
.offer78 .about__h2{ font-family:var(--font-display); font-weight:500; font-size:clamp(1.5rem,2.4vw,2rem); margin:clamp(28px,4vw,44px) 0 12px; }
.offer78 .checks li{ color:var(--text-muted); line-height:1.55; }
.offer78 .checks li strong{ color:var(--text); }
.offer78 .says{ margin-top:clamp(28px,4vw,44px); }
.offer78 .says__h1{ font-family:var(--font-display); font-weight:500; }
.offer78 .noreviews{ margin:clamp(20px,3vw,32px) 0 0; padding:18px 20px; border:1px dashed var(--border-strong); border-radius:var(--r-md); color:var(--text-muted); font-size:.95rem; line-height:1.5; }
.offer78 .noreviews b{ color:var(--text); }
.offer78 .noreviews a{ color:var(--accent-2); }

/* ---- Neighbourhood grid: pick where you're sleeping ---- */
.nbgrid78{ padding:clamp(48px,7vw,96px) var(--edge) clamp(24px,4vw,40px); }
.nbgrid78__inner{ max-width:var(--container); margin:0 auto; }
.nbgrid78__head{ display:flex; flex-wrap:wrap; align-items:end; justify-content:space-between; gap:12px 24px; margin-bottom:clamp(18px,2.6vw,28px); }
.nbgrid78__h2{ font-size:clamp(1.7rem,3vw,2.4rem); line-height:1.1; margin:.3em 0 0; }
.nbgrid78__note{ color:var(--text-muted); max-width:38ch; margin:0; }
.nbgrid78__grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
@media(min-width:640px){ .nbgrid78__grid{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; } }
@media(min-width:960px){ .nbgrid78__grid{ grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; } }
.nbtile{ position:relative; display:block; aspect-ratio:4/3; border-radius:var(--r-md); overflow:hidden; background:var(--surface-3) center/cover no-repeat; color:#fff; text-align:left; border:0; padding:0; cursor:pointer; box-shadow:var(--shadow-1); transition:transform var(--t-med) var(--ease), box-shadow var(--t-med) var(--ease); font:inherit; }
.nbtile:hover{ transform:translateY(-2px); box-shadow:var(--shadow-2); }
.nbtile::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,.72) 100%); }
.nbtile__txt{ position:absolute; left:12px; right:12px; bottom:10px; z-index:1; display:flex; align-items:end; justify-content:space-between; gap:8px; }
.nbtile__name{ font-family:var(--font-display); font-weight:500; font-size:clamp(1rem,1.4vw,1.2rem); line-height:1.1; text-shadow:0 1px 8px rgba(0,0,0,.5); }
.nbtile__n{ font-size:11.5px; font-weight:700; letter-spacing:.06em; background:rgba(255,255,255,.18); backdrop-filter:blur(6px); border-radius:999px; padding:3px 8px; white-space:nowrap; }
.nbtile--nopic{ background:var(--surface-2); color:var(--text); }
.nbtile--nopic::after{ display:none; }
.nbtile--nopic .nbtile__name{ text-shadow:none; }
.nbtile--nopic .nbtile__n{ background:var(--surface-3); color:var(--text-muted); }
.nbtile:focus-visible{ outline:3px solid var(--accent); outline-offset:2px; }

/* ---- Browse block: the app, introduced ---- */
.browse78__head{ max-width:var(--container); margin:0 auto; padding:clamp(28px,4vw,48px) var(--edge) 8px; }
.browse78__h2{ font-family:var(--font-display); font-weight:500; font-size:clamp(1.6rem,2.8vw,2.2rem); letter-spacing:-.015em; margin:0 0 6px; }
.browse78__sub{ color:var(--text-muted); margin:0; max-width:60ch; }

/* ---- Chips: quiet pills, green when active ---- */
.chip{ border-radius:999px; background:var(--surface-1); border:1px solid var(--border); color:var(--text); }
.chip.is-active, .chip[aria-pressed="true"]{ background:var(--accent); color:var(--text-on-accent); border-color:var(--accent); }
.chip.is-active .chip__count, .chip[aria-pressed="true"] .chip__count{ background:rgba(255,255,255,.2); color:inherit; }

/* ---- Locked rows: a summary line instead of a wall ---- */
.pinrow--sum{ background:var(--surface-2); border:1px dashed var(--border-strong); }
.pinrow--sum .pinrow__thumb--tile{ background:var(--accent-soft); color:var(--accent-2); }
.pinrow--sum .pinrow__title{ color:var(--text); }
.pinrow--sum .pinrow__meta{ color:var(--text-muted); }
.pinrow--sum .pinrow__end{ color:var(--accent-2); font-weight:700; font-size:.9rem; }

/* ---- Map: paper frame ---- */
.split__map{ border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--border); }

/* ---- Reduced motion ---- */
@media (prefers-reduced-motion: reduce){ .nbtile{ transition:none; } .nbtile:hover{ transform:none; } }

/* ---- v78 fixes ---- */
.offer78 .buycard__resend, .offer78 [class*="resend"]{ background:var(--surface-2); color:var(--text); border:1px solid var(--border-strong); }
.filmwin__poster{ display:block; width:100%; height:100%; object-fit:cover; }
@media(max-width:640px){ .hero77__headline{ font-size:2.15rem; max-width:none; } .hero77__sub{ font-size:1rem; } }
/* statband: one label per breakpoint (both spans were showing) */
.stat .lbl-m{ display:none; } .stat .lbl-d{ display:inline; }
@media(max-width:640px){ .stat .lbl-m{ display:inline; } .stat .lbl-d{ display:none; } }
/* film caption: readable over the burned-in watermark */
.filmwin__cap{ background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.72) 45%); padding-top:28px; }
/* the film caption duplicated the hero copy and sat on the burned-in watermark; keep only the location tag until it plays */
.filmwin:not(.is-playing) .filmwin__cap{ background:none; padding:0; }
.filmwin:not(.is-playing) .filmwin__cap > :not(.filmwin__loc){ display:none; }
.filmwin:not(.is-playing) .filmwin__loc{ position:absolute; right:14px; bottom:12px; font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#fff; background:rgba(0,0,0,.55); padding:5px 9px; border-radius:999px; }
