:root{
  /* Approved Option C / Soft Neutral Cohesion. */
  --background:#FBF7F2;
  --section-alt:#F6F0F7;
  --ink:#2F2438;
  --plum:#5A0B6E;
  --supporting-accent:#8A6A93;
  --muted:#6E5D70;
  --line:#E8E0EA;
  --white:#FFFFFF;
  --purple:var(--plum);
  --lavender:var(--section-alt);
  --space:clamp(24px,5vw,88px);
  font-family:"Avenir Next",Avenir,"Segoe UI",sans-serif;
  color:var(--ink);
  background:var(--background);
  font-synthesis:none
}
*{
  box-sizing:border-box
}
html{
  scroll-behavior:smooth;
  scroll-padding-top:110px
}
body{
  margin:0
}
a{
  color:inherit;
  text-decoration:none
}
button,input{
  font:inherit
}
button,a{
  -webkit-tap-highlight-color:transparent
}
button{
  cursor:pointer
}
button:focus-visible,a:focus-visible,summary:focus-visible{
  outline:3px solid var(--purple);
  outline-offset:6px
}
img{
  max-width:100%;
  height:auto;
  display:block
}
h1,h2,h3,p,figure{
  margin:0
}
p{
  font-size:1.125rem;
  line-height:1.65
}
h1,h2{
  font-weight:600;
  letter-spacing:-.055em;
  line-height:1.07
}
h1{
  font-size:clamp(3.25rem,5.1vw,5.6rem)
}
h2{
  font-size:clamp(2.4rem,4vw,4.4rem)
}
h3{
  font-weight:600;
  letter-spacing:-.025em
}
::selection{
  background:var(--lavender)
}
.wrap{
  max-width:1440px;
  margin:auto;
  padding-left:var(--space);
  padding-right:var(--space)
}
.section{
  padding-top:clamp(72px,8vw,128px);
  padding-bottom:clamp(72px,8vw,128px)
}
.eyebrow{
  display:block;
  font-size:.8rem;
  line-height:1.5;
  letter-spacing:.15em;
  text-transform:uppercase;
  font-weight:700;
  color:var(--plum)
}
.button{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  min-height:54px;
  padding:15px 27px;
  background:var(--plum);
  color:var(--white);
  border:1px solid var(--plum);
  border-radius:999px;
  font-weight:600;
  font-size:1rem;
  transition:background .2s,transform .2s;
  text-align:center;
  line-height:1.4
}
.button:hover{
  background:var(--ink);
  transform:translateY(-2px)
}
.button-small{
  min-height:46px;
  padding:12px 22px;
  font-size:.9rem
}
.text-link{
  display:inline-block;
  font-size:1rem;
  font-weight:600;
  color:var(--plum);
  border-bottom:1px solid var(--purple);
  padding:9px 0
}
.skip-link{
  position:fixed;
  top:-100px;
  left:20px;
  z-index:100;
  background:var(--background);
  padding:15px
}
.skip-link:focus{
  top:12px
}
.site-header{
  position:relative;
  z-index:10;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px var(--space);
  min-height:94px;
  background:var(--background);
  gap:32px;
  border-bottom:1px solid var(--line)
}
.brand{
  display:block;
  position:relative;
  width:218px;
  height:56px;
  flex-shrink:0;
  overflow:hidden
}
.brand img{
  position:absolute;
  width:246px;
  max-width:none;
  height:246px;
  left:-16px;
  top:-94px;
  object-fit:contain
}
.site-header nav{
  display:flex;
  align-items:center;
  gap:32px;
  font-size:.9rem;
  font-weight:500
}
.site-header nav>a:not(.button){
  padding-block:15px
}
.site-header nav>a:not(.button):hover{
  color:var(--purple)
}
.menu-toggle{
  display:none
}
.hero{
  position:relative;
  display:grid;
  grid-template-columns:44% 56%;
  min-height:660px;
  background:var(--section-alt)
}
.hero-photo{
  grid-column:2;
  grid-row:1;
  min-height:660px;
  overflow:hidden
}
.hero-photo>img{
  width:100%;
  height:100%;
  object-fit:cover
}
.hero-copy{
  grid-column:1;
  grid-row:1;
  align-self:center;
  padding:70px 8% 76px max(var(--space),calc((100vw - 1440px)/2 + var(--space)))
}
.hero-copy h1{
  margin:22px 0 25px
}
.hero-copy>p{
  font-size:1.125rem;
  max-width:390px;
  color:var(--muted)
}
.hero-copy .button{
  margin-top:32px
}
.hero-note{
  display:block;
  margin-top:18px;
  font-size:.85rem;
  color:var(--plum)
}
.hero-index{
  position:absolute;
  bottom:25px;
  right:var(--space);
  color:var(--white);
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:.7rem
}
.hero-pending{
  background:var(--lavender);
  display:grid;
  place-content:center;
  color:var(--plum);
  text-align:center
}
.hero-pending p{
  font-size:1.25rem
}
.hero-pending span{
  font-size:1rem
}
.intro{
  text-align:center
}
.intro h2{
  margin:22px 0
}
.intro h2 span{
  color:var(--plum)
}
.intro-description{
  max-width:690px;
  margin:auto;
  color:var(--muted)
}
.steps{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:48px;
  list-style:none;
  padding:0;
  margin:64px 0 0;
  text-align:left
}
.steps li{
  border-top:1px solid var(--line);
  padding-top:25px
}
.step-number{
  font-size:.85rem;
  color:var(--purple)
}
.steps h3{
  font-size:2.3rem;
  margin:14px 0 10px
}
.steps p{
  max-width:290px;
  color:var(--muted);
  font-size:1.05rem
}
.product{
  padding-inline:var(--space);
  background:var(--section-alt);
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:clamp(40px,7vw,115px);
  align-items:center
}
.product-photo img{
  width:100%;
  aspect-ratio:1/1.06;
  object-fit:cover;
  border-radius:4px
}
.product-photo figcaption{
  font-size:.75rem;
  color:var(--muted);
  margin-top:12px
}
.product-copy{
  max-width:470px
}
.product-copy h2{
  margin:22px 0
}
.product-copy>p:not(.eyebrow){
  color:var(--muted)
}
.editorial-list{
  list-style:none;
  padding:0;
  margin:30px 0 15px
}
.editorial-list li{
  display:flex;
  gap:20px;
  padding:20px 0;
  border-top:1px solid var(--line)
}
.editorial-list li>span{
  display:grid;
  place-items:center;
  flex:0 0 52px;
  width:52px;
  height:52px;
  border-radius:50%;
  background:var(--lavender);
  font-size:1rem;
  line-height:1;
  color:var(--plum)
}
.editorial-list h3{
  font-size:1.1rem;
  margin-bottom:4px
}
.editorial-list p{
  font-size:1rem;
  color:var(--muted)
}
.hero{
  display:grid;
  grid-template-columns:66% 34%;
  min-height:min(780px,70vw);
  height:min(100svh,70vw);
  aspect-ratio:auto;
  max-height:none;
  background:var(--background)
}
.hero-photo{
  grid-column:1;
  min-height:0;
  grid-row:1
}
.hero-photo>img{
  height:100%;
  object-position:center
}
.hero-copy{
  grid-column:2;
  grid-row:1;
  z-index:1;
  padding:60px clamp(24px,3vw,48px) 65px clamp(24px,2.5vw,40px);
  align-self:center
}
.hero-copy h1{
  font-size:clamp(3.25rem,4.8vw,5.5rem)
}
.hero-copy .eyebrow{
  font-size:.72rem;
  letter-spacing:.12em
}
.hero-index{
  left:var(--space);
  right:auto;
  background:rgba(47,36,56,.55);
  padding:8px 12px;
  border-radius:3px
}
@media(max-width:1100px){
  .site-header nav{
    gap:20px
  }
  .hero{
    min-height:70vw;
    aspect-ratio:auto;
    grid-template-columns:62% 38%
  }
  .hero-copy{
    padding:44px 24px
  }
  .hero-copy h1{
    font-size:clamp(2.5rem,4.2vw,3rem)
  }
  .hero-photo>img{
    object-fit:cover;
    object-position:center
  }
  .product{
    gap:40px
  }
  .product-copy h2{
    font-size:3rem
  }
}
@media(max-width:900px){
  .hero{
    display:flex;
    flex-direction:column;
    height:auto;
    max-height:none;
    min-height:0
  }
  .hero-photo{
    order:0;
    height:auto;
    aspect-ratio:4/3
  }
  .hero-photo>img{
    height:100%;
    object-fit:cover;
    object-position:24% center
  }
  .hero-copy{
    order:1;
    padding:28px var(--space) 44px;
    align-self:stretch;
    background:inherit
  }
  .hero-copy h1{
    font-size:clamp(3.2rem,7vw,4.5rem)
  }
  .hero-copy>p{
    max-width:600px
  }
  .hero-index{
    display:none
  }
}
@media(max-width:760px){
  .site-header{
    min-height:80px;
    padding-block:12px;
    gap:16px
  }
  .brand{
    width:190px;
    height:50px
  }
  .brand img{
    width:216px;
    height:216px;
    left:-14px;
    top:-83px
  }
  .menu-toggle{
    display:flex;
    gap:12px;
    align-items:center;
    background:var(--background);
    border:1px solid var(--line);
    padding:10px 15px;
    border-radius:30px;
    min-height:46px;
    font-size:.9rem;
    color:var(--plum)
  }
  .site-header nav{
    display:none;
    position:absolute;
    left:0;
    right:0;
    top:100%;
    padding:24px var(--space);
    background:var(--background);
    border-bottom:1px solid var(--line);
    align-items:stretch;
    flex-direction:column;
    gap:7px
  }
  .site-header nav.open{
    display:flex
  }
  .steps{
    gap:24px
  }
  .steps h3{
    font-size:1.9rem
  }
  .steps p{
    font-size:1rem
  }
  .product{
    grid-template-columns:1fr;
    gap:36px
  }
  .product-copy{
    max-width:none
  }
  .product-photo img{
    aspect-ratio:4/3
  }
  .product-copy h2{
    font-size:2.75rem
  }
}
@media(max-width:480px){
  .hero-photo{
    aspect-ratio:1.28;
  }
  .steps{
    grid-template-columns:1fr;
    gap:30px;
    margin-top:44px
  }
  .steps li{
    display:grid;
    grid-template-columns:42px 1fr;
    column-gap:10px
  }
  .step-number{
    grid-row:1/3;
    align-self:start;
    padding-top:7px
  }
  .steps h3{
    margin:0 0 8px
  }
  .steps p{
    grid-column:2;
    max-width:none
  }
  .site-header{
    padding-inline:20px
  }
  .brand{
    width:172px
  }
  .brand img{
    width:196px;
    height:196px;
    top:-75px;
    left:-13px
  }
}
.section-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:48px;
  margin-bottom:55px
}
.section-heading h2{
  margin-top:22px
}
.section-heading>p{
  color:var(--muted);
  max-width:360px
}
.everyday-layout{
  display:grid;
  grid-template-columns:.86fr 1.14fr;
  align-items:center;
  gap:80px
}
.use-list article{
  display:flex;
  gap:24px;
  padding:32px 0;
  border-top:1px solid var(--line)
}
.use-list article:last-child{
  border-bottom:1px solid var(--line)
}
.use-icon{
  color:var(--plum);
  flex:0 0 32px;
  padding-top:4px
}
.use-icon svg{
  width:32px;
  height:32px
}
.use-list h3{
  font-size:1.6rem;
  margin-bottom:10px
}
.use-list p{
  color:var(--muted);
  font-size:1.05rem
}
.everyday-photo img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  border-radius:4px
}
.everyday-photo figcaption{
  margin-top:18px;
  font-size:1.05rem;
  color:var(--plum)
}
.everyday-photo figcaption span{
  display:block;
  font-size:.75rem;
  color:var(--muted);
  margin-top:6px
}
.plans{
  background:var(--section-alt)
}
.plan-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px
}
.plan{
  padding:42px 44px;
  border-radius:6px
}
.free-plan{
  background:var(--background);
  border:1px solid var(--line)
}
.pro-plan{
  background:var(--plum);
  color:var(--white)
}
.plan h3{
  font-size:1.9rem;
  line-height:1.25;
  margin-top:24px
}
.plan .price{
  font-size:3.4rem;
  line-height:1.2;
  letter-spacing:-.055em;
  font-weight:600;
  margin:24px 0 18px
}
.price-period{
  font-weight:400;
  font-size:1.125rem;
  letter-spacing:0
}
.plan-top{
  display:flex;
  gap:20px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap
}
.pro-plan .eyebrow{
  color:var(--white)
}
.pro-badge{
  border:1px solid var(--line);
  border-radius:30px;
  padding:6px 12px;
  color:var(--lavender);
  font-size:.75rem
}
.check-list{
  padding:0;
  list-style:none;
  margin:26px 0 32px;
  display:grid;
  gap:13px;
  font-size:1rem
}
.check-list li{
  position:relative;
  padding-left:26px;
  line-height:1.5
}
.check-list li:before{
  content:"✓";
  position:absolute;
  left:0;
  color:var(--purple)
}
.pro-plan .check-list li:before{
  color:var(--lavender)
}
.billing{
  display:inline-flex;
  border:1px solid var(--line);
  border-radius:30px;
  padding:4px;
  gap:4px
}
.billing button{
  min-height:40px;
  padding:8px 19px;
  border:0;
  border-radius:24px;
  background:transparent;
  color:var(--white);
  font-size:.9rem
}
.billing button[aria-pressed=true]{
  background:var(--lavender);
  color:var(--plum)
}
.plan-price-note{
  font-size:.8rem;
  line-height:1.5;
  margin-top:12px;
  color:var(--lavender);
  min-height:24px
}
.button-outline{
  background:transparent;
  color:var(--plum)
}
.button-outline:hover{
  color:var(--white)
}
.button-white{
  background:var(--white);
  color:var(--plum);
  border-color:var(--white)
}
.button-white:hover{
  background:var(--lavender)
}
.free-plan{
  display:flex;
  align-items:flex-start;
  flex-direction:column
}
.free-plan .button{
  margin-top:auto
}
.plan-fineprint{
  font-size:.8rem;
  line-height:1.6;
  max-width:720px;
  color:var(--muted);
  margin:28px auto 0;
  text-align:center
}
.trust{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12%
}
.trust h2{
  margin-top:22px
}
.trust-copy{
  align-self:center
}
.trust-copy p{
  color:var(--muted);
  margin-bottom:18px
}
.download{
  background:var(--ink);
  color:var(--white);
  padding:76px var(--space);
  text-align:center
}
.download-inner{
  max-width:700px;
  margin:auto
}
.app-icon{
  width:72px;
  height:72px;
  object-fit:contain;
  border-radius:16px;
  margin:0 auto 24px
}
.download .eyebrow{
  color:var(--lavender)
}
.download h2{
  font-size:clamp(3rem,5vw,5rem);
  margin:18px 0 20px
}
.download p:not(.eyebrow){
  color:var(--lavender)
}
.app-store-button{
  display:inline-flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  min-height:65px;
  padding:10px 30px;
  margin-top:28px;
  border:1px solid white;
  border-radius:12px;
  background:var(--background);
  color:var(--ink);
  line-height:1.05;
  cursor:default
}
.app-store-button span{
  font-size:.8rem
}
.app-store-button strong{
  font-size:1.6rem;
  font-weight:600;
  letter-spacing:-.02em
}
.download .launch-note{
  font-size:.8rem;
  margin-top:15px
}
.site-footer{
  padding:42px var(--space) 28px
}
.footer-top{
  display:flex;
  align-items:center;
  gap:36px;
  justify-content:space-between
}
.footer-top p{
  font-size:1rem;
  color:var(--plum)
}
.footer-top nav{
  display:flex;
  gap:32px;
  font-size:.9rem
}
.footer-top nav a{
  padding-block:14px
}
.footer-top nav a:hover{
  color:var(--purple)
}
.footer-bottom{
  border-top:1px solid var(--line);
  margin-top:28px;
  padding-top:24px;
  display:flex;
  gap:25px;
  justify-content:space-between;
  font-size:.75rem;
  color:var(--muted)
}
.hero-copy,.product-copy,.use-list,.plan,.trust-copy{
  min-width:0
}
.hero-copy h1{
  overflow-wrap:normal
}
.legal-page{
  max-width:850px;
  padding-top:75px
}
.legal-page h1{
  font-size:clamp(2.8rem,5vw,4.3rem);
  margin:20px 0
}
.legal-page .lead{
  font-size:1.3rem;
  color:var(--muted);
  margin-bottom:45px
}
.legal-page article{
  margin:32px 0
}
.legal-page h2{
  font-size:1.55rem;
  letter-spacing:-.025em;
  margin-bottom:14px
}
.legal-page article p{
  font-size:1rem;
  color:var(--muted)
}
.legal-page a:not(.button){
  color:var(--plum);
  text-decoration:underline;
  text-underline-offset:4px
}
.legal-page details{
  border-top:1px solid var(--line);
  padding:22px 0
}
.legal-page summary{
  font-size:1.2rem;
  cursor:pointer;
  font-weight:600;
  line-height:1.5;
  min-height:36px
}
.legal-page details p{
  padding-top:16px;
  color:var(--muted);
  font-size:1rem
}
.support-contact{
  margin-top:44px;
  border-top:1px solid var(--line);
  padding-top:36px
}
.support-contact .button{
  margin-top:22px
}
.contact-fallback{
  margin-top:16px;
  font-size:1rem;
  color:var(--muted);
  overflow-wrap:anywhere
}
.contact-fallback span{
  -webkit-user-select:text;
  user-select:text
}
@media(max-width:1100px){
  .everyday-layout{
    gap:40px
  }
  .plan{
    padding:32px
  }
  .section-heading{
    gap:30px
  }
  .footer-top{
    gap:24px
  }
}
@media(max-width:760px){
  .section-heading{
    display:block;
    margin-bottom:36px
  }
  .section-heading>p{
    margin-top:24px
  }
  .desktop-break{
    display:none
  }
  .everyday-layout{
    grid-template-columns:1fr;
    gap:38px
  }
  .everyday-photo img{
    aspect-ratio:4/3
  }
  .plan-grid{
    grid-template-columns:1fr;
    gap:24px
  }
  .plan{
    padding:32px
  }
  .trust{
    grid-template-columns:1fr;
    gap:32px
  }
  .footer-top{
    flex-wrap:wrap;
    justify-content:flex-start;
    gap:20px 32px
  }
  .footer-top nav{
    margin-left:auto
  }
  .footer-top p{
    width:100%;
    order:3
  }
  .footer-bottom{
    flex-direction:column;
    gap:12px
  }
  .download{
    padding-block:64px
  }
  .legal-page{
    padding-top:50px
  }
}
@media(max-width:480px){
  .use-list article{
    gap:18px
  }
  .plan{
    padding:28px 24px
  }
  .plan h3{
    font-size:1.75rem
  }
  .pro-badge{
    font-size:.7rem
  }
  .footer-top nav{
    margin:0
  }
  .footer-top p{
    order:0
  }
  .footer-top{
    flex-direction:column;
    align-items:flex-start
  }
  .plan-top{
    gap:12px
  }
  .app-store-button{
    min-height:65px
  }
}
.brand img{
  width:113%;
  height:auto;
  left:-6.5%;
  top:50%;
  transform:translateY(-50%)
}
@media(max-width:760px){
  .site-header{
    flex-wrap:wrap
  }
  .site-header .brand{
    flex-shrink:1;
    min-width:120px;
    flex-basis:44%;
    width:auto
  }
  .menu-toggle{
    margin-left:auto
  }
  .site-header nav{
    width:100%
  }
}
@media(prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto
  }
  *,*::before,*::after{
    transition:none!important;
    animation:none!important
  }
}

