* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 30px; }
body { margin: 0; color: #172b22; background: #f7f7ef; font: 16px/1.6 'Instrument Sans', sans-serif; }
button, input, select, textarea { font: inherit; }
button, a, input, select, summary { -webkit-tap-highlight-color: transparent; }
button, a { touch-action: manipulation; }
button { cursor: pointer; }
a { color: inherit; text-underline-offset: 4px; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible, video:focus-visible { outline: 3px solid #b44e28; outline-offset: 5px; }
img, video { display: block; width: 100%; }
img { height:auto; object-fit: cover; }
figure, p, h1, h2, h3 { margin: 0; }
h1, h2, h3 { font-family: 'Bricolage Grotesque', sans-serif; font-weight: 600; line-height: 1.06; letter-spacing: -.045em; }
h1 { font-size: clamp(52px, 5.6vw, 80px); }
h2 { font-size: clamp(38px, 4vw, 57px); }
h3 { font-size: 25px; letter-spacing: -.025em; }
[hidden] { display: none !important; }
.page { --paper:#f7f7ef; --ink:#172b22; --muted:#526356; --accent:#19573b; --bright:#e9ee91; --line:#d6dbce; background:var(--paper); color:var(--ink); }
.container { width: min(1240px, calc(100% - 96px)); margin-inline:auto; }
.section { padding-block: 102px; }
.lede { max-width:440px; font-size:18px; line-height:1.7; color:var(--muted); margin-top:26px; }
.muted { color:var(--muted); }
.small { font-size:13px; line-height:1.6; }
.section-head { display:flex; justify-content:space-between; align-items:end; gap:48px; margin-bottom:42px; }
.section-head > p { max-width:340px; color:var(--muted); }
.section-head h2 { max-width:650px; }
.actions { display:flex; align-items:center; gap:24px; flex-wrap:wrap; margin-top:30px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:24px; min-height:52px; padding:14px 25px; border:1px solid transparent; border-radius:6px; background:var(--accent); color:white; font-weight:600; font-size:15px; text-decoration:none; transition:transform 180ms ease-out, opacity 180ms ease-out; }
.button:hover { opacity:.9; transform:translateY(-2px); }
.button:active { transform:translateY(0); }
.button.light { background:var(--bright); color:var(--ink); }
.button.outline { border-color:var(--line); background:transparent; color:var(--ink); }
.text-link { display:inline-flex; align-items:center; min-height:44px; gap:8px; font-size:14px; font-weight:600; }
.header { display:flex; align-items:center; justify-content:space-between; min-height:96px; gap:24px; }
.wordmark { font:800 30px/1 'Bricolage Grotesque',sans-serif; text-decoration:none; letter-spacing:-1.8px; }
.wordmark span { display:inline-block; width:8px; height:8px; margin-left:3px; border-radius:50%; background:currentColor; }
.nav-links { display:flex; gap:30px; align-items:center; }
.nav-links a { text-decoration:none; font-size:14px; min-height:44px; display:flex; align-items:center; }
.nav-links a:hover { text-decoration:underline; }
.header .button { min-height:44px; padding:11px 19px; font-size:13px; }
.skip { position:fixed; top:-100px; left:20px; z-index:10; padding:10px; background:white; color:#172b22; }
.skip:focus { top:10px; }
.hero-fine { margin-top:16px; color:var(--muted); font-size:12px; }
.film { position:relative; background:#18241c; border-radius:12px; overflow:hidden; }
.film img { aspect-ratio:9/16; }
.film [data-video] { position:absolute; inset:0; background:transparent; border:0; color:white; width:100%; text-align:left; }
.play-circle { display:flex; align-items:center; justify-content:center; width:55px; height:55px; border-radius:50%; background:#fff; color:#172b22; font-size:17px; box-shadow:0 2px 12px #0002; }
.film .play-circle { position:absolute; left:20px; bottom:24px; }
.film .film-caption { position:absolute; left:86px; right:10px; bottom:29px; font-size:12px; color:#fff; text-shadow:0 1px 5px #000; }
.promise-strip { border-block:1px solid var(--line); }
.promise-strip .container { display:flex; justify-content:space-between; align-items:center; gap:20px; padding-block:22px; font-size:13px; }
.promise-strip b { font-weight:600; }
.promise-strip span { color:var(--muted); }
.work { background:#eceee4; }
.example-layout { display:grid; grid-template-columns:.82fr 1.18fr; gap:60px; align-items:center; }
.example-tabs { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:30px; }
.example-tabs button { background:transparent; border:1px solid #bac5b4; color:var(--ink); padding:9px 16px; min-height:44px; border-radius:30px; font-size:13px; }
.example-tabs button[aria-pressed=true] { background:var(--ink); color:var(--paper); border-color:var(--ink); }
.example-copy h3 { font-size:38px; margin-bottom:18px; }
.example-copy p { max-width:390px; color:var(--muted); }
.example-facts { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:28px; padding-top:22px; border-top:1px solid var(--line); }
.example-facts dt { font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); }
.example-facts dd { margin:5px 0 0; font-size:14px; }
.example-media { display:grid; grid-template-columns:1fr 1fr; gap:22px; align-items:center; }
.example-source { padding:12px; background:#fff; transform:rotate(-3deg); }
.example-source img { aspect-ratio:4/5; }
.example-media figcaption { font-size:12px; margin-top:10px; }
.example-media .film img { aspect-ratio:9/16; }
.example-disclosure { font-size:12px; color:var(--muted); margin-top:28px; }
.process { display:grid; grid-template-columns:.85fr 1.15fr; gap:100px; }
.process-intro p { margin-top:22px; color:var(--muted); max-width:360px; }
.process-list { list-style:none; padding:0; margin:0; }
.process-list li { display:grid; grid-template-columns:50px 1fr; gap:24px; border-top:1px solid var(--line); padding:26px 0; }
.process-list li:first-child { padding-top:0; border-top:0; }
.step-number { font:500 34px/1 'Bricolage Grotesque',sans-serif; color:#748571; }
.process-list h3 { margin-bottom:10px; font-size:25px; }
.process-list p { color:var(--muted); max-width:460px; font-size:15px; }
.pricing { background:#194c36; color:#f6f6e9; --muted:#c4d2be; --line:#54705a; --ink:#f6f6e9; --accent:#e9ee91; --bright:#e9ee91; }
.pricing-layout { display:grid; grid-template-columns:1fr 1fr; gap:100px; align-items:center; }
.pricing h2 { max-width:490px; }
.pricing .lede { margin-top:24px; }
.pricing .price { display:flex; align-items:baseline; gap:12px; margin-top:36px; }
.price strong { font:500 92px/.95 'Bricolage Grotesque',sans-serif; letter-spacing:-.06em; }
.price span { font-size:14px; }
.pricing-note { color:var(--muted); max-width:380px; font-size:12px; margin-top:20px; }
.receipt { background:#fbfbee; color:#172b22; padding:38px; position:relative; --ink:#172b22; --accent:#19573b; --line:#d6dbce; }
.receipt::after { content:''; position:absolute; left:0; right:0; bottom:-8px; height:12px; background:linear-gradient(135deg,#fbfbee 25%,transparent 25%) -8px 0/16px 16px,linear-gradient(225deg,#fbfbee 25%,transparent 25%) -8px 0/16px 16px; }
.receipt-title { display:flex; justify-content:space-between; align-items:center; border-bottom:1px dashed #aeb6a6; padding-bottom:22px; margin-bottom:8px; }
.receipt-title b { font:700 23px/1 'Bricolage Grotesque',sans-serif; letter-spacing:-.04em; }
.receipt-title span { font-size:12px; }
.inclusions { padding:0; list-style:none; margin:0; }
.inclusions li { padding:13px 0; border-bottom:1px solid #dce0d2; display:flex; align-items:baseline; gap:14px; font-size:14px; }
.inclusions li::before { content:'✓'; color:#19573b; font-weight:bold; }
.receipt .button { width:100%; margin-top:24px; }
.receipt .small { color:#586453; margin-top:15px; }
.subscription-link { background:none; border:0; color:inherit; padding:10px 0; min-height:44px; font-size:13px; text-decoration:underline; text-underline-offset:4px; }
.quality { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; border-bottom:1px solid var(--line); }
.quality h2 { max-width:520px; }
.quality-copy { font-size:18px; line-height:1.7; max-width:510px; }
.quality-copy p + p { margin-top:18px; }
.quality-copy .text-link { margin-top:18px; }
.faq-layout { display:grid; grid-template-columns:.8fr 1.2fr; gap:100px; }
.faq-intro p { margin-top:22px; max-width:290px; color:var(--muted); }
.faq details { border-top:1px solid var(--line); }
.faq details:last-child { border-bottom:1px solid var(--line); }
.faq summary { display:flex; align-items:center; justify-content:space-between; gap:30px; cursor:pointer; list-style:none; padding:23px 0; font-weight:500; font-size:16px; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:'+'; font-size:23px; font-weight:400; flex-shrink:0; }
.faq details[open] summary::after { content:'−'; }
.faq details p { padding:0 35px 24px 0; font-size:14px; color:var(--muted); }
.sample { background:#e6eadb; }
.sample-layout { display:grid; grid-template-columns:1fr .9fr; gap:100px; align-items:start; }
.sample h2 { max-width:500px; }
.sample .lede { max-width:410px; }
.sample-benefits { padding:0; list-style:none; margin:28px 0; font-size:14px; }
.sample-benefits li { margin-top:10px; }
.sample-benefits li::before { content:'✓'; margin-right:12px; }
.sample-form { display:grid; gap:19px; }
.sample-form label { font-size:13px; font-weight:600; display:block; margin-bottom:7px; }
.sample-form label span { color:var(--muted); font-weight:400; }
.sample-form input { width:100%; background:#fffef7; border:1px solid #adb6a2; border-radius:5px; min-height:54px; padding:13px 15px; color:#172b22; }
.sample-form input::placeholder { color:#777d71; }
.sample-form .button { width:100%; }
.sample-form .button:disabled { opacity:.65; cursor:wait; transform:none; }
.sample-check { min-height:65px; }
.form-fine { font-size:11px; color:var(--muted); }
.success { background:#fffef7; border:1px solid #adb6a2; border-radius:6px; padding:32px; color:#172b22; }
.success h3 { font-size:28px; margin-block:14px; }
.success p { font-size:14px; }
.success ol { padding-left:20px; font-size:14px; margin-block:22px; }
.success .button { margin-top:22px; }
.success-mark { display:flex; width:44px; height:44px; border-radius:50%; background:#e6eadb; align-items:center; justify-content:center; font-size:24px; }
.footer { padding:50px 0 115px; }
.footer-top { display:flex; justify-content:space-between; align-items:start; gap:30px; padding-bottom:32px; }
.footer-top p { font-size:13px; margin-top:15px; color:var(--muted); }
.footer-links { display:flex; gap:24px; flex-wrap:wrap; align-items:center; font-size:12px; }
.footer-links button { font-size:12px; border:0; background:none; color:inherit; padding:10px 0; text-decoration:underline; text-underline-offset:4px; }
.footer-bottom { border-top:1px solid var(--line); padding-top:22px; display:flex; justify-content:space-between; gap:20px; font-size:11px; color:var(--muted); }
.footer-bottom a { margin-left:20px; }
.marquee { --paper:#f6f3e7; --ink:#173c2d; --muted:#506053; --accent:#173c2d; --bright:#efed81; --line:#c7cdb8; }
.marquee .header { min-height:91px; }
.marquee .wordmark { font-size:34px; }
.marquee .button { border-radius:0; }
.hero-marquee { background:#efed81; overflow:hidden; }
.hero-marquee .hero-title { font-size:clamp(76px,11.5vw,166px); font-weight:800; line-height:.85; letter-spacing:-.07em; padding-block:41px 26px; }
.hero-marquee .hero-title span { display:block; text-align:right; }
.marquee-sub { display:flex; align-items:center; justify-content:space-between; gap:40px; padding-block:10px 35px; }
.marquee-sub p { max-width:520px; font-size:17px; }
.marquee-sub .service-description { max-width:570px; font-size:23px; font-weight:600; line-height:1.4; letter-spacing:-.025em; }
.marquee-sub .service-description span { display:block; margin-top:12px; font-size:15px; font-weight:400; letter-spacing:0; }
.marquee-hero-actions { flex-shrink:0; }
.marquee-hero-actions .hero-fine { font-size:12px; margin-top:12px; }
.marquee-sub .actions { margin:0; flex-shrink:0; }
.marquee-sub > .hero-fine { display:none; }
.marquee-gallery { display:grid; grid-template-columns:1fr 1fr 1fr; gap:14px; padding-bottom:25px; }
.marquee-gallery .film { border-radius:0; }
.marquee-gallery .film img { aspect-ratio:1.65; object-position:center 42%; }
.marquee-gallery figcaption { display:flex; justify-content:space-between; font-size:12px; padding-top:10px; }
.marquee-bottom { display:flex; justify-content:space-between; gap:20px; padding-block:0 23px; font-size:11px; }
.marquee .promise-strip { background:#173c2d; color:#f6f3e7; border:0; }
.marquee .promise-strip span { color:#d1d5bf; }
.marquee .work { background:var(--paper); border-bottom:1px solid var(--line); }
.marquee .work h2 { font-weight:700; }
.marquee .example-tabs button { border-radius:0; border-color:var(--ink); }
.marquee .example-layout { grid-template-columns:.85fr 1.15fr; }
.marquee .example-source { transform:none; padding:0; background:transparent; }
.marquee .example-source img { border:1px solid var(--line); }
.marquee .example-media { gap:24px; }
.marquee .example-media .film { border-radius:0; }
.marquee .example-media figcaption { border-top:1px solid var(--line); padding-top:10px; font-size:11px; font-weight:600; }
.marquee .example-disclosure { max-width:650px; }
.planner { display:grid; grid-template-columns:.8fr 1.2fr; align-items:start; gap:70px; }
.planner-copy p { margin-top:24px; max-width:360px; color:var(--muted); }
.planner-board { border:1px solid var(--ink); }
.planner-heading { padding:20px 24px; background:#173c2d; color:#f6f3e7; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.planner-heading label { font-size:13px; }
.planner-heading select { background:#f6f3e7; color:#173c2d; border:0; padding:8px 30px 8px 12px; min-height:44px; }
.plan-row { display:grid; grid-template-columns:45px 1fr; gap:16px; padding:22px 24px; border-bottom:1px solid var(--line); }
.plan-row > span { font:600 30px/1 'Bricolage Grotesque',sans-serif; color:#697d59; }
.plan-row h3 { font-size:21px; margin-bottom:6px; }
.plan-row p { font-size:13px; color:var(--muted); }
.planner-end { display:flex; justify-content:space-between; gap:20px; align-items:center; background:#e9ebd5; padding:20px 24px; }
.planner-end .button { min-height:44px; padding:10px 18px; font-size:13px; }
.marquee .process { border-top:1px solid var(--line); }
.marquee .pricing { background:#efed81; color:#173c2d; --ink:#173c2d; --muted:#506053; --line:#9aaa6e; }
.marquee .pricing h2 { font-size:clamp(48px,5vw,70px); font-weight:700; }
.marquee .price strong { font-weight:800; font-size:112px; }
.marquee .receipt { background:#173c2d; color:#f6f3e7; --ink:#f6f3e7; --accent:#efed81; }
.marquee .receipt::after { display:none; }
.marquee .receipt .button { color:#173c2d; }
.marquee .receipt .small { color:#d1d5bf; }
.marquee .inclusions li { border-color:#54705a; }
.marquee .inclusions li::before { color:#efed81; }
.marquee .receipt-title { border-color:#54705a; }
.marquee .quality { grid-template-columns:1fr 1fr; }
.marquee .sample { background:#173c2d; color:#f6f3e7; --ink:#f6f3e7; --muted:#ced6c2; --accent:#efed81; }
.marquee .sample .button { color:#173c2d; }
.marquee .sample input { border-radius:0; }
dialog { border:0; border-radius:12px; padding:0; width:min(560px,calc(100% - 32px)); max-height:calc(100dvh - 40px); color:#172b22; background:#f9f9ef; box-shadow:0 30px 100px #0004; }
dialog::backdrop { background:#122018ad; backdrop-filter:blur(4px); }
.dialog-close { position:absolute; right:12px; top:10px; width:40px; height:40px; border:0; background:#eeefe5; border-radius:50%; font-size:25px; line-height:1; color:#172b22; z-index:2; }
dialog h2 { font-size:34px; padding-right:18px; }
dialog p { margin-top:18px; font-size:14px; color:#55634f; }
dialog .button { background:#19573b; color:white; margin-top:22px; }
.video-dialog { width:min(460px,calc(100% - 32px)); background:#172b22; color:white; }
.video-dialog video { max-height:calc(100dvh - 160px); aspect-ratio:9/16; background:#172b22; }
.video-dialog .caption { padding:18px 22px; font-size:12px; }
    
    @media(max-width:1050px) {
.container { width:calc(100% - 64px); }
.process, .pricing-layout, .faq-layout, .sample-layout { gap:50px; }
.example-layout { gap:35px; }
.marquee-sub { gap:25px; }
.marquee-sub .actions { gap:12px; }
.marquee-sub .text-link { display:none; }
.planner { gap:35px; }
    }
    @media(max-width:760px) {
.container { width:calc(100% - 40px); }
.section { padding-block:64px; }
.header, .marquee .header { min-height:80px; gap:8px 12px; flex-wrap:wrap; padding-block:14px 6px; }
.wordmark, .marquee .wordmark { font-size:28px; }
.nav-links { display:flex; order:3; width:100%; justify-content:space-between; gap:8px; }
.nav-links a { font-size:12px; }
.header .button { font-size:12px; padding:11px 14px; }
h1 { font-size:clamp(48px,11vw,68px); }
h2 { font-size:39px; }
.lede { font-size:16px; margin-top:20px; }
.actions { gap:17px; margin-top:24px; }
.button { padding:14px 20px; }
.promise-strip .container { display:grid; grid-template-columns:1fr 1fr; gap:15px; font-size:11px; padding-block:20px; }
.section-head { display:block; margin-bottom:30px; }
.section-head > p { margin-top:20px; font-size:14px; }
.example-layout, .process, .pricing-layout, .quality, .faq-layout, .sample-layout, .marquee .quality, .planner { grid-template-columns:1fr; gap:35px; }
.example-copy h3 { font-size:31px; }
.example-media { gap:18px; max-width:460px; width:100%; margin-inline:auto; }
.example-tabs { margin-bottom:20px; }
.example-tabs button { font-size:12px; padding:9px 14px; }
.film .film-caption { display:none; }
.film .play-circle { left:15px; bottom:15px; width:45px; height:45px; }
.process-list li { grid-template-columns:33px 1fr; gap:20px; padding-block:24px; }
.process-list li:first-child { border-top:1px solid var(--line); padding-top:24px; }
.receipt { padding:27px; }
.price strong { font-size:80px; }
.quality-copy { font-size:18px; }
.faq summary { font-size:15px; }
.faq-layout { gap:28px; }
.footer-top { flex-direction:column; }
.footer-links { gap:18px; }
.footer-bottom { flex-direction:column; gap:8px; }
.footer-bottom a { margin-left:0; margin-right:16px; }
.hero-marquee .hero-title { font-size:clamp(63px,15vw,116px); padding-block:32px 25px; }
.hero-marquee .hero-title span { text-align:left; }
.marquee-sub { display:block; padding-block:0 28px; }
.marquee-sub p { font-size:15px; }
.marquee-sub .service-description { font-size:20px; }
.marquee-sub .service-description span { font-size:14px; }
.marquee-hero-actions .hero-fine { font-size:11px; }
.marquee .example-layout { grid-template-columns:1fr; }
.marquee .example-media { gap:16px; }
.marquee-sub .actions { margin-top:23px; }
.marquee-sub .text-link { display:inline-flex; }
.marquee-gallery { gap:9px; }
.marquee-gallery .film img { aspect-ratio:3/4; }
.marquee-gallery figcaption { font-size:10px; }
.marquee-gallery .play-circle { width:34px; height:34px; font-size:12px; left:10px; bottom:10px; }
.marquee-bottom { display:block; font-size:10px; }
.planner-heading { padding:16px; }
.planner-heading select { max-width:150px; font-size:13px; }
.plan-row { padding:20px 16px; gap:8px; }
.planner-end { padding:17px 16px; }
.planner-end .small { font-size:11px; }
.marquee .pricing h2 { font-size:49px; }
.marquee .price strong { font-size:94px; }
    }
    @media(max-width:370px) {
.container { width:calc(100% - 32px); }
.actions { gap:10px; }
.button { padding-inline:16px; font-size:14px; }
.hero-marquee .hero-title { font-size:60px; }
.planner-end { align-items:start; flex-direction:column; }
    }
    @media(prefers-reduced-motion:reduce) {
html { scroll-behavior:auto; }
*, *::before, *::after { animation:none !important; transition:none !important; }
    }
  
.honey { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.form-error { padding:12px; border:1px solid currentColor; font-size:14px; }
.sample-form[aria-busy="true"] button { opacity:.65; cursor:wait; }
.marquee .success { border-radius:0; }
.marquee .success .outline { color:var(--brand-green); border-color:var(--brand-green); }

.subscription-link { display:inline-flex; align-items:center; }

.hero-title { font-family:var(--display); }
.marquee-sub .service-description h1 { font:inherit; letter-spacing:inherit; line-height:1.4; }
.marquee-sub .service-description > p { margin-top:12px; font-size:15px; font-weight:400; letter-spacing:0; }
.film [data-video] { display:block; }
.marquee-gallery figcaption a { font-weight:600; }
@media(max-width:760px) { .marquee-sub .service-description > p { font-size:14px; } }

.film [data-video] { text-decoration:none; }
.film [data-video]:focus-visible { outline:3px solid var(--brand-yellow); outline-offset:-5px; }
