:root{--cream:#f6ecd9;--parch:#f8efde;--landing-ink:#2b1f12;--muted:#4e3f2d;--landing-gold:#9a7232;--gold-line:#c9a86a}
html{scroll-behavior:smooth}
body{display:block;padding:10px 32px;background:radial-gradient(ellipse at 95% 0,#fff1cc,#efe6d8 70%)}
body:has(#screen-home.active){padding:0;background:var(--cream)}
.stage{margin:auto}.stage:has(#screen-home.active){max-width:1352px}[hidden]{display:none!important}
.landing{position:relative;isolation:isolate;color:var(--landing-ink);background:var(--cream)}
.landing a{color:inherit;text-decoration:none}.landing a:focus-visible,.landing button:focus-visible,button:focus-visible{outline:3px solid #805012;outline-offset:4px}
.icon-library{position:absolute;overflow:hidden}.home-icon{width:27px;height:27px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;color:var(--landing-gold)}
/* ---------------------------------------------------------------------
   HOMEPAGE — a 1055px design canvas, scaled to the viewport by fitLanding()
   in index.html. Every desktop coordinate below is measured directly from
   the approved design; the artwork itself (parchment, photograph, letter,
   mountains, moon, leaves) is the design's own background with the text
   lifted off, so the live text and controls sit in its exact positions.
   --------------------------------------------------------------------- */
.landing-scale{position:relative;margin:0 auto;overflow:hidden}
.landing-canvas{position:relative;transform-origin:0 0;background:var(--cream)}
/* shared type + controls */
.landing .cta{display:inline-flex;align-items:center;justify-content:center;gap:11px;border:1px solid #8a6527;border-radius:7px;padding:0 20px;background:linear-gradient(180deg,#a37a38,#8e6829);color:#fbf3e2;font-family:'Cormorant Garamond',serif;font-size:17px;font-weight:600;letter-spacing:.01em;line-height:1;text-transform:none;box-shadow:inset 0 1px 0 #d9b872aa,0 4px 12px #5a3d1030;cursor:pointer;white-space:nowrap}
.landing .cta:hover{filter:brightness(1.07);transform:none;background:linear-gradient(180deg,#a37a38,#8e6829)}.landing .cta .arrow{font-size:19px;line-height:1;font-weight:400}
.brand{display:flex;align-items:center;gap:12px;color:#8a6428!important;font-family:'Allura',cursive;font-size:38px;line-height:1;white-space:nowrap}.brand-mark{flex-shrink:0;width:52px;height:56px}
.nav-links{display:flex;align-items:center;gap:31px;font-size:14.3px;font-weight:500;color:#6e5733;line-height:1}
.nav-links a:hover{color:#9a7232}.nav-links .nav-current{color:#9a7232;border-bottom:1px solid #b08a4a;padding-bottom:5px}
.hero-copy h1{margin:0;font-weight:500;color:var(--landing-ink)}
.h1-a{display:block;font-size:66px;line-height:1;letter-spacing:-.015em;white-space:nowrap}
.h1-b{display:block;font-size:36px;line-height:1;font-weight:500;color:#2b1f12}
.script-accent{display:block;font-family:'Pinyon Script',cursive;font-size:98px;line-height:1;color:#2b1f12;white-space:nowrap}
.hero-sub{font-size:20.1px;line-height:24.7px;color:#3d3022;margin:0;white-space:nowrap}
.hero-cta-row{display:flex;align-items:center;gap:14px}
.hero-cta{width:233px;height:46px;font-size:17.5px}.landing .nav-cta{font-size:16px}
.cta-ghost{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:188px;height:45px;font-size:16px;font-weight:500;color:#2b1f12;border:1px solid #c9b48c;border-radius:7px;background:#f8eeda;box-shadow:0 2px 6px #5a3d1014}
.cta-ghost:hover{background:#fbf4e6;border-color:#b08a4a}
.play-circle{display:inline-flex;width:21px;height:21px;color:#2b1f12}.play-circle svg{width:100%;height:100%}.play-circle circle{fill:none;stroke:currentColor;stroke-width:1.4}.play-circle path{fill:currentColor;stroke:none}
.hero-features{display:flex;align-items:center;gap:8px;margin:0;font-size:10.5px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:#8e7140;white-space:nowrap}
.hero-features i{font-style:normal;color:#b08a4a;font-size:12px}.hero-features i.rule{width:22px;height:1px;background:#b9975a}
.hero-form-card{position:relative;width:434px;padding:20px 45px 34px;border:1px solid #e3d2b3;border-radius:12px;background:var(--parch);box-shadow:0 14px 34px #5a3c1426,inset 0 0 0 1px #fffaf0;text-align:left}
.lang-mini{position:absolute;top:12px;right:14px;background:transparent;border:1px solid #dcc8a4;border-radius:999px;padding:4px 10px;font-family:'Cormorant Garamond',serif;font-size:12.5px;font-weight:500;letter-spacing:.02em;color:#8a6f3e;cursor:pointer;line-height:1;text-transform:none}
.lang-mini:hover{background:#f3e6c9}.lang-mini b{color:#4a3a22}
.hero-form-card .lead{font-size:26px;line-height:1.15;font-weight:700;font-style:normal;margin:0 0 8px;color:var(--landing-ink)}
.hero-form-card .sub{font-size:15.5px;line-height:1.3;font-style:normal;color:#5a4a36;margin:0 0 14px;max-width:none}
.hero-form-card .form{margin:0;max-width:none}
.hero-form-card .field{position:relative;margin-bottom:11px}
.hero-form-card .field-label{font-family:'Cormorant Garamond',serif;font-size:14.5px;letter-spacing:0;text-transform:none;font-weight:600;color:#3f3324;margin-bottom:3px;line-height:1.2}
.hero-form-card input[type=text],.hero-form-card input[type=date],.hero-form-card textarea{width:100%;height:38px;border:1px solid #d8c6a3;border-radius:6px;background:#fbf4e6;padding:0 12px;font-family:'Cormorant Garamond',serif;font-size:15.5px;font-weight:500;line-height:36px;color:#3b2e1d;transition:border-color .2s}
.hero-form-card textarea{height:110px;min-height:0;line-height:1.4;padding:10px 12px 22px;resize:none}
.hero-form-card input::placeholder,.hero-form-card textarea::placeholder{color:#b3a487;font-style:normal;opacity:1}
.hero-form-card input:focus,.hero-form-card textarea:focus{border-color:#b08a4a;box-shadow:0 0 0 3px #e9d4a340}
.char-count{position:absolute;right:12px;bottom:8px;font-size:11px;font-weight:600;color:#8b7a5c;line-height:1}
.hero-form-card .actions{justify-content:stretch;margin-top:5px}
.hero-form-card #btn-send{display:inline-flex;align-items:center;justify-content:center;gap:11px;width:100%;height:43px;border:1px solid #8a6527;border-radius:6px;padding:0;background:linear-gradient(180deg,#a37a38,#8e6829);color:#fbf3e2;font-size:17.5px;font-weight:600;letter-spacing:.01em;text-transform:none;box-shadow:inset 0 1px 0 #d9b872aa,0 4px 12px #5a3d1030}
.hero-form-card #btn-send .arrow{font-size:19px;font-weight:400}
.hero-form-card #btn-send:hover:not(:disabled){filter:brightness(1.07);transform:none;background:linear-gradient(180deg,#a37a38,#8e6829)}
.hero-form-card #btn-send:disabled{opacity:.6;cursor:default}
.privacy-note{display:flex;align-items:center;gap:6px;justify-content:center;margin:15px 0 0;font-size:11.5px;font-weight:500;color:#4e3f2d;line-height:1.2}.privacy-note .home-icon{width:11px;height:11px;color:#6e5733;stroke-width:1.8}
.hero-form-card .error{margin-top:12px}
/* how it works */
.how{text-align:center}
.how-eyebrow{display:flex;justify-content:center;align-items:center;gap:12px;margin:0;font-size:13px;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:#9a7a45;line-height:1}
.how-eyebrow i{width:40px;height:1px;background:var(--gold-line)}
.how-heading{font-size:41px;font-weight:700;line-height:1;color:var(--landing-ink);margin:0;letter-spacing:-.02em}
.how-sub{font-size:18.8px;line-height:21px;color:#4a3b2a;max-width:430px;margin:0 auto}
.step{text-align:center}
.step-circle{position:relative;display:block;width:120px;height:120px;margin:0 auto;border:1.5px solid #cfae6e;border-radius:50%;background:#f8f0e1b8;box-shadow:0 0 0 7px #fff9ec73,0 0 22px #c9a86a59}
.step-icon{position:absolute;left:50%;top:50%;width:60px;height:60px;transform:translate(-50%,-50%);fill:none;stroke:#6f5230;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.step-number{position:absolute;left:-14px;top:96px;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:2px solid #fbf3e2;border-radius:50%;background:radial-gradient(circle at 35% 30%,#c79a4a,#8f6525);box-shadow:0 2px 6px #5a3c1440;color:#fff8e8;font-size:16px;font-weight:600;line-height:1}
.step h3{margin:17px 0 6px;font-size:21.5px;font-weight:700;line-height:1.1;color:#1f160c}
.step p{font-size:15.5px;line-height:19px;color:#3f3224;margin:0 auto;max-width:216px}
.step-arrow{width:40px;height:12px;fill:none;stroke:#b48d4a;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
/* desktop: fixed design coordinates on the 1055px canvas */
@media(min-width:861px){
.landing-canvas{width:1055px;height:1491px;background:var(--cream) url('/assets/landing-bg.jpg') 0 0/1055px auto no-repeat}
.site-nav{position:absolute;top:0;left:0;right:0;height:90px;z-index:3}
.brand{position:absolute;left:48px;top:20px}
.nav-links{position:absolute;left:398px;top:39px}
.nav-cta{position:absolute;left:844px;top:19px;width:179px;height:46px;font-size:15.5px}
.hero-scene{display:none}
.hero-copy{position:absolute;left:0;top:0;width:560px;height:530px;z-index:2}
.h1-a{position:absolute;left:95px;top:130px}
.h1-b{position:absolute;left:237px;top:202px}
.script-accent{position:absolute;left:33px;top:232px}
.hero-sub{position:absolute;left:84px;top:336px}
.hero-cta-row{position:absolute;left:85px;top:435px}
.hero-features{position:absolute;left:75px;top:494px}
.hero-form-card{position:absolute;left:63px;top:567px;z-index:2}
.how{position:absolute;left:0;top:0;width:1055px;height:1491px}
.how-eyebrow{position:absolute;left:0;right:0;top:1099px}
.how-heading{position:absolute;left:0;right:0;top:1138px}
.how-sub{position:absolute;left:0;right:0;top:1187px}
.steps{position:absolute;left:0;right:0;top:1238px;height:240px}
.step{position:absolute;top:0;width:290px}
.step:nth-child(1){left:100px}.step:nth-child(3){left:382px}.step:nth-child(5){left:683px}
.step-arrow{position:absolute;top:62px}.step-arrow:nth-child(2){left:356px}.step-arrow:nth-child(4){left:645px}
}
/* phones + small tablets: the same markup as a single column */
@media(max-width:860px){
.landing-canvas{width:100%}
.site-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px}
.brand{font-size:34px;gap:4px}.brand-mark{width:38px;height:42px}
.nav-links{display:none}
.landing .nav-cta{height:40px;font-size:15px;padding:0 14px}
.hero-scene{height:260px;overflow:hidden}.hero-scene-photo{display:block;width:100%;height:100%;object-fit:cover;object-position:center 30%;-webkit-mask-image:linear-gradient(#000 70%,transparent);mask-image:linear-gradient(#000 70%,transparent)}
.hero-copy{padding:4px 20px 0;text-align:center}
.h1-a{font-size:44px;white-space:normal}.h1-b{font-size:24px;margin-top:4px}.script-accent{font-size:66px;white-space:normal;margin-top:-4px}
.hero-sub{max-width:380px;margin:14px auto 0;font-size:18px;line-height:1.35;white-space:normal}.hero-sub br{display:none}
.hero-cta-row{justify-content:center;flex-wrap:wrap;margin-top:22px}
.hero-features{justify-content:center;flex-wrap:wrap;margin:22px auto 0;white-space:normal;row-gap:6px}.hero-features i.rule{display:none}
.hero-form-card{width:auto;max-width:434px;margin:26px auto 0;padding:26px 24px 26px}
.how{padding:44px 16px 36px;background:var(--cream) url('/assets/how-bg.jpg') 50% 100%/1100px auto no-repeat}
.how-heading{font-size:38px;margin:12px 0 10px}.how-sub{font-size:17px;line-height:1.3;max-width:360px}
.steps{display:flex;flex-direction:column;align-items:center;gap:28px;margin-top:30px}
.step{max-width:300px}.step-arrow{display:none}
.landing-canvas{background:var(--cream)}
}
@media(max-width:700px){
.stage:not(:has(#screen-home.active)){padding:12px}.witness-card{min-width:0;flex-basis:100%}.speaker-tabs{flex-wrap:wrap}.speaker-tab{min-width:120px}.chat-bar{flex-wrap:wrap}.chat-input{min-width:0;flex-basis:100%}.send-btn{width:100%}.scroll{padding:44px 25px 86px}.letter-sign{font-size:34px}.bubble{overflow-wrap:anywhere}.scroll .wax{width:50px;height:50px;bottom:20px}
.foundation{padding:12px 22px}.site-footer{padding:12px 22px 20px;flex-direction:column;gap:12px}.site-footer p,.site-footer summary,.site-footer details{font-size:11px}
}
@media(max-width:400px){.site-nav{gap:6px;padding:12px 12px}.brand{font-size:26px;gap:2px}.brand-mark{width:30px;height:34px}.landing .nav-cta{font-size:13px;padding:0 10px;gap:0}.nav-cta .arrow{display:none}.h1-a{font-size:38px}.script-accent{font-size:58px}.hero-cta,.cta-ghost{width:100%}}
/* example letter (opened from "View an Example" / "Example") */
.example-dialog{border:0;padding:0;background:transparent;width:100%;max-width:min(560px,94vw);margin:auto;overflow:visible}
.example-dialog::backdrop{background:#1e140acc}
.example-close{position:absolute;right:4px;top:0;z-index:2;width:36px;height:36px;padding:0;border:0;border-radius:50%;background:#2b1f12d9;color:#fff;font-family:'Cormorant Garamond',serif;font-size:26px;line-height:1;letter-spacing:0;text-transform:none;cursor:pointer}
.example-close:hover{background:#9a7232}
.example-parchment{position:relative;background:url('/assets/parchment-reference.webp') center/100% 100% no-repeat;padding:54px 56px 64px;color:var(--landing-ink);filter:drop-shadow(0 10px 20px #00000055)}
.example-date{text-align:right;font-size:14px;font-style:italic;color:#5a4a36;margin:0 0 4px}
.example-title{font-family:'Pinyon Script',cursive;font-size:46px;font-weight:400;line-height:1.1;text-align:center;color:var(--landing-ink);margin:0}
.example-ref{text-align:center;font-size:11px;font-weight:600;letter-spacing:.25em;text-transform:uppercase;color:#6e5733;margin:4px 0 8px}
.example-parchment blockquote{font-size:16px;font-style:italic;line-height:1.3;text-align:center;color:#4a3b2a;max-width:380px;margin:0 auto 16px}
.example-copy p{font-size:17px;line-height:1.35;margin:0 0 10px}
.example-copy p:nth-last-child(-n+2){padding-right:140px}
.example-sign{font-family:'Pinyon Script',cursive;font-size:34px;line-height:1.1;text-align:right;color:var(--landing-ink);margin:4px 150px 0 0}
.example-sign span{display:block;font-family:'Cormorant Garamond',serif;font-size:16px;margin-bottom:4px}
.example-feather{position:absolute;left:56px;bottom:58px;width:58px;height:74px;opacity:.9}
.example-note{font-size:12px;letter-spacing:.02em;color:#f1e6d2;text-align:center;margin:10px 0 0}
@media(max-width:700px){.example-parchment{background-image:url('/assets/parchment-mobile.webp');padding:40px 26px 52px}.example-copy p{font-size:16px}.example-feather{left:26px;bottom:40px;width:46px;height:60px}}
/* shared with the other screens */
.foundation{position:relative;padding:8px 30px;text-align:center}.foundation summary{font-size:13px;color:#815c29;cursor:pointer}.foundation p{font-size:17px;line-height:1.5;max-width:780px;margin:16px auto;color:var(--muted)}
.site-footer{position:relative;padding:12px 30px 18px;display:flex;gap:24px;justify-content:space-between;align-items:start}.site-footer p,.site-footer summary,.site-footer details{font-family:Inter,sans-serif;font-size:10px;line-height:1.7;color:#6b604f;margin:0}.site-footer details{max-width:550px}.site-footer summary{cursor:pointer;color:#815c29}
.back-home{background:transparent;color:#795b2c;text-transform:none;letter-spacing:0;font-size:17px;padding:12px 0;margin-bottom:20px}.back-home:hover{background:transparent!important;transform:none!important}
.flow-disclosure{font-family:Inter,sans-serif;font-size:11px;line-height:1.7;color:#6d604e;margin:18px auto 0;max-width:480px}.skip-reveal{background:transparent;color:#795b2c;text-transform:none;letter-spacing:0;font-size:16px;padding:12px;margin:10px auto;display:block}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
.language-choice{border:0;padding:0;margin:0 0 30px;text-align:left}.language-choice legend{color:#795b2c;font-size:15px;letter-spacing:.03em;margin-bottom:12px}.language-options{display:flex;gap:10px}.language-options label{flex:1;position:relative;cursor:pointer}.language-options input{position:absolute;opacity:0;width:1px;height:1px}.language-options span{display:block;text-align:center;padding:12px 20px;border:1px solid #dac8a6;border-radius:999px;color:#795b2c;font-size:19px;background:#fffcf6}.language-options input:checked+span{background:linear-gradient(120deg,#c99742,#a76e21);color:#fffaf0;border-color:#ad792d;box-shadow:inset 0 1px 3px #fff9}.language-options input:focus-visible+span{outline:3px solid #795b2c;outline-offset:4px}#language-hint{font-family:Inter,sans-serif;font-size:11px;line-height:1.6;margin:12px 0 0;color:#6d604e}.scripture-attribution{font-family:Inter,sans-serif;font-size:10px;line-height:1.6;color:#766447;text-align:center;margin-top:12px}.scripture-attribution a{color:inherit}#speech-status:empty{display:none}