@media (max-width:350px) {
  .hero-copy h1 { font-size:2.5rem; }
}

/* Everyday uses: image-led editorial triptych. */
.everyday.wrap{max-width:1600px;padding-inline:32px}
.use-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:32px;row-gap:0;align-items:stretch}
.use-card{min-width:0;display:grid;grid-template-rows:subgrid;grid-row:span 4}
.use-image{aspect-ratio:1.1;overflow:hidden;border-radius:24px;background:var(--lavender)}
.use-image img{width:100%;height:100%;object-fit:cover}
.use-go{object-position:50% center}
.use-dinner{object-position:52% center}
.use-market{object-position:38% center}
.use-card h3{font-size:clamp(1.5rem,2.1vw,2rem);line-height:1.2;margin:24px 0 12px;color:var(--ink)}
.use-card p{font-size:1.0625rem;line-height:1.65;max-width:38ch;color:var(--muted)}
.use-card .use-context{display:flex;align-items:flex-start;justify-content:flex-start;gap:10px;margin-top:24px;max-width:none;text-align:left;font-size:.9375rem;line-height:1.5;color:var(--plum)}
.use-context svg{width:22px;height:22px;flex:0 0 22px}
@media(max-width:1000px){.use-cards{column-gap:24px}.everyday.wrap{padding-inline:24px}.use-image{border-radius:20px}}
@media(max-width:700px){.use-cards{grid-template-columns:1fr;row-gap:40px}.use-card{display:block;grid-row:auto}.use-card h3{font-size:1.75rem;margin-top:20px}.use-card p{max-width:none}.use-image{aspect-ratio:1.1}.everyday .section-heading{margin-bottom:36px}}

