/* OneEden · a warm, illustrated home. Copy and the existing colour choreography stay intact. */
:root{--brass:#9e8358;--soft-rule:rgba(115,94,66,.2)}
body{background-image:url('../assets/oneeden/paper-grain.svg');background-blend-mode:multiply}
.light{background-image:none}
.ruled::after{border-color:var(--soft-rule)}
.section-header .ruled{padding-bottom:26px}
.section-header h2{margin-top:28px}
.cta{transition:background .3s,color .3s,box-shadow .3s,transform .3s}
.cta:hover{box-shadow:0 5px 18px #735e4210;transform:translateY(-2px)}

/* The signature stays in clear sky; the original independent tracks remain. */
.hero-lockup{top:18svh;z-index:1}
.hero-wordmark{width:min(660px,76vw)}
.hero-signature{margin-top:18px;text-shadow:0 1px 8px #1e140d44}
.hero-tagline{width:min(600px,84vw);top:calc(100% + 36px - var(--hero-progress)*10px)}
.hero-landscape{opacity:calc((1 - var(--hero-progress))*.76)}
.hero-glow{background:linear-gradient(#1e140d20,#1e140d08 65%,#1e140d28)}
.hero-frontline .hero-person{height:min(66svh,630px)}
.hero-backdrop .hero-person{height:min(47svh,440px)}
.hero-backdrop .hero-portrait{filter:brightness(.94)}
.hero-frontline .hero-track{--hero-loop:2040px;animation-duration:45.3s}
.hero-backdrop .hero-track{--hero-loop:1800px;animation-duration:50s}
@keyframes eden-front-drift{to{transform:translateX(calc(-1*var(--hero-loop)))}}
@keyframes eden-back-drift{to{transform:translateX(calc(-1*var(--hero-loop)))}}

/* Lamplight and complete stanzas give the declaration a calmer reading rhythm. */
.manifesto-reader{padding:110px 0 130px;isolation:isolate}
.manifesto-reader::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 420px 340px at 50% var(--reading-light,420px),#b78a4d18,transparent 78%);mask-image:linear-gradient(transparent,#000 220px,#000 calc(100% - 220px),transparent)}
.story-header{margin-bottom:64px}
.story-header::before{content:'';display:block;width:38px;height:1px;margin:0 auto 32px;background:linear-gradient(90deg,transparent,var(--brass),transparent)}
.creed{gap:48px;padding:0 0 24px}
.creed .stanza{position:relative;max-width:590px;width:100%;margin-inline:auto;opacity:.66;transition:opacity .8s ease}
.creed .stanza.is-read{opacity:.82}
.creed .stanza.is-lit{opacity:1}
.creed .line,.creed .line.is-read,.creed .line.is-lit{opacity:1;transition:none;text-wrap:pretty}
.creed .signoff{padding-top:28px}
.creed .signoff::before{content:'';display:block;width:38px;height:1px;margin:0 auto 28px;background:var(--brass);opacity:.5}

/* Passing objects carry the story between the text sections. */
.collection-header{padding-top:110px;padding-bottom:64px}
.ticker{mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ticker-track{gap:28px;padding-right:28px}
.ticker-card,.ticker-card:nth-child(3n+2),.ticker-card:nth-child(3n){width:210px;height:205px;flex:0 0 210px;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:visible}
.eden-object{display:block;fill:none;stroke:#735e42;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.ticker-card>.eden-object{width:140px;height:140px;flex:none}
.ticker-card .ticker-label{position:static;inset:auto;padding:10px 0 0;background:none;color:var(--ink);font:400 12px/1.4 var(--display);letter-spacing:.12em;text-transform:uppercase}
.collection .art.prose{padding-top:96px;padding-bottom:36px}

/* Each benefit shares one quiet illustrated row. */
.collection .benefits{padding-top:24px;padding-bottom:110px}
.collection .benefits>.subhead{margin-bottom:32px}
.collection .benefits ul{gap:0}
.collection .benefits li{position:relative;min-height:144px;padding:28px 0 28px 116px;border:0;border-bottom:1px solid var(--soft-rule);border-radius:0;background:transparent}
.collection .benefits li .benefit-number{font-size:11px;letter-spacing:.12em;color:#826b49;opacity:1;margin:0 0 10px;padding:0}
.collection .benefits li h4{margin:0 0 10px;font-size:26px;line-height:1.15}
.collection .benefits li>.eden-object{position:absolute;left:2px;top:50%;width:90px;height:90px;transform:translateY(-50%);opacity:.85}

/* A shared meal introduces the people; portrait cards become soft paper keepsakes. */
.circles-header{padding-top:100px}
.shared-table{width:min(1120px,94vw);margin:44px auto 0;overflow:hidden;mask-image:linear-gradient(transparent,#000 15%,#000 86%,transparent),linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-composite:intersect}
.shared-table img{width:100%;height:auto;aspect-ratio:2/1;object-fit:cover}
.circles .team-carousel{padding-top:42px}
.circles .team-track{gap:44px 28px;max-width:1100px}
.circles .team-card{width:232px;height:auto;min-height:420px;flex:0 0 232px;background:transparent;box-shadow:none;isolation:isolate}
.circles .team-card::after,.circles .team-card::before{display:none}
.circle-portrait{height:248px;position:relative;overflow:hidden;background:linear-gradient(#e5d7bd90,#eee5d280);border:1px solid #735e4214;border-radius:120px 120px 3px 3px;box-shadow:inset 0 0 35px #faf5e955}
.tone-sky .circle-portrait{background:linear-gradient(#d2e1ecab,#eee5d255)}
.tone-sage .circle-portrait{background:linear-gradient(#bcc5a894,#eee5d255)}
.circle-portrait>.character-crop{top:22px;--figure-h:340px}
.team-card.is-mirrored .circle-portrait>.character-crop{transform:translateX(-50%) scaleX(-1)}
.circles .team-card .team-role{position:static;height:auto;padding:0;margin:20px 0 12px;background:none;color:var(--ink);font:400 14px/1.3 var(--display);letter-spacing:.12em;text-align:center}
.circle-description{font:400 14px/1.65 var(--body);text-align:center;padding:0 8px;color:var(--ink)}
.circles .team-card .team-stamp{position:static;height:auto;margin-top:18px;padding:0;color:#867456;font:400 9px/1.4 var(--body);letter-spacing:.16em;text-align:center;opacity:.6}
.circles .team-card.in-view:hover{transform:rotate(0) translateY(-4px)}
.circles{padding-bottom:100px}

/* The centred control eases between its two sizes without a jump. */
.floating-nav{transition:bottom .55s cubic-bezier(.22,1,.36,1)}
.floating-nav .menu-toggle{transition:width .55s cubic-bezier(.22,1,.36,1),height .55s cubic-bezier(.22,1,.36,1),border-width .55s cubic-bezier(.22,1,.36,1),box-shadow .55s ease,transform .25s ease}
.floating-nav .nav-social{transition:height .55s cubic-bezier(.22,1,.36,1)}
.floating-nav.is-reading{left:50%;right:auto;bottom:45px;transform:translateX(-50%)}
.floating-nav.is-reading .menu-toggle{width:54px;height:54px;border-width:5px;box-shadow:0 3px 16px #1e140d14}
.floating-nav.is-reading .nav-social{height:54px}
.floating-nav.is-reading .nav-menu{left:50%;right:auto;translate:-50% 0;bottom:72px;width:220px;height:auto;display:flex;flex-direction:column;align-items:stretch;gap:2px;padding:8px;border-radius:20px}
.floating-nav.is-reading .nav-menu a{height:auto;min-height:44px;padding:13px 16px;font-size:14px;line-height:1.3}
.signup-header{padding-top:96px}
.signup-form{margin-top:44px}
.signup-form .field input{border-bottom-color:var(--soft-rule)}
.signup-form .field input:focus{border-bottom-color:#8e7653}
.chip span{border-color:var(--soft-rule);background:#faf7ef55}
.chip:hover span{background:#eae2d3;border-color:#9e8358}
.faq{padding-bottom:96px}

@media(max-width:809px){
 .hero-lockup{top:18svh;padding-inline:6vw}
 .hero-wordmark{width:min(310px,80vw)}
 .hero-signature{margin-top:18px}
 .hero-tagline{top:calc(100% + 30px);width:84vw}
 .hero-frontline .hero-person{width:360px;height:54svh}
 .hero-backdrop .hero-person{width:260px;height:37svh}
 .hero-frontline .hero-track{left:-50px;gap:90px;--hero-loop:1350px;animation-duration:36s}
 .hero-backdrop .hero-track{left:165px;gap:110px;--hero-loop:1110px;animation-duration:37s}
 .hero-backdrop{mask-image:none}
 .hero-meadow img{min-height:160px;object-fit:cover;object-position:center bottom}
 .manifesto-reader{padding:80px 0 90px}
 .story-header{margin-bottom:48px}
 .creed{gap:40px}
 .creed .stanza{max-width:100%}
 .collection-header{padding-top:80px;padding-bottom:36px}
 .ticker-track{gap:20px;padding-right:20px}
 .ticker-card,.ticker-card:nth-child(3n+2),.ticker-card:nth-child(3n){width:165px;height:172px;flex-basis:165px}
 .ticker-card>.eden-object{width:110px;height:110px}
 .collection .art.prose{padding-top:64px;padding-bottom:24px}
 .collection .benefits li{padding:24px 0 24px 82px;min-height:138px}
 .collection .benefits li>.eden-object{width:65px;height:65px;left:0}
 .collection .benefits li h4{font-size:24px}
 .shared-table{width:100%;margin-top:30px;mask-image:linear-gradient(transparent,#000 14%,#000 87%,transparent),linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
 .shared-table img{height:300px;aspect-ratio:auto;object-fit:cover;object-position:50% center}
 .circles .team-carousel{padding:30px 8vw 12px;scroll-padding-left:8vw}
 .circles .team-track{gap:24px;max-width:none;flex-wrap:nowrap}
 .circles .team-card{width:232px;flex-basis:232px;min-height:420px}
 .floating-nav.is-reading{left:50%;right:auto;bottom:max(12px,env(safe-area-inset-bottom))}
 .floating-nav.is-reading .menu-toggle{width:48px;height:48px;border-width:4px}
 .floating-nav.is-reading .nav-social{height:48px}
 .floating-nav.is-reading .nav-menu{bottom:64px}
 .signup-header{padding-top:70px}
}
@media(prefers-reduced-motion:reduce){
 .creed .stanza,.creed .stanza.is-read,.creed .stanza.is-lit{opacity:1;transition:none}
 .floating-nav,.floating-nav .menu-toggle,.floating-nav .nav-social{transition:none}
 .hero-frontline .hero-track,.hero-backdrop .hero-track{animation:none}
}