/* landing — homepage cascade, concatenated in load order.
   Later blocks override earlier Figma passes. Do not reorder. */

/* ==== landing-base.css ==== */

:root{--ink:#022c22;--emerald:#064e3b;--emerald-950:#022c22;--green:#047857;--brick:#b84a21;--hero-brick:#f07f54;--lime:#bef264;--lime-200:rgba(198,252,130,.12);--paper:#f3efe5;--black:#0a0a0a;--site-max:1400px;--serif:var(--font-instrument-serif), Georgia, serif;--sans:var(--font-inter), Arial, sans-serif}
body.landing,body.story-archive{box-sizing:border-box}html:has(body.landing),html:has(body.story-archive){scroll-behavior:smooth}body.landing,body.story-archive{margin:0;color:var(--black);background:var(--paper);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}body.landing a,body.story-archive a{color:inherit;text-decoration:none}body.landing img,body.story-archive img{display:block;max-width:100%}body.landing h1,body.landing h2,body.landing h3,body.landing p,body.landing ul,body.story-archive h1,body.story-archive h2,body.story-archive h3,body.story-archive p,body.story-archive ul{margin-top:0}body.landing main>section,body.landing .site-footer,body.landing .site-nav,body.landing .hero,body.story-archive main>section,body.story-archive .site-footer,body.story-archive .site-nav,body.story-archive .hero{width:min(100%,var(--site-max));margin-inline:auto}.hero-shell{width:100%;background:radial-gradient(56.82% 39.06% at 50% 0%,var(--lime-200) 0%,rgba(0,97,68,0) 100%),var(--emerald-950)}.eyebrow{margin:0;color:var(--brick);font-size:12px;font-weight:600;line-height:1;letter-spacing:.04em;text-transform:uppercase}.site-nav{height:68px;padding:16px 52px;display:flex;align-items:center;justify-content:space-between;color:#fff;background:transparent}.nav-logo img{width:123px;height:32px;object-fit:contain;object-position:left}.nav-links{display:flex;align-items:center;gap:40px;font-size:14px;font-weight:500}.nav-cta{height:36px;padding:0 24px;display:inline-flex;align-items:center;border-radius:52px;background:rgba(255,255,255,.1)}
.hero{height:auto;padding:40px 52px 0;position:relative;color:#fff;background:transparent}.hero::before,.hero::after{display:none}.hero-copy{width:686px;margin:0 auto;display:flex;flex-direction:column;align-items:center;text-align:center}.hero-eyebrow{color:var(--hero-brick)}.hero h1{margin:18px 0 16px;font-family:var(--serif);font-size:72px;font-weight:400;line-height:.92;letter-spacing:-.02em}.hero-copy>p:not(.eyebrow){width:570px;margin-bottom:24px;font-size:14px;line-height:1.65;color:rgba(255,255,255,.7)}.hero-actions{display:flex;gap:16px}.button{height:48px;padding:0 28px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;font-size:14px;font-weight:500}.button-lime{color:#111;background:linear-gradient(#cbf580,#bef264)}.button-ghost{background:rgba(255,255,255,.1)}.hero-flow{height:520px;margin-top:40px}.hero-pin{height:100%;overflow:hidden;display:flex;align-items:center}.hero-gallery{width:max-content;display:flex;align-items:center;gap:24px;padding-right:24px;white-space:nowrap}.hero-memory{height:393px;margin:0;border-radius:24px;overflow:hidden;flex:none;white-space:normal;transform-origin:center;will-change:transform}.hero-story-journey{width:220px}.hero-photo-album{width:570px}.hero-story-tin{width:340px}.hero-photo-family{width:280px}.hero-photo img{width:100%;height:100%;object-fit:cover;pointer-events:none}.hero-story{padding:28px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--ink);text-align:center;background:#f5f5f5}.hero-story img{width:150px;height:150px;object-fit:contain;pointer-events:none}.hero-story h2{margin:12px 0 0;font-family:var(--serif);font-size:36px;font-weight:400;line-height:1}.hero-story>p:last-child{margin:12px 0 0;color:var(--emerald);font-size:12px;line-height:1.55}.hero-story-journey img{width:120px;height:120px}.hero-story-journey h2{font-size:31px}.hero-story-tin{padding:24px}.hero-story-tin img{width:130px;height:130px}.hero-story-tin h2{font-size:34px}.hero-flow.is-enhanced .hero-gallery{cursor:grab;touch-action:pan-y;user-select:none}.hero-flow.is-enhanced .hero-gallery.is-dragging{cursor:grabbing}
.how{min-height:2740px;padding:72px 104px 152px;display:flex;flex-direction:column;align-items:center;gap:52px;position:relative;isolation:isolate;background:transparent}.how::before{content:"";position:absolute;z-index:-1;inset-block:0;left:50%;width:100vw;transform:translateX(-50%);background:linear-gradient(180deg,var(--emerald-950) 0,var(--emerald-950) 260px,#214c3e 420px,#5f7d70 570px,#aab7ad 730px,#d9dbd0 870px,var(--paper) 1030px,var(--paper) 100%)}.section-intro{display:flex;flex-direction:column;align-items:center;text-align:center}.section-intro h2{margin:8px 0 12px;font-family:var(--serif);font-size:72px;font-weight:400;line-height:1}.section-intro>p:last-of-type{margin:0;color:var(--emerald);font-size:16px;line-height:1.65}.how-intro{width:100%;position:relative;color:#fff}.how-intro .eyebrow{color:rgba(255,255,255,.5)}.how-intro h2{margin:8px 0 12px;font-size:68px}.how-intro>p:last-of-type{width:515px;color:rgba(255,255,255,.8);line-height:1.7}.how-scribble{width:163px;height:63px;position:absolute;top:29px;left:calc(50% - 114px);z-index:-1}.how-list{width:1192px}.how-stack-stage{width:100%;position:relative}.how-card{width:1192px;height:534px;padding:12px;display:grid;grid-template-columns:578px 578px;gap:12px;border-radius:24px;background:#fff;transform-origin:50% 50%;will-change:transform,opacity,filter}.how-card+.how-card{margin-top:32px}.how-copy{padding:40px;display:flex;flex-direction:column;justify-content:space-between}.step{display:block;color:#65a30d;font-size:20px;font-weight:500;line-height:1.2}.how-text{margin:0}.how-text h3{width:454px;max-width:100%;margin:0 0 12px;font-family:var(--serif);font-size:56px;font-weight:400;line-height:1}.how-card:first-child .how-text h3{width:407px}.how-text p{max-width:100%;margin:0;color:#404040;font-size:14px;line-height:1.65}.checks{padding:0;margin:0;display:flex;flex-direction:column;gap:12px;list-style:none;color:#064e3b;font-size:14px}.checks li{min-height:20px;display:flex;align-items:center;gap:8px}.checks li::before{display:none}.checks li>img{width:20px;height:20px;flex:none}.how-media,.places-media{display:grid;place-items:center;border-radius:12px;background:var(--paper)}.how-media>img{width:124px;height:124px;opacity:.1}.places-media img{width:72px;opacity:.1}.formats{margin:0}.formats>span{display:block;margin-bottom:12px;color:#0a0a0a;font-size:12px;font-weight:500;line-height:1;text-transform:uppercase;opacity:.4}.formats>div{display:flex;gap:8px}.formats b{padding:6px 12px;display:inline-flex;align-items:center;gap:6px;border-radius:555px;color:#064e3b;background:rgba(4,120,87,.08);font-size:14px;font-weight:400;line-height:1.65}.formats b img{width:20px;height:20px;object-fit:contain}.how-stack-stage.is-enhanced{height:calc(300vh + 534px)}.how-stack-stage.is-enhanced .how-card{position:absolute;top:calc(50vh - 267px);left:0;margin:0}.how-stack-stage.is-enhanced .how-card:nth-child(1){z-index:1}.how-stack-stage.is-enhanced .how-card:nth-child(2){z-index:2}.how-stack-stage.is-enhanced .how-card:nth-child(3){z-index:3}
@supports(color:color(display-p3 1 1 1)){.hero-shell{background:radial-gradient(56.82% 39.06% at 50% 0%,color(display-p3 .851 .9765 .6157/.12) 0%,color(display-p3 .0235 .3725 .2745/0) 100%),color(display-p3 .0078 .1725 .1333)}}
.how-stack-stage.is-enhanced{height:534px;min-height:0;overflow:visible;perspective:250vw}
.how-stack-stage.is-enhanced .how-card{top:0}
.how-card{will-change:transform,opacity}
.how:has(.how-stack-stage.is-enhanced){min-height:0}
.places{height:520px;padding:0 104px;display:grid;grid-template-columns:466px minmax(0,602px);gap:124px;align-items:stretch}.places-copy{height:520px;display:flex;flex-direction:column;justify-content:space-between}.places-intro{width:100%;display:flex;flex-direction:column;gap:16px}.places-copy h2{width:430px;margin:0;color:var(--ink);font-family:var(--serif);font-size:72px;font-weight:400;line-height:1}.places-intro>p{width:417px;margin:0;color:#404040;font-size:14px;line-height:1.65}.place-options{width:100%;display:flex;flex-direction:column;gap:32px}.place-option{width:100%;min-height:16px;padding:0 0 0 24px;position:relative;display:flex;align-items:flex-start;border:0;background:none;color:var(--black);font:inherit;text-align:left;cursor:pointer}.place-option:focus-visible{outline:2px solid var(--green);outline-offset:7px;border-radius:2px}.place-progress{width:1px;height:100%;min-height:16px;position:absolute;left:0;top:0;overflow:hidden;background:rgba(4,120,87,.16)}.place-progress>span{width:100%;height:100%;position:absolute;left:0;top:0;display:block;background:#047857;transform:scaleY(0);transform-origin:top}.place-option-copy{width:100%;display:flex;flex-direction:column;gap:8px}.place-option strong{display:block;color:#0a0a0a;font-size:16px;font-weight:500;line-height:1;letter-spacing:-.02em}.place-option-copy>span{width:333px;max-height:0;overflow:hidden;display:block;color:#404040;font-size:14px;font-weight:400;line-height:1.65;opacity:0;transform:translateY(-3px);transition:max-height .38s ease,opacity .3s ease,transform .38s ease}.place-option.active .place-option-copy>span{max-height:96px;opacity:1;transform:none}.places.is-running .place-option.active .place-progress>span{animation:place-progress var(--place-duration,5.5s) linear forwards}.places-media{height:520px;position:relative;overflow:hidden;border-radius:24px;background:#fff}.places-media>img{display:none}.place-panel{position:absolute;inset:0;padding:34px;opacity:0;transform:translateY(14px) scale(.985);transition:opacity .48s ease,transform .6s cubic-bezier(.2,.7,.2,1)}.place-panel.active{opacity:1;transform:none}.place-panel[hidden]{display:block;visibility:hidden;pointer-events:none}.place-panel-timeline{display:grid;grid-template-columns:128px 1fr;gap:26px;background:#fff}.place-timeline-nav{padding:14px 12px;border-left:1px solid rgba(4,120,87,.18);display:flex;flex-direction:column;align-self:stretch;color:#8c9791;font-size:9px;line-height:1.35}.place-timeline-nav b{margin-bottom:24px;color:var(--ink);font-size:11px;font-weight:600}.place-timeline-nav span{color:var(--brick);font-weight:600}.place-timeline-nav strong{margin:4px 0 22px;color:var(--ink);font-weight:600}.place-timeline-nav em{color:var(--brick);font-style:normal}.place-timeline-nav small{margin-top:4px;font-size:9px}.place-timeline-story{padding-top:14px}.place-timeline-story .eyebrow{margin-bottom:12px;color:var(--brick);font-size:9px}.place-timeline-story h3{margin:0 0 14px;color:var(--black);font-family:var(--serif);font-size:34px;font-weight:400;line-height:1}.place-timeline-story>p:not(.eyebrow){margin:0 0 22px;color:#404040;font-size:11px;line-height:1.65}.place-timeline-story img{width:100%;height:272px;border-radius:16px;object-fit:cover}.place-panel-media{display:grid;grid-template-columns:1.45fr .85fr;grid-template-rows:1fr auto;gap:16px;background:#fff}.place-panel-media figure{margin:0;overflow:hidden;border-radius:18px;background:var(--paper)}.place-panel-media figure img{width:100%;height:100%;object-fit:cover}.place-panel-media figcaption{position:absolute;left:14px;bottom:12px;padding:7px 10px;border-radius:999px;color:var(--ink);background:rgba(255,255,255,.88);font-size:9px;backdrop-filter:blur(8px)}.place-media-feature{grid-row:1/3;position:relative}.place-media-small{position:relative}.place-audio{min-height:84px;padding:14px;display:flex;align-items:center;gap:12px;border-radius:18px;color:#fff;background:var(--emerald)}.place-audio button{width:38px;height:38px;border:0;border-radius:50%;color:var(--ink);background:var(--lime);cursor:pointer}.place-audio div{flex:1}.place-audio span{display:block;font-size:9px;opacity:.78}.place-audio i{height:2px;margin-top:12px;display:block;background:linear-gradient(90deg,var(--lime) 0 42%,rgba(255,255,255,.25) 42%)}.place-panel-thoughts{padding:46px;display:grid;grid-template-columns:1.2fr .8fr;grid-template-rows:1fr auto;gap:18px;background:linear-gradient(145deg,#f7f4ec,#eee8dc)}.place-thought-card{padding:30px;display:flex;flex-direction:column;border-radius:20px;color:#fff;background:var(--emerald)}.place-thought-card .eyebrow{color:var(--lime);font-size:10px}.place-thought-card h3{margin:14px 0 0;font-family:var(--serif);font-size:46px;font-weight:400}.place-thought-card blockquote{margin:auto 0 0;font-family:var(--serif);font-size:26px;font-style:italic;line-height:1.12}.place-thought-card.secondary{color:var(--ink);background:#fff}.place-thought-card.secondary .eyebrow{color:var(--brick)}.place-thought-card.secondary h3{font-size:38px}.place-thought-card.secondary>p:last-child{margin:auto 0 0;color:#404040;font-size:12px;line-height:1.65}.place-topic-pills{grid-column:1/3;display:flex;gap:10px}.place-topic-pills span{padding:8px 12px;border:1px solid rgba(2,44,34,.14);border-radius:999px;color:var(--ink);font-size:10px;background:rgba(255,255,255,.55)}
@keyframes place-progress{to{transform:scaleY(1)}}
.place-option strong{color:rgba(10,10,10,.48);transition:color .32s ease}.place-option.active strong{color:#0a0a0a}
.pricing{height:981px;padding:152px 104px;display:flex;flex-direction:column;align-items:center;gap:40px}.pricing-intro .eyebrow{color:#4d7c0f}.pricing-intro h2{color:var(--ink)}.pricing-intro>p:last-of-type{width:570px}.pricing-grid{width:1192px;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.plan{height:415px;padding:32px;display:flex;flex-direction:column;border:.5px solid rgba(10,10,10,.14);border-radius:24px}.plan.featured{border:1px solid var(--emerald);background:#fff}.plan h3{margin:0;color:var(--ink);font-family:var(--serif);font-size:34px;font-weight:400}.plan-title{display:flex;align-items:center;justify-content:space-between}.plan-title b{padding:5px 8px;border-radius:8px;color:#4d7c0f;background:#ecfccb;font-size:9px;text-transform:uppercase}.price{margin:34px 0 52px;display:flex;align-items:flex-end;color:var(--ink);font-family:var(--serif);font-size:62px;line-height:.75}.price sup{font-size:42px;line-height:.85}.price small{font-size:36px}.price span{margin-left:4px;color:#777;font-family:var(--sans);font-size:11px;line-height:1}.plan .checks{margin:0;color:rgba(10,10,10,.65)}.plan>a{height:48px;margin-top:auto;display:flex;align-items:center;justify-content:center;border-radius:999px;background:#fff;font-size:14px;font-weight:500}.plan.featured>a{color:#fff;background:var(--emerald)}
.faq{height:459px;padding:0 104px;display:grid;grid-template-columns:560px 560px;gap:72px}.faq-intro h2{margin:10px 0 14px;color:var(--ink);font-family:var(--serif);font-size:72px;font-weight:400;line-height:.93}.faq-intro>p:last-child{width:430px;margin:0;color:var(--emerald);font-size:14px;line-height:1.65}.faq-list{border-top:.5px solid rgba(10,10,10,.12)}.faq-list details{padding:20px 0;border-bottom:.5px solid rgba(10,10,10,.12)}.faq-list summary{display:flex;align-items:center;justify-content:space-between;list-style:none;font-size:14px;font-weight:600;cursor:pointer}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary::after{content:"+";color:var(--green);font-size:19px;font-weight:400}.faq-list details[open] summary::after{content:"−"}.faq-list details p{margin:7px 0 0;padding-right:44px;color:rgba(10,10,10,.65);font-size:11px;line-height:1.55}
.final-cta{height:626px;padding:152px 104px}.final-cta .section-intro h2{color:var(--ink)}.final-cta .section-intro>p:last-of-type{width:565px}.button-primary{margin-top:34px;color:#fff;background:var(--emerald)}.site-footer{height:598px;overflow:hidden}.footer-content{height:268px;padding:68px 104px 56px;display:grid;grid-template-columns:570px 570px;gap:52px}.footer-brand{display:flex;flex-direction:column}.footer-brand img{width:138px;height:36px;object-fit:contain;object-position:left}.footer-brand p{margin:8px 0 auto;color:var(--ink);font-size:14px;opacity:.7}.footer-brand small{color:var(--ink);font-size:12px;opacity:.5}.footer-links{display:grid;grid-template-columns:repeat(3,1fr);gap:52px}.footer-links nav{display:flex;flex-direction:column;gap:24px;font-size:14px;font-weight:500}.footer-wordmark{height:330px;margin-top:-15px;color:var(--ink);font-family:var(--serif);font-size:267px;line-height:1;letter-spacing:-.035em;white-space:nowrap;text-align:center}
@media(max-width:1050px){.site-nav{padding-inline:28px}.nav-links>a:not(.nav-cta){display:none}.hero{padding-inline:28px}.hero-copy{width:auto}.hero h1{font-size:60px}.hero-flow{height:480px}.hero-memory{height:360px}.hero-story-journey{width:190px}.hero-photo-album{width:min(62vw,570px)}.hero-story-tin{width:min(44vw,340px)}.hero-photo-family{width:min(38vw,280px)}.how{height:auto;min-height:0;padding:80px 28px}.how-list,.pricing-grid{width:100%}.how-stack-stage{display:flex;flex-direction:column;gap:32px}.how-card{width:100%;height:auto;grid-template-columns:1fr}.how-card+.how-card{margin-top:0}.how-media{height:380px}.places{height:auto;padding:90px 28px;grid-template-columns:1fr;gap:50px}.places-copy{height:auto;gap:58px}.places-intro>p,.places-copy h2{width:min(100%,520px)}.places-media{height:500px}.pricing{height:auto;padding:100px 28px}.pricing-grid{grid-template-columns:1fr}.faq{height:auto;padding:90px 28px;grid-template-columns:1fr}.footer-content{height:auto;padding-inline:28px;grid-template-columns:1fr}.footer-wordmark{font-size:18vw}}
@media(max-width:680px){.site-nav{height:64px;padding:14px 20px}.nav-logo img{width:112px}.hero{padding:48px 20px 0}.hero h1{font-size:48px}.hero-copy>p:not(.eyebrow),.how-intro>p:last-of-type,.pricing-intro>p:last-of-type,.final-cta .section-intro>p:last-of-type{width:auto}.hero-actions{width:100%;flex-direction:column}.hero-flow{height:410px;margin-top:24px}.hero-gallery{gap:14px;padding-right:14px}.hero-memory{height:310px}.hero-story-journey{width:58vw}.hero-photo-album{width:78vw}.hero-story-tin{width:72vw}.hero-photo-family{width:64vw}.section-intro h2,.places-copy h2,.faq-intro h2{font-size:50px}.how{padding:70px 20px}.how-card{padding:8px}.how-copy{min-height:510px;padding:30px 24px}.how-text h3,.how-card:first-child .how-text h3{width:auto;font-size:42px}.formats>div{flex-wrap:wrap}.how-media{height:300px}.places{padding:75px 20px}.place-option-copy>span{width:100%}.places-media{height:440px}.place-panel{padding:20px}.place-panel-timeline{grid-template-columns:92px 1fr;gap:14px}.place-timeline-story h3{font-size:27px}.place-timeline-story img{height:246px}.place-panel-media{grid-template-columns:1fr 1fr;grid-template-rows:1.5fr .8fr}.place-media-feature{grid-column:1/3;grid-row:1}.place-media-small{grid-column:1}.place-audio{grid-column:2}.place-panel-thoughts{padding:24px;grid-template-columns:1fr;grid-template-rows:1.2fr 1fr auto}.place-thought-card.secondary{grid-row:2}.place-topic-pills{grid-column:1;grid-row:3;flex-wrap:wrap}.place-thought-card blockquote{font-size:22px}.pricing{padding:80px 20px}.plan{height:400px}.faq{padding:75px 20px}.final-cta{height:auto;padding:100px 20px}.footer-content{padding:70px 20px;grid-template-columns:1fr}.footer-links{grid-template-columns:repeat(2,1fr);gap:30px}.site-footer{height:auto}.footer-wordmark{height:auto;font-size:19vw}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Hero artwork and values exported from Figma node 399:126. */
.hero-shell{position:relative;overflow:hidden;background:radial-gradient(56.82% 39.06% at 50% 0%,rgba(217,249,157,.12) 0%,rgba(6,95,70,0) 100%),#022c22}
.site-nav{padding-inline:72px}
.hero{padding:40px 72px 80px;isolation:isolate}
.hero-copy,.hero-flow{position:relative;z-index:2}
.hero-copy{width:686px}
.hero-eyebrow{color:#fff;opacity:.4}
.hero h1{margin:12px 0 16px;font-size:68px;line-height:1;letter-spacing:0}
.hero-copy>p:not(.eyebrow){width:533px;margin-bottom:36px;font-size:16px;line-height:1.7;color:rgba(255,255,255,.7)}
.hero-stories{position:relative;display:inline-block;z-index:0}
.hero-stories>img{width:79.276px;height:177.169px;position:absolute;z-index:-1;left:50%;top:50%;max-width:none;transform:translate(-50%,-50%) rotate(92.85deg);pointer-events:none}
.hero-actions .button{height:52px;padding-inline:28px;font-size:16px}
.button-lime{border:.5px solid #fff}
.button-ghost,.nav-cta{background:rgba(255,255,255,.08)}
.hero-flow{height:393px;margin-top:80px}
.hero-flow{width:min(2000px,100vw);max-width:none;margin-left:50%;transform:translateX(-50%)}
.hero-pin{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%)}
.hero-gallery{padding-inline:48px;will-change:transform}
.hero-flow.is-enhanced .hero-gallery{cursor:grab;touch-action:pan-y;user-select:none}.hero-flow.is-enhanced .hero-gallery.is-dragging{cursor:grabbing}
.how-media-gif{overflow:hidden}
.how-media-gif>img{width:100%;height:100%;opacity:1;object-fit:cover}
.hero-story{padding:32px;gap:0;background:#fff}
.hero-story-journey,.hero-story-tin{width:350px}
.hero-photo-family{width:444px}
.hero-story img,.hero-story-journey img,.hero-story-tin img{width:152px;height:152px}
.hero-story h2,.hero-story-journey h2,.hero-story-tin h2{margin-top:8px;font-size:40px;line-height:1.1}
.hero-story>p:last-child{margin-top:12px;font-size:14px;line-height:1.65}
.hero-flow{height:585px;margin-top:32px}
.hero-pin{overflow:visible}
.hero-gallery{height:489px;gap:32px;padding-inline:48px;align-items:stretch}
.hero-memory{height:489px;border-radius:24px}
.hero-story{width:380px;padding:48px;justify-content:flex-start;gap:48px;background:#fff}
.hero-art{width:200px;height:200px;flex:none;overflow:hidden}
.hero-art img,.hero-story .hero-art img{width:100%;height:100%;object-fit:cover}
.hero-art-stamp{position:relative}
.hero-art-stamp img{width:209px;height:209px;position:absolute;left:50%;top:50%;max-width:none;transform:translate(-50%,-50%) rotate(-5.18deg)}
.hero-art-map{width:216.867px}
.hero-art-map img{width:111.11%;height:120.48%;max-width:none;transform:translate(-5.56%,-10.24%)}
.hero-card-copy{width:100%;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;white-space:normal}
.hero-card-copy>div{width:100%;display:flex;flex-direction:column;gap:8px}
.hero-card-copy .eyebrow,.hero-quote .eyebrow{color:#65a30d}
.hero-story h2,.hero-story-journey h2,.hero-story-tin h2{margin:0;font-size:40px;line-height:1.1}
.hero-card-copy>p,.hero-story>p:last-child{margin:0;color:#064e3b;font-size:14px;line-height:1.65}
.hero-story-map{width:454px}
.hero-story-map .hero-card-copy>p{width:284px}
.hero-story-chair{width:380px}
.hero-photo-album,.hero-photo-kitchen{width:733px}
.hero-photo-family{width:612px}
.hero-photo-portrait{width:326px}
.hero-quote{padding:48px;position:relative;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;color:#fff;background:#065f46;white-space:normal}
.hero-quote .eyebrow{color:#bef264;position:relative;z-index:1}
.hero-quote blockquote{margin:0;position:relative;z-index:1;color:#fff;font-family:var(--serif);font-style:italic;font-weight:400}
.hero-quote-courage{width:520px}
.hero-quote-courage .hero-quote-copy{display:flex;flex-direction:column;gap:16px;position:relative;z-index:1}
.hero-quote-courage blockquote{font-size:56px;line-height:1}
.hero-quote-courage .hero-quote-copy>p{width:409px;margin:0;color:rgba(255,255,255,.7);font-size:16px;line-height:1.65}
.hero-quote-mark{width:272.536px;height:224.116px;position:absolute;left:254px;top:-14px;max-width:none}
.hero-quote-love{width:739px}
.hero-quote-love blockquote{font-size:48px;line-height:1.1}
.hero-love-mark{width:332px;height:280px;position:absolute;left:407px;top:-50px;max-width:none}
.hero-pattern{position:absolute;z-index:0;max-width:none;pointer-events:none;user-select:none}
.hero-pattern-left{width:737px;height:197.885px;left:-430px;top:168px;transform:rotate(-165deg);transform-origin:center}
.hero-pattern-right{width:206.052px;height:671.032px;right:-300px;top:-45px;transform:rotate(30deg) scaleY(-1);transform-origin:center}
@media(max-width:1050px){.site-nav{padding-inline:28px}.hero{padding-inline:28px}.hero-pattern-left{left:-500px}.hero-pattern-right{right:-330px}.hero-flow{height:540px;margin-top:48px}}
@media(max-width:680px){.site-nav{padding-inline:20px}.hero{padding:48px 20px 56px}.hero h1{font-size:48px}.hero-copy>p:not(.eyebrow){font-size:14px}.hero-flow{height:390px;margin-top:40px}.hero-gallery{height:330px;gap:20px;padding-inline:20px}.hero-memory{height:330px}.hero-pattern-left{left:-650px;top:120px}.hero-pattern-right{right:-360px;top:-100px}.hero-stories>img{transform:translate(-50%,-50%) rotate(92.85deg) scale(.74)}.hero-story,.hero-story-journey,.hero-story-tin,.hero-story-chair{width:257px;padding:24px;gap:20px}.hero-art,.hero-art-map{width:120px;height:120px}.hero-card-copy{gap:8px}.hero-story h2,.hero-story-journey h2,.hero-story-tin h2{font-size:30px}.hero-card-copy>p{font-size:11px}.hero-story-map{width:306px}.hero-photo-album,.hero-photo-kitchen{width:495px}.hero-photo-family{width:413px}.hero-photo-portrait{width:220px}.hero-quote{padding:30px}.hero-quote-courage{width:351px}.hero-quote-courage blockquote{font-size:38px}.hero-quote-courage .hero-quote-copy>p{width:auto;font-size:12px}.hero-quote-love{width:500px}.hero-quote-love blockquote{font-size:34px}}

/* ==== landing-household.css ==== */

.hero-proofs{margin-top:18px;display:flex;align-items:center;justify-content:center;gap:18px;color:rgba(255,255,255,.62);font-size:11px}.hero-proofs span{display:flex;align-items:center;gap:7px}.hero-proofs span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--lime)}
.how-media-brief{padding:48px;background:linear-gradient(145deg,#f8f5ee,#ece6d9)}.graphic-brief{max-width:410px;color:var(--ink)}.graphic-brief>span{display:block;margin-bottom:20px;color:var(--brick);font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}.graphic-brief strong{display:block;margin-bottom:18px;font-family:var(--serif);font-size:39px;font-weight:400;line-height:1}.graphic-brief p{margin:0 0 22px;color:#4a4a45;font-size:13px;line-height:1.65}.graphic-brief ol{margin:0;padding:0;display:grid;gap:9px;list-style:none;counter-reset:brief}.graphic-brief li{display:flex;align-items:center;gap:10px;color:var(--emerald);font-size:12px;line-height:1.45;counter-increment:brief}.graphic-brief li::before{content:counter(brief,decimal-leading-zero);color:var(--brick);font-size:9px;font-weight:600}
.household{padding:152px 104px 0;display:flex;flex-direction:column;align-items:center}.household .section-intro>p:last-of-type{width:610px}.household-grid{width:1192px;margin-top:48px;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.role-card{min-height:214px;padding:30px;border:.5px solid rgba(10,10,10,.14);border-radius:24px;background:rgba(255,255,255,.45)}.role-card span{display:block;margin-bottom:52px;color:var(--brick);font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}.role-card h3{margin:0 0 10px;color:var(--ink);font-family:var(--serif);font-size:36px;font-weight:400}.role-card p{margin:0;color:#4a4a45;font-size:13px;line-height:1.65}
.pricing{height:auto;min-height:850px}.pricing-grid.household-pricing{grid-template-columns:repeat(3,1fr)}.plan .price.no-cents small{display:none}.plan .price.no-cents{align-items:flex-end}.plan .price.no-cents span{margin-bottom:2px}.plan.viewer-plan .price{font-family:var(--serif)}
@media(max-width:1050px){.household{padding:100px 28px 0}.household-grid{width:100%;grid-template-columns:1fr}.pricing-grid.household-pricing{grid-template-columns:1fr}}
@media(max-width:680px){.hero-proofs{flex-direction:column;gap:8px}.how-media-brief{padding:32px 24px}.graphic-brief strong{font-size:34px}.household{padding:80px 20px 0}.household .section-intro>p:last-of-type{width:auto}.household-grid{margin-top:34px}.role-card span{margin-bottom:36px}}
@media(prefers-reduced-motion:reduce){.hero-proofs{transition:none}}

/* ==== landing-composition.css ==== */

.hero-copy>p:not(.eyebrow){width:650px}

.button-lime{
  border:0;
  background:linear-gradient(180deg,#cbf580 0%,#bef264 100%);
  box-shadow:inset 0 2px 2px rgba(255,255,255,.25)
}

/* Exact closing system and timeline example */
body.timeline-modal-open{overflow:hidden!important}

.faq{
  position:relative!important;
  z-index:2!important;
  margin-bottom:0!important;
  background:#f3efe5!important
}

.final-cta.final-cta-figma{
  width:100vw!important;
  max-width:none!important;
  margin:-1px 0 0 calc(50% - 50vw)!important;
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:
    radial-gradient(110% 86% at 50% 0%,
      rgba(243,239,229,1) 0%,
      rgba(243,239,229,.99) 20%,
      rgba(227,230,220,.94) 40%,
      rgba(159,180,166,.88) 62%,
      rgba(55,98,77,.96) 81%,
      #002e20 100%)!important
}
.final-cta.final-cta-figma::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:-120px -10vw auto!important;
  height:520px!important;
  z-index:0!important;
  pointer-events:none!important;
  background:linear-gradient(180deg,
    #f3efe5 0%,
    rgba(243,239,229,.995) 34%,
    rgba(224,227,217,.84) 68%,
    rgba(170,190,175,0) 100%)!important;
  filter:blur(34px)!important
}
.final-cta-figma .final-cta-stage{position:relative!important;z-index:1!important}

.site-footer.site-footer-figma{
  --footer-inner:min(1192px,calc(100vw - 96px));
  --footer-right:456px;
  height:720px!important;
  min-height:720px!important;
  padding:88px 0 0!important;
  overflow:hidden!important
}
.site-footer-figma .footer-content,
.site-footer-figma .footer-legal{
  width:var(--footer-inner)!important;
  grid-template-columns:minmax(0,1fr) var(--footer-right)!important;
  gap:72px!important
}
.site-footer-figma .footer-links,
.site-footer-figma .footer-legal nav{
  width:var(--footer-right)!important;
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  column-gap:64px!important
}
.site-footer-figma .footer-wordmark{
  width:100vw!important;
  height:min(30.3302vw,436.755px)!important;
  aspect-ratio:auto!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  overflow:visible!important
}
.site-footer-figma .footer-wordmark img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:fill!important;
  opacity:1!important;
  filter:none!important;
  transform:none!important
}
.site-footer-figma .footer-legal{bottom:30px!important}

.timeline-example-modal[hidden]{display:none!important}
.timeline-example-modal{position:fixed!important;inset:0!important;z-index:10000!important}
.timeline-example-backdrop{
  position:absolute!important;inset:0!important;
  background:rgba(0,0,0,.52)!important;
  -webkit-backdrop-filter:blur(4px)!important;
  backdrop-filter:blur(4px)!important
}
.timeline-example-dialog{
  position:absolute!important;
  inset:12px!important;
  border-radius:24px!important;
  overflow:hidden!important;
  background:#f3efe5!important;
  box-shadow:0 28px 96px rgba(0,0,0,.3)!important
}
.timeline-example-close{
  position:fixed!important;
  top:32px!important;
  right:32px!important;
  z-index:10020!important
}
.timeline-example-scroll{height:100%!important;overflow:auto!important}
.timeline-example-hero{
  min-height:396px!important;
  padding:56px 80px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:16px!important;
  text-align:center!important;
  background:#022c22!important;
  color:#fff!important
}
.timeline-example-hero::before,.timeline-example-hero::after{content:none!important}
.timeline-example-hero img{
  width:100px!important;height:100px!important;
  border-radius:50%!important;object-fit:cover!important
}
.timeline-example-hero h2{
  font-family:"Instrument Serif",serif!important;
  font-size:72px!important;line-height:1!important;
  margin:0!important;color:#fff!important
}
.timeline-example-hero p{
  max-width:600px!important;margin:0!important;
  color:rgba(255,255,255,.7)!important;
  font-size:16px!important;line-height:1.5!important
}
.timeline-example-tabs{
  min-height:64px!important;
  padding:0 52px!important;
  position:sticky!important;
  top:0!important;
  z-index:15!important;
  display:flex!important;
  align-items:stretch!important;
  gap:32px!important;
  background:rgba(243,239,229,.96)!important;
  -webkit-backdrop-filter:blur(16px)!important;
  backdrop-filter:blur(16px)!important;
  border-bottom:1px solid rgba(0,46,32,.12)!important
}
.timeline-example-tabs button{
  position:relative!important;
  border:0!important;
  background:transparent!important;
  color:rgba(0,46,32,.48)!important
}
.timeline-example-tabs button.active,
.timeline-example-tabs button[aria-selected="true"]{color:#002e20!important}
.timeline-example-tabs button.active::after,
.timeline-example-tabs button[aria-selected="true"]::after{
  content:""!important;
  position:absolute!important;
  right:0!important;bottom:0!important;left:0!important;
  height:2px!important;background:#002e20!important
}
.timeline-example-panels{
  max-width:1440px!important;
  margin:0 auto!important;
  padding:100px 64px 120px!important
}
.timeline-example-panel{max-width:1312px!important;margin:0 auto!important}
.timeline-example-timeline{
  display:grid!important;
  grid-template-columns:240px minmax(0,1fr)!important;
  gap:80px!important
}

@media(max-width:1050px){
 .site-footer.site-footer-figma{
   --footer-inner:min(900px,calc(100vw - 64px));
   --footer-right:320px;
   height:650px!important;
   min-height:650px!important;
   padding-top:64px!important
 }
 .site-footer-figma .footer-content,
 .site-footer-figma .footer-legal{gap:36px!important}
 .site-footer-figma .footer-links,
 .site-footer-figma .footer-legal nav{column-gap:36px!important}
}
@media(max-width:680px){
 .site-footer.site-footer-figma{
   --footer-inner:calc(100vw - 40px);
   height:760px!important;
   min-height:760px!important;
   padding-top:64px!important
 }
 .site-footer-figma .footer-content{grid-template-columns:1fr!important;gap:48px!important}
 .site-footer-figma .footer-links{width:100%!important;grid-template-columns:1fr 1fr!important}
 .site-footer-figma .footer-wordmark{bottom:56px!important}
 .site-footer-figma .footer-legal{bottom:20px!important;grid-template-columns:1fr!important;gap:12px!important}
 .site-footer-figma .footer-legal nav{
   width:100%!important;
   grid-template-columns:auto auto!important;
   justify-content:start!important;
   gap:24px!important
 }
 .timeline-example-dialog{inset:6px!important;border-radius:18px!important}
 .timeline-example-close{top:14px!important;right:14px!important}
 .timeline-example-hero{min-height:320px!important;padding:68px 22px 44px!important}
 .timeline-example-hero img{width:80px!important;height:80px!important}
 .timeline-example-hero h2{font-size:48px!important}
 .timeline-example-tabs{padding:0 20px!important;gap:26px!important;overflow-x:auto!important}
 .timeline-example-panels{padding:52px 20px 80px!important}
 .timeline-example-timeline{display:block!important}
 .timeline-example-chapters{
   position:static!important;
   margin-bottom:44px!important;
   display:flex!important;
   overflow-x:auto!important;
   gap:24px!important
 }
}

/* ========================================================================== */
/* FINAL FIGMA COMPOSITION LOCK: FAQ, CTA, footer and timeline example modal  */
/* ========================================================================== */

.faq{
  margin-bottom:0;
  background:#f3efe5
}

.final-cta.final-cta-figma{
  width:100vw!important;
  max-width:none!important;
  height:802px!important;
  min-height:802px!important;
  margin:-1px 0 0 calc(50% - 50vw)!important;
  padding:0!important;
  position:relative!important;
  isolation:isolate;
  overflow:hidden!important;
  background:
    radial-gradient(145% 96% at 50% -2%,
      #f3efe5 0%,
      #f3efe5 13%,
      rgba(226,228,218,.98) 30%,
      rgba(163,181,168,.98) 52%,
      rgba(65,105,86,.99) 74%,
      #002e20 100%)!important
}

.final-cta.final-cta-figma::before{content:none!important}

.final-cta-figma .final-cta-stage{
  width:min(1440px,100vw)!important;
  max-width:none!important;
  height:802px!important;
  min-height:802px!important;
  margin:0 auto!important;
  overflow:visible!important
}

.final-cta-memory-map{
  width:166.99px!important;
  height:158.357px!important;
  left:192px!important;
  right:auto!important;
  top:523px!important
}

.final-cta-memory-map img{
  width:143.125px!important;
  height:131.993px!important;
  transform:rotate(-11.74deg)!important
}

.final-cta-memory-chair{
  width:295.194px!important;
  height:295.194px!important;
  left:auto!important;
  right:95px!important;
  top:406.49px!important
}

.final-cta-memory-chair img{
  width:255.815px!important;
  height:255.815px!important;
  transform:rotate(9.68deg)!important
}

.site-footer.site-footer-figma{
  --footer-inner:min(1192px,calc(100vw - 40px));
  width:100vw!important;
  max-width:none!important;
  height:620px!important;
  min-height:620px!important;
  margin:0 0 0 calc(50% - 50vw)!important;
  padding:80px 0 0!important;
  position:relative!important;
  display:block!important;
  overflow:hidden!important;
  border:0!important;
  background:
    radial-gradient(88.64% 60.94% at 50% 100%,rgba(217,249,157,.12) 0%,rgba(6,95,70,0) 100%),
    #002e20!important
}

.site-footer-figma .footer-content{
  width:var(--footer-inner)!important;
  max-width:none!important;
  margin:0 auto!important;
  padding:0!important;
  position:relative!important;
  z-index:3!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 363px!important;
  align-items:start!important;
  gap:52px!important
}

.site-footer-figma .footer-tagline{
  width:min(560px,100%)!important;
  margin:0!important;
  color:#fff!important;
  font-family:"Instrument Serif",serif!important;
  font-size:48px!important;
  line-height:1.04!important;
  font-weight:400!important;
  letter-spacing:-.02em!important
}

.site-footer-figma .footer-links{
  width:363px!important;
  margin:0!important;
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:0 52px!important
}

.site-footer-figma .footer-links nav{
  margin:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:22px!important;
  color:#fff!important;
  font-size:16px!important;
  line-height:1.25!important
}

.site-footer-figma .footer-wordmark{
  width:100vw!important;
  height:auto!important;
  aspect-ratio:1440/436.755!important;
  margin:0!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  z-index:1!important;
  overflow:visible!important;
  pointer-events:none!important
}

.site-footer-figma .footer-wordmark img{
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  position:static!important;
  display:block!important;
  object-fit:fill!important;
  opacity:1!important;
  filter:none!important;
  transform:none!important
}

.site-footer-figma .footer-legal{
  width:var(--footer-inner)!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  position:absolute!important;
  left:50%!important;
  bottom:32px!important;
  z-index:4!important;
  transform:translateX(-50%)!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 363px!important;
  align-items:end!important;
  gap:52px!important;
  color:rgba(255,255,255,.3)!important;
  font-size:14px!important;
  line-height:1.4!important
}

.site-footer-figma .footer-legal>span{
  justify-self:start!important;
  text-align:left!important
}

.site-footer-figma .footer-legal nav{
  width:363px!important;
  margin:0!important;
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:52px!important;
  justify-content:stretch!important
}

.site-footer-figma .footer-legal nav a{
  justify-self:start!important;
  white-space:nowrap!important
}

.timeline-example-modal[hidden]{display:none!important}

.timeline-example-modal{
  position:fixed;
  inset:0;
  z-index:10000
}

.timeline-example-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.52);
  -webkit-backdrop-filter:blur(4px);
  backdrop-filter:blur(4px)
}

.timeline-example-dialog{
  position:absolute;
  inset:12px;
  border-radius:24px;
  overflow:hidden;
  background:#f3efe5;
  box-shadow:0 28px 96px rgba(0,0,0,.3)
}

.timeline-example-close{
  width:40px;
  height:40px;
  padding:0;
  position:absolute;
  top:20px;
  right:20px;
  z-index:20;
  display:grid;
  place-items:center;
  border:0;
  border-radius:999px;
  color:#002e20;
  background:#fff;
  box-shadow:0 3px 18px rgba(0,0,0,.12);
  cursor:pointer
}

.timeline-example-close svg{width:20px;height:20px}

.timeline-example-scroll{
  width:100%;
  height:100%;
  overflow:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable
}

.timeline-modal-hero{
  min-height:396px!important;
  padding:56px 80px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:24px!important;
  text-align:center!important;
  color:#fff!important;
  background:#022c22!important
}

.timeline-modal-hero::before,
.timeline-modal-hero::after{content:none!important}

.timeline-modal-hero img{
  width:100px!important;
  height:100px!important;
  flex:none!important;
  border-radius:50%!important;
  object-fit:cover!important
}

.timeline-modal-hero-copy{
  width:min(900px,100%)!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  gap:16px!important
}

.timeline-modal-hero h2{
  margin:0!important;
  color:#fff!important;
  font-family:"Instrument Serif",serif!important;
  font-size:72px!important;
  line-height:1!important;
  font-weight:400!important;
  letter-spacing:-.035em!important
}

.timeline-modal-hero p{
  margin:0!important;
  color:rgba(255,255,255,.7)!important;
  font-size:16px!important;
  line-height:1.5!important
}

.timeline-modal-tabs{
  min-height:64px!important;
  padding:0 52px!important;
  position:sticky!important;
  top:0!important;
  z-index:15!important;
  display:flex!important;
  align-items:stretch!important;
  gap:32px!important;
  border-top:.5px solid rgba(0,46,32,.12)!important;
  border-bottom:.5px solid rgba(0,46,32,.12)!important;
  background:rgba(243,239,229,.96)!important;
  -webkit-backdrop-filter:blur(16px)!important;
  backdrop-filter:blur(16px)!important
}

.timeline-modal-tab{
  padding:0!important;
  position:relative!important;
  border:0!important;
  color:rgba(0,46,32,.48)!important;
  background:transparent!important;
  font:500 12px/1 "Inter",sans-serif!important;
  cursor:pointer!important
}

.timeline-modal-tab[aria-selected="true"]{color:#002e20!important}

.timeline-modal-tab[aria-selected="true"]::after{
  content:"";
  height:2px;
  position:absolute;
  right:0;
  bottom:0;
  left:0;
  background:#002e20
}

.timeline-modal-panel{min-height:520px;background:#f3efe5}
.timeline-modal-panel[hidden]{display:none!important}

@media(max-width:1050px){
  .final-cta.final-cta-figma,
  .final-cta-figma .final-cta-stage{
    height:700px!important;
    min-height:700px!important
  }

  .final-cta-memory-map{
    width:132px!important;
    height:126px!important;
    left:54px!important;
    top:492px!important
  }

  .final-cta-memory-map img{width:113px!important;height:106px!important}

  .final-cta-memory-chair{
    width:186px!important;
    height:186px!important;
    right:10px!important;
    top:432px!important
  }

  .final-cta-memory-chair img{width:162px!important;height:162px!important}

  .site-footer.site-footer-figma{
    --footer-inner:min(900px,calc(100vw - 64px));
    height:560px!important;
    min-height:560px!important;
    padding-top:64px!important
  }

  .site-footer-figma .footer-content,
  .site-footer-figma .footer-legal{
    grid-template-columns:minmax(0,1fr) 320px!important;
    gap:36px!important
  }

  .site-footer-figma .footer-links,
  .site-footer-figma .footer-legal nav{width:320px!important;gap:36px!important}
  .site-footer-figma .footer-tagline{font-size:40px!important}

  .timeline-example-dialog{inset:8px}
  .timeline-modal-hero{padding:56px 36px!important}
  .timeline-modal-hero h2{font-size:62px!important}
}

@media(max-width:680px){
  .final-cta.final-cta-figma,
  .final-cta-figma .final-cta-stage{
    height:620px!important;
    min-height:620px!important
  }

  .final-cta-memory-map{left:-24px!important;top:484px!important}
  .final-cta-memory-chair{right:-58px!important;top:438px!important}

  .site-footer.site-footer-figma{
    --footer-inner:calc(100vw - 40px);
    height:690px!important;
    min-height:690px!important;
    padding-top:64px!important
  }

  .site-footer-figma .footer-content{
    grid-template-columns:1fr!important;
    gap:48px!important
  }

  .site-footer-figma .footer-tagline{font-size:36px!important}
  .site-footer-figma .footer-links{width:100%!important;gap:24px!important}
  .site-footer-figma .footer-wordmark{bottom:58px!important}

  .site-footer-figma .footer-legal{
    bottom:20px!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
    font-size:11px!important
  }

  .site-footer-figma .footer-legal nav{
    width:100%!important;
    grid-template-columns:auto auto!important;
    justify-content:start!important;
    gap:24px!important
  }

  .timeline-example-dialog{inset:6px;border-radius:18px}
  .timeline-example-close{top:14px;right:14px}
  .timeline-modal-hero{min-height:320px!important;padding:68px 22px 44px!important}
  .timeline-modal-hero img{width:80px!important;height:80px!important}
  .timeline-modal-hero h2{font-size:48px!important}
  .timeline-modal-tabs{padding:0 20px!important;gap:26px!important;overflow-x:auto!important}
}

/* HELDEARLY CLOSING SYSTEM — CANONICAL EOF v33 */
body.timeline-modal-open{overflow:hidden!important}

.faq{position:relative!important;z-index:2!important;margin-bottom:0!important;background:#f3efe5!important}

.final-cta.final-cta-figma{
  width:100vw!important;
  max-width:none!important;
  margin:-1px 0 0 calc(50% - 50vw)!important;
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:radial-gradient(110% 86% at 50% 0%,#f3efe5 0%,rgba(243,239,229,.99) 20%,rgba(227,230,220,.94) 40%,rgba(159,180,166,.88) 62%,rgba(55,98,77,.96) 81%,#002e20 100%)!important
}

.final-cta.final-cta-figma::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:-120px -10vw auto!important;
  height:520px!important;
  z-index:0!important;
  pointer-events:none!important;
  background:linear-gradient(180deg,#f3efe5 0%,rgba(243,239,229,.995) 34%,rgba(224,227,217,.84) 68%,rgba(170,190,175,0) 100%)!important;
  filter:blur(34px)!important
}

.final-cta-figma .final-cta-stage{position:relative!important;z-index:1!important}

.site-footer.site-footer-figma{
  --footer-inner:min(1192px,calc(100vw - 96px));
  --footer-right:456px;
  height:720px!important;
  min-height:720px!important;
  padding:88px 0 0!important;
  overflow:hidden!important
}

.site-footer-figma .footer-content,
.site-footer-figma .footer-legal{
  width:var(--footer-inner)!important;
  grid-template-columns:minmax(0,1fr) var(--footer-right)!important;
  gap:72px!important
}

.site-footer-figma .footer-links,
.site-footer-figma .footer-legal nav{
  width:var(--footer-right)!important;
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  column-gap:64px!important
}

.site-footer-figma .footer-wordmark{
  width:100vw!important;
  height:min(30.3302vw,436.755px)!important;
  aspect-ratio:auto!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  overflow:visible!important
}

.site-footer-figma .footer-wordmark img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:fill!important;
  opacity:1!important;
  filter:none!important;
  transform:none!important
}

.site-footer-figma .footer-legal{bottom:30px!important}

.timeline-example-modal[hidden]{display:none!important}
.timeline-example-modal{position:fixed!important;inset:0!important;z-index:10000!important}
.timeline-example-backdrop{
  position:absolute!important;
  inset:0!important;
  background:rgba(0,0,0,.52)!important;
  -webkit-backdrop-filter:blur(4px)!important;
  backdrop-filter:blur(4px)!important
}

.timeline-example-dialog{
  position:absolute!important;
  inset:12px!important;
  border-radius:24px!important;
  overflow:hidden!important;
  background:#f3efe5!important;
  box-shadow:0 28px 96px rgba(0,0,0,.3)!important
}

.timeline-example-close{
  width:40px!important;
  height:40px!important;
  padding:0!important;
  position:fixed!important;
  top:32px!important;
  right:32px!important;
  z-index:10020!important;
  display:grid!important;
  place-items:center!important;
  border:0!important;
  border-radius:999px!important;
  color:#002e20!important;
  background:#fff!important;
  box-shadow:0 3px 18px rgba(0,0,0,.12)!important;
  cursor:pointer!important
}

.timeline-example-scroll{
  width:100%!important;
  height:100%!important;
  overflow:auto!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important
}

.timeline-example-hero{
  min-height:396px!important;
  padding:56px 80px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:16px!important;
  text-align:center!important;
  background:#022c22!important;
  color:#fff!important
}

.timeline-example-hero::before,.timeline-example-hero::after{content:none!important}
.timeline-example-hero img{width:100px!important;height:100px!important;flex:none!important;border-radius:50%!important;object-fit:cover!important}
.timeline-example-hero h2{margin:0!important;color:#fff!important;font-family:"Instrument Serif",serif!important;font-size:72px!important;line-height:1!important;font-weight:400!important;letter-spacing:-.035em!important}
.timeline-example-hero p{margin:0!important;color:rgba(255,255,255,.7)!important;font-size:16px!important;line-height:1.5!important}

.timeline-example-tabs{
  min-height:64px!important;
  padding:0 52px!important;
  position:sticky!important;
  top:0!important;
  z-index:15!important;
  display:flex!important;
  align-items:stretch!important;
  gap:32px!important;
  border-top:.5px solid rgba(0,46,32,.12)!important;
  border-bottom:.5px solid rgba(0,46,32,.12)!important;
  background:rgba(243,239,229,.96)!important;
  -webkit-backdrop-filter:blur(16px)!important;
  backdrop-filter:blur(16px)!important
}

.timeline-example-tabs button{
  padding:0!important;
  position:relative!important;
  border:0!important;
  color:rgba(0,46,32,.48)!important;
  background:transparent!important;
  font:500 12px/1 "Inter",sans-serif!important;
  cursor:pointer!important
}

.timeline-example-tabs button[aria-selected="true"]{color:#002e20!important}
.timeline-example-tabs button[aria-selected="true"]::after{content:"";height:2px;position:absolute;right:0;bottom:0;left:0;background:#002e20}
.timeline-example-panels{max-width:1440px!important;margin:0 auto!important;padding:100px 64px 120px!important;background:#f3efe5!important}
.timeline-example-panel{max-width:1312px!important;margin:0 auto!important}
.timeline-example-panel[hidden]{display:none!important}
.timeline-example-timeline{display:grid!important;grid-template-columns:240px minmax(0,1fr)!important;gap:80px!important}

@media(max-width:1050px){
  .site-footer.site-footer-figma{--footer-inner:min(900px,calc(100vw - 64px));--footer-right:320px;height:650px!important;min-height:650px!important;padding-top:64px!important}
  .site-footer-figma .footer-content,.site-footer-figma .footer-legal{gap:36px!important}
  .site-footer-figma .footer-links,.site-footer-figma .footer-legal nav{column-gap:36px!important}
  .timeline-example-dialog{inset:8px!important}
  .timeline-example-hero{padding:56px 36px!important}
  .timeline-example-hero h2{font-size:62px!important}
  .timeline-example-panels{padding:72px 36px 96px!important}
  .timeline-example-timeline{grid-template-columns:190px minmax(0,1fr)!important;gap:40px!important}
}

@media(max-width:680px){
  .site-footer.site-footer-figma{--footer-inner:calc(100vw - 40px);height:760px!important;min-height:760px!important;padding-top:64px!important}
  .site-footer-figma .footer-content{grid-template-columns:1fr!important;gap:48px!important}
  .site-footer-figma .footer-links{width:100%!important;column-gap:24px!important}
  .site-footer-figma .footer-wordmark{bottom:56px!important}
  .site-footer-figma .footer-legal{bottom:20px!important;grid-template-columns:1fr!important;gap:12px!important}
  .site-footer-figma .footer-legal nav{width:100%!important;grid-template-columns:auto auto!important;justify-content:start!important;column-gap:24px!important}
  .timeline-example-dialog{inset:6px!important;border-radius:18px!important}
  .timeline-example-close{top:14px!important;right:14px!important}
  .timeline-example-hero{min-height:320px!important;padding:68px 22px 44px!important}
  .timeline-example-hero img{width:80px!important;height:80px!important}
  .timeline-example-hero h2{font-size:48px!important}
  .timeline-example-tabs{padding:0 20px!important;gap:26px!important;overflow-x:auto!important}
  .timeline-example-panels{padding:48px 20px 72px!important}
  .timeline-example-timeline{grid-template-columns:1fr!important;gap:32px!important}
}

/* Figma closing system — canonical EOF */
body.timeline-modal-open{overflow:hidden!important}
.faq{position:relative!important;z-index:2!important;margin-bottom:0!important;background:#f3efe5!important}

.final-cta.final-cta-figma{
  width:100vw!important;
  max-width:none!important;
  margin:-1px 0 0 calc(50% - 50vw)!important;
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:radial-gradient(110% 86% at 50% 0%,#f3efe5 0%,rgba(243,239,229,.99) 20%,rgba(227,230,220,.94) 40%,rgba(159,180,166,.88) 62%,rgba(55,98,77,.96) 81%,#002e20 100%)!important
}
.final-cta.final-cta-figma::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:-120px -10vw auto!important;
  height:520px!important;
  z-index:0!important;
  pointer-events:none!important;
  background:linear-gradient(180deg,#f3efe5 0%,rgba(243,239,229,.995) 34%,rgba(224,227,217,.84) 68%,rgba(170,190,175,0) 100%)!important;
  filter:blur(34px)!important
}
.final-cta-figma .final-cta-stage{position:relative!important;z-index:1!important}

.site-footer.site-footer-figma{
  --footer-inner:min(1192px,calc(100vw - 96px));
  --footer-right:456px;
  height:720px!important;
  min-height:720px!important;
  padding:88px 0 0!important;
  overflow:hidden!important
}
.site-footer-figma .footer-content,
.site-footer-figma .footer-legal{
  width:var(--footer-inner)!important;
  grid-template-columns:minmax(0,1fr) var(--footer-right)!important;
  gap:72px!important
}
.site-footer-figma .footer-links,
.site-footer-figma .footer-legal nav{
  width:var(--footer-right)!important;
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  column-gap:64px!important
}
.site-footer-figma .footer-wordmark{
  width:100vw!important;
  height:min(30.3302vw,436.755px)!important;
  aspect-ratio:auto!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  overflow:visible!important
}
.site-footer-figma .footer-wordmark img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:fill!important;
  opacity:1!important;
  filter:none!important;
  transform:none!important
}
.site-footer-figma .footer-legal{bottom:30px!important}

.timeline-example-modal[hidden]{display:none!important}
.timeline-example-modal{position:fixed!important;inset:0!important;z-index:10000!important}
.timeline-example-backdrop{position:absolute!important;inset:0!important;background:rgba(0,0,0,.52)!important;-webkit-backdrop-filter:blur(4px)!important;backdrop-filter:blur(4px)!important}
.timeline-example-dialog{position:absolute!important;inset:12px!important;border-radius:24px!important;overflow:hidden!important;background:#f3efe5!important;box-shadow:0 28px 96px rgba(0,0,0,.3)!important}
.timeline-example-close{width:40px!important;height:40px!important;position:fixed!important;top:32px!important;right:32px!important;z-index:10020!important}
.timeline-example-scroll{width:100%!important;height:100%!important;overflow:auto!important;overscroll-behavior:contain!important;scrollbar-gutter:stable!important}
.timeline-example-hero{min-height:396px!important;padding:56px 80px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:16px!important;text-align:center!important;background:#022c22!important;color:#fff!important}
.timeline-example-hero::before,.timeline-example-hero::after{content:none!important}
.timeline-example-hero img{width:100px!important;height:100px!important;flex:none!important;border-radius:50%!important;object-fit:cover!important}
.timeline-example-hero h2{margin:0!important;color:#fff!important;font-family:"Instrument Serif",serif!important;font-size:72px!important;line-height:1!important;font-weight:400!important;letter-spacing:-.035em!important}
.timeline-example-hero p{margin:0!important;color:rgba(255,255,255,.7)!important;font-size:16px!important;line-height:1.5!important}
.timeline-example-tabs{min-height:64px!important;padding:0 52px!important;position:sticky!important;top:0!important;z-index:15!important;display:flex!important;align-items:stretch!important;gap:32px!important;border-top:.5px solid rgba(0,46,32,.12)!important;border-bottom:.5px solid rgba(0,46,32,.12)!important;background:rgba(243,239,229,.96)!important;-webkit-backdrop-filter:blur(16px)!important;backdrop-filter:blur(16px)!important}
.timeline-example-tabs button{padding:0!important;position:relative!important;border:0!important;color:rgba(0,46,32,.48)!important;background:transparent!important;font:500 12px/1 "Inter",sans-serif!important;cursor:pointer!important}
.timeline-example-tabs button[aria-selected="true"]{color:#002e20!important}
.timeline-example-tabs button[aria-selected="true"]::after{content:"";height:2px;position:absolute;right:0;bottom:0;left:0;background:#002e20}
.timeline-example-panels{max-width:1440px!important;margin:0 auto!important;padding:100px 64px 120px!important;background:#f3efe5!important}
.timeline-example-panel{max-width:1312px!important;margin:0 auto!important}
.timeline-example-panel[hidden]{display:none!important}
.timeline-example-timeline{display:grid!important;grid-template-columns:240px minmax(0,1fr)!important;gap:80px!important}

@media(max-width:1050px){
  .site-footer.site-footer-figma{--footer-inner:min(900px,calc(100vw - 64px));--footer-right:320px;height:650px!important;min-height:650px!important;padding-top:64px!important}
  .site-footer-figma .footer-content,.site-footer-figma .footer-legal{gap:36px!important}
  .site-footer-figma .footer-links,.site-footer-figma .footer-legal nav{column-gap:36px!important}
  .timeline-example-hero{padding:56px 36px!important}
  .timeline-example-hero h2{font-size:62px!important}
  .timeline-example-panels{padding:80px 36px 100px!important}
  .timeline-example-timeline{grid-template-columns:210px minmax(0,1fr)!important;gap:44px!important}
}

@media(max-width:680px){
  .site-footer.site-footer-figma{--footer-inner:calc(100vw - 40px);height:760px!important;min-height:760px!important;padding-top:64px!important}
  .site-footer-figma .footer-content{grid-template-columns:1fr!important;gap:48px!important}
  .site-footer-figma .footer-links{width:100%!important;column-gap:24px!important}
  .site-footer-figma .footer-wordmark{bottom:56px!important}
  .site-footer-figma .footer-legal{bottom:20px!important;grid-template-columns:1fr!important;gap:12px!important}
  .site-footer-figma .footer-legal nav{width:100%!important;grid-template-columns:auto auto!important;justify-content:start!important;column-gap:24px!important}
  .timeline-example-dialog{inset:6px!important;border-radius:18px!important}
  .timeline-example-close{top:14px!important;right:14px!important}
  .timeline-example-hero{min-height:320px!important;padding:68px 22px 44px!important}
  .timeline-example-hero img{width:80px!important;height:80px!important}
  .timeline-example-hero h2{font-size:48px!important}
  .timeline-example-tabs{padding:0 20px!important;gap:26px!important;overflow-x:auto!important}
  .timeline-example-panels{padding:52px 20px 80px!important}
  .timeline-example-timeline{display:block!important}
}

/* Figma closing system — final source of truth */
body.timeline-modal-open{overflow:hidden!important}
.faq{position:relative!important;z-index:2!important;margin-bottom:0!important;background:#f3efe5!important}

.final-cta.final-cta-figma{
  width:100vw!important;
  max-width:none!important;
  margin:-1px 0 0 calc(50% - 50vw)!important;
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:radial-gradient(110% 86% at 50% 0%,#f3efe5 0%,rgba(243,239,229,.99) 20%,rgba(227,230,220,.94) 40%,rgba(159,180,166,.88) 62%,rgba(55,98,77,.96) 81%,#002e20 100%)!important
}
.final-cta.final-cta-figma::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:-120px -10vw auto!important;
  height:520px!important;
  z-index:0!important;
  pointer-events:none!important;
  background:linear-gradient(180deg,#f3efe5 0%,rgba(243,239,229,.995) 34%,rgba(224,227,217,.84) 68%,rgba(170,190,175,0) 100%)!important;
  filter:blur(34px)!important
}
.final-cta-figma .final-cta-stage{position:relative!important;z-index:1!important}

.site-footer.site-footer-figma{
  --footer-inner:min(1192px,calc(100vw - 96px));
  --footer-right:456px;
  height:720px!important;
  min-height:720px!important;
  padding:88px 0 0!important;
  overflow:hidden!important
}
.site-footer-figma .footer-content,
.site-footer-figma .footer-legal{
  width:var(--footer-inner)!important;
  grid-template-columns:minmax(0,1fr) var(--footer-right)!important;
  gap:72px!important
}
.site-footer-figma .footer-links,
.site-footer-figma .footer-legal nav{
  width:var(--footer-right)!important;
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  column-gap:64px!important
}
.site-footer-figma .footer-wordmark{
  width:100vw!important;
  height:min(30.3302vw,436.755px)!important;
  aspect-ratio:auto!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  overflow:visible!important
}
.site-footer-figma .footer-wordmark img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:fill!important;
  opacity:1!important;
  filter:none!important;
  transform:none!important
}
.site-footer-figma .footer-legal{bottom:30px!important}

.timeline-example-modal[hidden]{display:none!important}
.timeline-example-modal{position:fixed!important;inset:0!important;z-index:10000!important}
.timeline-example-backdrop{
  position:absolute!important;
  inset:0!important;
  background:rgba(0,0,0,.52)!important;
  -webkit-backdrop-filter:blur(4px)!important;
  backdrop-filter:blur(4px)!important
}
.timeline-example-dialog{
  position:absolute!important;
  inset:12px!important;
  border-radius:24px!important;
  overflow:hidden!important;
  background:#f3efe5!important;
  box-shadow:0 28px 96px rgba(0,0,0,.3)!important
}
.timeline-example-close{position:fixed!important;top:32px!important;right:32px!important;z-index:10020!important}
.timeline-example-scroll{height:100%!important;overflow:auto!important}
.timeline-example-hero{
  min-height:396px!important;
  padding:56px 80px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:16px!important;
  text-align:center!important;
  background:#022c22!important;
  color:#fff!important
}
.timeline-example-hero::before,.timeline-example-hero::after{content:none!important}
.timeline-example-hero img{width:100px!important;height:100px!important;border-radius:50%!important;object-fit:cover!important}
.timeline-example-hero h2{font-family:"Instrument Serif",serif!important;font-size:72px!important;line-height:1!important;margin:0!important;color:#fff!important}
.timeline-example-hero p{max-width:600px!important;margin:0!important;color:rgba(255,255,255,.7)!important;font-size:16px!important;line-height:1.5!important}
.timeline-example-tabs{
  min-height:64px!important;
  padding:0 52px!important;
  position:sticky!important;
  top:0!important;
  z-index:15!important;
  display:flex!important;
  align-items:stretch!important;
  gap:32px!important;
  background:rgba(243,239,229,.96)!important;
  -webkit-backdrop-filter:blur(16px)!important;
  backdrop-filter:blur(16px)!important;
  border-bottom:1px solid rgba(0,46,32,.12)!important
}
.timeline-example-tabs button{position:relative!important;border:0!important;background:transparent!important;color:rgba(0,46,32,.48)!important}
.timeline-example-tabs button.active,.timeline-example-tabs button[aria-selected="true"]{color:#002e20!important}
.timeline-example-tabs button.active::after,.timeline-example-tabs button[aria-selected="true"]::after{
  content:""!important;
  position:absolute!important;
  right:0!important;
  bottom:0!important;
  left:0!important;
  height:2px!important;
  background:#002e20!important
}
.timeline-example-panels{max-width:1440px!important;margin:0 auto!important;padding:100px 64px 120px!important}
.timeline-example-panel{max-width:1312px!important;margin:0 auto!important}
.timeline-example-timeline{display:grid!important;grid-template-columns:240px minmax(0,1fr)!important;gap:80px!important}

@media(max-width:1050px){
  .site-footer.site-footer-figma{--footer-inner:min(900px,calc(100vw - 64px));--footer-right:320px;height:650px!important;min-height:650px!important;padding-top:64px!important}
  .site-footer-figma .footer-content,.site-footer-figma .footer-legal{gap:36px!important}
  .site-footer-figma .footer-links,.site-footer-figma .footer-legal nav{column-gap:36px!important}
}
@media(max-width:680px){
  .site-footer.site-footer-figma{--footer-inner:calc(100vw - 40px);height:760px!important;min-height:760px!important;padding-top:64px!important}
  .site-footer-figma .footer-content{grid-template-columns:1fr!important;gap:48px!important}
  .site-footer-figma .footer-links{width:100%!important;grid-template-columns:1fr 1fr!important}
  .site-footer-figma .footer-wordmark{bottom:56px!important}
  .site-footer-figma .footer-legal{bottom:20px!important;grid-template-columns:1fr!important;gap:12px!important}
  .site-footer-figma .footer-legal nav{width:100%!important;grid-template-columns:auto auto!important;justify-content:start!important;gap:24px!important}
  .timeline-example-dialog{inset:6px!important;border-radius:18px!important}
  .timeline-example-close{top:14px!important;right:14px!important}
  .timeline-example-hero{min-height:320px!important;padding:68px 22px 44px!important}
  .timeline-example-hero img{width:80px!important;height:80px!important}
  .timeline-example-hero h2{font-size:48px!important}
  .timeline-example-tabs{padding:0 20px!important;gap:26px!important;overflow-x:auto!important}
  .timeline-example-panels{padding:52px 20px 80px!important}
  .timeline-example-timeline{display:block!important}
  .timeline-example-chapters{position:static!important;margin-bottom:44px!important;display:flex!important;overflow-x:auto!important;gap:24px!important}
}

/* Figma closing system — final source of truth */
body.timeline-modal-open{overflow:hidden!important}
.faq{position:relative!important;z-index:2!important;margin-bottom:0!important;background:#f3efe5!important}

.final-cta.final-cta-figma{
  width:100vw!important;
  max-width:none!important;
  margin:-1px 0 0 calc(50% - 50vw)!important;
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:radial-gradient(110% 86% at 50% 0%,#f3efe5 0%,rgba(243,239,229,.99) 20%,rgba(227,230,220,.94) 40%,rgba(159,180,166,.88) 62%,rgba(55,98,77,.96) 81%,#002e20 100%)!important
}

.final-cta.final-cta-figma::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:-120px -10vw auto!important;
  height:520px!important;
  z-index:0!important;
  pointer-events:none!important;
  background:linear-gradient(180deg,#f3efe5 0%,rgba(243,239,229,.995) 34%,rgba(224,227,217,.84) 68%,rgba(170,190,175,0) 100%)!important;
  filter:blur(34px)!important
}

.final-cta-figma .final-cta-stage{position:relative!important;z-index:1!important}

.site-footer.site-footer-figma{
  --footer-inner:min(1192px,calc(100vw - 96px));
  --footer-right:456px;
  height:720px!important;
  min-height:720px!important;
  padding:88px 0 0!important;
  overflow:hidden!important
}

.site-footer-figma .footer-content,
.site-footer-figma .footer-legal{
  width:var(--footer-inner)!important;
  grid-template-columns:minmax(0,1fr) var(--footer-right)!important;
  gap:72px!important
}

.site-footer-figma .footer-links,
.site-footer-figma .footer-legal nav{
  width:var(--footer-right)!important;
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  column-gap:64px!important
}

.site-footer-figma .footer-wordmark{
  width:100vw!important;
  height:min(30.3302vw,436.755px)!important;
  aspect-ratio:auto!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  overflow:visible!important
}

.site-footer-figma .footer-wordmark img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:fill!important;
  opacity:1!important;
  filter:none!important;
  transform:none!important
}

.site-footer-figma .footer-legal{bottom:30px!important}

.timeline-example-modal[hidden]{display:none!important}
.timeline-example-modal{position:fixed!important;inset:0!important;z-index:10000!important}
.timeline-example-backdrop{
  position:absolute!important;
  inset:0!important;
  background:rgba(0,0,0,.52)!important;
  -webkit-backdrop-filter:blur(4px)!important;
  backdrop-filter:blur(4px)!important
}
.timeline-example-dialog{
  position:absolute!important;
  inset:12px!important;
  border-radius:24px!important;
  overflow:hidden!important;
  background:#f3efe5!important;
  box-shadow:0 28px 96px rgba(0,0,0,.3)!important
}
.timeline-example-close{position:fixed!important;top:32px!important;right:32px!important;z-index:10020!important}
.timeline-example-scroll{height:100%!important;overflow:auto!important}
.timeline-example-hero{
  min-height:396px!important;
  padding:56px 80px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:16px!important;
  text-align:center!important;
  background:#022c22!important;
  color:#fff!important
}
.timeline-example-hero::before,.timeline-example-hero::after{content:none!important}
.timeline-example-hero img{width:100px!important;height:100px!important;border-radius:50%!important;object-fit:cover!important}
.timeline-example-hero h2{font-family:"Instrument Serif",serif!important;font-size:72px!important;line-height:1!important;margin:0!important;color:#fff!important}
.timeline-example-hero p{max-width:600px!important;margin:0!important;color:rgba(255,255,255,.7)!important;font-size:16px!important;line-height:1.5!important}
.timeline-example-tabs{
  min-height:64px!important;
  padding:0 52px!important;
  position:sticky!important;
  top:0!important;
  z-index:15!important;
  display:flex!important;
  align-items:stretch!important;
  gap:32px!important;
  background:rgba(243,239,229,.96)!important;
  -webkit-backdrop-filter:blur(16px)!important;
  backdrop-filter:blur(16px)!important;
  border-bottom:1px solid rgba(0,46,32,.12)!important
}
.timeline-example-tabs button{position:relative!important;border:0!important;background:transparent!important;color:rgba(0,46,32,.48)!important}
.timeline-example-tabs button.active,.timeline-example-tabs button[aria-selected="true"]{color:#002e20!important}
.timeline-example-tabs button.active::after,.timeline-example-tabs button[aria-selected="true"]::after{
  content:""!important;
  position:absolute!important;
  right:0!important;
  bottom:0!important;
  left:0!important;
  height:2px!important;
  background:#002e20!important
}
.timeline-example-panels{max-width:1440px!important;margin:0 auto!important;padding:100px 64px 120px!important}
.timeline-example-panel{max-width:1312px!important;margin:0 auto!important}
.timeline-example-timeline{display:grid!important;grid-template-columns:240px minmax(0,1fr)!important;gap:80px!important}

@media(max-width:1050px){
  .site-footer.site-footer-figma{--footer-inner:min(900px,calc(100vw - 64px));--footer-right:320px;height:650px!important;min-height:650px!important;padding-top:64px!important}
  .site-footer-figma .footer-content,.site-footer-figma .footer-legal{gap:36px!important}
  .site-footer-figma .footer-links,.site-footer-figma .footer-legal nav{column-gap:36px!important}
}

@media(max-width:680px){
  .site-footer.site-footer-figma{--footer-inner:calc(100vw - 40px);height:760px!important;min-height:760px!important;padding-top:64px!important}
  .site-footer-figma .footer-content{grid-template-columns:1fr!important;gap:48px!important}
  .site-footer-figma .footer-links{width:100%!important;grid-template-columns:1fr 1fr!important}
  .site-footer-figma .footer-wordmark{bottom:56px!important}
  .site-footer-figma .footer-legal{bottom:20px!important;grid-template-columns:1fr!important;gap:12px!important}
  .site-footer-figma .footer-legal nav{width:100%!important;grid-template-columns:auto auto!important;justify-content:start!important;gap:24px!important}
  .timeline-example-dialog{inset:6px!important;border-radius:18px!important}
  .timeline-example-close{top:14px!important;right:14px!important}
  .timeline-example-hero{min-height:320px!important;padding:68px 22px 44px!important}
  .timeline-example-hero img{width:80px!important;height:80px!important}
  .timeline-example-hero h2{font-size:48px!important}
  .timeline-example-tabs{padding:0 20px!important;gap:26px!important;overflow-x:auto!important}
  .timeline-example-panels{padding:52px 20px 80px!important}
  .timeline-example-timeline{display:block!important}
  .timeline-example-chapters{position:static!important;margin-bottom:44px!important;display:flex!important;overflow-x:auto!important;gap:24px!important}
}

/* Final Figma-accurate closing system */
body.timeline-modal-open{overflow:hidden!important}
.faq{position:relative!important;z-index:2!important;margin-bottom:0!important;background:#f3efe5!important}

.final-cta.final-cta-figma{
  width:100vw!important;max-width:none!important;
  margin:-1px 0 0 calc(50% - 50vw)!important;
  position:relative!important;isolation:isolate!important;overflow:hidden!important;
  background:radial-gradient(110% 86% at 50% 0%,#f3efe5 0%,rgba(243,239,229,.99) 20%,rgba(227,230,220,.94) 40%,rgba(159,180,166,.88) 62%,rgba(55,98,77,.96) 81%,#002e20 100%)!important
}
.final-cta.final-cta-figma::before{
  content:""!important;display:block!important;position:absolute!important;
  inset:-120px -10vw auto!important;height:520px!important;z-index:0!important;
  pointer-events:none!important;
  background:linear-gradient(180deg,#f3efe5 0%,rgba(243,239,229,.995) 34%,rgba(224,227,217,.84) 68%,rgba(170,190,175,0) 100%)!important;
  filter:blur(34px)!important
}
.final-cta-figma .final-cta-stage{position:relative!important;z-index:1!important}

.site-footer.site-footer-figma{
  --footer-inner:min(1192px,calc(100vw - 96px));
  --footer-right:456px;
  height:720px!important;min-height:720px!important;padding:88px 0 0!important;overflow:hidden!important
}
.site-footer-figma .footer-content,.site-footer-figma .footer-legal{
  width:var(--footer-inner)!important;
  grid-template-columns:minmax(0,1fr) var(--footer-right)!important;
  gap:72px!important
}
.site-footer-figma .footer-links,.site-footer-figma .footer-legal nav{
  width:var(--footer-right)!important;display:grid!important;
  grid-template-columns:1fr 1fr!important;column-gap:64px!important
}
.site-footer-figma .footer-wordmark{
  width:100vw!important;height:min(30.3302vw,436.755px)!important;
  aspect-ratio:auto!important;left:0!important;right:0!important;bottom:0!important;
  overflow:visible!important
}
.site-footer-figma .footer-wordmark img{
  width:100%!important;height:100%!important;display:block!important;
  object-fit:fill!important;opacity:1!important;filter:none!important;transform:none!important
}
.site-footer-figma .footer-legal{bottom:30px!important}

.timeline-example-modal[hidden]{display:none!important}
.timeline-example-modal{position:fixed!important;inset:0!important;z-index:10000!important}
.timeline-example-backdrop{
  position:absolute!important;inset:0!important;background:rgba(0,0,0,.52)!important;
  -webkit-backdrop-filter:blur(4px)!important;backdrop-filter:blur(4px)!important
}
.timeline-example-dialog{
  position:absolute!important;inset:12px!important;border-radius:24px!important;
  overflow:hidden!important;background:#f3efe5!important;box-shadow:0 28px 96px rgba(0,0,0,.3)!important
}
.timeline-example-close{position:fixed!important;top:32px!important;right:32px!important;z-index:10020!important}
.timeline-example-scroll{height:100%!important;overflow:auto!important}
.timeline-example-hero{
  min-height:396px!important;padding:56px 80px!important;
  display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
  gap:16px!important;text-align:center!important;background:#022c22!important;color:#fff!important
}
.timeline-example-hero::before,.timeline-example-hero::after{content:none!important}
.timeline-example-hero img{width:100px!important;height:100px!important;border-radius:50%!important;object-fit:cover!important}
.timeline-example-hero h2{font-family:"Instrument Serif",serif!important;font-size:72px!important;line-height:1!important;margin:0!important;color:#fff!important}
.timeline-example-hero p{max-width:600px!important;margin:0!important;color:rgba(255,255,255,.7)!important;font-size:16px!important;line-height:1.5!important}
.timeline-example-tabs{
  min-height:64px!important;padding:0 52px!important;position:sticky!important;top:0!important;z-index:15!important;
  display:flex!important;align-items:stretch!important;gap:32px!important;
  background:rgba(243,239,229,.96)!important;-webkit-backdrop-filter:blur(16px)!important;backdrop-filter:blur(16px)!important;
  border-bottom:1px solid rgba(0,46,32,.12)!important
}
.timeline-example-tabs button{position:relative!important;border:0!important;background:transparent!important;color:rgba(0,46,32,.48)!important}
.timeline-example-tabs button.active,.timeline-example-tabs button[aria-selected="true"]{color:#002e20!important}
.timeline-example-tabs button.active::after,.timeline-example-tabs button[aria-selected="true"]::after{
  content:""!important;position:absolute!important;right:0!important;bottom:0!important;left:0!important;height:2px!important;background:#002e20!important
}
.timeline-example-panels{max-width:1440px!important;margin:0 auto!important;padding:100px 64px 120px!important}
.timeline-example-panel{max-width:1312px!important;margin:0 auto!important}
.timeline-example-timeline{display:grid!important;grid-template-columns:240px minmax(0,1fr)!important;gap:80px!important}

@media(max-width:1050px){
  .site-footer.site-footer-figma{--footer-inner:min(900px,calc(100vw - 64px));--footer-right:320px;height:650px!important;min-height:650px!important;padding-top:64px!important}
  .site-footer-figma .footer-content,.site-footer-figma .footer-legal{gap:36px!important}
  .site-footer-figma .footer-links,.site-footer-figma .footer-legal nav{column-gap:36px!important}
}
@media(max-width:680px){
  .site-footer.site-footer-figma{--footer-inner:calc(100vw - 40px);height:760px!important;min-height:760px!important;padding-top:64px!important}
  .site-footer-figma .footer-content{grid-template-columns:1fr!important;gap:48px!important}
  .site-footer-figma .footer-links{width:100%!important;grid-template-columns:1fr 1fr!important}
  .site-footer-figma .footer-wordmark{bottom:56px!important}
  .site-footer-figma .footer-legal{bottom:20px!important;grid-template-columns:1fr!important;gap:12px!important}
  .site-footer-figma .footer-legal nav{width:100%!important;grid-template-columns:auto auto!important;justify-content:start!important;gap:24px!important}
  .timeline-example-dialog{inset:6px!important;border-radius:18px!important}
  .timeline-example-close{top:14px!important;right:14px!important}
  .timeline-example-hero{min-height:320px!important;padding:68px 22px 44px!important}
  .timeline-example-hero img{width:80px!important;height:80px!important}
  .timeline-example-hero h2{font-size:48px!important}
  .timeline-example-tabs{padding:0 20px!important;gap:26px!important;overflow-x:auto!important}
  .timeline-example-panels{padding:52px 20px 80px!important}
  .timeline-example-timeline{display:block!important}
  .timeline-example-chapters{position:static!important;margin-bottom:44px!important;display:flex!important;overflow-x:auto!important;gap:24px!important}
}

.hero-pattern{display:none}

.hero-gallery{
  gap:32px;
  padding-inline:48px
}

/* How it works: exact spacing and content styling from Figma node 399:140. */
.how{
  gap:72px
}

.how-intro{
  gap:12px
}

.how-intro h2{
  margin:0
}

.how-card+.how-card{
  margin-top:180px
}

.how-text{
  position:relative
}

.how-text h3,
.how-text>p{
  position:relative;
  z-index:1
}

.how-text>p{
  text-wrap:pretty
}

.how-card:nth-child(2) .how-text h3{
  width:100%
}

.how-card:nth-child(3) .how-text h3{
  width:446px
}

/* Marks sit on the Figma target words and scale with type */
.how-mark{
  position:relative;
  display:inline-block;
  white-space:nowrap;
  vertical-align:baseline;
  isolation:isolate;
  z-index:0
}

.how-mark-scribble,
.how-mark-02{
  isolation:isolate;
  z-index:0
}

.how-mark-scribble::before,
.how-mark-02::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:108%;
  height:.95em;
  transform:translate(-50%,-52%);
  background-repeat:no-repeat;
  background-position:center;
  background-size:100% 100%;
  pointer-events:none;
  z-index:-1
}

.how-mark-scribble::before{
  background-image:url("/marketing/how-figma/01.svg")
}

.how-mark-02::before{
  width:112%;
  height:1.05em;
  background-image:url("/marketing/how-figma/card-02-circle.svg")
}

.how-mark-01,
.how-mark-03{
  padding-bottom:.08em
}

.how-mark-01::after,
.how-mark-03::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:.18em;
  background-repeat:no-repeat;
  background-position:center bottom;
  background-size:100% 100%;
  pointer-events:none;
  z-index:-1
}

.how-mark-01::after{
  height:.16em;
  background-image:url("/marketing/how-figma/card-01-underline.svg");
  transform:scaleY(-1)
}

.how-mark-03::after{
  left:-4%;
  width:108%;
  height:.22em;
  top:auto;
  bottom:.04em;
  margin-top:0;
  background-image:url("/marketing/how-figma/card-03-underline.svg");
  transform:rotate(6.05deg);
  transform-origin:center bottom
}

/* Legacy absolute scribble imgs (if any remain) stay inert */
.how-scribble,
.how-title-mark{
  display:none
}

.how-card:first-child .checks{
  color:#022c22
}

.formats>span{
  display:block;
  margin-bottom:12px;
  color:#1a2e05;
  font-size:12px;
  font-weight:600;
  line-height:12px;
  letter-spacing:.48px;
  text-transform:uppercase;
  opacity:.7
}

.formats>div{
  display:flex;
  align-items:center;
  gap:8px
}

.formats b{
  min-height:36px;
  padding:8px 12px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:#1a2e05;
  background:rgba(63,98,18,.08);
  border-radius:52px;
  font-size:14px;
  font-weight:400;
  line-height:1;
  white-space:nowrap
}

.formats b img{
  width:20px;
  height:20px;
  flex:none;
  object-fit:contain
}

/* A multi-turn iMessage thread resolves into a composed Heldearly memory. */
.how-media-conversation{
  position:relative;
  padding:24px;
  overflow:hidden;
  background:
    radial-gradient(circle at 12% 8%,rgba(190,242,100,.22),transparent 32%),
    #f3efe5
}

.story-discovery{
  position:relative;
  align-self:stretch;
  justify-self:stretch;
  width:100%;
  height:100%;
  min-height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px
}

.story-discovery-phone{
  width:406px;
  height:410px;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(2,44,34,.1);
  border-radius:24px;
  background:rgba(255,255,255,.96);
  box-shadow:0 22px 55px rgba(2,44,34,.1)
}

.story-discovery-header{
  height:68px;
  padding:10px 18px;
  display:grid;
  grid-template-columns:28px 38px 1fr;
  align-items:center;
  gap:10px;
  border-bottom:1px solid rgba(10,10,10,.07);
  background:rgba(255,255,255,.88)
}

.story-discovery-back{
  color:#007aff;
  font-size:32px;
  font-weight:300;
  line-height:1
}

.story-discovery-avatar{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  color:#fff;
  border-radius:50%;
  background:#064e3b;
  font-family:var(--serif);
  font-size:22px
}

.story-discovery-person{
  display:flex;
  flex-direction:column;
  color:#0a0a0a;
  font-size:13px;
  font-weight:600;
  line-height:1.25
}

.story-discovery-person small{
  color:#737373;
  font-size:10px;
  font-weight:400
}

.story-discovery-thread{
  height:342px;
  padding:18px 16px 14px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  overflow:hidden;
  transition:opacity .55s ease,transform .55s cubic-bezier(.22,1,.36,1)
}

.story-message{
  max-width:78%;
  max-height:0;
  margin:0;
  padding:0 13px;
  overflow:hidden;
  border-radius:18px;
  font-size:13px;
  line-height:1.38;
  opacity:0;
  transform:translateY(18px) scale(.97);
  transition:
    max-height .58s cubic-bezier(.22,1,.36,1),
    margin .58s cubic-bezier(.22,1,.36,1),
    padding .58s cubic-bezier(.22,1,.36,1),
    opacity .4s ease .1s,
    transform .58s cubic-bezier(.22,1,.36,1)
}

.story-message.is-visible{
  max-height:92px;
  margin-bottom:10px;
  padding-block:9px;
  opacity:1;
  transform:none
}

.story-message-heldearly{
  align-self:flex-start;
  color:#111;
  background:#e9e9eb;
  border-bottom-left-radius:6px
}

.story-message-elaine{
  align-self:flex-end;
  color:#fff;
  background:#147efb;
  border-bottom-right-radius:6px
}

.story-memory-preview{
  position:absolute;
  inset:0;
  width:min(340px,calc(100% - 48px));
  height:max-content;
  max-height:calc(100% - 32px);
  margin:auto;
  padding:32px 28px 28px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:28px;
  border:0;
  border-radius:24px;
  background:#fff;
  box-shadow:0 18px 48px rgba(0,0,0,.1);
  text-align:center;
  opacity:0;
  transform:scale(.94);
  pointer-events:none;
  transition:opacity .62s ease,transform .78s cubic-bezier(.16,1,.3,1)
}

.story-memory-art{
  position:relative;
  width:168px;
  height:152px;
  flex:none;
  overflow:hidden
}

.story-memory-art img{
  display:block;
  width:111.11%;
  height:120.48%;
  position:absolute;
  left:-5.56%;
  top:-10.24%;
  max-width:none;
  object-fit:fill;
  pointer-events:none
}

.story-memory-copy{
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px
}

.story-memory-copy .eyebrow{
  margin:0;
  color:#65a30d;
  font-size:12px;
  font-weight:600;
  line-height:1;
  letter-spacing:.04em;
  text-transform:uppercase
}

.story-memory-preview h4{
  margin:0;
  color:#022c22;
  font-family:var(--serif);
  font-size:36px;
  font-weight:400;
  line-height:1.1;
  text-wrap:balance
}

.story-memory-copy>p{
  margin:0;
  max-width:260px;
  color:#064e3b;
  font-size:14px;
  line-height:1.65
}

.story-memory-meta{
  margin-top:auto;
  display:flex;
  align-items:center;
  gap:8px;
  color:#b84a21;
  font-size:10px;
  font-weight:600;
  text-transform:uppercase
}

.story-memory-meta i{
  width:3px;
  height:3px;
  border-radius:50%;
  background:currentColor
}

.story-memory-tags{
  margin-top:12px;
  display:flex;
  gap:6px
}

.story-memory-tags em{
  padding:6px 9px;
  color:#064e3b;
  border-radius:999px;
  background:rgba(4,120,87,.08);
  font-size:10px;
  font-style:normal;
  line-height:1
}

.story-discovery-status{
  display:none
}

.story-discovery-status span{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#65a30d;
  box-shadow:0 0 0 4px rgba(101,163,13,.12)
}

.story-discovery[data-story-chat]{
  gap:10px
}

.story-discovery[data-story-chat] .story-discovery-phone{
  flex:1 1 auto;
  align-self:stretch;
  width:100%;
  height:100%;
  min-height:280px;
  border:0;
  border-radius:12px;
  background:transparent;
  box-shadow:none
}

.story-chat{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
  padding:28px 22px;
  overflow:visible;
  font-family:-apple-system,"SF Pro Text",Inter,sans-serif;
  transition:opacity .55s ease,transform .55s cubic-bezier(.22,1,.36,1)
}

.story-chat-row{
  display:flex;
  width:100%;
  position:relative
}

.story-chat-row.is-them{justify-content:flex-start}
.story-chat-row.is-me{justify-content:flex-end}

.story-chat-bubble{
  --story-chat-tail:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16.99 17.95'%3E%3Cpath fill-rule='evenodd' fill='%23000' d='M1.8 11c.99 0 1.64.31 2.97 1.24.71.5 3.45 2.6 5.72 3.85 1.96 1.08 3.64 1.82 4.06 1.85 1.26.1 1.42-1.09.93-1.73-.49-.64-1.05-1.47-1.27-1.92-.48-1.01-.63-1.54-.63-3.05 0-1.86 1.32-3.24 2.36-4.16.09-.08.21-.18.35-.29.24-.19.47-.38.7-.57V0H0v11h1.8z'/%3E%3C/svg%3E");
  position:relative;
  box-sizing:border-box;
  flex:0 1 auto;
  width:fit-content;
  max-width:min(280px,82%);
  margin:0;
  padding:9px 12px;
  border-radius:20px;
  font-size:17px;
  font-weight:400;
  line-height:22px;
  letter-spacing:-0.01em;
  text-align:left;
  overflow:visible;
  opacity:0;
  transform:translateY(12px) scale(.55);
  transform-origin:bottom left
}

.story-chat-bubble::before,
.story-chat-typing::before{
  content:"";
  position:absolute;
  bottom:-7px;
  width:17px;
  height:18px;
  pointer-events:none;
  background:inherit;
  -webkit-mask:var(--story-chat-tail) center / 100% 100% no-repeat;
  mask:var(--story-chat-tail) center / 100% 100% no-repeat
}

.story-chat-row.is-them .story-chat-bubble::before,
.story-chat-typing::before{
  left:7px;
  transform:scaleX(-1)
}

.story-chat-row.is-me .story-chat-bubble::before{
  right:7px
}

.story-chat-row.is-me .story-chat-bubble{
  color:#fff;
  background:#007aff;
  transform-origin:bottom right
}

.story-chat-row.is-them .story-chat-bubble{
  color:#000;
  background:#fff;
  text-wrap:pretty
}

.story-chat-typing{
  --story-chat-tail:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16.99 17.95'%3E%3Cpath fill-rule='evenodd' fill='%23000' d='M1.8 11c.99 0 1.64.31 2.97 1.24.71.5 3.45 2.6 5.72 3.85 1.96 1.08 3.64 1.82 4.06 1.85 1.26.1 1.42-1.09.93-1.73-.49-.64-1.05-1.47-1.27-1.92-.48-1.01-.63-1.54-.63-3.05 0-1.86 1.32-3.24 2.36-4.16.09-.08.21-.18.35-.29.24-.19.47-.38.7-.57V0H0v11h1.8z'/%3E%3C/svg%3E");
  position:absolute;
  left:0;
  top:0;
  z-index:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  width:62px;
  height:36px;
  border-radius:18px;
  background:#fff;
  opacity:0;
  transform:translateY(12px) scale(.55);
  transform-origin:bottom left
}

.story-chat-typing i{
  width:9px;
  height:9px;
  border-radius:50%;
  background:#8e8e93;
  opacity:.35
}

.story-discovery.is-playing .story-chat-bubble,
.story-discovery.is-static .story-chat-bubble{
  animation:story-chat-pop .47s cubic-bezier(.34,1.3,.64,1) var(--pop,0ms) forwards
}

.story-discovery.is-playing .story-chat-typing{
  animation:
    story-chat-pop .47s cubic-bezier(.34,1.3,.64,1) var(--lead,0ms) forwards,
    story-chat-hide .01s linear var(--pop,0ms) forwards
}

.story-discovery.is-playing .story-chat-typing i{
  animation:story-chat-dot .9s ease-in-out var(--lead,0ms) infinite
}

.story-discovery.is-playing .story-chat-typing i:nth-child(2){animation-delay:calc(var(--lead,0ms) + .12s)}
.story-discovery.is-playing .story-chat-typing i:nth-child(3){animation-delay:calc(var(--lead,0ms) + .24s)}

.story-discovery.is-static .story-chat-typing{display:none}
.story-discovery.is-static .story-chat-bubble{opacity:1;transform:none;animation:none}

@keyframes story-chat-pop{
  0%{opacity:0;transform:translateY(12px) scale(.55)}
  58%{opacity:1;transform:translateY(-1px) scale(1.04)}
  100%{opacity:1;transform:none}
}

@keyframes story-chat-hide{
  to{opacity:0;visibility:hidden}
}

@keyframes story-chat-dot{
  0%,100%{opacity:.35;transform:none}
  45%{opacity:1;transform:translateY(-1px)}
}

.story-discovery[data-story-chat] .story-memory-preview{
  inset:0
}

.story-discovery[data-stage="5"] .story-discovery-thread,
.story-discovery[data-stage="5"] .story-discovery-chat,
.story-discovery[data-stage="5"] .story-chat{
  opacity:.08;
  transform:scale(.96)
}

.story-discovery[data-stage="5"] .story-memory-preview{
  opacity:1;
  transform:none
}

@media(max-width:680px){
  .hero-copy>p:not(.eyebrow){width:auto}
  .hero-gallery{gap:24px;padding-inline:20px}
  .how{gap:52px}
  .how-card+.how-card{margin-top:0}
  .how-card:nth-child(3) .how-text h3{width:auto}
  .how-media-conversation{padding:12px}
  .story-discovery{gap:7px}
  .story-discovery-phone{width:min(100%,360px);height:270px;border-radius:18px}
  .story-discovery-header{height:52px;padding:7px 12px;grid-template-columns:20px 32px 1fr;gap:8px}
  .story-discovery-back{font-size:26px}
  .story-discovery-avatar{width:32px;height:32px;font-size:18px}
  .story-discovery-thread{height:218px;padding:9px 10px 7px}
  .story-message{font-size:10px;line-height:1.3}
  .story-message.is-visible{max-height:58px;margin-bottom:6px;padding:6px 9px}
  .story-memory-preview{width:min(280px,calc(100% - 28px));padding:22px 20px;gap:18px;border-radius:20px}
  .story-discovery[data-story-video] .story-memory-preview,
  .story-discovery[data-story-chat] .story-memory-preview{inset:0}
  .story-chat{padding:16px 14px;gap:6px}
  .story-chat-bubble{max-width:min(240px,84%);font-size:15px;line-height:20px}
  .story-memory-art{width:132px;height:120px}
  .story-memory-preview h4{font-size:28px}
  .story-memory-copy>p{font-size:12px}
}

/* --------------------------------------------------------------------------
   Figma 493:423: seamless FAQ → CTA → footer and timeline example modal.
   These overrides intentionally live last so the exported composition wins.
   -------------------------------------------------------------------------- */

.final-cta.final-cta-figma{
  width:100vw;
  max-width:none;
  min-height:802px;
  height:auto;
  margin:-1px 0 0 calc(50% - 50vw);
  padding:0;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  color:#fff;
  background:
    linear-gradient(180deg,
      #f3efe5 0%,
      #f3efe5 1%,
      rgba(237,235,226,.98) 8%,
      rgba(213,217,207,.98) 20%,
      rgba(167,183,170,.99) 34%,
      rgba(103,135,120,.99) 50%,
      #315f4e 65%,
      #124534 79%,
      #002e20 100%)
}

.final-cta.final-cta-figma::before{content:none!important}

.final-cta-figma .final-cta-stage{
  width:min(1440px,100vw);
  min-height:802px;
  height:802px;
  margin:0 auto;
  position:relative;
  overflow:visible
}

.final-cta-memory-map{
  width:166.99px;
  height:158.357px;
  left:192px;
  top:523px
}

.final-cta-memory-map img{
  width:143.125px;
  height:131.993px;
  transform:rotate(-11.74deg)
}

.final-cta-memory-chair{
  width:295.194px;
  height:295.194px;
  left:auto;
  right:95px;
  top:406.49px
}

.final-cta-memory-chair img{
  width:255.815px;
  height:255.815px;
  transform:rotate(9.68deg)
}

.site-footer.site-footer-figma{
  --footer-inner:min(1192px,calc(100vw - 40px));
  width:100vw;
  max-width:none;
  min-height:560px;
  height:auto;
  margin:0 0 0 calc(50% - 50vw);
  padding:80px 0 38px;
  position:relative;
  display:block;
  overflow:hidden;
  border:0!important;
  color:#fff;
  background:
    radial-gradient(88.64% 60.94% at 50% 100%,rgba(217,249,157,.12) 0%,rgba(6,95,70,0) 100%),
    #002e20
}

.site-footer.site-footer-figma::before,
.site-footer.site-footer-figma::after{content:none!important}

.site-footer-figma .footer-content,
.site-footer-figma .footer-legal{
  width:var(--footer-inner);
  max-width:none;
  margin:0 auto;
  padding:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) 363px;
  column-gap:52px
}

.site-footer-figma .footer-content{
  height:auto;
  position:relative;
  z-index:2;
  align-items:start
}

.site-footer-figma .footer-tagline{
  width:max-content;
  max-width:100%;
  margin:0;
  color:#fff;
  font-family:var(--serif);
  font-size:40px;
  font-weight:400;
  line-height:1.1;
  letter-spacing:-.02em
}

.site-footer-figma .footer-links{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:52px
}

.site-footer-figma .footer-links nav{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:24px;
  color:#fff;
  font-size:20px;
  font-weight:500;
  line-height:1.2
}

.site-footer-figma .footer-wordmark{
  width:100%;
  height:auto;
  margin:0;
  position:absolute;
  z-index:0;
  left:0;
  right:0;
  bottom:0;
  overflow:visible;
  pointer-events:none
}

.site-footer-figma .footer-wordmark img{
  width:100%;
  height:auto;
  max-width:none;
  position:static;
  display:block;
  object-fit:contain;
  object-position:center bottom
}

.site-footer-figma .footer-legal{
  position:absolute;
  z-index:3;
  left:50%;
  right:auto;
  bottom:32px;
  transform:translateX(-50%);
  align-items:end;
  border:0;
  color:rgba(255,255,255,.32);
  font-size:14px;
  line-height:1.4
}

.site-footer-figma .footer-legal nav{
  width:auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:52px;
  justify-content:stretch
}

.site-footer-figma .footer-legal nav a{white-space:nowrap}

[hidden]{display:none!important}
body.timeline-modal-open{overflow:hidden}

.timeline-example-modal{
  position:fixed;
  z-index:4000;
  inset:0
}

.timeline-example-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.52);
  -webkit-backdrop-filter:blur(4px);
  backdrop-filter:blur(4px)
}

.timeline-example-dialog{
  position:fixed;
  z-index:1;
  inset:12px;
  overflow:hidden;
  border-radius:24px;
  background:#f3efe5;
  box-shadow:0 24px 80px rgba(0,0,0,.32)
}

.timeline-example-scroll{
  width:100%;
  height:100%;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  scroll-behavior:smooth
}

.timeline-example-close{
  width:36px;
  height:36px;
  padding:0;
  position:fixed;
  z-index:4;
  top:20px;
  right:20px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:50%;
  color:#002e20;
  background:#fff;
  box-shadow:0 4px 18px rgba(0,0,0,.14);
  cursor:pointer
}

.timeline-example-close:hover{transform:scale(1.04)}
.timeline-example-close:focus-visible{outline:2px solid #c6fc82;outline-offset:3px}

.timeline-example-hero{
  min-height:380px;
  padding:80px 56px;
  position:relative;
  display:grid;
  align-content:end;
  grid-template-columns:100px minmax(0,1fr);
  grid-template-rows:auto auto;
  column-gap:28px;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(58% 110% at 77% 40%,rgba(198,252,130,.12),transparent 65%),
    #002e20
}

.timeline-example-hero::after{
  content:"";
  width:400px;
  height:400px;
  position:absolute;
  right:5%;
  bottom:-180px;
  border:58px solid rgba(0,118,82,.32);
  border-radius:48% 52% 58% 42%;
  transform:rotate(-18deg)
}

.timeline-example-hero img{
  width:100px;
  height:100px;
  grid-row:1 / span 2;
  align-self:center;
  border-radius:50%;
  object-fit:cover
}

.timeline-example-hero h2{
  margin:0;
  position:relative;
  z-index:1;
  font-family:var(--serif);
  font-size:72px;
  font-weight:400;
  line-height:1;
  letter-spacing:-.03em
}

.timeline-example-hero p{
  margin:10px 0 0;
  position:relative;
  z-index:1;
  color:rgba(255,255,255,.66);
  font-size:16px
}

.timeline-example-tabs{
  min-height:64px;
  padding:0 56px;
  position:sticky;
  z-index:3;
  top:0;
  display:flex;
  align-items:end;
  gap:32px;
  border-bottom:1px solid rgba(0,46,32,.12);
  background:rgba(243,239,229,.94);
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px)
}

.timeline-example-tabs button{
  min-height:64px;
  padding:4px 0 14px;
  position:relative;
  border:0;
  color:rgba(0,46,32,.46);
  background:none;
  font:600 14px/1 var(--sans);
  cursor:pointer
}

.timeline-example-tabs button::after{
  content:"";
  height:2px;
  position:absolute;
  right:0;
  bottom:-1px;
  left:0;
  background:#002e20;
  transform:scaleX(0);
  transition:transform .24s ease
}

.timeline-example-tabs button.active{color:#002e20}
.timeline-example-tabs button.active::after{transform:scaleX(1)}
.timeline-example-tabs button span{margin-left:5px;font-size:11px;opacity:.58}

.timeline-example-panels{padding:64px 56px 120px}
.timeline-example-panel{max-width:1192px;margin:0 auto}

.timeline-example-timeline{
  display:grid;
  grid-template-columns:220px minmax(0,1fr);
  gap:64px;
  align-items:start
}

.timeline-example-chapters{
  padding-left:18px;
  position:sticky;
  top:108px;
  display:flex;
  flex-direction:column;
  gap:20px;
  border-left:1px solid rgba(0,46,32,.18)
}

.timeline-example-chapters a{
  color:rgba(0,46,32,.42);
  font-size:14px;
  font-weight:600;
  line-height:1.3;
  text-decoration:none
}

.timeline-example-chapters a.active{color:#002e20}
.timeline-example-chapters span{display:block;margin-top:3px;color:#b76f54;font-size:11px;font-weight:600}

.timeline-example-stories{min-width:0}
.timeline-example-stories article{padding:0 0 96px;scroll-margin-top:104px}
.timeline-example-stories article+article{padding-top:24px;border-top:1px solid rgba(0,46,32,.12)}
.timeline-example-kicker{margin:0 0 10px!important;color:#b76f54!important;font-size:12px!important;font-weight:700!important;letter-spacing:.04em;text-transform:uppercase}

.timeline-example-stories h3{
  max-width:840px;
  margin:0 0 24px;
  color:#111;
  font-family:var(--serif);
  font-size:clamp(46px,5vw,72px);
  font-weight:400;
  line-height:1;
  letter-spacing:-.03em
}

.timeline-example-stories p{
  max-width:780px;
  margin:0 0 22px;
  color:#555;
  font-size:16px;
  line-height:1.75
}

.timeline-example-stories .timeline-example-lede{color:#171717;font-size:20px;line-height:1.5}

.timeline-example-stories figure,
.timeline-example-album-grid figure{
  margin:34px 0;
  overflow:hidden;
  border:6px solid #fff;
  border-radius:18px;
  background:#fff;
  box-shadow:0 12px 36px rgba(0,46,32,.08)
}

.timeline-example-stories figure img,
.timeline-example-album-grid figure img{width:100%;display:block;border-radius:12px;aspect-ratio:16/9;object-fit:cover}
.timeline-example-stories figcaption,
.timeline-example-album-grid figcaption{padding:12px 14px 10px;color:#555;font-size:14px}

.timeline-example-album-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:28px
}

.timeline-example-album-grid figure{margin:0}

.timeline-example-audio{
  min-height:300px;
  padding:32px;
  display:grid;
  grid-template-columns:1fr auto;
  align-content:center;
  gap:20px;
  border-radius:18px;
  color:#fff;
  background:#005b43
}

.timeline-example-audio span{color:#c6fc82;font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}
.timeline-example-audio button{width:48px;height:48px;grid-row:1 / span 2;grid-column:2;align-self:center;border:0;border-radius:50%;color:#002e20;background:#c6fc82;cursor:pointer}
.timeline-example-audio div{height:3px;border-radius:2px;background:linear-gradient(90deg,#c6fc82 56%,rgba(255,255,255,.24) 56%)}
.timeline-example-audio p{grid-column:1 / -1;margin:0;font-family:var(--serif);font-size:32px;line-height:1.1}

.timeline-example-thought-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px
}

.timeline-example-thought-grid article{min-height:300px;padding:34px;display:flex;flex-direction:column;border-radius:18px;color:#fff;background:#005b43}
.timeline-example-thought-grid article:nth-child(even){color:#002e20;background:#fff}
.timeline-example-thought-grid p{margin:0 0 12px;color:#b76f54;font-size:12px;font-weight:700;text-transform:uppercase}
.timeline-example-thought-grid h3{margin:0;font-family:var(--serif);font-size:48px;font-weight:400}
.timeline-example-thought-grid blockquote{margin:auto 0 0;font-family:var(--serif);font-size:26px;font-style:italic;line-height:1.25}

.timeline-example-footer{padding:72px 56px;text-align:center;color:rgba(255,255,255,.6);background:#002e20}
.timeline-example-footer img{width:150px;max-height:44px;margin:0 auto 20px;display:block}
.timeline-example-footer p{margin:0;font-size:14px}

@media(max-width:1050px){
  .final-cta-figma .final-cta-stage{min-height:700px;height:700px}
  .final-cta-memory-map{width:120px;height:112px;left:10px;top:510px}
  .final-cta-memory-map img{width:102px;height:94px}
  .final-cta-memory-chair{width:190px;height:190px;right:-20px;top:452px}
  .final-cta-memory-chair img{width:164px;height:164px}

  .site-footer.site-footer-figma{min-height:520px;padding-top:64px}
  .site-footer-figma .footer-content,
  .site-footer-figma .footer-legal{grid-template-columns:minmax(0,1fr) 320px;column-gap:36px}
  .site-footer-figma .footer-links,
  .site-footer-figma .footer-legal nav{gap:32px}

  .timeline-example-hero{padding:64px 36px}
  .timeline-example-tabs{padding-inline:36px}
  .timeline-example-panels{padding:48px 36px 96px}
  .timeline-example-timeline{grid-template-columns:180px minmax(0,1fr);gap:36px}
}

@media(max-width:680px){
  .final-cta.final-cta-figma{min-height:620px}
  .final-cta-figma .final-cta-stage{min-height:620px;height:620px}
  .final-cta-memory-map{width:88px;height:82px;left:-12px;top:500px}
  .final-cta-memory-map img{width:76px;height:70px}
  .final-cta-memory-chair{width:118px;height:118px;right:-18px;top:468px}
  .final-cta-memory-chair img{width:102px;height:102px}

  .site-footer.site-footer-figma{
    --footer-inner:calc(100vw - 40px);
    min-height:640px;
    padding:64px 0 28px
  }

  .site-footer-figma .footer-content{
    grid-template-columns:1fr;
    gap:48px
  }

  .site-footer-figma .footer-links{gap:24px}
  .site-footer-figma .footer-links nav{font-size:16px}
  .site-footer-figma .footer-wordmark{bottom:66px}
  .site-footer-figma .footer-legal{
    position:absolute;
    bottom:20px;
    grid-template-columns:1fr;
    gap:14px;
    transform:translateX(-50%);
    font-size:11px
  }
  .site-footer-figma .footer-legal nav{grid-template-columns:auto auto;justify-content:start;gap:20px}

  .timeline-example-dialog{inset:6px;border-radius:18px}
  .timeline-example-close{top:12px;right:12px}
  .timeline-example-hero{min-height:320px;padding:74px 22px 48px;grid-template-columns:72px minmax(0,1fr);column-gap:18px}
  .timeline-example-hero img{width:72px;height:72px}
  .timeline-example-hero h2{font-size:48px}
  .timeline-example-hero p{font-size:13px}
  .timeline-example-tabs{min-height:58px;padding-inline:22px;gap:22px;overflow-x:auto}
  .timeline-example-tabs button{min-height:58px;white-space:nowrap}
  .timeline-example-panels{padding:36px 22px 72px}
  .timeline-example-timeline{display:block}
  .timeline-example-chapters{margin:0 0 44px;position:static;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;overflow-x:auto;border-left:0}
  .timeline-example-stories h3{font-size:46px}
  .timeline-example-stories .timeline-example-lede{font-size:18px}
  .timeline-example-album-grid,
  .timeline-example-thought-grid{grid-template-columns:1fr}
  .timeline-example-footer{padding:56px 22px}
}

@media(prefers-reduced-motion:reduce){
  .story-message,
  .story-discovery-thread,
  .story-discovery-chat,
  .story-chat,
  .story-chat-bubble,
  .story-chat-typing,
  .story-memory-preview{transition:none;animation:none}
}

/* Pricing exported from Figma node 475:2670. */
.pricing.pricing-single{
  min-height:1080px;
  height:auto;
  padding:152px 124px;
  gap:40px;
  background:var(--paper)
}

.pricing-single .pricing-intro{
  width:100%;
  gap:12px
}

.pricing-single .pricing-intro .eyebrow{
  color:#65a30d;
  font-size:12px;
  line-height:12px;
  letter-spacing:.48px
}

.pricing-single .pricing-intro h2{
  width:706px;
  margin:0;
  color:#022c22;
  font-size:72px;
  line-height:1
}

.pricing-single .pricing-intro>p:last-of-type{
  width:460px;
  margin:0;
  color:#404040;
  font-size:14px;
  line-height:1.65
}

.pricing-card{
  width:381.333px;
  padding:32px;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:52px;
  border:.5px solid #e5e5e5;
  border-radius:24px;
  background:#fff
}

.pricing-version-panels{
  width:100%;
  min-height:590px;
  display:grid;
  place-items:start center
}

.pricing-version-panel{
  width:100%
}

.pricing-version-panel[hidden]{
  display:none
}

.pricing-version-panel.active{
  display:flex;
  justify-content:center;
  animation:pricing-panel-in .32s ease both
}

@keyframes pricing-panel-in{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:translateY(0)}
}

.pricing-toggle{
  position:relative;
  width:100%;
  padding:2px;
  display:flex;
  gap:4px;
  border-radius:555px;
  background:#f5f5f5
}

.pricing-toggle::before{
  content:"";
  position:absolute;
  z-index:0;
  top:2px;
  bottom:2px;
  left:2px;
  width:calc((100% - 12px) / 3);
  border-radius:555px;
  background:#fff;
  box-shadow:0 1px 3px rgba(10,10,10,.05);
  pointer-events:none;
  transition:transform 120ms cubic-bezier(.2,0,0,1)
}

.pricing-card[data-billing="quarterly"] .pricing-toggle::before{
  transform:translateX(calc(100% + 4px))
}

.pricing-card[data-billing="annual"] .pricing-toggle::before{
  transform:translateX(calc(200% + 8px))
}

.pricing-toggle button{
  position:relative;
  z-index:1;
  min-width:0;
  padding:12px;
  display:flex;
  flex:1 1 0;
  align-items:center;
  justify-content:center;
  gap:4px;
  border:0;
  border-radius:555px;
  color:#737373;
  background:transparent;
  font-family:var(--sans);
  font-size:12px;
  font-weight:600;
  line-height:12px;
  letter-spacing:.48px;
  text-transform:uppercase;
  cursor:pointer;
  transition:color 100ms ease
}

.pricing-toggle button span{
  font-size:8px;
  letter-spacing:0
}

.pricing-toggle button.active{
  color:#0a0a0a;
  background:transparent;
  box-shadow:none
}

@media (prefers-reduced-motion: reduce){
  .pricing-toggle::before{transition:none}
}

.pricing-toggle button:focus-visible{
  outline:2px solid #047857;
  outline-offset:2px
}

.pricing-amount{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:24px;
  text-align:center;
  transition:opacity .2s ease,transform .28s ease
}

.pricing-amount p{
  margin:0;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  color:#022c22;
  font-family:var(--serif);
  font-weight:400;
  line-height:.78;
  white-space:nowrap
}

.pricing-dollars,
.pricing-cents,
.pricing-addon{
  font-variant-numeric:tabular-nums
}

.pricing-dollars{
  display:inline-block;
  font-size:100px
}

.pricing-cents{
  display:inline-block;
  margin-top:1px;
  font-size:64.5px
}

.pricing-cycle{
  color:#0a0a0a;
  font-size:14px;
  line-height:1.7
}

.pricing-card.is-updating .pricing-amount{
  opacity:.24;
  transform:translateY(4px)
}

.pricing-benefits{
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:8px;
  list-style:none;
  color:rgba(10,10,10,.7);
  font-size:14px;
  line-height:1.7
}

.pricing-benefits li{
  display:flex;
  align-items:center;
  gap:8px
}

.pricing-benefits img{
  width:20px;
  height:20px;
  flex:none
}

.pricing-benefits strong{
  color:#0a0a0a;
  font-weight:400;
  transition:opacity .2s ease
}

.pricing-card.is-updating .pricing-addon{
  opacity:.25
}

.pricing-cta{
  width:100%;
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:555px;
  color:#fff;
  background:#064e3b;
  font-size:16px;
  font-weight:500;
  line-height:1;
  transition:background-color .2s ease,transform .2s ease
}

.pricing-cta:hover{
  background:#022c22;
  transform:translateY(-1px)
}

.pricing-version-switch{
  padding:4px;
  display:flex;
  align-items:center;
  gap:4px;
  border:.5px solid #e5e5e5;
  border-radius:999px;
  background:#fff;
  box-shadow:0 10px 30px rgba(2,44,34,.06)
}

.pricing-version-switch button{
  min-width:96px;
  padding:11px 16px;
  border:0;
  border-radius:999px;
  color:#737373;
  background:transparent;
  font:600 11px/1 var(--sans);
  letter-spacing:.04em;
  text-transform:uppercase;
  cursor:pointer;
  transition:color .2s ease,background-color .2s ease
}

.pricing-version-switch button.active{
  color:#fff;
  background:#064e3b
}

.pricing-version-switch button:focus-visible{
  outline:2px solid #84cc16;
  outline-offset:2px
}

.pricing-compare{
  width:min(100%,804px);
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:40px;
  align-items:stretch
}

.pricing-compare-card{
  width:100%;
  min-height:570px;
  gap:32px
}

.pricing-compare-card .pricing-cta{
  margin-top:auto
}

.pricing-compare-featured{
  border:1px solid #84cc16;
  box-shadow:0 18px 50px rgba(2,44,34,.08)
}

.pricing-plan-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px
}

.pricing-plan-header>span{
  color:#737373;
  font-size:10px;
  line-height:1.2;
  text-transform:uppercase
}

.pricing-plan-label{
  margin:0;
  color:#022c22;
  font:400 34px/1 var(--serif)
}

.pricing-plan-header .pricing-save-badge{
  padding:7px 9px;
  border-radius:999px;
  color:#3f6212;
  background:#ecfccb;
  font-weight:600
}

.pricing-compare-card .pricing-dollars{
  font-size:84px
}

.pricing-compare-card .pricing-cents{
  font-size:54px
}

.pricing-saving{
  margin:-16px 0 0;
  color:#4d7c0f;
  font-size:12px;
  font-weight:600;
  text-align:center
}

.pricing-calculator{
  width:min(100%,820px);
  padding:24px;
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:40px;
  border:.5px solid #e5e5e5;
  border-radius:28px;
  background:#fff
}

.pricing-calculator-controls{
  padding:32px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:40px;
  border-radius:20px;
  background:#f5f3ec
}

.pricing-control-group{
  display:flex;
  flex-direction:column;
  gap:16px
}

.pricing-control-label{
  color:#022c22;
  font-size:14px;
  font-weight:600
}

.pricing-stepper{
  height:64px;
  padding:6px;
  display:grid;
  grid-template-columns:52px 1fr 52px;
  align-items:center;
  border:.5px solid #dedbd3;
  border-radius:999px;
  background:#fff
}

.pricing-stepper button{
  width:52px;
  height:52px;
  border:0;
  border-radius:50%;
  color:#064e3b;
  background:#ecfccb;
  font-size:25px;
  line-height:1;
  cursor:pointer
}

.pricing-stepper button:disabled{
  opacity:.32;
  cursor:not-allowed
}

.pricing-stepper strong{
  color:#022c22;
  font:400 32px/1 var(--serif);
  text-align:center
}

.pricing-calculator-toggle{
  background:#fff
}

.pricing-calculator-result{
  min-width:0;
  padding:24px 8px 8px;
  display:flex;
  flex-direction:column;
  gap:28px
}

.pricing-calculator-total{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  transition:opacity .18s ease,transform .24s ease
}

.pricing-calculator-total>span{
  color:#737373;
  font-size:11px;
  font-weight:600;
  letter-spacing:.05em;
  text-transform:uppercase
}

.pricing-calculator-total p{
  margin:14px 0 12px;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  color:#022c22;
  font-family:var(--serif);
  font-weight:400;
  line-height:.8
}

.pricing-calculator-dollars{
  font-size:76px;
  font-weight:400
}

.pricing-calculator-cents{
  margin-top:1px;
  font-size:48px;
  font-weight:400
}

.pricing-calculator-total small{
  align-self:flex-end;
  margin:0 0 4px 6px;
  color:#737373;
  font:12px/1 var(--sans)
}

.pricing-calculator-total em{
  color:#404040;
  font-size:13px;
  font-style:normal
}

.pricing-calculator-saving{
  margin-top:10px;
  padding:6px 9px;
  border-radius:999px;
  color:#3f6212;
  background:#ecfccb;
  font-size:10px;
  font-weight:600
}

.pricing-calculator.is-updating .pricing-calculator-total{
  opacity:.3;
  transform:translateY(3px)
}

.pricing-breakdown{
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  border-top:1px solid #e5e5e5
}

.pricing-breakdown div{
  padding:12px 0;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  border-bottom:1px solid #e5e5e5;
  color:#525252;
  font-size:12px;
  line-height:1.4
}

.pricing-breakdown dt,
.pricing-breakdown dd{
  margin:0
}

.pricing-breakdown dd{
  color:#0a0a0a;
  text-align:right
}

@media(max-width:680px){
  .pricing.pricing-single{
    min-height:0;
    padding:80px 20px
  }

  .pricing-single .pricing-intro h2,
  .pricing-single .pricing-intro>p:last-of-type{
    width:100%
  }

  .pricing-single .pricing-intro h2{
    font-size:50px
  }

  .pricing-card{
    width:min(100%,381.333px);
    padding:24px;
    gap:40px
  }

  .pricing-toggle button{
    padding:11px 8px;
    font-size:10px
  }

  .pricing-dollars{font-size:82px}
  .pricing-cents{font-size:53px}
  .pricing-benefits{font-size:13px}

  .pricing-version-panels{
    min-height:0
  }

  .pricing-compare{
    grid-template-columns:1fr;
    gap:20px
  }

  .pricing-compare-card{
    min-height:520px
  }

  .pricing-calculator{
    padding:12px;
    grid-template-columns:1fr;
    gap:12px
  }

  .pricing-calculator-controls{
    padding:24px;
    gap:28px
  }

  .pricing-calculator-result{
    padding:24px 12px 12px
  }

  .pricing-version-switch{
    width:100%
  }

  .pricing-version-switch button{
    min-width:0;
    padding-inline:8px;
    flex:1 1 0;
    font-size:9px
  }
}

@media(prefers-reduced-motion:reduce){
  .pricing-version-panel.active{animation:none}
}

/* Every memory finds its place — Figma node 399:170 */
.places{
  height:560px;
  padding:0 124px;
  grid-template-columns:466px minmax(0,1fr);
  gap:124px
}

.places-copy{
  height:560px
}

.places-intro{
  position:relative
}

.places-intro h2{
  position:relative
}

.places-title-mark{
  width:min(280px,100%);
  height:14px;
  max-width:none;
  position:absolute;
  left:0;
  top:auto;
  bottom:-.02em;
  z-index:1;
  transform:rotate(2.45deg);
  pointer-events:none
}

.places-intro>p{
  width:384px
}

.place-options{
  gap:24px
}

.place-option{
  min-height:0;
  padding:24px 0 0;
  border-top:1px solid rgba(10,10,10,.06)
}

.place-progress{
  width:100%;
  height:1px;
  min-height:0;
  left:0;
  top:-1px;
  background:transparent
}

.place-progress>span{
  width:100%;
  height:1px;
  background:#84cc16;
  transform:scaleX(0);
  transform-origin:left center
}

.place-option-copy{
  gap:2px
}

.place-option strong{
  font-size:20px;
  line-height:1;
  letter-spacing:-.4px
}

.place-option.active strong{
  line-height:1.65
}

.place-option-copy>span{
  width:333px
}

.places-media{
  height:560px
}

.places.is-running .place-option.active .place-progress>span{
  animation:place-progress var(--place-duration, 3.5s) linear forwards
}

@keyframes place-progress{
  to{transform:scaleX(1)}
}

@media(max-width:1050px){
  .places{
    height:auto;
    padding:90px 28px;
    grid-template-columns:1fr;
    gap:50px
  }

  .places-copy{
    height:auto;
    gap:58px
  }

  .places-media{
    height:500px
  }
}

@media(max-width:680px){
  .places{
    padding:75px 20px
  }

  .places-title-mark{
    width:min(200px,72%);
    height:auto;
    left:0;
    top:auto;
    bottom:-.02em
  }

  .place-option-copy>span{
    width:100%
  }

  .places-media{
    height:440px
  }
}

/* Product-role graphics */
.role-card{
  min-height:340px;
  position:relative;
  display:flex;
  flex-direction:column;
  overflow:hidden
}

.role-card>span{
  margin-bottom:0
}

.role-graphic{
  width:180px;
  height:116px;
  margin:20px auto 16px;
  display:flex;
  align-items:center;
  justify-content:center
}

.role-graphic svg{
  width:100%;
  height:100%;
  overflow:visible
}

.role-card h3{
  margin-top:auto
}

@media(max-width:1050px){
  .role-card{
    min-height:320px
  }
}

/* Final CTA — MWG 094: memories drift around a fixed invitation. */
.final-cta{
  width:100vw;
  max-width:none;
  height:auto;
  margin-left:calc(50% - 50vw);
  padding:152px 0 0;
  position:relative;
  overflow:visible
}

.final-cta-stage{
  width:100%;
  height:auto;
  min-height:0;
  position:relative;
  display:block;
  overflow:visible;
  isolation:isolate
}

.final-cta-stage::before,
.final-cta-stage::after{
  content:none
}

.final-cta .section-intro{
  width:min(680px,calc(100% - 40px));
  margin:0 auto;
  position:relative;
  z-index:4;
  transform:none
}

.final-cta .section-intro::before{
  content:"";
  width:138%;
  height:148%;
  position:absolute;
  left:50%;
  top:50%;
  z-index:-1;
  transform:translate(-50%,-50%);
  background:radial-gradient(ellipse at center,rgba(243,239,229,.98) 0%,rgba(243,239,229,.92) 42%,rgba(243,239,229,0) 74%);
  pointer-events:none
}

.final-cta-rail{
  width:max-content;
  padding-inline:88vw;
  position:absolute;
  left:0;
  top:50%;
  z-index:1;
  display:flex;
  align-items:center;
  gap:clamp(20px,2vw,36px);
  transform:translateY(-50%);
  white-space:nowrap;
  will-change:transform
}

.final-cta-card{
  width:clamp(180px,13vw,230px);
  height:clamp(230px,17vw,300px);
  margin:0;
  position:relative;
  flex:none;
  overflow:hidden;
  border:1px solid rgba(2,44,34,.08);
  border-radius:20px;
  background:#fff;
  box-shadow:0 18px 55px rgba(2,44,34,.12);
  opacity:0;
  transform-origin:center;
  will-change:transform,opacity
}

.final-cta-card-wide{
  width:clamp(270px,21vw,380px)
}

.final-cta-card-photo img,
.final-cta-card-oil img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover
}

.final-cta-card-oil{
  padding:8px 8px 44px
}

.final-cta-card-oil img{
  border-radius:14px
}

.final-cta-card-oil figcaption{
  height:36px;
  padding:0 12px;
  position:absolute;
  left:8px;
  right:8px;
  bottom:0;
  display:flex;
  align-items:center;
  overflow:hidden;
  color:#064e3b;
  font-size:12px;
  line-height:1;
  text-overflow:ellipsis;
  white-space:nowrap
}

.final-cta-card-object{
  padding:24px 18px 22px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  text-align:center
}

.final-cta-card-object img{
  width:clamp(112px,9vw,156px);
  height:clamp(112px,9vw,156px);
  display:block;
  object-fit:contain
}

.final-cta-card-object figcaption{
  max-width:190px;
  color:#003c2d;
  font-family:var(--serif);
  font-size:24px;
  line-height:1.02;
  white-space:normal
}

.final-cta-card-object figcaption span{
  margin-bottom:8px;
  display:block;
  color:#b76f54;
  font-family:var(--sans);
  font-size:9px;
  font-weight:600;
  line-height:1.1;
  letter-spacing:.04em;
  text-transform:uppercase
}

.final-cta-card-stamp img{
  width:clamp(124px,10vw,168px);
  height:clamp(124px,10vw,168px)
}

.final-cta-card-quote{
  padding:26px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  color:#fff;
  background:#056c51
}

.final-cta-card-quote>span{
  color:#c6fc82;
  font-size:10px;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase
}

.final-cta-card-quote blockquote{
  margin:0;
  font-family:var(--serif);
  font-size:clamp(28px,2.3vw,40px);
  font-style:italic;
  font-weight:400;
  line-height:1.03;
  white-space:normal
}

@media(max-width:680px){
  .final-cta-stage{
    height:auto;
    min-height:0
  }

  .final-cta .section-intro{
    width:calc(100% - 32px)
  }

  .final-cta .section-intro h2{
    font-size:48px
  }

  .final-cta-rail{
    padding-inline:92vw;
    gap:18px
  }

  .final-cta-card{
    width:42vw;
    height:56vw;
    min-width:150px;
    min-height:204px;
    border-radius:16px
  }

  .final-cta-card-wide{
    width:68vw
  }

  .final-cta-card-object{
    padding:18px 14px;
    gap:10px
  }

  .final-cta-card-object img{
    width:28vw;
    height:28vw
  }

  .final-cta-card-object figcaption{
    font-size:19px
  }
}

@media(prefers-reduced-motion:reduce){
  .final-cta-rail{
    left:50%;
    padding:0;
    opacity:.18;
    transform:translate(-50%,-50%)
  }

  .final-cta-card:nth-child(n+6){
    display:none
  }

  .final-cta-card{
    opacity:1
  }
}

/* Final CTA — MWG 100 orbit, adapted to keep normal page scrolling. */
.final-cta{
  padding:152px 0 112px;
  overflow:clip
}

.final-cta-stage{
  min-height:clamp(620px,78svh,860px);
  display:grid;
  place-items:center;
  overflow:visible
}

.final-cta .section-intro{
  width:min(680px,calc(100% - 48px));
  margin:0;
  text-align:center
}

.final-cta .section-intro::before{
  width:150%;
  height:168%;
  background:radial-gradient(ellipse at center,rgba(243,239,229,1) 0%,rgba(243,239,229,.97) 38%,rgba(243,239,229,.78) 56%,rgba(243,239,229,0) 76%)
}

.final-cta-rail{
  width:100%;
  height:100%;
  padding:0;
  position:absolute;
  inset:0;
  z-index:1;
  display:block;
  transform:none;
  white-space:normal;
  pointer-events:none
}

.final-cta-card,
.final-cta-card-wide{
  width:clamp(108px,8.6vw,156px);
  height:clamp(136px,10.8vw,196px);
  margin:0;
  padding:0;
  position:absolute;
  left:50%;
  top:50%;
  display:block;
  overflow:hidden;
  border:4px solid rgba(255,255,255,.96);
  border-radius:clamp(18px,1.5vw,26px);
  background:#fff;
  box-shadow:0 18px 48px rgba(2,44,34,.14);
  opacity:0;
  transform-origin:center;
  will-change:transform,opacity
}

.final-cta-portrait img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover
}

.final-cta-portrait-elaine img{object-position:50% 28%}
.final-cta-portrait-robert img{object-position:50% 20%}
.final-cta-portrait-couple-left img{object-position:18% 50%}
.final-cta-portrait-black-woman img{object-position:53% 32%}
.final-cta-portrait-couple-right img{object-position:86% 50%}
.final-cta-portrait-women img{object-position:50% 32%}
.final-cta-portrait-family img{object-position:62% 50%}
.final-cta-portrait-questions img{object-position:67% 38%}

@media(max-width:900px){
  .final-cta{
    padding-top:112px;
    padding-bottom:88px
  }

  .final-cta-stage{
    min-height:clamp(600px,76svh,760px)
  }

  .final-cta .section-intro{
    width:min(560px,calc(100% - 48px))
  }

  .final-cta-card,
  .final-cta-card-wide{
    width:clamp(88px,14vw,120px);
    height:clamp(110px,17.5vw,150px);
    border-width:3px;
    border-radius:18px
  }
}

@media(max-width:680px){
  .final-cta{
    padding-top:88px;
    padding-bottom:72px
  }

  .final-cta-stage{
    min-height:620px
  }

  .final-cta .section-intro{
    width:calc(100% - 40px)
  }

  .final-cta .section-intro h2{
    font-size:clamp(42px,13vw,56px)
  }

  .final-cta .section-intro::before{
    width:128%;
    height:190%
  }

  .final-cta-card,
  .final-cta-card-wide{
    width:clamp(76px,20vw,96px);
    height:clamp(96px,25vw,120px);
    min-width:0;
    min-height:0;
    border-radius:14px
  }
}

@media(prefers-reduced-motion:reduce){
  .final-cta-rail{
    left:0;
    opacity:1;
    transform:none
  }

  .final-cta-card:nth-child(n){
    display:block;
    opacity:1
  }
}

/* Responsive containment audit: preserve the 1400px composition while
   allowing every content grid to contract cleanly below it. */
@media(min-width:1051px) and (max-width:1399px){
  .how,
  .household,
  .pricing.pricing-single,
  .faq,
  .footer-content{
    padding-left:clamp(48px,6vw,84px);
    padding-right:clamp(48px,6vw,84px)
  }

  .how-list,
  .how-card,
  .household-grid,
  .pricing-grid{
    width:100%
  }

  .how-card{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)
  }

  .how-card>*{
    min-width:0
  }

  .places{
    padding-left:clamp(48px,6vw,84px);
    padding-right:clamp(48px,6vw,84px);
    grid-template-columns:minmax(360px,466px) minmax(0,1fr);
    gap:clamp(48px,6vw,84px)
  }

  .places-copy,
  .places-media{
    min-width:0
  }

  .pricing-single .pricing-intro h2{
    width:min(100%,706px)
  }

  .faq{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:clamp(40px,5vw,72px)
  }

  .faq-intro,
  .faq-list,
  .footer-brand,
  .footer-links{
    min-width:0
  }

  .faq-intro h2{
    font-size:clamp(58px,5.3vw,72px)
  }

  .faq-intro>p:last-child{
    width:min(100%,430px)
  }

  .footer-content{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:clamp(32px,4vw,52px)
  }

  .footer-links{
    gap:clamp(24px,3vw,52px)
  }
}

@media(max-width:1050px){
  .hero-copy{
    width:100%;
    max-width:686px
  }

  .hero-copy>p:not(.eyebrow){
    width:min(100%,650px)
  }

  .how-list,
  .how-card,
  .household-grid,
  .pricing-grid,
  .places-copy,
  .places-intro,
  .places-media,
  .faq-intro,
  .faq-list,
  .footer-content{
    width:100%;
    min-width:0;
    max-width:100%
  }

  .how-card+.how-card{
    margin-top:64px
  }

  .how-stack-stage.is-enhanced .how-card+.how-card{
    margin-top:0
  }

  .how-card:nth-child(2) .how-text h3,
  .how-card:nth-child(3) .how-text h3,
  .places-copy h2,
  .places-intro>p,
  .place-option-copy>span,
  .pricing-single .pricing-intro h2,
  .pricing-single .pricing-intro>p:last-of-type,
  .faq-intro>p:last-child{
    width:100%;
    max-width:100%
  }

  .place-options,
  .place-option,
  .place-option-copy,
  .formats,
  .formats>div{
    min-width:0;
    max-width:100%
  }

  .footer-content{
    gap:44px
  }
}

@media(max-width:680px){
  .hero-copy,
  .hero-copy>p:not(.eyebrow){
    width:100%;
    max-width:100%
  }

  .hero h1,
  .how-text h3,
  .places-copy h2,
  .pricing-single .pricing-intro h2,
  .faq-intro h2,
  .role-card h3{
    overflow-wrap:anywhere
  }

  .how-card+.how-card{
    margin-top:48px
  }

  .formats>div{
    width:100%;
    flex-wrap:wrap
  }

  .formats b{
    min-width:0;
    max-width:100%;
    white-space:normal
  }

  .places-copy,
  .places-intro,
  .places-media,
  .faq-intro,
  .faq-list{
    width:100%;
    min-width:0;
    max-width:100%
  }

  .place-panel{
    max-width:100%
  }

  .faq-list summary,
  .faq-list details p{
    min-width:0;
    overflow-wrap:anywhere
  }

  .footer-links{
    min-width:0;
    gap:28px 20px
  }
}

/* Figma refresh — node 399:111, August 2026 */
.hero-actions .button-ghost{
  height:52px;
  padding-inline:28px;
  color:#fff;
  background:rgba(255,255,255,.08)
}

/* Polished type system for "Every memory finds its place". */
.places-intro{
  gap:16px
}

.places-copy h2{
  width:430px;
  color:#022c22;
  font-family:var(--serif);
  font-size:72px;
  font-weight:400;
  line-height:1;
  letter-spacing:-.02em
}

.places-intro>p{
  width:384px;
  color:#404040;
  font-family:var(--sans);
  font-size:14px;
  line-height:1.65;
  letter-spacing:0
}

.place-option strong,
.place-option.active strong{
  font-family:var(--sans);
  font-size:20px;
  font-weight:500;
  line-height:1.2;
  letter-spacing:-.02em
}

.place-option-copy>span{
  color:#404040;
  font-family:var(--sans);
  font-size:14px;
  line-height:1.65
}

/* Polished FAQ typography and spacing. */
.faq{
  height:auto;
  min-height:459px;
  padding-inline:124px;
  grid-template-columns:minmax(0,560px) minmax(0,560px);
  gap:72px
}

.faq-intro .eyebrow{
  color:#65a30d;
  font-size:12px;
  font-weight:600;
  line-height:1;
  letter-spacing:.04em
}

.faq-intro h2{
  width:457px;
  margin:16px 0 32px;
  color:#022c22;
  font-family:var(--serif);
  font-size:72px;
  font-weight:400;
  line-height:1;
  letter-spacing:-.02em
}

.faq-intro>p:last-child{
  width:378px;
  color:#404040;
  font-size:14px;
  line-height:1.65
}

.faq-list{
  display:flex;
  flex-direction:column
}

.faq-list details{
  padding:28px 0
}

.faq-list summary{
  gap:24px;
  font-size:20px;
  font-weight:500;
  line-height:1.65;
  letter-spacing:-.01em
}

.faq-list summary::after{
  flex:0 0 24px;
  font-size:24px;
  line-height:1;
  text-align:center
}

.faq-list details p{
  width:377px;
  max-width:calc(100% - 48px);
  margin:8px 0 0;
  padding:0;
  color:#404040;
  font-size:14px;
  line-height:1.65
}

/* Exact surface, spacing and exported artwork from Figma node 399:111. */
.hero-shell{
  background:
    radial-gradient(56.82% 39.06% at 50% 0%,rgba(198,252,130,.12) 0%,rgba(0,97,68,0) 100%),
    #002e20
}

.hero-copy>p:not(.eyebrow){width:533px}

.final-cta.final-cta-figma{
  width:100vw;
  height:802px;
  max-width:none;
  margin-left:calc(50% - 50vw);
  padding:0;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  color:#fff;
  background:#f3efe5
}

.final-cta.final-cta-figma::before{
  content:"";
  width:2016px;
  height:997px;
  position:absolute;
  z-index:-1;
  left:50%;
  bottom:-498px;
  border-radius:555px;
  background:#002e20;
  filter:blur(150px);
  transform:translateX(-50%)
}

.final-cta-figma .final-cta-stage{
  width:min(1440px,100vw);
  height:802px;
  margin:0 auto;
  position:relative;
  overflow:visible
}

.final-cta-figma .section-intro{
  width:min(1192px,calc(100% - 248px));
  margin:0;
  gap:0;
  position:absolute;
  z-index:2;
  top:280px;
  left:50%;
  transform:translateX(-50%);
  text-align:center;
  color:#fff
}

.final-cta-figma .section-intro::before{content:none}

.final-cta-underline{
  /* positioned later in this file against .final-cta-mark */
  display:block
}

.final-cta-figma .section-intro .eyebrow{
  margin:0 0 8px;
  color:#fff;
  font-size:12px;
  font-weight:600;
  line-height:1;
  letter-spacing:.04em
}

.final-cta-figma .section-intro h2{
  width:512px;
  max-width:100%;
  margin:0 auto;
  color:#fff;
  font-family:var(--serif);
  font-size:72px;
  font-weight:400;
  line-height:1;
  letter-spacing:-.02em
}

.final-cta-figma .section-intro>p:last-of-type{
  width:515px;
  max-width:100%;
  margin:8px auto 0;
  color:rgba(255,255,255,.7);
  font-size:16px;
  line-height:1.7
}

.final-cta-figma .button-primary{
  height:56px;
  margin-top:40px;
  padding:0 32px;
  color:#002e20;
  background:#fff
}

.final-cta-memory{
  margin:0;
  position:absolute;
  z-index:1;
  display:grid;
  place-items:center;
  pointer-events:none
}

.final-cta-memory img{
  display:block;
  object-fit:contain
}

.final-cta-memory-stamp{
  width:320px;
  height:320px;
  left:75.42px;
  top:50.42px
}
.final-cta-memory-stamp img{width:257.116px;height:257.116px;transform:rotate(-16.65deg)}

.final-cta-memory-tin{
  width:182.927px;
  height:183.565px;
  left:1083px;
  top:85px
}
.final-cta-memory-tin img{width:153.094px;height:153.935px;transform:rotate(12.57deg)}

.final-cta-memory-chair{
  width:166.99px;
  height:158.357px;
  left:192px;
  top:523px
}
.final-cta-memory-chair img{width:143.125px;height:131.993px;transform:rotate(-11.74deg)}

.final-cta-memory-photo{
  width:295.194px;
  height:295.194px;
  left:1049px;
  top:406.49px
}
.final-cta-memory-photo img{width:255.815px;height:255.815px;transform:rotate(9.68deg)}

.site-footer.site-footer-figma{
  width:100vw;
  max-width:none;
  height:453px;
  margin:0 0 0 calc(50% - 50vw);
  padding:0 124px;
  position:relative;
  display:flex;
  flex-direction:column;
  gap:44px;
  overflow:hidden;
  border:0!important;
  color:#fff;
  background:
    radial-gradient(88.64% 60.94% at 50% 100%,rgba(217,249,157,.12) 0%,rgba(6,95,70,0) 100%),
    #022c22
}
.site-footer.site-footer-figma::before,
.site-footer.site-footer-figma::after{content:none!important}

.site-footer-figma .footer-content{
  width:100%;
  max-width:1192px;
  height:156px;
  margin:0 auto;
  padding:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) 363px;
  gap:52px;
  align-items:start
}

.footer-tagline{
  margin:0;
  color:#fff;
  font-family:var(--serif);
  font-size:40px;
  font-weight:400;
  line-height:1.1;
  letter-spacing:-.02em
}

.site-footer-figma .footer-links{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:52px
}

.site-footer-figma .footer-links nav{
  gap:24px;
  color:#fff;
  font-size:20px;
  font-weight:500;
  line-height:1.2
}

.site-footer-figma .footer-wordmark{
  width:100vw;
  height:195px;
  margin:0 0 0 calc(50% - 50vw);
  position:relative;
  overflow:hidden
}

.site-footer-figma .footer-wordmark img{
  width:100%;
  height:auto;
  max-width:none;
  position:absolute;
  top:0;
  left:0;
  display:block
}

.footer-legal{
  width:100vw;
  max-width:none;
  margin:0;
  padding:24px 124px;
  position:absolute;
  z-index:2;
  left:0;
  bottom:0;
  display:flex;
  justify-content:space-between;
  gap:32px;
  border:0;
  color:rgba(255,255,255,.3);
  font-size:14px;
  line-height:1.4
}

.footer-legal nav{
  width:363px;
  display:flex;
  justify-content:space-between;
  gap:24px
}

@media(max-width:1050px){
  .faq{
    padding:100px 28px;
    grid-template-columns:1fr;
    gap:56px
  }

  .faq-intro h2,
  .faq-intro>p:last-child{width:100%}

  .final-cta.final-cta-figma{
    height:700px
  }

  .final-cta-figma .final-cta-stage{height:700px}
  .final-cta-figma .section-intro{width:calc(100% - 96px);top:210px}
  .final-cta-underline{
  /* positioned later in this file against .final-cta-mark */
  display:block
}
  .final-cta-memory-stamp{width:180px;height:180px;left:-24px;top:36px}
  .final-cta-memory-stamp img{width:150px;height:150px}
  .final-cta-memory-tin{width:128px;height:128px;left:auto;right:0;top:48px}
  .final-cta-memory-tin img{width:106px;height:106px}
  .final-cta-memory-chair{width:120px;height:112px;left:10px;top:510px}
  .final-cta-memory-chair img{width:102px;height:94px}
  .final-cta-memory-photo{width:190px;height:190px;left:auto;right:-20px;top:452px}
  .final-cta-memory-photo img{width:164px;height:164px}

  .site-footer.site-footer-figma{padding-inline:48px}
  .footer-legal{padding-inline:48px}
}

@media(max-width:680px){
  .hero-copy>p:not(.eyebrow){width:100%}

  .places-copy h2,
  .faq-intro h2{
    width:100%;
    font-size:50px
  }

  .place-option strong,
  .place-option.active strong{font-size:18px}

  .faq{padding:80px 20px}
  .faq-list details{padding:20px 0}
  .faq-list summary{font-size:17px;line-height:1.4}
  .faq-list details p{width:100%;max-width:calc(100% - 30px)}

  .final-cta.final-cta-figma{
    height:620px
  }

  .final-cta-figma .final-cta-stage{height:620px}
  .final-cta-figma .section-intro{width:calc(100% - 40px);top:170px}
  .final-cta-underline{
  /* positioned later in this file against .final-cta-mark */
  display:block
}
  .final-cta-figma .section-intro h2{font-size:50px}
  .final-cta-figma .section-intro>p:last-of-type{font-size:14px}
  .final-cta-memory-stamp{width:104px;height:104px;left:-18px;top:34px}
  .final-cta-memory-stamp img{width:88px;height:88px}
  .final-cta-memory-tin{width:88px;height:88px;left:auto;right:-14px;top:42px}
  .final-cta-memory-tin img{width:74px;height:74px}
  .final-cta-memory-chair{width:88px;height:82px;left:-12px;top:500px}
  .final-cta-memory-chair img{width:76px;height:70px}
  .final-cta-memory-photo{width:118px;height:118px;left:auto;right:-18px;top:468px}
  .final-cta-memory-photo img{width:102px;height:102px}

  .site-footer.site-footer-figma{
    height:auto;
    padding-inline:20px;
    gap:36px
  }

  .site-footer-figma .footer-content{
    grid-template-columns:1fr;
    gap:48px
  }

  .footer-tagline{font-size:34px}
  .site-footer-figma .footer-links{grid-template-columns:1fr 1fr;gap:24px}
  .site-footer-figma .footer-links nav{font-size:16px}

  .site-footer-figma .footer-wordmark{
    height:27vw
  }

  .footer-legal{
    width:100%;
    position:static;
    padding:20px 0;
    flex-direction:column;
    gap:16px;
    font-size:11px
  }

  .footer-legal nav{
    width:100%;
    justify-content:flex-start
  }
}

/* Definitive last-pass rules from the supplied Figma export. */
.faq{margin-bottom:0;background:#f3efe5}

.final-cta.final-cta-figma{
  width:100vw!important;
  max-width:none!important;
  height:802px!important;
  min-height:802px!important;
  margin:-1px 0 0 calc(50% - 50vw)!important;
  padding:0!important;
  overflow:hidden!important;
  background:radial-gradient(145% 96% at 50% -2%,#f3efe5 0%,#f3efe5 13%,rgba(226,228,218,.98) 30%,rgba(163,181,168,.98) 52%,rgba(65,105,86,.99) 74%,#002e20 100%)!important
}

.final-cta.final-cta-figma::before{content:none!important}
.final-cta-figma .final-cta-stage{width:min(1440px,100vw)!important;max-width:none!important;height:802px!important;min-height:802px!important;margin:0 auto!important;overflow:visible!important}
.final-cta-memory-map{width:166.99px!important;height:158.357px!important;left:192px!important;right:auto!important;top:523px!important}
.final-cta-memory-map img{width:143.125px!important;height:131.993px!important;transform:rotate(-11.74deg)!important}
.final-cta-memory-chair{width:295.194px!important;height:295.194px!important;left:auto!important;right:95px!important;top:406.49px!important}
.final-cta-memory-chair img{width:255.815px!important;height:255.815px!important;transform:rotate(9.68deg)!important}

.site-footer.site-footer-figma{
  --footer-inner:min(1192px,calc(100vw - 40px));
  width:100vw!important;
  max-width:none!important;
  height:620px!important;
  min-height:620px!important;
  margin:0 0 0 calc(50% - 50vw)!important;
  padding:80px 0 0!important;
  position:relative!important;
  display:block!important;
  overflow:hidden!important;
  border:0!important;
  background:radial-gradient(88.64% 60.94% at 50% 100%,rgba(217,249,157,.12) 0%,rgba(6,95,70,0) 100%),#002e20!important
}

.site-footer-figma .footer-content{
  width:var(--footer-inner)!important;
  max-width:none!important;
  margin:0 auto!important;
  padding:0!important;
  position:relative!important;
  z-index:3!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 363px!important;
  align-items:start!important;
  gap:52px!important
}

.site-footer-figma .footer-tagline{width:min(560px,100%)!important;margin:0!important;color:#fff!important;font-family:"Instrument Serif",serif!important;font-size:48px!important;line-height:1.04!important;font-weight:400!important;letter-spacing:-.02em!important}
.site-footer-figma .footer-links{width:363px!important;margin:0!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:0 52px!important}
.site-footer-figma .footer-links nav{margin:0!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:22px!important;color:#fff!important;font-size:16px!important;line-height:1.25!important}

.site-footer-figma .footer-wordmark{width:100vw!important;height:auto!important;aspect-ratio:1440/436.755!important;margin:0!important;position:absolute!important;left:0!important;right:0!important;bottom:0!important;z-index:1!important;overflow:visible!important;pointer-events:none!important}
.site-footer-figma .footer-wordmark img{width:100%!important;height:100%!important;max-width:none!important;position:static!important;display:block!important;object-fit:fill!important;opacity:1!important;filter:none!important;transform:none!important}

.site-footer-figma .footer-legal{
  width:var(--footer-inner)!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  position:absolute!important;
  left:50%!important;
  bottom:32px!important;
  z-index:4!important;
  transform:translateX(-50%)!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 363px!important;
  align-items:end!important;
  gap:52px!important;
  color:rgba(255,255,255,.3)!important;
  font-size:14px!important;
  line-height:1.4!important
}

.site-footer-figma .footer-legal>span{justify-self:start!important;text-align:left!important}
.site-footer-figma .footer-legal nav{width:363px!important;margin:0!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:52px!important;justify-content:stretch!important}
.site-footer-figma .footer-legal nav a{justify-self:start!important;white-space:nowrap!important}

.timeline-example-modal[hidden]{display:none!important}
.timeline-example-modal{position:fixed;inset:0;z-index:10000}
.timeline-example-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.52);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.timeline-example-dialog{position:absolute;inset:12px;border-radius:24px;overflow:hidden;background:#f3efe5;box-shadow:0 28px 96px rgba(0,0,0,.3)}
.timeline-example-close{width:40px;height:40px;padding:0;position:absolute;top:20px;right:20px;z-index:20;display:grid;place-items:center;border:0;border-radius:999px;color:#002e20;background:#fff;box-shadow:0 3px 18px rgba(0,0,0,.12);cursor:pointer}
.timeline-example-close svg{width:20px;height:20px}
.timeline-example-scroll{width:100%;height:100%;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable}

.timeline-modal-hero{min-height:396px!important;padding:56px 80px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:24px!important;text-align:center!important;color:#fff!important;background:#022c22!important}
.timeline-modal-hero::before,.timeline-modal-hero::after{content:none!important}
.timeline-modal-hero img{width:100px!important;height:100px!important;flex:none!important;border-radius:50%!important;object-fit:cover!important}
.timeline-modal-hero-copy{width:min(900px,100%)!important;display:flex!important;flex-direction:column!important;align-items:center!important;gap:16px!important}
.timeline-modal-hero h2{margin:0!important;color:#fff!important;font-family:"Instrument Serif",serif!important;font-size:72px!important;line-height:1!important;font-weight:400!important;letter-spacing:-.035em!important}
.timeline-modal-hero p{margin:0!important;color:rgba(255,255,255,.7)!important;font-size:16px!important;line-height:1.5!important}

.timeline-modal-tabs{min-height:64px!important;padding:0 52px!important;position:sticky!important;top:0!important;z-index:15!important;display:flex!important;align-items:stretch!important;gap:32px!important;border-top:.5px solid rgba(0,46,32,.12)!important;border-bottom:.5px solid rgba(0,46,32,.12)!important;background:rgba(243,239,229,.96)!important;-webkit-backdrop-filter:blur(16px)!important;backdrop-filter:blur(16px)!important}
.timeline-modal-tab{padding:0!important;position:relative!important;border:0!important;color:rgba(0,46,32,.48)!important;background:transparent!important;font:500 12px/1 "Inter",sans-serif!important;cursor:pointer!important}
.timeline-modal-tab[aria-selected="true"]{color:#002e20!important}
.timeline-modal-tab[aria-selected="true"]::after{content:"";height:2px;position:absolute;right:0;bottom:0;left:0;background:#002e20}
.timeline-modal-panel{min-height:520px;background:#f3efe5}
.timeline-modal-panel[hidden]{display:none!important}

@media(max-width:1050px){
  .final-cta.final-cta-figma,.final-cta-figma .final-cta-stage{height:700px!important;min-height:700px!important}
  .final-cta-memory-map{width:132px!important;height:126px!important;left:54px!important;top:492px!important}
  .final-cta-memory-map img{width:113px!important;height:106px!important}
  .final-cta-memory-chair{width:186px!important;height:186px!important;right:10px!important;top:432px!important}
  .final-cta-memory-chair img{width:162px!important;height:162px!important}
  .site-footer.site-footer-figma{--footer-inner:min(900px,calc(100vw - 64px));height:560px!important;min-height:560px!important;padding-top:64px!important}
  .site-footer-figma .footer-content,.site-footer-figma .footer-legal{grid-template-columns:minmax(0,1fr) 320px!important;gap:36px!important}
  .site-footer-figma .footer-links,.site-footer-figma .footer-legal nav{width:320px!important;gap:36px!important}
  .site-footer-figma .footer-tagline{font-size:40px!important}
  .timeline-example-dialog{inset:8px}
  .timeline-modal-hero{padding:56px 36px!important}
  .timeline-modal-hero h2{font-size:62px!important}
}

@media(max-width:680px){
  .final-cta.final-cta-figma,.final-cta-figma .final-cta-stage{height:620px!important;min-height:620px!important}
  .final-cta-memory-map{left:-24px!important;top:484px!important}
  .final-cta-memory-chair{right:-58px!important;top:438px!important}
  .site-footer.site-footer-figma{--footer-inner:calc(100vw - 40px);height:690px!important;min-height:690px!important;padding-top:64px!important}
  .site-footer-figma .footer-content{grid-template-columns:1fr!important;gap:48px!important}
  .site-footer-figma .footer-tagline{font-size:36px!important}
  .site-footer-figma .footer-links{width:100%!important;gap:24px!important}
  .site-footer-figma .footer-wordmark{bottom:58px!important}
  .site-footer-figma .footer-legal{bottom:20px!important;display:grid!important;grid-template-columns:1fr!important;gap:12px!important;font-size:11px!important}
  .site-footer-figma .footer-legal nav{width:100%!important;grid-template-columns:auto auto!important;justify-content:start!important;gap:24px!important}
  .timeline-example-dialog{inset:6px;border-radius:18px}
  .timeline-example-close{top:14px;right:14px}
  .timeline-modal-hero{min-height:320px!important;padding:68px 22px 44px!important}
  .timeline-modal-hero img{width:80px!important;height:80px!important}
  .timeline-modal-hero h2{font-size:48px!important}
  .timeline-modal-tabs{padding:0 20px!important;gap:26px!important;overflow-x:auto!important}
}

/* Hero CTAs — Figma 399:133 */
.hero-actions{
  display:flex;
  align-items:center;
  gap:16px;
}
.hero-actions .button{
  box-sizing:border-box;
  height:52px;
  min-height:52px;
  padding:20px 28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:555px;
  font-family:var(--sans);
  font-size:16px;
  font-weight:500;
  line-height:1;
  letter-spacing:0;
  white-space:nowrap;
  appearance:none;
  -webkit-appearance:none;
  cursor:pointer;
}
.hero-actions .button-lime{
  color:#0a0a0a;
  background:linear-gradient(180deg,#cbf580 0%,#bef264 100%);
  box-shadow:inset 0 2px 2px rgba(255,255,255,.25);
}
.hero-actions .button-ghost{
  color:#fff;
  background:rgba(255,255,255,.08);
  box-shadow:none;
}

/* ==== landing-final.css ==== */

/* Authoritative final overrides for the approved landing composition. */
body.timeline-modal-open { overflow: hidden !important; }

/* FAQ flows into the CTA without a visible seam. */
.faq {
  position: relative !important;
  z-index: 2 !important;
  margin-bottom: -1px !important;
  overflow: visible !important;
  background: #f3efe5 !important;
}

/* --------------------------------------------------------------------------
   Pixel-locked closing pass: hero transition, FAQ/CTA boundary and footer.
   These rules intentionally sit last so older experiment overrides cannot
   reintroduce seams or layout drift.
   -------------------------------------------------------------------------- */

:root {
  --heldearly-paper: #f3efe5;
  --heldearly-ink: #002e20;
  --heldearly-footer-gutter: clamp(40px, 8.611vw, 124px);
  --heldearly-footer-inner: min(1400px, calc(100vw - (2 * var(--heldearly-footer-gutter))));
}

.hero-shell {
  position: relative !important;
  z-index: 4 !important;
  margin: 0 0 -4px !important;
  border: 0 !important;
  box-shadow: none !important;
  background:
    radial-gradient(56.82% 39.06% at 50% 0%, rgba(217, 249, 157, 0.12) 0%, rgba(6, 95, 70, 0) 100%),
    var(--heldearly-ink) !important;
}

.how {
  position: relative !important;
  z-index: 3 !important;
  isolation: isolate !important;
  margin: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: hidden !important;
  background: var(--heldearly-paper) !important;
}

.how::before {
  content: "" !important;
  position: absolute !important;
  z-index: 0 !important;
  top: -486px !important;
  left: 50% !important;
  width: max(2592px, 180vw) !important;
  height: 997px !important;
  border-radius: 555px !important;
  background: #022c22 !important;
  filter: blur(225px) !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
}

.how::after { content: none !important; }
.how > * { position: relative !important; z-index: 1 !important; }

.faq {
  position: relative !important;
  z-index: 5 !important;
  isolation: isolate !important;
  overflow: hidden !important;
  background: var(--heldearly-paper) !important;
  background-image: none !important;
}

.faq::before,
.faq::after { content: none !important; display: none !important; }

.final-cta.final-cta-figma {
  position: relative !important;
  z-index: 2 !important;
  isolation: isolate !important;
  overflow: hidden !important;
  background: var(--heldearly-paper) !important;
  background-image: none !important;
}

.final-cta.final-cta-figma::before {
  content: "" !important;
  position: absolute !important;
  z-index: 0 !important;
  top: auto !important;
  right: auto !important;
  bottom: -498px !important;
  left: 50% !important;
  width: max(2016px, 140vw) !important;
  height: 997px !important;
  border-radius: 555px !important;
  background: #022c22 !important;
  filter: blur(150px) !important;
  opacity: 1 !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
}

.final-cta.final-cta-figma::after { content: none !important; }
.final-cta.final-cta-figma .final-cta-stage,
.final-cta.final-cta-figma .final-cta-stage > * {
  position: relative !important;
  z-index: 2 !important;
}

.final-cta.final-cta-figma .button.button-primary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 140px !important;
  min-height: 60px !important;
  height: 60px !important;
  padding: 0 32px !important;
  border: 0 !important;
  border-radius: 555px !important;
  background: #ffffff !important;
  color: var(--heldearly-ink) !important;
  box-shadow: none !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 16px !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

.site-footer.site-footer-figma {
  position: relative !important;
  z-index: 1 !important;
  isolation: isolate !important;
  min-height: 760px !important;
  margin: 0 !important;
  padding: 88px 0 0 !important;
  overflow: hidden !important;
  background:
    radial-gradient(80% 46% at 50% 100%, rgba(18, 92, 68, 0.62) 0%, rgba(0, 46, 32, 0) 100%),
    var(--heldearly-ink) !important;
  color: #fff !important;
}

.site-footer.site-footer-figma::before,
.site-footer.site-footer-figma::after { content: none !important; display: none !important; }

.site-footer-figma .footer-content,
.site-footer-figma .footer-legal {
  position: absolute !important;
  left: 50% !important;
  width: var(--heldearly-footer-inner) !important;
  max-width: none !important;
  margin: 0 !important;
  transform: translateX(-50%) !important;
}

.site-footer-figma .footer-content {
  top: 88px !important;
  z-index: 4 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 363px !important;
  align-items: start !important;
  gap: clamp(48px, 8vw, 132px) !important;
}

.site-footer-figma .footer-tagline {
  margin: 0 !important;
  max-width: 590px !important;
  color: #fff !important;
}

.site-footer-figma .footer-links {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  align-items: start !important;
  width: 363px !important;
  gap: 48px !important;
}

.site-footer-figma .footer-links nav {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 24px !important;
  margin: 0 !important;
}

.site-footer-figma .footer-links a {
  color: #fff !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

.site-footer-figma .footer-wordmark {
  position: absolute !important;
  z-index: 1 !important;
  right: auto !important;
  bottom: 42px !important;
  left: 50% !important;
  width: min(1440px, 100vw) !important;
  height: auto !important;
  margin: 0 !important;
  overflow: visible !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
}

.site-footer-figma .footer-wordmark img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  opacity: 1 !important;
  transform: none !important;
}

.site-footer-figma .footer-legal {
  z-index: 5 !important;
  bottom: 28px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 363px !important;
  align-items: end !important;
  gap: clamp(48px, 8vw, 132px) !important;
  color: rgba(255, 255, 255, 0.3) !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
}

.site-footer-figma .footer-legal > span {
  opacity: 1 !important;
  white-space: nowrap !important;
}

.site-footer-figma .footer-legal nav {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  align-items: end !important;
  width: 363px !important;
  gap: 48px !important;
  margin: 0 !important;
}

.site-footer-figma .footer-legal a {
  color: rgba(255, 255, 255, 0.3) !important;
  white-space: nowrap !important;
}

@media (max-width: 1050px) {
  :root {
    --heldearly-footer-gutter: 32px;
    --heldearly-footer-inner: calc(100vw - 64px);
  }

  .final-cta.final-cta-figma::before {
    bottom: -430px !important;
    width: 1500px !important;
    height: 850px !important;
  }

  .site-footer-figma .footer-content,
  .site-footer-figma .footer-legal {
    grid-template-columns: minmax(0, 1fr) 320px !important;
    gap: 36px !important;
  }

  .site-footer-figma .footer-links,
  .site-footer-figma .footer-legal nav { width: 320px !important; gap: 32px !important; }
}

@media (max-width: 680px) {
  :root {
    --heldearly-footer-gutter: 20px;
    --heldearly-footer-inner: calc(100vw - 40px);
  }

  .final-cta.final-cta-figma::before {
    bottom: -310px !important;
    width: 1100px !important;
    height: 700px !important;
    filter: blur(130px) !important;
  }

  .final-cta.final-cta-figma .button.button-primary {
    min-width: 132px !important;
    min-height: 56px !important;
    height: 56px !important;
    padding-inline: 28px !important;
  }

  .site-footer.site-footer-figma {
    min-height: 760px !important;
    padding-top: 64px !important;
  }

  .site-footer-figma .footer-content {
    top: 64px !important;
    grid-template-columns: 1fr !important;
    gap: 44px !important;
  }

  .site-footer-figma .footer-links {
    width: 100% !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 24px !important;
  }

  .site-footer-figma .footer-links a { font-size: 18px !important; }

  .site-footer-figma .footer-wordmark {
    bottom: 74px !important;
    width: 158vw !important;
  }

  .site-footer-figma .footer-legal {
    bottom: 20px !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    font-size: 12px !important;
  }

  .site-footer-figma .footer-legal nav {
    width: 100% !important;
    grid-template-columns: auto auto !important;
    justify-content: start !important;
    gap: 24px !important;
  }
}

/* Final Figma fidelity pass: seamless section transitions, isolated CTA blur,
   and a footer grid that stays aligned at every supported viewport. */
.hero-shell {
  margin: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background:
    radial-gradient(56.82% 39.06% at 50% 0%, rgba(198, 252, 130, 0.12) 0%, rgba(0, 97, 68, 0) 100%),
    #002e20 !important;
}

.how {
  position: relative !important;
  isolation: isolate !important;
  margin: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background: #f3efe5 !important;
  overflow: hidden !important;
}

.how::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 0 !important;
  top: -486px !important;
  left: 50% !important;
  width: max(2592px, 180vw) !important;
  height: 997px !important;
  border-radius: 555px !important;
  background: #022c22 !important;
  background-image: none !important;
  filter: blur(225px) !important;
  opacity: 1 !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
}

.how::after {
  content: none !important;
  display: none !important;
}

.how > * {
  position: relative;
  z-index: 1;
}

.faq {
  position: relative !important;
  z-index: 2 !important;
  isolation: isolate !important;
  overflow: hidden !important;
  background: #f3efe5 !important;
  background-image: none !important;
}

.faq::before,
.faq::after {
  content: none !important;
  display: none !important;
}

.final-cta.final-cta-figma {
  position: relative !important;
  z-index: 1 !important;
  isolation: isolate !important;
  overflow: hidden !important;
  background: #f3efe5 !important;
  background-image: none !important;
}

.final-cta.final-cta-figma::before {
  top: 240px !important;
  bottom: auto !important;
  left: 50% !important;
  width: max(2200px, 155vw) !important;
  height: 1100px !important;
  border-radius: 50% !important;
  background: #002e20 !important;
  background-image: none !important;
  filter: blur(170px) !important;
  opacity: 1 !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
}

.final-cta-figma .button-primary {
  min-width: 140px !important;
  height: 56px !important;
  padding: 0 32px !important;
  border: 0 !important;
  border-radius: 555px !important;
  background: #fff !important;
  color: #002e20 !important;
  box-shadow: none !important;
  font-family: "Inter", sans-serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

.site-footer.site-footer-figma {
  --footer-inner: min(1296px, calc(100vw - 144px));
  height: 760px !important;
  min-height: 760px !important;
  padding: 88px 0 0 !important;
  overflow: hidden !important;
  background:
    radial-gradient(100% 66% at 50% 100%, rgba(104, 155, 129, 0.5) 0%, rgba(35, 91, 69, 0.32) 42%, rgba(0, 46, 32, 0) 76%),
    #002e20 !important;
}

.site-footer-figma .footer-wordmark {
  left: 50% !important;
  right: auto !important;
  bottom: 40px !important;
  width: 100vw !important;
  overflow: visible !important;
  transform: translateX(-50%) !important;
}

.site-footer-figma .footer-wordmark img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  opacity: 1 !important;
  filter: none !important;
}

.site-footer-figma .footer-legal {
  bottom: 28px !important;
}

@media (max-width: 1050px) {
  .how::before {
    top: -410px !important;
    width: max(1800px, 190vw) !important;
    height: 860px !important;
    filter: blur(160px) !important;
  }

  .final-cta.final-cta-figma::before {
    top: 210px !important;
    width: max(1500px, 165vw) !important;
    height: 860px !important;
    filter: blur(125px) !important;
  }

  .site-footer.site-footer-figma {
    --footer-inner: min(900px, calc(100vw - 80px));
  }
}

@media (max-width: 680px) {
  .how::before {
    top: -360px !important;
    width: 1100px !important;
    height: 760px !important;
    filter: blur(120px) !important;
  }

  .final-cta.final-cta-figma::before {
    top: 180px !important;
    width: 1100px !important;
    height: 720px !important;
    filter: blur(100px) !important;
  }

  .site-footer.site-footer-figma {
    --footer-inner: calc(100vw - 40px);
  }

  .site-footer-figma .footer-wordmark {
    left: 50% !important;
    right: auto !important;
    bottom: 56px !important;
    width: 160vw !important;
    transform: translateX(-50%) !important;
  }

  .site-footer-figma .footer-legal {
    bottom: 20px !important;
  }
}

/* Final Figma-aligned closure: hero seam, FAQ/CTA boundary, CTA button, footer. */
.hero-shell {
  position: relative !important;
  z-index: 3 !important;
  margin-bottom: -3px !important;
  border: 0 !important;
  background:
    radial-gradient(56.82% 39.06% at 50% 0%, rgba(217, 249, 157, 0.12) 0%, rgba(6, 95, 70, 0) 100%),
    #022c22 !important;
  box-shadow: 0 4px 0 #022c22 !important;
}

.how {
  margin-top: -3px !important;
}

.faq {
  position: relative !important;
  z-index: 4 !important;
  isolation: isolate !important;
  overflow: clip !important;
  clip-path: inset(0) !important;
  margin-bottom: 0 !important;
  background: #f3efe5 !important;
  background-image: none !important;
}

.faq::before,
.faq::after {
  content: none !important;
  display: none !important;
}

.final-cta.final-cta-figma {
  position: relative !important;
  z-index: 1 !important;
  isolation: isolate !important;
  width: 100vw !important;
  max-width: none !important;
  margin: 0 0 0 calc(50% - 50vw) !important;
  overflow: hidden !important;
  clip-path: inset(0) !important;
  background: #f3efe5 !important;
  background-image: none !important;
}

.final-cta.final-cta-figma::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 0 !important;
  top: auto !important;
  right: auto !important;
  bottom: -498px !important;
  left: 50% !important;
  width: max(2016px, 140vw) !important;
  height: 997px !important;
  border-radius: 555px !important;
  background: #022c22 !important;
  background-image: none !important;
  filter: blur(150px) !important;
  opacity: 1 !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
}

.final-cta-stage {
  position: relative !important;
  z-index: 1 !important;
}

.final-cta-figma .button-primary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  min-width: 140px !important;
  min-height: 60px !important;
  height: 60px !important;
  padding: 20px 32px !important;
  border: 0 !important;
  border-radius: 555px !important;
  background: #fff !important;
  color: #022c22 !important;
  box-shadow: none !important;
  font-family: "Inter", sans-serif !important;
  font-size: 16px !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  letter-spacing: 0 !important;
}

.site-footer.site-footer-figma {
  --footer-gutter: clamp(40px, 8.611vw, 124px);
  --footer-inner: min(1400px, calc(100vw - (2 * var(--footer-gutter))));
  --footer-right: 363px;
  position: relative !important;
  width: 100vw !important;
  max-width: none !important;
  height: 760px !important;
  min-height: 760px !important;
  padding: 80px 0 0 !important;
  overflow: hidden !important;
  background:
    radial-gradient(100% 72% at 50% 100%, rgba(105, 155, 129, 0.55) 0%, rgba(45, 98, 76, 0.34) 50%, rgba(2, 44, 34, 0) 82%),
    #022c22 !important;
}

.site-footer-figma .footer-content,
.site-footer-figma .footer-legal {
  width: var(--footer-inner) !important;
  max-width: none !important;
  margin-right: auto !important;
  margin-left: auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) var(--footer-right) !important;
  column-gap: 44px !important;
}

.site-footer-figma .footer-content {
  position: relative !important;
  z-index: 3 !important;
}

.site-footer-figma .footer-tagline {
  margin: 0 !important;
  justify-self: start !important;
}

.site-footer-figma .footer-links {
  width: var(--footer-right) !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 52px !important;
}

.site-footer-figma .footer-links nav {
  gap: 24px !important;
  font-family: "Inter", sans-serif !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

.site-footer-figma .footer-wordmark {
  position: absolute !important;
  right: auto !important;
  bottom: 44px !important;
  left: 50% !important;
  width: 100vw !important;
  height: auto !important;
  aspect-ratio: 1440 / 436.755 !important;
  overflow: visible !important;
  transform: translateX(-50%) !important;
}

.site-footer-figma .footer-wordmark img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: fill !important;
  opacity: 1 !important;
  filter: none !important;
}

.site-footer-figma .footer-legal {
  position: absolute !important;
  bottom: 24px !important;
  left: 50% !important;
  z-index: 4 !important;
  font-family: "Inter", sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  opacity: 0.3 !important;
  transform: translateX(-50%) !important;
}

.site-footer-figma .footer-legal nav {
  width: var(--footer-right) !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 52px !important;
}

@media (max-width: 1050px) {
  .final-cta.final-cta-figma::before {
    bottom: -430px !important;
    width: max(1500px, 165vw) !important;
    height: 860px !important;
    filter: blur(125px) !important;
  }

  .site-footer.site-footer-figma {
    --footer-gutter: 40px;
    --footer-right: 320px;
    height: 640px !important;
    min-height: 640px !important;
  }
}

@media (max-width: 680px) {
  .final-cta.final-cta-figma::before {
    bottom: -360px !important;
    width: 1100px !important;
    height: 720px !important;
    filter: blur(100px) !important;
  }

  .final-cta-figma .button-primary {
    min-height: 56px !important;
    height: 56px !important;
    padding: 18px 28px !important;
  }

  .site-footer.site-footer-figma {
    --footer-gutter: 20px;
    --footer-right: 100%;
    height: 700px !important;
    min-height: 700px !important;
    padding-top: 56px !important;
  }

  .site-footer-figma .footer-content {
    grid-template-columns: 1fr !important;
    row-gap: 40px !important;
  }

  .site-footer-figma .footer-links {
    width: 100% !important;
    gap: 32px !important;
  }

  .site-footer-figma .footer-links nav {
    font-size: 17px !important;
  }

  .site-footer-figma .footer-wordmark {
    bottom: 82px !important;
    width: 150vw !important;
  }

  .site-footer-figma .footer-legal {
    bottom: 20px !important;
    grid-template-columns: 1fr !important;
    row-gap: 10px !important;
  }

  .site-footer-figma .footer-legal nav {
    width: 100% !important;
    gap: 24px !important;
  }
}

.faq::after { content: none !important; }

.final-cta.final-cta-figma {
  width: 100vw !important;
  max-width: none !important;
  margin: 0 0 0 calc(50% - 50vw) !important;
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  z-index: 1 !important;
  background:
    radial-gradient(130% 80% at 50% 0%,
      #f3efe5 0%,
      #f3efe5 12%,
      rgba(238, 237, 228, .99) 25%,
      rgba(218, 224, 214, .97) 39%,
      rgba(170, 188, 174, .96) 55%,
      rgba(90, 125, 105, .98) 72%,
      #214f3e 86%,
      #002e20 100%) !important;
}

.final-cta.final-cta-figma::before {
  content: "" !important;
  position: absolute !important;
  z-index: 0 !important;
  top: -180px !important;
  right: -12vw !important;
  left: -12vw !important;
  height: 500px !important;
  pointer-events: none !important;
  background: linear-gradient(180deg,
    #f3efe5 0%,
    rgba(243, 239, 229, .99) 34%,
    rgba(222, 226, 216, .82) 66%,
    rgba(177, 195, 180, 0) 100%) !important;
  filter: blur(44px) !important;
}

.final-cta-figma .final-cta-stage {
  position: relative !important;
  z-index: 1 !important;
}

/* Footer: one shared grid keeps top links and legal links aligned. */
.site-footer.site-footer-figma {
  --footer-inner: min(1192px, calc(100vw - 96px));
  --footer-right: 456px;
  --footer-link-a: 176px;
  --footer-link-b: 216px;
  --footer-link-gap: 64px;
  height: 760px !important;
  min-height: 760px !important;
  padding: 88px 0 0 !important;
  overflow: hidden !important;
  position: relative !important;
  background: #002e20 !important;
}

.site-footer-figma .footer-content,
.site-footer-figma .footer-legal {
  width: var(--footer-inner) !important;
  max-width: none !important;
  margin-inline: auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) var(--footer-right) !important;
  gap: 72px !important;
}

.site-footer-figma .footer-content {
  position: relative !important;
  z-index: 3 !important;
}

.site-footer-figma .footer-tagline {
  margin: 0 !important;
  justify-self: start !important;
}

.site-footer-figma .footer-links,
.site-footer-figma .footer-legal nav {
  width: var(--footer-right) !important;
  display: grid !important;
  grid-template-columns: var(--footer-link-a) var(--footer-link-b) !important;
  column-gap: var(--footer-link-gap) !important;
}

.site-footer-figma .footer-wordmark {
  width: 100vw !important;
  height: auto !important;
  aspect-ratio: 1440 / 436.755 !important;
  position: absolute !important;
  right: 0 !important;
  bottom: 56px !important;
  left: 0 !important;
  z-index: 1 !important;
  overflow: visible !important;
  pointer-events: none !important;
}

.site-footer-figma .footer-wordmark img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  object-fit: contain !important;
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}

.site-footer-figma .footer-legal {
  position: absolute !important;
  right: 0 !important;
  bottom: 30px !important;
  left: 0 !important;
  z-index: 3 !important;
  align-items: end !important;
}

.site-footer-figma .footer-legal > span,
.site-footer-figma .footer-legal nav {
  align-self: end !important;
}

/* Scrollable timeline example modal. */
.timeline-example-modal[hidden] { display: none !important; }
.timeline-example-modal { position: fixed !important; inset: 0 !important; z-index: 10000 !important; }

.timeline-example-backdrop {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(0, 0, 0, .52) !important;
  -webkit-backdrop-filter: blur(4px) !important;
  backdrop-filter: blur(4px) !important;
}

.timeline-example-dialog {
  position: absolute !important;
  inset: 12px !important;
  max-width: none !important;
  overflow: hidden !important;
  border-radius: 24px !important;
  background: #f3efe5 !important;
  box-shadow: 0 28px 96px rgba(0, 0, 0, .3) !important;
}

.timeline-example-close {
  width: 36px !important;
  height: 36px !important;
  padding: 0 !important;
  position: fixed !important;
  top: 32px !important;
  right: 32px !important;
  z-index: 10020 !important;
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: #002e20 !important;
  background: #fff !important;
  box-shadow: 0 3px 18px rgba(0, 0, 0, .12) !important;
  cursor: pointer !important;
}

.timeline-example-scroll {
  width: 100% !important;
  height: 100% !important;
  overflow: auto !important;
  overscroll-behavior: contain !important;
}

.timeline-example-hero {
  min-height: 396px !important;
  padding: 56px 80px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 16px !important;
  text-align: center !important;
  color: #fff !important;
  background: #022c22 !important;
}

.timeline-example-hero::before,
.timeline-example-hero::after { content: none !important; }
.timeline-example-hero img { width: 100px !important; height: 100px !important; flex: none !important; border-radius: 50% !important; object-fit: cover !important; }
.timeline-example-hero h2 { margin: 0 !important; color: #fff !important; font-family: var(--font-instrument-serif), Georgia, serif !important; font-size: 72px !important; line-height: 1 !important; font-weight: 400 !important; letter-spacing: -.035em !important; }
.timeline-example-hero p { margin: 0 !important; color: rgba(255, 255, 255, .7) !important; font-size: 16px !important; line-height: 1.5 !important; }

.timeline-example-tabs {
  min-height: 64px !important;
  padding: 0 52px !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 15 !important;
  display: flex !important;
  align-items: stretch !important;
  gap: 32px !important;
  border-top: .5px solid rgba(0, 46, 32, .12) !important;
  border-bottom: .5px solid rgba(0, 46, 32, .12) !important;
  background: rgba(243, 239, 229, .96) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  backdrop-filter: blur(16px) !important;
}

.timeline-example-tabs button {
  padding: 0 !important;
  position: relative !important;
  border: 0 !important;
  color: rgba(0, 46, 32, .48) !important;
  background: transparent !important;
  font: 500 12px/1 "Inter", sans-serif !important;
  cursor: pointer !important;
}

.timeline-example-tabs button[aria-selected="true"] { color: #002e20 !important; }
.timeline-example-tabs button[aria-selected="true"]::after { content: ""; height: 2px; position: absolute; right: 0; bottom: 0; left: 0; background: #002e20; }

.timeline-example-panels {
  max-width: 1440px !important;
  margin: 0 auto !important;
  padding: 100px 64px 120px !important;
  background: #f3efe5 !important;
}

.timeline-example-panel { max-width: 1312px !important; margin: 0 auto !important; }
.timeline-example-panel[hidden] { display: none !important; }
.timeline-example-timeline { display: grid !important; grid-template-columns: 240px minmax(0, 1fr) !important; gap: 80px !important; }

@media (max-width: 1050px) {
  .site-footer.site-footer-figma {
    --footer-inner: min(900px, calc(100vw - 64px));
    --footer-right: 348px;
    --footer-link-a: 140px;
    --footer-link-b: 172px;
    --footer-link-gap: 36px;
    height: 680px !important;
    min-height: 680px !important;
    padding-top: 64px !important;
  }
  .site-footer-figma .footer-content,
  .site-footer-figma .footer-legal { gap: 36px !important; }
  .site-footer-figma .footer-wordmark { bottom: 64px !important; }
  .timeline-example-dialog { inset: 8px !important; }
  .timeline-example-hero { padding: 56px 36px !important; }
  .timeline-example-hero h2 { font-size: 62px !important; }
  .timeline-example-panels { padding: 72px 36px 96px !important; }
  .timeline-example-timeline { grid-template-columns: 190px minmax(0, 1fr) !important; gap: 40px !important; }
}

@media (max-width: 680px) {
  .final-cta.final-cta-figma::before { top: -110px !important; height: 340px !important; filter: blur(30px) !important; }
  .site-footer.site-footer-figma {
    --footer-inner: calc(100vw - 40px);
    height: 760px !important;
    min-height: 760px !important;
    padding-top: 64px !important;
  }
  .site-footer-figma .footer-content { grid-template-columns: 1fr !important; gap: 48px !important; }
  .site-footer-figma .footer-links { width: 100% !important; grid-template-columns: 1fr 1fr !important; column-gap: 24px !important; }
  .site-footer-figma .footer-wordmark { bottom: 70px !important; }
  .site-footer-figma .footer-legal { bottom: 20px !important; grid-template-columns: 1fr !important; gap: 12px !important; }
  .site-footer-figma .footer-legal nav { width: 100% !important; grid-template-columns: auto auto !important; justify-content: start !important; column-gap: 24px !important; }
  .timeline-example-dialog { inset: 6px !important; border-radius: 18px !important; }
  .timeline-example-close { top: 14px !important; right: 14px !important; }
  .timeline-example-hero { min-height: 320px !important; padding: 68px 22px 44px !important; }
  .timeline-example-hero img { width: 80px !important; height: 80px !important; }
  .timeline-example-hero h2 { font-size: 48px !important; }
  .timeline-example-tabs { padding: 0 20px !important; gap: 26px !important; overflow-x: auto !important; }
  .timeline-example-panels { padding: 48px 20px 72px !important; }
  .timeline-example-timeline { grid-template-columns: 1fr !important; gap: 32px !important; }
}

/* Final visual lock — preserve the approved Figma transitions and footer grid. */
.hero-shell {
  margin-bottom: -2px !important;
  border: 0 !important;
  background:
    radial-gradient(56.82% 39.06% at 50% 0%, rgba(198, 252, 130, .12) 0%, rgba(0, 97, 68, 0) 100%),
    #002e20 !important;
  background-color: #002e20 !important;
  box-shadow: 0 3px 0 #002e20 !important;
}

.how {
  margin-top: -2px !important;
  border-top: 0 !important;
  background-color: #002e20 !important;
  box-shadow: 0 -3px 0 #002e20 !important;
}

.faq {
  position: relative !important;
  z-index: 2 !important;
  isolation: isolate !important;
  margin-bottom: 0 !important;
  overflow: hidden !important;
  background: #f3efe5 !important;
  background-image: none !important;
}

.faq::before,
.faq::after {
  content: none !important;
  display: none !important;
}

.final-cta.final-cta-figma {
  position: relative !important;
  isolation: isolate !important;
  width: 100vw !important;
  max-width: none !important;
  height: 802px !important;
  min-height: 802px !important;
  margin: 0 0 0 calc(50% - 50vw) !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #f3efe5 !important;
  background-image: none !important;
}

.final-cta.final-cta-figma::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 0 !important;
  width: max(2016px, 140vw) !important;
  height: 997px !important;
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  bottom: -498px !important;
  transform: translateX(-50%) !important;
  border-radius: 555px !important;
  background: #002e20 !important;
  background-image: none !important;
  filter: blur(150px) !important;
  opacity: 1 !important;
  pointer-events: none !important;
}

.final-cta-figma .final-cta-stage {
  position: relative !important;
  z-index: 1 !important;
  width: min(1440px, 100vw) !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  overflow: visible !important;
}

.final-cta-figma .button-primary {
  min-width: 140px !important;
  height: 56px !important;
  padding: 0 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 555px !important;
  background: #fff !important;
  color: #002e20 !important;
  box-shadow: none !important;
  font-family: "Inter", sans-serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

.site-footer.site-footer-figma {
  --footer-inner: min(1192px, calc(100vw - 96px));
  --footer-right: 456px;
  --footer-link-a: 176px;
  --footer-link-b: 216px;
  --footer-link-gap: 64px;
  position: relative !important;
  width: 100vw !important;
  max-width: none !important;
  height: 760px !important;
  min-height: 760px !important;
  margin: 0 0 0 calc(50% - 50vw) !important;
  padding: 88px 0 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  background:
    radial-gradient(88.64% 60.94% at 50% 100%, rgba(217, 249, 157, .12) 0%, rgba(6, 95, 70, 0) 100%),
    #002e20 !important;
}

.site-footer.site-footer-figma::before,
.site-footer.site-footer-figma::after {
  content: none !important;
}

.site-footer-figma .footer-content,
.site-footer-figma .footer-legal {
  width: var(--footer-inner) !important;
  max-width: none !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) var(--footer-right) !important;
  gap: 72px !important;
}

.site-footer-figma .footer-content {
  position: relative !important;
  z-index: 3 !important;
}

.site-footer-figma .footer-tagline {
  margin: 0 !important;
  justify-self: start !important;
}

.site-footer-figma .footer-links,
.site-footer-figma .footer-legal nav {
  width: var(--footer-right) !important;
  display: grid !important;
  grid-template-columns: var(--footer-link-a) var(--footer-link-b) !important;
  column-gap: var(--footer-link-gap) !important;
}

.site-footer-figma .footer-links {
  align-items: start !important;
}

.site-footer-figma .footer-wordmark {
  position: absolute !important;
  z-index: 1 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 72px !important;
  width: 100vw !important;
  height: auto !important;
  aspect-ratio: 1440 / 436.755 !important;
  overflow: visible !important;
  opacity: 1 !important;
  pointer-events: none !important;
}

.site-footer-figma .footer-wordmark img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  display: block !important;
  object-fit: fill !important;
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}

.site-footer-figma .footer-legal {
  position: absolute !important;
  z-index: 3 !important;
  left: 50% !important;
  right: auto !important;
  bottom: 32px !important;
  transform: translateX(-50%) !important;
  align-items: end !important;
}

.site-footer-figma .footer-legal > span,
.site-footer-figma .footer-legal nav a {
  justify-self: start !important;
  text-align: left !important;
}

@media (max-width: 1050px) {
  .final-cta.final-cta-figma {
    height: 700px !important;
    min-height: 700px !important;
  }

  .final-cta.final-cta-figma::before {
    width: max(1500px, 150vw) !important;
    height: 760px !important;
    bottom: -380px !important;
    filter: blur(115px) !important;
  }

  .site-footer.site-footer-figma {
    --footer-inner: min(900px, calc(100vw - 64px));
    --footer-right: 348px;
    --footer-link-a: 140px;
    --footer-link-b: 172px;
    --footer-link-gap: 36px;
    height: 680px !important;
    min-height: 680px !important;
    padding-top: 64px !important;
  }

  .site-footer-figma .footer-content,
  .site-footer-figma .footer-legal {
    gap: 36px !important;
  }

  .site-footer-figma .footer-wordmark {
    bottom: 64px !important;
  }
}

@media (max-width: 680px) {
  .hero-shell {
    margin-bottom: -1px !important;
    box-shadow: 0 2px 0 #002e20 !important;
  }

  .how {
    margin-top: -1px !important;
    box-shadow: 0 -2px 0 #002e20 !important;
  }

  .final-cta.final-cta-figma {
    height: 620px !important;
    min-height: 620px !important;
  }

  .final-cta.final-cta-figma::before {
    width: 1100px !important;
    height: 650px !important;
    bottom: -360px !important;
    filter: blur(90px) !important;
  }

  .final-cta-figma .button-primary {
    height: 52px !important;
    padding: 0 28px !important;
    font-size: 15px !important;
  }

  .site-footer.site-footer-figma {
    --footer-inner: calc(100vw - 40px);
    height: 760px !important;
    min-height: 760px !important;
    padding-top: 64px !important;
  }

  .site-footer-figma .footer-content {
    grid-template-columns: 1fr !important;
    gap: 48px !important;
  }

  .site-footer-figma .footer-links {
    width: 100% !important;
    grid-template-columns: 1fr 1fr !important;
    column-gap: 24px !important;
  }

  .site-footer-figma .footer-wordmark {
    left: -30vw !important;
    right: auto !important;
    bottom: 72px !important;
    width: 160vw !important;
  }

  .site-footer-figma .footer-legal {
    bottom: 20px !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .site-footer-figma .footer-legal nav {
    width: 100% !important;
    grid-template-columns: auto auto !important;
    justify-content: start !important;
    column-gap: 24px !important;
  }
}

/* Authoritative closure. Keep this block last. */
.hero-shell {
  margin: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background:
    radial-gradient(56.82% 39.06% at 50% 0%, rgba(198, 252, 130, 0.12) 0%, rgba(0, 97, 68, 0) 100%),
    #002e20 !important;
}

.how {
  position: relative !important;
  isolation: isolate !important;
  margin: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: hidden !important;
  background: #f3efe5 !important;
}

.how::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 0 !important;
  top: -486px !important;
  left: 50% !important;
  width: max(2592px, 180vw) !important;
  height: 997px !important;
  border-radius: 555px !important;
  background: #022c22 !important;
  background-image: none !important;
  filter: blur(225px) !important;
  opacity: 1 !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
}

.how::after {
  content: none !important;
  display: none !important;
}

.how > * {
  position: relative;
  z-index: 1;
}

.faq {
  position: relative !important;
  z-index: 2 !important;
  isolation: isolate !important;
  overflow: hidden !important;
  background: #f3efe5 !important;
  background-image: none !important;
}

.faq::before,
.faq::after {
  content: none !important;
  display: none !important;
}

.final-cta.final-cta-figma {
  position: relative !important;
  z-index: 1 !important;
  isolation: isolate !important;
  overflow: hidden !important;
  background: #f3efe5 !important;
  background-image: none !important;
}

.final-cta.final-cta-figma::before {
  top: 240px !important;
  right: auto !important;
  bottom: auto !important;
  left: 50% !important;
  width: max(2200px, 155vw) !important;
  height: 1100px !important;
  border-radius: 50% !important;
  background: #002e20 !important;
  background-image: none !important;
  filter: blur(170px) !important;
  opacity: 1 !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
}

.final-cta-figma .button-primary {
  min-width: 140px !important;
  height: 56px !important;
  padding: 0 32px !important;
  border: 0 !important;
  border-radius: 555px !important;
  background: #fff !important;
  color: #002e20 !important;
  box-shadow: none !important;
  font-family: "Inter", sans-serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

.site-footer.site-footer-figma {
  --footer-inner: min(1296px, calc(100vw - 144px));
  height: 760px !important;
  min-height: 760px !important;
  padding: 88px 0 0 !important;
  overflow: hidden !important;
  background:
    radial-gradient(100% 66% at 50% 100%, rgba(104, 155, 129, 0.5) 0%, rgba(35, 91, 69, 0.32) 42%, rgba(0, 46, 32, 0) 76%),
    #002e20 !important;
}

.site-footer-figma .footer-wordmark {
  left: 50% !important;
  right: auto !important;
  bottom: 40px !important;
  width: 100vw !important;
  overflow: visible !important;
  transform: translateX(-50%) !important;
}

.site-footer-figma .footer-wordmark img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  opacity: 1 !important;
  filter: none !important;
}

.site-footer-figma .footer-legal {
  bottom: 28px !important;
}

@media (max-width: 1050px) {
  .how::before {
    top: -410px !important;
    width: max(1800px, 190vw) !important;
    height: 860px !important;
    filter: blur(160px) !important;
  }

  .final-cta.final-cta-figma::before {
    top: 210px !important;
    width: max(1500px, 165vw) !important;
    height: 860px !important;
    filter: blur(125px) !important;
  }

  .site-footer.site-footer-figma {
    --footer-inner: min(900px, calc(100vw - 80px));
  }
}

@media (max-width: 680px) {
  .how::before {
    top: -360px !important;
    width: 1100px !important;
    height: 760px !important;
    filter: blur(120px) !important;
  }

  .final-cta.final-cta-figma::before {
    top: 180px !important;
    width: 1100px !important;
    height: 720px !important;
    filter: blur(100px) !important;
  }

  .final-cta-figma .button-primary {
    height: 56px !important;
    padding: 0 32px !important;
    font-size: 16px !important;
  }

  .site-footer.site-footer-figma {
    --footer-inner: calc(100vw - 40px);
  }

  .site-footer-figma .footer-wordmark {
    left: 50% !important;
    right: auto !important;
    bottom: 56px !important;
    width: 160vw !important;
    transform: translateX(-50%) !important;
  }

  .site-footer-figma .footer-legal {
    bottom: 20px !important;
  }
}

/* ==== landing-role-oils.css ==== */

/* Role cards — oil cutouts, matched visual size, centered in slot */
.role-graphic-oil {
  box-sizing: border-box;
  width: 100%;
  height: 152px;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.role-oil-canvas {
  position: relative;
  width: 116px;
  height: 116px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  box-shadow: none;
  overflow: visible;
  animation: role-oil-float 5.6s ease-in-out infinite;
}

.role-oil-canvas::before,
.role-oil-canvas::after {
  display: none;
}

.role-oil-canvas img {
  display: block;
  width: 116px;
  height: 116px;
  max-width: 116px;
  max-height: 116px;
  object-fit: contain;
  object-position: center;
  filter: none;
  transform-origin: center center;
  animation: role-oil-drift 7.2s ease-in-out infinite;
}

.role-graphic-keeper .role-oil-canvas {
  animation-delay: 0s;
}

.role-graphic-storyteller .role-oil-canvas {
  animation-delay: -1.8s;
}

.role-graphic-viewers .role-oil-canvas {
  animation-delay: -3.4s;
}

.role-graphic-keeper .role-oil-canvas img {
  animation-delay: -0.6s;
}

.role-graphic-storyteller .role-oil-canvas img {
  animation-delay: -2.2s;
}

.role-graphic-viewers .role-oil-canvas img {
  animation-delay: -4.1s;
}

@keyframes role-oil-float {
  0%,
  100% {
    transform: translateY(0) rotate(-1deg);
  }

  50% {
    transform: translateY(-4px) rotate(1deg);
  }
}

@keyframes role-oil-drift {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-2px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .role-oil-canvas,
  .role-oil-canvas img {
    animation: none;
  }
}

@media (max-width: 680px) {
  .role-graphic-oil {
    height: 140px;
  }
}

/* ==== landing-place-graphics.css ==== */

/* Places tabs — full-panel generated illustrations */
.place-panel,
.place-panel-timeline,
.place-panel-media,
.place-panel-thoughts {
  display: block !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #f4efe4 !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
}

.place-panel[hidden],
.place-panel-timeline[hidden],
.place-panel-media[hidden],
.place-panel-thoughts[hidden] {
  display: none !important;
}

.place-panel-art {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  overflow: hidden !important;
  border-radius: inherit;
}

.place-panel-art img,
.places-media .place-panel-art img,
body.landing .places-media .place-panel-art img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center !important;
  opacity: 1 !important;
  animation: place-panel-breathe 8s ease-in-out infinite;
}

.place-panel-timeline .place-panel-art img {
  object-position: center 42% !important;
  animation-delay: 0s;
}

.place-panel-media .place-panel-art img {
  object-position: center 48% !important;
  animation-delay: -2.4s;
}

.place-panel-thoughts .place-panel-art img {
  object-position: center 44% !important;
  animation-delay: -4.8s;
}

@keyframes place-panel-breathe {
  0%,
  100% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.03);
  }
}

@media (prefers-reduced-motion: reduce) {
  .place-panel-art img,
  .places-media .place-panel-art img,
  body.landing .places-media .place-panel-art img {
    animation: none;
  }
}

@media (max-width: 680px) {
  .place-panel-art img,
  .places-media .place-panel-art img {
    object-position: center !important;
  }
}

/* ==== landing-story-grow.css ==== */

/* Step 03 — scroll-revealed gallery (MWG 064), always landing */
.how-media.how-media-grow {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background: var(--paper, #f3efe5);
}

.story-grow {
  position: absolute;
  inset: 0;
  overflow: hidden;
  perspective: 900px;
  transform-style: preserve-3d;
}

.story-grow-media {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
  width: 38%;
  max-width: 220px;
  margin: 0;
  aspect-ratio: 0.75;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 18px 40px rgba(2, 44, 34, 0.14);
  transform-origin: center center;
  transform-style: preserve-3d;
  will-change: transform, opacity;
}

.story-grow-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 680px) {
  .story-grow-media {
    width: 44%;
    max-width: 168px;
    border-radius: 12px;
  }
}

/* ==== landing-pixel.css ==== */

:root {
  --held-paper: #f3efe5;
  --held-ink: #022c22;
  --held-gutter: clamp(24px, 8.611vw, 124px);
  /* Shared page CTA pill — one size for hero / places / pricing / final */
  --held-btn-height: 56px;
  --held-btn-pad-y: 20px;
  --held-btn-pad-x: 32px;
  --held-btn-radius: 555px;
  --held-btn-font: 16px;
}

/* One page-CTA size (nav-cta stays compact at 36px) */
.hero-actions .button {
  height: var(--held-btn-height) !important;
  min-height: var(--held-btn-height) !important;
  padding: var(--held-btn-pad-y) var(--held-btn-pad-x) !important;
  border-radius: var(--held-btn-radius) !important;
  font-size: var(--held-btn-font) !important;
  line-height: 1 !important;
}

html,
body,
main {
  background: var(--held-paper);
}

/* Hero and the first transition are one continuous surface.
   Hero stays above the how-section fade so tiles are never darkened. */
.hero-shell {
  position: relative !important;
  z-index: 4 !important;
  margin-bottom: -1px !important;
  border: 0 !important;
  box-shadow: none !important;
  background:
    radial-gradient(56.82% 39.06% at 50% 0%, rgba(217, 249, 157, 0.12) 0%, rgba(6, 95, 70, 0) 100%),
    var(--held-ink) !important;
}

.hero-shell .site-nav,
.hero-shell .hero-copy,
.hero-shell .hero-flow {
  position: relative !important;
  z-index: 2 !important;
}

.how {
  position: relative !important;
  z-index: 3 !important;
  isolation: isolate !important;
  overflow: hidden !important;
  margin-top: -1px !important;
  border: 0 !important;
  /* Figma-aligned — pt 152 / px 124 / pb 220 */
  padding: 152px 124px 220px !important;
  /* Figma 399:140 — emerald/950 → paper, stops at 4.143% / 41.432% */
  background: linear-gradient(
    180deg,
    var(--held-ink) 4.143%,
    var(--held-paper) 41.432%
  ) !important;
}

/* Gradient is on .how itself; no extra fade layer over hero tiles. */
.how::before {
  content: none !important;
  display: none !important;
}

.how::after {
  content: none !important;
  display: none !important;
}

.how > * {
  position: relative;
  z-index: 1;
}

/* FAQ stays paper-white. The green blur belongs to the CTA below it. */
.faq {
  position: relative !important;
  z-index: 2 !important;
  overflow: hidden !important;
  margin: 0 !important;
  background: var(--held-paper) !important;
  background-image: none !important;
}

.faq::before,
.faq::after {
  content: none !important;
  display: none !important;
}

.final-cta.final-cta-figma {
  position: relative !important;
  z-index: 1 !important;
  isolation: isolate !important;
  overflow: hidden !important;
  margin: 0 !important;
}

.final-cta.final-cta-figma::before,
.final-cta.final-cta-figma::after {
  content: none !important;
  display: none !important;
}

/* The footer follows the exported Figma geometry, including the full wordmark. */
.site-footer.site-footer-figma {
  --footer-inner: min(1400px, calc(100vw - (2 * var(--held-gutter))));
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  height: auto !important;
  min-height: 525px !important;
  padding: 72px 0 0 !important;
  background:
    radial-gradient(100% 66% at 50% 100%, rgba(104, 155, 129, 0.5) 0%, rgba(35, 91, 69, 0.32) 42%, rgba(0, 46, 32, 0) 76%),
    #002e20 !important;
}

.site-footer-figma .footer-content,
.site-footer-figma .footer-legal {
  position: absolute !important;
  right: auto !important;
  left: 50% !important;
  width: var(--footer-inner) !important;
  max-width: none !important;
  margin: 0 !important;
  transform: translateX(-50%) !important;
}

.site-footer-figma .footer-content {
  top: auto !important;
  height: auto !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 363px !important;
  align-items: start !important;
  gap: 64px !important;
}

.site-footer-figma .footer-tagline {
  margin: 0 !important;
  color: #fff !important;
  font-family: var(--font-instrument-serif), Georgia, serif !important;
  font-size: 46px !important;
  font-weight: 400 !important;
  line-height: 1.1 !important;
  letter-spacing: 0 !important;
}

.site-footer-figma .footer-links {
  width: 363px !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 52px !important;
}

.site-footer-figma .footer-links nav {
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
}

.site-footer-figma .footer-links a {
  color: #fff !important;
  font-family: "Inter", sans-serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

.site-footer-figma .footer-wordmark {
  position: absolute !important;
  z-index: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: auto !important;
  aspect-ratio: 1440 / 436.755 !important;
  overflow: visible !important;
  transform: none !important;
}

.site-footer-figma .footer-wordmark img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: fill !important;
  opacity: 1 !important;
  filter: brightness(1.15) saturate(1.05) !important;
}

.site-footer-figma .footer-legal {
  z-index: 2 !important;
  bottom: 28px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 363px !important;
  align-items: end !important;
  gap: 64px !important;
  color: #fff !important;
  opacity: 1 !important;
  font-family: "Inter", sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
}

.site-footer-figma .footer-legal nav {
  width: 363px !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 52px !important;
}

.site-footer-figma .footer-legal > span,
.site-footer-figma .footer-legal a {
  color: inherit !important;
  opacity: 0.3 !important;
  white-space: nowrap !important;
}

@media (max-width: 1050px) {
  :root {
    --held-gutter: 40px;
  }

  .site-footer-figma .footer-content,
  .site-footer-figma .footer-legal {
    grid-template-columns: minmax(0, 1fr) 320px !important;
    gap: 40px !important;
  }

  .site-footer-figma .footer-links,
  .site-footer-figma .footer-legal nav {
    width: 320px !important;
    gap: 36px !important;
  }

  .site-footer-figma .footer-links a {
    font-size: 16px !important;
  }
}

@media (max-width: 680px) {
  :root {
    --held-gutter: 20px;
  }

  .site-footer.site-footer-figma {
    height: 800px !important;
    min-height: 800px !important;
    padding-top: 64px !important;
  }

  .site-footer-figma .footer-content {
    top: 64px !important;
    grid-template-columns: 1fr !important;
    gap: 48px !important;
  }

  .site-footer-figma .footer-tagline {
    font-size: 36px !important;
  }
  }

  .site-footer-figma .footer-links {
    width: 100% !important;
    max-width: 363px !important;
  }

  .site-footer-figma .footer-wordmark {
    right: auto !important;
    bottom: 60px !important;
    left: 50% !important;
    width: 160vw !important;
    transform: translateX(-50%) !important;
  }

  .site-footer-figma .footer-legal {
    bottom: 20px !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .site-footer-figma .footer-legal nav {
    width: 100% !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 20px !important;
  }
}

/* full-bleed sections: content max-width only */
main > section,
.site-footer {
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
}

.how {
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
  /* Keep the transition blur inside .how — never over hero tiles. */
  overflow: hidden !important;
  background: #f3efe5 !important;
}

.how-intro,
.how-list {
  width: min(1192px, 100%) !important;
  max-width: 1192px !important;
  margin-inline: auto !important;
}

.how-card {
  width: 100% !important;
  max-width: 1192px !important;
  overflow: hidden !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
}

.how-media,
.how-media.how-media-gif {
  align-self: stretch !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-height: 100% !important;
  overflow: hidden !important;
  border-radius: 12px !important;
}

.how-media.how-media-gif > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

.pricing,
.household,
.final-cta {
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
}

/* Household — match mid-page section rhythm + type (pricing/FAQ) */
section.household {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 52px !important;
  padding: 220px 124px 0 !important;
  background: transparent !important;
}

section.household .section-intro {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 12px !important;
  width: min(1192px, 100%) !important;
  max-width: 1192px !important;
  margin: 0 auto !important;
  text-align: center !important;
}

section.household .section-intro::before {
  content: none !important;
  display: none !important;
}

section.household .section-intro .eyebrow {
  margin: 0 !important;
  color: #65a30d !important;
  font-family: Inter, sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 12px !important;
  letter-spacing: 0.48px !important;
  text-transform: uppercase !important;
}

section.household .section-intro h2 {
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  color: #022c22 !important;
  font-family: var(--font-instrument-serif), Georgia, serif !important;
  font-size: 72px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

section.household .section-intro > p:last-of-type {
  width: min(610px, 100%) !important;
  max-width: 610px !important;
  margin: 0 !important;
  color: #404040 !important;
  font-family: Inter, sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
}

section.household .household-grid {
  width: min(1192px, 100%) !important;
  max-width: 1192px !important;
  margin-top: 0 !important;
}

/* Match pricing card surface: white, no stroke, lime role labels */
section.household .role-card {
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 24px !important;
  background: #fff !important;
  box-shadow: none !important;
  align-items: stretch !important;
}

section.household .role-card > span {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  color: #65a30d !important;
  font-family: Inter, sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.48px !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

@media (max-width: 1050px) {
  section.household {
    padding: 120px 28px 0 !important;
    gap: 40px !important;
  }

  section.household .section-intro h2 {
    font-size: clamp(42px, 8vw, 56px) !important;
  }

  section.household .household-grid {
    width: 100% !important;
    max-width: 100% !important;
    gap: 24px !important;
  }
}

@media (max-width: 680px) {
  section.household {
    padding: 96px 20px 0 !important;
  }

  /* Figma 532:1771 — 350-wide white cards, centered labels, 24/30 pad */
  section.household .role-card {
    width: 100% !important;
    min-height: 0 !important;
    padding: 24px !important;
  }

  section.household .role-card > span {
    margin-bottom: 0 !important;
  }

  section.household .role-graphic {
    margin: 20px auto 16px !important;
  }

  section.household .role-card h3 {
    margin-top: 0 !important;
    text-align: left !important;
  }

  section.household .role-card p {
    text-align: left !important;
  }
}

/* How marks: backgrounds on the Figma target words (track at any width) */
.how-mark {
  position: relative !important;
  display: inline-block !important;
  white-space: nowrap !important;
  vertical-align: baseline !important;
  isolation: isolate !important;
  z-index: 0 !important;
}

.how-mark-scribble,
.how-mark-02 {
  isolation: isolate !important;
  z-index: 0 !important;
}

.how-mark-scribble::before,
.how-mark-02::before {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 108% !important;
  height: 0.95em !important;
  transform: translate(-50%, -52%) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
  pointer-events: none !important;
  z-index: -1 !important;
}

.how-mark-scribble::before {
  background-image: url("/marketing/how-figma/01.svg") !important;
}

.how-mark-02::before {
  width: 112% !important;
  height: 1.05em !important;
  background-image: url("/marketing/how-figma/card-02-circle.svg") !important;
}

.how-mark-01,
.how-mark-03 {
  padding-bottom: 0.08em !important;
}

/* Keep “whose stories matter” on one desktop line */
.how-card .checks img {
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  flex: none !important;
  object-fit: contain !important;
}

.how-card:first-child .how-mark-line {
  white-space: nowrap;
}

@media (max-width: 680px) {
  .how-card:first-child .how-mark-line {
    white-space: normal;
  }
}

.how-mark-01::after,
.how-mark-03::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 0.18em !important;
  background-repeat: no-repeat !important;
  background-position: center bottom !important;
  background-size: 100% 100% !important;
  pointer-events: none !important;
  z-index: -1 !important;
}

.how-mark-01::after {
  height: 0.16em !important;
  background-image: url("/marketing/how-figma/card-01-underline.svg") !important;
  transform: scaleY(-1) !important;
}

.how-mark-03::after {
  left: -4% !important;
  width: 108% !important;
  right: auto !important;
  height: 0.22em !important;
  background-image: url("/marketing/how-figma/card-03-underline.svg") !important;
  transform: rotate(6.05deg) !important;
  transform-origin: center bottom !important;
}

/* Kill legacy absolute scribble placement from landing-base */
.how-intro > .how-scribble,
.how-text > .how-title-mark,
.how-scribble,
.how-title-mark {
  display: none !important;
}

/* Every memory finds its place — 1192 content width, 124px gutters like how/pricing/footer */
section.places,
section.places#examples,
section.places#features {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 124px !important;
  align-items: stretch !important;
  width: min(1192px, calc(100% - 248px)) !important;
  max-width: 1192px !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
  height: auto !important;
  min-height: 670px !important;
}

section.places .places-example {
  align-self: flex-start !important;
  position: relative !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: var(--held-btn-height) !important;
  min-height: var(--held-btn-height) !important;
  margin: 0 !important;
  padding: var(--held-btn-pad-y) var(--held-btn-pad-x) !important;
  border: 0 !important;
  border-radius: var(--held-btn-radius) !important;
  background: linear-gradient(180deg, #047857 0%, #064e3b 100%) !important;
  box-shadow: inset 0 2px 2px rgba(255, 255, 255, 0.25) !important;
  color: #fff !important;
  font-family: Inter, sans-serif !important;
  font-size: var(--held-btn-font) !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

section.places .places-example:hover {
  filter: brightness(1.06) !important;
  background: linear-gradient(180deg, #047857 0%, #064e3b 100%) !important;
}

section.places .places-example:focus-visible {
  outline: 2px solid #047857 !important;
  outline-offset: 3px !important;
}

section.places .places-copy {
  height: auto !important;
  min-height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  gap: 32px !important;
}

/* Figma 526:1017 — option rows: top rule + 24px pad; last also bottom rule + 24px below */
section.places .place-options {
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
}

section.places .place-option {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 24px 0 0 !important;
  border: 0 !important;
  border-top: 1px solid rgba(10, 10, 10, 0.06) !important;
  background: none !important;
}

section.places .place-option:last-child {
  padding: 24px 0 !important;
  border-bottom: 1px solid rgba(10, 10, 10, 0.06) !important;
  margin-bottom: 24px !important;
}

/* Graphic fills the section column height (match left copy) */
section.places .places-media {
  box-sizing: border-box !important;
  position: relative !important;
  align-self: stretch !important;
  width: 100% !important;
  height: auto !important;
  min-height: 100% !important;
  overflow: hidden !important;
  border-radius: 24px !important;
  background: #fff !important;
}

section.places .place-panel {
  position: absolute !important;
  inset: 0 !important;
  box-sizing: border-box !important;
  height: 100% !important;
  min-height: 100% !important;
}

@media (max-width: 1200px) {
  section.places,
  section.places#examples,
  section.places#features {
    width: min(1192px, calc(100% - 96px)) !important;
  }
}

@media (max-width: 1050px) {
  section.places,
  section.places#examples,
  section.places#features {
    grid-template-columns: 1fr !important;
    gap: 40px !important;
    width: min(1192px, calc(100% - 56px)) !important;
    min-height: 0 !important;
  }

  section.places .places-copy {
    gap: 40px !important;
  }

  /* Figma 532:1679 — white cards: graphic → title → copy */
  section.places.is-places-stack .places-media {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  section.places.is-places-stack .places-copy {
    gap: 24px !important;
    align-items: stretch !important;
  }

  section.places.is-places-stack .places-intro {
    position: relative !important;
    width: 100% !important;
    max-width: 350px !important;
    margin-inline: auto !important;
    align-items: center !important;
    text-align: center !important;
    gap: 16px !important;
  }

  section.places.is-places-stack .places-copy h2,
  section.places.is-places-stack .places-intro > p {
    width: 100% !important;
    max-width: 350px !important;
    text-align: center !important;
  }

  section.places.is-places-stack .places-title-mark {
    left: 0 !important;
    top: auto !important;
    bottom: -0.02em !important;
    width: min(200px, 72%) !important;
    height: auto !important;
    transform: rotate(2.45deg) !important;
  }

  section.places.is-places-stack .place-options {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
  }

  section.places.is-places-stack .place-stack-item {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    box-sizing: border-box !important;
    width: 100% !important;
    padding: 8px !important;
    border-radius: 24px !important;
    background: #fff !important;
  }

  section.places.is-places-stack .place-option {
    cursor: default !important;
    pointer-events: none !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 24px !important;
    padding-left: 24px !important;
    border: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    background: none !important;
  }

  section.places.is-places-stack .place-option:last-child,
  section.places.is-places-stack .place-option:last-of-type {
    padding: 24px !important;
    border-bottom: 0 !important;
    margin-bottom: 0 !important;
  }

  section.places.is-places-stack .place-option strong,
  section.places.is-places-stack .place-option.active strong {
    color: #0a0a0a !important;
    font-size: 24px !important;
    font-weight: 500 !important;
    letter-spacing: -0.36px !important;
    line-height: 1.4 !important;
  }

  section.places.is-places-stack .place-option-copy {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    width: 100% !important;
  }

  section.places.is-places-stack .place-option-copy > span {
    width: 100% !important;
    max-height: none !important;
    opacity: 1 !important;
    transform: none !important;
    color: #404040 !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
  }

  section.places.is-places-stack .place-progress {
    display: none !important;
  }

  section.places.is-places-stack .place-panel {
    position: relative !important;
    inset: auto !important;
    box-sizing: border-box !important;
    display: block !important;
    visibility: visible !important;
    pointer-events: auto !important;
    opacity: 1 !important;
    transform: none !important;
    width: 100% !important;
    height: 350px !important;
    min-height: 350px !important;
    margin: 0 !important;
    overflow: hidden !important;
    border-radius: 24px !important;
    background: #fff !important;
  }

  section.places.is-places-stack .place-panel[hidden] {
    display: block !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  section.places.is-places-stack .places-example {
    width: 100% !important;
    min-height: var(--held-btn-height) !important;
    height: var(--held-btn-height) !important;
    margin-top: 12px !important;
    justify-content: center !important;
  }
}

@media (max-width: 680px) {
  section.places,
  section.places#examples,
  section.places#features {
    width: calc(100% - 40px) !important;
    gap: 24px !important;
    padding-inline: 0 !important;
  }

  section.places.is-places-stack .places-copy h2 {
    font-size: 50px !important;
    letter-spacing: -1px !important;
    line-height: 1 !important;
  }

  section.places.is-places-stack .place-panel {
    height: 350px !important;
    min-height: 350px !important;
  }
}

.pricing.pricing-single {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

.pricing .section-intro,
.pricing-version-panels,
.pricing-card {
  width: min(1192px, calc(100% - 48px)) !important;
  max-width: 1192px !important;
  margin-inline: auto !important;
}

/* FAQ: cream full-bleed, two columns centered at 1192 */
section.faq {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 72px !important;
  align-items: start !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 max(24px, calc((100vw - 1192px) / 2)) !important;
  box-sizing: border-box !important;
  background: #f3efe5 !important;
  background-image: none !important;
}

section.faq .faq-intro,
section.faq .faq-list {
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
}

section.faq .faq-intro h2 {
  margin: 8px 0 12px !important;
  color: #022c22 !important;
  font-family: var(--font-instrument-serif), Georgia, serif !important;
  font-size: 72px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
}

section.faq .faq-intro > p:last-of-type {
  width: min(378px, 100%) !important;
  color: #404040 !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
}

section.faq .faq-list summary {
  font-family: "Inter", sans-serif !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  letter-spacing: -0.2px !important;
  color: #0a0a0a !important;
}

section.faq .faq-list details p {
  width: 100% !important;
  max-width: none !important;
  color: #404040 !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
}

/* Footer 493:282 — 525 tall, 72px top, 1192 inner, 40px tagline */
.site-footer.site-footer-figma {
  --footer-inner: min(1192px, calc(100vw - (2 * var(--held-gutter))));
  height: auto !important;
  min-height: 525px !important;
  padding: 72px 0 0 !important;
}

.site-footer-figma .footer-content {
  top: auto !important;
  grid-template-columns: minmax(0, 1fr) 363px !important;
}

.site-footer-figma .footer-tagline {
  font-size: 46px !important;
  line-height: 1.1 !important;
}

.site-footer-figma .footer-legal {
  bottom: 24px !important;
}

@media (max-width: 900px) {
  section.faq {
    grid-template-columns: 1fr !important;
    gap: 40px !important;
    padding: 72px 24px !important;
  }

  section.faq .faq-intro h2 {
    font-size: 48px !important;
  }
}

/* Last word: hero tiles above the how transition; seamless ink→paper fade. */
.hero-shell {
  position: relative !important;
  z-index: 4 !important;
  margin-bottom: -1px !important;
  border: 0 !important;
  box-shadow: none !important;
  background:
    radial-gradient(56.82% 39.06% at 50% 0%, rgba(217, 249, 157, 0.12) 0%, rgba(6, 95, 70, 0) 100%),
    #022c22 !important;
}

.hero-shell .hero-flow,
.hero-shell .hero-copy,
.hero-shell .site-nav {
  position: relative !important;
  z-index: 2 !important;
}

.how {
  position: relative !important;
  z-index: 3 !important;
  isolation: isolate !important;
  overflow: hidden !important;
  margin-top: -1px !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 152px 124px 220px !important;
  background: linear-gradient(
    180deg,
    var(--held-ink) 4.143%,
    var(--held-paper) 41.432%
  ) !important;
}

.how::before {
  content: none !important;
  display: none !important;
}

/* —— Responsive: how section (tablet / mobile) —— */
@media (max-width: 1050px) {
  .how {
    padding: 72px 40px 160px !important;
  }

  .how-intro,
  .how-list {
    width: 100% !important;
    max-width: 100% !important;
  }

  .how-card {
    grid-template-columns: 1fr !important;
    height: auto !important;
    min-height: 0 !important;
    gap: 12px !important;
  }

  /* Figma 532:1968 — stacked cards: pack copy, don’t stretch */
  .how-copy {
    min-height: 0 !important;
    height: auto !important;
    padding: 24px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    gap: 24px !important;
  }

  .how-text {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    margin: 0 !important;
  }

  .how-text h3 {
    margin: 0 !important;
  }

  .how-text > p {
    margin: 0 !important;
  }

  .how-copy .checks,
  .how-copy .formats {
    margin: 0 !important;
  }

  .how-media,
  .how-media.how-media-gif {
    height: 320px !important;
    min-height: 320px !important;
    max-height: 360px !important;
  }
}

@media (max-width: 680px) {
  .how {
    padding: 64px 20px 120px !important;
  }

  /* Figma 532:2162 — hero CTAs fill width */
  .hero-actions {
    width: 100% !important;
    max-width: 100% !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
  }

  .hero-actions .button {
    width: 100% !important;
    height: var(--held-btn-height) !important;
    min-height: var(--held-btn-height) !important;
    box-sizing: border-box !important;
    justify-content: center !important;
    padding: var(--held-btn-pad-y) var(--held-btn-pad-x) !important;
    font-size: var(--held-btn-font) !important;
  }

  /* Figma 532:1966 — 24px between stacked how cards */
  .how-stack-stage {
    gap: 24px !important;
  }

  .how-card + .how-card {
    margin-top: 0 !important;
  }

  .how-media,
  .how-media.how-media-gif {
    height: 260px !important;
    min-height: 260px !important;
    max-height: 260px !important;
    border-radius: 16px !important;
  }

  .how-intro h2 {
    font-size: clamp(36px, 11vw, 48px) !important;
  }

  .how-text h3,
  .how-card:first-child .how-text h3 {
    width: auto !important;
    font-size: 42px !important;
    line-height: 42px !important;
  }

  section.places .places-example {
    width: 100% !important;
    align-self: stretch !important;
    justify-content: center !important;
  }
}

/* ==== landing-pricing-faq.css ==== */

/* Pricing 399:263 + FAQ 399:331 — authoritative overrides */

/* —— Pricing: two-column layout —— */
section.pricing.pricing-figma#pricing {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 220px 124px !important;
  background: #f3efe5 !important;
  background-image: none !important;
}

section.pricing.pricing-figma#pricing .pricing-layout {
  display: flex !important;
  align-items: center !important;
  gap: 124px !important;
  width: min(1192px, 100%) !important;
  max-width: 1192px !important;
  margin: 0 auto !important;
}

section.pricing.pricing-figma#pricing .pricing-intro {
  display: flex !important;
  flex: 1 1 0 !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 12px !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  text-align: left !important;
}

section.pricing.pricing-figma#pricing .pricing-intro .eyebrow {
  margin: 0 !important;
  color: #65a30d !important;
  font-family: Inter, sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 12px !important;
  letter-spacing: 0.48px !important;
  text-transform: uppercase !important;
}

section.pricing.pricing-figma#pricing .pricing-intro-title {
  position: relative !important;
  width: 100% !important;
}

section.pricing.pricing-figma#pricing .pricing-title-accent {
  position: relative !important;
  display: inline-block !important;
  white-space: nowrap !important;
  z-index: 0 !important;
}

section.pricing.pricing-figma#pricing .pricing-title-mark {
  position: absolute !important;
  z-index: -1 !important;
  left: 50% !important;
  top: 50% !important;
  width: calc(100% + 16px) !important;
  max-width: none !important;
  height: auto !important;
  min-width: 0 !important;
  aspect-ratio: 323 / 78 !important;
  transform: translate(-50%, -50%) !important;
  pointer-events: none !important;
}

section.pricing.pricing-figma#pricing .pricing-intro h2 {
  position: relative !important;
  z-index: 1 !important;
  width: 478px !important;
  max-width: 100% !important;
  margin: 0 !important;
  color: #022c22 !important;
  font-family: var(--font-instrument-serif), Georgia, serif !important;
  font-size: 72px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
}

section.pricing.pricing-figma#pricing .pricing-intro > p:last-of-type {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  color: #404040 !important;
  font-family: Inter, sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
}

section.pricing.pricing-figma#pricing .pricing-card {
  display: flex !important;
  flex: 1 1 0 !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 52px !important;
  box-sizing: border-box !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 32px !important;
  border: 0.5px solid #e5e5e5 !important;
  border-radius: 24px !important;
  background: #fff !important;
}

section.pricing.pricing-figma#pricing .pricing-toggle {
  width: 100% !important;
  padding: 2px !important;
  gap: 4px !important;
  border-radius: 555px !important;
  background: #f5f5f5 !important;
}

section.pricing.pricing-figma#pricing .pricing-toggle button {
  min-height: 36px !important;
  padding: 12px !important;
  color: #737373 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 12px !important;
  letter-spacing: 0.48px !important;
  text-transform: uppercase !important;
}

section.pricing.pricing-figma#pricing .pricing-toggle::before {
  width: calc((100% - 8px) / 2) !important;
  background: #fff !important;
  box-shadow: 0 1px 3px rgba(10, 10, 10, 0.05) !important;
}

section.pricing.pricing-figma#pricing .pricing-card[data-billing="annual"] .pricing-toggle::before {
  transform: translateX(calc(100% + 4px)) !important;
}

section.pricing.pricing-figma#pricing .pricing-toggle button.active {
  color: #0a0a0a !important;
  background: transparent !important;
}

section.pricing.pricing-figma#pricing .pricing-save {
  margin-left: 0 !important;
  color: inherit !important;
  font-size: 7.74px !important;
  font-weight: 600 !important;
  letter-spacing: 0.48px !important;
  text-transform: uppercase !important;
  background: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

section.pricing.pricing-figma#pricing .pricing-amount {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  width: 100% !important;
}

section.pricing.pricing-figma#pricing .pricing-amount p {
  margin: 0 !important;
  color: #022c22 !important;
  font-family: var(--font-instrument-serif), Georgia, serif !important;
  font-weight: 400 !important;
  line-height: 1 !important;
}

section.pricing.pricing-figma#pricing .pricing-dollars {
  font-size: 100px !important;
  line-height: 1 !important;
  --number-flow-mask-height: 0.12em;
}

section.pricing.pricing-figma#pricing .pricing-cents {
  font-size: 64.5px !important;
  line-height: 1 !important;
  vertical-align: baseline !important;
}

section.pricing.pricing-figma#pricing .pricing-cycle {
  color: #0a0a0a !important;
  font-family: Inter, sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  text-align: center !important;
  opacity: 1 !important;
}

section.pricing.pricing-figma#pricing .pricing-benefits {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

section.pricing.pricing-figma#pricing .pricing-card-footer {
  display: flex !important;
  flex-direction: column !important;
  gap: 20px !important;
  width: 100% !important;
}

section.pricing.pricing-figma#pricing .pricing-benefits li {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  color: rgba(10, 10, 10, 0.7) !important;
  font-family: Inter, sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
}

section.pricing.pricing-figma#pricing .pricing-benefit-check {
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 16px !important;
  color: #047857 !important;
}

section.pricing.pricing-figma#pricing .pricing-addon {
  color: #0a0a0a !important;
  font-weight: 400 !important;
}

section.pricing.pricing-figma#pricing .pricing-addon-unit {
  font-size: 9.03px !important;
}

section.pricing.pricing-figma#pricing .pricing-cta {
  width: 100% !important;
  box-sizing: border-box !important;
  height: var(--held-btn-height, 56px) !important;
  min-height: var(--held-btn-height, 56px) !important;
  padding: var(--held-btn-pad-y, 20px) var(--held-btn-pad-x, 32px) !important;
  border-radius: var(--held-btn-radius, 555px) !important;
  color: #fff !important;
  background: #064e3b !important;
  font-size: var(--held-btn-font, 16px) !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

/* —— FAQ: centered intro + two columns —— */
section.faq.faq-figma#faq {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 52px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 124px 152px !important;
  background: #f3efe5 !important;
  background-image: none !important;
}

section.faq.faq-figma#faq::before,
section.faq.faq-figma#faq::after {
  content: none !important;
  display: none !important;
}

section.faq.faq-figma#faq .faq-intro {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 12px !important;
  width: min(1192px, 100%) !important;
  max-width: 1192px !important;
  margin: 0 !important;
  text-align: center !important;
}

section.faq.faq-figma#faq .faq-intro .eyebrow {
  margin: 0 !important;
  color: #65a30d !important;
  font-family: Inter, sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 12px !important;
  letter-spacing: 0.48px !important;
  text-transform: uppercase !important;
}

section.faq.faq-figma#faq .faq-intro-title {
  position: relative !important;
  display: inline-flex !important;
  justify-content: center !important;
  width: auto !important;
  max-width: 100% !important;
}

section.faq.faq-figma#faq .faq-title-mark {
  position: absolute !important;
  z-index: 0 !important;
  left: 109px !important;
  top: -52px !important;
  width: 13.5px !important;
  height: 243px !important;
  transform: rotate(87.43deg) scaleY(-1) !important;
  transform-origin: center center !important;
  pointer-events: none !important;
}

section.faq.faq-figma#faq .faq-intro h2 {
  position: relative !important;
  z-index: 1 !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  color: #022c22 !important;
  font-family: var(--font-instrument-serif), Georgia, serif !important;
  font-size: 72px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

section.faq.faq-figma#faq .faq-intro > p:last-of-type {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  color: #404040 !important;
  font-family: Inter, sans-serif !important;
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
}

section.faq.faq-figma#faq .faq-columns {
  display: flex !important;
  align-items: flex-start !important;
  gap: 52px !important;
  width: min(1192px, 100%) !important;
  max-width: 1192px !important;
}

section.faq.faq-figma#faq .faq-list {
  display: flex !important;
  flex: 1 1 0 !important;
  flex-direction: column !important;
  gap: 0 !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  border: 0 !important;
}

section.faq.faq-figma#faq .faq-list details {
  margin: 0 !important;
  padding: 0 !important;
  border-top: 0.5px solid rgba(10, 10, 10, 0.12) !important;
  border-bottom: 0 !important;
}

section.faq.faq-figma#faq .faq-list details:last-child {
  border-bottom: 0.5px solid rgba(10, 10, 10, 0.12) !important;
}

section.faq.faq-figma#faq .faq-list summary {
  position: relative !important;
  display: block !important;
  /* Equal pad above/below — question + icon sit in the middle of the row */
  padding: 28px 40px 28px 0 !important;
  list-style: none !important;
  color: #0a0a0a !important;
  font-family: Inter, sans-serif !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  letter-spacing: -0.2px !important;
  cursor: pointer !important;
}

/* Keep summary padding equal when open so +/- stays centered on the question */
section.faq.faq-figma#faq .faq-list details.is-expanded summary {
  padding-bottom: 28px !important;
}

section.faq.faq-figma#faq .faq-list summary::-webkit-details-marker {
  display: none !important;
}

/* Plus / minus: vertical center of summary (equal padding keeps this correct open/closed) */
section.faq.faq-figma#faq .faq-list summary::before,
section.faq.faq-figma#faq .faq-list summary::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  right: 3px !important;
  width: 18px !important;
  height: 2px !important;
  margin-top: -1px !important;
  border-radius: 1px !important;
  background: #047857 !important;
  transition: transform 0.28s ease !important;
}

section.faq.faq-figma#faq .faq-list summary::before {
  transform: rotate(90deg) !important;
}

section.faq.faq-figma#faq .faq-list summary::after {
  transform: none !important;
}

section.faq.faq-figma#faq .faq-list details.is-expanded summary::before {
  transform: rotate(0deg) !important;
}

section.faq.faq-figma#faq .faq-list details p {
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 24px !important;
  padding: 0 32px 0 0 !important;
  color: #404040 !important;
  font-family: Inter, sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
}

/* Smooth expand / collapse — height driven by landing-faq.js */
section.faq.faq-figma#faq .faq-list .faq-answer {
  overflow: hidden !important;
  height: 0;
  margin: 0 !important;
  padding: 0 !important;
}

/* Pull answer into summary’s bottom pad → ~8–12px question→answer gap */
section.faq.faq-figma#faq .faq-list details.is-expanded .faq-answer {
  margin-top: -20px !important;
}

section.faq.faq-figma#faq .faq-list details.is-expanded .faq-answer p {
  opacity: 1;
  transform: translateY(0);
}

section.faq.faq-figma#faq .faq-list .faq-answer p {
  opacity: 0.001;
  transform: translateY(-6px);
  transition:
    opacity 0.28s ease,
    transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}

@media (prefers-reduced-motion: reduce) {
  section.faq.faq-figma#faq .faq-list .faq-answer p {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

@media (max-width: 1100px) {
  section.pricing.pricing-figma#pricing {
    padding: 120px 40px !important;
  }

  section.pricing.pricing-figma#pricing .pricing-layout {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 48px !important;
  }

  section.pricing.pricing-figma#pricing .pricing-intro {
    align-items: center !important;
    text-align: center !important;
  }

  section.pricing.pricing-figma#pricing .pricing-intro h2 {
    width: auto !important;
    font-size: 56px !important;
  }

  section.pricing.pricing-figma#pricing .pricing-title-mark {
    width: calc(100% + 12px) !important;
  }

  section.faq.faq-figma#faq {
    padding: 0 40px 120px !important;
  }

  section.faq.faq-figma#faq .faq-intro h2 {
    white-space: normal !important;
    font-size: 56px !important;
  }

  section.faq.faq-figma#faq .faq-columns {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    width: 100% !important;
  }

  section.faq.faq-figma#faq .faq-list {
    width: 100% !important;
    flex: 0 0 auto !important;
  }

  /* Avoid a mid-list divider when the two desktop columns stack */
  section.faq.faq-figma#faq .faq-list:not(:last-child) details:last-child {
    border-bottom: 0 !important;
  }
}

@media (max-width: 680px) {
  section.pricing.pricing-figma#pricing {
    padding: 88px 20px !important;
  }

  section.pricing.pricing-figma#pricing .pricing-intro h2 {
    font-size: 44px !important;
  }

  section.pricing.pricing-figma#pricing .pricing-card {
    padding: 24.5px !important;
    gap: 36px !important;
  }

  section.pricing.pricing-figma#pricing .pricing-dollars {
    font-size: 72px !important;
  }

  section.pricing.pricing-figma#pricing .pricing-cents {
    font-size: 46px !important;
  }

  section.pricing.pricing-figma#pricing .pricing-amount {
    gap: 0 !important;
  }

  section.faq.faq-figma#faq {
    padding: 0 20px 88px !important;
    gap: 40px !important;
  }

  /* Figma 532:1910 — no desktop scribble on mobile */
  section.faq.faq-figma#faq .faq-title-mark {
    display: none !important;
  }

  section.faq.faq-figma#faq .faq-intro h2 {
    font-size: 42px !important;
    line-height: 1 !important;
  }

  section.faq.faq-figma#faq .faq-list summary {
    padding: 24px 40px 24px 0 !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    letter-spacing: -0.2px !important;
  }

  section.faq.faq-figma#faq .faq-list details.is-expanded summary {
    padding-bottom: 24px !important;
  }

  section.faq.faq-figma#faq .faq-list details p {
    margin: 0 0 24px !important;
  }

  section.faq.faq-figma#faq .faq-list details.is-expanded .faq-answer {
    margin-top: -16px !important;
  }
}

/* ==== landing-cta-footer.css ==== */

/* CTA 524:752 — white card on paper→emerald gradient. Last sheet for CTA. */

section.final-cta.final-cta-figma#start {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 124px !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  /* Figma: gradient-to-t from emerald 19.6% → paper 88% */
  background: linear-gradient(
    180deg,
    #f3efe5 0%,
    #f3efe5 12.011%,
    #022c22 80.391%,
    #022c22 100%
  ) !important;
}

section.final-cta.final-cta-figma#start::before,
section.final-cta.final-cta-figma#start::after {
  content: none !important;
  display: none !important;
}

section.final-cta.final-cta-figma#start .final-cta-stage {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  box-sizing: border-box !important;
  width: min(1192px, 100%) !important;
  max-width: 1192px !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
  grid-template-columns: none !important;
}

section.final-cta.final-cta-figma#start .final-cta-panel {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 52px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 12px !important;
  border-radius: 24px !important;
  background: #fff !important;
  overflow: hidden !important;
}

section.final-cta.final-cta-figma#start .final-cta-copy {
  display: flex !important;
  flex: 1 1 0 !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 40px !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 72px !important;
}

section.final-cta.final-cta-figma#start .final-cta-copy-top {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 24px !important;
  width: 100% !important;
}

section.final-cta.final-cta-figma#start .final-cta-copy-body {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 12px !important;
  width: 100% !important;
}

section.final-cta.final-cta-figma#start .eyebrow {
  margin: 0 !important;
  width: 100% !important;
  color: #65a30d !important;
  font-family: Inter, sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.48px !important;
  line-height: 12px !important;
  text-transform: uppercase !important;
}

section.final-cta.final-cta-figma#start .final-cta-copy h2 {
  margin: 0 !important;
  width: 100% !important;
  max-width: none !important;
  color: #0a0a0a !important;
  font-family: var(--font-instrument-serif), Georgia, serif !important;
  font-size: 72px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

/* Figma 524:752 — underline rides the second line, not absolute pixels */
section.final-cta.final-cta-figma#start .final-cta-br-desk {
  display: none !important;
}

section.final-cta.final-cta-figma#start .final-cta-br-mob {
  display: block !important;
}

section.final-cta.final-cta-figma#start .final-cta-only-desk {
  display: none !important;
}

section.final-cta.final-cta-figma#start .final-cta-only-mob {
  display: inline !important;
}

section.final-cta.final-cta-figma#start .final-cta-mark {
  position: relative !important;
  display: inline-block !important;
  white-space: nowrap !important;
}

section.final-cta.final-cta-figma#start .final-cta-underline {
  position: absolute !important;
  z-index: -1 !important;
  top: auto !important;
  left: 0 !important;
  right: 0 !important;
  bottom: -0.08em !important;
  width: 100% !important;
  height: 0.16em !important;
  margin: 0 !important;
  display: block !important;
  object-fit: fill !important;
  transform: rotate(1.53deg) !important;
  pointer-events: none !important;
}

@media (min-width: 901px) {
  section.final-cta.final-cta-figma#start .final-cta-br-desk {
    display: block !important;
  }

  section.final-cta.final-cta-figma#start .final-cta-br-mob {
    display: none !important;
  }

  section.final-cta.final-cta-figma#start .final-cta-only-desk {
    display: inline !important;
  }

  section.final-cta.final-cta-figma#start .final-cta-only-mob {
    display: none !important;
  }
}

section.final-cta.final-cta-figma#start .final-cta-copy-body > p {
  margin: 0 !important;
  width: 100% !important;
  max-width: none !important;
  color: #0a0a0a !important;
  font-family: Inter, sans-serif !important;
  font-size: 17px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
  letter-spacing: 0 !important;
  opacity: 0.7 !important;
}

section.final-cta.final-cta-figma#start .button.button-primary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: auto !important;
  min-width: 0 !important;
  height: var(--held-btn-height, 56px) !important;
  min-height: var(--held-btn-height, 56px) !important;
  margin: 0 !important;
  padding: var(--held-btn-pad-y, 20px) var(--held-btn-pad-x, 32px) !important;
  border: 0 !important;
  border-radius: var(--held-btn-radius, 555px) !important;
  background: #064e3b !important;
  color: #fff !important;
  box-shadow: none !important;
  font-family: Inter, sans-serif !important;
  font-size: var(--held-btn-font, 16px) !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
}

section.final-cta.final-cta-figma#start .final-cta-media {
  position: relative !important;
  flex: 0 0 516px !important;
  align-self: stretch !important;
  width: 516px !important;
  min-height: 513px !important;
  margin: 0 !important;
  border-radius: 12px !important;
  background: #f3efe5 !important;
  overflow: hidden !important;
}

section.final-cta.final-cta-figma#start .final-cta-media-icon {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  display: block !important;
  width: 124px !important;
  height: 124px !important;
  opacity: 0.1 !important;
  transform: translate(-50%, -50%) !important;
  pointer-events: none !important;
}

section.final-cta.final-cta-figma#start .final-cta-media-icon img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
}

/* Hide legacy floating keepsakes if any leftover markup remains */
section.final-cta.final-cta-figma#start .final-cta-memory,
section.final-cta.final-cta-figma#start .section-intro {
  display: none !important;
}

@media (max-width: 1200px) {
  section.final-cta.final-cta-figma#start {
    padding: 0 40px !important;
  }

  section.final-cta.final-cta-figma#start .final-cta-panel {
    gap: 28px !important;
  }

  section.final-cta.final-cta-figma#start .final-cta-copy {
    padding: 48px !important;
    gap: 32px !important;
  }

  section.final-cta.final-cta-figma#start .final-cta-copy h2 {
    font-size: 56px !important;
  }

  section.final-cta.final-cta-figma#start .final-cta-media {
    flex-basis: 400px !important;
    width: 400px !important;
  }
}

@media (max-width: 900px) {
  section.final-cta.final-cta-figma#start {
    padding: 0 24px !important;
  }

  section.final-cta.final-cta-figma#start .final-cta-panel {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
  }

  section.final-cta.final-cta-figma#start .final-cta-copy {
    padding: 40px 28px 32px !important;
    gap: 28px !important;
  }

  section.final-cta.final-cta-figma#start .final-cta-copy h2 {
    font-size: 42px !important;
  }

  section.final-cta.final-cta-figma#start .final-cta-media {
    flex: none !important;
    width: 100% !important;
    min-height: 280px !important;
  }

  /* Figma 532:1907 — stacked CTA button fills the card */
  section.final-cta.final-cta-figma#start .button.button-primary {
    width: 100% !important;
    height: var(--held-btn-height, 56px) !important;
    min-height: var(--held-btn-height, 56px) !important;
    justify-content: center !important;
  }
}

/* Footer 493:282 — flex column, not leftover absolute 760px */
footer.site-footer.site-footer-figma {
  --footer-inner: 1192px;
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 525px !important;
  margin: 0 !important;
  padding: 72px 0 0 !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  gap: 0 !important;
  background:
    radial-gradient(88.64% 60.94% at 50% 100%, rgba(217, 249, 157, 0.12) 0%, rgba(6, 95, 70, 0) 100%),
    #022c22 !important;
  background-image:
    radial-gradient(88.64% 60.94% at 50% 100%, rgba(217, 249, 157, 0.12) 0%, rgba(6, 95, 70, 0) 100%),
    linear-gradient(#022c22, #022c22) !important;
  color: #fff !important;
}

footer.site-footer.site-footer-figma::before,
footer.site-footer.site-footer-figma::after {
  content: none !important;
  display: none !important;
}

footer.site-footer.site-footer-figma .footer-content {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  z-index: 2 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  box-sizing: border-box !important;
  width: var(--footer-inner) !important;
  max-width: var(--footer-inner) !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 0 !important;
  transform: none !important;
  gap: 52px !important;
  grid-template-columns: none !important;
}

footer.site-footer.site-footer-figma .footer-tagline {
  flex: 1 1 auto !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  color: #fff !important;
  font-family: var(--font-instrument-serif), Georgia, serif !important;
  font-size: 46px !important;
  font-weight: 400 !important;
  line-height: 1.1 !important;
  letter-spacing: 0 !important;
}

footer.site-footer.site-footer-figma .footer-links {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  justify-content: stretch !important;
  align-items: start !important;
  width: 363px !important;
  max-width: 363px !important;
  flex: 0 0 363px !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 52px !important;
}

footer.site-footer.site-footer-figma .footer-links nav {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 24px !important;
}

footer.site-footer.site-footer-figma .footer-links a {
  color: #fff !important;
  font-family: Inter, sans-serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
}

/* Full-bleed wordmark: 195px window on a 1440×436.755 SVG, letters continue behind legal. */
footer.site-footer.site-footer-figma .footer-wordmark {
  position: relative !important;
  z-index: 0 !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  box-sizing: border-box !important;
  width: 100vw !important;
  max-width: none !important;
  height: 195px !important;
  min-height: 195px !important;
  margin: 44px 0 0 !important;
  margin-left: calc(50% - 50vw) !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
  aspect-ratio: auto !important;
  pointer-events: none !important;
}

footer.site-footer.site-footer-figma .footer-wordmark img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: fill !important;
  object-position: top center !important;
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}

footer.site-footer.site-footer-figma .footer-legal {
  position: relative !important;
  z-index: 2 !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  box-sizing: border-box !important;
  width: var(--footer-inner) !important;
  max-width: var(--footer-inner) !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 24px 0 !important;
  transform: none !important;
  color: #fff !important;
  opacity: 1 !important;
  font-family: Inter, sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  grid-template-columns: none !important;
}

footer.site-footer.site-footer-figma .footer-legal span,
footer.site-footer.site-footer-figma .footer-legal a {
  color: #fff !important;
  opacity: 0.3 !important;
  text-decoration: none !important;
}

footer.site-footer.site-footer-figma .footer-legal nav {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  justify-content: stretch !important;
  align-items: center !important;
  width: 363px !important;
  max-width: 363px !important;
  flex: 0 0 363px !important;
  margin: 0 !important;
  gap: 52px !important;
}

@media (max-width: 1439px) {
  footer.site-footer.site-footer-figma {
    --footer-inner: min(1192px, calc(100vw - 48px));
  }
}

@media (max-width: 720px) {
  footer.site-footer.site-footer-figma .footer-content {
    flex-direction: column !important;
    gap: 40px !important;
  }

  footer.site-footer.site-footer-figma .footer-links,
  footer.site-footer.site-footer-figma .footer-legal nav {
    width: 100% !important;
    max-width: none !important;
    flex: 1 1 auto !important;
  }

  footer.site-footer.site-footer-figma .footer-legal {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 16px !important;
  }

  footer.site-footer.site-footer-figma .footer-wordmark {
    height: 120px !important;
    min-height: 120px !important;
    margin-top: 32px !important;
  }
}

/* Shared page CTA geometry — keep hero / places / pricing / final in lockstep.
   Nav CTA stays 36px on purpose. */
.hero-actions .button,
section.places .places-example,
section.pricing.pricing-figma#pricing .pricing-cta,
section.final-cta.final-cta-figma#start .button.button-primary {
  box-sizing: border-box !important;
  height: var(--held-btn-height, 56px) !important;
  min-height: var(--held-btn-height, 56px) !important;
  padding: var(--held-btn-pad-y, 20px) var(--held-btn-pad-x, 32px) !important;
  border-radius: var(--held-btn-radius, 555px) !important;
  font-size: var(--held-btn-font, 16px) !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

/* ==== landing-cta-media.css ==== */

/* Final CTA — painting sits in the media well, not clipped to the old mast */
section.final-cta.final-cta-figma#start .final-cta-media {
  background: transparent !important;
  overflow: visible !important;
}

section.final-cta.final-cta-figma#start .final-cta-media-icon {
  display: none !important;
}

.final-cta-media-art {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  animation: final-cta-breathe 10s ease-in-out infinite;
}

@keyframes final-cta-breathe {
  0%,
  100% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.03);
  }
}

@media (prefers-reduced-motion: reduce) {
  .final-cta-media-art {
    animation: none;
  }
}

/* ==== landing-example-modal.css ==== */

/* Landing example modal — Figma 493:906 (Desktop 10-story overlay).
   Scoped under #timeline-example-modal so these rules beat older modal CSS. */

#timeline-example-modal {
  --example-cream: var(--paper, #f3efe5);
  --example-ink: var(--ink, #022c22);
  --example-black: #0a0a0a;
  --example-forest: #064e3b;
  --example-brick: #b84a21;
  --example-peach: #ffa17e;
  --example-quiet: rgba(10, 10, 10, .7);
  --example-faint: rgba(10, 10, 10, .08);
  --example-serif: var(--serif, var(--font-instrument-serif), Georgia, serif);
  --example-sans: var(--sans, "Inter", system-ui, sans-serif);
}

#timeline-example-modal[hidden] { display: none !important; }

body.timeline-modal-open riffs-widget,
body.timeline-modal-open [class*="riffs"] {
  display: none !important;
}

#timeline-example-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10000 !important;
}

#timeline-example-modal .timeline-example-backdrop {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(2, 44, 34, .5) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  backdrop-filter: blur(6px) !important;
}

#timeline-example-modal .timeline-example-dialog {
  position: absolute !important;
  top: 12px !important;
  right: auto !important;
  bottom: 12px !important;
  left: 50% !important;
  width: min(2000px, calc(100vw - 24px)) !important;
  max-width: 2000px !important;
  height: calc(100vh - 24px) !important;
  max-height: calc(100vh - 24px) !important;
  transform: translateX(-50%) !important;
  overflow: hidden !important;
  border-radius: 24px !important;
  background: var(--example-cream) !important;
  box-shadow: 0 28px 96px rgba(2, 44, 34, .28) !important;
}

#timeline-example-modal .timeline-example-close {
  position: absolute !important;
  top: 20px !important;
  right: 20px !important;
  z-index: 30 !important;
  display: grid !important;
  width: 36px !important;
  height: 36px !important;
  padding: 0 !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 50% !important;
  color: var(--example-ink) !important;
  background: #fff !important;
  box-shadow: 0 3px 18px rgba(0, 0, 0, .12) !important;
  cursor: pointer !important;
}

#timeline-example-modal .timeline-example-close svg {
  width: 20px !important;
  height: 20px !important;
}

#timeline-example-modal .timeline-example-scroll {
  width: 100% !important;
  height: 100% !important;
  overflow: auto !important;
  overscroll-behavior: contain !important;
  background: var(--example-cream) !important;
  color: var(--example-black) !important;
  font-family: var(--example-sans) !important;
  -webkit-font-smoothing: antialiased;
}

#timeline-example-modal p,
#timeline-example-modal h2,
#timeline-example-modal h3,
#timeline-example-modal h4,
#timeline-example-modal figure,
#timeline-example-modal blockquote { margin: 0 !important; }

/* ----- Hero ----- */

#timeline-example-modal .timeline-example-hero {
  position: relative !important;
  isolation: isolate !important;
  display: flex !important;
  height: 336px !important;
  min-height: 336px !important;
  max-height: 336px !important;
  padding: 56px 80px !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  overflow: hidden !important;
  text-align: center !important;
  color: #fff !important;
  background: #022c22 !important;
}

#timeline-example-modal .timeline-example-hero::before,
#timeline-example-modal .timeline-example-hero::after { content: none !important; }

#timeline-example-modal .timeline-example-hero-paint {
  position: absolute !important;
  z-index: 0 !important;
  inset: -192px 0 auto !important;
  width: 100% !important;
  height: 720px !important;
  pointer-events: none !important;
}

#timeline-example-modal .timeline-example-hero-paint img {
  width: 100% !important;
  height: 100% !important;
  border-radius: 0 !important;
  object-fit: cover !important;
  object-position: center !important;
}

#timeline-example-modal .timeline-example-hero-portrait,
#timeline-example-modal .timeline-example-hero > img {
  position: relative !important;
  z-index: 2 !important;
  width: 100px !important;
  height: 100px !important;
  flex: none !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  object-position: 50% 28% !important;
}

#timeline-example-modal .timeline-example-hero-copy {
  position: relative !important;
  z-index: 3 !important;
  width: min(453px, 90%) !important;
  margin-top: 24px !important;
}

#timeline-example-modal .timeline-example-hero h2,
#timeline-example-modal .timeline-example-hero-copy h2 {
  margin: 0 !important;
  color: #fff !important;
  font-family: var(--example-serif) !important;
  font-size: 72px !important;
  font-weight: 400 !important;
  line-height: 72px !important;
  letter-spacing: 0 !important;
}

#timeline-example-modal .timeline-example-hero p,
#timeline-example-modal .timeline-example-hero-copy p {
  max-width: none !important;
  margin: 12px 0 0 !important;
  color: rgba(255, 255, 255, .7) !important;
  font-family: var(--example-sans) !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 16px !important;
}

/* ----- Tabs ----- */

#timeline-example-modal .timeline-example-tabs {
  position: sticky !important;
  top: 0 !important;
  z-index: 15 !important;
  display: flex !important;
  min-height: 49px !important;
  height: 49px !important;
  align-items: stretch !important;
  gap: 32px !important;
  padding: 0 52px !important;
  border-top: .5px solid var(--example-faint) !important;
  border-bottom: .5px solid var(--example-faint) !important;
  background: rgba(243, 239, 229, .96) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  backdrop-filter: blur(12px) !important;
}

#timeline-example-modal .timeline-example-tabs button {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 16px 0 17px !important;
  border: 0 !important;
  border-bottom: 1px solid transparent !important;
  background: none !important;
  color: rgba(10, 10, 10, .4) !important;
  font-family: var(--example-sans) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 15px !important;
  cursor: pointer !important;
}

#timeline-example-modal .timeline-example-tabs button::after { content: none !important; }

#timeline-example-modal .timeline-example-tabs button span {
  display: inline !important;
  margin: 0 !important;
  color: var(--example-brick) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  opacity: .3 !important;
}

#timeline-example-modal .timeline-example-tabs button.active,
#timeline-example-modal .timeline-example-tabs button[aria-selected="true"] {
  border-bottom-color: var(--example-black) !important;
  color: var(--example-black) !important;
}

#timeline-example-modal .timeline-example-tabs button.active::after,
#timeline-example-modal .timeline-example-tabs button[aria-selected="true"]::after { content: none !important; }

#timeline-example-modal .timeline-example-tabs button.active span,
#timeline-example-modal .timeline-example-tabs button[aria-selected="true"] span { opacity: 1 !important; }

#timeline-example-modal .timeline-example-panels { max-width:none!important;margin:0!important;padding:0!important;background:var(--example-cream)!important; }
#timeline-example-modal .timeline-example-panel { max-width:none!important;margin:0!important;padding:0 52px!important;background:var(--example-cream)!important; }
#timeline-example-modal .timeline-example-panel[hidden] { display:none!important; }
#timeline-example-modal .timeline-example-timeline { display:grid!important;grid-template-columns:340px minmax(0,1fr)!important;gap:0!important;align-items:start!important; }

#timeline-example-modal .timeline-example-chapters { position:sticky!important;top:49px!important;display:flex!important;min-height:calc(100vh - 200px)!important;padding:60px 60px 120px 0!important;flex-direction:column!important;align-items:stretch!important;gap:28px!important;overflow:visible!important;border-right:.5px solid var(--example-faint)!important;border-left:0!important; }
#timeline-example-modal .timeline-example-chapter { position:relative!important; }
#timeline-example-modal .timeline-example-chapter.is-open,
#timeline-example-modal .timeline-example-chapter.is-faded { padding-left:28px!important; }
#timeline-example-modal .timeline-example-chapter.is-open::before { content:""!important;position:absolute!important;top:0!important;bottom:0!important;left:0!important;width:1px!important;background:rgba(184,74,33,.16)!important; }
#timeline-example-modal .timeline-example-chapter-title { margin:0!important;color:var(--example-ink)!important;font-family:var(--example-sans)!important;font-size:16px!important;font-weight:500!important;line-height:1.2!important; }
#timeline-example-modal .timeline-example-chapter.is-faded .timeline-example-chapter-title { opacity:.3!important; }
#timeline-example-modal .timeline-example-chapter-items { display:flex!important;flex-direction:column!important;gap:16px!important;margin-top:16px!important; }
#timeline-example-modal .timeline-example-chapters a,
#timeline-example-modal .timeline-example-chapter-ghost { display:flex!important;flex-direction:column!important;gap:2px!important;color:var(--example-ink)!important;font-family:var(--example-sans)!important;font-size:12px!important;font-weight:500!important;line-height:1.25!important;text-decoration:none!important;opacity:.3!important; }
#timeline-example-modal .timeline-example-chapters a.active { opacity:1!important; }
#timeline-example-modal .timeline-example-chapters time,
#timeline-example-modal .timeline-example-chapter-ghost time { color:var(--example-brick)!important;font-size:12px!important;font-style:normal!important;font-weight:500!important; }
#timeline-example-modal .timeline-example-chapters a span,
#timeline-example-modal .timeline-example-chapter-ghost span,
#timeline-example-modal .timeline-example-chapters span { display:block!important;margin:0!important;color:inherit!important;font-size:12px!important;font-weight:500!important; }

#timeline-example-modal .timeline-example-stories { display:flex!important;min-width:0!important;padding:60px 0 160px 60px!important;flex-direction:column!important;gap:256px!important; }
#timeline-example-modal .timeline-example-stories article,
#timeline-example-modal .timeline-example-story { display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:80px!important;align-items:start!important;padding:0!important;border:0!important;scroll-margin-top:80px!important; }
#timeline-example-modal .timeline-example-stories article + article { padding-top:0!important;border-top:0!important; }
#timeline-example-modal .timeline-example-story-intro { position:sticky!important;top:80px!important;display:flex!important;min-width:0!important;flex-direction:column!important; }
#timeline-example-modal .timeline-example-kicker { margin:0!important;color:var(--example-brick)!important;font-family:var(--example-sans)!important;font-size:12px!important;font-weight:600!important;letter-spacing:.48px!important;line-height:1!important;text-transform:uppercase!important; }
#timeline-example-modal .timeline-example-stories h3 { max-width:none!important;margin:16px 0 0!important;color:#111!important;font-family:var(--example-serif)!important;font-size:56px!important;font-weight:400!important;line-height:1!important;letter-spacing:-.015em!important; }
#timeline-example-modal .timeline-example-stories p { max-width:none!important;margin:0!important;color:var(--example-black)!important;font-size:16px!important;line-height:1.65!important; }
#timeline-example-modal .timeline-example-lede { margin-top:16px!important;color:var(--example-black)!important;font-size:16px!important;line-height:1.65!important; }
#timeline-example-modal .timeline-example-stamp { width:130px!important;height:140px!important;margin-top:72px!important;object-fit:contain!important;transform:rotate(-7deg)!important; }
#timeline-example-modal .timeline-example-keepsake-kitchen { width:286px!important;max-width:100%!important;height:auto!important;margin-top:72px!important;object-fit:cover!important;transform:rotate(-5.81deg)!important;filter:drop-shadow(0 14px 18px rgb(34 30 20 / .08)); }
#timeline-example-modal .timeline-example-keepsake-friend { width:154px!important;height:263px!important;margin-top:72px!important;object-fit:cover!important;transform:rotate(-11.29deg)!important;filter:drop-shadow(0 14px 18px rgb(34 30 20 / .08)); }
#timeline-example-modal .timeline-example-story-body { display:flex!important;min-width:0!important;flex-direction:column!important;gap:52px!important; }
#timeline-example-modal .timeline-example-prose { display:flex!important;flex-direction:column!important;gap:26px!important;color:var(--example-black)!important;font-size:16px!important;line-height:1.65!important; }
#timeline-example-modal .timeline-example-prose p { color:inherit!important; }
#timeline-example-modal .timeline-example-prose-quiet { color:var(--example-quiet)!important; }

#timeline-example-modal .timeline-example-oil,
#timeline-example-modal .timeline-example-stories figure { margin:0!important;overflow:hidden!important;border:0!important;border-radius:24px!important;background:transparent!important;box-shadow:none!important; }
#timeline-example-modal .timeline-example-oil img,
#timeline-example-modal .timeline-example-stories figure img { width:100%!important;height:auto!important;display:block!important;aspect-ratio:804/536!important;border-radius:24px!important;object-fit:cover!important; }
#timeline-example-modal .timeline-example-stories figcaption { display:none!important; }
#timeline-example-modal .timeline-example-insight,
#timeline-example-modal .timeline-example-person { position:relative!important;display:flex!important;min-height:255px!important;flex-direction:column!important;justify-content:space-between!important;border-radius:24px!important;padding:36px!important; }
#timeline-example-modal .timeline-example-insight.is-paper { background:#fff!important;box-shadow:0 4px 8px rgb(0 0 0 / .04)!important;color:var(--example-ink)!important;transform:rotate(2deg)!important; }
#timeline-example-modal .timeline-example-insight.is-green,
#timeline-example-modal .timeline-example-person { background:var(--example-forest)!important;color:#fff!important; }
#timeline-example-modal .timeline-example-insight.is-green { min-height:316px!important;padding:40px!important;transform:rotate(-1deg)!important; }
#timeline-example-modal .timeline-example-card-label { margin:0!important;color:var(--example-brick)!important;font-size:12px!important;font-weight:600!important;letter-spacing:.48px!important;line-height:1!important;text-transform:uppercase!important; }
#timeline-example-modal .timeline-example-insight.is-green .timeline-example-card-label,
#timeline-example-modal .timeline-example-person .timeline-example-card-label { color:var(--example-peach)!important; }
#timeline-example-modal .timeline-example-insight h4 { margin:16px 0 0!important;color:inherit!important;font-family:var(--example-serif)!important;font-size:52px!important;font-weight:400!important;line-height:1!important; }
#timeline-example-modal .timeline-example-insight > p { margin-top:24px!important;color:var(--example-forest)!important;font-size:16px!important;line-height:1.65!important; }
#timeline-example-modal .timeline-example-insight.is-green > p,
#timeline-example-modal .timeline-example-insight blockquote { color:#fff!important; }
#timeline-example-modal .timeline-example-insight blockquote { margin:24px 0 0!important;font-family:var(--example-serif)!important;font-size:24px!important;font-style:italic!important;line-height:1.2!important; }
#timeline-example-modal .timeline-example-person { min-height:222px!important;gap:32px!important;padding:32px!important;transform:rotate(2deg)!important; }
#timeline-example-modal .timeline-example-person-head { display:flex!important;align-items:center!important;gap:20px!important; }
#timeline-example-modal .timeline-example-person-head img { width:68px!important;height:68px!important;flex:none!important;border:1px solid rgba(255,255,255,.45)!important;border-radius:50%!important;object-fit:contain!important; }
#timeline-example-modal .timeline-example-person-head h4 { margin:0!important;font-family:var(--example-serif)!important;font-size:40px!important;font-weight:400!important;line-height:1!important; }
#timeline-example-modal .timeline-example-person-head p { margin:8px 0 0!important;color:var(--example-peach)!important;font-size:12px!important;font-weight:600!important;letter-spacing:.48px!important;line-height:1!important;text-transform:uppercase!important; }
#timeline-example-modal .timeline-example-person > p { font-family:var(--example-serif)!important;font-size:24px!important;line-height:1.2!important; }

#timeline-example-modal .timeline-example-album,
#timeline-example-modal .timeline-example-thoughts { padding-top:60px!important;padding-bottom:120px!important; }
#timeline-example-modal .timeline-example-album-grid { display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:32px!important; }
#timeline-example-modal .timeline-example-album-grid figure { margin:0!important;overflow:hidden!important;border:0!important;border-radius:24px!important;background:#fff!important;box-shadow:0 4px 8px rgb(0 0 0 / .04)!important; }
#timeline-example-modal .timeline-example-album-grid img { width:100%!important;aspect-ratio:4/3!important;border-radius:18px!important;object-fit:cover!important; }
#timeline-example-modal .timeline-example-album-grid figcaption { padding:16px 16px 20px!important;color:var(--example-ink)!important;font-size:15px!important;font-weight:500!important; }
#timeline-example-modal .timeline-example-thought-grid { display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:24px!important; }
#timeline-example-modal .timeline-example-thought-grid article { display:flex!important;min-height:260px!important;padding:36px!important;flex-direction:column!important;align-items:flex-start!important;border-radius:24px!important;background:var(--example-forest)!important;color:#fff!important; }
#timeline-example-modal .timeline-example-thought-grid article:nth-child(even) { background:#fff!important;color:var(--example-ink)!important;box-shadow:0 4px 8px rgb(0 0 0 / .04)!important; }
#timeline-example-modal .timeline-example-thought-grid p { margin:0!important;color:var(--example-peach)!important;font-size:12px!important;font-weight:600!important;letter-spacing:.48px!important;text-transform:uppercase!important; }
#timeline-example-modal .timeline-example-thought-grid article:nth-child(even) p { color:var(--example-brick)!important; }
#timeline-example-modal .timeline-example-thought-grid h3 { margin:14px 0 0!important;color:inherit!important;font-family:var(--example-serif)!important;font-size:52px!important;font-weight:400!important;line-height:1!important; }
#timeline-example-modal .timeline-example-thought-grid blockquote { margin:auto 0 0!important;font-family:var(--example-serif)!important;font-size:24px!important;font-style:italic!important;line-height:1.2!important; }
#timeline-example-modal .timeline-example-footer { display:grid!important;grid-template-columns:1fr auto 1fr!important;align-items:center!important;gap:32px!important;padding:21px 80px!important;border-top:1px solid var(--example-faint)!important;color:rgba(2,44,34,.55)!important;background:var(--example-cream)!important;font-family:var(--example-sans)!important;font-size:12px!important;font-weight:500!important;text-align:left!important; }
#timeline-example-modal .timeline-example-footer img { width:107px!important;max-height:28px!important;margin:0!important;display:block!important; }
#timeline-example-modal .timeline-example-footer nav { display:flex!important;gap:32px!important; }
#timeline-example-modal .timeline-example-footer a { color:rgba(2,44,34,.55)!important;font-size:12px!important;font-weight:500!important;text-decoration:none!important; }
#timeline-example-modal .timeline-example-footer p,
#timeline-example-modal .timeline-example-footer span { margin:0!important;text-align:right!important; }

@media (max-width:1180px) {
  #timeline-example-modal .timeline-example-dialog { top:12px!important;bottom:12px!important;left:50%!important;width:min(2000px,calc(100vw - 24px))!important;max-width:2000px!important;height:calc(100vh - 24px)!important;border-radius:24px!important;transform:translateX(-50%)!important; }
  #timeline-example-modal .timeline-example-hero { height:336px!important;min-height:336px!important;padding:48px 36px!important; }
  #timeline-example-modal .timeline-example-hero h2,
  #timeline-example-modal .timeline-example-hero-copy h2 { font-size:56px!important;line-height:56px!important; }
  #timeline-example-modal .timeline-example-tabs { padding:0 28px!important; }
  #timeline-example-modal .timeline-example-panel { padding:0 28px!important; }
  #timeline-example-modal .timeline-example-timeline { grid-template-columns:240px minmax(0,1fr)!important; }
  #timeline-example-modal .timeline-example-chapters { padding:48px 28px 80px 0!important; }
  #timeline-example-modal .timeline-example-stories { padding:48px 0 120px 36px!important;gap:140px!important; }
  #timeline-example-modal .timeline-example-stories article,
  #timeline-example-modal .timeline-example-story { gap:40px!important; }
  #timeline-example-modal .timeline-example-stories h3 { font-size:44px!important; }
  #timeline-example-modal .timeline-example-footer { padding:21px 36px!important; }
}
@media (max-width:820px) {
  #timeline-example-modal .timeline-example-dialog { top:8px!important;bottom:8px!important;height:calc(100vh - 16px)!important;border-radius:18px!important; }
  #timeline-example-modal .timeline-example-close { top:14px!important;right:14px!important; }
  #timeline-example-modal .timeline-example-hero { height:auto!important;min-height:260px!important;max-height:none!important;padding:48px 22px 36px!important; }
  #timeline-example-modal .timeline-example-hero h2,
  #timeline-example-modal .timeline-example-hero-copy h2 { font-size:40px!important;line-height:1!important; }
  #timeline-example-modal .timeline-example-tabs { height:auto!important;min-height:49px!important;padding:0 20px!important;gap:22px!important;overflow-x:auto!important; }
  #timeline-example-modal .timeline-example-panel { padding:0 20px!important; }
  #timeline-example-modal .timeline-example-timeline { display:block!important; }
  #timeline-example-modal .timeline-example-chapters { position:static!important;min-height:0!important;margin:0 0 36px!important;padding:28px 0 0!important;border-right:0!important; }
  #timeline-example-modal .timeline-example-stories { padding:0 0 80px!important;gap:80px!important; }
  #timeline-example-modal .timeline-example-stories article,
  #timeline-example-modal .timeline-example-story { display:flex!important;flex-direction:column!important;gap:28px!important; }
  #timeline-example-modal .timeline-example-story-intro { position:static!important; }
  #timeline-example-modal .timeline-example-album-grid,
  #timeline-example-modal .timeline-example-thought-grid { grid-template-columns:1fr!important; }
  #timeline-example-modal .timeline-example-footer { grid-template-columns:1fr!important;justify-items:start!important;gap:16px!important;padding:21px 20px!important; }
  #timeline-example-modal .timeline-example-footer p,
  #timeline-example-modal .timeline-example-footer span { text-align:left!important; }
}

#timeline-example-modal .timeline-example-keepsake {
  width: 244px !important;
  max-width: 80% !important;
  height: auto !important;
  margin-top: 72px !important;
  object-fit: contain !important;
  transform: rotate(-6deg) !important;
  filter: none !important;
}
#timeline-example-modal .timeline-example-photo-row {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
#timeline-example-modal .timeline-example-photo-row img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 275 / 206 !important;
  border-radius: 16px !important;
  object-fit: cover !important;
}
#timeline-example-modal .timeline-example-person-head:not(:has(img)) {
  align-items: flex-start !important;
}

#timeline-example-modal .timeline-example-person,
#timeline-example-modal .timeline-example-person p,
#timeline-example-modal .timeline-example-person > p {
  color: #fff !important;
}
#timeline-example-modal .timeline-example-person-head p {
  color: var(--example-peach) !important;
}
#timeline-example-modal .timeline-example-insight.is-green,
#timeline-example-modal .timeline-example-insight.is-green p,
#timeline-example-modal .timeline-example-insight.is-green h4,
#timeline-example-modal .timeline-example-insight.is-green blockquote {
  color: #fff !important;
}
#timeline-example-modal .timeline-example-insight.is-green .timeline-example-card-label {
  color: var(--example-peach) !important;
}
#timeline-example-modal .timeline-example-insight.is-paper > p {
  color: var(--example-forest) !important;
}
#timeline-example-modal .timeline-example-stamp,
#timeline-example-modal .timeline-example-keepsake,
#timeline-example-modal .timeline-example-keepsake-friend,
#timeline-example-modal .timeline-example-keepsake-kitchen {
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
}
#timeline-example-modal .timeline-example-chapters {
  --chapter-progress: 0%;
}
#timeline-example-modal .timeline-example-chapters::before {
  content: "" !important;
  position: absolute !important;
  top: 60px !important;
  bottom: 120px !important;
  left: 0 !important;
  width: 1px !important;
  background: rgba(184,74,33,.12) !important;
}
#timeline-example-modal .timeline-example-chapters::after {
  content: "" !important;
  position: absolute !important;
  top: 60px !important;
  left: 0 !important;
  width: 1px !important;
  height: var(--chapter-progress) !important;
  max-height: calc(100% - 180px) !important;
  background: #b84a21 !important;
  opacity: .55 !important;
  pointer-events: none !important;
}
#timeline-example-modal .timeline-example-chapter.is-open::before { content: none !important; }
#timeline-example-modal .timeline-example-chapter:not(.is-open) .timeline-example-chapter-items {
  display: none !important;
}
#timeline-example-modal .timeline-example-chapter.is-faded .timeline-example-chapter-title { opacity:.3!important; }
#timeline-example-modal .timeline-example-chapter.is-open .timeline-example-chapter-title { opacity:1!important; }

#timeline-example-modal .visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

#timeline-example-modal.is-archive-frame .timeline-example-dialog {
  top: 50% !important;
  right: auto !important;
  bottom: auto !important;
  left: 50% !important;
  width: min(1440px, calc(100vw - 48px)) !important;
  max-width: 1440px !important;
  height: 80vh !important;
  max-height: 80vh !important;
  transform: translate(-50%, -50%) !important;
}

#timeline-example-modal.is-archive-frame .timeline-example-frame {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  background: #f3efe5 !important;
}

@media (max-width: 680px) {
  #timeline-example-modal.is-archive-frame .timeline-example-dialog {
    top: 8px !important;
    right: 8px !important;
    bottom: 8px !important;
    left: 8px !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    transform: none !important;
  }

  #timeline-example-modal.is-archive-frame .timeline-example-close {
    top: 8px !important;
    right: 8px !important;
  }
}

/* ==== landing.css ==== */

/* landing — Figma Desktop 19 (676:5043)
   Full-bleed green hero with in-hero nav · beige scroll nav ·
   inset green places/pricing · full-bleed CTA + beige footer card */

body.landing {
  --held-nav-height: 68px;
  --held-content: 1192px;
  --held-panel: calc(var(--held-content) + 248px);
  --held-inset: 124px;
  --held-gutter: max(24px, calc((100% - var(--held-panel)) / 2));
  --held-content-gutter: calc(var(--held-gutter) + var(--held-inset));
  --held-radius: 32px;
  --held-h2-size: 72px;
  --ink: #022c22;
  --emerald: #064e3b;
  --emerald-950: #022c22;
  --lime: #bef264;
  --lime-600: #65a30d;
  --lime-950: #1a2e05;
  --paper: #f3efe5;
  --white: #fff;
  --black: #0a0a0a;
  --neutral-700: #404040;
  background: #f3efe5 !important;
  padding-top: 0 !important;
  color: #0a0a0a;
}

html:has(body.landing) {
  scroll-padding-top: calc(var(--held-nav-height, 68px) + 12px);
}

body.landing :is(h1, h2, h3, h4, h5, h6, p) {
  text-wrap: pretty;
}

body.landing main {
  background: transparent !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

body.landing main > section {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* One content column: paper sections and panel interiors share --held-content. */
body.landing .how-flow,
body.landing section.household .section-intro,
body.landing section.household .household-grid,
body.landing section.faq.faq-figma#faq .faq-intro,
body.landing section.faq.faq-figma#faq .faq-columns,
body.landing .places-intro,
body.landing .places-body,
body.landing section.pricing.pricing-figma#pricing .pricing-layout,
body.landing section.final-cta.final-cta-figma#start .final-cta-inner {
  box-sizing: border-box;
  width: 100% !important;
  max-width: var(--held-content) !important;
  margin-inline: auto !important;
}

/* ——— Beige scroll nav (hidden at top; appears on scroll-up) ——— */

body.landing .site-nav-paper {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 50 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: var(--held-nav-height) !important;
  margin: 0 !important;
  padding: 16px var(--held-gutter) !important;
  background: #f3efe5 !important;
  transform: none !important;
  transition: top 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

body.landing .site-nav-paper.is-nav-hidden {
  top: calc(-1 * var(--held-nav-height)) !important;
  pointer-events: none !important;
}

body.landing .site-nav-paper .nav-logo img,
body.landing .site-nav-hero .nav-logo img {
  display: block !important;
  height: 32px !important;
  width: auto !important;
}

body.landing .site-nav-paper .nav-links,
body.landing .site-nav-hero .nav-links {
  display: flex !important;
  align-items: center !important;
  gap: 28px !important;
}


body.landing .site-nav-paper .nav-links a,
body.landing .site-nav-paper .nav-links button.nav-link {
  color: #022c22 !important;
  font-family: Inter, sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  opacity: 1 !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  height: auto !important;
  cursor: pointer;
}

body.landing .site-nav-paper .nav-links a.nav-cta,
body.landing .site-nav-paper .nav-links button.nav-cta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 36px !important;
  padding: 12px 24px !important;
  border-radius: 52px !important;
  background: rgba(2, 44, 34, 0.08) !important;
  color: #022c22 !important;
  cursor: pointer;
}

/* ——— Full-bleed shader hero (nav chrome lives on the scroll header) ——— */

body.landing .hero-shell {
  --hero-pad-bottom: 72px;
  position: relative !important;
  z-index: 4 !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 0 var(--hero-pad-bottom) !important;
  border-radius: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

body.landing .hero-shell::before {
  content: none;
  display: none;
}

body.landing .landing-shader {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

body.landing .hero-shell .landing-shader {
  inset: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: #022c22;
}

body.landing .hero-shell .landing-shader::after {
  content: none;
}

body.landing .landing-shader-mesh,
body.landing .landing-shader-mesh canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

body.landing .hero-shell .hero {
  position: relative;
  z-index: 1;
}

body.landing .hero-logo {
  display: flex;
  justify-content: flex-start;
  margin: 0;
  line-height: 0;
}

body.landing .hero-logo img {
  display: block;
  height: 32px;
  width: auto;
}

body.landing .site-nav-hero {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: var(--held-nav-height) !important;
  margin: 0 !important;
  padding: 16px var(--held-gutter) !important;
  background: transparent !important;
}

body.landing .site-nav-hero .nav-links a,
body.landing .site-nav-hero .nav-links button.nav-link {
  color: #fff !important;
  font-family: Inter, sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  opacity: 1 !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  height: auto !important;
  cursor: pointer;
}

body.landing .site-nav-hero .nav-links a.nav-cta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 36px !important;
  padding: 12px 24px !important;
  border-radius: 52px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  color: #fff !important;
  cursor: pointer;
}

body.landing .hero {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 52px var(--held-gutter) 72px !important;
  color: #fff;
}

body.landing .hero-layout {
  display: flex;
  align-items: center;
  gap: 72px;
  width: 100%;
  min-width: 0;
}

body.landing .hero-copy {
  box-sizing: border-box !important;
  flex: 1 1 0 !important;
  min-width: 0 !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 80px !important;
}

body.landing .hero-copy-main {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
  width: 100%;
}

body.landing .hero-copy-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
  padding-top: 0;
  container-type: inline-size;
}

body.landing .hero-portrait {
  position: relative;
  flex: 1 1 0;
  align-self: stretch;
  min-width: 0;
  min-height: 560px;
  border-radius: 24px;
  overflow: hidden;
}

body.landing .hero-portrait img,
body.landing .hero-portrait video {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: 50% 20%;
  border-radius: 24px;
}

body.landing .hero-portrait video {
  display: block;
  object-position: 50% 38%;
  background: #011a11;
}

body.landing .hero-eyebrow,
body.landing section.pricing.pricing-figma#pricing .pricing-intro .eyebrow,
body.landing section.final-cta.final-cta-figma#start .eyebrow {
  margin: 0 !important;
  color: var(--white, #fff) !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 0.75rem !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: 100% !important;
  letter-spacing: 0.015rem !important;
  text-transform: uppercase !important;
  opacity: 1 !important;
}

body.landing .hero-eyebrow {
  text-align: center !important;
}

@supports (color: color(display-p3 1 1 1)) {
  body.landing .hero-eyebrow,
  body.landing section.pricing.pricing-figma#pricing .pricing-intro .eyebrow,
  body.landing section.final-cta.final-cta-figma#start .eyebrow {
    color: color(display-p3 1 1 1) !important;
  }
}

body.landing .hero h1 {
  margin: 0 !important;
  color: #fff !important;
  font-family: var(--font-instrument-serif), Georgia, serif !important;
  font-size: min(68px, 11.5cqi) !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

body.landing .hero-title-break {
  display: none;
}

body.landing .hero-stories {
  position: relative;
  display: inline-block;
  isolation: isolate;
  z-index: 0;
}

body.landing .hero-stories > span {
  position: relative;
  z-index: 1;
}

body.landing .hero-stories > img {
  width: 79.276px;
  height: 177.169px;
  position: absolute;
  z-index: -1;
  left: 50%;
  top: 50%;
  max-width: none;
  transform: translate(-50%, -50%) rotate(-92.85deg);
  pointer-events: none;
}

body.landing .hero-copy-text > p:not(.eyebrow) {
  width: min(533px, 100%) !important;
  margin: 0 !important;
  color: #fff !important;
  text-align: left !important;
  text-wrap: pretty !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 16px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 170% !important;
  opacity: 0.7 !important;
}

@supports (color: color(display-p3 1 1 1)) {
  body.landing .hero-copy-text > p:not(.eyebrow) {
    color: color(display-p3 1 1 1) !important;
  }
}

body.landing .hero-cta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
}

body.landing .hero-assurances {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

body.landing .hero-assurances li {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: #fff;
  font-size: 14px;
  line-height: 1.5;
}

body.landing .hero-assurance-check {
  width: 16px;
  height: 16px;
  flex: none;
  color: rgba(255, 255, 255, 0.7);
}

body.landing .hero-actions {
  display: flex !important;
  gap: 16px !important;
  justify-content: flex-start !important;
}

body.landing .hero-actions .button {
  height: 52px !important;
  min-height: 52px !important;
  padding: 20px 28px !important;
  border-radius: 555px !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  border: 0 !important;
  cursor: pointer;
}

body.landing .button-lime {
  --held-lime-from: #d9f99d;
  --held-lime-to: #bef264;
  color: #0a0a0a !important;
  background: linear-gradient(var(--held-lime-from), var(--held-lime-to)) !important;
  box-shadow: inset 0 2px 2px rgba(255, 255, 255, 0.25) !important;
}

body.landing .button-ghost {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.08) !important;
}

body.landing .hero-launch {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
  width: 100%;
}

body.landing .hero-testimonial {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  margin: 0;
  padding-top: 0;
  width: min(22.5rem, 100%);
  max-width: 22.5rem;
}

body.landing .hero-testimonial-stars {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 3px;
  margin: 0;
}

body.landing .hero-testimonial-stars svg {
  display: block;
  width: 14px;
  height: 14px;
  fill: #f5c518;
}

body.landing .hero-testimonial blockquote {
  margin: 0;
  width: 100%;
  min-width: 0;
}

body.landing .hero-testimonial blockquote p {
  margin: 0;
  color: #fff;
  font-family: var(--font-caveat), cursive;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: 0;
  text-align: left;
  text-wrap: pretty;
  opacity: 0.92;
}

body.landing .hero-testimonial figcaption {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

body.landing .hero-testimonial-byline {
  display: flex;
  align-items: center;
  width: max-content;
  gap: 8px;
  padding: 4px 12px 4px 4px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  white-space: nowrap;
}

body.landing .hero-testimonial-person {
  display: flex;
  align-items: center;
  gap: 8px;
}

body.landing .hero-testimonial figcaption img {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
}

body.landing .hero-testimonial cite {
  font-family: Inter, Arial, sans-serif;
  font-size: 0.8125rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1;
  color: #fff;
  opacity: 0.92;
}

body.landing .hero-stats {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

body.landing .hero-stats li {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  margin: 0;
}

body.landing .hero-stats li > img,
body.landing .hero-stat-imessage {
  width: 24px;
  height: 24px;
  flex: none;
}

body.landing .hero-stat-imessage {
  display: grid;
  place-items: center;
}

body.landing .hero-stat-imessage img {
  width: 20px;
  height: 20px;
}

body.landing .hero-stats p {
  margin: 0;
  color: #fff;
  font-family: Inter, Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
}

body.landing .hero-stat-label {
  color: rgba(255, 255, 255, 0.5);
}

body.landing .hero-founders {
  position: absolute;
  z-index: 2;
  left: 12px;
  right: 12px;
  bottom: 12px;
  display: flex;
  align-items: stretch;
  gap: 12px;
  box-sizing: border-box;
  padding: 12px;
  border-radius: 24px;
  background: #fff;
}

body.landing .hero-portrait .hero-founders-photo {
  position: static;
  inset: auto;
  width: 152px;
  height: auto;
  max-width: none;
  align-self: stretch;
  aspect-ratio: 152 / 156;
  object-fit: cover;
  object-position: center;
  border-radius: 12px;
  flex: none;
}

body.landing .hero-founders-copy {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  justify-content: space-between;
  gap: 24px;
  min-width: 0;
  box-sizing: border-box;
  padding: 12px;
  color: #022c22;
  font-family: Inter, Arial, sans-serif;
}

body.landing .hero-founders-quote,
body.landing .hero-founders-names,
body.landing .hero-founders-role {
  margin: 0;
}

body.landing .hero-founders-quote {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
}

body.landing .hero-founders-names,
body.landing .hero-founders-role {
  font-size: 14px;
  line-height: 1.7;
}

body.landing .hero-founders-role {
  opacity: 0.5;
}

/* LOCKED — Figma 430:2015 hero card strip. Do not resize or restyle these cards. */

body.landing .hero-strip,
body.landing .hero-strip.hero-flow {
  position: relative !important;
  z-index: 1 !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  max-width: none !important;
  height: 585px !important;
  margin: 0 !important;
  margin-left: 0 !important;
  left: auto !important;
  transform: none !important;
  overflow: visible;
}

body.landing .hero-strip-track,
body.landing .hero-strip-track.hero-gallery {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  gap: 32px;
  flex: none;
  height: 489px !important;
  width: max-content;
  min-width: 0;
  padding: 0 48px !important;
  will-change: transform;
}

body.landing .hero-card,
body.landing .hero-strip .hero-memory {
  flex: none;
  height: 489px !important;
  margin: 0;
  border-radius: 24px;
  overflow: hidden;
  transform-origin: center center;
  will-change: transform;
}

body.landing .hero-card-story,
body.landing .hero-strip .hero-story {
  box-sizing: border-box;
  width: 380px !important;
  padding: 48px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 48px;
  background: #fff;
  text-align: center;
  white-space: normal;
}

body.landing .hero-card-art,
body.landing .hero-strip .hero-art {
  position: relative;
  width: 200px;
  height: 200px;
  flex: none;
  overflow: hidden;
}

body.landing .hero-card-art img,
body.landing .hero-strip .hero-art img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}

body.landing .hero-card-art.is-stamp,
body.landing .hero-strip .hero-art-stamp {
  position: relative;
}

body.landing .hero-card-art.is-stamp img,
body.landing .hero-strip .hero-art-stamp img {
  width: 208.828px;
  height: 208.828px;
  position: absolute;
  left: calc(50% + 0.54px);
  top: calc(50% - 1.14px);
  max-width: none;
  object-fit: cover;
  transform: translate(-50%, -50%) rotate(-5.18deg);
}

body.landing .hero-story-tin .hero-card-art,
body.landing .hero-story-tin .hero-art {
  width: 199px;
  height: 200px;
}

body.landing .hero-story-tin .hero-card-art img,
body.landing .hero-story-tin .hero-art img {
  width: 109.89%;
  height: 109.29%;
  position: absolute;
  left: -5.49%;
  top: -4.92%;
  object-fit: fill;
}

body.landing .hero-story-map .hero-card-art,
body.landing .hero-story-map .hero-art,
body.landing .hero-story-map .hero-art-map {
  width: 216.867px;
  height: 200px;
}

body.landing .hero-story-map .hero-card-art img,
body.landing .hero-story-map .hero-art img,
body.landing .hero-story-map .hero-art-map img {
  width: 111.11%;
  height: 120.48%;
  position: absolute;
  left: -5.56%;
  top: -10.24%;
  max-width: none;
  transform: none;
  object-fit: fill;
}

body.landing .hero-story-chair .hero-card-art img,
body.landing .hero-story-chair .hero-art img {
  width: 100.02%;
  height: 110.17%;
  position: absolute;
  left: -0.08%;
  top: -5.09%;
  object-fit: fill;
}

body.landing .hero-card-copy {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  text-align: center;
  white-space: normal;
}

body.landing .hero-card-copy > div {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

body.landing .hero-card-copy .eyebrow {
  margin: 0;
  color: #65a30d;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

body.landing .hero-card-copy h2 {
  margin: 0;
  color: #022c22;
  font-family: var(--font-instrument-serif), Georgia, serif;
  font-size: 40px;
  font-weight: 400;
  line-height: 1.1;
}

body.landing .hero-card-copy p:last-child,
body.landing .hero-strip .hero-story > p:last-child {
  margin: 0;
  color: #064e3b;
  font-size: 14px;
  line-height: 1.65;
}

body.landing .hero-strip .hero-story-map .hero-card-copy > p:last-child {
  width: 284px;
  max-width: 100%;
}

body.landing .hero-strip .hero-story-journey,
body.landing .hero-strip .hero-story-tin,
body.landing .hero-strip .hero-story-chair {
  width: 380px !important;
}

body.landing .hero-strip .hero-story-map {
  width: 454px !important;
}

body.landing .hero-card-photo,
body.landing .hero-strip .hero-photo-album,
body.landing .hero-strip .hero-photo-kitchen {
  width: 733px !important;
}

body.landing .hero-card-photo.is-narrow,
body.landing .hero-strip .hero-photo-family {
  width: 612px !important;
}

body.landing .hero-card-photo.is-portrait,
body.landing .hero-strip .hero-photo-portrait {
  width: 326px !important;
}

body.landing .hero-card-photo img,
body.landing .hero-strip .hero-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}

body.landing .hero-card-quote,
body.landing .hero-strip .hero-quote {
  box-sizing: border-box;
  padding: 48px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  background: #065f46;
  color: #fff;
  white-space: normal;
}

body.landing .hero-strip .hero-quote .eyebrow {
  margin: 0;
  color: #bef264;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  position: relative;
  z-index: 1;
}

body.landing .hero-strip .hero-quote blockquote {
  margin: 0;
  position: relative;
  z-index: 1;
  color: #fff;
  font-family: var(--font-instrument-serif), Georgia, serif;
  font-style: italic;
  font-weight: 400;
}

body.landing .hero-strip .hero-quote-courage {
  width: 520px !important;
}

body.landing .hero-strip .hero-quote-courage .hero-quote-copy {
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: relative;
  z-index: 1;
}

body.landing .hero-strip .hero-quote-courage blockquote {
  font-size: 56px;
  line-height: 1;
}

body.landing .hero-strip .hero-quote-courage .hero-quote-copy > p {
  width: 409px;
  max-width: 100%;
  margin: 0;
  color: rgba(255, 255, 255, 0.7);
  font-size: 16px;
  line-height: 1.65;
}

body.landing .hero-strip .hero-quote-mark {
  width: 272.536px;
  height: 224.116px;
  position: absolute;
  left: 254px;
  top: -14px;
  max-width: none;
  pointer-events: none;
}

body.landing .hero-strip .hero-quote-love {
  width: 739px !important;
}

body.landing .hero-strip .hero-quote-love blockquote {
  font-size: 48px;
  line-height: 1.1;
}

body.landing .hero-strip .hero-love-mark {
  width: 332px;
  height: 280px;
  position: absolute;
  left: 407px;
  top: -50px;
  max-width: none;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  body.landing .hero-strip-track,
  body.landing .hero-strip-track.hero-gallery {
    justify-content: center;
  }
}

/* ——— How it works ——— */

body.landing .how {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  overflow: visible !important;
  padding: 124px var(--held-content-gutter) !important;
  background: transparent !important;
  background-image: none !important;
}

body.landing .how::before,
body.landing .how::after {
  content: none !important;
  display: none !important;
}

body.landing .how-intro {
  display: none !important;
}

body.landing .how-flow {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 152px !important;
  align-items: start !important;
  width: min(var(--held-content), 100%) !important;
}

body.landing .how-steps {
  display: flex !important;
  flex-direction: column !important;
  gap: 72px !important;
  min-width: 0 !important;
}

body.landing .how-card {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 0 !important;
  width: 100% !important;
  height: 510px !important;
  min-height: 510px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

body.landing .how-copy {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 52px !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
}

body.landing .how-copy .step {
  color: #65a30d !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

body.landing .how-text h3 {
  width: auto !important;
  max-width: 498px !important;
  margin: 0 0 12px !important;
  color: #0a0a0a !important;
  font-family: var(--font-instrument-serif), Georgia, serif !important;
  font-size: 56px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  text-wrap: pretty;
}

body.landing .how-card:first-child .how-text h3 {
  max-width: 407px !important;
}

body.landing .how-card[data-how-step="3"] .how-text h3 {
  max-width: 446px !important;
}

body.landing .how-text p {
  margin: 0 !important;
  color: #404040 !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
}

body.landing .how-mark img {
  display: none;
}

body.landing .how-mark {
  isolation: isolate;
}

body.landing .how-mark-01::after,
body.landing .how-mark-03::after {
  z-index: -1 !important;
}

body.landing .checks {
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  list-style: none !important;
  color: #022c22 !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
}

body.landing .checks li {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

body.landing .checks img {
  width: 20px !important;
  height: 20px !important;
  flex: none;
}

body.landing .formats > span {
  display: block;
  margin-bottom: 12px;
  color: #1a2e05;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.48px;
  text-transform: uppercase;
  opacity: 0.7;
}

body.landing .formats > div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

body.landing .formats b {
  padding: 8px 12px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 52px;
  color: #1a2e05;
  background: rgba(63, 98, 18, 0.08);
  font-size: 14px;
  font-weight: 400;
  line-height: 1;
}

body.landing .formats b img {
  width: 20px;
  height: 20px;
}

body.landing .how-sticky {
  position: sticky !important;
  top: max(24px, calc(50vh - 300px)) !important;
  align-self: start !important;
  width: 100% !important;
  min-width: 0 !important;
  z-index: 2;
}

@media (min-width: 901px) {
  body.landing .how-sticky {
    grid-column: 1;
    order: -1;
  }

  body.landing .how-steps {
    grid-column: 2;
  }
}

body.landing .how-card-demo {
  display: none;
}

body.landing .how-sticky-panel {
  position: relative;
  width: 100%;
  height: 600px;
  overflow: visible;
  border-radius: 0;
  background: transparent;
}

body.landing .how-sticky-chat,
body.landing .how-sticky-memories {
  position: absolute;
  inset: 0;
  overflow: visible;
}

body.landing .how-sticky-chat {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  overflow: hidden;
  opacity: 1;
  mask-image: linear-gradient(to bottom, transparent, #000 40px, #000 100%);
  transition: opacity 0.35s ease;
}

body.landing .how[data-how-view="memories"] .how-sticky-chat {
  opacity: 0;
  pointer-events: none;
}

body.landing .how-sticky-chat .story-chat {
  position: relative !important;
  inset: auto !important;
  width: min(420px, 100%) !important;
  height: auto !important;
  padding: 0 !important;
  gap: 4px !important;
  justify-content: flex-start !important;
  overflow: visible !important;
  transform: none !important;
  container-type: inline-size;
}

body.landing .how-sticky-chat .story-chat-row {
  display: none;
  width: 100%;
  height: auto;
  margin: 0;
  text-align: left;
  overflow: visible;
  pointer-events: none;
}

body.landing .how-sticky-chat .story-chat-row.is-me {
  text-align: right;
}

body.landing .how-sticky-chat .story-chat-row.is-shifting {
  transition: transform 0.48s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform;
}

body.landing .how-sticky-chat .story-chat-row.is-on,
body.landing .how-sticky-chat .story-chat-row.is-leaving {
  display: flex !important;
  flex-direction: column;
  align-items: flex-start;
  overflow: visible;
  pointer-events: auto;
}

body.landing .how-sticky-chat .story-chat-row.is-me.is-on,
body.landing .how-sticky-chat .story-chat-row.is-me.is-leaving {
  align-items: flex-end;
}

body.landing .how-sticky-chat .story-chat-row.is-leaving {
  pointer-events: none;
}

body.landing .how-sticky-chat .story-chat-row.has-reaction.is-on,
body.landing .how-sticky-chat .story-chat-row.has-reaction.is-leaving {
  padding-top: 16px;
}

body.landing .how-sticky-chat .story-chat-name {
  display: none;
  margin: 0 0 4px;
  padding-left: 47.5px;
  color: #909093;
  font-family: -apple-system, "SF Pro Text", Inter, sans-serif;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: 0;
}

body.landing .how-sticky-chat .story-chat-row.is-on .story-chat-name,
body.landing .how-sticky-chat .story-chat-row.is-leaving .story-chat-name {
  display: block;
}

body.landing .how-sticky-chat .story-chat-row.is-on .story-chat-name {
  animation: how-chat-name-in 0.32s ease var(--pop-delay, 0ms) both;
}

body.landing .how-sticky-chat .story-chat-row.is-leaving .story-chat-name {
  animation: how-chat-name-out 0.22s ease both;
}

body.landing .how-sticky-chat .story-chat-line {
  display: flex;
  align-items: flex-end;
  gap: 5.5px;
  max-width: 100%;
}

body.landing .how-sticky-chat .story-chat-row.is-me .story-chat-line {
  justify-content: flex-end;
  align-self: flex-end;
  margin-left: auto;
  width: max-content;
  max-width: 100%;
}

body.landing .how-sticky-chat .story-chat-avatar {
  display: block;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  border-radius: 50%;
  object-fit: cover;
  opacity: 0;
  visibility: hidden;
  transform: scale(0.4);
  transform-origin: center center;
  animation: none;
  transition:
    opacity 0.22s ease,
    transform 0.22s ease,
    visibility 0s linear 0.22s;
}

body.landing .how-sticky-chat .story-chat-row.is-them .story-chat-avatar {
  transform-origin: bottom left;
}

body.landing .how-sticky-chat .story-chat-row.is-me .story-chat-avatar {
  transform-origin: bottom right;
}

body.landing .how-sticky-chat .story-chat-row.is-on.is-tail:not(.is-leaving):not(.is-avatar-leaving) .story-chat-avatar {
  visibility: visible;
  animation: how-chat-avatar-pop 0.4s cubic-bezier(0.34, 1.35, 0.64, 1) calc(0.1s + var(--pop-delay, 0ms)) both;
}

body.landing .how-sticky-chat .story-chat-row.is-avatar-leaving .story-chat-avatar,
body.landing .how-sticky-chat .story-chat-row.is-leaving.is-tail .story-chat-avatar {
  visibility: visible;
  animation: how-chat-avatar-out 0.22s ease var(--leave-delay, 0ms) both;
}

body.landing .how-sticky-chat .story-chat-bubble-wrap {
  position: relative;
  flex: 0 1 auto;
  width: fit-content;
  max-width: min(300px, calc(100cqi - 35.5px));
}

body.landing .how-sticky-chat .story-chat-bubble-wrap.is-figma-174 {
  max-width: 198px;
}

body.landing .how-sticky-chat .story-chat-bubble-wrap.is-figma-174 .story-chat-bubble {
  max-width: 198px !important;
}

body.landing .how-sticky-chat .story-chat-bubble-wrap.is-figma-186 {
  max-width: 210px;
}

body.landing .how-sticky-chat .story-chat-bubble-wrap.is-figma-186 .story-chat-bubble {
  max-width: 210px !important;
}

body.landing .how-sticky-chat .story-chat-reaction {
  position: absolute;
  left: -12px;
  top: -22px;
  z-index: 2;
  width: 36px;
  height: 43px;
  pointer-events: none;
  transform-origin: 70% 85%;
}

body.landing .how-sticky-chat .story-chat-reaction-halo,
body.landing .how-sticky-chat .story-chat-reaction-large,
body.landing .how-sticky-chat .story-chat-reaction-medium,
body.landing .how-sticky-chat .story-chat-reaction-small,
body.landing .how-sticky-chat .story-chat-reaction-heart {
  position: absolute;
  display: block;
  box-sizing: border-box;
}

body.landing .how-sticky-chat .story-chat-reaction-halo {
  left: 2px;
  top: 0;
  width: 34px;
  height: 34px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #f3efe5;
}

body.landing .how-sticky-chat .story-chat-reaction-large {
  left: 3px;
  top: 1px;
  width: 32px;
  height: 32px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #fff;
}

body.landing .how-sticky-chat .story-chat-reaction-medium {
  left: 3.72px;
  top: 27.03px;
  width: 10.03px;
  height: 10.47px;
  border-radius: 50%;
  background: #fff;
}

body.landing .how-sticky-chat .story-chat-reaction-small {
  left: 0;
  top: 38.15px;
  width: 4.72px;
  height: 4.72px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #fff;
}

body.landing .how-sticky-chat .story-chat-reaction-heart {
  left: 10px;
  top: 9.5px;
  width: 18px;
  height: 18px;
  aspect-ratio: 1;
  object-fit: contain;
}

body.landing .how-sticky-chat .story-chat-row.is-on .story-chat-reaction {
  animation: how-chat-reaction-pop 0.42s cubic-bezier(0.34, 1.4, 0.64, 1) calc(0.48s + var(--pop-delay, 0ms)) both;
}

body.landing .how-sticky-chat .story-chat-row.is-leaving .story-chat-reaction {
  animation: how-chat-reaction-unpop 0.2s ease both;
}

body.landing .how-sticky-chat .story-chat-typing {
  display: none !important;
}

body.landing .how-sticky-chat .story-chat-row.is-them.is-on + .story-chat-row.is-me.is-on,
body.landing .how-sticky-chat .story-chat-row.is-me.is-on + .story-chat-row.is-them.is-on,
body.landing .how-sticky-chat .story-chat-row.is-them.is-on + .story-chat-row.is-me.is-leaving,
body.landing .how-sticky-chat .story-chat-row.is-me.is-on + .story-chat-row.is-them.is-leaving {
  margin-top: 8px;
}

body.landing .how-sticky-chat .story-chat-bubble {
  display: inline-block !important;
  flex: none !important;
  align-self: auto !important;
  width: fit-content !important;
  min-width: 0 !important;
  max-width: 100% !important;
  text-align: left !important;
  padding: 7px 12px !important;
  border-radius: 16px !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.15px !important;
  white-space: normal !important;
  overflow: visible !important;
  overflow-wrap: break-word;
  word-break: normal;
  text-wrap: pretty;
  opacity: 0;
  visibility: visible;
  transform: translateY(12px) scale(0.55);
  transform-origin: bottom left;
  animation: none;
}

body.landing .how-sticky-chat .story-chat-row.is-me .story-chat-bubble {
  transform-origin: bottom right;
}

body.landing .how-sticky-chat .story-chat-row.is-on .story-chat-bubble {
  animation: how-chat-pop 0.47s cubic-bezier(0.34, 1.3, 0.64, 1) var(--pop-delay, 0ms) both;
}

body.landing .how-sticky-chat .story-chat-row.is-leaving .story-chat-bubble {
  animation: how-chat-unpop 0.32s cubic-bezier(0.4, 0, 0.6, 1) both;
  animation-delay: var(--leave-delay, 0ms);
}

@keyframes how-chat-pop {
  0% {
    opacity: 0;
    transform: translateY(12px) scale(0.55);
  }
  58% {
    opacity: 1;
    transform: translateY(-1px) scale(1.04);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}

@keyframes how-chat-unpop {
  0% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0;
    transform: translateY(12px) scale(0.55);
  }
}

@keyframes how-chat-name-in {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes how-chat-name-out {
  0% { opacity: 1; }
  100% { opacity: 0; }
}

@keyframes how-chat-reaction-pop {
  0% {
    opacity: 0;
    transform: scale(0.2);
  }
  62% {
    opacity: 1;
    transform: scale(1.16);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes how-chat-reaction-unpop {
  0% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(0.2);
  }
}

@keyframes how-chat-avatar-pop {
  0% {
    opacity: 0;
    transform: scale(0.35);
  }
  62% {
    opacity: 1;
    transform: scale(1.12);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes how-chat-avatar-out {
  0% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(0.35);
  }
}

body.landing .how-sticky-chat .story-chat-row.is-me .story-chat-bubble {
  background: #0078ff !important;
  color: #fff !important;
}

body.landing .how-sticky-chat .story-chat-row.is-them .story-chat-bubble {
  background: #ffffff !important;
  color: #000 !important;
}

body.landing .how-sticky-chat .story-chat-row.is-them .story-chat-bubble::before {
  background: #ffffff !important;
}

body.landing .how-sticky-chat .story-chat-row.is-on:not(.is-tail) .story-chat-bubble {
  border-bottom-left-radius: 6px !important;
}

body.landing .how-sticky-chat .story-chat-row.is-me.is-on:not(.is-tail) .story-chat-bubble {
  border-bottom-right-radius: 6px !important;
}

body.landing .how-sticky-chat .story-chat-row.is-stacked .story-chat-bubble {
  border-top-left-radius: 6px !important;
}

body.landing .how-sticky-chat .story-chat-row.is-me.is-stacked .story-chat-bubble {
  border-top-right-radius: 6px !important;
}

body.landing .how-sticky-chat .story-chat-row.is-on:not(.is-tail) .story-chat-bubble::before,
body.landing .how-sticky-chat .story-chat-row.is-on:not(.is-tail) .story-chat-typing::before {
  content: none !important;
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
}

body.landing .how-sticky-memories {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.35s ease;
}

body.landing .how[data-how-view="memories"] .how-sticky-memories {
  opacity: 1;
  pointer-events: auto;
}

body.landing .how-memory-card {
  position: absolute;
  left: 50%;
  top: 50%;
  box-sizing: border-box;
  width: min(400px, 100%);
  padding: 36px 32px 32px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.04);
  text-align: center;
  opacity: 0;
  transform: translate(calc(-50% + var(--ox, 0px)), calc(-50% + var(--oy, 16px))) rotate(var(--rot, 0deg)) scale(0.86);
  pointer-events: none;
  transition: opacity 0.4s ease, transform 0.5s cubic-bezier(0.34, 1.2, 0.64, 1);
}

body.landing .how-memory-card.is-on {
  opacity: 1;
  transform: translate(calc(-50% + var(--ox, 0px)), calc(-50% + var(--oy, 0px))) rotate(var(--rot, 0deg)) scale(1);
}

body.landing .how-memory-card:nth-child(1) { --ox: 0px; --oy: 4px; z-index: 1; }
body.landing .how-memory-card:nth-child(2) { --ox: 3px; --oy: 2px; z-index: 2; }
body.landing .how-memory-card:nth-child(3) { --ox: -2px; --oy: 0px; z-index: 3; }
body.landing .how-memory-card:nth-child(4) { --ox: 2px; --oy: -2px; z-index: 4; }

body.landing .how-memory-art {
  position: relative;
  width: 214px;
  height: 182px;
  overflow: hidden;
}

body.landing .how-memory-art img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

body.landing .how-memory-copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

body.landing .how-memory-copy .eyebrow {
  margin: 0;
  color: #65a30d;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

body.landing .how-memory-copy h4 {
  margin: 0;
  color: #022c22;
  font-family: var(--font-instrument-serif), Georgia, serif;
  font-size: 36px;
  font-weight: 400;
  line-height: 1.1;
}

body.landing .how-memory-copy p {
  margin: 0;
  max-width: 320px;
  color: #064e3b;
  font-size: 14px;
  line-height: 1.5;
  overflow: visible;
  overflow-wrap: anywhere;
}

/* ——— Every memory finds its place ——— */

body.landing section.places,
body.landing section.places#features {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 var(--held-gutter) !important;
  background: transparent !important;
}

body.landing .places-panel {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 52px;
  box-sizing: border-box;
  width: 100%;
  max-width: var(--held-panel);
  margin-inline: auto;
  padding: 112px var(--held-inset);
  isolation: isolate;
  overflow: hidden;
  border-radius: 32px;
  background: #022c22;
  /* Hide the 1px clip hairline where rounded overflow meets paper. */
  box-shadow: 0 0 0 1px #f3efe5;
}

body.landing .places-panel::before {
  content: none;
  display: none;
}

body.landing .places-intro,
body.landing .places-body,
body.landing .places-copy {
  position: relative;
  z-index: 1;
}

body.landing .places-intro {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
  max-width: var(--held-content);
  margin-inline: auto;
  text-align: left;
}

body.landing .places-intro h2,
body.landing .places-copy h2 {
  position: relative;
  width: min(768px, 100%) !important;
  margin: 0 !important;
  color: #fff !important;
  font-family: var(--font-instrument-serif), Georgia, serif !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  text-align: left !important;
}

body.landing .places-title-accent {
  position: relative;
  display: inline-block;
  isolation: isolate;
}

body.landing .places-title-accent > span {
  position: relative;
  z-index: 1;
}

body.landing .places-title-mark {
  position: absolute;
  z-index: -1;
  left: 50%;
  top: auto;
  bottom: 0.02em;
  width: 223px;
  height: 14px;
  transform: translateX(-50%) rotate(2.45deg);
  pointer-events: none;
}

body.landing .places-intro > p {
  width: min(563px, 100%) !important;
  margin: 0 !important;
  color: #fff !important;
  font-family: Inter, sans-serif !important;
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
  opacity: 0.7 !important;
  text-align: left !important;
}

body.landing .places-body {
  display: flex;
  align-items: stretch;
  gap: 72px;
  width: 100%;
  max-width: var(--held-content);
  min-width: 0;
  margin-inline: auto;
}

body.landing section.places .places-copy,
body.landing .places-copy {
  display: flex !important;
  flex: 1 1 0 !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  align-items: stretch !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  gap: 24px !important;
}

body.landing section.places .place-options,
body.landing .place-options {
  display: flex !important;
  flex: 0 0 auto !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  gap: 24px !important;
}

body.landing section.places .place-option,
body.landing .place-option {
  width: 100% !important;
  min-height: 0 !important;
  padding: 24px 0 0 !important;
  border: 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
  background: none !important;
  text-align: left !important;
  cursor: pointer;
  position: relative;
}

body.landing section.places .place-option:last-child,
body.landing .place-option:last-child {
  padding: 24px 0 0 !important;
  border-bottom: 0 !important;
  margin-bottom: 0 !important;
}

body.landing .place-option.active::before {
  content: none;
}

body.landing .place-progress {
  display: block !important;
  position: absolute;
  left: 0;
  top: -1px;
  width: 142px;
  height: 1px;
  min-height: 0;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.06);
}

body.landing .place-option.active .place-progress {
  width: 142px;
  background: transparent;
}

body.landing .place-progress > span {
  display: block;
  width: 100%;
  height: 100%;
  background: #65a30d;
  transform: scaleX(0);
  transform-origin: left center;
}

body.landing section.places.is-running .place-option.active .place-progress > span {
  animation: place-progress var(--place-duration, 5s) linear forwards;
}

body.landing .place-option-copy {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

body.landing section.places .place-option strong,
body.landing .place-option strong {
  color: #fff !important;
  font-family: Inter, sans-serif !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  line-height: 1.65 !important;
  letter-spacing: -0.2px !important;
  opacity: 0.5 !important;
}

body.landing section.places .place-option.active strong,
body.landing .place-option.active strong {
  color: #fff !important;
  opacity: 1 !important;
}

body.landing .place-option-copy > span {
  width: 100% !important;
  max-height: 0 !important;
  overflow: hidden !important;
  color: #fff !important;
  font-family: Inter, sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
  opacity: 0 !important;
}

body.landing .place-option.active .place-option-copy > span {
  max-height: 120px !important;
  opacity: 0.7 !important;
}

body.landing section.places .places-example,
body.landing .places-example {
  align-self: stretch !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 52px !important;
  min-height: 52px !important;
  padding: 20px 28px !important;
  border: 0 !important;
  border-radius: 555px !important;
  color: #fff !important;
  background: rgba(255, 255, 255, 0.08) !important;
  box-shadow: none !important;
  filter: none !important;
  font-family: Inter, sans-serif !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  cursor: pointer;
}

body.landing section.places .places-example:hover,
body.landing .places-example:hover {
  background: rgba(255, 255, 255, 0.12) !important;
  filter: none !important;
}

body.landing .places-preview {
  position: relative !important;
  flex: 0 0 720px !important;
  width: 720px !important;
  max-width: 100% !important;
  height: 504px !important;
  min-height: 504px !important;
}

body.landing .places-phone,
body.landing .places-phone-screen-fill,
body.landing .places-phone-island {
  display: none;
}

body.landing .places-media {
  position: absolute !important;
  inset: 0 !important;
  overflow: hidden !important;
  border-radius: 22.66px !important;
  background: #f3efe5 !important;
}

body.landing .places-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 1;
}

/* Hide screenshots inside the live phone well. Same iframe preview on
   tablet and mobile. Specificity must beat the earlier place-graphics rules. */
body.landing .places-media .place-panel-art img.place-story-static {
  display: none !important;
}

body.landing .place-panel-frame {
  position: absolute;
  inset: 0;
  container-type: size;
}

/* Smallest desktop story (1366) scaled into the media well. */
body.landing .place-story-frame {
  position: absolute;
  top: 0;
  left: 0;
  width: 1366px;
  height: calc(1366 * 100cqh / 100cqw);
  border: 0;
  pointer-events: none;
  background: #f3efe5;
  transform-origin: top left;
  transform: scale(calc(100cqw / 1366));
}


body.landing .place-panel {
  position: absolute;
  inset: 0;
}

body.landing .place-panel[hidden] {
  display: none !important;
}

body.landing .place-panel.active {
  z-index: 1;
}

body.landing .place-panel-art {
  width: 100%;
  height: 100%;
}

body.landing .place-panel-art img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body.landing .place-timeline-story img {
  width: 100% !important;
  height: 272px !important;
  border-radius: 16px !important;
  object-fit: cover !important;
  opacity: 1 !important;
}

body.landing .place-panel-media figure img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  opacity: 1 !important;
}

/* ——— Pricing / FAQ inherit v4-pricing-faq; keep paper page ——— */

body.landing section.household {
  background: transparent !important;
}

body.landing section.household {
  padding: 152px var(--held-content-gutter) !important;
  gap: 52px !important;
}

body.landing section.household .section-intro {
  gap: 12px !important;
}

body.landing section.household .section-intro .eyebrow {
  color: #65a30d !important;
  font-family: Inter, sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 12px !important;
  letter-spacing: 0.48px !important;
  text-transform: uppercase !important;
  text-align: center !important;
}

body.landing section.household .section-intro h2 {
  color: #022c22 !important;
  font-family: var(--font-instrument-serif), Georgia, serif !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
}

body.landing section.household .section-intro > p:last-of-type {
  width: min(434px, 100%) !important;
  max-width: 434px !important;
  color: #404040 !important;
  font-family: Inter, sans-serif !important;
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 23.1px !important;
  text-align: center !important;
}

body.landing section.household .household-grid {
  display: flex !important;
  align-items: stretch !important;
  justify-content: center !important;
  gap: 24px !important;
  column-gap: 24px !important;
  row-gap: 24px !important;
}

body.landing section.household .role-card {
  flex: 1 0 0 !important;
  min-width: 0 !important;
  min-height: 340px !important;
  padding: 28px !important;
  gap: 28px !important;
  align-items: center !important;
  text-align: center !important;
}

body.landing section.household .role-card > span {
  flex: 0 0 auto !important;
  margin: 0 !important;
  color: #65a30d !important;
  font-family: Inter, sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 12px !important;
  letter-spacing: 0.48px !important;
  text-transform: uppercase !important;
  text-align: center !important;
}

body.landing section.household .role-graphic.role-graphic-oil {
  box-sizing: border-box !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  min-height: 152px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
  background: transparent !important;
}

body.landing section.household .role-oil-canvas {
  background: transparent !important;
  box-shadow: none !important;
}

body.landing section.household .role-oil-canvas,
body.landing section.household .role-oil-canvas img {
  width: 116px !important;
  height: 116px !important;
  max-width: 116px !important;
  max-height: 116px !important;
  filter: none !important;
}

body.landing section.household .role-card-copy {
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
  gap: 8px;
  width: 100%;
  text-align: center;
  position: relative;
  z-index: 1;
}

body.landing section.household .role-card h3 {
  margin: 0 !important;
  color: #022c22 !important;
  font-family: var(--font-instrument-serif), Georgia, serif !important;
  font-size: 36px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
}

body.landing section.household .role-card h3 .role-title-br {
  display: none;
}

body.landing section.household .role-card p {
  margin: 0 !important;
  color: #4a4a45 !important;
  font-family: Inter, sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  text-align: center !important;
}

body.landing section.faq.faq-figma#faq {
  padding: 152px var(--held-content-gutter) !important;
  overflow: visible !important;
}

body.landing section.faq.faq-figma#faq .faq-title-accent {
  position: relative;
  display: inline-block;
  isolation: isolate;
}

body.landing section.faq.faq-figma#faq .faq-title-mark {
  position: absolute !important;
  left: 50% !important;
  top: calc(100% + 2px) !important;
  bottom: auto !important;
  z-index: -1 !important;
  width: 14px !important;
  height: 3.14em !important;
  transform: translate(-50%, -50%) rotate(90deg) scaleY(-1) !important;
  transform-origin: center center !important;
  pointer-events: none !important;
}

body.landing section.pricing.pricing-figma#pricing .pricing-title-accent {
  isolation: isolate;
}

body.landing section.pricing.pricing-figma#pricing .pricing-title-accent > span {
  position: relative;
  z-index: 1;
}

body.landing section.final-cta.final-cta-figma#start .final-cta-mark {
  position: relative;
  isolation: isolate;
}

body.landing section.final-cta.final-cta-figma#start .final-cta-text {
  position: relative;
  z-index: 1;
}

body.landing section.final-cta.final-cta-figma#start .final-cta-underline {
  z-index: -1 !important;
}

body.landing section.pricing.pricing-figma#pricing {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  /* Paper under the rounded panel, then overlap FAQ by 2px of that paper
     so the section join never shows the mesh — without covering green. */
  margin: 0 0 -2px !important;
  padding: 0 var(--held-gutter) 12px !important;
  overflow: visible !important;
  background: #f3efe5 !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
}

body.landing .pricing-panel {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  max-width: var(--held-panel) !important;
  margin-inline: auto;
  padding: 96px var(--held-inset);
  isolation: isolate;
  overflow: hidden;
  border-radius: 32px;
  background: #022c22;
  /* Hide the 1px clip hairline where rounded overflow meets paper. */
  box-shadow: 0 0 0 1px #f3efe5;
}

body.landing .pricing-panel::before {
  content: none;
  display: none;
}

body.landing .places-panel .landing-shader {
  inset: -2px;
}

body.landing .pricing-panel .landing-shader {
  inset: 0;
}

body.landing section.pricing.pricing-figma#pricing .pricing-layout {
  position: relative;
  z-index: 1;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 72px !important;
  width: min(var(--held-content), 100%) !important;
  margin-inline: auto !important;
}

body.landing section.pricing.pricing-figma#pricing .pricing-intro {
  width: min(485px, 100%) !important;
  flex: 0 1 485px !important;
  gap: 12px !important;
}

body.landing section.pricing.pricing-figma#pricing .pricing-intro h2 {
  width: 478px !important;
  color: #fff !important;
}

body.landing section.pricing.pricing-figma#pricing .pricing-intro > p:last-of-type {
  color: #fff !important;
  font-size: 17px !important;
  opacity: 0.7 !important;
}

body.landing section.pricing.pricing-figma#pricing .pricing-card {
  flex: 0 0 442px !important;
  width: 442px !important;
  max-width: 100% !important;
}

body.landing section.pricing.pricing-figma#pricing .pricing-dollars {
  font-size: 100px !important;
  line-height: 1 !important;
  --number-flow-mask-height: 0.12em;
}

body.landing section.pricing.pricing-figma#pricing .pricing-cents {
  font-size: 64.5px !important;
}

/* ——— Full-bleed CTA + beige footer card ——— */

body.landing .page-end {
  --footer-strip-h: calc(489px * 0.85 + 48px);
  position: relative;
  z-index: 3;
  width: 100%;
  background: transparent;
  overflow: visible;
}

body.landing .page-end::before {
  content: none;
  display: none;
}

body.landing .page-end .landing-shader {
  inset: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  background: #022c22;
}

body.landing .page-end .landing-shader::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 520px;
  pointer-events: none;
  filter: none;
  background: linear-gradient(
    180deg,
    var(--held-paper, #f3efe5) 0%,
    var(--held-paper, #f3efe5) 22%,
    rgba(243, 239, 229, 0.88) 44%,
    rgba(243, 239, 229, 0.5) 66%,
    rgba(243, 239, 229, 0.16) 84%,
    rgba(243, 239, 229, 0) 100%
  );
}

body.landing .page-end .hero-strip,
body.landing .page-end .hero-strip.hero-flow,
body.landing .page-end .hero-strip.hero-flow.is-enhanced {
  z-index: 1;
  margin: calc(var(--footer-strip-h) / -2 - 64px) 0 0;
}

body.landing .page-end .hero-strip-track,
body.landing .page-end .hero-strip-track.hero-gallery {
  will-change: transform;
}

body.landing section.final-cta.final-cta-figma#start {
  position: relative !important;
  z-index: 1 !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  background-image: none !important;
}

body.landing section.final-cta.final-cta-figma#start::before,
body.landing section.final-cta.final-cta-figma#start::after {
  content: none !important;
  display: none !important;
}

body.landing section.final-cta.final-cta-figma#start .final-cta-stage {
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
}

body.landing section.final-cta.final-cta-figma#start .final-cta-panel {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 124px var(--held-content-gutter) !important;
  border-radius: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  background-image: none !important;
}

body.landing section.final-cta.final-cta-figma#start .final-cta-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 52px;
  box-sizing: border-box;
  width: 100%;
  max-width: var(--held-content);
}

body.landing section.final-cta.final-cta-figma#start .final-cta-panel::before,
body.landing section.final-cta.final-cta-figma#start .final-cta-panel::after {
  content: none !important;
  display: none !important;
}

body.landing section.final-cta.final-cta-figma#start .final-cta-copy {
  position: relative;
  z-index: 1;
  flex: 1 1 0 !important;
  width: 100% !important;
  max-width: none !important;
  gap: 40px !important;
  padding: 0 !important;
  align-items: center !important;
  text-align: center !important;
}

body.landing section.final-cta.final-cta-figma#start .final-cta-copy-top,
body.landing section.final-cta.final-cta-figma#start .final-cta-copy-body {
  align-items: center !important;
  text-align: center !important;
}

body.landing section.final-cta.final-cta-figma#start .eyebrow {
  text-align: center !important;
  font-weight: 600 !important;
  line-height: 12px !important;
  letter-spacing: 0.48px !important;
}

body.landing section.final-cta.final-cta-figma#start .final-cta-copy-body > p.eyebrow {
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 12px !important;
  letter-spacing: 0.48px !important;
  text-transform: uppercase !important;
}

body.landing section.final-cta.final-cta-figma#start h2 {
  color: #ffffff !important;
  line-height: 1 !important;
  max-width: 920px !important;
  margin-inline: auto !important;
  text-align: center !important;
}

body.landing section.final-cta.final-cta-figma#start .final-cta-copy-body > p {
  color: #fff !important;
  font-family: Inter, sans-serif !important;
  font-size: 17px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;
  letter-spacing: 0 !important;
  opacity: 0.7 !important;
  max-width: 570px !important;
  margin-inline: auto !important;
  text-align: center !important;
}

body.landing section.final-cta.final-cta-figma#start .button.button-primary,
body.landing section.final-cta.final-cta-figma#start a.button.button-primary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  /* Later CTA/footer rules stretch this to 100% below 900px; hug instead. */
  width: auto !important;
  height: auto !important;
  min-height: 56px !important;
  padding: 20px 32px !important;
  border-radius: 555px !important;
  background: #ffffff !important;
  color: #022c22 !important;
  border: 0 !important;
  box-shadow: none !important;
  font-size: 16px !important;
  font-weight: 500 !important;
}

/* ——— Footer card on the green end surface ——— */

body.landing footer.site-footer.site-footer-figma {
  --footer-inner: min(var(--held-content), calc(100% - 2 * var(--held-inset)));
  position: relative;
  z-index: 1;
  background: transparent !important;
  background-image: none !important;
  color: #022c22 !important;
  padding: 0 var(--held-gutter) 0 !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}

body.landing footer.site-footer.site-footer-figma::before,
body.landing footer.site-footer.site-footer-figma::after {
  content: none !important;
  display: none !important;
}

body.landing footer.site-footer.site-footer-figma .footer-card {
  display: flex;
  flex-direction: column;
  gap: 24px;
  box-sizing: border-box;
  width: 100%;
  max-width: var(--held-panel);
  margin-inline: auto;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 32px;
  background: #f3efe5;
  /* Cover the 1px compositor hairline along the rounded edge on the shader. */
  box-shadow: inset 0 0 0 1px #f3efe5, 0 0 0 1px #022c22;
}

body.landing footer.site-footer.site-footer-figma .footer-content {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 52px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: calc(var(--held-content) + 2 * var(--held-inset)) !important;
  height: auto !important;
  margin-inline: auto !important;
  padding: 72px var(--held-inset) 0 !important;
}

body.landing footer.site-footer.site-footer-figma .footer-tagline {
  flex: 1 1 auto;
  margin: 0 !important;
  color: #022c22 !important;
  font-family: var(--font-instrument-serif), Georgia, serif !important;
  font-size: 46px !important;
  line-height: 1.1 !important;
  letter-spacing: 0 !important;
}

body.landing footer.site-footer.site-footer-figma .footer-links {
  display: flex !important;
  justify-content: space-between !important;
  width: 363px !important;
  flex: none !important;
}

body.landing footer.site-footer.site-footer-figma .footer-links nav {
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
}

body.landing footer.site-footer.site-footer-figma .footer-links a {
  color: #022c22 !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

body.landing footer.site-footer.site-footer-figma .footer-wordmark {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  z-index: 0 !important;
  flex: none;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 1440 / 214 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  transform: none !important;
  opacity: 1 !important;
  pointer-events: none !important;
}

body.landing footer.site-footer.site-footer-figma .footer-wordmark img {
  position: absolute !important;
  top: 0 !important;
  right: auto !important;
  bottom: auto !important;
  left: 0 !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  aspect-ratio: 1440 / 436.943;
  object-fit: contain !important;
  object-position: top center !important;
  filter: none !important;
  transform: none !important;
  opacity: 1 !important;
}

body.landing footer.site-footer.site-footer-figma .footer-legal {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: var(--held-panel) !important;
  height: auto !important;
  margin-inline: auto !important;
  padding: 24px 0 !important;
  transform: none !important;
  grid-template-columns: none !important;
  gap: 0 !important;
  color: #fff !important;
  font-size: 14px !important;
}

body.landing footer.site-footer.site-footer-figma .footer-legal > span,
body.landing footer.site-footer.site-footer-figma .footer-legal nav {
  align-self: auto !important;
}

body.landing footer.site-footer.site-footer-figma .footer-legal span,
body.landing footer.site-footer.site-footer-figma .footer-legal a {
  color: #fff !important;
  opacity: 0.5 !important;
}

body.landing footer.site-footer.site-footer-figma .footer-legal nav {
  display: flex !important;
  flex: none !important;
  justify-content: flex-end !important;
  align-items: center !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  gap: 24px !important;
  grid-template-columns: none !important;
}

@media (prefers-reduced-motion: reduce) {
  body.landing .site-nav-paper {
    transition: none !important;
  }
}

@media (max-width: 1400px) {
  body.landing {
    --held-inset: 64px;
  }

  body.landing .places-panel {
    padding: 96px var(--held-inset);
  }

  body.landing .places-body {
    gap: 48px;
  }

  body.landing .places-preview {
    flex: 0 1 600px !important;
    width: min(600px, 100%) !important;
    height: 460px !important;
    min-height: 460px !important;
  }
}

@media (min-width: 900px) and (max-width: 1100px) {
  body.landing section.pricing.pricing-figma#pricing .pricing-benefits {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 8px 32px !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-benefits li {
    flex: 0 1 auto !important;
    width: auto !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 1100px) {
  body.landing section.pricing.pricing-figma#pricing .pricing-intro {
    flex: none !important;
    width: 100% !important;
    max-width: 520px !important;
    margin-inline: auto !important;
    align-items: center !important;
    text-align: center !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-intro-title,
  body.landing section.pricing.pricing-figma#pricing .pricing-intro h2 {
    width: 520px !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    text-align: center !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-intro > p:last-of-type {
    width: 504px !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    text-align: center !important;
  }
}

@media (max-width: 1200px) {
  body.landing {
    --held-inset: 48px;
  }

  body.landing .places-panel {
    padding: 80px var(--held-inset);
  }

  body.landing .pricing-panel {
    padding: 80px var(--held-inset);
  }

  body.landing .places-body {
    gap: 40px;
  }

  body.landing .places-preview {
    flex: 0 1 520px !important;
    width: min(520px, 100%) !important;
    height: 420px !important;
    min-height: 420px !important;
  }

  body.landing section.household .household-grid {
    gap: 16px !important;
    column-gap: 16px !important;
    row-gap: 16px !important;
  }

  body.landing section.household .role-card h3 {
    white-space: normal !important;
  }

  body.landing section.household .role-card h3 .role-title-br {
    display: block;
  }

  body.landing section.final-cta.final-cta-figma#start .final-cta-panel {
    padding: 124px var(--held-content-gutter) !important;
  }

  body.landing section.final-cta.final-cta-figma#start .final-cta-inner {
    gap: 40px;
  }

  body.landing footer.site-footer.site-footer-figma .footer-content {
    padding: 56px var(--held-inset) 0 !important;
  }
}

/* Roles — below ~1440px the single-line card titles no longer fit the
   shrinking cards; let them wrap on the designed break instead of clipping. */
@media (max-width: 1440px) {
  body.landing section.household .role-card h3 {
    white-space: normal !important;
  }

  body.landing section.household .role-card h3 .role-title-br {
    display: block;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.landing .how-sticky-chat .story-chat-row,
  body.landing .how-sticky-chat .story-chat-bubble,
  body.landing .how-sticky-chat .story-chat-name,
  body.landing .how-sticky-chat .story-chat-reaction,
  body.landing .how-sticky-chat .story-chat-avatar,
  body.landing .how-memory-card {
    transition: none !important;
    animation: none !important;
  }

  body.landing .how-sticky-chat .story-chat-row.is-on .story-chat-bubble,
  body.landing .how-sticky-chat .story-chat-row.is-on .story-chat-name,
  body.landing .how-sticky-chat .story-chat-row.is-on .story-chat-reaction,
  body.landing .how-sticky-chat .story-chat-row.is-on.is-tail .story-chat-avatar {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }
}

@media (max-width: 1050px) {
  body.landing {
    --held-gutter: 24px;
    --held-inset: 28px;
    --held-nav-height: 68px;
    --held-h2-size: 56px;
  }

  body.landing section.household {
    padding: 152px var(--held-content-gutter) !important;
  }

  /* Keep the three role boxes side by side while they fit (851–1050). */
  body.landing section.household .role-card {
    min-height: 0 !important;
    height: auto !important;
    padding: 28px 20px !important;
  }

  body.landing section.household .section-intro h2 {
    line-height: 1 !important;
  }

  body.landing section.faq.faq-figma#faq {
    padding: 152px var(--held-content-gutter) !important;
  }

  body.landing .how {
    padding: 72px var(--held-content-gutter) 96px !important;
  }

  body.landing .site-nav-paper,
  body.landing .site-nav-hero {
    padding: 16px var(--held-gutter) !important;
  }

  body.landing .site-nav-paper .nav-links a:not(.nav-cta):not(.nav-login),
  body.landing .site-nav-paper .nav-links button.nav-link,
  body.landing .site-nav-hero .nav-links a:not(.nav-cta):not(.nav-login),
  body.landing .site-nav-hero .nav-links button.nav-link {
    display: none !important;
  }

  body.landing .site-nav-paper .nav-links a.nav-login,
  body.landing .site-nav-hero .nav-links a.nav-login {
    display: inline-flex !important;
    align-items: center !important;
  }

  body.landing .hero-shell {
    --hero-pad-bottom: 48px;
    margin: 0 !important;
    padding: 0 0 var(--hero-pad-bottom) !important;
    gap: 0 !important;
    border-radius: 0 !important;
  }

  body.landing .hero {
    gap: 0 !important;
    padding: 48px var(--held-gutter) 56px !important;
    box-sizing: border-box !important;
  }

  body.landing .hero-layout {
    flex-direction: column;
    align-items: stretch;
    gap: 40px;
  }

  body.landing .hero-copy {
    padding: 0 !important;
    width: 100% !important;
    gap: 48px !important;
  }

  body.landing .hero-portrait {
    flex: none;
    min-height: 280px;
    width: 100%;
    aspect-ratio: 4 / 5;
    max-height: 520px;
    position: relative;
  }

  body.landing .hero h1 {
    max-width: 514px;
    font-size: 48px !important;
  }

  body.landing .hero-title-break {
    display: inline;
  }

  body.landing .hero-stories > img {
    width: 56px;
    height: 125px;
  }

  body.landing .hero-copy-text > p:not(.eyebrow) {
    max-width: 534px;
  }

  body.landing section.places,
  body.landing section.places#features {
    padding: 0 var(--held-gutter) !important;
  }

  body.landing section.pricing.pricing-figma#pricing {
    padding: 0 var(--held-gutter) 12px !important;
  }

  body.landing .places-panel,
  body.landing .pricing-panel {
    padding: 56px var(--held-inset);
    border-radius: 24px;
  }

  body.landing section.places.is-places-stack .places-title-mark {
    left: 50% !important;
    top: auto !important;
    bottom: -0.06em !important;
    width: calc(100% + 28px) !important;
    height: auto !important;
    transform: translateX(-50%) !important;
  }

  body.landing section.places.is-places-stack .places-body {
    flex-direction: column;
    gap: 32px;
    height: auto !important;
    min-height: 0 !important;
    flex: none !important;
  }

  body.landing section.places.is-places-stack .places-intro {
    width: 100% !important;
    max-width: 420px;
    margin-inline: auto;
    align-items: center;
    text-align: center;
  }

  body.landing section.places.is-places-stack .places-intro h2,
  body.landing section.places.is-places-stack .places-intro > p {
    width: 100% !important;
    text-align: center !important;
  }

  body.landing section.places.is-places-stack .places-body,
  body.landing section.places.is-places-stack .places-copy,
  body.landing section.places.is-places-stack .place-options {
    flex: none !important;
    height: auto !important;
    min-height: 0 !important;
    width: 100% !important;
  }

  body.landing section.places.is-places-stack .places-preview,
  body.landing section.places.is-places-stack .places-media,
  body.landing section.places.is-places-stack .places-phone,
  body.landing section.places.is-places-stack .places-phone-screen-fill {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
  }

  body.landing section.places.is-places-stack .place-stack-item {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 8px;
    border-radius: 24px;
    background: #fff;
  }

  body.landing section.places.is-places-stack .place-option {
    padding: 20px !important;
    border: 0 !important;
    pointer-events: none;
  }

  body.landing section.places.is-places-stack .place-option strong,
  body.landing section.places.is-places-stack .place-option.active strong {
    color: #0a0a0a !important;
  }

  body.landing section.places.is-places-stack .place-option-copy > span {
    max-height: none !important;
    opacity: 1 !important;
    color: #404040 !important;
  }

  body.landing section.places.is-places-stack .place-progress {
    display: none !important;
  }

  body.landing section.places.is-places-stack .place-panel {
    position: relative !important;
    inset: auto !important;
    height: 280px !important;
    min-height: 280px !important;
    border-radius: 20px !important;
    overflow: hidden !important;
  }

  body.landing section.places.is-places-stack .place-panel-art img.place-story-static {
    object-fit: cover !important;
    object-position: center 18% !important;
  }

  body.landing section.places.is-places-stack .places-example {
    width: 100%;
    justify-content: center;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-layout {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 40px !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-card {
    flex: none !important;
    width: 100% !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-intro {
    flex: none !important;
    width: 100% !important;
    max-width: 520px !important;
    margin-inline: auto !important;
    align-items: center !important;
    text-align: center !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-intro-title,
  body.landing section.pricing.pricing-figma#pricing .pricing-intro h2 {
    width: 520px !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    text-align: center !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-intro > p:last-of-type {
    width: 504px !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    text-align: center !important;
  }

  body.landing section.final-cta.final-cta-figma#start {
    padding: 0 !important;
  }

  body.landing section.final-cta.final-cta-figma#start .final-cta-panel {
    padding: 124px var(--held-content-gutter) !important;
  }

  body.landing section.final-cta.final-cta-figma#start .final-cta-inner {
    flex-direction: column;
    align-items: stretch;
    gap: 36px;
  }

  body.landing section.final-cta.final-cta-figma#start .final-cta-copy {
    max-width: none !important;
    flex: none !important;
    align-items: center !important;
    text-align: center !important;
    gap: 40px !important;
  }

  body.landing section.final-cta.final-cta-figma#start .final-cta-copy-top,
  body.landing section.final-cta.final-cta-figma#start .final-cta-copy-body {
    align-items: center !important;
    text-align: center !important;
  }

  body.landing section.final-cta.final-cta-figma#start .eyebrow {
    text-align: center !important;
  }

  body.landing section.final-cta.final-cta-figma#start h2 {
    width: 100% !important;
    max-width: none !important;
    line-height: 1 !important;
    text-align: center !important;
  }

  body.landing section.final-cta.final-cta-figma#start .final-cta-copy-body > p {
    width: 100% !important;
    max-width: 533px !important;
    margin-inline: auto !important;
    color: #fff !important;
    font-family: Inter, sans-serif !important;
    font-size: 17px !important;
    font-style: normal !important;
    font-weight: 400 !important;
    line-height: 1.65 !important;
    letter-spacing: 0 !important;
    opacity: 0.7 !important;
    text-align: center !important;
  }

  /* Figma 768: “There are stories only” / “they can tell.” */
  body.landing section.final-cta.final-cta-figma#start .final-cta-br-desk {
    display: none !important;
  }

  body.landing section.final-cta.final-cta-figma#start .final-cta-br-mob {
    display: block !important;
  }

  body.landing section.final-cta.final-cta-figma#start .final-cta-only-desk {
    display: none !important;
  }

  body.landing section.final-cta.final-cta-figma#start .final-cta-only-mob {
    display: inline !important;
  }

  body.landing footer.site-footer.site-footer-figma {
    padding: 0 var(--held-gutter) !important;
  }

  body.landing footer.site-footer.site-footer-figma .footer-content {
    flex-direction: row !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 52px !important;
    width: 100% !important;
    padding: 40px var(--held-inset) 0 !important;
  }

  body.landing footer.site-footer.site-footer-figma .footer-tagline {
    flex: 0 1 310px !important;
    width: 310px !important;
    max-width: 310px !important;
    font-size: 36px !important;
    line-height: 1.1 !important;
  }

  body.landing footer.site-footer.site-footer-figma .footer-links {
    display: flex !important;
    width: 230px !important;
    max-width: 230px !important;
    flex: 0 0 230px !important;
    justify-content: flex-start !important;
    gap: 72px !important;
  }

  body.landing footer.site-footer.site-footer-figma .footer-links nav {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    gap: 20px !important;
  }

  body.landing footer.site-footer.site-footer-figma .footer-links a {
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
  }

  body.landing footer.site-footer.site-footer-figma .footer-legal {
    padding: 24px 0 !important;
  }

  body.landing footer.site-footer.site-footer-figma .footer-legal nav {
    width: auto !important;
    max-width: none !important;
    justify-content: flex-end !important;
    gap: 24px !important;
  }
}

/* Was 681–1050 only; the phone preview now reaches mobile too (Figma
   715:10965) — the ≤680 block below overrides layout where mobile differs. */
@media (max-width: 1050px) {
  body.landing .how {
    padding: 72px var(--held-content-gutter) 96px !important;
  }

  body.landing .how-flow {
    gap: 72px !important;
  }

  body.landing .how-steps {
    gap: 72px !important;
  }

  body.landing .how-card {
    height: auto !important;
    min-height: 510px !important;
    padding: 28px 0 !important;
    justify-content: flex-start !important;
  }

  body.landing .how-copy {
    gap: 24px !important;
  }

  body.landing .how-text h3,
  body.landing .how-card:first-child .how-text h3,
  body.landing .how-card[data-how-step="3"] .how-text h3 {
    max-width: none !important;
    font-size: 48px !important;
  }

  body.landing .how-sticky {
    top: max(24px, calc(50vh - 210px)) !important;
  }

  body.landing .how-sticky-panel {
    height: 420px;
  }

  body.landing section.places,
  body.landing section.places#features {
    padding: 0 var(--held-gutter) !important;
  }

  body.landing .places-panel {
    padding: 52px var(--held-inset);
    gap: 52px;
  }

  body.landing .places-intro {
    align-items: center;
    text-align: center;
  }

  body.landing .places-intro h2,
  body.landing .places-copy h2,
  body.landing .places-intro > p {
    width: 100% !important;
    text-align: center !important;
  }

  body.landing .places-title-mark {
    left: 50% !important;
    bottom: 0.02em !important;
    width: 143px !important;
    height: 9px !important;
    transform: translateX(-50%) rotate(2.45deg) !important;
  }

  body.landing .places-body {
    gap: 40px;
    align-items: stretch;
  }

  body.landing section.places .places-copy,
  body.landing .places-copy {
    justify-content: space-between !important;
    align-self: stretch !important;
  }

  body.landing .places-preview {
    container-type: inline-size;
    container-name: places-phone;
    flex: 0 0 35vw !important;
    width: 35vw !important;
    max-width: 280px;
    min-width: 0;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 280 / 580;
    isolation: isolate;
    background: transparent;
    overflow: hidden;
    overflow: clip;
    /* Hide square layers (Safari fade, screen fill) that poke past the
       iPhone silhouette. The mask is the full device, including buttons. */
    -webkit-mask-image: url("/marketing/landing-v8/places-phone/device-mask.png");
    mask-image: url("/marketing/landing-v8/places-phone/device-mask.png");
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
  }

  body.landing .places-phone {
    display: block;
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none;
  }

  /* Screen well only — the island is the Figma capsule overlay, not a hole.
     Figma: screen 259.02×562.57 at (10.67, 8.63) in the 280×579.85 device. */
  body.landing .places-phone-screen-fill {
    display: block;
    position: absolute;
    inset: 1.49% 3.68% 1.49% 3.81%;
    z-index: 0;
    background: #f3efe5;
    border-radius: 14.4cqi;
    pointer-events: none;
    -webkit-mask-image: url("/marketing/landing-v8/places-phone/screen-mask.svg");
    mask-image: url("/marketing/landing-v8/places-phone/screen-mask.svg");
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
  }

  body.landing .places-phone-bezel {
    display: block;
    position: absolute;
    inset: 0;
    z-index: 4;
    width: 100%;
    height: 100%;
    object-fit: fill;
    pointer-events: none;
  }

  /* Figma: "9:41" box 37.3×14.4 at (25.2, 19.6) in the 280×579.85 device. */
  body.landing .places-phone-time {
    position: absolute;
    top: 3.37%;
    left: 9%;
    z-index: 5;
    color: #111;
    font-family: "SF Pro Display", "SF Pro Text", Inter, -apple-system, sans-serif;
    font-size: 4.1cqi;
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.25;
  }

  body.landing .places-phone-time,
  body.landing .places-phone-status,
  body.landing .places-phone-safari {
    display: block;
    position: absolute;
    pointer-events: none;
  }

  body.landing .places-phone-status {
    top: 1.49%;
    left: 3.81%;
    z-index: 5;
    width: 92.5%;
    height: 6.38%;
    object-fit: fill;
  }

  body.landing .places-phone-safari {
    left: 3.81%;
    bottom: 1.49%;
    z-index: 5;
    width: 92.5%;
    height: 9.83%;
    object-fit: fill;
    overflow: hidden;
    border-radius: 0 0 14.4cqi 14.4cqi;
  }

  body.landing .places-media .place-panel-art img.place-story-static {
    display: none !important;
  }

  body.landing .place-story-frame {
    display: block !important;
    width: 390px;
    height: calc(390 * 100cqh / 100cqw);
    transform: scale(calc(100cqw / 390));
  }

  /* The bezel PNG has the screen punched out (green-screen cutout), so the
     opaque frame covers the story layer everywhere except the hole. The
     radius only softens the corners visible through the hole — Figma mask
     corner ≈ 144/925 of the screen width → 14.4cqi at 92.5cqi media width. */
  body.landing .places-media {
    z-index: 1;
    inset: 1.49% 3.68% 1.49% 3.81% !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    overflow: clip !important;
    isolation: isolate;
    contain: paint;
    background: #f3efe5 !important;
    border-radius: 14.4cqi !important;
    -webkit-mask-image: url("/marketing/landing-v8/places-phone/screen-mask.svg");
    mask-image: url("/marketing/landing-v8/places-phone/screen-mask.svg");
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
  }

  body.landing .places-media .place-panel,
  body.landing .places-media .place-panel-frame {
    overflow: hidden !important;
    overflow: clip !important;
    border-radius: inherit;
  }

  body.landing .places-media .place-story-frame {
    overflow: hidden !important;
    border: 0;
    background: #f3efe5;
  }

  body.landing section.household {
    padding: 100px var(--held-content-gutter) !important;
  }

  body.landing section.household .section-intro h2 {
    line-height: 1 !important;
  }

  body.landing section.faq.faq-figma#faq {
    padding: 100px var(--held-content-gutter) !important;
  }
}


@media (max-width: 680px) {
  body.landing {
    --held-gutter: 12px;
    --held-inset: 20px;
    --held-nav-height: 60px;
    --held-h2-size: 42px;
  }

  body.landing .how-flow {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 48px !important;
    width: 100% !important;
  }

  body.landing .how-steps {
    display: flex !important;
    flex-direction: column !important;
    order: 0;
    position: relative;
    z-index: 1;
    gap: 64px !important;
    margin-top: 0;
    padding-inline: var(--held-content-gutter);
    padding-bottom: 0;
  }

  body.landing .how-sticky {
    display: none !important;
  }

  body.landing .how-card-demo {
    display: block;
    width: 100%;
    min-width: 0;
  }

  body.landing .how-card-demo .how-sticky-chat {
    position: relative;
    inset: auto;
    display: block;
    height: auto;
    padding: 0;
    overflow: visible;
    opacity: 1;
    pointer-events: none;
    -webkit-mask-image: none;
    mask-image: none;
  }

  body.landing .how-card-demo .how-sticky-chat::before {
    content: none;
    display: none;
  }

  body.landing .how-card-demo .story-chat {
    width: 100% !important;
    gap: 10px !important;
  }

  body.landing .how-card-demo .story-chat-row.has-reaction.is-on,
  body.landing .how-card-demo .story-chat-row.has-reaction.is-leaving {
    padding-top: 16px;
  }

  body.landing .how-card-demo .story-chat-avatar {
    margin-bottom: -7px;
  }

  body.landing .how-card-demo .story-chat-row.is-them.is-on + .story-chat-row.is-me.is-on,
  body.landing .how-card-demo .story-chat-row.is-me.is-on + .story-chat-row.is-them.is-on,
  body.landing .how-card-demo .story-chat-row.is-them.is-on + .story-chat-row.is-me.is-leaving,
  body.landing .how-card-demo .story-chat-row.is-me.is-on + .story-chat-row.is-them.is-leaving {
    margin-top: 8px;
  }

  body.landing .how-card-demo .how-sticky-memories {
    position: relative;
    inset: auto;
    z-index: 1;
    width: 100%;
    height: 360px;
    opacity: 1;
    pointer-events: none;
    transform: none;
  }

  body.landing .how-card {
    box-sizing: border-box !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 8px 0 8px !important;
    justify-content: flex-start !important;
    gap: 28px !important;
  }

  /* Figma 719:1498 — 72px section pad, 16px card stack, 152px graphics. */
  body.landing section.household {
    padding: 72px var(--held-content-gutter) !important;
    gap: 52px !important;
  }

  /* Figma mobile: headings wrap naturally, no forced breaks. */
  body.landing section.household .section-intro h2 {
    line-height: 1.2 !important;
  }

  body.landing section.household .section-intro h2 br,
  body.landing section.household .role-card h3 .role-title-br {
    display: none !important;
  }

  body.landing section.household .household-grid {
    flex-direction: column !important;
    gap: 16px !important;
    row-gap: 16px !important;
  }

  body.landing section.household .role-card h3,
  body.landing section.household .role-card p,
  body.landing section.household .role-card-copy {
    text-align: center !important;
  }

  /* In a column grid the base flex: 1 0 0 collapses cards to a third of the
     container; size them by content instead. */
  body.landing section.household .role-card {
    flex: none !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 24px !important;
    gap: 24px !important;
  }

  body.landing section.household .role-graphic.role-graphic-oil {
    flex: none !important;
    width: 152px !important;
    height: 152px !important;
    min-height: 152px !important;
  }

  body.landing section.household .role-oil-canvas,
  body.landing section.household .role-oil-canvas img {
    width: 152px !important;
    height: 152px !important;
    max-width: 152px !important;
    max-height: 152px !important;
  }

  body.landing section.household .role-card h3 {
    font-size: clamp(28px, 8.4vw, 36px) !important;
    text-align: center !important;
  }

  body.landing section.household .role-card p {
    text-align: center !important;
  }

  body.landing section.faq.faq-figma#faq {
    padding: 72px var(--held-content-gutter) !important;
  }

  body.landing .how {
    padding: 48px 0 80px !important;
  }

  body.landing .how-text h3,
  body.landing .how-card:first-child .how-text h3,
  body.landing .how-card[data-how-step="3"] .how-text h3 {
    font-size: clamp(32px, 8.6vw, 40px) !important;
  }

  body.landing .how-copy .step {
    font-size: 16px !important;
  }

  body.landing .formats > div {
    gap: 6px;
  }

  body.landing .formats b {
    padding: 7px 10px;
    font-size: 13px;
  }

  body.landing .how-card-demo .how-memory-card {
    width: min(320px, calc(100vw - 40px));
    height: auto;
    min-height: 280px;
    max-width: none;
    padding: 24px 20px 20px;
    gap: 16px;
    border-radius: 20px;
    box-shadow: 0 4px 8px rgb(0 0 0 / 0.04);
    transform: translate(calc(-50% + var(--ox, 0px)), calc(-50% + var(--oy, 16px))) rotate(var(--rot, 0deg)) scale(0.86);
  }

  body.landing .how-card-demo .how-memory-card.is-on {
    transform: translate(calc(-50% + var(--ox, 0px)), calc(-50% + var(--oy, 0px))) rotate(var(--rot, 0deg)) scale(1);
  }

  body.landing .how-card-demo .how-memory-art {
    width: 148px;
    height: 148px;
    flex: none;
    max-height: 148px;
  }

  body.landing .how-card-demo .how-memory-copy {
    flex: 0 0 auto;
    gap: 8px;
  }

  body.landing .how-card-demo .how-memory-copy h4 {
    font-size: 28px;
  }

  body.landing .site-nav-paper,
  body.landing .site-nav-hero {
    padding: 16px var(--held-gutter) !important;
  }

  body.landing .hero-shell {
    --hero-pad-bottom: 40px;
    margin: 0 !important;
    padding: 0 0 var(--hero-pad-bottom) !important;
    gap: 0 !important;
    border-radius: 0 !important;
  }

  body.landing .hero {
    padding: 40px var(--held-gutter) 48px !important;
  }

  body.landing .hero-copy {
    padding: 0 !important;
    width: 100% !important;
    gap: 40px !important;
  }

  body.landing .hero-portrait {
    aspect-ratio: 5 / 4;
    min-height: 0;
    max-height: 80cqw;
    width: 100%;
  }

  /* Figma mobile: 40px headline wrapping naturally over three lines. */
  body.landing .hero h1 {
    font-size: 40px !important;
    line-height: 1.2 !important;
  }

  /* Figma 715:11797 — oval is 57×126 around a 105px “stories”.
     Scale to the live word width so it stays tight at 40px type. */
  body.landing .hero-stories > img {
    width: calc(57 / 105 * 100%);
    height: auto;
    aspect-ratio: 57 / 126;
    transform: translate(-50%, -50%) rotate(-92.85deg);
  }

  body.landing .hero-title-break {
    display: none;
  }

  body.landing .hero-cta {
    align-items: stretch;
  }

  body.landing .hero-assurances {
    align-items: center;
  }

  body.landing .hero-actions {
    width: 100% !important;
    flex-direction: column !important;
    align-items: stretch !important;
  }

  body.landing .hero-actions .button {
    width: 100% !important;
  }

  /* Center the hero and put the portrait between the buttons and the quote. */
  body.landing .hero-layout {
    align-items: center;
    gap: 32px;
    container-type: inline-size;
    width: 100%;
  }

  body.landing .hero-copy {
    display: contents !important;
  }

  body.landing .hero-logo {
    order: 1;
    align-self: center;
  }

  body.landing .hero-copy-main,
  body.landing .hero-copy-text {
    align-items: center !important;
    text-align: center !important;
  }

  body.landing .hero-copy-main {
    order: 2;
    width: 100%;
  }

  body.landing .hero-copy-text > p:not(.eyebrow) {
    width: 100% !important;
    margin-inline: auto;
    text-align: center !important;
  }

  body.landing .hero-portrait {
    order: 3;
    flex: none !important;
    display: block !important;
    position: relative;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: 80cqw !important;
    aspect-ratio: 5 / 4;
    align-self: stretch !important;
    overflow: hidden;
  }

  body.landing .hero-portrait img:not(.hero-founders-photo),
  body.landing .hero-portrait video {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover;
  }

  body.landing .hero-stats {
    order: 4;
  }

  body.landing .hero-stats p {
    font-size: 16px;
  }

  body.landing .hero-founders {
    left: 8px;
    right: 8px;
    bottom: 8px;
    gap: 8px;
    padding: 8px;
    border-radius: 16px;
  }

  body.landing .hero-portrait .hero-founders-photo {
    position: static;
    inset: auto;
    width: 88px;
    height: auto;
    border-radius: 8px;
  }

  body.landing .hero-founders-copy {
    gap: 8px;
    padding: 4px 4px 4px 0;
  }

  body.landing .hero-founders-quote {
    font-size: 16px;
    line-height: 1.35;
  }

  body.landing .hero-founders-names,
  body.landing .hero-founders-role {
    font-size: 12px;
    line-height: 1.4;
  }

  /* Keep Figma 430:2015 card sizes — do not shrink the strip on mobile. */
  body.landing .hero-strip,
  body.landing .hero-strip.hero-flow {
    height: 585px !important;
    width: 100% !important;
  }

  body.landing .hero-strip-track,
  body.landing .hero-strip-track.hero-gallery {
    height: 489px !important;
    gap: 32px !important;
    padding: 0 48px !important;
  }

  body.landing .hero-card,
  body.landing .hero-strip .hero-memory {
    height: 489px !important;
  }

  body.landing .hero-card-story,
  body.landing .hero-strip .hero-story,
  body.landing .hero-strip .hero-story-journey,
  body.landing .hero-strip .hero-story-tin,
  body.landing .hero-strip .hero-story-chair {
    width: 380px !important;
    padding: 48px !important;
    gap: 48px !important;
  }

  body.landing .hero-card-art,
  body.landing .hero-strip .hero-art,
  body.landing .hero-story-map .hero-art,
  body.landing .hero-story-map .hero-art-map {
    width: 200px !important;
    height: 200px !important;
  }

  body.landing .hero-story-map .hero-card-art,
  body.landing .hero-story-map .hero-art,
  body.landing .hero-story-map .hero-art-map {
    width: 216.867px !important;
    height: 200px !important;
  }

  body.landing .hero-card-art.is-stamp img,
  body.landing .hero-strip .hero-art-stamp img {
    width: 208.828px !important;
    height: 208.828px !important;
  }

  body.landing .hero-card-copy {
    gap: 12px !important;
  }

  body.landing .hero-card-copy h2 {
    font-size: 40px !important;
  }

  body.landing .hero-card-copy p:last-child,
  body.landing .hero-strip .hero-story > p:last-child {
    font-size: 14px !important;
  }

  body.landing .hero-strip .hero-story-map {
    width: 454px !important;
  }

  body.landing .hero-strip .hero-photo-album,
  body.landing .hero-strip .hero-photo-kitchen {
    width: 733px !important;
  }

  body.landing .hero-strip .hero-photo-family {
    width: 612px !important;
  }

  body.landing .hero-strip .hero-photo-portrait {
    width: 326px !important;
  }

  body.landing .hero-strip .hero-quote {
    padding: 48px !important;
  }

  body.landing .hero-strip .hero-quote-courage {
    width: 520px !important;
  }

  body.landing .hero-strip .hero-quote-courage blockquote {
    font-size: 56px !important;
  }

  body.landing .hero-strip .hero-quote-courage .hero-quote-copy > p {
    width: 409px !important;
    font-size: 16px !important;
  }

  body.landing .hero-strip .hero-quote-love {
    width: 739px !important;
  }

  body.landing .hero-strip .hero-quote-love blockquote {
    font-size: 48px !important;
  }

  /* Figma mobile (719:1895): 8px side margins, 32px panel padding. */
  body.landing section.places,
  body.landing section.places#features {
    padding: 0 var(--held-gutter) !important;
  }

  body.landing section.pricing.pricing-figma#pricing {
    padding: 0 var(--held-gutter) 12px !important;
  }

  body.landing .places-panel {
    padding: 32px var(--held-inset);
    border-radius: 24px;
  }

  body.landing .pricing-panel {
    padding: 40px var(--held-inset);
    border-radius: 20px;
  }

  body.landing .places-intro h2,
  body.landing .places-copy h2 {
    line-height: 1.2 !important;
  }

  /* Figma mobile (719:1895): phone mock on top, tab list under it. */
  body.landing .places-body {
    flex-direction: column !important;
    align-items: center !important;
    gap: 32px;
  }

  body.landing .places-preview {
    flex: none !important;
    align-self: stretch !important;
    width: 100% !important;
    max-width: none !important;
    margin-inline: 0;
  }

  body.landing section.places .places-copy,
  body.landing .places-copy {
    /* Base flex: 1 1 0 collapses to zero height in the column layout. */
    flex: none !important;
    width: 100% !important;
    max-width: none !important;
    align-self: stretch !important;
    gap: 28px !important;
  }

  body.landing .button.places-example {
    width: 100% !important;
    justify-content: center !important;
  }

  body.landing .how-text h3 {
    font-size: 36px !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-intro h2 {
    width: 520px !important;
    max-width: 100% !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-dollars {
    font-size: 72px !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-cents {
    font-size: 46px !important;
  }

  body.landing section.final-cta.final-cta-figma#start .final-cta-panel {
    padding: 124px var(--held-content-gutter) !important;
  }

  /* Figma mobile: “There are stories only” / “they can tell.” on two lines. */
  body.landing section.final-cta.final-cta-figma#start h2 {
    line-height: 1.2 !important;
  }

  /* Lime marks — Figma 715:10965: behind type, mobile sizes. */
  body.landing .how-mark-01::after {
    display: none !important;
  }

  body.landing .how-mark-02::before {
    width: 83px !important;
    height: 38px !important;
  }

  body.landing .how-mark-03::after {
    left: 50% !important;
    right: auto !important;
    width: calc(61.73 / 57 * 100%) !important;
    height: 13px !important;
    bottom: -2px !important;
    transform: translateX(-50%) !important;
    transform-origin: center bottom !important;
    z-index: -1 !important;
  }

  body.landing .places-title-mark {
    width: 150px !important;
    height: 9px !important;
    bottom: -2px !important;
    transform: translateX(-50%) !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-title-accent {
    isolation: isolate;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-title-mark {
    z-index: -1 !important;
    width: 198px !important;
    height: 47px !important;
    aspect-ratio: auto !important;
  }

  body.landing section.faq.faq-figma#faq .faq-title-mark {
    display: none !important;
  }

  body.landing section.final-cta.final-cta-figma#start .final-cta-mark {
    isolation: isolate;
    position: relative;
  }

  body.landing section.final-cta.final-cta-figma#start .final-cta-underline {
    z-index: -1 !important;
    height: 11px !important;
    bottom: -1px !important;
  }

  body.landing footer.site-footer.site-footer-figma {
    padding: 0 var(--held-gutter) !important;
  }

  body.landing footer.site-footer.site-footer-figma .footer-card {
    border-radius: 20px;
  }

  body.landing footer.site-footer.site-footer-figma .footer-content {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 32px !important;
    padding: 40px var(--held-inset) 0 !important;
  }

  /* Figma mobile footer (719:1711): links only in the card, centered legal
     rows below — Privacy/Terms first, copyright last. */
  body.landing footer.site-footer.site-footer-figma .footer-tagline {
    display: none !important;
  }

  body.landing footer.site-footer.site-footer-figma .footer-links {
    width: 100% !important;
  }

  body.landing footer.site-footer.site-footer-figma .footer-links nav {
    flex: 1 1 0 !important;
  }

  body.landing footer.site-footer.site-footer-figma .footer-links a {
    white-space: nowrap;
  }

  body.landing footer.site-footer.site-footer-figma .footer-legal {
    flex-direction: column !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 24px 0 28px !important;
  }

  body.landing footer.site-footer.site-footer-figma .footer-legal nav {
    order: 1;
    display: flex !important;
    width: auto !important;
    max-width: none !important;
    justify-content: center !important;
    gap: 12px !important;
  }

  body.landing footer.site-footer.site-footer-figma .footer-legal nav a + a::before {
    content: "·";
    margin-right: 12px;
    opacity: 0.7;
  }

  body.landing footer.site-footer.site-footer-figma .footer-legal > span {
    order: 2;
    text-align: center;
  }
}

/* Pricing — side-by-side only when the 72px heading still fits in 3 lines
   (~1200px). Narrower columns wrap to 4 lines, so stack the card under the copy. */
@media (max-width: 1199px) {
  body.landing section.pricing.pricing-figma#pricing .pricing-layout {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 40px !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-card {
    flex: none !important;
    width: 100% !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-intro {
    flex: none !important;
    width: 100% !important;
    max-width: 520px !important;
    margin-inline: auto !important;
    align-items: center !important;
    text-align: center !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-intro .eyebrow {
    text-align: center !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-intro-title,
  body.landing section.pricing.pricing-figma#pricing .pricing-intro h2 {
    width: 520px !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    text-align: center !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-intro > p:last-of-type {
    width: 504px !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    text-align: center !important;
  }
}

/* Roles — Figma tablet (715:10428): when three boxes no longer fit side by
   side, switch to horizontal cards — 116px icon left, left-aligned copy. */
@media (min-width: 681px) and (max-width: 850px) {
  body.landing section.household .household-grid {
    flex-direction: column !important;
    gap: 16px !important;
    column-gap: 16px !important;
    row-gap: 16px !important;
  }

  body.landing section.household .role-card {
    flex: none !important;
    display: grid !important;
    grid-template-areas:
      "icon eyebrow"
      "icon copy";
    grid-template-columns: 116px minmax(0, 1fr) !important;
    grid-template-rows: auto auto;
    align-items: center !important;
    align-content: center;
    /* Override the vertical 28px card gap so eyebrow→title matches Figma (8px). */
    gap: 8px 52px !important;
    column-gap: 52px !important;
    row-gap: 8px !important;
    min-height: 220px !important;
    height: auto !important;
    padding: 44px 52px !important;
    text-align: left !important;
  }

  body.landing section.household .role-card > span {
    grid-area: eyebrow;
    align-self: end;
    text-align: left !important;
  }

  body.landing section.household .role-graphic.role-graphic-oil {
    grid-area: icon;
    flex: none !important;
    width: 116px !important;
    height: 116px !important;
    min-height: 0 !important;
  }

  body.landing section.household .role-card-copy {
    grid-area: copy;
    align-self: start;
    text-align: left !important;
  }

  body.landing section.household .role-card h3,
  body.landing section.household .role-card p {
    text-align: left !important;
    white-space: normal !important;
  }

  body.landing section.household .role-card h3 .role-title-br {
    display: none !important;
  }
}

/* One size for every section H2 at a given breakpoint. */
body.landing .how-intro h2,
body.landing .places-intro h2,
body.landing .places-copy h2,
body.landing section.household .section-intro h2,
body.landing section.pricing.pricing-figma#pricing .pricing-intro h2,
body.landing section.faq.faq-figma#faq .faq-intro h2,
body.landing section.faq .faq-intro h2,
body.landing section.final-cta.final-cta-figma#start h2 {
  font-size: var(--held-h2-size) !important;
}

/* ==== landing-how-orbit.css ==== */

.how-media.how-media-orbit {
  display: block;
  position: relative;
  align-self: start;
  box-sizing: border-box;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: 578 / 510;
  overflow: hidden;
  isolation: isolate;
  contain: paint;
  clip-path: inset(0);
  background: var(--paper);
}

.how-media.how-media-orbit::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  border-radius: 0.8125rem;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    rgba(244, 239, 228, 0.3) 0%,
    rgba(244, 239, 228, 0.3) 15%,
    rgba(244, 239, 228, 0.3) 85%,
    rgba(244, 239, 228, 0.3) 100%
  );
  background: linear-gradient(
    90deg,
    color(display-p3 0.9529 0.9373 0.898 / 0.3) 0%,
    color(display-p3 0.9529 0.9373 0.898 / 0) 15%,
    color(display-p3 0.9529 0.9373 0.898 / 0) 85%,
    color(display-p3 0.9529 0.9373 0.898 / 0.3) 100%
  );
}

.how-orbit {
  position: absolute;
  inset: 0;
  overflow: hidden;
  contain: paint;
  clip-path: inset(0);
  container-type: size;
}

/* Same crop as the old GIF: 800×560, object-fit: cover, center. */
.how-orbit-stage {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 800px;
  height: 560px;
  overflow: hidden;
  transform: translate(-50%, -50%) scale(calc(100cqh / 560));
}

.how-orbit-fan {
  position: absolute;
  left: 50%;
  top: 88%;
  width: 0;
  height: 0;
  transform: translateY(-20px) scale(0.58);
}

.how-orbit-card {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 1;
  box-sizing: border-box;
  width: 550px;
  height: 710px;
  margin-left: -275px;
  padding: 69.693px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  border-radius: 40px;
  background: #fff;
  box-shadow: -20px 0 200px rgba(0, 0, 0, 0.1);
  transform-origin: 50% 1600px;
  transform: rotate(var(--r));
  animation: how-orbit-rock 5.3s cubic-bezier(0.8, 0, 0.2, 1) var(--delay, 0s) infinite;
}

.how-orbit[data-how-orbit="scroll"] .how-orbit-card,
.how-orbit.is-static .how-orbit-card {
  animation: none;
}

/* Left-to-right stack: each card sits on top of the one to its left. */
.how-orbit-card:nth-child(1) { z-index: 6; }
.how-orbit-card:nth-child(2) { z-index: 5; }
.how-orbit-card:nth-child(3) { z-index: 4; }
.how-orbit-card:nth-child(4) { z-index: 3; }
.how-orbit-card:nth-child(5) { z-index: 2; }
.how-orbit-card:nth-child(6) { z-index: 1; }
.how-orbit-card:nth-child(7) { z-index: 7; }

.how-orbit-art {
  flex: none;
  width: calc(var(--art-w, 354) * 1px);
  height: calc(var(--art-h, 290) * 1px);
  display: grid;
  place-items: center;
}

.how-orbit-art img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
}

.how-orbit-copy {
  width: 410.613px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 17.423px;
  text-align: center;
}

.how-orbit-head {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 11.616px;
}

.how-orbit-copy .eyebrow {
  margin: 0;
  width: 100%;
  color: #65a30d;
  font-family: var(--sans);
  font-size: 17.423px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0;
  text-transform: uppercase;
}

.how-orbit-copy h2 {
  margin: 0;
  width: 450px;
  max-width: none;
  color: #022c22;
  font-family: var(--serif);
  font-size: 58.078px;
  font-weight: 400;
  line-height: 1.1;
}

.how-orbit-copy > p {
  margin: 0;
  width: calc(var(--body-w, 380) * 1px);
  color: #064e3b;
  font-family: var(--sans);
  font-size: 20.327px;
  font-weight: 400;
  line-height: 1.65;
}

@keyframes how-orbit-rock {
  0% { transform: rotate(calc(var(--r) - 7.5deg)); }
  33%, 60.4% { transform: rotate(calc(var(--r) + 7.5deg)); }
  93.4%, 100% { transform: rotate(calc(var(--r) - 7.5deg)); }
}

@media (prefers-reduced-motion: reduce) {
  .how-orbit-card {
    animation: none;
    transform: rotate(var(--r));
  }
}

body.landing .how-media.how-media-orbit {
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 578 / 510;
}

/* ==== landing-how.css ==== */

/* landing — How left cards from Figma 772:3980. Chat colors from 777:6788. */

body.landing {
  text-wrap: pretty;
}

body.landing :is(h1, h2, h3, h4, h5, h6, p, li, strong, summary, blockquote),
body.landing .story-memory-preview h4 {
  text-wrap: pretty;
}

body.landing .how-memory-copy h4 {
  text-wrap: balance;
}

body.landing .hero-copy-text > p:not(.eyebrow),
body.landing .hero-testimonial blockquote p {
  text-wrap: balance;
}

/* Hero story cards — Figma 802:8698: 200px graphics, centered. */
body.landing .hero-strip .hero-card-story,
body.landing .hero-strip .hero-story {
  position: relative;
  height: 489px !important;
  padding: 40px;
  gap: 0;
  justify-content: space-between;
}

body.landing .hero-strip .hero-card-art,
body.landing .hero-strip .hero-art,
body.landing .hero-strip .hero-story-tin .hero-card-art,
body.landing .hero-strip .hero-story-tin .hero-art,
body.landing .hero-strip .hero-story-map .hero-card-art,
body.landing .hero-strip .hero-story-map .hero-art,
body.landing .hero-strip .hero-story-map .hero-art-map {
  position: relative;
  left: auto;
  top: auto;
  flex: none;
  width: 200px;
  height: 200px;
  overflow: visible;
  transform: none;
}

body.landing .hero-strip .hero-card-art img,
body.landing .hero-strip .hero-art img,
body.landing .hero-strip .hero-story-tin .hero-card-art img,
body.landing .hero-strip .hero-story-tin .hero-art img,
body.landing .hero-strip .hero-story-map .hero-card-art img,
body.landing .hero-strip .hero-story-map .hero-art img,
body.landing .hero-strip .hero-story-map .hero-art-map img,
body.landing .hero-strip .hero-story-chair .hero-card-art img,
body.landing .hero-strip .hero-story-chair .hero-art img,
body.landing .hero-strip .hero-card-art.is-stamp img,
body.landing .hero-strip .hero-art-stamp img {
  position: static !important;
  display: block;
  width: 100% !important;
  height: 100% !important;
  left: auto !important;
  top: auto !important;
  max-width: none;
  object-fit: contain;
  object-position: center;
  transform: none !important;
  filter: none;
}

body.landing .hero-strip .hero-card-story > p:last-child,
body.landing .hero-strip .hero-story > p:last-child {
  margin: 0;
  color: #064e3b;
  font-size: 14px;
  line-height: 1.65;
}

body.landing .hero-strip .hero-story-map > p:last-child {
  width: 284px;
  max-width: 100%;
}

/* How memory cards — same story-card layout as the hero strip. */
body.landing .how-memory-card {
  height: 489px;
  padding: 40px;
  gap: 0;
  justify-content: flex-start;
}

body.landing .how-memory-copy {
  flex: 0 0 auto;
  width: 100%;
}

body.landing .how-memory-art {
  position: relative;
  left: auto;
  top: auto;
  flex: 1 1 auto;
  width: 200px;
  height: auto;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
  transform: none;
}

body.landing .how-memory-art img {
  display: block;
  width: 200px;
  height: 200px;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center;
}

body.landing .how-memory-card > p {
  flex: 0 0 auto;
  margin: 0;
  max-width: 320px;
  color: #064e3b;
  font-size: 14px;
  line-height: 1.5;
  overflow: visible;
  overflow-wrap: anywhere;
}

body.landing .how-sticky-chat .story-chat-row.is-them .story-chat-bubble {
  background: #fff !important;
  color: #000 !important;
}

body.landing .how-sticky-chat .story-chat-row.is-them .story-chat-bubble::before {
  background: #fff !important;
}

body.landing .how-sticky-chat .story-chat-row.is-me .story-chat-bubble {
  background: #0078ff !important;
  color: #fff !important;
}

body.landing .how-sticky-chat .story-chat-bubble-wrap.is-invite-hello {
  max-width: none !important;
  width: max-content;
}

body.landing .how-sticky-chat .story-chat-bubble-wrap.is-invite-hello .story-chat-bubble {
  display: flex !important;
  flex-direction: column;
  align-items: flex-start;
  width: max-content !important;
  max-width: none !important;
  white-space: nowrap !important;
  text-wrap: pretty;
  overflow-wrap: normal;
}

body.landing .how-flow {
  align-items: center !important;
  overflow: visible !important;
}

body.landing .how-steps {
  width: 590px;
  max-width: 590px;
}

body.landing .how-card {
  height: 440px !important;
  min-height: 440px !important;
}

body.landing .how-copy {
  box-sizing: border-box !important;
  justify-content: space-between !important;
  gap: 0 !important;
  width: 590px !important;
  max-width: 100% !important;
  height: 440px !important;
  min-height: 440px !important;
  padding: 64px !important;
  border: 0.5px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 24px !important;
  background: #fff !important;
}

body.landing .how-copy-top {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  width: 100%;
}

body.landing .how-badge {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding: 8px 12px;
  border-radius: 55px;
  background: rgba(4, 120, 87, 0.08);
  color: #047857;
  font-family: Inter, system-ui, sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 12px;
  letter-spacing: 0.48px;
  text-transform: uppercase;
  text-box-trim: trim-both;
  text-box-edge: cap alphabetic;
}

body.landing .how-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
}

body.landing .how-text h3,
body.landing .how-card:first-child .how-text h3,
body.landing .how-card[data-how-step="3"] .how-text h3 {
  width: 440px !important;
  max-width: 100% !important;
  margin: 0 !important;
}

body.landing .how-card[data-how-step="2"] .how-text h3,
body.landing .how-card[data-how-step="3"] .how-text h3 {
  width: 100% !important;
}

body.landing .how-card[data-how-step="1"] .how-text p {
  width: 425px;
  max-width: 100%;
}

body.landing .how-card[data-how-step="2"] .how-text p {
  width: 458px;
  max-width: 100%;
}

body.landing .how-card[data-how-step="3"] .how-text p {
  width: 439px;
  max-width: 100%;
}

body.landing .place-option-icon,
body.landing .place-amp {
  display: none;
}

body.landing .how-mark,
body.landing .hero-stories,
body.landing .places-title-accent,
body.landing .pricing-title-accent,
body.landing .faq-title-accent,
body.landing .final-cta-mark {
  position: relative;
  isolation: isolate;
  z-index: 0;
}

body.landing .how-mark {
  display: inline-block;
  white-space: nowrap;
}

body.landing .how-mark > span,
body.landing .hero-stories > span,
body.landing .places-title-accent > span,
body.landing .pricing-title-accent > span,
body.landing .final-cta-text {
  position: relative;
  z-index: 1;
}

body.landing .how-mark-01::after,
body.landing .how-mark-02::before,
body.landing .how-mark-03::after {
  content: none !important;
  display: none !important;
}

body.landing .how-mark img,
body.landing .how-mark-img,
body.landing .hero-stories > img,
body.landing .places-title-mark,
body.landing .pricing-title-mark,
body.landing .faq-title-mark,
body.landing .final-cta-underline {
  z-index: -1 !important;
}

body.landing .how-mark img,
body.landing .how-mark-img {
  display: block;
  position: absolute;
  max-width: none;
  pointer-events: none;
}

body.landing .how-mark-01 .how-mark-img {
  left: 0;
  bottom: 0.02em;
  width: 259.871px;
  height: 10px;
  transform: rotate(1.25deg);
}

body.landing .how-mark-02 .how-mark-img {
  left: 50%;
  top: 50%;
  width: 140px;
  height: 56px;
  transform: translate(-50%, -50%);
}

body.landing .how-mark-03 .how-mark-img {
  left: 50%;
  top: 50%;
  width: 102px;
  height: 50px;
  transform: translate(-50%, -50%) rotate(1.63deg) scaleY(-1);
}

body.landing .how-imessage-note {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 24px;
  margin: 0;
  color: #022c22;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.7;
  white-space: nowrap;
}

body.landing .how-imessage-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 2px 8px 2px 5px;
  border-radius: 9px;
  background: #ecf9ee;
  color: #074e12;
}

body.landing .how-imessage-pill img {
  display: block;
  width: 18px;
  height: 18px;
  border-radius: 4.5px;
  object-fit: cover;
  flex: none;
}

body.landing .formats {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
}

body.landing .formats > span {
  margin: 0;
  color: #022c22;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.7;
  text-transform: none;
  opacity: 1;
  white-space: nowrap;
}

body.landing .formats > div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

body.landing .formats b {
  padding: 4px 8px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 9px;
  color: #064e3b;
  background: rgba(6, 95, 70, 0.05);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.7;
}

body.landing .formats b img {
  display: block;
  width: 20px;
  height: 20px;
  flex: none;
}

body.landing .checks {
  gap: 12px !important;
  color: #022c22 !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
}

body.landing .checks li {
  height: 24px;
  gap: 6px !important;
}

body.landing .checks img {
  width: 20px !important;
  height: 20px !important;
}

body.landing .how-steps.how-stack-stage.is-enhanced {
  position: relative !important;
  align-self: center;
  width: 590px !important;
  max-width: 590px !important;
  height: 440px !important;
  min-height: 440px !important;
  gap: 0 !important;
  overflow: visible !important;
  perspective: none;
}

body.landing .how-steps.how-stack-stage.is-enhanced .how-card,
body.landing .how-steps.how-stack-stage.is-enhanced .how-card + .how-card {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 590px !important;
  max-width: 590px !important;
  height: 440px !important;
  min-height: 440px !important;
  margin: 0 !important;
  will-change: transform, opacity;
}

body.landing .how-steps.how-stack-stage.is-enhanced .how-card:nth-child(1) {
  z-index: 1;
}

body.landing .how-steps.how-stack-stage.is-enhanced .how-card:nth-child(2) {
  z-index: 2;
}

body.landing .how-steps.how-stack-stage.is-enhanced .how-card:nth-child(3) {
  z-index: 3;
}

body.landing .how-steps.how-stack-stage.is-enhanced .how-copy {
  box-shadow: 0 18px 40px rgba(2, 44, 34, 0.12);
}

@media (min-width: 1051px) {
  body.landing .places-preview,
  body.landing .places-media,
  body.landing .place-panel,
  body.landing .place-panel-frame,
  body.landing .place-story-frame {
    pointer-events: none !important;
    touch-action: none;
    overscroll-behavior: none;
  }

  body.landing section.household .section-intro h2 {
    width: max-content !important;
    max-width: 100% !important;
    text-wrap: pretty;
  }

  body.landing section.household .section-intro h2 span {
    white-space: nowrap;
  }

  body.landing .how-flow {
    box-sizing: border-box !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 48px !important;
    align-items: stretch !important;
    /* 100vw, not 100%: pinning uses position:fixed, so % width
       would resolve against the viewport and the cards would grow. */
    width: min(var(--held-content), calc(100vw - 2 * var(--held-content-gutter))) !important;
    max-width: min(var(--held-content), calc(100vw - 2 * var(--held-content-gutter))) !important;
  }

  body.landing .how-sticky {
    align-self: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    top: 0 !important;
    overflow: visible;
  }

  body.landing .how-sticky-panel {
    width: 100%;
    height: 440px;
    overflow: visible;
  }

  body.landing .how-sticky-chat,
  body.landing .how-sticky-memories {
    inset: 0;
  }

  body.landing .how-sticky-chat {
    width: 100%;
    height: 100%;
    padding: 24px;
    align-items: center;
    justify-content: center;
    overflow: visible !important;
    -webkit-mask-image: none;
    mask-image: none;
  }

  body.landing .how-sticky-chat .story-chat {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.landing .how-sticky .how-memory-card,
  body.landing .how-sticky .how-memory-card.is-on {
    width: 100%;
    max-width: 100%;
    height: 100%;
    max-height: 100%;
  }

  body.landing .how-steps,
  body.landing .how-steps.how-stack-stage.is-enhanced {
    align-self: stretch !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }

  body.landing .how-steps.how-stack-stage.is-enhanced .how-card,
  body.landing .how-steps.how-stack-stage.is-enhanced .how-card + .how-card {
    width: 100% !important;
    max-width: none !important;
  }

  body.landing .how-card {
    width: 100% !important;
  }

  body.landing .how-copy {
    width: 100% !important;
    max-width: none !important;
  }

  body.landing .how-text h3,
  body.landing .how-card:first-child .how-text h3,
  body.landing .how-card[data-how-step="3"] .how-text h3 {
    width: auto !important;
    max-width: 100% !important;
  }
}

@media (max-width: 1050px) {
  body.landing .how-steps,
  body.landing .how-steps.how-stack-stage.is-enhanced {
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
  }

  body.landing .how-steps.how-stack-stage.is-enhanced .how-card,
  body.landing .how-steps.how-stack-stage.is-enhanced .how-card + .how-card {
    position: relative !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
  }

  body.landing .how-card {
    height: auto !important;
    min-height: 0 !important;
  }

  body.landing .how-copy {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 36px 32px !important;
    gap: 32px !important;
  }

  body.landing .how-text h3,
  body.landing .how-card:first-child .how-text h3,
  body.landing .how-card[data-how-step="3"] .how-text h3 {
    width: auto !important;
    font-size: clamp(36px, 4.4vw, 48px) !important;
  }

  body.landing .how-imessage-note,
  body.landing .formats > span {
    flex-wrap: wrap;
    height: auto;
    white-space: normal;
  }

  body.landing .how-sticky-chat .story-chat-bubble-wrap.is-invite-hello {
    max-width: min(280px, calc(100% - 8px)) !important;
    width: auto !important;
  }

  body.landing .how-sticky-chat .story-chat-bubble-wrap.is-invite-hello .story-chat-bubble {
    display: flex !important;
    flex-direction: column;
    align-items: flex-start;
    width: auto !important;
    max-width: 100% !important;
    white-space: normal !important;
    text-wrap: pretty;
  }

  body.landing .how-sticky-chat .story-chat-bubble-wrap.is-invite-hello .story-chat-bubble span {
    display: block;
    white-space: normal;
  }

  body.landing .how-sticky-chat .story-chat-row.is-overflow {
    display: none !important;
  }
}

/* Wide tablet: keep the two-column pairing, but let cards shrink. */
@media (min-width: 901px) and (max-width: 1050px) {
  body.landing .how-flow {
    gap: 40px !important;
  }

  body.landing .how-card {
    padding: 0 !important;
  }

  body.landing .how-sticky {
    top: max(24px, calc((100dvh - min(600px, 100dvh - 48px)) / 2)) !important;
  }

  body.landing .how-sticky-panel {
    height: min(600px, calc(100dvh - 48px));
    overflow: hidden;
  }

  body.landing .how-sticky-chat {
    padding: 20px 12px 32px;
    overflow: hidden;
    -webkit-mask-image: none;
    mask-image: none;
  }
}

/* Phone + portrait tablet: copy in the top half, animation sticky in the bottom. */
@media (max-width: 900px) {
  body.landing .how {
    --how-step-pad: 52px;
    --how-cards-gap: calc(var(--how-step-pad) * 0.4);
    --how-end-pad: calc(52px * 0.85);
    --how-anim-gutter: max(12px, env(safe-area-inset-bottom, 0px));
    --how-copy-band: min(286px, 42dvh);
    --how-anim-h: max(260px, calc(100dvh - var(--how-step-pad) - var(--how-cards-gap) - var(--how-copy-band) - var(--how-anim-gutter)));
    padding: 52px 20px var(--how-end-pad) !important;
  }

  body.landing .how-flow {
    position: relative;
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 0 !important;
    width: 100% !important;
  }

  body.landing .how-steps {
    display: flex !important;
    flex-direction: column !important;
    order: 2;
    position: relative;
    z-index: 1;
    gap: 40px !important;
    margin-top: 0;
    padding-inline: 0;
    padding-bottom: calc(var(--how-anim-h) + var(--how-end-pad));
  }

  body.landing.how-dock-active riffs-widget {
    display: none !important;
  }

  body.landing .how-sticky {
    order: 1;
    position: sticky !important;
    top: calc(100dvh - var(--how-anim-h) - var(--how-anim-gutter)) !important;
    align-self: stretch !important;
    z-index: 4;
    box-sizing: border-box;
    width: 100% !important;
    height: var(--how-anim-h);
    margin: 0 0 calc(var(--how-anim-h) * -1) !important;
    padding: 0 !important;
    border-radius: 0;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible;
    container-type: inline-size;
  }

  body.landing .how-sticky.is-released {
    position: absolute !important;
    top: auto !important;
    bottom: 0 !important;
    margin: 0 !important;
  }

  body.landing .how:has(.how-sticky.is-released) {
    padding-bottom: calc(var(--how-end-pad) * 0.8) !important;
  }

  body.landing .how:has(.how-sticky.is-released) .how-card[data-how-step="3"] {
    min-height: 0 !important;
  }

  body.landing .how-sticky::before {
    content: "";
    position: absolute;
    left: 50%;
    top: calc(var(--how-cards-gap) * -1);
    z-index: 0;
    width: 100vw;
    height: calc(var(--how-cards-gap) + var(--how-anim-h) + var(--how-anim-gutter) + 24px);
    transform: translateX(-50%);
    pointer-events: none;
    background: linear-gradient(
      to bottom,
      rgb(243 239 229 / 0) 0%,
      rgb(243 239 229 / 0.88) calc(var(--how-cards-gap) * 0.7),
      var(--paper) var(--how-cards-gap),
      var(--paper) 100%
    );
  }

  body.landing .how-sticky.is-released::before {
    top: calc(var(--how-cards-gap) * -1);
    height: calc(var(--how-cards-gap) + 100%);
  }

  body.landing .how-sticky-panel {
    position: relative;
    z-index: 1;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    border-radius: 24px;
    background: transparent;
  }

  body.landing .how-sticky-panel::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    border-radius: inherit;
    background-color: #fff;
    opacity: 1;
    pointer-events: none;
    transition: background-color 1.1s ease;
  }

  body.landing .how-sticky-chat,
  body.landing .how-sticky-memories {
    position: absolute;
    inset: 0;
  }

  body.landing .how-sticky-chat {
    z-index: 1;
    height: 100%;
    align-items: center;
    justify-content: center;
    padding: 24px 20px;
    overflow: hidden;
    -webkit-mask-image: none;
    mask-image: none;
    opacity: 1;
    transition: opacity 1.1s ease !important;
  }

  body.landing .how-sticky-chat .story-chat-row.is-them .story-chat-bubble,
  body.landing .how-sticky-chat .story-chat-row.is-them .story-chat-bubble::before {
    background: #e9e9eb !important;
  }

  body.landing .how-sticky-chat .story-chat {
    align-self: stretch;
    width: 100% !important;
    gap: 9px !important;
    justify-content: center !important;
  }

  body.landing .how-sticky-chat .story-chat-row.is-overflow {
    display: none !important;
  }

  body.landing .how[data-how-view="chat"] .how-sticky-chat {
    opacity: 1;
  }

  body.landing .how[data-how-view="memories"] .how-sticky-chat {
    opacity: 0;
    pointer-events: none;
  }

  body.landing .how[data-how-view="chat"] .how-sticky-chat .story-chat {
    opacity: 1;
  }

  body.landing .how[data-how-view="memories"] .how-sticky-chat .story-chat {
    opacity: 0;
  }

  body.landing .how[data-how-view="chat"] .how-sticky-panel::after {
    background-color: #fff;
  }

  body.landing .how[data-how-view="memories"] .how-sticky-panel::after {
    background-color: var(--paper);
  }

  body.landing .how-sticky-memories {
    inset: 12px;
    z-index: 2;
    width: auto;
    margin-top: 0;
    container-type: size;
    container-name: how-memories;
  }

  body.landing .how-card {
    height: auto !important;
    min-height: calc(100dvh - var(--how-anim-h) - var(--how-anim-gutter) - var(--how-step-pad)) !important;
    padding: 0 !important;
    justify-content: flex-start !important;
  }

  body.landing .how-copy {
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin-inline: 0;
    padding: 0 !important;
    gap: 40px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
  }

  body.landing .how-copy-top {
    gap: 24px;
  }

  body.landing .how-imessage-pill {
    padding: 2px 8px 2px 5px;
    border-radius: 9px;
    background: rgba(0, 0, 0, 0.04);
    color: #074e12;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.7;
  }

  body.landing .how-text h3,
  body.landing .how-card:first-child .how-text h3,
  body.landing .how-card[data-how-step="3"] .how-text h3 {
    width: auto !important;
    max-width: none !important;
    font-size: 44px !important;
  }

  body.landing .how-card[data-how-step="1"] .how-text h3 {
    width: min(329px, 100%) !important;
  }

  body.landing .how-card[data-how-step="1"] .how-text p,
  body.landing .how-card[data-how-step="2"] .how-text p,
  body.landing .how-card[data-how-step="3"] .how-text p {
    width: 100%;
    max-width: none;
  }

  body.landing .how-memory-card {
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    padding: 5cqmin 5.5cqmin 4.5cqmin;
    gap: 2.8cqmin;
    justify-content: space-between;
    overflow: hidden;
    transform-origin: center center;
    transform: translate(calc(-50% + var(--ox, 0px)), calc(-50% + var(--oy, 10px))) rotate(var(--rot, 0deg)) scale(0.86) !important;
  }

  body.landing .how-memory-card.is-on {
    transform: translate(calc(-50% + var(--ox, 0px)), calc(-50% + var(--oy, 0px))) rotate(var(--rot, 0deg)) scale(0.92) !important;
  }

  body.landing .how-memory-art {
    position: relative;
    left: auto;
    top: auto;
    flex: 1 1 auto;
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
    transform: none;
  }

  body.landing .how-memory-art img {
    width: min(200px, 42cqh, 100%);
    height: min(200px, 42cqh);
    aspect-ratio: 1;
    object-fit: contain;
    object-position: center;
  }

  body.landing .how-memory-copy {
    flex: 0 0 auto;
    min-height: 0;
    gap: 1.8cqmin;
    width: 100%;
  }

  body.landing .how-memory-copy .eyebrow {
    font-size: clamp(10px, 3.2cqmin, 12px);
  }

  body.landing .how-memory-copy h4 {
    font-size: clamp(22px, 9cqmin, 36px);
    line-height: 1.05;
  }

  body.landing .how-memory-card > p {
    max-width: none;
    font-size: clamp(11px, 3.5cqmin, 14px);
    line-height: 1.35;
  }
}

@media (max-width: 680px) {
  body.landing .hero h1 {
    font-size: min(48px, 11.5cqi) !important;
    line-height: 1 !important;
  }

  body.landing .hero-strip,
  body.landing .hero-strip.hero-flow {
    height: 585px !important;
  }

  body.landing .hero-strip-track,
  body.landing .hero-strip-track.hero-gallery {
    align-items: stretch !important;
    height: 489px !important;
    gap: 16px !important;
    padding: 0 5vw !important;
  }

  body.landing .hero-card,
  body.landing .hero-strip .hero-memory,
  body.landing .hero-card-photo,
  body.landing .hero-strip .hero-photo,
  body.landing .hero-strip .hero-photo-album,
  body.landing .hero-strip .hero-photo-kitchen,
  body.landing .hero-strip .hero-photo-family,
  body.landing .hero-strip .hero-photo-portrait,
  body.landing .hero-card-quote,
  body.landing .hero-strip .hero-quote,
  body.landing .hero-strip .hero-quote-courage,
  body.landing .hero-strip .hero-quote-love {
    max-width: 90vw !important;
    height: 489px !important;
  }

  body.landing .hero-card-story,
  body.landing .hero-strip .hero-story,
  body.landing .hero-strip .hero-story-journey,
  body.landing .hero-strip .hero-story-tin,
  body.landing .hero-strip .hero-story-chair,
  body.landing .hero-strip .hero-story-map {
    max-width: 90vw !important;
    position: relative;
    height: 489px !important;
    padding: 40px !important;
    gap: 0 !important;
    justify-content: space-between;
  }

  body.landing .hero-strip .hero-card-copy h2 {
    font-size: 34px !important;
    line-height: 1.1 !important;
    text-wrap: wrap;
  }

  body.landing .hero-strip .hero-quote-courage .hero-quote-copy > p,
  body.landing .hero-strip .hero-story-map > p:last-child {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.landing .hero-strip .hero-quote-love blockquote {
    font-size: 28px !important;
    line-height: 1.15 !important;
  }

  body.landing .how-sticky-chat {
    padding: 24px 20px;
  }

  body.landing .how-sticky-chat .story-chat-reaction-halo {
    background: #fff;
  }

  body.landing .how-sticky-chat .story-chat-reaction-large,
  body.landing .how-sticky-chat .story-chat-reaction-medium,
  body.landing .how-sticky-chat .story-chat-reaction-small {
    background: #e9e9eb;
  }

  body.landing .how-text h3,
  body.landing .how-card:first-child .how-text h3,
  body.landing .how-card[data-how-step="3"] .how-text h3,
  body.landing section.household .role-card h3 {
    font-size: 44px !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-intro h2 {
    isolation: isolate;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-title-accent {
    isolation: auto !important;
    z-index: auto !important;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-title-mark {
    z-index: -1 !important;
    width: calc(100% + 24px) !important;
    height: 47px !important;
    aspect-ratio: auto !important;
  }

  body.landing .how-mark-01 .how-mark-img {
    width: min(100%, 200px);
    height: 8px;
  }

  body.landing .how-mark-02 .how-mark-img {
    width: 108px;
    height: 43px;
  }

  body.landing .how-mark-03 .how-mark-img {
    width: 78px;
    height: 38px;
  }

  body.landing .how {
    --how-copy-band: min(256px, 38dvh);
  }

  body.landing .how-memory-card,
  body.landing .how-memory-card.is-on {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    padding: 40px !important;
    gap: 0 !important;
    justify-content: space-between;
    overflow: hidden;
    transform: translate(calc(-50% + var(--ox, 0px)), calc(-50% + var(--oy, 0px))) rotate(var(--rot, 0deg)) scale(1) !important;
  }

  body.landing .how-memory-card:not(.is-on) {
    transform: translate(calc(-50% + var(--ox, 0px)), calc(-50% + var(--oy, 10px))) rotate(var(--rot, 0deg)) scale(0.96) !important;
  }

  body.landing .how-memory-copy {
    gap: 8px;
  }

  body.landing .how-memory-copy .eyebrow {
    font-size: 12px !important;
  }

  body.landing .how-memory-copy h4 {
    font-size: 32px !important;
    line-height: 1.1 !important;
    text-wrap: wrap;
  }

  body.landing .how-memory-copy h4 br {
    display: none;
  }

  body.landing .how-memory-card > p {
    max-width: none;
    font-size: 14px !important;
    line-height: 1.5 !important;
  }

  body.landing .how-memory-art {
    flex: 1 1 auto;
    width: 100%;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  body.landing .how-memory-art img {
    width: auto !important;
    height: auto !important;
    max-width: min(160px, 100%);
    max-height: min(160px, 62%);
    aspect-ratio: 1;
    object-fit: contain;
  }

  @container how-memories (max-height: 360px) {
    body.landing .how-memory-card,
    body.landing .how-memory-card.is-on {
      padding: 28px !important;
    }

    body.landing .how-memory-copy h4 {
      font-size: 28px !important;
    }
  }

  /* Places — Figma 772:4623. Cards + CTA only; phone stays on tablet/desktop. */
  body.landing section.places,
  body.landing section.places#features {
    padding: 0 8px !important;
  }

  body.landing .places-panel {
    gap: 32px;
    padding: 32px !important;
    border-radius: 24px;
  }

  body.landing .places-intro {
    align-items: center;
    width: 282px;
    max-width: 100%;
    margin-inline: auto;
  }

  body.landing {
    --held-h2-size: 52px;
  }

  body.landing .places-intro h2,
  body.landing .places-copy h2,
  body.landing section.household .section-intro h2,
  body.landing section.pricing.pricing-figma#pricing .pricing-intro h2,
  body.landing section.faq.faq-figma#faq .faq-intro h2,
  body.landing section.faq .faq-intro h2,
  body.landing section.final-cta.final-cta-figma#start h2 {
    font-family: var(--font-instrument-serif), Georgia, serif !important;
    font-size: 52px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
  }

  body.landing .places-intro h2,
  body.landing .places-copy h2 {
    width: 282px !important;
    max-width: 100% !important;
    text-align: center !important;
  }

  body.landing .places-intro > p {
    display: none !important;
  }

  body.landing .places-title-mark {
    width: 138px !important;
    height: 6px !important;
    bottom: 0.02em !important;
    transform: translateX(-50%) rotate(1.21deg) !important;
  }

  body.landing .places-body {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 32px;
    width: 100% !important;
    max-width: none !important;
  }

  body.landing .places-preview,
  body.landing .places-media,
  body.landing .places-phone,
  body.landing .places-phone-screen-fill {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
  }

  body.landing section.places .places-copy,
  body.landing .places-copy {
    flex: none !important;
    justify-content: flex-start !important;
    gap: 32px !important;
    width: 100% !important;
    max-width: none !important;
  }

  body.landing section.places .place-options,
  body.landing .place-options {
    gap: 12px !important;
    width: 100% !important;
  }

  body.landing section.places .place-option,
  body.landing .place-option,
  body.landing section.places .place-option:last-child,
  body.landing .place-option:last-child {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 24px;
    box-sizing: border-box;
    width: 100% !important;
    padding: 24px !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: #f3efe5 !important;
    pointer-events: none;
  }

  body.landing .place-progress {
    display: none !important;
  }

  body.landing .place-option-icon {
    display: block;
    flex: none;
    width: 28px;
    height: 28px;
  }

  body.landing .place-and {
    display: none;
  }

  body.landing .place-amp {
    display: inline;
  }

  body.landing .place-option-copy {
    gap: 20px;
    width: 100%;
    text-wrap: pretty;
  }

  body.landing .place-option-copy strong,
  body.landing .place-option-copy > span {
    margin: 0;
    text-wrap: pretty;
  }

  body.landing .place-option-copy strong {
    text-box-trim: trim-end;
    text-box-edge: cap alphabetic;
  }

  body.landing .place-option-copy > span {
    text-box-trim: trim-start;
    text-box-edge: cap alphabetic;
  }

  body.landing section.places .place-option strong,
  body.landing .place-option strong,
  body.landing section.places .place-option.active strong,
  body.landing .place-option.active strong {
    color: #0a0a0a !important;
    font-family: Inter, sans-serif !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    letter-spacing: -0.2px !important;
    opacity: 1 !important;
  }

  body.landing .place-option-copy > span,
  body.landing .place-option.active .place-option-copy > span {
    max-height: none !important;
    color: #404040 !important;
    opacity: 1 !important;
  }

  body.landing section.places .places-example,
  body.landing .places-example {
    background: #fff !important;
    color: #022c22 !important;
  }

  body.landing section.places .places-example:hover,
  body.landing .places-example:hover {
    background: #d9f99d !important;
    color: #0a0a0a !important;
  }

  /* Figma 772:4997 — 32px pad, 16/16 Inter Medium, 24px link stack. */
  body.landing footer.site-footer.site-footer-figma .footer-card {
    gap: 0;
    border-radius: 20px;
  }

  body.landing footer.site-footer.site-footer-figma .footer-content {
    width: 100% !important;
    max-width: none !important;
    padding: 32px !important;
    gap: 0 !important;
  }

  body.landing footer.site-footer.site-footer-figma .footer-links {
    display: flex !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: none !important;
    flex: none !important;
    gap: 0 !important;
  }

  body.landing footer.site-footer.site-footer-figma .footer-links nav {
    flex: 1 1 0 !important;
    width: auto !important;
    max-width: none !important;
    gap: 24px !important;
  }

  body.landing footer.site-footer.site-footer-figma .footer-links a {
    font-family: Inter, sans-serif !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 16px !important;
    color: #022c22 !important;
  }
}

/* Lime CTA — Figma 849:8775. Rest lime-200→300, hover lime-200→400. No lift. */
@property --held-lime-from {
  syntax: "<color>";
  inherits: false;
  initial-value: #d9f99d;
}

@property --held-lime-to {
  syntax: "<color>";
  inherits: false;
  initial-value: #bef264;
}

@property --held-em-from {
  syntax: "<color>";
  inherits: false;
  initial-value: #065f46;
}

@property --held-em-to {
  syntax: "<color>";
  inherits: false;
  initial-value: #064e3b;
}

body.landing.landing .button-ghost,
body.landing.landing .nav-cta,
body.landing.landing .places-example {
  transition: background 0.3s ease, color 0.3s ease;
}

body.landing.landing .hero-actions .button-ghost,
body.landing.landing .site-nav-hero .nav-links a.nav-cta {
  background: rgba(255, 255, 255, 0.08) !important;
}

body.landing.landing .button-lime {
  --held-lime-from: #d9f99d;
  --held-lime-to: #bef264;
  color: #0a0a0a !important;
  background: linear-gradient(var(--held-lime-from), var(--held-lime-to)) !important;
  box-shadow: inset 0 2px 2px rgba(255, 255, 255, 0.25) !important;
  transition: --held-lime-from 0.35s ease, --held-lime-to 0.35s ease;
}

body.landing.landing section.final-cta.final-cta-figma#start .button.button-primary,
body.landing.landing section.final-cta.final-cta-figma#start a.button.button-primary {
  --held-lime-from: #d9f99d;
  --held-lime-to: #bef264;
  color: #0a0a0a !important;
  background: linear-gradient(var(--held-lime-from), var(--held-lime-to)) !important;
  box-shadow: inset 0 2px 2px rgba(255, 255, 255, 0.25) !important;
  transition: --held-lime-from 0.35s ease, --held-lime-to 0.35s ease;
}

body.landing.landing section.pricing.pricing-figma#pricing .pricing-cta {
  --held-em-from: #065f46;
  --held-em-to: #064e3b;
  color: #fff !important;
  background: linear-gradient(var(--held-em-from), var(--held-em-to)) !important;
  box-shadow: inset 0 2px 2px rgba(255, 255, 255, 0.18) !important;
  transition: --held-em-from 0.35s ease, --held-em-to 0.35s ease;
}

body.landing.landing .button-lime,
body.landing.landing .button-lime:hover,
body.landing.landing .button-lime:focus-visible,
body.landing.landing .button-lime:active,
body.landing.landing .button-ghost:hover,
body.landing.landing .button-ghost:focus-visible,
body.landing.landing .nav-cta:hover,
body.landing.landing .nav-cta:focus-visible,
body.landing.landing .pricing-cta:hover,
body.landing.landing .pricing-cta:focus-visible,
body.landing.landing .pricing-cta:active,
body.landing.landing .places-example:hover,
body.landing.landing .places-example:focus-visible,
body.landing.landing section.final-cta.final-cta-figma#start .button.button-primary:hover,
body.landing.landing section.final-cta.final-cta-figma#start a.button.button-primary:hover,
body.landing.landing section.final-cta.final-cta-figma#start .button.button-primary:focus-visible,
body.landing.landing section.final-cta.final-cta-figma#start a.button.button-primary:focus-visible,
body.landing.landing section.final-cta.final-cta-figma#start .button.button-primary:active,
body.landing.landing section.final-cta.final-cta-figma#start a.button.button-primary:active {
  transform: none !important;
  filter: none !important;
}

body.landing.landing .button-ghost:hover,
body.landing.landing .button-ghost:focus-visible,
body.landing.landing .nav-cta:hover,
body.landing.landing .nav-cta:focus-visible,
body.landing.landing .places-example:hover,
body.landing.landing .places-example:focus-visible {
  box-shadow: none !important;
}

body.landing.landing .button-lime:hover,
body.landing.landing .button-lime:focus-visible {
  --held-lime-from: #d9f99d;
  --held-lime-to: #a3e635;
  background: linear-gradient(var(--held-lime-from), var(--held-lime-to)) !important;
  box-shadow: inset 0 2px 2px rgba(255, 255, 255, 0.25) !important;
}

body.landing.landing section.final-cta.final-cta-figma#start .button.button-primary:hover,
body.landing.landing section.final-cta.final-cta-figma#start a.button.button-primary:hover,
body.landing.landing section.final-cta.final-cta-figma#start .button.button-primary:focus-visible,
body.landing.landing section.final-cta.final-cta-figma#start a.button.button-primary:focus-visible {
  --held-lime-from: #d9f99d;
  --held-lime-to: #a3e635;
  background: linear-gradient(var(--held-lime-from), var(--held-lime-to)) !important;
  box-shadow: inset 0 2px 2px rgba(255, 255, 255, 0.25) !important;
}

body.landing.landing .button-lime:active {
  --held-lime-from: #d9f99d;
  --held-lime-to: #bef264;
  background: linear-gradient(var(--held-lime-from), var(--held-lime-to)) !important;
  box-shadow: inset 0 2px 2px rgba(255, 255, 255, 0.25) !important;
}

body.landing.landing section.final-cta.final-cta-figma#start .button.button-primary:active,
body.landing.landing section.final-cta.final-cta-figma#start a.button.button-primary:active {
  --held-lime-from: #d9f99d;
  --held-lime-to: #bef264;
  background: linear-gradient(var(--held-lime-from), var(--held-lime-to)) !important;
  box-shadow: inset 0 2px 2px rgba(255, 255, 255, 0.25) !important;
}

body.landing.landing section.pricing.pricing-figma#pricing .pricing-cta:hover,
body.landing.landing section.pricing.pricing-figma#pricing .pricing-cta:focus-visible {
  --held-em-from: #065f46;
  --held-em-to: #022c22;
  background: linear-gradient(var(--held-em-from), var(--held-em-to)) !important;
  box-shadow: inset 0 2px 2px rgba(255, 255, 255, 0.18) !important;
}

body.landing.landing section.pricing.pricing-figma#pricing .pricing-cta:active {
  --held-em-from: #065f46;
  --held-em-to: #064e3b;
  background: linear-gradient(var(--held-em-from), var(--held-em-to)) !important;
}

@media (prefers-reduced-motion: reduce) {
  body.landing.landing .button-lime,
  body.landing.landing .button-ghost,
  body.landing.landing .nav-cta,
  body.landing.landing .pricing-cta,
  body.landing.landing .places-example,
  body.landing.landing section.final-cta.final-cta-figma#start .button.button-primary {
    transition-duration: 0.01ms !important;
  }
}

body.landing.landing .button-ghost:hover,
body.landing.landing .button-ghost:focus-visible,
body.landing.landing .site-nav-hero .nav-links a.nav-cta:hover,
body.landing.landing .site-nav-hero .nav-links a.nav-cta:focus-visible,
body.landing.landing section.places .places-example:hover,
body.landing.landing section.places .places-example:focus-visible {
  background: rgba(255, 255, 255, 0.2) !important;
}

body.landing.landing .site-nav-paper .nav-links a.nav-cta:hover,
body.landing.landing .site-nav-paper .nav-links a.nav-cta:focus-visible {
  background: #d9f99d !important;
  color: #022c22 !important;
}

/* Hero gallery: ~0.85 of the locked Figma card, plus room for the arc sag.
   zoom scales the whole card (type, art, padding) without fighting the
   per-frame y/rotate the marquee applies. Later 489px !important heights
   still apply to the pre-zoom box; layout size follows zoom. */
body.landing .hero-strip,
body.landing .hero-strip.hero-flow,
body.landing .hero-strip.hero-flow.is-enhanced {
  height: calc(489px * 0.85 + 48px) !important;
  overflow: visible;
}

body.landing .hero-strip-track,
body.landing .hero-strip-track.hero-gallery {
  height: calc(489px * 0.85) !important;
  align-items: flex-start;
}

body.landing .hero-strip-track.hero-gallery > .hero-memory {
  zoom: 0.85;
}

/* Mobile how-steps: beat the leftover ≤900px dock layout, and give each
   invite / talk / grow block a surface so the thread isn't paper-on-paper. */
@media (max-width: 680px) {
  body.landing .how {
    padding: 36px 12px 72px !important;
  }

  body.landing .how-flow {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    width: 100% !important;
  }

  body.landing .how-steps {
    display: flex !important;
    flex-direction: column !important;
    order: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 16px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.landing .how-sticky {
    display: none !important;
  }

  body.landing .how-card {
    box-sizing: border-box !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 24px 20px 20px !important;
    justify-content: flex-start !important;
    gap: 20px !important;
    border-radius: 24px !important;
    background: #fff !important;
    box-shadow:
      0 0 0 1px rgba(0, 0, 0, 0.05),
      0 10px 28px rgba(2, 44, 34, 0.07) !important;
  }

  body.landing .how-copy {
    gap: 16px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
  }

  body.landing .how-copy-top {
    gap: 16px;
  }

  body.landing .how-imessage-note {
    flex-wrap: wrap;
    height: auto;
    white-space: normal;
  }

  body.landing .how-card-demo {
    display: block;
    box-sizing: border-box;
    width: calc(100% + 8px);
    margin: 4px -4px 0;
    padding: 14px 12px 16px;
    border-radius: 16px;
    background: #f2f2f7;
  }

  body.landing .how-card-demo .how-sticky-chat {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    height: auto !important;
    padding: 0 !important;
    overflow: visible !important;
    opacity: 1 !important;
    pointer-events: none;
    -webkit-mask-image: none !important;
    mask-image: none !important;
  }

  body.landing .how-card-demo .how-sticky-chat .story-chat {
    width: 100% !important;
    gap: 8px !important;
    justify-content: flex-start !important;
  }

  body.landing .how-card-demo .story-chat-row.is-them .story-chat-bubble,
  body.landing .how-card-demo .story-chat-row.is-them .story-chat-bubble::before {
    background: #e5e5ea !important;
    color: #000 !important;
  }

  body.landing .how-card-demo .story-chat-row.is-me .story-chat-bubble {
    background: #007aff !important;
    color: #fff !important;
  }

  body.landing .how-card-demo .story-chat-bubble-wrap.is-invite-hello .story-chat-bubble {
    white-space: normal !important;
  }

  body.landing .how-card-demo[data-how-demo="grow"] {
    padding: 12px;
    overflow: hidden;
  }

  body.landing .how-card-demo .how-sticky-memories,
  body.landing .how-card-demo .how-memory-strip {
    display: flex !important;
    flex-direction: row;
    align-items: stretch;
    gap: 12px;
    position: relative !important;
    inset: auto !important;
    z-index: 1;
    width: auto;
    height: auto !important;
    min-height: 0;
    padding: 2px 2px 6px;
    overflow-x: auto;
    overflow-y: hidden;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none;
    container-type: normal !important;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 2px;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
  }

  body.landing .how-card-demo .how-sticky-memories::-webkit-scrollbar,
  body.landing .how-card-demo .how-memory-strip::-webkit-scrollbar {
    display: none;
  }

  body.landing .how-card-demo .how-memory-card,
  body.landing .how-card-demo .how-memory-card.is-on,
  body.landing .how-card-demo .how-memory-card:not(.is-on) {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    z-index: auto;
    flex: 0 0 78%;
    width: 78% !important;
    min-width: 0;
    max-width: none;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    margin: 0;
    padding: 20px 18px 18px !important;
    gap: 12px !important;
    justify-content: flex-start;
    overflow: visible !important;
    opacity: 1 !important;
    border-radius: 18px;
    box-shadow:
      0 0 0 1px rgba(0, 0, 0, 0.04),
      0 8px 20px rgba(0, 0, 0, 0.08);
    transform: none !important;
    pointer-events: auto;
    scroll-snap-align: start;
    scroll-snap-stop: always;
  }

  body.landing .how-card-demo .how-memory-art {
    width: 120px;
    height: 120px;
    flex: none !important;
    max-height: 120px;
  }

  body.landing .how-card-demo .how-memory-art img {
    width: 120px !important;
    height: 120px !important;
    max-width: 120px !important;
    max-height: 120px !important;
  }

  body.landing .how-card-demo .how-memory-copy h4 {
    font-size: 24px !important;
    line-height: 1.12;
  }

  body.landing .how-card-demo .how-memory-card > p {
    display: block !important;
    flex: none;
    margin: 0 auto;
    max-width: 220px;
    color: #064e3b;
    font-size: 13px !important;
    line-height: 1.4 !important;
    text-align: center;
  }
}

/* Compressed family roles live inside the pricing panel. */
body.landing .pricing-panel {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 40px;
}

body.landing section.pricing.pricing-figma#pricing .pricing-roles {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  width: min(var(--held-content), 100%);
  margin-inline: auto;
  scroll-margin-top: 88px;
}

body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-card {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  min-width: 0;
  min-height: 0;
  height: auto;
  margin: 0;
  padding: 20px 18px 22px;
  overflow: hidden;
  border: 0;
  border-radius: 20px;
  background: #fff;
  text-align: center;
}

body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-card > span {
  flex: none;
  margin: 0;
  color: #65a30d;
  font-family: Inter, sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.48px;
  line-height: 1;
  text-transform: uppercase;
}

body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-graphic,
body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-graphic.role-graphic-oil {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 64px;
  height: 64px;
  min-height: 64px;
  margin: 0;
  padding: 0;
  overflow: visible;
  background: transparent;
}

body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-oil-canvas,
body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-oil-canvas img {
  width: 64px;
  height: 64px;
  max-width: 64px;
  max-height: 64px;
  filter: none;
}

body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-card-copy {
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 100%;
  text-align: center;
}

body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-card h3 {
  margin: 0;
  color: #022c22;
  font-family: var(--font-instrument-serif), Georgia, serif;
  font-size: 22px;
  font-weight: 400;
  line-height: 1.15;
  letter-spacing: 0;
  text-align: center;
  white-space: normal;
  text-wrap: balance;
}

body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-card p {
  margin: 0;
  color: #4a4a45;
  font-family: Inter, sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.45;
  text-align: center;
}

@media (max-width: 1050px) {
  body.landing .pricing-panel {
    gap: 32px;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-roles {
    width: 100%;
  }
}

@media (max-width: 680px) {
  body.landing .pricing-panel {
    gap: 24px;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-roles {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-card {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    align-items: start;
    column-gap: 14px;
    row-gap: 4px;
    padding: 16px;
    text-align: left;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-card > span {
    grid-column: 2;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-graphic,
  body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-graphic.role-graphic-oil {
    grid-column: 1;
    grid-row: 1 / span 3;
    align-self: center;
    width: 56px;
    height: 56px;
    min-height: 56px;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-oil-canvas,
  body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-oil-canvas img {
    width: 56px;
    height: 56px;
    max-width: 56px;
    max-height: 56px;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-card-copy {
    grid-column: 2;
    text-align: left;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-card h3,
  body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-card p {
    text-align: left;
  }

  body.landing section.pricing.pricing-figma#pricing .pricing-roles .role-card h3 {
    font-size: 20px;
  }
}

/* Figma 1141:1251 in-hero nav + inset, on `/` and /home-nav.
   Frame 79: pt 24 / px 124 / pb 72 / gap 24. Nav 36px, links gap 36px.
   Shader + family-conversation video are not restyled. */
body.landing .hero {
  padding: 24px max(var(--held-inset), calc((100% - var(--held-content)) / 2)) 72px !important;
  gap: 24px !important;
}

body.landing .site-nav-hero {
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  width: min(100%, var(--held-content)) !important;
  max-width: var(--held-content) !important;
  margin-inline: auto !important;
  flex-shrink: 0;
}

body.landing .hero-layout {
  width: min(100%, var(--held-content)) !important;
  max-width: var(--held-content) !important;
  margin-inline: auto !important;
}

body.landing .site-nav-hero .nav-links {
  gap: 28px !important;
}

body.landing .hero-copy {
  padding-top: 36px !important;
}

@media (max-width: 1050px) {
  body.landing .site-nav-hero .nav-links,
  body.landing .site-nav-paper .nav-links {
    gap: 19.6px !important;
  }

  body.landing .hero {
    padding: 24px var(--held-inset) 56px !important;
    gap: 24px !important;
  }

  body.landing .site-nav-hero {
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 !important;
  }
}

/* Figma 1228:2364 — 390w hero. Header, centered copy, stacked buttons, stats, then the portrait. */
@media (max-width: 680px) {
  body.landing .hero {
    align-items: stretch !important;
    padding: 0 0 40px !important;
    gap: 20px !important;
  }

  body.landing .site-nav-hero {
    width: 100% !important;
    max-width: none !important;
    height: 60px !important;
    min-height: 60px !important;
    margin: 0 !important;
    padding: 16px 20px !important;
  }

  body.landing .site-nav-hero .nav-links a:not(.nav-cta),
  body.landing .site-nav-hero .nav-links button.nav-link,
  body.landing .site-nav-paper .nav-links a:not(.nav-cta),
  body.landing .site-nav-paper .nav-links button.nav-link {
    display: none !important;
  }

  body.landing .hero-layout {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 28px !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 20px !important;
  }

  body.landing .hero-copy {
    display: contents !important;
    padding-top: 0 !important;
  }

  body.landing .hero-copy-main {
    order: 1;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 28px !important;
    width: 100% !important;
  }

  body.landing .hero-copy-text {
    align-items: center !important;
    gap: 16px !important;
    width: 100% !important;
    text-align: center !important;
  }

  body.landing .hero h1 {
    max-width: none !important;
    font-size: 44px !important;
    line-height: 1.05 !important;
    text-align: center !important;
  }

  body.landing .hero-copy-text > p:not(.eyebrow) {
    width: 100% !important;
    max-width: none !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
    text-align: center !important;
  }

  body.landing .hero-cta {
    align-items: stretch !important;
    gap: 12px !important;
    width: 100% !important;
  }

  body.landing .hero-assurances {
    align-items: center !important;
    width: 100% !important;
  }

  body.landing .hero-actions {
    width: 100% !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
  }

  body.landing .hero-actions .button {
    width: 100% !important;
  }

  body.landing .hero-actions .button-lime {
    background: linear-gradient(#cbf580, #bef264) !important;
  }

  body.landing .hero-stats {
    order: 2;
    align-items: flex-start !important;
    gap: 8px !important;
    width: 100% !important;
  }

  body.landing .hero-stats li > img,
  body.landing .hero-stat-imessage {
    width: 22px !important;
    height: 22px !important;
  }

  body.landing .hero-stat-imessage img {
    width: 18px !important;
    height: 18px !important;
  }

  body.landing .hero-stats p {
    font-size: 14px !important;
  }

  body.landing .hero-portrait {
    order: 3;
    display: flex !important;
    flex: none !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    box-sizing: border-box !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    align-self: stretch !important;
    padding: 290px 4px 4px !important;
    border-radius: 16px !important;
    overflow: hidden !important;
  }

  body.landing .hero-portrait img:not(.hero-founders-photo),
  body.landing .hero-portrait video {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border-radius: 16px !important;
    object-fit: cover !important;
  }

  body.landing .hero-founders {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: stretch !important;
    gap: 4px !important;
    width: 100% !important;
    padding: 4px !important;
    border-radius: 12px !important;
  }

  body.landing .hero-portrait .hero-founders-photo {
    width: 100% !important;
    height: auto !important;
    min-width: 0 !important;
    align-self: start !important;
    justify-self: stretch !important;
    aspect-ratio: 456 / 486.4 !important;
    border-radius: 8px !important;
    object-fit: cover !important;
  }

  body.landing .hero-founders-copy {
    height: 0 !important;
    min-height: 100% !important;
    align-self: stretch !important;
    justify-content: space-between !important;
    gap: 24px !important;
    padding: 12px !important;
  }

  body.landing .hero-founders-quote {
    font-size: 14px !important;
    line-height: 1.5 !important;
  }

  body.landing .hero-founders-names,
  body.landing .hero-founders-role {
    font-size: 12px !important;
    line-height: 1.7 !important;
  }
}

/* /home-nav only — Talk pills morph into /example archive cards (Figma 1145:1787). */
@media (min-width: 901px) and (prefers-reduced-motion: no-preference) {
  body.landing.home-nav section.how.how-signal {
    min-height: calc(5 * 100dvh + 52rem) !important;
  }
}

body.landing.home-nav .how-signal-talk-mom,
body.landing.home-nav .how-signal-talk-held {
  z-index: 6;
}

body.landing.home-nav .how-signal-talk-mid {
  z-index: 6;
  overflow: visible;
}

body.landing.home-nav .how-signal-talk-line {
  position: relative;
  z-index: 5;
}

body.landing.home-nav .how-signal-talk-chips {
  position: relative;
  z-index: 4;
  gap: 0;
  min-height: 26px;
  overflow: visible;
}

body.landing.home-nav .how-signal-talk-chip {
  position: relative;
  box-sizing: border-box;
  flex: 0 0 auto;
  min-width: 0;
  overflow: hidden;
  transform-origin: 50% 50%;
}

body.landing.home-nav .how-signal-talk-chip-face {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  position: relative;
  z-index: 1;
}

body.landing.home-nav .how-signal-talk-chip-card {
  --archive-ink: #022c22;
  --archive-forest: #064e3b;
  --archive-label: #65a30d;
  --archive-serif: var(--serif), Georgia, serif;
  --talk-card: 0.48;
  --archive-fs-display: calc(52px * var(--talk-card));
  position: absolute;
  left: 0;
  top: 0;
  z-index: 8;
  box-sizing: border-box;
  width: calc(360px * var(--talk-card));
  border-radius: calc(24px * var(--talk-card));
  overflow: hidden;
  pointer-events: none;
  visibility: hidden;
  filter: none;
  background: #fff;
  box-shadow: 0 6px 14px rgba(2, 44, 34, 0.07);
}

body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card {
  visibility: visible;
}

body.landing.home-nav .how-signal-talk-card-scale {
  display: block;
  width: 100%;
  transform: none;
  filter: none;
}

body.landing.home-nav .how-signal-talk-chip-card .archive-extract,
body.landing.home-nav .how-signal-talk-chip-card .archive-photo,
body.landing.home-nav .how-signal-talk-chip-card .archive-voice-card {
  width: 100%;
  margin: 0;
  box-shadow: none;
}

body.landing.home-nav .how-signal-talk-chip-card[data-talk-card="text"] .archive-extract,
body.landing.home-nav .how-signal-talk-chip-card[data-talk-card="voice"] .archive-voice-card {
  gap: calc(36px * var(--talk-card));
  padding: calc(40px * var(--talk-card));
}

body.landing.home-nav .how-signal-talk-chip-card[data-talk-card="text"] .archive-extract {
  gap: calc(40px * var(--talk-card));
}

body.landing.home-nav .how-signal-talk-chip-card[data-talk-card="text"] .head,
body.landing.home-nav .how-signal-talk-chip-card[data-talk-card="voice"] .head {
  gap: calc(12px * var(--talk-card));
}

@media (min-width: 901px) {
  body.landing.home-nav .how-signal-scene[data-how-signal-scene="3"] .how-signal-art {
    aspect-ratio: 1232 / 560;
  }
}

body.landing.home-nav .how-signal-scene[data-how-signal-scene="3"] .how-signal-svg {
  position: relative;
  z-index: 1;
}

/* Timeline ramp, same sizes as the archive column: eyebrow 12, caption 16, display 52. */
body.landing.home-nav .how-signal-talk-chip-card .label {
  font-size: calc(12px * var(--talk-card));
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1;
  text-transform: uppercase;
}

body.landing.home-nav .how-signal-talk-chip-card .display {
  font-family: var(--archive-serif), Georgia, serif;
  font-size: calc(52px * var(--talk-card));
  font-weight: 400;
  line-height: 1;
}

body.landing.home-nav .how-signal-talk-chip-card .caption {
  font-size: calc(16px * var(--talk-card));
  font-weight: 400;
  line-height: 1.65;
}

body.landing.home-nav .how-signal-talk-chip-card .archive-photo figcaption {
  font-size: calc(14px * var(--talk-card));
  font-weight: 400;
  line-height: 1;
  min-height: calc(36px * var(--talk-card));
  padding: calc(8px * var(--talk-card)) calc(16px * var(--talk-card));
}

body.landing.home-nav .how-signal-talk-chip-card .archive-voice-bar .time {
  font-size: calc(16px * var(--talk-card));
  font-weight: 400;
  line-height: 1.65;
}

/* Chip icons are 16×16; archive art inside the same pill must not inherit that. */
body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card img {
  width: auto;
  height: auto;
  max-width: none;
}

body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card .archive-extract-oil[data-oil="tin"] {
  width: calc(128px * var(--talk-card));
  height: calc(128px * var(--talk-card));
  object-fit: contain;
  filter: none;
}

body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card .archive-photo-frame img,
body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card .archive-photo-frame video {
  display: block;
  width: 100%;
  height: auto;
}

body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card[data-talk-card="videos"] .archive-photo-frame video {
  height: 100%;
  object-fit: cover;
}

body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card .archive-voice-portrait,
body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card .archive-voice-portrait img {
  width: calc(156px * var(--talk-card));
  height: calc(156px * var(--talk-card));
  border-radius: 50%;
  object-fit: cover;
  filter: none;
}

body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card .archive-voice-badge {
  top: calc(-12px * var(--talk-card));
  right: calc(-8px * var(--talk-card));
  width: calc(60px * var(--talk-card));
  height: calc(60px * var(--talk-card));
}

body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card .archive-voice-badge img {
  width: calc(32px * var(--talk-card));
  height: calc(32px * var(--talk-card));
}

body.landing.home-nav .how-signal-talk-chip-card .archive-voice-bar {
  gap: calc(12px * var(--talk-card));
}

body.landing.home-nav .how-signal-talk-chip-card .archive-voice-bar button {
  background: none;
  border: 0;
  padding: 0;
  color: inherit;
}

body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card .archive-voice-bar button {
  display: grid;
  place-items: center;
  width: calc(40px * var(--talk-card));
  height: calc(40px * var(--talk-card));
}

body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card .archive-voice-bar button img {
  width: calc(40px * var(--talk-card));
  height: calc(40px * var(--talk-card));
  max-width: none;
  grid-area: 1 / 1;
  object-fit: contain;
}

body.landing.home-nav .how-signal-talk-chip-card .archive-voice-pause-icon {
  display: block;
  opacity: 0;
}

body.landing.home-nav .how-signal-talk-chip-card[data-talk-card="videos"] video {
  filter: grayscale(1);
}

@media (max-width: 900px) {
  body.landing.home-nav .how-signal-talk-chip-card {
    --archive-fs-display: 28px;
    width: 200px;
  }

  body.landing.home-nav .how-signal-talk-chip-card .label {
    font-size: 10px;
  }

  body.landing.home-nav .how-signal-talk-chip-card .display {
    font-size: 28px;
  }

  body.landing.home-nav .how-signal-talk-chip-card .caption,
  body.landing.home-nav .how-signal-talk-chip-card .archive-voice-bar .time {
    font-size: 13px;
    line-height: 1.35;
  }

  body.landing.home-nav .how-signal-talk-chip-card .archive-photo figcaption {
    font-size: 12px;
    min-height: 0;
    padding: 6px 10px 8px;
  }

  body.landing.home-nav .how-signal-talk-chip-card[data-talk-card="text"] .archive-extract,
  body.landing.home-nav .how-signal-talk-chip-card[data-talk-card="voice"] .archive-voice-card {
    gap: 8px;
    padding: 12px 12px 10px;
  }

  body.landing.home-nav .how-signal-talk-chip-card[data-talk-card="text"] .head,
  body.landing.home-nav .how-signal-talk-chip-card[data-talk-card="voice"] .head {
    gap: 4px;
  }

  body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card .archive-extract-oil[data-oil="tin"] {
    width: 48px;
    height: 48px;
  }

  body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card .archive-voice-portrait,
  body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card .archive-voice-portrait img {
    width: 56px;
    height: 56px;
  }

  body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card .archive-voice-badge {
    top: -4px;
    right: -4px;
    width: 22px;
    height: 22px;
  }

  body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card .archive-voice-badge img {
    width: 12px;
    height: 12px;
  }

  body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card .archive-voice-bar button,
  body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card .archive-voice-bar button img {
    width: 28px;
    height: 28px;
  }

  body.landing.home-nav .how-signal-talk-card-scale {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.landing.home-nav .how-signal-talk-chip-card,
  body.landing.home-nav .how-signal.is-enhanced .how-signal-talk-chip-card {
    visibility: hidden;
  }
}

/* Figma 1213:1931 — testimonials above pricing. Column width matches --held-content. */
body.landing section.testimonials {
  position: relative;
  z-index: 2;
  box-sizing: border-box;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 96px calc(var(--held-gutter) + var(--held-inset)) 124px;
  overflow: visible;
  background: #f3efe5 !important;
  background-image: none !important;
}

body.landing .testimonials-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 52px;
  width: min(100%, var(--held-content));
  margin-inline: auto;
}

body.landing .testimonials-intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  width: 100%;
  text-align: center;
}

body.landing .testimonials-intro .eyebrow {
  margin: 0;
  color: #65a30d;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.48px;
  line-height: 12px;
  text-transform: uppercase;
}

body.landing .testimonials-intro h2 {
  max-width: 810px;
  margin: 8px 0 0;
  color: #022c22;
  font-family: var(--serif);
  font-size: 72px;
  font-weight: 400;
  line-height: 1;
}

body.landing .testimonials-intro > p:last-child {
  max-width: 720px;
  margin: 0;
  color: #404040;
  font-size: 14px;
  line-height: 1.65;
}

body.landing .testimonials-board {
  display: flex;
  align-items: center;
  gap: 24px;
  width: 100%;
}

body.landing .testimonials-col {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}

body.landing .testimonials-card {
  display: flex;
  flex-direction: column;
  gap: 20px;
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 24px;
  break-inside: avoid;
  border-radius: 24px;
  background: #fff;
}

body.landing .testimonials-card blockquote,
body.landing .testimonials-card blockquote p {
  margin: 0;
  color: #022c22;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.6;
}

body.landing .testimonials-rule {
  height: 0;
  border-top: 1px solid rgba(2, 44, 34, 0.12);
}

body.landing .testimonials-byline {
  display: flex;
  align-items: center;
  gap: 12px;
}

body.landing .testimonials-byline p {
  margin: 0;
  color: #022c22;
  font-size: 14px;
  line-height: 1.7;
}

body.landing .testimonials-avatar {
  display: grid;
  flex-shrink: 0;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #e4e0d6;
  color: #022c22;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
}

@media (max-width: 1100px) {
  body.landing section.testimonials {
    padding-top: 72px;
    padding-bottom: 88px;
  }

  body.landing .testimonials-intro h2 {
    font-size: 56px;
  }

  body.landing .testimonials-board {
    flex-wrap: wrap;
    justify-content: center;
  }

  body.landing .testimonials-col {
    flex-basis: calc(50% - 12px);
    max-width: calc(50% - 12px);
  }

  body.landing .testimonials-card {
    gap: 20px;
    padding: 20px;
  }
}

@media (max-width: 680px) {
  body.landing section.testimonials {
    padding-top: 56px;
    padding-bottom: 64px;
  }

  body.landing .testimonials-inner {
    gap: 36px;
  }

  body.landing .testimonials-intro h2 {
    font-size: 40px;
  }

  body.landing .testimonials-board {
    gap: 12px;
  }

  body.landing .testimonials-col {
    flex-basis: 100%;
    max-width: none;
  }

  body.landing .testimonials-card {
    gap: 20px;
    padding: 20px;
  }

  body.landing .testimonials-card blockquote,
  body.landing .testimonials-card blockquote p {
    font-size: 14px;
    text-align: center;
  }

  body.landing .testimonials-rule {
    display: none;
  }

  body.landing .testimonials-byline {
    justify-content: center;
  }
}