/* Shared physical phone proportions, preserving each design layout. */
.booking-preview .phone-shell { width: min(90%, 320px); padding: 9px; border: 1px solid #eaf4e9; border-radius: 44px; background: linear-gradient(120deg,#f0f6eb,#9daf9f 45%,#dbe8d8 70%,#f0f6eb); transform: rotate(-3deg); box-shadow: inset 0 0 0 2px #738578, inset 0 0 0 4px #ecf4e7, 25px 40px 65px #020f0b70; transition: transform 1s cubic-bezier(.2,.7,.2,1); }
.phone-screen { position: relative; width: 100%; aspect-ratio: 390 / 844; overflow: hidden; border: 2px solid #08140d; border-radius: 34px; background: #0d190f; }
.booking-preview .phone-screen img { width: 100%; height: 100%; object-fit: cover; object-position: center top; border-radius: 0; }
.phone-screen::after { content: ''; position: absolute; inset: auto 0 0; height: 35px; background: linear-gradient(transparent,#0d190f 45%); pointer-events: none; }
.phone-camera { position: absolute; top: 18px; left: 50%; width: 27%; height: 22px; transform: translateX(-50%); border-radius: 20px; background: #030805; box-shadow: inset 0 0 0 1px #243026; }
.phone-camera::after { content: ''; position: absolute; right: 8px; top: 7px; width: 7px; height: 7px; border-radius: 50%; background: #152b34; box-shadow: inset 0 0 0 2px #0b171b; }
.phone-home-indicator { position: absolute; bottom: 18px; left: 34%; width: 32%; height: 4px; border-radius: 4px; background: #eef4e8; }
.booking-preview .phone-shell::before { top: 105px; height: 42px; background: #b7c9b9; box-shadow: 0 54px #b7c9b9; }
.booking-preview .phone-shell::after { top: 155px; height: 65px; background: #b7c9b9; }

@media (max-width: 760px) { .booking-preview .phone-shell { width: min(86%, 300px); } }
@media (prefers-reduced-motion: reduce) { .booking-preview .phone-shell { transition: none; } }

/* Polish, 28 Oct 2026: removes the generated-looking tells and fixes layout bugs. Layout and brand unchanged. */
html, body { overflow-x: clip; }
h1, h2 { overflow-wrap: break-word; min-width: 0; }
/* One accent colour per page: lime italic stays in the hero; other headings keep the italic in their own colour. */
h2 em, .course-partners h2 em, .founder-copy h2 em, .signup h2 em { color: inherit; }
/* Readable small text, no spaced-out capitals. */
.hero-bottom { font-size: 12px; letter-spacing: 0; }
.ribbon { font-size: 13px; }
/* Content stops growing past 1440px on large monitors; backgrounds still run full width. */
@media (min-width: 1600px) {
  body > header, .hero-content, .ribbon, .section, footer { padding-left: calc((100% - 1440px) / 2); padding-right: calc((100% - 1440px) / 2); }
  .hero-bottom { left: calc((100% - 1440px) / 2); right: calc((100% - 1440px) / 2); }
}

/* Audit fixes, 28 Oct 2026: from the Impeccable and Hallmark audits. Look unchanged. */
:root { --paper-bright: #fbfcf7; --lime-muted: color-mix(in oklab, var(--lime) 55%, var(--paper)); }
/* Headings were squeezed past the point letters keep their shape. */
h1, .homepage h1 { letter-spacing: -0.04em; }
h2, h3, .subpage h1 { letter-spacing: -0.03em; }
/* No thick coloured stripe down one side of the form message. */
.hero-waitlist .form-status { border-left: 0; border-radius: 4px; }
/* Phone frame: keep the soft shadow, drop the hairline border that fights it. */
.booking-preview .phone-shell { border: 0; }
/* Comfortable line length for running text. */
main p { max-width: 65ch; }
/* Tinted whites instead of pure white. */
.waitlist-form input[type=email], .contact-form input, .contact-form textarea, .contact-form select { background: var(--paper-bright); }
.dark, .hero-bottom button, .hero-waitlist .form-status { color: var(--paper); }
.skip { background: var(--paper); }
/* Buttons respond when pressed, and a disabled button changes fill and cursor, not just fades. */
.button:active { transform: translateY(1px); }
.button:disabled { background: var(--lime-muted); cursor: not-allowed; }
.button[aria-busy=true], form[aria-busy=true] .button { cursor: progress; }
/* Footer acknowledgement at a readable line length. */
.acknowledgement { max-width: 65ch; }
