/* Places Half Empty — V5 (lighter editorial photo-book, portrait A4) */

:root{
  --paper:#f4f1ea;
  --ink:#1c1a17;
  --soft:#4a463d;
  --mut:#8a8475;
  --line:#d8d2c4;
  --accent:#8f3b2c;
  --cream:#f5efe3;          /* text over images */
  --cream-soft:#efe7d6;
  --gold:#e8cda2;           /* labels over images */
  --cover-top:#d9c47e;      /* warm tone carried from the cover */
  --page-w: 820px;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  background:#ddd8cb;
  color:var(--ink);
  font-family:"Cormorant Garamond","Georgia","Times New Roman",serif;
  -webkit-font-smoothing:antialiased;
  padding:40px 0 80px;
}
.book{ width:var(--page-w); margin:0 auto; }

.page{
  position:relative;
  width:var(--page-w);
  height:calc(var(--page-w) * 1.414286);
  container-type:inline-size;
  background:var(--paper);
  margin:0 auto 26px;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.16);
}

/* ---------- paper text pages ---------- */
.pad{ padding:13cqw 11cqw; height:100%; display:flex; flex-direction:column; }
.folio{
  position:absolute; top:6.5cqw; right:8cqw;
  font-family:"Inter",sans-serif; font-weight:600;
  font-size:1.5cqw; letter-spacing:.32em; color:var(--mut);
}
.folio::before{ content:""; display:inline-block; width:4.5cqw; height:1px;
  background:var(--line); vertical-align:middle; margin-right:1.4cqw; }
.kicker{
  font-family:"Inter",sans-serif; font-weight:600;
  font-size:1.25cqw; letter-spacing:.28em; text-transform:uppercase;
  color:var(--accent); margin:0 0 3.5cqw;
}
.h{ font-weight:500; font-size:7.4cqw; line-height:1.02; margin:0 0 4cqw; }
.h--sm{ font-size:5.6cqw; }
.lead{ font-size:3.05cqw; line-height:1.42; color:var(--ink); margin:0 0 3cqw; font-style:italic; }
.body{ font-size:2.04cqw; line-height:1.62; color:var(--soft); margin:0 0 2.2cqw; max-width:74cqw; }
.body:last-child{ margin-bottom:0; }
.rule{ width:13cqw; height:2px; background:var(--accent); margin:0 0 4.5cqw; opacity:.85; }
.bracket{ position:relative; padding-top:3cqw; }
.bracket::before{ content:""; position:absolute; top:0; left:0; width:5cqw; height:5cqw;
  border-top:1px solid var(--line); border-left:1px solid var(--line); }

