body{background:var(--landing-linen);color:var(--landing-forest);font-family:var(--landing-body)}
.how-page{overflow:hidden}
.how-page :is(h1,h2,h3){font-family:var(--landing-display);font-weight:400;letter-spacing:-.035em;line-height:1.1}
.how-page :is(a,button):focus-visible,.site-header :is(a,button):focus-visible,.mobile-nav :is(a,button):focus-visible{outline:3px solid var(--landing-forest);outline-offset:5px}
.how-wrap{width:min(1180px,calc(100% - 112px));margin-inline:auto}
.how-overline{margin:0 0 19px;color:var(--landing-olive);font-size:.76rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.desktop-nav a[aria-current="page"]{color:var(--landing-olive)}
.desktop-nav a[aria-current="page"]::after{transform:scaleX(1)}
.site-header .header-cta{white-space:nowrap}
.site-header .header-cta span{font-size:1.25rem;line-height:1}
.mobile-nav a[aria-current="page"]{background:#f5f0e8}
.mobile-nav .mobile-nav-start{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;width:100%;margin-top:10px;padding:13px 18px;border-radius:28px;background:var(--landing-forest);color:var(--landing-linen);font-size:1rem;font-weight:600}
.mobile-nav .mobile-nav-start:hover{background:var(--landing-olive);color:var(--landing-linen)}
.mobile-nav .mobile-nav-start span{font-size:1.2rem}
.how-button{display:inline-flex;align-items:center;justify-content:space-between;gap:25px;min-height:55px;padding:14px 23px;border-radius:40px;background:var(--landing-forest);color:var(--landing-linen);font-weight:600;font-size:.98rem;text-decoration:none;transition:background .2s,transform .2s}
.how-button:hover{background:var(--landing-olive);transform:translateY(-2px)}
.how-button span{font-size:1.3rem;font-weight:400;line-height:1;transition:transform .2s}
.how-button:hover span{transform:translateX(3px)}
.how-hero{position:relative;isolation:isolate;width:min(1400px,calc(100% - 32px));min-height:680px;aspect-ratio:1672/941;margin:0 auto;display:flex;align-items:center;overflow:hidden;border-radius:14px;background:var(--landing-forest);color:#fffdfa}
.how-hero::before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,#30241ff5 0%,#30241fe8 34%,#30241f91 61%,#30241f1f 100%)}
.how-hero-copy{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;width:min(650px,58%);padding:clamp(46px,5.4vw,82px)}
.how-hero .how-overline{color:#f3cbb9}
.how-hero h1{max-width:700px;font-size:clamp(3.25rem,5.1vw,5.3rem);line-height:1.03}
.how-hero h1 em{color:#edb8a2;font-weight:400;font-style:normal}
.how-lede{max-width:52ch;margin-top:30px;color:#f5e9e0;font-size:1.1rem;line-height:1.62}
.how-hero-actions{margin-top:33px}
.how-hero .how-button{background:var(--landing-linen);color:var(--landing-forest)}
.how-hero .how-button:hover{background:#fffdfa}
.how-hero-actions>p{margin-top:15px;color:#f1ddd0;font-size:.79rem;line-height:1.5}
.how-hero-actions>p span{padding:0 5px}
.how-hero-photo{position:absolute;z-index:-2;inset:0;margin:0;overflow:hidden;background:#cdb8a6}
.how-hero-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.how-steps{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(65px,10vw,150px);padding-top:126px;padding-bottom:126px}
.how-steps-aside{align-self:start}
.how-section-intro{align-self:start}
.how-section-intro h2,.how-next h2,.how-boundary h2{font-size:clamp(2.8rem,4.6vw,4.7rem)}
.how-section-intro>p:last-child{max-width:33ch;margin-top:25px;color:var(--landing-muted);font-size:1.05rem;line-height:1.6}
.how-steps-photo{margin:38px 0 0;overflow:hidden;border-radius:12px;aspect-ratio:1200/801;background:#d8c8b7}
.how-steps-photo img{width:100%;height:100%;object-fit:cover}
.how-step-list{list-style:none;padding:0;margin:0}
.how-step-list li{display:grid;grid-template-columns:50px 1fr;gap:22px;padding:27px 0 34px;border-top:1px solid var(--landing-line)}
.how-step-list li:last-child{border-bottom:1px solid var(--landing-line)}
.how-step-number{padding-top:7px;color:var(--landing-olive);font-size:.87rem;font-weight:700}
.how-step-list h3{font-size:clamp(1.65rem,2.5vw,2.4rem)}
.how-step-list p{max-width:57ch;margin-top:16px;color:var(--landing-muted);font-size:1rem;line-height:1.65}
.how-example{padding:110px 0;background:var(--landing-forest);color:#fffdfa}
.how-example-grid{display:grid;grid-template-columns:.86fr 1.14fr;align-items:center;gap:clamp(60px,10vw,140px)}
.how-example .how-overline{color:#e3a991}
.how-example-copy h2{font-size:clamp(2.8rem,4.4vw,4.5rem)}
.how-example-copy>p:last-child{max-width:34ch;margin-top:24px;color:#e2d1c2;font-size:1.05rem;line-height:1.6}
.how-example-card{padding:clamp(34px,4.5vw,60px);border-radius:12px;background:var(--landing-linen);color:var(--landing-forest);transform:rotate(1.2deg);box-shadow:0 25px 50px #150f0d2b}
.how-card-label{margin-bottom:25px;padding-bottom:18px;border-bottom:1px solid var(--landing-line);color:var(--landing-olive);font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.how-example-card h3{font-size:clamp(2rem,3vw,2.9rem)}
.how-example-card>p:not(.how-card-label,.how-example-note){margin-top:19px;color:var(--landing-muted);line-height:1.6}
.how-example-action{margin-top:28px;padding:20px 0;border-top:1px solid var(--landing-line);border-bottom:1px solid var(--landing-line)}
.how-example-action span{color:var(--landing-olive);font-size:.78rem;font-weight:700}
.how-example-action p{margin-top:9px;line-height:1.55}
.how-example-note{margin-top:22px;color:var(--landing-muted);font-size:.8rem;line-height:1.5}
.how-next{padding-top:130px;padding-bottom:122px}
.how-next-heading{display:grid;grid-template-columns:1fr .75fr;column-gap:70px;align-items:end}
.how-next-heading .how-overline{grid-column:1/-1}
.how-next-heading>p:last-child{max-width:42ch;padding-bottom:8px;color:var(--landing-muted);font-size:1.05rem;line-height:1.6}
.how-modes{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-top:60px}
.how-modes article{min-width:0}
.how-mode-visual{position:relative;overflow:hidden;aspect-ratio:4/3;margin:0;border-radius:12px;background:#d8c8b7}
.how-mode-visual img{width:100%;height:100%;object-fit:cover;transition:transform .65s var(--landing-ease)}
.how-mode-visual::after{content:"";position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#30241fa6)}
.how-mode-visual figcaption{position:absolute;z-index:1;bottom:20px;left:24px;color:#fffdfa;font:400 2.3rem/1 var(--landing-display)}
.how-modes article:hover img{transform:scale(1.035)}
.how-modes p{max-width:39ch;margin-top:18px;color:var(--landing-muted);line-height:1.6}
.how-offer-summary{display:grid;grid-template-columns:1fr auto;gap:17px 60px;align-items:end;margin-top:32px;padding:35px 40px;border-radius:12px;background:#e8d8ca}
.how-offer-summary p{grid-column:1;max-width:78ch;line-height:1.6}
.how-offer-summary p+p{font-size:.85rem;color:var(--landing-muted)}
.how-offer-summary a{grid-column:2;grid-row:1/3;display:inline-flex;gap:18px;align-items:center;min-height:44px;font-weight:700;text-underline-offset:5px;white-space:nowrap}
.how-offer-summary a:hover{color:var(--landing-olive)}
.how-boundary{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:start;padding-top:52px;padding-bottom:95px;border-top:1px solid var(--landing-line)}
.how-boundary>p{max-width:57ch;padding-top:38px;color:var(--landing-muted);font-size:1.03rem;line-height:1.68}
.how-closing{padding:76px 0 84px;background:var(--landing-olive);color:#fffdfa}
.how-closing-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:80px;align-items:end}
.how-closing .how-overline{color:#f5d7ca}
.how-closing h2{max-width:13ch;font-size:clamp(3.3rem,5.5vw,5.8rem)}
.how-closing-grid>div:last-child{padding-bottom:8px}
.how-closing-grid>div:last-child>p{max-width:36ch;margin-bottom:26px;font-size:1.08rem;line-height:1.6}
.how-button-light{background:var(--landing-linen);color:var(--landing-forest)}
.how-button-light:hover{background:#fffdfa;color:var(--landing-forest)}
.how-preview{padding-top:22px;padding-bottom:25px;color:var(--landing-muted);font-size:.8rem;line-height:1.5}
.how-page.motion-ready [data-reveal].is-visible{animation:how-reveal .65s var(--landing-ease) both}
.how-hero-copy{animation:how-enter .8s var(--landing-ease) both}
.how-hero-photo img{animation:how-photo 1.3s var(--landing-ease) both}
@keyframes how-enter{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes how-reveal{from{opacity:.72;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes how-photo{from{transform:scale(1.06)}to{transform:scale(1)}}
@media(max-width:1100px){
  .how-hero{min-height:600px}
  .how-hero-copy{width:63%;padding:46px}
  .how-hero h1{font-size:clamp(3rem,5vw,4.25rem)}
  .how-steps{gap:65px}
  .how-example-grid{gap:60px}
}
@media(max-width:1024px){
  .how-wrap{width:calc(100% - 64px)}
  .how-hero{min-height:0;aspect-ratio:auto;flex-direction:column;align-items:stretch;background:#e8d8ca;color:var(--landing-forest)}
  .how-hero::before{display:none}
  .how-hero-copy{order:0;width:100%;padding:42px 38px 30px}
  .how-hero .how-overline{color:var(--landing-olive)}
  .how-hero h1{font-size:clamp(2.45rem,5.1vw,3.5rem)}
  .how-hero h1 em{color:var(--landing-olive)}
  .how-lede{color:var(--landing-forest);font-size:1rem}
  .how-hero .how-button{background:var(--landing-forest);color:var(--landing-linen)}
  .how-hero .how-button:hover{background:var(--landing-olive)}
  .how-hero-actions>p{color:var(--landing-muted)}
  .how-hero-photo{order:1;position:relative;z-index:auto;inset:auto;align-self:stretch;width:calc(100% - 32px);height:auto;aspect-ratio:1672/941;margin:0 16px 16px;border-radius:10px}
  .how-hero-photo img{width:100%;height:100%;object-fit:contain}
  .how-steps{grid-template-columns:1fr;gap:40px;padding-top:85px;padding-bottom:90px}
  .how-section-intro h2{max-width:14ch}
  .how-steps-photo{max-width:620px;aspect-ratio:1200/801}
  .how-step-list li{padding:24px 0 28px}
  .how-example{padding:85px 0}
  .how-example-grid{grid-template-columns:1fr;gap:40px}
  .how-example-copy h2{max-width:13ch}
  .how-example-card{max-width:680px;transform:none}
  .how-next{padding-top:90px;padding-bottom:85px}
  .how-next-heading{grid-template-columns:1fr;gap:18px}
  .how-next-heading .how-overline{grid-column:1}
  .how-offer-summary{grid-template-columns:1fr}
  .how-offer-summary a{grid-column:1;grid-row:auto;justify-self:start}
  .how-boundary{gap:45px}
  .how-closing-grid{gap:40px}
}
@media(max-width:650px){
  .how-wrap{width:calc(100% - 40px)}
  .mobile-nav .mobile-nav-start{grid-column:1;margin-top:2px}
  .how-hero{width:calc(100% - 20px)}
  .how-hero-copy{padding:38px 26px 32px}
  .how-hero h1{font-size:clamp(2.7rem,10vw,4rem)}
  .how-lede{margin-top:22px}
  .how-hero-actions{margin-top:26px}
  .how-hero-photo{width:calc(100% - 24px);margin:0 12px 12px}
  .how-steps{padding-top:75px;padding-bottom:78px}
  .how-section-intro h2,.how-next h2,.how-boundary h2{font-size:clamp(2.45rem,8vw,3.4rem)}
  .how-step-list li{grid-template-columns:35px 1fr;gap:14px}
  .how-step-list h3{font-size:1.8rem}
  .how-step-list p{font-size:.94rem}
  .how-steps-photo{margin-top:26px}
  .how-example{padding:75px 0}
  .how-example-copy h2{font-size:2.9rem}
  .how-example-card{padding:28px}
  .how-next{padding-top:75px;padding-bottom:75px}
  .how-modes{grid-template-columns:1fr;gap:34px;margin-top:35px}
  .how-offer-summary{margin-top:18px;padding:27px 25px}
  .how-boundary{grid-template-columns:1fr;gap:15px;padding-top:42px;padding-bottom:70px}
  .how-boundary>p{padding:0}
  .how-closing{padding:65px 0 70px}
  .how-closing-grid{grid-template-columns:1fr;gap:24px}
  .how-closing h2{font-size:clamp(3rem,10vw,4rem)}
  .how-closing-grid>div:last-child>p{margin-bottom:23px}
}
@media(max-width:390px){
  .how-hero h1{font-size:2.65rem}
  .how-button{width:100%;font-size:.9rem}
  .how-hero-actions>p{font-size:.74rem}
}
@media(prefers-reduced-motion:reduce){
  .how-hero-copy,.how-hero-photo img{animation:none}
  .how-page.motion-ready [data-reveal].is-visible{animation:none}
  .how-button,.how-button span{transition:none}
  .how-mode-visual img{transition:none;transform:none!important}
}