/* Sumpay / next chapter: ivory, kinetic orange, generous type. */
:root {
  --bg:#FAF9F5; --bg-2:#F0EFE8; --surface:#FFFFFF;
  --ink:#24251F; --ink-soft:#4F5047; --muted:#68695F; --muted-2:#68695F;
  --orange:#FF6B2B; --orange-deep:#EF5C1D; --brand:#A53D10;
  --brand-2:#A53D10; --brand-vivid:#C64812; --brand-hover:#87320D;
  --brand-tint:#FFE6D7; --green:#526741; --green-soft:#E5E9D6;
  --blue:#586147; --blue-soft:#E9ECDF; --line:#DEDFD5; --line-2:#EAEAE1;
  --band-warm:#F3F2EB; --band-cool:#F3F2EB; --maxw:1380px;
}
body{background:var(--bg)}
.nav-shell,.nav-shell.condensed{background:#faf9f5ed;border-bottom:1px solid #24251f0c;backdrop-filter:blur(20px)}
.nav,.nav-shell.condensed .nav{min-height:90px;padding-block:20px;gap:25px}
.nav-links a{font-size:13px;padding-inline:12px;color:#4f5047}
.nav-links a:hover{background:#edeee6;color:#24251f}
.nav-cta .btn-ghost{box-shadow:none;border:0}
.nav-cta .btn-primary{background:#F7AE42;color:#263E2C;padding:14px 20px}
.nav-cta .btn-primary:hover{background:#ffb954}
.brand .word{color:#24251f;font-size:27px;letter-spacing:-.065em}
.btn{border-radius:999px;box-shadow:none}
.btn-primary{background:#ff6b2b;color:#24251f}
.btn-primary:hover{background:#ff824b;color:#24251f}
.btn-primary:focus-visible{outline:3px solid #24251f;outline-offset:4px}
.btn-lg{padding:14px 16px 14px 25px}
.button-arrow{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#24251f;color:#fff;margin-left:8px}
.button-arrow svg{width:17px;height:17px;transition:transform .2s}
.btn:hover .button-arrow svg{transform:rotate(-35deg)}
.home-hero{padding-top:143px;background:#FAF9F5;color:#24251f;overflow:hidden}
.hero-layout{grid-template-columns:1.07fr 1fr;gap:20px;padding-bottom:34px;min-height:608px}
.intro-copy{padding:9px 0 36px;position:relative;z-index:3}
.location-label{font-size:12px;color:#5a5b51;gap:10px}
.location-label>span{background:#ff6b2b;box-shadow:0 0 0 5px #ff6b2b0c;width:6px;height:6px}
.intro-copy h1{font-weight:600;font-size:clamp(68px,8.6vw,119px);line-height:.98;letter-spacing:-.07em;color:#24251f;margin:30px 0 27px;white-space:nowrap}
.intro-copy>p{font-size:15px;color:#68695f;line-height:1.85;max-width:393px}
.intro-actions{margin-top:29px;gap:23px;flex-wrap:wrap}
.intro-actions .text-link{font-size:12px;color:#383b2f;gap:8px}
.intro-actions .text-link>svg{width:16px;height:16px}
.intro-assurance{margin-top:34px;gap:12px;font-size:11px;line-height:1.7;color:#707267}
.intro-assurance strong{font-weight:500;color:#373b2d}
.assurance-symbol{display:grid;place-items:center;flex:none;border:1px solid #d8dccc;border-radius:50%;height:36px;width:36px}
.intro-assurance svg{width:18px;height:18px;color:#626e4f}
.hero-story{height:560px;background:none;border-radius:0;margin:0;position:relative;isolation:isolate;animation:none}
.hero-story::after{display:none}
.portrait-window{position:absolute;left:9%;top:10px;width:81%;height:525px;overflow:hidden;border-radius:220px 220px 160px 160px;background:#f3eee5;z-index:1;transform:rotate(5deg);border:1px solid #e7e2d7}
.portrait-window img{height:100%;width:100%;object-fit:cover;object-position:center top;transform:rotate(-5deg) scale(1.025);mix-blend-mode:multiply}
.momentum-loop{position:absolute;z-index:0;left:-7%;top:-36px;width:112%;height:620px;color:#FF6B2B;overflow:visible;transform:rotate(-7deg);transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.hero-story:hover .momentum-loop{transform:rotate(-2deg)}
.story-caption{top:30px;left:4px;background:#e5e9d6;box-shadow:none;font-size:11px;padding:11px 15px;border:4px solid #faf9f5;transform:rotate(-6deg);z-index:4}
.story-dot{background:#617544;width:6px;height:6px}
.story-note{top:250px;bottom:auto;left:-27px;gap:12px;border-radius:14px;padding:16px 17px;background:#ffffffed;backdrop-filter:blur(16px);border:1px solid #ffffff;box-shadow:0 12px 32px #3e372b12;transform:rotate(-5deg);z-index:4;transition:transform .25s}
.story-note:hover{transform:rotate(0) translateY(-4px)}
.story-note small{color:#6b6c63;font-size:10px;margin-bottom:3px}.story-note strong{color:#282c22;font-weight:600;font-size:16px}
.note-icon{padding:10px;border-radius:50%;background:#fff0e4}.note-icon svg{color:#a64c22;width:21px;height:21px}
.story-note>svg{width:18px;height:18px;margin-left:10px;transform:rotate(-35deg)}
.scene-inset{position:absolute;right:-10px;bottom:23px;width:174px;height:181px;border:6px solid #fff;border-radius:17px;overflow:hidden;transform:rotate(8deg);box-shadow:0 15px 30px #2b2a251c;z-index:4;background:#fff}
.scene-inset img{width:100%;height:100%;object-fit:cover;object-position:15% center}
.scene-inset::after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#171812ad)}
.scene-inset span{position:absolute;bottom:13px;left:12px;z-index:1;font-size:12px;color:#fff;line-height:1.45;font-weight:500}
.photo-credit{color:#797b70;font-size:8px;right:163px;bottom:0;transform:none}
.hero-bottom{border-top:0;gap:20px;padding-top:20px;padding-bottom:39px;justify-content:space-between;color:#74766a;font-size:12px}
.hero-bottom>span{line-height:1.55;margin-right:auto}.hero-bottom strong{color:#24251f;font-weight:500}
.hero-bottom>a{gap:12px;border:1px solid #dedfd5;border-radius:999px;padding:16px 20px;color:#373a2e;font-size:12px;transition:background .2s,border-color .2s}
.hero-bottom>a>svg{width:17px;height:17px;color:#787f69}.hero-bottom>a>span{font-size:20px;line-height:1;margin-left:10px;color:#6f765d}
.hero-bottom>a:hover{background:#e8ebdf;border-color:#c9cfbc;color:#24251f}
.scroll-progress{background:#ff6b2b}
.drawer-scrim{background:#25271e55}.drawer-panel{background:#faf9f5;border-color:#e5e5db}.drawer-panel .btn{display:flex;align-items:center;justify-content:center;gap:14px}
@view-transition{navigation:none}
@media(prefers-reduced-motion:no-preference){
  .intro-copy{animation:nextCopy .75s ease both}.portrait-window{animation:nextPortrait .95s .15s ease both}
  .momentum-loop path{stroke-dasharray:1900;stroke-dashoffset:1900;animation:nextLoop 1.4s .3s cubic-bezier(.25,.7,.25,1) forwards}
  .momentum-loop path+path{stroke-dasharray:160;stroke-dashoffset:160;animation-delay:1.4s;animation-duration:.35s}
  .story-note{animation:nextNote .8s .5s ease both}.scene-inset{animation:nextInset .8s .65s ease both}
  @keyframes nextCopy{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
  @keyframes nextPortrait{from{opacity:0;transform:rotate(0) translateY(20px)}to{opacity:1;transform:rotate(5deg)}}
  @keyframes nextLoop{to{stroke-dashoffset:0}}
  @keyframes nextNote{from{opacity:0;transform:rotate(0) translateY(20px)}to{opacity:1;transform:rotate(-5deg)}}
  @keyframes nextInset{from{opacity:0;transform:rotate(0) translateY(20px)}to{opacity:1;transform:rotate(8deg)}}
}
@media(min-width:821px) and (max-width:1150px){
 .hero-layout{grid-template-columns:1.06fr 1fr;gap:25px}.intro-copy h1{font-size:8.5vw}.hero-story{height:500px}.portrait-window{height:460px;width:90%;left:5%}.momentum-loop{height:535px}.scene-inset{width:146px;height:160px;right:-5px;bottom:8px}.story-note{left:-20px;top:245px;padding:12px}.photo-credit{right:135px}.hero-bottom{gap:12px}.hero-bottom>a{padding:13px;font-size:11px;gap:7px}.hero-bottom>a>span{margin-left:2px}
}
@media(max-width:820px){
 .nav,.nav-shell.condensed .nav{min-height:78px;padding-block:16px}.home-hero{padding-top:119px}.hero-layout{grid-template-columns:1fr;gap:0;min-height:0;padding-bottom:18px}.intro-copy{padding:0;max-width:620px}.intro-copy h1{font-size:96px;margin-top:27px}.intro-copy>p{max-width:450px}.intro-actions{gap:23px}.hero-story{max-width:550px;width:100%;height:580px;justify-self:center;margin-top:35px}.portrait-window{width:79%;height:525px;left:10%}.momentum-loop{height:610px;left:-5%;width:110%}.story-note{left:0;top:240px}.scene-inset{right:0;bottom:40px}.photo-credit{bottom:19px;right:173px}.hero-bottom{flex-wrap:wrap;gap:12px;padding-top:10px}.hero-bottom>span{width:100%;margin-bottom:8px}.hero-bottom>a{flex:1;justify-content:space-between;white-space:nowrap;font-size:11px;padding:14px 13px;gap:7px}.hero-bottom>a>span{margin-left:0}
}
@media(max-width:480px){
 .nav,.nav-shell.condensed .nav{min-height:76px}.home-hero{padding-top:112px}.intro-copy h1{font-size:clamp(60px,16vw,78px);letter-spacing:-.07em;margin-bottom:24px}.location-label{font-size:10px}.intro-copy>p{font-size:13px;line-height:1.9;max-width:320px}.intro-actions{gap:18px;margin-top:25px}.intro-actions .btn{padding:10px 11px 10px 21px;font-size:12px}.button-arrow{height:30px;width:30px;margin-left:0}.intro-actions .text-link{font-size:11px}.intro-assurance{margin-top:24px;font-size:10px}.hero-story{margin-top:34px;height:407px}.portrait-window{height:370px;left:10%;width:82%;top:0}.momentum-loop{width:114%;height:430px;left:-7%;top:-20px}.story-caption{font-size:9px;padding:8px 10px;top:9px;left:0}.story-note{left:0;top:190px;padding:10px;gap:8px}.story-note strong{font-size:13px}.story-note small{font-size:9px}.story-note>svg{width:15px;height:15px;margin-left:1px}.note-icon{padding:8px}.note-icon svg{width:17px;height:17px}.scene-inset{width:118px;height:134px;right:0;bottom:13px;border-width:5px;border-radius:11px}.scene-inset span{font-size:9px;left:7px;bottom:8px}.photo-credit{font-size:7px;right:113px;bottom:8px}.hero-bottom{padding-block:8px 27px;gap:9px}.hero-bottom>span{font-size:12px}.hero-bottom>a,.hero-bottom>a:last-child{display:flex;flex:1 1 100%;padding:13px 18px;font-size:12px;gap:10px}.hero-bottom>a>span{margin-left:auto}.hero-bottom>a>svg{height:17px;width:17px}.hero-bottom strong{font-size:14px}
}
@media(prefers-reduced-motion:reduce){.momentum-loop path{stroke-dashoffset:0;stroke-dasharray:none}.hero-story:hover .momentum-loop{transform:rotate(-7deg)}}