/* ---------- logline: colour carries from cover, fades to white ---------- */
/* starts at the cover's bottom colour, ends at the next page's black */
.page--logline{
  background:linear-gradient(180deg,
    #372b0d 0%, #2a2109 16%, #181308 40%, #0a0805 72%, #010101 100%);
}
.page--logline .pad{ justify-content:center; padding-top:24cqw; padding-bottom:20cqw; }
.page--logline .folio{ color:rgba(245,239,227,.72); }
.page--logline .folio::before{ background:rgba(245,239,227,.42); }
.page--logline .kicker{ color:var(--gold); }
.page--logline .lead{ color:var(--cream); }
.page--logline .body{ color:var(--cream-soft); }
.page--logline .bracket::before{ border-color:rgba(245,239,227,.32); }

/* ---------- "rise" pages: image scaled to width, sat at bottom,
              matching colour field above (seamless), text in the field ---------- */
.page--rise{ background:#000; }
.rise-img{ position:absolute; left:0; right:0; bottom:0; width:100%; height:auto; display:block; }
.ov--top{ bottom:auto; top:13cqw; }

/* ---------- director's statement: colour transition between neighbours ---------- */
.page--statement{
  background:linear-gradient(180deg, #0c0505 0%, #060302 55%, #040100 100%);
}
.page--statement .kicker{ color:var(--gold); }
.page--statement .rule{ background:var(--gold); opacity:.62; }
.page--statement .body{ color:#d8d1c3; }
.page--statement .folio{ color:rgba(245,239,227,.6); }
.page--statement .folio::before{ background:rgba(245,239,227,.34); }

/* ---------- full-bleed image pages (cover system) ---------- */
.page--bleed{ background:#0f0e0c; }
.bleed-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(1.02); }
.veil{ position:absolute; inset:0;
  background:linear-gradient(180deg,
    rgba(0,0,0,.18) 0%, rgba(0,0,0,0) 24%, rgba(0,0,0,.10) 42%,
    rgba(0,0,0,.50) 66%, rgba(0,0,0,.84) 100%); }
.veil--soft{ background:linear-gradient(180deg,
    rgba(0,0,0,.10) 0%, rgba(0,0,0,0) 34%, rgba(0,0,0,0) 52%,
    rgba(0,0,0,.34) 78%, rgba(0,0,0,.72) 100%); }
.frame{ position:absolute; inset:4cqw; border:1px solid rgba(244,239,228,.42); pointer-events:none; }
.folio--over{ color:rgba(245,239,227,.72); }
.folio--over::before{ background:rgba(245,239,227,.4); }

.ov{ position:absolute; left:9cqw; right:9cqw; bottom:8.5cqw; color:var(--cream); }
.ov .kick{ font-family:"Inter",sans-serif; font-weight:600; font-size:1.3cqw;
  letter-spacing:.26em; text-transform:uppercase; color:var(--gold); margin:0 0 2.6cqw; }
.ov h2{ font-weight:500; font-size:6.6cqw; line-height:1.0; margin:0 0 3cqw;
  text-shadow:0 2px 24px rgba(0,0,0,.45); }
.ov h2.h2--sm{ font-size:5.4cqw; }
.ov h2 .age{ font-family:"Inter",sans-serif; font-weight:400; font-size:2.2cqw; color:#d8cbb0; letter-spacing:.06em; }
.ov p{ font-size:2.04cqw; line-height:1.5; color:var(--cream-soft); margin:0 0 2cqw;
  max-width:80cqw; text-shadow:0 1px 18px rgba(0,0,0,.55); }
.ov p:last-child{ margin-bottom:0; }
.ov .lead{ font-style:italic; font-size:2.9cqw; line-height:1.4; color:var(--cream); }
.ov .wf{ display:grid; grid-template-columns:1fr 1fr; gap:5cqw; margin-top:1cqw; }
.ov .wf h4{ font-family:"Inter",sans-serif; font-size:1.25cqw; letter-spacing:.2em;
  text-transform:uppercase; color:var(--gold); margin:0 0 .9cqw; }
.ov .wf p{ font-size:1.92cqw; margin:0; }
.ov .pull{ font-style:italic; font-size:3.9cqw; line-height:1.2; margin:0 0 2.2cqw;
  color:var(--cream); text-shadow:0 2px 24px rgba(0,0,0,.5); }
.ov .pull-by{ font-family:"Inter",sans-serif; font-size:1.4cqw; letter-spacing:.18em;
  text-transform:uppercase; color:#d8cbb0; margin:0; }

/* ---------- cover ---------- */
.page--cover{ background:#0f0e0c; }
.cov-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(1.02); }
.cov-veil{ position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.12) 0%, rgba(0,0,0,0) 32%, rgba(0,0,0,.12) 62%, rgba(0,0,0,.62) 100%); }
.cov-text{ position:absolute; left:9cqw; right:9cqw; bottom:9cqw; color:var(--cream); }
.cov-text .credit{ font-family:"Inter",sans-serif; font-size:1.5cqw; letter-spacing:.34em;
  text-transform:uppercase; color:#e7ddc8; margin:0 0 2.4cqw; }
.cov-text h1{ font-weight:500; font-size:11cqw; line-height:.96; margin:0 0 2.4cqw; }
.cov-text .tag{ font-size:2.7cqw; font-style:italic; color:#efe7d6; max-width:62cqw; margin:0; }

/* ---------- visual plan reference line (trimmed) ---------- */
.refs{ font-size:1.9cqw; line-height:1.55; color:var(--cream-soft); max-width:82cqw;
  text-shadow:0 1px 18px rgba(0,0,0,.55); }

/* ---------- team ---------- */
.team-row{ display:grid; grid-template-columns:24cqw 1fr; gap:5cqw; align-items:start;
  padding:3.4cqw 0; border-top:1px solid var(--line); }
.team-row:first-of-type{ border-top:none; }
.team-row img{ width:100%; height:30cqw; object-fit:cover; filter:grayscale(1) contrast(1.02);
  border:1px solid rgba(0,0,0,.06); box-shadow:0 6px 16px rgba(0,0,0,.16); }
.team-row h3{ font-weight:500; font-size:3.4cqw; margin:0; line-height:1; }
.team-row .trole{ font-family:"Inter",sans-serif; font-size:1.3cqw; letter-spacing:.2em;
  text-transform:uppercase; color:var(--accent); margin:.8cqw 0 1.8cqw; }
.team-row p{ font-size:1.78cqw; line-height:1.55; color:var(--soft); margin:0; }
.brand-foot{ margin-top:auto; font-family:"Inter",sans-serif; font-size:1.2cqw;
  letter-spacing:.28em; text-transform:uppercase; color:var(--mut); }

/* ---------- Noá: image lowered, its top colour extends upward, text on top ---------- */
/* fill replicates the image's top edge across the width (yellower left → mauve right) */
.page--noa{ background:linear-gradient(90deg,
  #a29672 0%, #d7babc 18%, #d8babf 34%, #d4b5bb 50%, #ceaeb5 66%, #c5a2a8 80%, #ba949d 100%); }
/* double-sided vertical feather centred on the seam (~41.4cqw). plain gradient = prints fine */
.noa-blend{ position:absolute; left:0; right:0; top:31cqw; height:21cqw;
  background:linear-gradient(180deg,
    rgba(207,178,182,0) 0%, rgba(207,178,182,.82) 50%, rgba(207,178,182,0) 100%); }
.ov--dark{ color:var(--ink); }
.ov--dark .kick{ color:var(--accent); }
.ov--dark h2{ text-shadow:none; }
.ov--dark h2 .age{ color:var(--mut); }
.ov--dark p{ color:var(--soft); text-shadow:none; }
.ov--dark .wf h4{ color:var(--accent); }
.ov--dark .wf p{ color:var(--soft); }

/* ---------- Noá's apartment: dusk cityscape rises into its own sky colour ---------- */
.page--apt{ background:#e5d0bd; }   /* = the photo's top sky colour, extended up */
.apt-blend{ position:absolute; left:0; right:0; top:71cqw; height:13cqw;
  background:linear-gradient(180deg, #e5d0bd 0%, #e5d0bd 34%, rgba(229,208,189,0) 100%); }

/* ---------- team: continues the previous page's colour ---------- */
.page--team{ background:#040100; }   /* black, like the top of the visual-plan page */
.page--team .kicker{ color:var(--gold); }
.page--team .rule{ background:var(--gold); opacity:.6; }
.page--team .team-row{ border-top-color:rgba(245,239,227,.18); }
.page--team .team-row h3{ color:var(--cream); }
.page--team .team-row .trole{ color:var(--gold); }
.page--team .team-row p{ color:#d9cfc4; }
.page--team .folio{ color:rgba(245,239,227,.6); }
.page--team .folio::before{ background:rgba(245,239,227,.34); }
.page--team .brand-foot{ color:rgba(245,239,227,.5); }

/* ---------- print ---------- */
@media print{
  @page{ size:A4 portrait; margin:0; }
  body{ background:none; padding:0; }
  .book{ width:auto; }
  .page{ width:210mm; height:297mm; margin:0; box-shadow:none;
    break-after:page; page-break-after:always; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  .page:last-child{ break-after:auto; }
  /* Chrome's PDF engine rasterises soft text-shadows as grey boxes — drop them in print */
  .ov h2, .ov p, .ov .lead, .ov .pull, .ov .kick, .refs,
  .cov-text h1, .cov-text .tag, .cov-text .credit{ text-shadow:none !important; }
}

/* ── image-variant switcher (review tool) ── */
.variant-btn{
  position:absolute; top:2.4cqw; right:2.4cqw; z-index:40;
  display:flex; align-items:center; gap:.6cqw;
  height:4.6cqw; padding:0 1.6cqw; border-radius:2.3cqw;
  background:rgba(10,10,10,.55); color:rgba(244,239,228,.85);
  border:1px solid rgba(244,239,228,.28);
  font:500 1.7cqw/1 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  cursor:pointer; opacity:.45; transition:opacity .2s;
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
}
.variant-btn:hover{ opacity:1; }
.variant-btn span{ font-size:1.4cqw; letter-spacing:.05em; opacity:.8; }
@media print{ .variant-btn{ display:none !important; } }

/* Each option is a complete page composition: crop, overlay and type placement. */
.variant-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.variant-img[hidden]{ display:none; }
.page[data-variant] .folio, .page[data-variant] .ov, .page[data-variant] .pad{ z-index:6; }
.page[data-variant] .pad{ position:relative; }

/* 01 — permanent, untouched Budapest sunset; copy sits on the dark rooftops. */
.page--logline[data-variant="logline-roofs"] .variant-img{ object-position:50% 50%; }
.page--logline[data-variant="logline-roofs"] .pad{ justify-content:flex-end; padding:0 11cqw 13cqw; }
.page--logline[data-variant="logline-roofs"] .lead{ font-size:2.8cqw; line-height:1.36; }
.page--logline[data-variant="logline-roofs"] .lead,
.page--logline[data-variant="logline-roofs"] .body{ text-shadow:0 1px 18px rgba(0,0,0,.82); }
.page--logline[data-variant="logline-roofs"] .body{ color:#fff8ea; font-size:1.92cqw; max-width:68cqw; }

/* 02 — use each photograph's naturally dark negative space; never dim the image. */
.page[data-variant^="synopsis-"] .rise-img{ inset:0; width:100%; height:100%; object-fit:cover; }
.page[data-variant^="synopsis-"] .ov{ z-index:6; top:9cqw; left:9cqw; right:9cqw; max-width:76cqw; }
.page[data-variant="synopsis-bridge"] .rise-img{ object-position:50% 50%; }
.page[data-variant="synopsis-silhouette"] .rise-img{ object-position:50% 50%; }

/* 07 — use existing negative space only; the photographs remain untouched. */
.page--apt[data-variant] .rise-img{ inset:0; width:100%; height:100%; object-fit:cover; }
.page--apt[data-variant] .apt-blend{ display:none; }
.page--apt[data-variant] .ov--dark{ color:var(--cream); }
.page--apt[data-variant] .ov--dark .kick{ color:var(--gold); }
.page--apt[data-variant] .ov--dark h2{ text-shadow:0 2px 24px rgba(0,0,0,.5); }
.page--apt[data-variant] .ov--dark p{ color:var(--cream-soft); text-shadow:0 1px 18px rgba(0,0,0,.65); }
.page--apt[data-variant] .folio{ color:rgba(245,239,227,.75); }
.page--apt[data-variant] .folio::before{ background:rgba(245,239,227,.4); }
.page--apt[data-variant="apt-curtains"] .rise-img{ object-position:50% 50%; }
.page--apt[data-variant="apt-curtains"] .ov{ top:auto; bottom:8.5cqw; max-width:78cqw; }
.page--apt[data-variant="apt-parquet"] .rise-img{ object-position:50% 50%; }
.page--apt[data-variant="apt-parquet"] .ov{ top:auto; bottom:8.5cqw; max-width:78cqw; }
.page--apt[data-variant="apt-mattress"] .rise-img{ object-position:50% 50%; }
.page--apt[data-variant="apt-mattress"] .ov{ top:auto; bottom:8.5cqw; max-width:78cqw; }
.page--apt[data-variant="apt-kitchen"] .rise-img{ object-position:50% 50%; }
.page--apt[data-variant="apt-kitchen"] .ov{ top:15cqw; bottom:auto; left:52cqw; right:7cqw; max-width:41cqw; }
.page--apt[data-variant="apt-kitchen"] .ov::before{ content:""; position:absolute; z-index:-1;
  inset:-4cqw -3.5cqw; pointer-events:none;
  background:radial-gradient(ellipse at 52% 46%, rgba(4,7,6,.64) 0%, rgba(4,7,6,.48) 52%, rgba(4,7,6,0) 78%); }
.page--apt[data-variant="apt-kitchen"] .ov h2{ font-size:5.2cqw; }
.page--apt[data-variant="apt-kitchen"] .ov p{ font-size:1.86cqw; line-height:1.46; }

/* ── 2026-07-15 refinements ── */
/* 02 option 1 (bridge): image pushed down so all copy sits on solid ground;
   page bg matches the image's top edge and a seam gradient hides the join. */
.page[data-variant="synopsis-bridge"]{ background:#0b0908; }
.page[data-variant="synopsis-bridge"] .rise-img{ top:38cqw; height:calc(100% - 38cqw); }
.page[data-variant="synopsis-bridge"]::before{ content:""; position:absolute; left:0; right:0;
  top:38cqw; height:16cqw; z-index:2; pointer-events:none;
  background:linear-gradient(180deg, #0b0908 0%, rgba(11,9,8,.6) 40%, rgba(11,9,8,0) 100%); }

/* 01 logline-roofs: copy moved up into the pale sky, dark ink, no shadows. */
.page--logline[data-variant="logline-roofs"] .pad{ justify-content:flex-start; padding:10cqw 11cqw 0; }
.page--logline[data-variant="logline-roofs"] .lead{ color:#33241a; text-shadow:none; font-size:2.9cqw; line-height:1.38; max-width:74cqw; }
.page--logline[data-variant="logline-roofs"] .body{ color:#52402f; text-shadow:none; font-size:1.94cqw; max-width:64cqw; }
.page--logline[data-variant="logline-roofs"] .kicker{ color:#8a4f2e; }
.page--logline[data-variant="logline-roofs"] .bracket::before{ border-color:#8a4f2e; }

/* 07 apt-kitchen: darkening spread wider + feathered so its edge disappears. */
.page--apt[data-variant="apt-kitchen"] .ov::before{
  inset:-18cqw -16cqw;
  background:radial-gradient(ellipse at 50% 42%,
    rgba(4,7,6,.5) 0%, rgba(4,7,6,.42) 28%, rgba(4,7,6,.28) 48%,
    rgba(4,7,6,.15) 65%, rgba(4,7,6,.06) 80%, rgba(4,7,6,0) 94%); }

/* keep the kicker clear of the bracket's vertical line (print engine clips the L) */
.page--logline[data-variant="logline-roofs"] .kicker{ padding-left:1.5cqw; }

/* logline-roofs: image pushed down, top filled with the sky's own colour, seam blended */
.page--logline[data-variant="logline-roofs"]{ background:#e6d0bc; }
.page--logline[data-variant="logline-roofs"] .variant-img{ top:34cqw; height:calc(100% - 34cqw); }
.page--logline[data-variant="logline-roofs"]::before{ content:""; position:absolute; left:0; right:0;
  top:34cqw; height:15cqw; z-index:2; pointer-events:none;
  background:linear-gradient(180deg, #e6d0bc 0%, rgba(230,208,188,.6) 40%, rgba(230,208,188,0) 100%); }

/* apt-kitchen darkening: gradient sized to closest-side so alpha reaches 0
   before every box edge — no visible rectangle anywhere */
.page--apt[data-variant="apt-kitchen"] .ov::before{
  inset:-24cqw -22cqw;
  background:radial-gradient(ellipse closest-side at 50% 45%,
    rgba(4,7,6,.48) 0%, rgba(4,7,6,.4) 32%, rgba(4,7,6,.28) 52%,
    rgba(4,7,6,.15) 68%, rgba(4,7,6,.06) 82%, rgba(4,7,6,0) 94%);
}

/* ── 09 chihuahua variants ── */
/* chi-lot: copy up in the pale flat sky, dark ink, veil off */
.page[data-variant="chi-lot"] .ov{ top:8cqw; bottom:auto; max-width:78cqw; }
.page[data-variant="chi-lot"] .ov h2{ color:#2e3338; text-shadow:none; }
.page[data-variant="chi-lot"] .ov p{ color:#454c52; text-shadow:none; }
.page[data-variant="chi-lot"] .ov .kick{ color:#7a5a3a; }
.page[data-variant="chi-lot"] .veil{ display:none; }
.page[data-variant="chi-lot"] .folio{ color:rgba(52,58,64,.65); }
.page[data-variant="chi-lot"] .folio::before{ background:rgba(52,58,64,.4); }
.page[data-variant="chi-lot"] .frame{ border-color:rgba(52,58,64,.28); }

/* chi-lot: shift the block right so no line runs behind the utility pole */
.page[data-variant="chi-lot"] .ov{ left:31cqw; right:7cqw; max-width:none; }

/* apt-bosch (Dorka's vintage kitchen): bottom gradient carries the cream copy */
.page--apt[data-variant="apt-bosch"] .ov{ top:auto; bottom:8.5cqw; max-width:78cqw; }
.page--apt[data-variant="apt-bosch"]::before{ content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(180deg, rgba(0,0,0,0) 52%, rgba(0,0,0,.38) 74%, rgba(0,0,0,.72) 100%); }

/* chihuahua page: Dorka's bright phone photos need firmer shadows on the cream copy */
.page[data-variant="chi-car"] .ov h2,
.page[data-variant="chi-pack"] .ov h2,
.page[data-variant="chi-sun"] .ov h2{ text-shadow:0 1px 22px rgba(0,0,0,.7), 0 0 7px rgba(0,0,0,.45); }
.page[data-variant="chi-car"] .ov p, .page[data-variant="chi-car"] .ov .kick,
.page[data-variant="chi-pack"] .ov p, .page[data-variant="chi-pack"] .ov .kick,
.page[data-variant="chi-sun"] .ov p, .page[data-variant="chi-sun"] .ov .kick{ text-shadow:0 1px 14px rgba(0,0,0,.75), 0 0 5px rgba(0,0,0,.4); }

/* ── 07 Juli's house kitchen variants: vertical images go full-bleed ── */
.page[data-variant^="jh-"] .rise-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

/* green galley: cream copy at the bottom over a soft darkening gradient */
.page[data-variant="jh-green"] .ov{ top:auto; bottom:8.5cqw; }
.page[data-variant="jh-green"]::before{ content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(180deg, rgba(0,0,0,0) 52%, rgba(0,0,0,.42) 74%, rgba(0,0,0,.82) 100%); }
.page[data-variant="jh-green"] .folio{ color:rgba(47,46,41,.65); }
.page[data-variant="jh-green"] .folio::before{ background:rgba(47,46,41,.4); }

/* checkerboard: cream copy stays at the top, darkening flipped to the top */
.page[data-variant="jh-checker"]::before{ content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(180deg, rgba(0,0,0,.66) 0%, rgba(0,0,0,.4) 22%, rgba(0,0,0,0) 48%); }

/* ── 04 Juli + 09 chihuahua variants: NO dimming veil; text readable via placement ── */
.page[data-variant^="juli-"] .veil,
.page[data-variant="chi-snow"] .veil,
.page[data-variant="chi-gate"] .veil{ display:none; }

/* cream text without a veil needs slightly firmer shadows */
.page[data-variant^="juli-"] .ov h2,
.page[data-variant="chi-gate"] .ov h2{ text-shadow:0 1px 22px rgba(0,0,0,.65), 0 0 6px rgba(0,0,0,.35); }
.page[data-variant^="juli-"] .ov p,
.page[data-variant^="juli-"] .ov .kick,
.page[data-variant^="juli-"] .ov .wf h4,
.page[data-variant="chi-gate"] .ov p,
.page[data-variant="chi-gate"] .ov .kick{ text-shadow:0 1px 14px rgba(0,0,0,.7); }

/* juli-lot: same pale-sky treatment — copy top, dark ink, right of the pole */
.page[data-variant="juli-lot"] .ov{ top:6.5cqw; bottom:auto; left:31cqw; right:7cqw; }
.page[data-variant="juli-lot"] .ov h2{ color:#2e3338; text-shadow:none; }
.page[data-variant="juli-lot"] .ov h2 .age{ color:#5f666d; }
.page[data-variant="juli-lot"] .ov p{ color:#454c52; text-shadow:none; }
.page[data-variant="juli-lot"] .ov .kick{ color:#7a5a3a; text-shadow:none; }
.page[data-variant="juli-lot"] .ov .wf h4{ color:#7a5a3a; text-shadow:none; }
.page[data-variant="juli-lot"] .folio{ color:rgba(52,58,64,.65); }
.page[data-variant="juli-lot"] .folio::before{ background:rgba(52,58,64,.4); }

/* ── COVER variants ── */
.page--cover[data-variant="cov-car"] .cov-veil{ display:none; }
.page--cover[data-variant="cov-car"] .cov-text h1{ color:#33302c; }
.page--cover[data-variant="cov-car"] .cov-text .credit{ color:#5d554b; }
.page--cover[data-variant="cov-car"] .cov-text .tag{ color:#4d453d; }
.page--cover[data-variant="cov-car"] .frame{ border-color:rgba(58,53,47,.35); }
.page--cover[data-variant="cov-car"] .cov-text h1,
.page--cover[data-variant="cov-car"] .cov-text .credit,
.page--cover[data-variant="cov-car"] .cov-text .tag{ color:#211b16; text-shadow:none; }

/* ── 03 SPIRAL variants ── */
/* Cover option 1 reused here: keep the pale copy in the dark lower curtain field. */
.page[data-variant="sp-curtains"] .veil{
  background:linear-gradient(180deg,
    rgba(0,0,0,.08) 0%, rgba(0,0,0,0) 40%, rgba(0,0,0,.34) 64%, rgba(0,0,0,.88) 100%);
}

/* Cover option 2 reused here: the pale backseat foreground carries dark ink cleanly. */
.page[data-variant="sp-car"] .veil{ display:none; }
.page[data-variant="sp-car"] .ov h2{ color:#211b16; text-shadow:none; }
.page[data-variant="sp-car"] .ov p{ color:#302a25; text-shadow:none; }
.page[data-variant="sp-car"] .ov .kick{ color:#6b4d35; text-shadow:none; }

/* sp-red: image pushed up, bottom extended in its own maroon so no visible edge */
.page[data-variant="sp-red"]{ background:#4a1c14; }
.page[data-variant="sp-red"] .veil{ display:none; }
.page[data-variant="sp-red"] .bleed-img{ height:112cqw; object-position:50% 22%; }
.page[data-variant="sp-red"]::before{ content:""; position:absolute; left:0; right:0;
  top:94cqw; height:19cqw; z-index:2; pointer-events:none;
  background:linear-gradient(180deg, rgba(74,28,20,0) 0%, #4a1c14 100%); }

/* ── 10 VISUAL PLAN (red car interior, full-bleed, copy at top) ── */
.page--vplan .ov h2,
.page--vplan .ov .kick,
.page--vplan .refs{ text-shadow:0 1px 16px rgba(0,0,0,.55); }

/* 05 Noá (Luca portrait): copy at TOP over the ceiling pattern — veil flipped to darken the top */
.page--luca .ov{ top:7cqw; bottom:auto; }
.page--luca .veil{ background:linear-gradient(180deg,
  rgba(0,0,0,.68) 0%, rgba(0,0,0,.44) 20%, rgba(0,0,0,.14) 38%, rgba(0,0,0,0) 52%); }

/* chi-snow: bottom splits dim snow / dark figure — cream with firm shadow reads on both */
.page[data-variant="chi-snow"] .ov h2{ text-shadow:0 1px 22px rgba(0,0,0,.7), 0 0 7px rgba(0,0,0,.45); }
.page[data-variant="chi-snow"] .ov p,
.page[data-variant="chi-snow"] .ov .kick{ text-shadow:0 1px 14px rgba(0,0,0,.75), 0 0 5px rgba(0,0,0,.4); }
