/* Seven approved three-color palettes. Every section owns its surface/text pair. */
:root{color-scheme:light;--ink:var(--ink-base);--paper:#fffaf5;--purple:var(--main-em);--lilac:var(--accent-base);--pale:var(--main-light);--muted:var(--main-muted);--surface:var(--main-bg);--text:var(--main-text);--text-muted:var(--main-muted);--em:var(--main-em);--line:color-mix(in srgb,var(--main-text) 27%,transparent);--secondary:var(--accent-base);--on-accent:var(--accent-text);--metal-highlight:#f6e4b2}
body{background:var(--main-bg);color:var(--text)}
.palette-filters{position:absolute;overflow:hidden;pointer-events:none}
.hero{--surface:var(--main-bg);--text:var(--main-text);--text-muted:var(--main-muted);--em:var(--main-em);background:var(--surface);color:var(--text)}
.hero{background-image:radial-gradient(ellipse at 76% 46%,var(--hero-glow),transparent 66%)}
.about{--surface:var(--light-bg);--text:var(--light-text);--text-muted:var(--light-muted);--em:var(--light-em);background:var(--surface);color:var(--text)}
.strategy{--surface:var(--tint-bg);--text:var(--tint-text);--text-muted:var(--tint-muted);--em:var(--tint-em);background:var(--surface);color:var(--text)}
.results{--surface:var(--accentlight-bg);--text:var(--accentlight-text);--text-muted:var(--accentlight-muted);--em:var(--accentlight-em);background:var(--surface);color:var(--text)}
.brands{--surface:var(--dark-bg);--text:var(--dark-text);--text-muted:var(--dark-muted);--em:var(--dark-em);background:var(--surface);color:var(--text)}
.team{--surface:var(--deep-bg);--text:var(--deep-text);--text-muted:var(--deep-muted);--em:var(--deep-em);background:var(--surface);color:var(--text)}
.approach{--surface:var(--dark-bg);--text:var(--dark-text);--text-muted:var(--dark-muted);--em:var(--dark-em);background:var(--surface);color:var(--text)}
.contact{--surface:var(--contact-bg);--text:var(--contact-text);--text-muted:var(--contact-muted);--em:var(--contact-em);background:var(--surface);color:var(--text)}
.footer,.mobile-menu,.site-header.is-scrolled{--surface:var(--ink-bg);--text:var(--ink-text);--text-muted:var(--ink-muted);--em:var(--ink-em);background:var(--surface);color:var(--text);color-scheme:dark}
.hero,.brands,.about,.approach,.strategy,.team,.results,.contact,.footer,.mobile-menu{--line:color-mix(in srgb,var(--text) 27%,transparent)}
.brands,.results{border-block:1px solid var(--line)}
.site-header{color:var(--main-text);--text:var(--main-text)}
.site-header.is-scrolled{background:color-mix(in srgb,var(--ink-base) 97%,transparent)}
.brand img{filter:brightness(0)}
.site-header.is-scrolled .brand img,.footer-brand img{filter:brightness(0) invert(1)}
.desktop-nav a:after{background:var(--accent-base)}
.desktop-nav a:hover{background:var(--accent-soft);color:var(--ink-base);border-radius:3px}
.motion-toggle,.color-toggle{border-color:currentColor}
.menu-toggle span{background:currentColor}
.mobile-menu a{border-color:var(--line)}
.mobile-menu a span,.mobile-menu p{color:var(--ink-em)}
.mobile-menu a:hover{background:var(--accent-base);color:var(--ink-base)}
.mobile-menu a:hover span{color:inherit}
.hero h1 .line:nth-child(2)>em,.display-title em,.approach .display-title em,.manifesto-text em,.results h2 em,.contact-heading h2 em,.benefit p em,.service[open] h3{color:var(--em)}
.hero-description,.hero-bottom,.about-lead p+p,.mission-columns,.approach-heading>p,.service-number,.service-copy,.services-note,.subtle,.benefit>span:first-child,.strategy-heading .muted,.strategy-bottom p,.team-copy>p:not(.eyebrow),.results-copy>p:not(.eyebrow),.contact-info>p,.address address,.contact-form .optional,.form-bottom>p,.footer-top p,.footer-bottom,.footer-bottom>span:last-child,.muted{color:var(--text-muted)}
.brands-heading>.eyebrow{color:var(--text-muted)}
.small-cross{color:var(--text)}
.section-index,.approach .section-index{color:var(--text);opacity:1}
.tiny-mark,.lavender-dot,.benefit>span:last-child{color:var(--em)}
.status-dot{background:var(--accent-base);box-shadow:0 0 17px color-mix(in srgb,var(--accent-base) 60%,transparent)}
.hero-art{mix-blend-mode:normal;mask-image:radial-gradient(ellipse 56% 50% at 55% 50%,#000 60%,transparent 100%)}
.hero-art img{filter:url('#puhu-hero-materials');transition:transform 1s}
.hero-seal>svg{fill:var(--metal-highlight)}.hero-seal>span{color:var(--metal-highlight)}
.hero-bottom,.mission,.benefit,.strategy-bottom,.contact-heading,.footer-bottom{border-color:var(--line)}
.round-icon,.back-top span{border-color:var(--text)}
.round-link:hover .round-icon,.back-top:hover span{background:var(--accent-base);color:var(--accent-text);border-color:var(--ink-base)}
.client-logo,.client-logo:nth-child(n+7){border-color:var(--line)}
.client-logo img,.client-logo img.sanipak-logo{mix-blend-mode:normal;filter:brightness(0) invert(var(--dark-invert));opacity:.85}
.client-logo:hover img,.client-logo:hover img.sanipak-logo{filter:brightness(0) invert(var(--dark-invert));opacity:1}
.client-logo img.sanipak-logo{padding:0 5px}
.manifesto-panel{--surface:var(--main-bg);--text:var(--main-text);--text-muted:var(--main-muted);--em:var(--main-em);background:var(--surface);color:var(--text);border:1px solid color-mix(in srgb,var(--ink-base) 25%,transparent)}
.manifesto-panel p{color:var(--text-muted)}
.manifesto-owl{filter:brightness(0);opacity:.07}
.photo-panel,.team-visual{background:var(--ink-base)}
.photo-panel>img,.team-visual>img,.results-image>img{filter:none;mix-blend-mode:normal;opacity:1;transition:transform 1s}
.photo-panel figcaption,.team-caption{z-index:2;background:linear-gradient(transparent,color-mix(in srgb,var(--ink-base) 96%,transparent));color:#fffaf5}
.photo-panel figcaption>span+span,.team-caption span+span{color:var(--accent-light)}
.steps{gap:22px;margin-bottom:33px}
.step{--surface:var(--main-bg);--text:var(--main-text);--text-muted:var(--main-muted);--em:var(--main-em);background:var(--surface);color:var(--text);padding:28px 25px 32px;border:1px solid color-mix(in srgb,var(--ink-base) 32%,transparent);box-shadow:none;transition:transform .35s,box-shadow .35s}
.step:nth-child(2){--surface:var(--accent-bg);--text:var(--accent-text);--text-muted:var(--accent-muted);--em:var(--accent-em)}
.step:nth-child(3){--surface:var(--shade-bg);--text:var(--shade-text);--text-muted:var(--shade-muted);--em:var(--shade-em)}
.step:hover{transform:translateY(-5px);box-shadow:0 12px 28px color-mix(in srgb,var(--ink-base) 16%,transparent);border-color:var(--text)}
.step h3,.step>.eyebrow{color:var(--text)}
.step p{color:var(--text-muted)}
.step-number,.step:hover .step-number{color:var(--em)}
.step .step-arrow{color:var(--accent-text);background:var(--accent-base);border:1px solid var(--ink-base);border-radius:50%;width:40px;height:40px;display:grid;place-items:center;font-size:26px;margin-right:0}
.step:nth-child(2) .step-arrow{background:var(--ink-base);color:var(--accent-light)}
.header-cta,.dark-button,.contact-arrow{background:var(--accent-base);color:var(--accent-text);border:1px solid var(--ink-base)}
.header-cta:hover,.dark-button:hover,.contact-arrow:hover{background:var(--vivid-bg);color:var(--vivid-text);border-color:var(--ink-base);box-shadow:0 7px 22px color-mix(in srgb,var(--ink-base) 18%,transparent)}
.contact-email,.contact-form input,.contact-form textarea{border-color:var(--contact-text)}
.contact-email span{color:var(--contact-text)}
.contact-form input,.contact-form textarea{color:var(--contact-text);caret-color:var(--ink-base);color-scheme:light}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:var(--contact-muted);opacity:1}
.contact-form input:hover,.contact-form textarea:hover{background:color-mix(in srgb,var(--accent-light) 14%,transparent)}
.contact-form input:focus-visible,.contact-form textarea:focus-visible{background:var(--main-soft);outline:2px solid var(--ink-base);outline-offset:4px;border-color:var(--ink-base);box-shadow:0 0 0 2px var(--accent-base)}
.contact-form input:focus-visible::placeholder,.contact-form textarea:focus-visible::placeholder{color:var(--ink-base)}
.site-shell :is(button,a,summary):focus-visible{outline:2px solid var(--text);outline-offset:5px;box-shadow:0 0 0 2px var(--accent-base)}
.results-image>span{background:var(--ink-base);color:var(--ink-text);border:1px solid var(--accent-light)}
.service-art[data-scene]{--surface:var(--shade-bg);--text:var(--shade-text);--text-muted:var(--shade-muted);--em:var(--shade-em);background:var(--surface);color:var(--text);border-color:var(--accent-base)}
.service-art:before{background:radial-gradient(ellipse at 62% 62%,color-mix(in srgb,var(--accent-base) 20%,transparent),transparent 62%)}
.art-corner{color:var(--text-muted)}
.orbit{border-color:var(--main-soft);box-shadow:0 0 18px color-mix(in srgb,var(--main-base) 13%,transparent)}
.orbit-two{border-color:var(--accent-base);box-shadow:0 0 22px color-mix(in srgb,var(--accent-base) 22%,transparent)}
.orbit-three{border-color:var(--accent-deep)}
.art-core{background:radial-gradient(circle at 35% 30%,var(--main-light),var(--main-base) 45%,var(--main-dark));box-shadow:inset 3px 5px 12px color-mix(in srgb,var(--accent-light) 40%,transparent),0 0 65px color-mix(in srgb,var(--accent-base) 25%,transparent)}
.art-dot-one{background:var(--main-light);box-shadow:0 0 20px var(--main-soft)}
.art-dot-two{background:var(--accent-base);box-shadow:0 0 23px var(--accent-base)}
.art-word{color:var(--accent-light)}
.service,.service:last-of-type{border-color:var(--line)}
.service summary:hover{background:color-mix(in srgb,var(--dark-bg) 93%,var(--ink-base))}
.service-plus:before,.service-plus:after{background:var(--text)}
.service-tag{background:var(--accent-base);color:var(--accent-text);border-color:var(--ink-base)}
.skip-link{background:var(--accent-light);color:var(--ink-base)}
::selection{background:var(--accent-light);color:var(--ink-base)}
/* The smaller typographic ribbon mixes three distinct professional typefaces. */
.marquee{height:62px;padding:0;display:flex;align-items:center;background:var(--accent-base);color:var(--accent-text);border-block:1px solid var(--ink-base)}
.marquee-track{align-items:center;animation-duration:32s}
.marquee-group{display:flex;align-items:center;gap:34px;padding-right:34px;flex-shrink:0;white-space:nowrap;min-height:62px}
.marquee-phrase{display:block;line-height:1.2}
.marquee-phrase.type-sans{font-family:'Montserrat',var(--sans);font-size:18px;font-weight:600;letter-spacing:.1em}
.marquee-phrase.type-serif{font-family:'IBM Plex Serif',Georgia,serif;font-size:25px;font-style:italic;font-weight:500;letter-spacing:-.02em}
.marquee-phrase.type-hand{font-family:'Caveat',cursive;font-size:32px;font-weight:500;letter-spacing:0}
.marquee-group>i{margin:0;font-size:17px;line-height:1;font-style:normal;color:var(--accent-text);opacity:1}
.color-toggle{display:grid;place-items:center;flex-shrink:0;width:33px;height:33px;padding:4px;border:1px solid hsl(var(--theme-h,267) 13% 48%);border-radius:50%;background:transparent;transition:transform .25s}
.color-toggle:hover{transform:rotate(25deg)}
.color-toggle-orb{display:block;width:20px;height:20px;border-radius:50%;background:radial-gradient(ellipse at 28% 24%,#fff 0%,#fff8 6%,transparent 26%),radial-gradient(circle at 40% 36%,var(--main-base) 15%,var(--main-dark) 79%,var(--ink-base) 100%);box-shadow:inset -1px -1px 2px #fff5}
.header-cta .cta-label{font-size:11px;line-height:1.4}
.color-toggle[hidden],:root:not([data-palette]) .color-toggle{display:none}
/* A keyboard-accessible observatory for the seven floating color spheres. */
.theme-pending .site-shell{visibility:hidden}
.theme-pending .site-shell *{animation-play-state:paused!important}
.theme-pending body,.color-is-open body{overflow:hidden}
.color-dialog{--preview:#b18cd1;--preview-h:274;position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#090a10;color:#eeedf2;overflow:auto;overscroll-behavior:contain;isolation:isolate;outline:0}
.color-dialog::backdrop{background:#090a10}
.color-dialog[open]{display:block}.color-dialog:not([open]){display:none}
.color-space{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.color-space canvas{display:block;width:100%;height:100%;opacity:0;transition:opacity .5s}
.color-dialog.has-webgl .color-space canvas{opacity:1}
.color-dialog-inner{position:relative;z-index:2;max-width:1600px;min-height:100dvh;margin:auto;padding:30px var(--gutter) 28px;display:flex;flex-direction:column;justify-content:space-between;gap:30px;pointer-events:none}
.color-dialog-inner button,.color-dialog-inner a{pointer-events:auto}
.color-top{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:59px}
.color-top>img{width:61px;height:auto;filter:brightness(0) invert(1)}
.color-top>span{font-size:8px;letter-spacing:.18em;color:#a6a1b3;margin-left:auto}
.color-close{background:#0e101680;border:1px solid #5d586c;color:#eee3f4;width:36px;height:36px;border-radius:50%;font-size:25px;line-height:1;padding:0 0 3px}
.color-close[hidden]{display:none}
.color-intro{text-align:center;margin-top:7px}
.color-intro>.eyebrow{color:#a6a1b3;font-size:8px;letter-spacing:.24em;margin-bottom:26px}
.color-intro h2{font-size:clamp(64px,7.4vw,108px);font-weight:500;letter-spacing:-.06em;line-height:1.03;word-spacing:.075em}
.color-intro h2 em{display:inline-block;font-size:1.14em;color:var(--preview);padding-right:.13em;transition:color .4s;position:relative}
.color-ambient{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 76%,hsl(var(--preview-h) 30% 18% / .55),transparent 60%),radial-gradient(ellipse at 22% 5%,#35334a25,transparent 45%);transition:background 1s}
.color-ambient:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 100%,transparent 30%,#05060b60 85%)}
.color-stars{position:fixed;inset:0;pointer-events:none;opacity:.75;z-index:0}
.color-stars i{position:absolute;width:2px;height:2px;border-radius:50%;background:#d7d6ed;box-shadow:0 0 5px #d7d6ed65;animation:star-twinkle var(--twinkle,5s) ease-in-out infinite;animation-delay:var(--delay,0s)}
.has-webgl .color-stars{opacity:.24}
.color-palette{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:22px;max-width:1110px;width:100%;margin:3px auto 16px;align-items:start}
.color-option{position:relative;min-width:0;background:none;border:0;color:#d6d3de;padding:20px 0 5px;display:flex;flex-direction:column;align-items:center;gap:0;border-radius:80px 80px 20px 20px;outline-offset:7px;cursor:pointer;transform:translateY(var(--lift,0px))}
.color-option:nth-child(1),.color-option:nth-child(7){--lift:12px}.color-option:nth-child(2),.color-option:nth-child(6){--lift:-6px}.color-option:nth-child(3),.color-option:nth-child(5){--lift:10px}.color-option:nth-child(4){--lift:-14px}
.color-option:focus-visible{outline:1px solid var(--chip);outline-offset:7px;background:color-mix(in srgb,var(--chip) 4%,transparent)}
.sphere-slot{width:min(100%,116px);aspect-ratio:1;display:block;position:relative;isolation:isolate;flex-shrink:0;margin-bottom:28px}
.sphere-fallback{display:block;width:100%;height:100%;border-radius:50%;background:radial-gradient(ellipse 22% 14% at 29% 22%,#ffffffe8 1%,#ffffff8a 36%,transparent 83%),radial-gradient(ellipse 9% 43% at 85% 51%,#ffffff8c 0%,transparent 72%),radial-gradient(ellipse 80% 26% at 50% 98%,#ffffff59,transparent 60%),radial-gradient(circle at 37% 29%,var(--chip-light) 6%,var(--chip) 37%,var(--chip-deep) 72%,color-mix(in srgb,var(--chip-dark) 60%,#080910) 100%);box-shadow:inset -1px -2px 3px #ffffff50,0 15px 30px #0005;animation:sphere-float 6s ease-in-out infinite;animation-delay:calc(var(--index)*-.7s);transition:opacity .35s}
.has-webgl .sphere-fallback{opacity:0}
.pantone-label{display:block;font-size:7px;letter-spacing:.18em;font-weight:500;color:#b0aabd;margin-bottom:3px;transition:color .3s}
.pantone-code{font-size:12px;letter-spacing:.035em;white-space:nowrap;line-height:1.5;font-weight:500;transition:color .3s}
.pantone-code small{font-size:8px;font-weight:400;margin-left:3px;color:#a6a0b1}
.color-current{width:4px;height:4px;margin-top:11px;border-radius:50%;background:var(--chip);opacity:0;transition:opacity .3s}
.color-option[aria-pressed='true'] .color-current{opacity:1}
.color-option:hover .pantone-code,.color-option:focus-visible .pantone-code{color:var(--chip)}
.color-option:hover .pantone-label,.color-option:focus-visible .pantone-label{color:#eeeaf6}
.color-bottom{display:flex;justify-content:space-between;align-items:end;gap:25px;border-top:1px solid #89839933;padding-top:18px;font-size:10px;color:#b4adbf}
.color-bottom>p{line-height:1.8;font-size:10px}.color-bottom>p>span{color:#a6a0b1}
.color-default{font-size:10px;color:#d4ccdf;background:none;border:0;border-bottom:1px solid #625b70;padding:3px 0 6px;display:flex;align-items:center;gap:20px}
.color-default>span{font-size:18px;line-height:1}
.color-motion{font-size:9px;color:#b4adbf;background:none;border:0;padding:6px 0;display:flex;align-items:center;gap:9px}
.color-motion-symbol{border:1px solid #736a82;width:23px;height:23px;display:grid;place-items:center;border-radius:50%;font-size:10px}
.color-motion:disabled{opacity:.7;cursor:default}
.color-wash{position:fixed;left:var(--origin-x,50%);top:var(--origin-y,60%);width:24vmax;height:24vmax;background:var(--wash,#16121d);border-radius:50%;z-index:4;pointer-events:none;transform:translate(-50%,-50%) scale(0);opacity:0;transition:transform .85s cubic-bezier(.6,0,.25,1),opacity .2s;box-shadow:0 0 120px 40px var(--wash)}
.color-dialog.is-choosing .color-wash{opacity:1;transform:translate(-50%,-50%) scale(16)}
.color-dialog.is-choosing{animation:color-depart .88s both}
.color-dialog.is-choosing .color-dialog-inner{transition:transform .7s,opacity .45s;transform:scale(1.03);opacity:0;pointer-events:none}
.color-dialog.is-choosing .color-dialog-inner button{pointer-events:none}
@keyframes sphere-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes star-twinkle{0%,100%{opacity:.2}50%{opacity:.85}}
@keyframes color-depart{0%,55%{opacity:1}100%{opacity:0}}
@media(max-width:1100px){.desktop-nav{gap:16px;margin-left:0}.header-actions{gap:10px}.color-palette{gap:15px;max-width:920px}.sphere-slot{max-width:101px}.color-intro h2{font-size:86px}.pantone-code{font-size:10px}.pantone-code small{font-size:7px}}
@media(max-width:760px){.marquee{height:49px}.marquee-group{gap:23px;padding-right:23px;min-height:49px}.marquee-phrase.type-sans{font-size:13px;letter-spacing:.08em}.marquee-phrase.type-serif{font-size:19px}.marquee-phrase.type-hand{font-size:26px}.marquee-group>i{font-size:13px}.color-toggle{width:28px;height:28px;padding:4px}.color-toggle-orb{width:17px;height:17px}.header-actions{gap:11px}.header-cta{width:33px;height:33px;padding:0;display:grid;place-items:center}.header-cta .cta-label{display:none}.client-logo img.sanipak-logo{padding:0 4px}.color-dialog-inner{padding:23px 24px 22px;gap:28px}.color-top{min-height:45px}.color-top>img{width:48px}.color-top>span{font-size:6px;letter-spacing:.1em;max-width:153px;text-align:right}.color-close{width:30px;height:30px;font-size:23px}.color-intro{margin-top:4px}.color-intro>.eyebrow{font-size:7px;letter-spacing:.17em;margin-bottom:20px}.color-intro h2{font-size:63px}.color-palette{grid-template-columns:repeat(8,minmax(0,1fr));gap:18px 10px;max-width:380px;margin:12px auto 10px}.color-option{grid-column:span 2;gap:0;border-radius:45px 45px 14px 14px;padding:10px 0 4px;transform:none!important}.color-option:nth-child(5){grid-column:2 / span 2}.sphere-slot{width:67px;max-width:100%;margin-bottom:16px}.pantone-label{font-size:5.5px;letter-spacing:.12em;margin-bottom:1px}.pantone-code{font-size:9px;letter-spacing:.01em}.pantone-code small{font-size:6px;margin-left:2px}.color-current{margin-top:7px;width:3px;height:3px}.color-option:focus-visible{outline-offset:3px}.color-bottom{flex-wrap:wrap;gap:17px 15px;padding-top:17px;align-items:center}.color-bottom>p{font-size:8px}.color-default{font-size:9px;gap:11px}.color-motion{font-size:8px;margin:0 auto;padding:0}.color-motion-symbol{width:20px;height:20px;font-size:8px}}
@media(max-width:360px){.color-dialog-inner{padding:17px 20px 20px;gap:22px}.color-intro h2{font-size:53px}.color-top>span{max-width:135px;font-size:5.5px}.sphere-slot{width:57px}.color-palette{gap:14px 8px}.color-default{font-size:8px}.pantone-code{font-size:8px}.pantone-code small{font-size:5.5px}}
@media(max-height:720px) and (min-width:761px){.color-dialog-inner{padding-top:20px;padding-bottom:20px;gap:16px}.color-intro{margin-top:0}.color-intro h2{font-size:67px}.color-intro>.eyebrow{margin-bottom:17px}.color-palette{margin:0 auto 5px;max-width:970px}.sphere-slot{width:90px;margin-bottom:19px}.color-bottom{padding-top:12px}}
@media(max-height:720px) and (max-width:760px){.color-dialog-inner{gap:18px}.color-intro h2{font-size:49px}.color-intro>.eyebrow{margin-bottom:13px}.sphere-slot{width:53px;margin-bottom:13px}.color-palette{gap:8px;margin:0 auto}.color-bottom{padding-top:12px;gap:10px}.color-top{min-height:37px}.color-top>img{width:41px}}
@media(prefers-reduced-motion:reduce){.color-dialog.is-choosing{opacity:0}.sphere-fallback,.color-stars i{animation:none}.hero-art img,.team-visual>img{transition:none}}
#color-title:focus{outline:none}
@media(min-width:761px){.pantone-label{font-size:8px}.pantone-code{font-size:12px}}

.pantone-code small{font-size:.82em;color:inherit;margin-left:2px}
@media(min-width:761px){.pantone-code{font-size:14px}}

@media(max-width:760px){.steps{gap:15px;margin-bottom:28px}.step{padding:24px 20px;grid-template-columns:54px minmax(0,1fr);column-gap:18px}.step-number{font-size:58px}.step p{font-size:12px}.step h3{font-size:26px}.step-top{margin-bottom:0}}

.site-header .motion-toggle,.site-header .color-toggle{border-color:currentColor}
/* Keep the chosen ink readable when the mobile menu covers the hero. */
.menu-open .site-header{--text:var(--ink-text);color:var(--ink-text);background:var(--ink-base)}
.menu-open .site-header .brand img{filter:brightness(0) invert(1)}
/* Let the mobile artwork follow the copy, at every text size and width. */
@media(max-width:760px){.hero{display:flex;flex-direction:column;padding-bottom:110px}.hero-content{display:contents}.hero-eyebrow{order:1}.hero h1{order:2}.hero-description{order:3}.hero-art{order:4;position:relative;top:auto;right:auto;width:calc(100% + 2 * var(--gutter));margin:16px calc(-1 * var(--gutter)) 0;opacity:1}.hero .round-link{order:5;align-self:flex-start;margin-top:14px}}
@media(min-width:761px) and (max-width:1100px){.hero-art{width:82%;right:-25%;top:clamp(210px,calc(500px - 25vw),305px)}}