/* Refined editorial direction: centred measure, full-width colour, quiet motion. */
.editorial{--gutter:max(7vw,calc((100vw - 1080px)/2));--ease:cubic-bezier(.22,1,.36,1)}
.editorial .reviewbar{padding-inline:var(--gutter)}
.editorial header{position:sticky;top:0;z-index:10;padding:24px var(--gutter);transition:padding .35s var(--ease),box-shadow .35s,background .35s;background:#0c2132f5;backdrop-filter:blur(14px)}
.editorial header.is-scrolled{padding-block:15px;box-shadow:0 8px 28px #04111c22}
.editorial .brand img{transition:transform .4s var(--ease)}
.editorial .brand:hover img{transform:scale(1.07)}
.editorial nav a,.editorial .nav-preview{position:relative;padding-block:8px}
.editorial nav a:after,.editorial .nav-preview:after{content:'';position:absolute;left:0;right:0;bottom:2px;height:1px;background:#c3ad7e;transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.editorial nav a:hover:after,.editorial nav a:focus-visible:after,.editorial nav a[aria-current]:after,.editorial .nav-preview:hover:after{transform:scaleX(1)}
.editorial .hero{padding:85px var(--gutter) 95px;grid-template-columns:minmax(0,2.5fr) minmax(0,1fr);gap:60px}
.editorial .hero h1{font-size:clamp(48px,5.25vw,76px);line-height:1.09;letter-spacing:-.04em}
.editorial .hero .dek{font-size:17px;max-width:520px;line-height:1.8}
.editorial .margin-note{padding-left:25px;margin-bottom:3px}
.editorial .margin-note h3{font-size:28px}
.editorial .section{padding:100px var(--gutter)}
.editorial .section-head{gap:50px;margin-bottom:52px;align-items:end}
.editorial .section-head h2{font-size:clamp(34px,3.4vw,49px)}
.editorial .section-head>p{max-width:320px;font-size:15px;line-height:1.8}
.editorial .aspects{gap:0 55px}
.editorial .aspect{padding:30px 0;position:relative;transition:color .25s}
.editorial .aspect:before{content:'';position:absolute;top:-1px;left:0;right:0;height:1px;background:#48716d;transform:scaleX(0);transform-origin:left;transition:transform .7s var(--ease)}
.editorial .aspect.is-visible:before{transform:scaleX(1)}
.editorial .aspect h3{font-size:18px}
.editorial .aspect p{line-height:1.75}
.editorial .kit-row{gap:80px;grid-template-columns:1.2fr 1fr;align-items:center}
.editorial .kit-row h2{font-size:clamp(34px,3.5vw,49px);line-height:1.12}
.editorial .kit-row img{width:100%;max-width:340px;transform:none;box-shadow:0 18px 45px #10253620}
.editorial .image-wrap{position:relative}
.editorial footer{padding:35px var(--gutter);align-items:center;font-size:12px}
.editorial .button{transition:background .25s,color .25s,border-color .25s,box-shadow .25s;position:relative}
.editorial .button span{display:inline-block;transition:transform .35s var(--ease);font-size:20px;line-height:1}
.editorial .button:hover span,.editorial .button:focus-visible span{transform:translate(3px,-3px)}
.editorial .hero .button:hover{background:#d6c39b;color:#102536;border-color:#d6c39b;box-shadow:0 7px 20px #0002}
.editorial .button:active{box-shadow:inset 0 2px 8px #0002}
.editorial .reveal{opacity:1;transform:none}
.editorial.motion-ready .reveal:not(.is-visible){opacity:0;transform:translateY(18px)}
.editorial.motion-ready .reveal{transition:opacity .75s var(--ease),transform .75s var(--ease);transition-delay:var(--delay,0ms)}
.editorial dialog[open]{animation:dialog-in .25s var(--ease)}
@keyframes dialog-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(min-width:1800px){.editorial .hero{padding-block:110px}}
@media(max-width:900px){.editorial .hero{gap:35px;grid-template-columns:2fr 1fr}.editorial .hero h1{font-size:55px}.editorial .kit-row{gap:40px}.editorial footer{flex-wrap:wrap}}
@media(max-width:700px){.editorial{--gutter:8vw}.editorial header{padding-block:17px;flex-wrap:wrap;gap:12px}.editorial header.is-scrolled{padding-block:12px}.editorial .brand{font-size:10px}.editorial nav{width:100%;justify-content:space-between;gap:10px;font-size:13px}.editorial nav>a{display:block}.editorial .hero{grid-template-columns:1fr;padding-block:48px 60px;gap:45px}.editorial .hero h1{font-size:clamp(38px,10.9vw,55px)}.editorial .hero .dek{font-size:16px}.editorial .margin-note{max-width:340px}.editorial .section{padding-block:65px}.editorial .section-head{margin-bottom:35px}.editorial .section-head>p{max-width:none}.editorial .kit-row{grid-template-columns:1fr;gap:35px}.editorial .kit-row img{width:90%;max-width:300px}.editorial footer{align-items:start;font-size:13px}.editorial .reviewbar{gap:14px}.editorial .aspect{padding-block:25px}html{scroll-padding-top:145px}}
@media(prefers-reduced-motion:reduce){.editorial *, .editorial *:before,.editorial *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.editorial.motion-ready .reveal:not(.is-visible){opacity:1;transform:none}}
/* Product presentation: one focal point, with room to inspect the real page. */
.editorial .kit-row{grid-template-columns:1fr;gap:48px;text-align:center;background:#e7ece8}
.editorial .kit-row>div:first-child{max-width:740px;margin-inline:auto}
.editorial .kit-row h2{font-size:clamp(36px,4.1vw,59px)}
.editorial .kit-row p{max-width:570px;margin:26px auto}
.editorial .kit-row .image-wrap{width:100%;padding:0}
.editorial .kit-row img{max-width:420px;width:100%;box-shadow:0 24px 60px #10253622}
@media(max-width:700px){.editorial .kit-row{gap:38px}.editorial .kit-row img{width:100%;max-width:320px}}
/* Narrative pass: the scroll follows the work rather than a list of features. */
.editorial .nav-preview:after{transform:scaleX(1);height:1px;background:#c3ad7e}
.editorial .nav-preview:hover:after{transform:scaleX(.72);transform-origin:right}
.editorial .journey-invite{display:flex;align-items:center;gap:30px;width:max-content;margin-top:30px;font-size:14px;color:#c3ad7e}
.editorial .journey-invite span{transition:transform .3s}.editorial .journey-invite:hover span{transform:translateY(5px)}
.editorial .journey{background:#f4f1e9;padding:110px var(--gutter) 70px;display:grid;grid-template-columns:1fr 1.75fr;gap:85px;align-items:start}
.editorial .journey-index{position:sticky;top:150px}
.editorial .journey-index>p{font:40px/1.15 Serif;letter-spacing:-.02em}
.editorial .journey-index em{color:#52756e}
.editorial .journey-steps{margin-top:40px;display:flex;flex-direction:column;gap:16px}
.editorial .journey-steps a{display:flex;gap:22px;align-items:center;font-size:13px;color:#63716f;transition:color .3s,transform .3s}
.editorial .journey-steps a span{font-size:15px}.editorial .journey-steps a.is-active{color:#102536;transform:translateX(8px);font-weight:600}
.editorial .story-step{min-height:85vh;padding:35px 0 120px;scroll-margin-top:120px;display:flex;flex-direction:column;justify-content:center}
.editorial .story-step h2{font-size:clamp(38px,3.9vw,56px);line-height:1.15;margin-bottom:32px}
.editorial .story-step p{font-size:17px;line-height:1.85;margin-bottom:20px}
.editorial .story-question{border-top:1px solid #99aaa2;margin-top:26px;padding-top:24px;font:25px/1.4 Serif}
.editorial .story-question>span{display:block;font:12px/1.5 Inter;text-transform:uppercase;letter-spacing:.16em;color:#526e66;margin-bottom:12px}
.editorial .read-reveal .word{transition:color .18s;color:#102536}
.editorial.motion-ready .read-reveal .word{color:#82918b}
.editorial.motion-ready .read-reveal .word.lit{color:#102536}
.editorial.motion-ready .reveal:not(.is-visible){transform:translateY(55px);opacity:0;clip-path:inset(0 0 35% 0)}
.editorial.motion-ready .reveal{transition:opacity .9s var(--ease),transform 1.1s var(--ease),clip-path 1.1s var(--ease);clip-path:inset(0)}
.editorial .section#approach{background:#e4e9e4;padding-block:120px}
.editorial .kit-row{background:#f4f1e9;padding-block:130px}
.editorial .kit-row .image-wrap{padding-top:20px}
@media(max-width:700px){.editorial .journey{display:block;padding-block:65px 30px}.editorial .journey-index{position:static}.editorial .journey-index>p{font-size:35px}.editorial .journey-steps{flex-direction:row;flex-wrap:wrap;gap:18px;margin:28px 0}.editorial .journey-steps a{gap:6px}.editorial .journey-steps a.is-active{transform:none}.editorial .story-step{min-height:76svh;padding:55px 0 65px;scroll-margin-top:150px}.editorial .story-step h2{font-size:38px}.editorial .story-step p{font-size:16px}.editorial .section#approach,.editorial .kit-row{padding-block:75px}}
@media(prefers-reduced-motion:reduce){.editorial.motion-ready .reveal:not(.is-visible){opacity:1;transform:none;clip-path:none}.editorial .read-reveal .word{color:#102536!important}}
/* Owner refinement: screen-sized chapters and sample-first product action. */
.editorial .hero,.editorial .section{min-height:100svh}
.editorial .hero{align-content:center}
.editorial .section#approach{display:flex;flex-direction:column;justify-content:center}
.editorial .story-step{min-height:100svh}
.editorial .kit-row{align-content:center}
.editorial .sample-action{display:flex;width:max-content;max-width:100%;margin:38px auto 0;background:transparent;color:#102536;border:0;border-bottom:1px solid #102536;padding:8px 0 12px;box-shadow:none}
.editorial .sample-action:hover,.editorial .sample-action:focus-visible{background:transparent;color:#39645d;border-color:#39645d;box-shadow:none}
.editorial.motion-ready .sample-entrance.reveal{transition:opacity 1.2s var(--ease),transform 1.4s var(--ease),clip-path 1.4s var(--ease);transform:translateY(0) scale(1);transform-origin:center bottom}
.editorial.motion-ready .sample-entrance.reveal:not(.is-visible){opacity:0;transform:translateY(85px) scale(.94);clip-path:inset(0)}
@media(prefers-reduced-motion:reduce){.editorial.motion-ready .sample-entrance.reveal:not(.is-visible){opacity:1;transform:none}}
/* Navigation underline is location feedback, not a permanent decoration. */
.editorial .nav-preview:after,.editorial .nav-preview:hover:after{transform:scaleX(0)}
.editorial .nav-preview[aria-current="location"]:after{transform:scaleX(1)}
.editorial .read-reveal{will-change:transform}
@media(prefers-reduced-motion:reduce){.editorial .read-reveal{transform:none!important;will-change:auto}}
/* Whole story rows arrive from the right. The row keeps its original geometry. */
.editorial .journey{overflow-x:clip}
.editorial .story-content{will-change:transform,opacity}
.editorial .read-reveal{will-change:auto;transform:none}
.editorial header nav a:hover:not([aria-current]):after{transform:scaleX(0)}
.editorial header nav a:hover{color:#c3ad7e}
@media(prefers-reduced-motion:reduce){.editorial .story-content{transform:none!important;opacity:1!important;will-change:auto}}
/* Repeating directional cues, with a rest between movements. */
@keyframes ecl-arrow-diagonal{0%,55%,100%{transform:translate(0,0)}70%{transform:translate(4px,-4px)}85%{transform:translate(0,0)}}
@keyframes ecl-arrow-down{0%,55%,100%{transform:translateY(0)}70%{transform:translateY(5px)}85%{transform:translateY(0)}}
.editorial .button>span{animation:ecl-arrow-diagonal 2.6s ease-in-out infinite}
.editorial .journey-invite>span{animation:ecl-arrow-down 2.6s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.editorial .button>span,.editorial .journey-invite>span{animation:none!important;transform:none!important}}
/* Faster arrow loops, active only while the parent action is hovered. */
.editorial .button>span,.editorial .journey-invite>span{animation:none;transform:none;transition:none}
@media(hover:hover){
 .editorial .button:hover>span{animation:ecl-arrow-diagonal 1.2s ease-in-out infinite}
 .editorial .journey-invite:hover>span{animation:ecl-arrow-down 1.2s ease-in-out infinite}
}
@media(prefers-reduced-motion:reduce){.editorial .button:hover>span,.editorial .journey-invite:hover>span{animation:none!important;transform:none!important}}
/* Let each scroll-driven target settle rather than tracking wheel steps rigidly. */
.editorial .story-content{transition:transform 850ms cubic-bezier(.16,1,.3,1)}
@media(prefers-reduced-motion:reduce){.editorial .story-content{transition:none!important}}
/* Animate actual rendered lines; remeasure after fonts load and viewport changes. */
.editorial .story-content{transform:none!important;transition:none;will-change:auto}
.editorial .story-line{display:block;will-change:transform;transition:transform 850ms cubic-bezier(.16,1,.3,1)}
.editorial .story-question>.question-answer{font:25px/1.4 Serif;letter-spacing:normal;text-transform:none;color:#102536;margin:0}
@media(prefers-reduced-motion:reduce){.editorial .story-line{transform:none!important;transition:none!important;will-change:auto}}
/* Adoption: opposing text entrances, an independent label, rule and question. */
.editorial #adoption .story-line{transition:transform 850ms cubic-bezier(.16,1,.3,1),opacity 600ms ease-out}
.editorial #adoption .story-question{border-top:0;position:relative}
.editorial #adoption .story-question:before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:#99aaa2;transform:scaleX(var(--rule-progress,1));transform-origin:left;transition:transform 700ms cubic-bezier(.16,1,.3,1)}
@media(prefers-reduced-motion:reduce){.editorial #adoption .story-line{opacity:1!important}.editorial #adoption .story-question:before{transform:none!important;transition:none!important}}
/* Six aspects: independent introduction, followed by numerical entrances. */
.editorial #approach .aspect-intro-part{transition:opacity 750ms ease,transform 950ms cubic-bezier(.16,1,.3,1);transition-delay:var(--intro-delay,0ms)}
.editorial #approach.sequence-ready:not(.intro-entered) .aspect-intro-part{opacity:0;transform:translateY(32px)}
.editorial #approach.sequence-ready:not(.intro-entered) .section-head>p{transform:translateX(45px)}
.editorial #approach .aspect-sequence-item{transition:opacity 800ms ease,transform 1s cubic-bezier(.16,1,.3,1);transition-delay:var(--item-delay,0ms)}
.editorial #approach.sequence-ready:not(.items-entered) .aspect-sequence-item{opacity:0;transform:translateY(42px)}
.editorial #approach .aspect-sequence-item:before{transition-delay:var(--item-delay,0ms)}
.editorial #approach.items-entered .aspect-sequence-item:before{transform:scaleX(1)}
@media(prefers-reduced-motion:reduce){.editorial #approach .aspect-intro-part,.editorial #approach .aspect-sequence-item{opacity:1!important;transform:none!important;transition:none!important}}
/* Consistent quiet entrances across all three stories. Only delivery's title travels. */
.editorial .story-step .story-line{transition:transform 850ms cubic-bezier(.16,1,.3,1),opacity 650ms ease-out}
.editorial .story-step .story-question{border-top:0;position:relative}
.editorial .story-step .story-question:before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:#99aaa2;transform:scaleX(var(--rule-progress,1));transform-origin:left;transition:transform 700ms cubic-bezier(.16,1,.3,1)}
@media(prefers-reduced-motion:reduce){.editorial .story-step .story-line{opacity:1!important;transform:none!important;transition:none!important}.editorial .story-step .story-question:before{transform:none!important;transition:none!important}}
/* A longer, single-column sequence. Each row reveals at its own scroll position. */
.editorial #approach .aspects{grid-template-columns:1fr;gap:0}
.editorial #approach .aspect{min-height:40svh;align-items:center;gap:45px;padding:65px 0;border-top:0}
.editorial #approach .aspect .number{font-size:48px;min-width:70px}
.editorial #approach .aspect h3{font-size:30px;font-family:Serif;font-weight:400}
.editorial #approach .aspect p{font-size:18px;max-width:620px;margin-top:15px}
.editorial #approach.sequence-ready .aspect-sequence-item.item-entered{opacity:1;transform:none}
.editorial #approach .aspect-sequence-item:before{transform:scaleX(0);transform-origin:left;transition:transform 1.25s cubic-bezier(.16,1,.3,1)}
.editorial #approach .aspect-sequence-item.item-entered:before{transform:scaleX(1)}
.editorial .story-step .story-question:before{transform-origin:left;transition:transform 1s cubic-bezier(.16,1,.3,1)}
@media(max-width:700px){.editorial #approach .aspect{min-height:38svh;gap:22px;padding:50px 0}.editorial #approach .aspect .number{font-size:34px;min-width:42px}.editorial #approach .aspect h3{font-size:27px}.editorial #approach .aspect p{font-size:16px}}
@media(prefers-reduced-motion:reduce){.editorial #approach .aspect-sequence-item:before,.editorial .story-step .story-question:before{transform:scaleX(1)!important;transition:none!important}}
/* Keep the original compact row proportions, arranged vertically. */
.editorial #approach .aspect{min-height:0;align-items:flex-start;gap:24px;padding:30px 0}
.editorial #approach .aspect .number{font-size:25px;min-width:30px}
.editorial #approach .aspect h3{font-family:Inter,sans-serif;font-size:18px;font-weight:600}
.editorial #approach .aspect p{font-size:15px;line-height:1.75;margin-top:8px;max-width:650px}
@media(max-width:700px){.editorial #approach .aspect{min-height:0;padding:25px 0;gap:18px}.editorial #approach .aspect .number{font-size:25px;min-width:30px}.editorial #approach .aspect h3{font-size:18px}.editorial #approach .aspect p{font-size:15px}}
/* Additional native scroll runway lets each story stay readable before release. */
.editorial .story-step.can-pin{display:block;min-height:170svh;padding-top:35px;padding-bottom:90px}
.editorial .story-step.can-pin .story-content{position:sticky;top:var(--pin-top,130px)}
@media(prefers-reduced-motion:reduce){.editorial .story-step.can-pin{min-height:100svh}.editorial .story-step.can-pin .story-content{position:static}}
/* Contain off-position reveal text without introducing horizontal scrolling. */
.editorial .section{overflow-x:clip}
/* Half the added hold, with a separate visual breath between chapters. */
.editorial .story-step.can-pin{min-height:135svh}
.editorial .story-step{margin-bottom:clamp(70px,12svh,130px)}
@media(prefers-reduced-motion:reduce){.editorial .story-step.can-pin{min-height:100svh}}
/* Triple the chapter gap; complete Result's reset at the one-third colour boundary. */
.editorial .story-step{margin-bottom:clamp(210px,36svh,390px)}
.editorial #result .return-complete .story-line{transition:none}
/* Clear the left index exactly at the Six aspects boundary, including its offset. */
.editorial .journey-steps.index-reset a{transform:none;transition:none;font-weight:400;color:#63716f}
/* Four concise anchors in the final navigation. */
@media(max-width:700px){.editorial nav{gap:8px;font-size:12px}}
/* Keep the product and its action together at the end of the page. */
.editorial footer{padding-block:12px;gap:12px}
.editorial .section.kit-row{min-height:calc(100svh - var(--kit-header-height,80px) - var(--kit-footer-height,45px));padding-block:28px 20px;gap:20px;align-content:center}
.editorial .kit-row .eyebrow{margin-bottom:14px}
.editorial .kit-row p{margin:16px auto 0}
.editorial .kit-row .image-wrap{padding:0}
.editorial .kit-row img{width:auto;height:auto;max-width:100%;max-height:var(--kit-image-height,380px)}
.editorial .sample-action{margin-top:18px;padding-bottom:8px}
@media(max-width:700px){.editorial footer{gap:5px;padding-block:12px}.editorial .section.kit-row{padding-block:24px 18px;gap:18px}}

/* Keep the journey index and story aligned at entry and while pinned. */
@media(min-width:701px){
 .editorial .journey-index{top:var(--journey-pin-top,130px)}
 .editorial .story-step,.editorial .story-step.can-pin{padding-top:0}
}