/* Licensed editorial face; the UI and supporting text remain sans-serif. */
.hero h1,.intro h2,.product h2,.everyday h2,.plans h2,.trust h2,.download h2 {
  font-family:"Canela Deck Web";
  font-weight:400;
  font-style:normal;
  font-synthesis:none;
  letter-spacing:-.035em;
  line-height:1.04;
}
/* Master hierarchy: 52px display / 16px body / 14px feature copy,
   scaled together for desktop and bounded for legibility on small screens. */
.hero,.product {
  --editorial-body:clamp(1rem,1.7vw,1.5rem);
  --editorial-detail:clamp(.875rem,1.48vw,1.25rem);
  --editorial-kicker:clamp(.625rem,.95vw,.875rem);
}
.hero {
  height:auto;
  min-height:0;
  aspect-ratio:6688/3764;
  grid-template-columns:67.5% 32.5%;
}
.hero-photo { grid-column:1/-1; }
.hero-photo>img { object-fit:contain; object-position:center; }
.hero-copy { padding:40px 16px; background:var(--background); }
.hero-copy h1 {
  font-size:clamp(3rem,5.3vw,5.25rem);
  margin:clamp(16px,1.8vw,26px) 0 clamp(24px,2.1vw,30px);
  color:var(--ink);
}
.hero-copy>p {
  font-size:var(--editorial-body);
  line-height:1.4;
  max-width:none;
  color:var(--muted);
}
.hero-copy .eyebrow,.product-copy>.eyebrow {
  font-size:var(--editorial-kicker);
  font-weight:600;
  line-height:1.4;
  letter-spacing:.18em;
  color:var(--plum);
}
.hero-copy .button {
  width:100%;
  min-height:clamp(46px,5.4vw,72px);
  padding:12px 22px;
  margin-top:clamp(24px,2.5vw,36px);
  font-size:var(--editorial-body);
  font-weight:400;
  line-height:1.25;
  border-radius:999px;
  background:var(--plum);
  color:var(--white);
  border-color:var(--plum);
}
.hero-copy .button:hover { background:var(--ink); border-color:var(--ink); }
.hero-copy .hero-note {
  margin-top:clamp(20px,2.3vw,32px);
  font-size:var(--editorial-body);
  line-height:1.4;
  color:var(--muted);
}
.product { padding-block:clamp(32px,3.4vw,56px); align-items:start; }
.product-copy { padding-top:clamp(12px,1.8vw,24px); }
.product-copy h2 {
  font-size:clamp(3rem,5.2vw,4.75rem);
  margin:16px 0 24px;
  color:var(--ink);
}
.product-copy>p:not(.eyebrow) { font-size:var(--editorial-body); line-height:1.4; color:var(--muted); }
.editorial-list { margin:clamp(24px,3vw,42px) 0 16px; }
.editorial-list li { gap:clamp(20px,2.5vw,32px); padding:18px 0; border-color:var(--line); }
.editorial-list li:first-child { border-top:0; padding-top:0; }
.editorial-list li>span {
  --number-size:clamp(48px,5vw,68px);
  width:var(--number-size);
  height:var(--number-size);
  flex-basis:var(--number-size);
  font-size:var(--editorial-body);
  font-weight:400;
  background:var(--line);
  color:var(--plum);
}
.editorial-list h3 { font-size:var(--editorial-body); font-weight:400; line-height:1.3; letter-spacing:-.015em; margin-bottom:4px; color:var(--ink); }
.editorial-list p { font-size:var(--editorial-detail); line-height:1.4; color:var(--muted); }
.product-copy>.text-link {
  display:inline-flex;
  align-items:center;
  gap:20px;
  font-size:clamp(1.125rem,2.1vw,1.75rem);
  font-weight:500;
  line-height:1.3;
  padding:8px 0;
  border-color:var(--plum);
  color:var(--plum);
}
.product-copy>.text-link::after { content:"\2192"; }
.step-number { color:var(--supporting-accent); }
@media(max-width:900px) {
  .hero { aspect-ratio:auto; }
  .hero-photo { aspect-ratio:6688/3764; }
  .hero-copy { padding:32px var(--space) 48px; }
  .hero-copy h1 { font-size:clamp(3rem,7.5vw,4.75rem); max-width:12ch; }
  .hero-copy>p { max-width:42ch; }
  .hero,.product { --editorial-body:1.125rem; --editorial-detail:1rem; --editorial-kicker:.6875rem; }
  .product-copy h2 { font-size:clamp(3rem,6.5vw,4.75rem); }
}

