/* Cerama visual system v0.2.2 — local assets only */
:root{
  --c-forest:#19392f; --c-forest-dark:#122b23; --c-fern:#385b48;
  --c-paper:#f6f3ed; --c-cream:#fcfaf5; --c-clay:#b56d4b; --c-clay-deep:#975334;
  --c-line:#c8cabb; --c-muted:#536559; --c-dark-text:#1d3a2d;
}
html{scroll-padding-top:30px}
body{background:var(--c-paper);color:var(--c-dark-text)}
::selection{background:#d6ae8c;color:#163326}
a,button{-webkit-tap-highlight-color:transparent}
svg.lucide,[data-lucide],.flow-icon svg,.feature>svg{visibility:visible}
.announcement{height:36px;background:#a65f3e;font-size:12px;font-weight:520;gap:28px}
.announcement a{font-size:12px;gap:7px;text-decoration:none}
.header{top:36px}
.nav{border-color:#c8c7b6;gap:36px}
.brand-mark{width:40px;color:#a95d3e}
.brand-text{letter-spacing:-1.8px;font-size:34px}
.nav-links{gap:34px;font-size:13px}
.nav-links a{position:relative}
.nav-links a:after{content:'';position:absolute;right:0;left:100%;bottom:-8px;height:2px;background:var(--c-clay);transition:left .35s cubic-bezier(.2,.9,.3,1)}
.nav-links a:hover:after,.nav-links a:focus-visible:after{left:0}
.nav-login{font-size:13px;font-weight:550}
.button-orange{background:var(--c-forest);color:#f6f2e9}
.button-orange:hover{background:var(--c-clay-deep)}
.button{font-size:13px;font-weight:650}
.hero{background:radial-gradient(ellipse 80% 70% at 55% 26%,#f5ecde 0%,#eae3d7 75%,#e5ddcf 100%);padding-top:134px;min-height:795px}
.hero:before{background:none;inset:0}
.hero-inner{grid-template-columns:45% 55%;min-height:590px}
.hero-copy{padding:28px 0 65px 10px}
.eyebrow{color:#8e5438;font-size:12px;gap:12px}
.eyebrow-index{color:#746b5c;font-size:11px}
.hero h1{font-size:clamp(78px,8.2vw,124px);font-weight:810;line-height:1.15;letter-spacing:-5px;margin:30px 0 28px}
.hero h1 em{color:var(--c-clay-deep)}
.hero-description{font-size:16px;line-height:2.05;color:#4d6054;max-width:455px;letter-spacing:0}
.button-primary{background:var(--c-forest);padding:19px 29px}
.button-primary:hover{background:#9f5d3d}
.text-link{font-size:13px;transition:color .2s}
.text-link:hover{color:#a05b3d}
.hero-smallnote{margin-top:45px;font-size:12px;color:#56655b}
.hero-visual{height:590px;margin-inline-start:-34px}
.hero-photo-wrap{border-radius:240px 240px 9px 9px;background:#bca48e;box-shadow:0 25px 70px #2c37282b}
.hero-photo{background:none;filter:none;position:relative}
.hero-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 70%,#162b2273)}
.hero-photo img{display:block;height:100%;width:100%;object-fit:cover;object-position:50% 40%;filter:saturate(.82) contrast(.99)}
.photo-credit{bottom:22px;font-size:10px;letter-spacing:1.1px;z-index:2}
.hero-photo-meta{position:absolute;right:19px;bottom:20px;display:flex;flex-direction:column;gap:5px;color:#fffaed;direction:ltr;font-size:10px;z-index:2;letter-spacing:1.2px;text-shadow:0 2px 8px #131d12}
.hero-photo-meta span:first-child{font-size:12px;font-weight:800}
.hero-stamp{width:118px;height:146px;left:-30px;bottom:45px;background:#f8efe0;box-shadow:0 15px 40px #30261c27}
.image-side-label{right:-21px;font-size:10px;letter-spacing:2px}
.hero-bottom{font-size:12px;color:#55665a}
.hero-bottom a:hover{background:#1a382d;color:white}
.section-pad{padding:108px 0}
.section-top{margin-bottom:52px}
.kicker{color:#9b5435;font-size:12px}
.overline{font-size:11px;letter-spacing:1.9px;color:#586a5b}
.manifesto{background:var(--c-cream)}
.manifesto-grid{gap:9%;margin-bottom:75px}
.manifesto-heading h2,.dashboard-heading h2,.pricing-heading h2,.faq h2{font-size:clamp(39px,4vw,61px);line-height:1.47;letter-spacing:-1.9px}
.manifesto-heading p,.dashboard-heading p,.pricing-heading p,.faq-intro p{font-size:15px;line-height:2.08;color:#52655b;max-width:470px}
.manifesto-art{height:465px}
.editorial-photo-frame{height:97%;width:77%;border-radius:48% 48% 4px 4px;border:8px solid #f6f0e5;box-shadow:0 23px 65px #5c503a27}
.editorial-photo{filter:saturate(.82);object-position:center 55%}
.editorial-photo-frame .art-label{color:#374b3d;background:#fbf5e9;bottom:14px;left:14px}
.art-vertical-caption{color:#895a43}
.feature-intro{padding:27px 0 30px}
.feature-intro span:first-child{font-size:26px;letter-spacing:-.6px}
.feature-intro span:last-child{font-size:13px;color:#586858}
.features-grid{background:#c7cbbd;border-color:#c7cbbd}
.feature{background:#fcfbf7;min-height:322px;padding:32px 33px 24px;transition:background .25s,transform .25s}
.feature:after{content:'';position:absolute;width:30px;height:30px;border-top:1px solid #b5a591;border-left:1px solid #b5a591;top:19px;left:19px;opacity:.5;transition:opacity .2s}
.feature:hover:after{opacity:1}
.feature-primary{background:#d6e2d6}
.feature:nth-child(4){background:#ece1d5}
.feature:nth-child(6){background:#edf0e9}
.feature:hover{background:#e6ebdf}
.feature-number{font-size:12px;color:#566b5d}
.feature>svg{color:#355e44;visibility:visible!important;width:43px;height:43px;stroke-width:1.55}
.feature h3{font-size:21px;font-weight:750;line-height:1.65;margin:20px 0 6px}
.feature p{font-size:13px;line-height:1.95;color:#4e6255}
.feature-foot{font-size:12px;color:#385a46;border-color:#b9c7ba;padding-top:15px}
.craft-story{padding:35px 0 102px;background:var(--c-cream)}
.craft-story-wrap{padding-top:58px}
.craft-story-title{grid-template-columns:.47fr 1.05fr 1fr;gap:25px;margin-bottom:32px}
.craft-story-title h2{font-size:clamp(30px,3.2vw,48px);color:var(--c-forest)}
.craft-story-title p{font-size:14px;line-height:2;color:#53675b}
.craft-story-gallery{gap:15px}
.craft-story-gallery figure{border-radius:5px 5px 2px 2px}
.craft-story-gallery img{height:350px;filter:saturate(.83)}
.craft-story-gallery figcaption{font-size:17px;line-height:1.5;font-weight:650}
.craft-story-gallery figcaption span{font-size:11px}
.process{background:radial-gradient(circle at 18% 90%,#2c4c3e 0,#193b30 50%,#15342a 100%)}
.process:before{opacity:.65}
.process-head{margin-bottom:68px}
.process-head h2{font-size:clamp(44px,4.7vw,72px)}
.process-head p{font-size:15px;line-height:2.1;color:#d9e3da}
.process-head h2 em{color:#d39673}
.flowline{gap:12px}
.flowline:before{top:63px;border-top:1px dashed #8ba996}
.flowstep{z-index:1}
.flow-icon{background:#26493a;width:126px;height:126px;border-color:#789783;box-shadow:inset 0 0 0 12px #234236;position:relative}
.flow-icon:before{content:'';position:absolute;inset:-8px;border:1px dashed #52725e;border-radius:50%}
.flow-icon svg{width:36px;height:36px;color:#edc5a6;visibility:visible!important;stroke-width:1.5}
.flowstep>span{font-size:12px;color:#e6b28c}
.flowstep strong{font-size:16px;color:white;margin-top:6px}
.flowstep small{font-size:12px;color:#c8d7c9;line-height:1.8}
.process-note{margin-top:72px}
.process-note p{font-size:14px}
.dashboard-section{background:#eeeae1}
.dashboard-heading,.pricing-heading{margin-bottom:43px;align-items:end}
.dashboard-heading p,.pricing-heading p{font-size:15px}
.demo-topbar{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:15px}
.demo-status{display:flex;align-items:center;gap:9px;font-size:12px;color:#52685b}
.demo-status-dot{width:8px;height:8px;border-radius:50%;background:#6e9b79;box-shadow:0 0 0 4px #d6e5d6}
.demo-expand{display:flex;align-items:center;justify-content:center;gap:11px;background:#fdfbf7;border:1px solid #b9c5b7;border-radius:50px;padding:10px 16px;font-size:12px;color:#294f38;transition:background .2s}
.demo-expand:hover{background:#dce8d9}
.demo-expand svg{height:17px;width:17px}
.app-shell{border:8px solid #c3cbbc;border-radius:16px;box-shadow:0 23px 70px #35463426;background:#fafbf7;grid-template-columns:215px minmax(0,1fr);min-height:570px;position:relative}
.app-sidebar{background:#183d2e;padding:29px 18px}
.app-logo{font-size:25px}
.app-workspace{border-color:#6f9076;font-size:11px}
.app-menu button{font-size:12px;min-height:45px;transition:background .2s}
.app-menu button.active{background:#41654c}
.app-main{padding:30px 30px 21px}
.app-top h3{font-size:27px}
.app-top small{font-size:12px;color:#64776c}
.demo-label{font-size:11px}
.metric{background:#fff;border-color:#dce5d8;padding:17px 20px}
.metric>span{font-size:12px;color:#4c6755}
.metric strong{color:#255036;font-size:39px}
.metric small{font-size:11px;color:#5b7161}
.app-table,.app-chart{border-color:#dce5d9}
.app-panel-top{font-size:14px}
.app-panel-top span{font-size:11px;color:#526f5c}
.table-row{font-size:12px;grid-template-columns:1.4fr .85fr .8fr}
.table-head{font-size:11px;color:#617965}
.status{font-size:10px}
.demo-caption{font-size:11px;color:#526959}
.studio-bottom{font-size:12px;color:#536a58}
.demo-open{overflow:hidden}
.demo-open .app-shell{position:fixed;inset:4vh 5vw;z-index:102;overflow:auto;min-height:0;grid-template-columns:240px minmax(0,1fr);box-shadow:0 0 0 100vmax #10271bd9,0 22px 80px #0006}
.demo-open .demo-topbar{position:fixed;z-index:105;top:5vh;left:7vw;right:auto}
.demo-open #demo-expand{background:#fff;color:#1c3c2b}
.demo-open .app-main{padding-top:70px}
.quote-photo{background:linear-gradient(90deg,#152f25f7 5%,#152f25b8 49%,#152f2529 100%),url('../images/cerama-quote.webp') center center / cover}
.quote-content blockquote{font-size:clamp(34px,4.1vw,62px)}
.quote-content>span{font-size:11px;color:#f3c5a2}
.pricing{background:var(--c-cream)}
.pricing-grid{gap:18px}
.plan{border:1px solid #bdcbb9;border-radius:7px;background:#fdfbf7;min-height:490px;padding:29px}
.plan h3{font-size:30px}
.plan>p{font-size:13px;color:#516659}
.plan-tag{font-size:12px;color:#52675a}
.plan-price{font-size:22px;min-height:94px}
.plan-price small{font-size:12px;color:#56685b}
.plan ul{gap:15px;margin-top:26px}
.plan li{font-size:13px;line-height:1.5}
.plan.featured{background:#1b3b2d}
.featured .plan-tag,.featured>p,.featured .plan-price small{color:#cfddcf}
.plan-btn{font-size:13px;border-color:#95af99}
.popular{font-size:12px}
.pricing-disclaimer{font-size:12px;color:#526658}
.faq{background:#e8ebe1}
.faq-intro p{max-width:450px}
.faq-list{border-color:#b5c6b4}
.faq-list details{border-color:#b5c6b4}
.faq-list summary{font-size:15px;line-height:1.7}
.faq-list details p{font-size:14px;color:#4d6557}
.faq-list summary svg{color:#975c3a}
.cta-section{background:#ad6746}
.cta-copy p{font-size:15px}
.cta-copy h2 em{color:#473226}
.cta-copy small{font-size:12px;color:#fff5e9;opacity:1}
.cta-photo-wrap{width:79%;border:7px solid #d9a184;border-radius:45% 45% 5px 5px;box-shadow:0 20px 60px #412c2945}
.cta-photo-wrap img{filter:saturate(.92)}
.button-white{font-size:13px}
.footer{background:#143128}
.footer-about p{font-size:14px;color:#c5d5c9}
.footer-columns a{font-size:13px;color:#c0d0c4}
.footer-columns strong{font-size:14px}
.footer-bottom{font-size:12px;color:#c1d0c4}

/* tablet */
@media(max-width:1150px){
 .container{width:calc(100% - 64px)}
 .hero h1{font-size:clamp(75px,8.2vw,118px)}
 .hero-inner{grid-template-columns:48% 52%}
 .hero-visual{height:550px;margin-inline-start:-20px}
 .flow-icon{width:105px;height:105px}
 .flowline:before{top:53px}
 .nav-links{gap:16px}
 .app-shell{grid-template-columns:190px minmax(0,1fr)}
}

/* portrait tablet */
@media(max-width:820px){
 .container{width:calc(100% - 44px)}
 .header{top:36px}
 .nav{height:73px}
 .nav-links{top:109px;background:#fbf6ed}
 .hero{padding-top:110px}
 .hero-inner{display:grid;grid-template-columns:1fr}
 .hero-copy{padding:45px 0 38px}
 .hero h1{font-size:clamp(70px,12vw,105px)}
 .hero-description{font-size:15px}
 .hero-visual{height:520px;margin:0}
 .hero-photo-wrap{inset:0 4%}
 .hero-smallnote{margin-top:22px}
 .section-pad{padding:80px 0}
 .manifesto-grid{gap:32px}
 .manifesto-art{height:390px}
 .feature h3{font-size:18px}
 .feature p{font-size:12px}
 .craft-story-title{grid-template-columns:1fr 1.2fr}
 .craft-story-title p{grid-column:2}
 .craft-story-gallery img{height:285px}
 .process-head{margin-bottom:45px}
 .flowline{grid-template-columns:repeat(3,1fr);row-gap:42px}
 .flowline:before{display:none}
 .app-shell{grid-template-columns:165px minmax(0,1fr)}
 .app-main{padding:22px 15px}
 .app-metrics{gap:8px}
 .metric{padding:12px}
 .metric strong{font-size:30px}
 .table-row{font-size:10px}
 .plan{padding:22px 15px}
 .plan h3{font-size:25px}
 .plan li{font-size:12px}
 .pricing-grid{gap:12px}
}

/* compact phones */
@media(max-width:600px){
 .container{width:calc(100% - 36px)}
 .announcement{height:34px;font-size:10px;padding:0 8px;gap:10px}
 .announcement a{font-size:10px}
 .header{top:34px}
 .nav{height:70px}
 .nav-links{top:104px;z-index:25}
 .brand-mark{width:28px}
 .brand-text{font-size:28px}
 .nav-actions .button{font-size:11px;gap:6px;padding:11px 13px}
 .menu-toggle{padding:10px;display:grid;place-items:center}
 .hero{padding-top:109px;min-height:0;background:#eee6d9}
 .hero-copy{padding:25px 0 24px}
 .hero h1{font-size:clamp(62px,16.1vw,80px);letter-spacing:-3px;line-height:1.13;margin:15px 0 17px}
 .eyebrow{font-size:11px}
 .hero-description{font-size:13px;line-height:1.9;max-width:100%;margin-bottom:20px}
 .hero-buttons{gap:16px}
 .button-primary{padding:14px 19px;font-size:12px}
 .text-link{font-size:11px;padding-bottom:5px}
 .hero-smallnote{font-size:10px;margin-top:16px;line-height:1.5}
 .hero-visual{height:390px;margin:0}
 .hero-photo-wrap{inset:0;border-radius:175px 175px 6px 6px}
 .hero-photo img{object-position:48% 50%}
 .hero-photo-meta{right:14px;bottom:16px;font-size:9px}
 .photo-credit{left:14px;bottom:14px;font-size:8px}
 .hero-stamp{width:89px;height:113px;left:-5px;bottom:16px}
 .hero-stamp svg{height:49px}
 .hero-stamp span{font-size:6px}
 .image-side-label{right:-8px;font-size:8px}
 .hero-bottom{margin-top:10px;padding:10px 0 16px;font-size:10px}
 .hero-bottom a{width:33px;height:33px}
 .section-pad{padding:66px 0}
 .section-top{margin-bottom:31px}
 .kicker{font-size:11px}
 .overline{font-size:9px}
 .manifesto-heading h2,.dashboard-heading h2,.pricing-heading h2,.faq h2{font-size:clamp(34px,9vw,44px);line-height:1.48;letter-spacing:-1.1px;margin-bottom:18px}
 .manifesto-heading p,.dashboard-heading p,.pricing-heading p,.faq-intro p{font-size:13px;line-height:2}
 .manifesto-grid{margin-bottom:48px;gap:20px}
 .manifesto-art{height:320px}
 .editorial-photo-frame{width:82%;height:100%;border:5px solid #f3e7db}
 .editorial-photo-frame .art-label{font-size:8px}
 .feature-intro{padding:21px 0;gap:7px}
 .feature-intro span:first-child{font-size:20px}
 .feature-intro span:last-child{font-size:12px}
 .features-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1px}
 .feature{padding:20px 14px 14px;min-height:268px}
 .feature-number{font-size:11px}
 .feature>svg{height:30px;width:30px;margin-top:15px}
 .feature h3{font-size:15px;line-height:1.48;margin:17px 0 5px;letter-spacing:0}
 .feature p{font-size:12px;line-height:1.85}
 .feature-foot{font-size:10px;line-height:1.4;gap:5px;margin-top:auto}
 .feature-foot svg{width:14px;height:14px;flex-shrink:0}
 .feature:after{display:none}
 .craft-story{padding:0 0 64px}
 .craft-story-wrap{padding-top:38px}
 .craft-story-title h2{font-size:32px;margin:12px 0}
 .craft-story-title p{font-size:12px}
 .craft-story-gallery{gap:8px}
 .craft-story-gallery img{height:178px}
 .craft-story-gallery figure:first-child img{height:224px}
 .craft-story-gallery figcaption{font-size:12px;padding:32px 9px 10px}
 .craft-story-gallery figcaption span{font-size:9px}
 .process-head h2{font-size:39px;line-height:1.45}
 .process-head p{font-size:13px}
 .flowline{grid-template-columns:repeat(2,1fr);gap:24px 12px}
 .flow-icon{width:87px;height:87px;box-shadow:inset 0 0 0 8px #254738;margin-bottom:17px}
 .flow-icon:before{inset:-5px}
 .flow-icon svg{width:29px;height:29px}
 .flowstep strong{font-size:13px}
 .flowstep small{font-size:11px}
 .process-note{margin-top:45px}
 .process-note p{font-size:12px;line-height:1.8}
 .dashboard-heading,.pricing-heading{margin-bottom:30px}
 .demo-topbar{align-items:flex-start;gap:10px}
 .demo-status{font-size:11px;max-width:50%;line-height:1.65}
 .demo-expand{font-size:11px;padding:9px 11px;gap:5px}
 .demo-expand span{white-space:nowrap}
 .app-shell{display:block;border:5px solid #becabe;border-radius:12px;min-height:0}
 .app-sidebar{padding:15px 10px 11px}
 .app-logo{font-size:21px}
 .app-menu{gap:4px;margin-top:12px}
 .app-menu button{font-size:11px;min-height:38px;padding:8px;gap:5px}
 .app-menu button svg{height:14px;width:14px}
 .app-main{padding:17px 12px}
 .app-top{padding-bottom:17px}
 .app-top h3{font-size:19px}
 .app-top small{font-size:10px}
 .app-metrics{padding:15px 0;gap:6px}
 .metric{min-height:94px;padding:10px 7px}
 .metric>span{font-size:9px;line-height:1.5}
 .metric strong{font-size:28px}
 .metric small{font-size:9px;line-height:1.5;display:block}
 .app-table{padding:13px}
 .app-panel-top{font-size:12px;margin-bottom:15px}
 .table-row{font-size:10px}
 .table-head{font-size:9px}
 .status{font-size:8px}
 .demo-caption{font-size:10px}
 .studio-bottom{font-size:11px}
 .quote-section{height:360px}
 .quote-content{padding-top:65px}
 .quote-content blockquote{font-size:31px;letter-spacing:-1.3px}
 .pricing-grid{grid-template-columns:1fr;gap:19px}
 .plan{min-height:0;padding:23px}
 .plan.featured{transform:none}
 .plan h3{font-size:28px}
 .plan>p{font-size:13px;min-height:0}
 .plan-price{font-size:22px;min-height:77px}
 .plan ul{gap:13px;margin:19px 0 27px}
 .plan li{font-size:13px}
 .plan-btn{font-size:12px}
 .pricing-disclaimer{font-size:11px;line-height:1.9}
 .faq h2{margin:18px 0}
 .faq-intro p{font-size:13px}
 .faq-list summary{font-size:13px;padding:20px 0}
 .faq-list details p{font-size:12px}
 .cta-inner{min-height:540px}
 .cta-copy{padding:65px 0 130px}
 .cta-copy h2{font-size:37px;line-height:1.55;margin:20px 0}
 .cta-copy p{font-size:13px;max-width:96%}
 .cta-photo-wrap{width:176px;height:230px;transform:rotate(5deg);border:4px solid #dba083}
 .cta-section .cta-visual{left:-48px;bottom:-70px;opacity:.68;pointer-events:none}
 .cta-copy small{font-size:10px;max-width:240px;line-height:1.6}
 .footer{padding-top:55px}
 .footer-about p{font-size:13px}
 .footer-columns{gap:88px;margin-top:30px}
 .footer-columns a{font-size:12px}
 .footer-bottom{font-size:10px;line-height:1.8}
 .demo-open .app-shell{inset:9px;z-index:110;border-width:4px;height:calc(100dvh - 18px);overflow:auto;display:block}
 .demo-open .demo-topbar{left:17px;top:16px;right:auto}
 .demo-open .app-main{padding-top:24px}
 .demo-open .app-sidebar{padding-top:64px}
}
@media(max-width:360px){
 .nav-actions .button{padding:9px 10px;font-size:10px}
 .hero h1{font-size:57px}
 .feature{padding:18px 11px;min-height:278px}
 .feature p{font-size:11.5px}
 .feature h3{font-size:14px}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* Accessible dashboard lightbox background and focus treatment */
.demo-backdrop{display:none}
.demo-open .demo-backdrop{display:block;position:fixed;inset:0;background:rgba(13,38,28,.84);z-index:100;cursor:zoom-out}
.demo-open .app-shell{box-shadow:0 20px 100px #0005}
.demo-open #demo-expand{position:relative;z-index:106}
.demo-open .demo-status{visibility:hidden}
:focus-visible{outline:3px solid #ca9164!important;outline-offset:3px}

.demo-close{display:none}
.demo-open .demo-close{display:grid;place-items:center;position:absolute;top:18px;left:18px;width:39px;height:39px;border-radius:50%;background:#f5efe4;color:#183a2b;border:1px solid #d3dacc;z-index:120;box-shadow:0 3px 12px #10261b33}
.demo-open .demo-topbar{visibility:hidden}
@media(max-width:600px){.demo-open .demo-close{top:12px;left:12px;width:37px;height:37px}}

.feature-foot{color:#315844;text-decoration:none;transition:color .2s}
.feature-foot:hover,.feature-foot:focus-visible{color:#9f5b39;text-decoration:underline;text-underline-offset:5px}
.app-menu button{scroll-snap-align:start}
@media(max-width:600px){.app-menu{scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#76937f transparent;gap:7px}.app-menu button{flex-shrink:0}}

/* Sticky navigation: announcement scrolls away; navbar remains anchored to viewport. */
.header{
  position:sticky;
  inset-inline:0;
  top:0;
  z-index:80;
  margin-bottom:-95px;
  background:transparent;
  transition:background-color .25s ease,box-shadow .25s ease;
}
.header.is-stuck{
  background:rgba(249,246,238,.96);
  -webkit-backdrop-filter:blur(16px);
  backdrop-filter:blur(16px);
  box-shadow:0 4px 20px rgba(25,52,39,.075);
}
.header.is-stuck .nav{border-bottom-color:rgba(56,80,62,.12)}
html{scroll-padding-top:110px}
@media(max-width:820px){
  .header{top:0;margin-bottom:-73px}
  .header.is-stuck .nav-links{top:73px}
  html{scroll-padding-top:88px}
}
@media(max-width:600px){
  .header{top:0;margin-bottom:-70px}
  .header.is-stuck .nav-links{top:70px}
  html{scroll-padding-top:84px}
}
@media(prefers-reduced-motion:reduce){.header{transition:none}}

/* Narrow-phone header fit: prevent navigation children from widening the viewport. */
@media(max-width:360px){
  .nav{gap:8px}
  .brand{gap:5px;flex-shrink:0}
  .brand-mark{width:23px}
  .brand-text{font-size:24px;letter-spacing:-1.4px}
  .nav-actions{gap:0;margin-inline-start:auto}
  .nav-actions .button{padding:9px 8px;font-size:10px;gap:4px}
  .nav-actions .button svg{width:13px;height:13px}
  .menu-toggle{padding:5px;flex-shrink:0}
}