/* Solvia v5 - the growth session is the product. White page, logo blue, sunrise highlights, crafted illustrations. */
:root {
  --blue: #1d20e6;
  --blue-dark: #1316b0;
  --blue-2: #3b3ef0;
  --blue-soft: #eef0ff;
  --ink: #0d0e2b;
  --ink-2: #3a3c57;
  --muted: #6b6e8c;
  --sun: #ffc93c;
  --sun-deep: #ffb21c;
  --sun-soft: #fff4d1;
  --white: #ffffff;
  --line: #e3e4ee;
  --paper: #fffdf8;
  --max: 1200px;
  --serif: "Fraunces", Georgia, serif;
  --sans: "Lexend", system-ui, sans-serif;
  --ease: cubic-bezier(.2, .7, .1, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--white); color: var(--ink); font: 400 18px/1.6 var(--sans); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
a { color: inherit; }
img { max-width: 100%; display: block; }
svg { display: block; }
h1, h2, h3 { margin: 0; color: var(--ink); }
h1, h2 { font-family: var(--serif); font-weight: 600; letter-spacing: -0.02em; line-height: 1.05; font-variation-settings: "SOFT" 50, "opsz" 144; }
h1 { font-size: clamp(2.5rem, 5.6vw, 4.6rem); }
h2 { font-size: clamp(2rem, 4.2vw, 3.4rem); }
h3 { font: 500 1.25rem/1.3 var(--sans); letter-spacing: -0.01em; }
p { margin: 0 0 1em; }
strong, b { font-weight: 600; }
.container { width: 100%; max-width: var(--max); margin: 0 auto; padding: 0 28px; }
.skip { position: absolute; left: -999px; top: 8px; background: var(--blue); color: #fff; padding: 8px 14px; z-index: 100; }
.skip:focus { left: 12px; }
:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
.eyebrow-label { display: block; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; }

/* Marker highlight: the words a scanner should land on */
.hl { background: linear-gradient(transparent 46%, var(--sun) 46%, var(--sun) 92%, transparent 92%) no-repeat 0 0 / 0% 100%;
  -webkit-box-decoration-break: clone; box-decoration-break: clone; padding: 0 .08em; transition: background-size 1s var(--ease) .25s; }
.in .hl, .hl.in, .hero .hl, .page-hero .hl { background-size: 100% 100%; }
.hero .hl, .page-hero .hl { transition: none; animation: mark 1s var(--ease) both .7s; }
@keyframes mark { from { background-size: 0% 100%; } }
.on-dark .hl { color: var(--ink); background-image: linear-gradient(var(--sun), var(--sun)); background-position: 0 55%; background-size: 0% 92%; padding: 0 .12em; }
.on-dark .in .hl, .on-dark .hl.in { background-size: 100% 92%; }

/* Logo */
.sun { display: inline-block; width: .62em; height: .62em; border-radius: 50%; margin: 0 .035em; transform: translateY(.03em); background: linear-gradient(currentColor 0 45%, transparent 45% 55%, currentColor 55%); }
.wordmark { font: 600 1.8rem/1 var(--sans); letter-spacing: -0.03em; color: var(--blue); text-decoration: none; display: inline-flex; align-items: center; min-height: 44px; }
.wordmark.sm { font-size: 1.05rem; min-height: 0; }
.wordmark.light { color: #fff; }

/* Buttons and links */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 52px; padding: 14px 26px; border-radius: 10px; border: 2px solid var(--blue);
  font: 500 1.05rem var(--sans); text-decoration: none; cursor: pointer; transition: background .2s, color .2s, transform .2s var(--ease); }
.btn:hover { transform: translateY(-2px); }
.btn-primary { background: var(--blue); color: #fff; }
.btn-primary:hover { background: var(--blue-dark); border-color: var(--blue-dark); }
.btn-sun { background: var(--sun); border-color: var(--sun); color: var(--ink); }
.btn-sun:hover { background: var(--sun-deep); border-color: var(--sun-deep); }
.btn .arrow { transition: transform .25s var(--ease); }
.btn:hover .arrow { transform: translateX(4px); }
.text-link { display: inline-flex; align-items: center; min-height: 44px; font-weight: 500; color: var(--blue); text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 2px; }
.next-line { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; margin: 16px 0 0; padding: 0; list-style: none; font-size: .92rem; color: var(--ink-2); }
.next-line li { white-space: nowrap; }
.next-line li + li::before { content: "\2192"; color: var(--blue); margin-right: 10px; }

/* Placeholder chips: visible until the config is filled */
.slot { display: inline-block; border: 1.5px dashed #9a9cc4; border-radius: 6px; padding: 0 6px; font-size: .9em; color: #5b5e8a; background: #f6f6fc; white-space: normal; }
.on-dark .slot, .pass .slot { border-color: rgba(255,255,255,.6); color: #fff; background: rgba(255,255,255,.12); }

/* Header */
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.96); border-bottom: 1px solid transparent; transition: border-color .3s; }
.site-header.scrolled { border-bottom-color: var(--line); }
.nav { display: flex; align-items: center; justify-content: space-between; height: 80px; }
.nav-links { display: flex; align-items: center; gap: 32px; list-style: none; margin: 0; padding: 0; }
.nav-links a { text-decoration: none; font-size: 1rem; color: var(--ink); }
.nav-links a:not(.btn) { display: inline-flex; min-height: 44px; align-items: center; }
.nav-links a:not(.btn):hover, .nav-links a[aria-current="page"] { color: var(--blue); }
.nav-links .btn { min-height: 44px; padding: 10px 18px; font-size: .97rem; color: #fff; }
.menu-toggle { display: none; background: none; border: 0; width: 48px; height: 48px; cursor: pointer; }
.menu-toggle span { display: block; width: 26px; height: 2px; background: var(--ink); margin: 6px auto; transition: transform .3s, opacity .3s; }

/* HERO */
.hero { padding: clamp(40px, 6vw, 80px) 0 clamp(64px, 8vw, 110px); overflow: hidden; }
.hero-grid { display: grid; grid-template-columns: 1.02fr .98fr; gap: clamp(32px, 5vw, 64px); align-items: center; }
.hero-sub { font-size: clamp(1.1rem, 1.5vw, 1.22rem); color: var(--ink-2); max-width: 560px; margin: 26px 0 32px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px 22px; align-items: center; }
.hero-stack { position: relative; min-height: 560px; }
.hero-stack .doc { position: absolute; top: 0; right: 0; width: min(430px, 90%); transform: rotate(-3.5deg); animation: docIn 1s var(--ease) both .15s; }
.hero-stack .pass { position: absolute; left: 0; bottom: 0; width: min(500px, 100%); transform: rotate(2deg); animation: passIn 1.1s var(--ease) both .45s; }
@keyframes docIn { from { opacity: 0; transform: translateY(30px) rotate(-7deg); } }
@keyframes passIn { from { opacity: 0; transform: translateY(70px) rotate(7deg); } }

/* ===== The growth plan document ===== */
.doc { --behind: var(--white); position: relative; background: var(--paper); border-radius: 10px; color: var(--ink);
  box-shadow: 0 1px 1px rgba(13,14,43,.05), 0 6px 14px -6px rgba(13,14,43,.12), 0 30px 60px -28px rgba(13,14,43,.35); }
.doc::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px; border-radius: 10px 10px 0 0; background: repeating-linear-gradient(90deg, var(--blue) 0 70%, var(--sun) 70% 100%); background-size: 100% 6px; }
.doc::after { /* folded corner */ content: ""; position: absolute; top: 0; right: 0; width: 34px; height: 34px; border-radius: 0 10px 0 6px;
  background: linear-gradient(225deg, var(--behind) 50%, #e8e6dd 50%); box-shadow: -2px 2px 4px rgba(13,14,43,.08); }
.doc-top { padding: 24px 28px 16px; }
.doc-meta { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 14px; }
.doc-meta .wordmark { margin-right: auto; }
.doc-title { font: 600 1.55rem/1.1 var(--serif); margin: 0 0 4px; }
.doc-for { font-size: .82rem; color: var(--muted); margin: 0; }
.doc-for i { font-style: normal; color: var(--ink-2); border-bottom: 1px dashed #b7b9d2; }
.doc-sum { margin: 0 28px; padding: 14px 16px; border-radius: 10px; background: var(--blue-soft); display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: center; }
.doc-sum .big { font: 600 2.3rem/1 var(--serif); color: var(--blue); }
.doc-sum .big small { display: block; font: 500 .74rem/1.3 var(--sans); color: var(--ink-2); margin-top: 4px; letter-spacing: 0; }
.bar { display: flex; height: 14px; border-radius: 7px; overflow: hidden; gap: 2px; }
.bar span { display: block; height: 100%; }
.bar span:nth-child(1) { background: var(--blue); }
.bar span:nth-child(2) { background: var(--blue-2); opacity: .7; }
.bar span:nth-child(3) { background: var(--sun); }
.bar-key { display: flex; justify-content: space-between; margin-top: 6px; font-size: .7rem; color: var(--muted); }
.fixes { list-style: none; margin: 8px 0 0; padding: 0 28px; }
.fix { display: grid; grid-template-columns: 40px 1fr auto; gap: 14px; align-items: start; padding: 14px 0; border-bottom: 1px solid #ecebe4; }
.fix:last-child { border-bottom: 0; }
.fix-ico { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; color: var(--blue); background: #fff; border: 1.5px solid #dcdcf3; position: relative; }
.fix-ico svg { width: 20px; height: 20px; }
.fix-ico b { position: absolute; top: -7px; left: -7px; width: 20px; height: 20px; border-radius: 50%; background: var(--blue); color: #fff; font-size: .68rem; display: grid; place-items: center; }
.fix-txt b { display: block; font-weight: 600; font-size: .96rem; line-height: 1.3; }
.fix-txt small { display: block; font-size: .78rem; color: var(--muted); margin-top: 3px; }
.fix-txt small s { text-decoration-color: #e2533f; }
.fix-val { text-align: right; }
.fix-val .save { display: block; font: 600 1rem/1 var(--serif); color: var(--blue); white-space: nowrap; }
.effort { display: inline-flex; gap: 3px; margin-top: 8px; align-items: center; }
.effort i { width: 6px; height: 12px; border-radius: 2px; background: #dcdcea; }
.effort i.on { background: var(--sun-deep); }
.effort em { font-style: normal; font-size: .68rem; color: var(--muted); margin-left: 5px; }
.doc-foot { display: flex; justify-content: space-between; align-items: center; padding: 6px 28px 22px; color: var(--muted); font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; }
.stamp { display: inline-grid; place-items: center; padding: 6px 12px; border: 2.5px double var(--blue); border-radius: 8px; color: var(--blue); font: 700 .74rem/1.15 var(--sans);
  letter-spacing: .12em; text-align: center; transform: rotate(-10deg); opacity: .9; }
.doc-tag { position: absolute; top: -12px; left: 24px; z-index: 2; background: var(--ink); color: #fff; font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; padding: 4px 10px; border-radius: 4px; }
.doc.compact .fix-txt small { display: none; }
.doc.compact .fix { padding: 11px 0; }

/* ===== The session pass ===== */
.pass { position: relative; display: grid; grid-template-columns: 1fr 118px; color: #fff; text-decoration: none; border-radius: 18px;
  background:
    repeating-radial-gradient(circle at 92% 118%, transparent 0 15px, rgba(255,255,255,.07) 15px 16px),
    linear-gradient(var(--blue), var(--blue));
  box-shadow: 0 2px 4px rgba(13,14,43,.15), 0 28px 50px -22px rgba(13,14,43,.5); transition: transform .35s var(--ease); }
.pass::before, .pass::after { content: ""; position: absolute; right: 106px; width: 24px; height: 24px; border-radius: 50%; background: var(--notch, var(--white)); }
.pass::before { top: -12px; } .pass::after { bottom: -12px; }
.pass:hover { transform: rotate(0) translateY(-4px); }
.pass-main { padding: 20px 24px 20px; display: grid; gap: 14px; }
.pass-head { display: flex; align-items: center; gap: 10px; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; }
.pass-head .wordmark { margin-right: 6px; }
.pass-head .tag { margin-left: auto; color: var(--sun); }
.pass-route { display: grid; grid-template-columns: 1fr 120px 1fr; align-items: end; gap: 6px; }
.pass-route .lbl { display: block; font-size: .64rem; letter-spacing: .14em; text-transform: uppercase; opacity: .7; }
.pass-route .val { display: block; font: 600 1.2rem/1.1 var(--serif); }
.pass-route .to { text-align: right; }
.pass-route svg { width: 120px; height: 46px; }
.pass-fields { display: grid; grid-template-columns: repeat(4, auto); justify-content: space-between; gap: 10px; padding-top: 12px; border-top: 1.5px dashed rgba(255,255,255,.35); }
.pass-fields > span > span { font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; opacity: .7; display: block; }
.pass-fields b { font-weight: 500; font-size: .92rem; }
.pass-for { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: .9rem; }
.faces { display: flex; }
.faces .portrait { width: 32px; height: 32px; border-radius: 50%; border: 2px solid var(--blue); background: #fff; color: var(--blue); display: grid; place-items: center; font: 600 .7rem var(--sans); overflow: hidden; }
.faces .portrait + .portrait { margin-left: -10px; }
.faces .portrait img { width: 100%; height: 100%; object-fit: cover; }
.faces .portrait .sun { font-size: 1rem; margin: 0; }
.pass-for b { font-weight: 600; border-bottom: 2px solid var(--sun); }
.pass-stub { border-left: 2px dashed rgba(255,255,255,.45); display: grid; align-content: space-between; justify-items: center; padding: 18px 10px; text-align: center; }
.pass-stub svg { width: 78px; height: 62px; }
.pass-stub .stub-txt { font-size: .74rem; line-height: 1.3; }
.pass-stub .stub-txt b { display: block; font: 600 1.25rem/1 var(--serif); color: var(--sun); }
.barcode { width: 74px; height: 30px; background: repeating-linear-gradient(90deg, #fff 0 2px, transparent 2px 4px, #fff 4px 5px, transparent 5px 8px, #fff 8px 11px, transparent 11px 13px); opacity: .85; border-radius: 2px; }
.pass .ray { transform-origin: 39px 44px; animation: rays 8s linear infinite; }
@keyframes rays { to { transform: rotate(360deg); } }

/* Sections */
.section { padding: clamp(80px, 10vw, 130px) 0; }
.section.blue { background: var(--blue); color: #fff; }
.section.blue h2, .section.blue h3 { color: #fff; }
.section.tint { background: var(--blue-soft); }
.head { max-width: 760px; margin-bottom: clamp(40px, 5vw, 64px); }
.head p { font-size: 1.15rem; color: var(--ink-2); margin: 20px 0 0; }
.section.blue .head p { color: #e7e8ff; }
.reveal { opacity: 0; transform: translateY(16px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.in { opacity: 1; transform: none; }

/* Plan section */
.plan-wrap { display: grid; grid-template-columns: .95fr 1.05fr; gap: clamp(32px, 5vw, 80px); align-items: center; }
.plan-wrap .doc { --behind: var(--blue-soft); transform: rotate(-1.5deg); }
.points { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; }
.points li { display: grid; grid-template-columns: 44px 1fr; gap: 16px; align-items: start; }
.points .dot { width: 44px; height: 44px; border-radius: 12px; background: var(--sun); display: grid; place-items: center; font-weight: 700; }
.points b { display: block; font-size: 1.12rem; }
.points p { margin: 2px 0 0; color: var(--ink-2); }

/* ===== Week calendar ===== */
.cal-controls { display: flex; flex-wrap: wrap; gap: 16px 28px; align-items: center; justify-content: space-between; margin-bottom: 22px; }
.toggle { display: inline-grid; grid-template-columns: 1fr 1fr; background: #fff; border: 2px solid var(--ink); border-radius: 12px; padding: 4px; }
.toggle button { min-height: 48px; padding: 0 22px; border: 0; border-radius: 8px; background: none; font: 500 1rem var(--sans); color: var(--ink); cursor: pointer; transition: background .3s, color .3s; }
.toggle button[aria-pressed="true"] { background: var(--ink); color: #fff; }
.toggle button[data-mode="with"][aria-pressed="true"] { background: var(--blue); }
.legend { display: flex; flex-wrap: wrap; gap: 8px 16px; list-style: none; margin: 0; padding: 0; font-size: .85rem; color: var(--ink-2); }
.legend li { display: inline-flex; align-items: center; gap: 7px; }
.legend i { width: 12px; height: 12px; border-radius: 3px; background: var(--c); }
.cal { --hr: 52px; border: 1px solid var(--line); border-radius: 18px; background: #fff; overflow: hidden; box-shadow: 0 30px 60px -40px rgba(13,14,43,.35); }
.cal-top { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--line); background: #fafafe; font-size: .88rem; color: var(--ink-2); }
.cal-top .dots { display: inline-flex; gap: 6px; }
.cal-top .dots i { width: 10px; height: 10px; border-radius: 50%; background: #d9dae8; }
.cal-top b { color: var(--ink); font-weight: 600; }
.cal-top .meter { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.cal-top .meter span { display: block; width: 140px; height: 8px; border-radius: 4px; background: #ffe1d8; overflow: hidden; }
.cal-top .meter span i { display: block; height: 100%; width: var(--load, 100%); background: #e8542f; transition: width .8s var(--ease), background .4s; }
.cal.with .cal-top .meter span i { background: var(--blue); }
.cal-tabs { display: none; }
.cal-grid { display: grid; grid-template-columns: 56px repeat(5, 1fr); }
.cal-day-h { padding: 12px 10px; border-left: 1px solid var(--line); border-bottom: 1px solid var(--line); font-weight: 600; font-size: .92rem; display: flex; justify-content: space-between; align-items: baseline; }
.cal-day-h small { font-weight: 500; font-size: .78rem; color: var(--blue); opacity: 0; transition: opacity .4s .5s; }
.cal.with .cal-day-h small { opacity: 1; }
.cal-hours { position: relative; height: calc(var(--hr) * 8); }
.cal-hours span { position: absolute; right: 8px; transform: translateY(-50%); font-size: .7rem; color: var(--muted); }
.cal-col { position: relative; height: calc(var(--hr) * 8); border-left: 1px solid var(--line);
  background: repeating-linear-gradient(to bottom, transparent 0 calc(var(--hr) - 1px), #f0f0f6 calc(var(--hr) - 1px) var(--hr)); }
.cal-col .lunch { position: absolute; left: 0; right: 0; top: calc(var(--hr) * 3); height: var(--hr);
  background: repeating-linear-gradient(135deg, transparent 0 6px, #f4f4f9 6px 8px); }
.slotw { position: absolute; left: 6px; right: 6px; top: calc((var(--s) - 9) * var(--hr) + 2px); height: calc(var(--d) * var(--hr) - 4px); }
.freed { position: absolute; inset: 0; border-radius: 8px; background: var(--sun-soft); border: 1.5px dashed var(--sun-deep); display: grid; align-content: end; justify-items: start; padding: 6px 8px;
  opacity: 0; transition: opacity .5s .3s; overflow: hidden; }
.freed b { font: 600 .9rem/1 var(--serif); color: #8a5a00; }
.freed small { display: block; font-size: .68rem; color: #8a5a00; }
.ev { position: absolute; left: 0; right: 0; top: 0; height: 100%; border-radius: 8px; padding: 6px 8px; overflow: hidden; background: var(--bg); border-left: 3px solid var(--c);
  color: var(--t); font-size: .78rem; line-height: 1.25; transition: height .7s var(--ease), background .5s, color .5s, border-color .5s; transition-delay: calc(var(--i) * 60ms); }
.ev .ev-ico { float: right; width: 15px; height: 15px; opacity: .85; margin-left: 4px; }
.ev b { display: block; font-weight: 600; }
.ev time { display: block; opacity: .8; font-size: .7rem; }
.ev .done { display: none; }
.cal.with .ev { height: 24px; background: var(--blue-soft); border-color: var(--blue); color: var(--blue); }
.cal.with .ev b, .cal.with .ev time, .cal.with .ev .ev-ico { display: none; }
.cal.with .ev .done { display: block; font-weight: 600; white-space: nowrap; }
.cal.with .freed { opacity: 1; }
.c-enq { --c: #e8542f; --bg: #ffece6; --t: #7a2410; }
.c-quote { --c: #7a4fe0; --bg: #f1ecff; --t: #3d1f8f; }
.c-inv { --c: #d1366b; --bg: #ffe8f0; --t: #7d1438; }
.c-rep { --c: #13907a; --bg: #e2f6f1; --t: #0b5245; }
.c-data { --c: #5b6178; --bg: #eef0f5; --t: #2c3045; }
.week-total { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 18px; margin-top: 26px; }
.week-total .big { font: 600 clamp(2.4rem, 4vw, 3.2rem)/1 var(--serif); color: var(--blue); }
.week-total small { color: var(--ink-2); font-size: .9rem; }

/* Competitors */
.fact { display: grid; grid-template-columns: auto 1fr; gap: clamp(24px, 4vw, 60px); align-items: center; }
.fact .huge { font: 600 clamp(6rem, 16vw, 12rem)/.9 var(--serif); color: var(--sun); letter-spacing: -0.04em; }
.fact p { font-size: clamp(1.15rem, 1.8vw, 1.45rem); color: #fff; margin: 0 0 18px; max-width: 620px; }
.fact .source, .source { font-size: .88rem; color: #e1e2ff; margin: 0; }
.source a { color: #fff; }
.fact-2 { margin-top: clamp(40px, 5vw, 64px); padding-top: 32px; border-top: 1px solid rgba(255,255,255,.3); font-size: 1.15rem; color: #eceeff; max-width: 820px; }
.fact-2 b { color: #fff; }
.section.blue .fact-2 .hl { font-weight: 600; }

/* ===== Growth path (services) ===== */
.path { position: relative; display: grid; grid-template-columns: repeat(5, 1fr); gap: 18px; padding-top: 74px; }
.path-road { position: absolute; left: 4%; right: 4%; top: 30px; height: 40px; }
.path-road svg { width: 100%; height: 40px; overflow: visible; }
.path-road .road { stroke: #c9cbe6; stroke-width: 2; stroke-dasharray: 2 8; stroke-linecap: round; fill: none; }
.path-road .road-done { stroke: var(--blue); stroke-width: 3; fill: none; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--p, 0)); }
.path-sun { position: absolute; top: var(--py, -11px); left: calc(var(--p, 0) * 100%); width: 34px; height: 34px; margin-left: -17px; transition: left .2s linear; }
.stage { position: relative; background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 22px 20px 20px; transition: border-color .3s, transform .4s var(--ease); }
.stage:hover { border-color: #b9bbf0; transform: translateY(-4px); }
.stage::before { content: ""; position: absolute; top: -50px; left: 28px; width: 2px; height: 50px; background: repeating-linear-gradient(to bottom, #c9cbe6 0 4px, transparent 4px 8px); }
.stage-ico { width: 54px; height: 54px; border-radius: 16px; display: grid; place-items: center; color: var(--blue); background: var(--blue-soft); margin-bottom: 16px; position: relative; }
.stage-ico svg { width: 28px; height: 28px; }
.stage-ico .n { position: absolute; top: -8px; right: -8px; width: 22px; height: 22px; border-radius: 50%; background: var(--sun); color: var(--ink); font-size: .72rem; font-weight: 700; display: grid; place-items: center; }
.stage h3 { font: 600 1.35rem/1.15 var(--serif); margin-bottom: 6px; }
.stage p { font-size: .9rem; color: var(--ink-2); margin: 0 0 14px; }
.stage ul { list-style: none; margin: 0; padding: 12px 0 0; border-top: 1px solid var(--line); display: grid; gap: 6px; }
.stage li { font-size: .9rem; display: flex; gap: 8px; align-items: baseline; }
.stage li::before { content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--blue); transform: translateY(-1px); }
.also { margin-top: 30px; font-size: 1.1rem; }
.price-line { margin-top: 10px; font-size: 1.1rem; color: var(--ink-2); }

/* Founders */
.founders { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; max-width: 900px; }
.founder { margin: 0; }
.photo { width: 100%; aspect-ratio: 4/5; border-radius: 16px; display: grid; place-items: center; overflow: hidden; color: #fff; font: 600 3rem var(--sans);
  background: repeating-radial-gradient(circle at 50% 115%, transparent 0 22px, rgba(255,255,255,.08) 22px 23px), var(--blue); }
.photo img { width: 100%; height: 100%; object-fit: cover; }
.photo .sun { color: var(--sun); font-size: 4rem; }
.founder .photo { margin-bottom: 14px; }
.founder figcaption b { display: block; font-size: 1.1rem; }
.founder figcaption span { color: var(--ink-2); font-size: .95rem; }
.story { margin: 32px 0 0; max-width: 760px; font: 500 clamp(1.2rem, 2vw, 1.5rem)/1.4 var(--serif); }
.new-line { margin-top: 26px; padding: 18px 22px; border-radius: 12px; background: #fff; font-size: 1.05rem; max-width: 760px; }

/* FAQ */
.faq { max-width: 860px; border-top: 2px solid var(--ink); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 20px; align-items: center; min-height: 64px; padding: 16px 0; font: 500 1.15rem var(--sans); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; flex: none; width: 34px; height: 34px; border-radius: 50%; background: var(--blue-soft); color: var(--blue); display: grid; place-items: center; font-size: 1.4rem; transition: transform .3s var(--ease); }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { margin: 0 0 22px; color: var(--ink-2); max-width: 720px; }

/* Closing */
.closing { background: var(--ink); color: #fff; padding: clamp(80px, 10vw, 130px) 0; }
.closing h2 { color: #fff; }
.closing-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 72px); align-items: center; }
.closing-grid > * { min-width: 0; }
.closing p { color: #d3d4e8; font-size: 1.15rem; margin: 20px 0 0; }
.closing .next-line { color: #d3d4e8; }
.closing .next-line li + li::before { color: var(--sun); }
.closing .pass { --notch: var(--ink); box-shadow: 0 20px 40px -18px rgba(0,0,0,.6); }
.reserve { margin-top: 26px; display: grid; gap: 8px; max-width: 520px; }
.reserve label { font-size: .95rem; color: #fff; }
.reserve-row { display: flex; gap: 10px; flex-wrap: wrap; }
.reserve input { flex: 1 1 220px; min-height: 52px; border-radius: 10px; border: 2px solid rgba(255,255,255,.45); background: rgba(255,255,255,.06); color: #fff; font: 400 1rem var(--sans); padding: 0 16px; }
.reserve input::placeholder { color: #a9abc8; }
.reserve input:focus { outline: none; border-color: var(--sun); }
.scheduler { width: 100%; min-height: 680px; border: 0; border-radius: 14px; background: #fff; }

/* Mobile sticky booking bar */
.sticky-book { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 40; display: none; transform: translateY(140%); transition: transform .4s var(--ease); }
.sticky-book.show { transform: none; }
.sticky-book .btn { width: 100%; box-shadow: 0 10px 30px -8px rgba(13,14,43,.5); }

/* Inner pages */
.page-hero { padding: clamp(48px, 7vw, 96px) 0 clamp(48px, 6vw, 80px); }
.page-hero p { font-size: clamp(1.1rem, 1.5vw, 1.25rem); color: var(--ink-2); max-width: 640px; margin: 24px 0 0; }
.inline-sun { display: inline-block; width: .7em; height: .7em; vertical-align: -.02em; border-radius: 50%; margin-left: .08em;
  background: linear-gradient(var(--blue) 0 44%, transparent 44% 56%, var(--blue) 56%); animation: sunPop 1.2s var(--ease) both .7s; }
@keyframes sunPop { from { transform: translateY(70%) scale(.6); opacity: 0; } }
.mission-q { font: 500 clamp(1.5rem, 3vw, 2.3rem)/1.25 var(--serif); margin: 0; }
.principles { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 2px solid #fff; }
.principles > div { padding: 28px 28px 0 0; }
.principles > div + div { padding-left: 28px; border-left: 1px solid rgba(255,255,255,.3); }
.principles p { color: #e7e8ff; margin: 8px 0 0; }

/* ===== Contact (old underline form + new booking flow) ===== */
.contact-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: clamp(36px, 6vw, 96px); align-items: start; }
.contact-grid > * { min-width: 0; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.field { display: grid; gap: 6px; margin-bottom: 28px; min-width: 0; border: 0; padding: 0; }
.field label, .field legend { font-size: .95rem; font-weight: 500; padding: 0; }
.field legend { margin-bottom: 10px; }
.field .opt { color: var(--muted); font-weight: 400; }
.field input, .field select, .field textarea { width: 100%; min-height: 48px; font: 400 1.05rem var(--sans); color: var(--ink); background: transparent; border: 0; border-bottom: 2px solid var(--ink); border-radius: 0; padding: 10px 0; transition: border-color .2s; }
.field select { appearance: none; -webkit-appearance: none; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 6l5 5 5-5' fill='none' stroke='%230d0e2b' stroke-width='2'/%3E%3C/svg%3E") right 4px center/14px no-repeat; }
.field textarea { min-height: 110px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--blue); }
.field.invalid input { border-color: #c62828; }
.field .error { display: none; font-size: .9rem; color: #c62828; }
.field.invalid .error { display: block; }
.chips { display: flex; flex-wrap: wrap; gap: 10px; position: relative; }
.chips input { position: absolute; left: 0; top: 0; width: 1px; height: 1px; opacity: 0; }
.chips label { display: inline-flex; align-items: center; min-height: 44px; padding: 0 15px; border: 2px solid var(--ink); border-radius: 6px; cursor: pointer; font-weight: 400; font-size: .95rem; transition: background .15s, color .15s, border-color .15s; }
.chips label:hover { border-color: var(--blue); color: var(--blue); }
.chips input:checked + label { background: var(--blue); border-color: var(--blue); color: #fff; }
.chips input:focus-visible + label { outline: 3px solid var(--blue); outline-offset: 2px; }
.form-note { font-size: .88rem; color: var(--muted); margin: 14px 0 0; }
.form-terms { font-size: .92rem; color: var(--ink-2); margin: 4px 0 14px; }
.form-success { display: none; padding: 10px 0; }
.form-wrap.sent form { display: none; }
.form-wrap.sent .form-success { display: block; }
.success-mark { width: 72px; height: 72px; border-radius: 50%; margin-bottom: 22px; background: linear-gradient(var(--blue) 0 44%, transparent 44% 56%, var(--blue) 56%); animation: sunPop 1s var(--ease) both; }
.offer-box { background: var(--blue); color: #e1e2ff; border-radius: 16px; padding: 28px; margin-bottom: 28px;
  background-image: repeating-radial-gradient(circle at 100% 120%, transparent 0 15px, rgba(255,255,255,.07) 15px 16px); }
.offer-box h3 { color: #fff; margin-bottom: 10px; }
.offer-box p { margin: 0; }
.aside-block { border-top: 2px solid var(--ink); padding: 22px 0 30px; }
.aside-block h3 { margin-bottom: 12px; }
.aside-block p { margin: 0; color: var(--ink-2); }
.aside-block a { color: var(--blue); font-weight: 500; }
.steps-n { list-style: none; margin: 0; padding: 0; counter-reset: n; }
.steps-n li { display: grid; grid-template-columns: 36px 1fr; gap: 8px; padding: 7px 0; color: var(--ink-2); }
.steps-n li::before { counter-increment: n; content: "0" counter(n); color: var(--blue); font-weight: 600; }
.steps-n b { display: block; color: var(--ink); }

/* Footer */
.site-footer { border-top: 1px solid var(--line); padding: 56px 0 32px; color: var(--ink-2); }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 32px; }
.footer-grid h4 { margin: 0 0 8px; color: var(--ink); font-weight: 600; font-size: 1rem; }
.footer-grid ul { list-style: none; margin: 0; padding: 0; }
.footer-grid a { display: inline-flex; min-height: 44px; align-items: center; text-decoration: none; }
.footer-grid a:hover { color: var(--blue); }
.footer-bottom { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--line); font-size: .9rem; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; }

.no-js .reveal { opacity: 1; transform: none; }
.no-js .hl { background-size: 100% 100%; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .reveal { opacity: 1; transform: none; }
  .hl { background-size: 100% 100%; }
}

@media (max-width: 1080px) {
  .path { grid-template-columns: repeat(3, 1fr); padding-top: 0; }
  .path-road, .stage::before { display: none; }
}
@media (max-width: 980px) {
  .hero-grid, .plan-wrap, .closing-grid, .contact-grid { grid-template-columns: 1fr; }
  .hero-stack { min-height: 0; }
  .hero-stack .doc { display: none; }
  .hero-stack .pass { position: relative; inset: auto; width: 100%; max-width: 540px; }
  .principles { grid-template-columns: 1fr; }
  .principles > div, .principles > div + div { padding: 24px 0; border-left: 0; border-bottom: 1px solid rgba(255,255,255,.3); }
}
@media (max-width: 760px) {
  body { font-size: 17px; }
  .container { padding: 0 18px; }
  .nav { height: 68px; }
  .menu-toggle { display: block; }
  .nav-links { position: fixed; inset: 68px 0 auto 0; flex-direction: column; align-items: stretch; gap: 0; background: #fff; border-bottom: 2px solid var(--ink); padding: 6px 18px 20px; transform: translateY(-120%); visibility: hidden; transition: transform .35s var(--ease), visibility .35s; z-index: -1; }
  .site-header.open .nav-links { transform: none; visibility: visible; }
  .nav-links a:not(.btn) { display: flex; padding: 10px 0; font-size: 1.15rem; border-bottom: 1px solid var(--line); }
  .nav-links .btn { margin-top: 16px; width: 100%; }
  .site-header.open .menu-toggle span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
  .site-header.open .menu-toggle span:nth-child(2) { opacity: 0; }
  .site-header.open .menu-toggle span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
  .hero-actions .btn { width: 100%; }
  .hero-stack .pass { transform: none; animation: none; }
  .next-line { font-size: .84rem; gap: 6px 8px; }
  .next-line li + li::before { margin-right: 6px; }
  /* pass */
  .pass { grid-template-columns: 1fr 84px; }
  .pass::before, .pass::after { right: 72px; }
  .pass-main { padding: 16px 16px; }
  .pass-route { grid-template-columns: 1fr 70px 1fr; }
  .pass-route svg { width: 70px; }
  .pass-route .val { font-size: 1rem; }
  .pass-fields { grid-template-columns: 1fr 1fr; }
  .pass-stub svg { width: 56px; }
  .barcode { width: 54px; }
  .pass-head .tag { display: none; }
  /* doc */
  .doc-top, .fixes { padding-left: 18px; padding-right: 18px; }
  .doc-sum { margin: 0 18px; }
  .fix { grid-template-columns: 36px 1fr; }
  .fix-val { grid-column: 2; text-align: left; display: flex; gap: 12px; align-items: center; }
  .effort { margin-top: 0; }
  /* calendar: one day at a time */
  .cal-controls { flex-direction: column; align-items: stretch; }
  .toggle { display: grid; width: 100%; position: sticky; top: 76px; z-index: 5; box-shadow: 0 8px 20px -10px rgba(13,14,43,.35); }
  .cal-top .meter span { width: 80px; }
  .cal-tabs { display: grid; grid-template-columns: repeat(5, 1fr); border-bottom: 1px solid var(--line); }
  .cal-tabs button { min-height: 48px; border: 0; background: none; font: 500 .95rem var(--sans); color: var(--ink-2); cursor: pointer; border-bottom: 3px solid transparent; }
  .cal-tabs button[aria-selected="true"] { color: var(--blue); border-bottom-color: var(--blue); }
  .cal-grid { grid-template-columns: 48px 1fr; }
  .cal-day-h { display: none; }
  .cal-col { display: none; }
  .cal-col.active { display: block; }
  .ev { font-size: .85rem; }
  /* path */
  .path { grid-template-columns: 1fr; }
  .founders { gap: 10px; }
  .founder figcaption b { font-size: .95rem; }
  .founder figcaption span { font-size: .82rem; }
  .photo .sun { font-size: 2.6rem; }
  .form-row { grid-template-columns: 1fr; gap: 0; }
  .footer-grid { grid-template-columns: 1fr; }
  .fact { grid-template-columns: 1fr; }
  .sticky-book { display: block; }
  body:has(.sticky-book) { padding-bottom: 84px; }
}

/* Hero headline in two tiers: one big promise, then the detail */
.h1-big { display: block; font-size: clamp(2.7rem, 4.9vw, 4.4rem); line-height: 1; }
@media (min-width: 981px) { .hero .h1-big { white-space: nowrap; } }
.h1-small { display: block; margin-top: 18px; font-size: clamp(1.5rem, 2.6vw, 2.2rem); line-height: 1.2; letter-spacing: -0.015em; max-width: 560px; }
@media (max-width: 760px) {
  .cal { --hr: 64px; }
  .cal-top { flex-wrap: wrap; row-gap: 6px; font-size: .82rem; }
  .cal-top .meter { margin-left: 0; width: 100%; }
  .cal-top .meter span { flex: 1; width: auto; }
}
@media (max-width: 760px) { .cal-corner { display: none; } }

.wordmark { text-transform: none; letter-spacing: -0.03em; }
.path-road .path-sun { width: 34px; height: 34px; overflow: visible; }

.freed { display: flex; align-items: flex-end; justify-content: flex-start; gap: 5px; padding: 5px 8px; }
.freed small { display: inline; font-size: .72rem; }

/* ---- design-check round 5 ---- */
/* Hero collage: the plan peeks out above the pass, never past it */
.hero-stack { min-height: 520px; }
.hero-stack .doc { top: 10px; left: 30px; right: auto; width: 340px; transform: rotate(-4deg); }
.hero-stack .doc .doc-sum { margin-bottom: 26px; }
.hero-stack .pass { width: min(520px, 100%); }
.pass-fields > span > span, .pass-route .lbl { font-size: .7rem; }
.pass-stub .stub-txt b { font-size: 1.6rem; }
/* Headlines: balanced lines, short highlights never split */
h2 { text-wrap: balance; }
.nowrap { white-space: nowrap; }
/* Calendar */
.cal-hours span:last-child { transform: translateY(-110%); }
.cal.with .ev .done { overflow: hidden; text-overflow: ellipsis; }
.week-total { align-items: baseline; }
/* Plan labels readable on phones */
.effort em, .bar-key { font-size: .74rem; }
/* FAQ "+" visible on tinted sections */
.tint .faq summary::after { background: #fff; }
/* Founder photos a little shorter */
.photo { aspect-ratio: 1 / 1; }
/* Growth path: numbers sit on the road; icons become small and inline */
.path { counter-reset: st; }
.stage { counter-increment: st; }
.stage::after { content: counter(st); position: absolute; top: -62px; left: 17px; width: 24px; height: 24px; border-radius: 50%; background: var(--sun); color: var(--ink);
  font: 700 .78rem/24px var(--sans); text-align: center; box-shadow: 0 0 0 4px #fff; }
.stage-ico { width: auto; height: auto; background: none; border-radius: 0; margin: 0 0 10px; display: block; }
.stage-ico svg { width: 26px; height: 26px; }
.stage-ico .n { display: none; }
@media (max-width: 1080px) {
  .path { grid-template-columns: 1fr; gap: 14px; padding: 0 0 0 52px; position: relative; }
  .path::before { content: ""; position: absolute; left: 19px; top: 10px; bottom: 10px; width: 2px; background: repeating-linear-gradient(to bottom, #c9cbe6 0 4px, transparent 4px 9px); }
  .path::after { content: ""; position: absolute; left: 19px; top: 10px; width: 2px; height: calc(var(--p, 0) * (100% - 20px)); background: var(--blue); }
  .stage::before { display: none; }
  .stage::after { top: 22px; left: -45px; z-index: 1; }
  .stage { display: grid; grid-template-columns: auto 1fr; column-gap: 12px; }
  .stage-ico { grid-row: 1 / span 2; margin: 2px 0 0; }
  .stage ul { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .hero-stack .doc { display: none; }
  .nowrap { white-space: normal; }
}

.bar-key { gap: 8px; }
.hero-stack .bar-key { display: none; }
.hero-stack .doc-sum { grid-template-columns: auto 1fr; }

/* ---- Logo v2 (gradient blob) theme ---- */
:root { --grad: linear-gradient(var(--blue), var(--blue)); --grad-deep: linear-gradient(var(--blue), var(--blue)); } /* solid blue (old gradient logo retired) */
.brand-logo { display: inline-flex; align-items: center; min-height: 44px; }
.brand-logo img { height: 50px; width: auto; }
.site-footer .brand-logo img { height: 64px; }
.logo-sm { height: 26px; width: auto; display: block; }
.doc-meta .logo-sm { margin-right: auto; height: 22px; }
.pass-head .logo-sm { margin-right: 6px; }
.pass { background: repeating-radial-gradient(circle at 92% 118%, transparent 0 15px, rgba(255,255,255,.07) 15px 16px), var(--grad-deep); }
.section.blue { background: var(--grad-deep); }
.offer-box { background-color: var(--blue); background-image: repeating-radial-gradient(circle at 100% 120%, transparent 0 15px, rgba(255,255,255,.07) 15px 16px), var(--grad-deep); }
.doc::before { background: var(--grad); }
.photo { background: repeating-radial-gradient(circle at 50% 115%, transparent 0 22px, rgba(255,255,255,.1) 22px 23px), var(--grad); }
.photo .sun { color: #fff; }
.path-road .road-done { stroke: url(#roadGrad); }
@media (max-width: 760px) { .brand-logo img { height: 42px; } }

.photo { background: repeating-radial-gradient(circle at 50% 115%, transparent 0 22px, rgba(255,255,255,.1) 22px 23px), var(--grad-deep); }

/* ---- design-check round 7 ---- */
.doc-brand { margin-right: auto; font-weight: 600; color: var(--blue); letter-spacing: .02em; text-transform: none; font-size: .9rem; }
.pass-head { font-weight: 500; }
.pass-fields > span > span, .pass-route .lbl { opacity: .9; }
.pass-stub .stub-txt b { color: #fff; }
.stub-ring { width: 44px; height: 44px; border-radius: 50%; border: 3px solid var(--sun); }
/* the old split-sun is gone: placeholders and marks are plain rings */
.photo .sun, .faces .portrait .sun { width: .62em; height: .62em; background: none; border: .1em solid currentColor; transform: none; }
.photo .sun { color: rgba(255,255,255,.9); }
.faces .portrait .sun { color: var(--blue); }
.success-mark { background: none; border: 8px solid var(--blue); box-sizing: border-box; }
/* mobile: no reserved height under the hero pass */
@media (max-width: 980px) { .hero-stack { min-height: 0; } }

/* ---- back to the blue sun logo (2026-10-23) ---- */
:root { --grad-deep: linear-gradient(var(--blue), var(--blue)); }
.offer-box { background-color: var(--blue); }
.doc::before { background: repeating-linear-gradient(90deg, var(--blue) 0 70%, var(--sun) 70% 100%); background-size: 100% 6px; }
.path-road .road-done { stroke: var(--blue); }
/* the split sun belongs to this logo again */
.photo .sun { width: .62em; height: .62em; border: 0; background: linear-gradient(currentColor 0 45%, transparent 45% 55%, currentColor 55%); color: var(--sun); }
.faces .portrait .sun { border: 0; background: linear-gradient(currentColor 0 45%, transparent 45% 55%, currentColor 55%); color: var(--blue); }
.stub-ring { border: 0; background: linear-gradient(var(--sun) 0 44%, transparent 44% 56%, var(--sun) 56%); }
.success-mark { border: 0; background: linear-gradient(var(--blue) 0 44%, transparent 44% 56%, var(--blue) 56%); }

/* ---- vector logo from the brand kit (2026-10-23) ---- */
.brand-logo { display: inline-flex; align-items: center; min-height: 44px; }
.brand-logo img { height: 36px; width: auto; }
.site-footer .brand-logo img { height: 40px; }
.logo-sm { height: 20px; width: auto; display: block; }
.doc-meta .logo-sm { margin-right: auto; height: 18px; }
.pass-head .logo-sm { margin-right: 8px; }
@media (max-width: 760px) { .brand-logo img { height: 30px; } }

/* ---- asset kit (2026-10-23) ---- */
.stage-ico { place-items: normal; justify-items: start; }
.stage-ico img { width: 40px; height: 40px; display: block; }
.fix-ico img { width: 22px; height: 22px; display: block; }
.hero-actions { position: relative; }
.link-wrap { position: relative; display: inline-flex; }
.hero-arrow { position: absolute; left: calc(100% + 8px); bottom: 2px; width: 380px; height: auto; pointer-events: none; z-index: 0; }
.chips label img { width: 20px; height: 20px; margin-right: 8px; flex: none; }
.chips input:checked + label img { filter: brightness(0) invert(1); }
@media (max-width: 1180px) { .hero-arrow { display: none; } }

/* 404 page */
.notfound { min-height: 56vh; display: grid; align-content: center; }
.nf-icon { width: 190px; height: auto; margin-bottom: 18px; transform: scaleX(-1) rotate(-8deg); }

/* Growth path, vertical layout: step number centred on the line */
@media (max-width: 1080px) {
  .stage::after { left: -44px; top: 23px; }  /* original size, centred on the line and level with the title */
}
/* The hover lift makes each card its own layer; keep cards (and their step numbers) above the road line */
.path::before, .path::after { z-index: 0; }
.stage { z-index: 1; }

/* Founder bio line (each founder writes their own; hidden until filled) */
.founder figcaption .bio { display: block; margin-top: 6px; font-size: .9rem; line-height: 1.45; }
.founder figcaption .bio:empty { display: none; }

/* Design check 2026-10-24: tiles without photos are shorter, so they read as a brand mark, not an empty photo slot */
.photo:not(:has(img)) { aspect-ratio: 3/2; }
/* "Our tools, powered by Solvia" on its own line */
.powered { margin: 12px 0 0; font-size: 1.05rem; color: var(--ink-2); }
.powered b { color: var(--blue); font-weight: 600; }
/* Next-step line: arrow ends a line instead of starting the wrapped one */
.next-line li + li::before { content: none; }
.next-line li:not(:last-child)::after { content: "\2192"; color: var(--blue); margin-left: 10px; }

/* QA 2026-10-24: visible keyboard focus on form fields, and AA contrast on the sample plan's bar labels */
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
.reserve input:focus-visible { outline: 2px solid var(--sun); outline-offset: 2px; }
.bar-key span { color: var(--ink); }

/* Privacy policy: a plain reading column (h2 is a display size elsewhere) */
.page-hero .legal-date { font-size: .9rem; margin-top: 14px; }
.legal-body { padding: 0 0 clamp(64px, 8vw, 112px); }
/* Legal pages: plain document layout, body font only, like a standard policy page */
.legal-head { padding: clamp(40px, 6vw, 72px) 0 8px; }
.legal-head .prose, .legal-body .prose { max-width: 760px; }
.legal-head h1 { font-family: inherit; font-size: clamp(1.8rem, 3vw, 2.2rem); font-weight: 600; letter-spacing: 0; margin: 0; }
.legal-head .legal-date { font-size: .9rem; color: var(--ink-2); margin: 10px 0 0; padding-bottom: 24px; border-bottom: 1px solid rgba(0,0,0,.12); }
.legal-body { padding-top: 24px; }
.legal-body .prose { font-size: .96rem; line-height: 1.65; }
.legal-body .prose h2 { font-family: inherit; font-size: 1rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; margin: 32px 0 8px; }
.legal-body .prose p { margin: 0 0 12px; }
.legal-body .prose ol { margin: 0 0 12px; padding-left: 1.6em; }
.legal-body .prose li { margin-bottom: 6px; }
.legal-caps { font-size: .9rem; }
.legal-address { margin-top: 8px; }
.prose > * { max-width: 720px; }
.prose h2 { font-size: clamp(1.35rem, 2vw, 1.6rem); margin: 40px 0 10px; }
.prose h2:first-child { margin-top: 0; }
.prose h3 { font-family: inherit; font-size: 1.05rem; font-weight: 600; margin: 22px 0 6px; }
.prose p, .prose li { color: var(--ink-2); line-height: 1.65; }
.prose ul { padding-left: 1.2em; margin: 0 0 12px; }
.prose li { margin: 6px 0; }
.prose b { color: var(--ink); font-weight: 600; }
.prose a { color: var(--blue); }

/* Printing (legal pages saved as PDF): a clean document, logo on top, no site menu or footer */
@media print {
  @page { margin: 18mm 16mm; }
  .site-header { position: static !important; box-shadow: none !important; border: 0 !important; background: none !important; }
  .nav-links, .menu-toggle, .skip, .sticky-book, .site-footer { display: none !important; }
  .legal-head { padding-top: 12px; }
  .legal-body .prose h2 { break-after: avoid; }
  .legal-body .prose p, .legal-body .prose li { break-inside: avoid; }
  .legal-body a { color: inherit; }
}