@media(max-width:760px) { .product-copy { padding-top:0; } }

/* Navigation motion uses only the locked Soft Neutral Cohesion tokens. */
html { scroll-padding-top:calc(var(--header-height, 94px) + 16px); }
.site-header {
  position:sticky;
  top:0;
  isolation:isolate;
  background:transparent;
  border-bottom-color:transparent;
}
.site-header::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:var(--background);
  border-bottom:1px solid var(--line);
  opacity:calc(.94 + var(--nav-opacity, 1) * .06);
  transition:opacity 120ms linear;
  pointer-events:none;
}
.has-hero .site-header { margin-bottom:calc(-1 * var(--header-height, 94px)); }
@media(max-width:900px) { .has-hero .site-header { margin-bottom:0; } }
.site-header.menu-open::before { opacity:1; }
.back-to-top {
  position:fixed;
  right:max(20px, env(safe-area-inset-right, 0px));
  bottom:max(20px, env(safe-area-inset-bottom, 0px));
  z-index:9;
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  padding:10px;
  border:0;
  border-top:1px solid var(--line);
  border-radius:0;
  background:var(--background);
  color:var(--plum);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity 180ms ease, visibility 180ms;
}
.back-to-top.is-visible { opacity:1; visibility:visible; pointer-events:auto; }
.back-to-top svg { width:20px; height:20px; }
@media(hover:hover) { .back-to-top:hover { border-top-color:var(--plum); } }
@media(min-width:761px) {
  .back-to-top { right:max(32px, env(safe-area-inset-right, 0px)); bottom:max(28px, env(safe-area-inset-bottom, 0px)); }
}