:root {
  color-scheme: light;
  --paper: #f5f3ec;
  --paper-light: #fbfaf6;
  --paper-deep: #eeece3;
  --ink: #29352f;
  --ink-soft: #65716a;
  --ink-faint: #8b938b;
  --sage: #687b68;
  --sage-dark: #4d6251;
  --sage-pale: #e5e9df;
  --clay: #b87561;
  --clay-pale: #ead8ce;
  --line: #dedfd5;
  --white: #fffefa;
  --shadow: 0 18px 46px rgba(47, 57, 47, .08);
  --serif: "Playfair Display", Georgia, serif;
  --sans: "DM Sans", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); font-size: 15px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
button, a { font: inherit; }
button { color: inherit; }
a { color: inherit; }
button:focus-visible, a:focus-visible { outline: 3px solid #9aaf96; outline-offset: 3px; }
[hidden] { display: none !important; }

.site-shell { min-height: 100vh; overflow: hidden; }
.site-header { height: 76px; padding: 0 clamp(24px, 7vw, 104px); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(99, 115, 98, .13); background: rgba(251, 250, 246, .78); }
.brand { text-decoration: none; display: grid; grid-template-columns: 34px auto; grid-template-rows: auto auto; align-items: center; column-gap: 10px; }
.brand-mark { grid-row: 1 / 3; width: 34px; height: 34px; display: grid; place-items: center; color: var(--sage); }
.brand-mark svg { width: 34px; height: 34px; }
.brand-name, .footer-name { font-family: var(--serif); font-size: 16px; line-height: 1.2; letter-spacing: .01em; }
.brand-caption { color: var(--ink-faint); font-size: 9px; line-height: 1.3; letter-spacing: .09em; text-transform: uppercase; }
.header-note { color: var(--ink-soft); font-size: 11px; letter-spacing: .05em; text-transform: uppercase; display: flex; align-items: center; gap: 9px; }
.status-dot, .meta-dot { width: 6px; height: 6px; background: #8da184; border-radius: 50%; display: inline-block; }
.header-note .status-dot { width: 8px; height: 8px; flex: 0 0 8px; background: #36a765; animation: reader-pulse 1.8s ease-out infinite; }
@keyframes reader-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(54, 167, 101, .5); } 55% { box-shadow: 0 0 0 5px rgba(54, 167, 101, 0); } }

main { min-height: calc(100vh - 148px); }
.screen { display: none; min-height: calc(100vh - 148px); }
.screen.screen-active { display: block; animation: enter .42s ease both; }
@keyframes enter { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }

.welcome-layout { width: min(1120px, calc(100% - 64px)); min-height: 630px; margin: 0 auto; padding: 82px 0 55px; display: grid; grid-template-columns: 1.03fr .97fr; align-items: center; gap: clamp(30px, 7vw, 100px); }
.welcome-copy { max-width: 540px; padding-bottom: 20px; }
.eyebrow { display: flex; align-items: center; gap: 11px; color: var(--sage-dark); font-size: 10px; font-weight: 600; letter-spacing: .16em; line-height: 1.4; text-transform: uppercase; }
.eyebrow-line { width: 23px; height: 1px; background: #a9b3a3; display: inline-block; }
h1, h2, p { margin-top: 0; }
h1 { font-family: var(--serif); font-size: clamp(38px, 4.55vw, 59px); font-weight: 400; letter-spacing: -.035em; line-height: 1.12; margin: 24px 0 20px; }
h1 em, h2 em { color: var(--sage); font-weight: 400; }
.lead { max-width: 490px; margin-bottom: 27px; color: var(--ink-soft); font-size: 16px; line-height: 1.75; }
.benefit-list { list-style: none; padding: 0; margin: 0 0 30px; display: grid; gap: 13px; color: #58635b; font-size: 13px; }
.benefit-list li { display: flex; align-items: center; gap: 11px; }
.check-icon { width: 20px; height: 20px; border-radius: 50%; background: var(--sage-pale); color: var(--sage-dark); display: inline-grid; flex: 0 0 20px; place-items: center; font-size: 11px; }
.button { min-height: 52px; border: 0; border-radius: 7px; padding: 0 25px; display: inline-flex; align-items: center; justify-content: center; gap: 22px; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; transition: transform .18s ease, background .18s ease, box-shadow .18s ease; }
.button:hover:not(:disabled) { transform: translateY(-2px); }
.button-primary { background: var(--sage-dark); color: #fffdf8; box-shadow: 0 7px 18px rgba(67, 89, 70, .14); }
.button-primary:hover { background: #3f5645; box-shadow: 0 10px 21px rgba(67, 89, 70, .2); }
.welcome-button { min-width: 230px; }
.microcopy { margin: 12px 0 0 2px; color: var(--ink-faint); font-size: 11px; }
.welcome-art { position: relative; height: 490px; border-radius: 47% 47% 6px 6px; background: linear-gradient(150deg, #e9e9dc 2%, #e5e8de 50%, #e9e2d7 100%); overflow: hidden; display: grid; place-items: center; }
.welcome-art::before { content: ""; position: absolute; inset: 18px; border: 1px solid rgba(92, 112, 89, .2); border-radius: 47% 47% 4px 4px; }
.art-sun { position: absolute; width: 190px; height: 190px; right: 11%; top: 11%; border-radius: 50%; background: #f4ebd9; opacity: .92; }
.leaf-illustration { position: absolute; width: 90%; height: 94%; bottom: 0; left: 5%; color: #75836f; }
.art-caption { position: absolute; left: 12%; bottom: 13%; display: flex; align-items: flex-start; gap: 12px; color: #526553; font-family: var(--serif); font-size: 16px; line-height: 1.35; }
.caption-rule { width: 25px; height: 1px; margin-top: 9px; background: var(--clay); }
.art-small-label { position: absolute; right: 12%; bottom: 8%; color: #788072; font-size: 9px; letter-spacing: .15em; text-transform: uppercase; writing-mode: vertical-rl; }
.welcome-footnote { width: min(1120px, calc(100% - 64px)); margin: 0 auto 31px; padding-top: 15px; border-top: 1px solid var(--line); color: var(--ink-faint); display: flex; align-items: center; gap: 9px; font-size: 11px; }
.footnote-icon { color: var(--clay); font-size: 14px; }

.quiz-screen { padding: 0 24px 60px; }
.quiz-topline { width: min(760px, 100%); height: 76px; margin: 0 auto; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
.text-button { padding: 8px 0; border: 0; background: transparent; color: var(--ink-soft); font-size: 12px; cursor: pointer; transition: color .16s ease; }
.text-button:hover { color: var(--sage-dark); }
.back-button { justify-self: start; display: inline-flex; align-items: center; gap: 8px; }
.exit-button { justify-self: end; color: var(--ink-faint); font-size: 11px; }
.progress-copy { display: grid; gap: 1px; text-align: center; font-size: 12px; font-weight: 600; }
.progress-phase { color: var(--ink-faint); font-size: 10px; font-weight: 400; }
.progress-track { width: min(760px, 100%); height: 3px; margin: 0 auto 56px; background: #e0e2d9; overflow: hidden; border-radius: 99px; }
.progress-track span { display: block; width: 0; height: 100%; background: var(--sage); border-radius: inherit; transition: width .35s ease; }
.question-card { width: min(730px, 100%); margin: 0 auto; }
.question-kicker { display: flex; align-items: center; gap: 8px; color: var(--clay); font-size: 9px; letter-spacing: .17em; font-weight: 700; }
.kicker-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--clay); }
.question-card h1 { max-width: 670px; margin: 18px 0 10px; font-size: clamp(31px, 4vw, 45px); line-height: 1.18; }
.question-hint { margin-bottom: 25px; color: var(--ink-faint); font-size: 12px; }
.answer-list { display: grid; gap: 10px; }
.answer-option { width: 100%; min-height: 61px; padding: 13px 18px; border: 1px solid #dedfd6; border-radius: 7px; background: rgba(255, 254, 250, .75); color: #465249; display: flex; align-items: center; gap: 13px; text-align: left; font-size: 14px; line-height: 1.45; cursor: pointer; transition: border-color .16s ease, background .16s ease, transform .16s ease, box-shadow .16s ease; }
.answer-option:hover { border-color: #aab6a6; background: var(--white); transform: translateY(-1px); }
.answer-option.is-selected { border-color: var(--sage); background: #edf0e9; box-shadow: inset 0 0 0 1px var(--sage); }
.answer-marker { width: 18px; height: 18px; border: 1px solid #c7cec3; border-radius: 50%; flex: 0 0 18px; display: grid; place-items: center; color: transparent; font-size: 10px; }
.is-selected .answer-marker { border-color: var(--sage-dark); background: var(--sage-dark); color: white; }
.question-bottom { margin-top: 21px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.quiet-note { color: var(--ink-faint); font-size: 10px; }
.quiet-note span { color: var(--clay); margin-right: 6px; }
.next-button { min-width: 150px; min-height: 46px; }
.next-button:disabled { background: #c5cbc0; box-shadow: none; cursor: not-allowed; transform: none; }
.validation-message { min-height: 18px; margin: 6px 0 0; color: #9d5847; font-size: 11px; }
.quiz-footer-note { margin: 56px auto 0; padding-top: 16px; border-top: 1px solid var(--line); width: min(730px, 100%); color: var(--ink-faint); text-align: center; font-size: 10px; }

.interstitial-screen, .analysis-screen { padding: 65px 24px 80px; }
.interstitial-wrap, .analysis-wrap { width: min(620px, 100%); margin: 0 auto; text-align: center; }
.centered { justify-content: center; }
.result-orbit { position: relative; width: 66px; height: 66px; margin: 0 auto 27px; border: 1px solid #c8d0c4; border-radius: 50%; display: grid; place-items: center; }
.result-orbit::before, .result-orbit::after { content: ""; position: absolute; border: 1px solid rgba(104, 123, 104, .4); border-radius: 50%; }
.result-orbit::before { inset: 8px -5px; transform: rotate(35deg); }
.result-orbit::after { inset: 8px -5px; transform: rotate(-35deg); }
.result-orbit span { width: 11px; height: 11px; background: var(--clay); border-radius: 50%; z-index: 1; }
.result-orbit i, .result-orbit b { position: absolute; width: 5px; height: 5px; border-radius: 50%; background: #93a18c; }
.result-orbit i { top: 4px; left: 13px; }.result-orbit b { right: 8px; bottom: 7px; }
.interstitial-wrap h1, .analysis-wrap h1, .result-wrap > h1 { margin: 17px 0 12px; font-size: clamp(34px, 4.2vw, 47px); }
.interstitial-intro, .analysis-wrap > p { max-width: 480px; margin: 0 auto 28px; color: var(--ink-soft); font-size: 14px; line-height: 1.7; }
.insight-card { padding: 22px 25px; border: 1px solid #dedfd5; border-radius: 9px; background: var(--paper-light); display: grid; grid-template-columns: 42px 1fr; gap: 16px; text-align: left; box-shadow: 0 7px 22px rgba(47,57,47,.035); }
.insight-icon { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--sage-pale); color: var(--sage-dark); font-size: 19px; }
.card-overline { display: block; color: var(--clay); font-size: 9px; font-weight: 700; letter-spacing: .16em; }
.insight-card h2 { margin: 7px 0 7px; font-family: var(--serif); font-size: 21px; font-weight: 400; }
.insight-card p { margin: 0; color: var(--ink-soft); font-size: 13px; line-height: 1.7; }
.interstitial-progress { display: flex; align-items: center; justify-content: center; gap: 9px; margin: 23px 0 21px; color: var(--ink-faint); font-size: 10px; }
.mini-step { width: 20px; height: 20px; border: 1px solid #c9d0c4; border-radius: 50%; display: grid; place-items: center; color: var(--sage-dark); font-size: 10px; }
.mini-step.is-complete { border-color: var(--sage); background: var(--sage); color: #fff; }
.mini-progress-line { width: 31px; height: 1px; background: #c9d0c4; }
.interstitial-button { min-width: 250px; }
.centered-link { display: block; margin: 10px auto 0; }
.insight-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 28px 0 13px; text-align: left; }
.insight-tile { min-height: 142px; padding: 17px 18px 16px; border: 1px solid #ded6ca; border-radius: 9px; background: rgba(255, 254, 250, .8); display: flex; flex-direction: column; justify-content: space-between; }
.insight-tile-top { display: flex; align-items: center; gap: 10px; }
.insight-tile .insight-icon { width: 27px; height: 27px; flex: 0 0 27px; font-size: 14px; }
.insight-tile .card-overline { color: #805a56; font-size: 8px; letter-spacing: .13em; }
.insight-tile p { margin: 14px 0 0; color: #3a4039; font-size: 14px; font-weight: 600; line-height: 1.45; }
.midpoint-message { margin: 0 0 22px; color: var(--ink-soft); font-size: 12px; line-height: 1.65; }

.analysis-screen { padding-top: 105px; }
.analysis-flower { margin-bottom: 22px; color: var(--sage); font-size: 38px; animation: rotate 4s linear infinite; }
@keyframes rotate { to { transform: rotate(360deg); } }
.analysis-wrap > p { margin-bottom: 29px; }
.analysis-steps { width: min(400px, 100%); margin: 0 auto; display: grid; gap: 9px; text-align: left; }
.analysis-step { min-height: 45px; padding: 0 14px; border: 1px solid #e0e1d8; border-radius: 7px; display: flex; align-items: center; gap: 11px; color: #a1a69d; font-size: 11px; transition: color .3s ease, background .3s ease, border-color .3s ease; }
.analysis-step.is-active, .analysis-step.is-done { background: var(--paper-light); border-color: #cfd5ca; color: var(--ink-soft); }
.step-mark { width: 15px; height: 15px; border: 1px solid #c9d0c5; border-radius: 50%; }
.is-active .step-mark { border: 4px solid #e3e9df; background: var(--sage); }
.is-done .step-mark { border-color: var(--sage); background: var(--sage); box-shadow: inset 0 0 0 3px var(--paper-light); }
.analysis-loader { width: min(400px, 100%); height: 2px; margin: 20px auto 14px; overflow: hidden; background: #e0e2d9; }
.analysis-loader span { display: block; width: 35%; height: 100%; background: var(--sage); animation: load 1.2s ease-in-out infinite; }
@keyframes load { 0% { transform: translateX(-110%); } 100% { transform: translateX(310%); } }
.analysis-back-button { margin-top: 3px; font-size: 11px; }

.result-screen { padding: 50px 24px 70px; }
.result-wrap { width: min(790px, 100%); margin: 0 auto; text-align: center; }
.result-flower { margin-top: 12px; color: var(--clay); font-size: 21px; }
.result-wrap > h1 { margin-top: 8px; }
.result-lead { width: min(670px, 100%); margin: 0 auto 15px; color: var(--ink-soft); font-size: 14px; line-height: 1.78; }
.result-summary { width: min(650px, 100%); margin: 0 auto 22px; color: var(--ink-faint); font-size: 10px; line-height: 1.6; }
.transformation-list { display: grid; gap: 11px; margin: 25px 0 13px; text-align: left; }
.transformation-row { display: grid; grid-template-columns: 1fr 38px 1fr; align-items: center; gap: 10px; }
.transformation-card { min-height: 91px; padding: 15px 17px; border: 1px solid #ded6ca; border-radius: 9px; background: rgba(255, 254, 250, .78); display: flex; flex-direction: column; justify-content: center; gap: 8px; }
.transformation-card .card-overline { color: #8b6e68; font-size: 8px; letter-spacing: .14em; }
.transformation-card p { margin: 0; color: #59625b; font-size: 13px; line-height: 1.4; }
.transformation-card-new { border-color: #d4dbce; background: #eef0e9; }
.transformation-card-new .card-overline { color: var(--sage-dark); }
.transformation-card-new p { color: #303a32; font-weight: 600; }
.transformation-arrow { width: 31px; height: 31px; margin: auto; border-radius: 50%; background: var(--sage-dark); color: #fff; display: grid; place-items: center; font-size: 15px; }
.result-details { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 25px 0 12px; text-align: left; }
.detail-card { min-height: 180px; padding: 19px 20px; border: 1px solid #dedfd5; border-radius: 8px; background: var(--paper-light); }
.detail-card-featured { background: #edf0e8; border-color: #d6ddd1; }
.detail-icon { width: 28px; height: 28px; margin-bottom: 12px; border-radius: 50%; display: grid; place-items: center; background: rgba(104, 123, 104, .12); color: var(--sage-dark); font-size: 17px; }
.detail-card h2 { margin: 7px 0 6px; font-family: var(--serif); font-size: 19px; font-weight: 400; }
.detail-card p, .detail-card li { color: var(--ink-soft); font-size: 12px; line-height: 1.65; }
.detail-card p { margin: 0; }
.detail-card ul { margin: 8px 0 0; padding-left: 17px; }
.detail-card li + li { margin-top: 4px; }
.result-disclaimer { margin: 13px auto 0; max-width: 650px; color: var(--ink-faint); font-size: 10px; line-height: 1.6; }
.result-actions { display: flex; flex-direction: column; align-items: center; gap: 6px; margin: 22px 0 31px; }
.result-actions .button { min-width: 245px; }
.result-actions .text-button { font-size: 10px; }
.product-card { padding: 30px; border: 1px solid #d9d9ce; border-radius: 10px; background: #e9e8dc; display: grid; grid-template-columns: .78fr 1.22fr; align-items: center; gap: clamp(20px, 5vw, 50px); text-align: left; scroll-margin-top: 26px; }
.product-art { position: relative; min-height: 360px; display: grid; place-items: center; }
.book-cover-image { display: block; width: min(100%, 252px); max-height: 365px; object-fit: contain; box-shadow: 9px 18px 30px rgba(47, 57, 47, .16); }
.book-shadow { position: absolute; width: 170px; height: 232px; top: 26px; left: calc(50% - 75px); background: #c5c2b1; transform: rotate(6deg); border-radius: 3px; box-shadow: 13px 18px 27px rgba(47, 57, 47, .16); }
.book-cover { position: relative; z-index: 1; width: 166px; min-height: 236px; padding: 17px 16px 13px; display: flex; flex-direction: column; align-items: center; text-align: center; color: #414e43; background: linear-gradient(145deg, #f4f0e4, #e6e4d6); border: 1px solid rgba(94, 109, 90, .23); box-shadow: 8px 12px 24px rgba(47,57,47,.12); transform: rotate(-2deg); }
.cover-sprig { color: var(--sage); font-size: 28px; line-height: 1; }
.cover-label { margin-top: 8px; color: #71806d; font-size: 7px; line-height: 1.45; letter-spacing: .12em; text-transform: uppercase; }
.cover-title { margin-top: 27px; font-family: var(--serif); font-size: 24px; line-height: 1.05; }
.cover-subtitle { margin-top: 8px; color: #6d7568; font-size: 8px; line-height: 1.5; letter-spacing: .03em; }
.cover-rule { width: 35px; height: 1px; margin-top: 14px; background: #b87561; }
.cover-edition { margin-top: auto; padding-top: 8px; color: #8c7564; font-size: 7px; letter-spacing: .18em; text-transform: uppercase; }
.product-sticker { position: absolute; z-index: 2; right: 3%; bottom: 11%; padding: 7px 10px; border: 1px solid rgba(104,123,104,.28); border-radius: 99px; background: #f7f4eb; color: var(--sage-dark); font-size: 8px; font-weight: 700; letter-spacing: .15em; transform: rotate(5deg); }
.product-eyebrow { font-size: 9px; }
.product-copy h2 { margin: 14px 0 10px; font-family: var(--serif); font-size: clamp(25px, 3vw, 34px); font-weight: 400; line-height: 1.2; }
.product-description { max-width: 420px; color: var(--ink-soft); font-size: 12px; line-height: 1.7; }
.product-meta { display: grid; gap: 7px; margin: 17px 0 21px; color: #5f6c61; font-size: 10px; }
.product-meta span { display: flex; align-items: center; gap: 8px; }
.product-price { width: fit-content; min-width: min(100%, 330px); margin: 20px 0 14px; padding: 15px 20px 13px; border: 1px solid rgba(98, 113, 96, .2); border-radius: 9px; background: rgba(255, 254, 250, .82); display: flex; flex-direction: column; align-items: center; gap: 10px; }
.discount-badge { padding: 6px 13px; border-radius: 99px; background: var(--sage-dark); color: white; font-size: 9px; font-weight: 700; letter-spacing: .14em; text-align: center; }
.discount-badge strong { color: inherit; font: inherit; }
.product-price-values { display: flex; align-items: baseline; justify-content: center; flex-wrap: wrap; gap: 13px; }
#product-price-value { color: var(--ink); font-family: var(--serif); font-size: 31px; font-weight: 500; line-height: 1.1; }
#product-old-price { color: #85877f; font-family: var(--serif); font-size: 17px; text-decoration-thickness: 1px; }
.product-cta-wrap { padding-top: 17px; border-top: 1px solid rgba(98, 113, 96, .2); }
.button-disabled { min-height: 46px; width: 100%; background: #798775; color: white; cursor: not-allowed; box-shadow: none; opacity: .82; }
.checkout-note { margin: 9px 0 0; color: #778073; font-size: 9px; line-height: 1.5; }
.result-restart-bottom { margin-top: 19px; font-size: 10px; }
.sales-section { margin: 31px 0; padding: clamp(24px, 4vw, 38px); border: 1px solid #dddacf; border-radius: 10px; background: #eeece2; text-align: left; }
.sales-section h2 { max-width: 620px; margin: 17px 0 12px; font-family: var(--serif); font-size: clamp(27px, 3.4vw, 38px); font-weight: 400; line-height: 1.2; letter-spacing: -.02em; }
.sales-section-intro { max-width: 650px; margin: 0 0 24px; color: var(--ink-soft); font-size: 12px; line-height: 1.7; }
.journey-list { display: grid; gap: 0; margin: 11px 0 22px; }
.journey-item { padding: 21px 0; border-top: 1px solid #d6d5ca; }
.journey-label { color: #805a56; font-size: 10px; font-weight: 700; letter-spacing: .15em; }
.journey-item ul { display: grid; gap: 11px; margin: 15px 0 0; padding: 0; list-style: none; }
.journey-item li { position: relative; padding-left: 21px; color: #4e5951; font-size: 13px; line-height: 1.55; }
.journey-item li::before { content: "•"; position: absolute; left: 2px; top: 0; color: var(--clay); font-size: 17px; }
.sales-section > .button { width: min(320px, 100%); }
.sales-contents { background: #f1efe7; }
.book-chapters { margin: 7px 0 23px; border-top: 1px solid #d7d6cc; }
.book-chapter { display: grid; grid-template-columns: 52px 1fr; gap: 13px; padding: 19px 0; border-bottom: 1px solid #d7d6cc; text-align: left; }
.chapter-number { color: #946d61; font-family: var(--serif); font-size: 26px; line-height: 1.15; }
.book-chapter h3 { margin: 2px 0 7px; color: var(--ink); font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.book-chapter p { margin: 0; color: var(--ink-soft); font-size: 11px; line-height: 1.65; }
.author-note { margin: 31px 0; padding: 23px 26px; border: 1px solid #dedfd5; border-radius: 9px; background: var(--paper-light); display: grid; grid-template-columns: 62px 1fr; align-items: center; gap: 18px; text-align: left; }
.author-mark { width: 58px; height: 58px; border: 1px solid #bec8b9; border-radius: 50%; display: grid; place-items: center; color: var(--sage-dark); font-family: var(--serif); font-size: 18px; }
.author-note h2 { margin: 7px 0 5px; font-family: var(--serif); font-size: 22px; font-weight: 400; }
.author-note p { margin: 0; color: var(--ink-soft); font-size: 11px; line-height: 1.65; }

.site-footer { min-height: 120px; padding: 23px clamp(24px, 7vw, 104px); border-top: 1px solid rgba(99, 115, 98, .13); background: #eeece3; display: grid; grid-template-columns: 1fr auto; gap: 7px 24px; align-items: center; }
.footer-brand { display: grid; gap: 2px; color: var(--ink-soft); font-size: 10px; }
.footer-name { color: var(--ink); font-size: 15px; }
.footer-links { display: flex; align-items: center; gap: 19px; color: var(--ink-faint); font-size: 9px; }
.footer-links a { text-decoration: none; }.footer-links a:hover { color: var(--sage-dark); }
.footer-disclaimer { grid-column: 1 / -1; margin: 2px 0 0; color: var(--ink-faint); font-size: 9px; }
.toast { position: fixed; z-index: 20; right: 22px; bottom: 22px; width: min(360px, calc(100% - 36px)); padding: 13px 16px; border: 1px solid #ccd5c8; border-radius: 8px; background: #fbfaf6; box-shadow: var(--shadow); color: var(--ink); font-size: 12px; line-height: 1.55; opacity: 0; pointer-events: none; transform: translateY(8px); transition: opacity .2s ease, transform .2s ease; }
.toast.is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 800px) {
  .site-header { height: 68px; padding-inline: 25px; }
  .header-note { font-size: 9px; letter-spacing: .02em; gap: 6px; }
  main, .screen { min-height: calc(100vh - 136px); }
  .welcome-layout { width: min(620px, calc(100% - 48px)); padding: 59px 0 30px; min-height: 0; grid-template-columns: 1fr; gap: 32px; }
  .welcome-copy { max-width: 600px; }.welcome-copy h1 { max-width: 560px; font-size: clamp(39px, 8vw, 56px); }
  .welcome-art { width: min(480px, 100%); height: 320px; justify-self: center; border-radius: 44% 44% 5px 5px; }
  .leaf-illustration { width: 72%; }.art-sun { width: 130px; height: 130px; }
  .welcome-footnote { width: min(620px, calc(100% - 48px)); }
  .progress-track { margin-bottom: 43px; }
  .product-card { grid-template-columns: .7fr 1.3fr; gap: 20px; padding: 23px; }
  .product-art { min-height: 330px; }.book-cover-image { width: min(100%, 235px); max-height: 325px; }.book-shadow { top: 22px; }
}

@media (max-width: 560px) {
  body { font-size: 14px; }
  .site-header { height: 61px; padding-inline: 18px; }
  .brand-mark, .brand-mark svg { width: 29px; height: 29px; }.brand { grid-template-columns: 29px auto; column-gap: 8px; }.brand-name { font-size: 14px; }.brand-caption { font-size: 8px; }
  main, .screen { min-height: calc(100vh - 121px); }
  .welcome-layout { width: calc(100% - 40px); padding: 47px 0 26px; gap: 28px; }
  .eyebrow { font-size: 9px; letter-spacing: .13em; }
  .welcome-copy h1 { margin-top: 19px; font-size: 39px; line-height: 1.12; }
  .lead { font-size: 14px; line-height: 1.7; }.benefit-list { gap: 11px; font-size: 12px; }
  .welcome-button { width: 100%; min-height: 50px; }.welcome-art { height: 250px; }.art-caption { bottom: 10%; font-size: 13px; }.art-small-label { bottom: 7%; }
  .welcome-footnote { width: calc(100% - 40px); align-items: flex-start; font-size: 10px; }
  .quiz-screen { padding: 0 18px 40px; }.quiz-topline { height: 65px; grid-template-columns: 1fr auto 1fr; }.back-button { font-size: 11px; }.exit-button { font-size: 9px; }.progress-copy { font-size: 11px; }.progress-phase { font-size: 9px; }
  .progress-track { margin-bottom: 37px; }.question-card h1 { margin-top: 16px; font-size: 31px; }.question-hint { margin-bottom: 20px; font-size: 11px; }
  .answer-list { gap: 8px; }.answer-option { min-height: 58px; padding: 12px 13px; gap: 10px; font-size: 12px; }
  .question-bottom { align-items: stretch; flex-direction: column; gap: 12px; margin-top: 16px; }.quiet-note { font-size: 9px; }.next-button { width: 100%; min-height: 47px; }.quiz-footer-note { margin-top: 34px; font-size: 9px; }
  .interstitial-screen, .analysis-screen { padding: 53px 18px 60px; }.result-orbit { margin-bottom: 23px; }.interstitial-wrap h1, .analysis-wrap h1, .result-wrap > h1 { font-size: 34px; }.interstitial-intro, .analysis-wrap > p { font-size: 12px; }.insight-card { padding: 17px 15px; grid-template-columns: 32px 1fr; gap: 12px; }.insight-icon { width: 30px; height: 30px; font-size: 16px; }.insight-card h2 { font-size: 19px; }.insight-card p { font-size: 11px; }.interstitial-progress { gap: 7px; font-size: 9px; }.interstitial-button { width: 100%; min-width: 0; }
  .insight-grid { gap: 8px; margin: 22px 0 12px; }.insight-tile { min-height: 126px; padding: 13px 11px; }.insight-tile-top { align-items: flex-start; gap: 7px; }.insight-tile .insight-icon { width: 24px; height: 24px; flex-basis: 24px; font-size: 12px; }.insight-tile .card-overline { font-size: 7px; line-height: 1.4; }.insight-tile p { margin-top: 10px; font-size: 11px; }.midpoint-message { font-size: 10px; }
  .analysis-screen { padding-top: 78px; }.analysis-step { font-size: 10px; }
  .result-screen { padding: 42px 17px 50px; }.result-wrap > h1 { margin-top: 7px; }.result-lead { font-size: 12px; line-height: 1.7; }.result-details { grid-template-columns: 1fr; margin-top: 20px; gap: 8px; }.detail-card { min-height: auto; padding: 15px; }.detail-icon { margin-bottom: 8px; }.detail-card p, .detail-card li { font-size: 11px; }.result-disclaimer { font-size: 9px; }.result-actions { margin: 17px 0 25px; }.result-actions .button { width: 100%; }
  .transformation-list { gap: 9px; margin: 19px 0 10px; }.transformation-row { grid-template-columns: 1fr; gap: 6px; }.transformation-card { min-height: 76px; padding: 13px 15px; gap: 6px; }.transformation-card p { font-size: 12px; }.transformation-card .card-overline { font-size: 8px; }.transformation-arrow { width: 27px; height: 27px; font-size: 13px; }
  .product-card { padding: 19px 16px; grid-template-columns: 1fr; gap: 13px; }.product-art { min-height: 320px; }.book-cover-image { width: min(76%, 220px); max-height: 315px; }.product-sticker { right: 9%; bottom: 8%; }.product-copy h2 { font-size: 29px; }.product-description { font-size: 11px; }.product-meta { font-size: 9px; }.product-price { width: 100%; margin: 16px 0 12px; padding: 14px 12px 12px; gap: 9px; }.discount-badge { font-size: 8px; }.product-price-values { gap: 9px; }#product-price-value { font-size: 27px; }#product-old-price { font-size: 15px; }.product-cta-wrap { padding-top: 13px; }.button-disabled { min-height: 45px; font-size: 10px; }.checkout-note { font-size: 9px; }
  .sales-section { margin: 23px 0; padding: 20px 16px; }.sales-section h2 { margin: 13px 0 9px; font-size: 27px; }.sales-section-intro { margin-bottom: 17px; font-size: 10px; }.journey-item { padding: 16px 0; }.journey-label { font-size: 8px; }.journey-item ul { gap: 8px; margin-top: 11px; }.journey-item li { font-size: 11px; padding-left: 17px; }.book-chapter { grid-template-columns: 40px 1fr; gap: 9px; padding: 15px 0; }.chapter-number { font-size: 23px; }.book-chapter h3 { font-size: 9px; line-height: 1.5; }.book-chapter p { font-size: 10px; }.author-note { grid-template-columns: 45px 1fr; gap: 12px; padding: 18px 14px; }.author-mark { width: 43px; height: 43px; font-size: 14px; }.author-note h2 { font-size: 19px; }.author-note p { font-size: 10px; }
  .site-footer { padding: 19px 20px; grid-template-columns: 1fr; gap: 10px; }.footer-links { flex-wrap: wrap; gap: 9px 15px; font-size: 9px; }.footer-disclaimer { font-size: 8px; }
  .toast { right: 12px; bottom: 12px; width: calc(100% - 24px); }
}

@media (prefers-reduced-motion: reduce) {
  .header-note .status-dot { animation: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}