/* HUSKY / 03 — custom typography, original brandmarks and restrained motion. */
@font-face{font-family:'Outfit';src:url('assets/fonts/outfit.woff') format('woff');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:'DM Sans';src:url('assets/fonts/dm-sans.woff') format('woff');font-style:normal;font-weight:100 1000;font-display:swap}
:root{--display-font:'Outfit',sans-serif;--body-font:'DM Sans',sans-serif}
body{font-family:var(--body-font)}
h1,h2,h3,.intro>p,#mobileMenu>a{font-family:var(--display-font);font-optical-sizing:auto;}
h1,h2,h3{font-synthesis:none}
.hero h1{font-weight:450;font-size:clamp(68px,7.5vw,114px);letter-spacing:-.035em;line-height:1.02;margin-bottom:46px}
.hero-content{top:36%}
.hero-line{display:block;position:relative;overflow:clip;padding-bottom:.1em;margin-bottom:-.1em}
.hero-line>span{display:block;will-change:transform}
.hero-line-last{overflow:visible}
.hero-ink{position:absolute;left:0;bottom:-11px;width:100%;height:24px;overflow:visible;pointer-events:none}
.hero-ink path{fill:none;stroke:currentColor;stroke-width:1.1;stroke-linecap:round;opacity:.7}
.intro{grid-template-columns:1fr 2.1fr 110px;gap:30px;padding-top:68px;padding-bottom:68px;align-items:center}
.intro>.eyebrow{margin-top:0;margin-bottom:0}
.intro>p{font-weight:400;letter-spacing:-.035em;line-height:1.35;}
.intro-symbol{display:flex;flex-direction:column;align-items:center;gap:18px}
.intro-symbol img{width:88px;height:88px;object-fit:contain;transform:rotate(var(--sun-turn,0deg))}
.intro-symbol>span{font-size:7px;letter-spacing:1.4px;white-space:nowrap}
.collection-image{overflow:visible}
.collection-image>img{overflow:hidden}
.collection-stamp{position:absolute;width:106px;bottom:30px;right:-43px;transform:rotate(11deg);pointer-events:none}
.collection-stamp img{width:106px;height:106px;object-fit:contain}
.collection-stamp span{display:block;text-align:center;white-space:nowrap;font-size:6px;letter-spacing:1px;margin-top:9px}
.collection-copy h2{font-weight:450;letter-spacing:-.035em;line-height:.92;margin-bottom:28px}
.ink-signature{display:block;width:2.9em;height:1.18em;margin:0 0 -.09em -.025em;transform:rotate(-5deg);color:var(--green)}
.ink-lettering{display:block;width:100%;height:auto;overflow:visible}
.collection-note>span{font-family:var(--display-font);font-style:normal;font-weight:450;font-size:29px;letter-spacing:-2px}
.philosophy-copy{position:relative;padding-top:105px}
.philosophy-monogram{position:absolute;top:35px;right:36px;width:43px;height:51px;object-fit:contain;transform:rotate(-9deg)}
.philosophy h2{font-size:clamp(42px,4.3vw,66px);font-weight:450;letter-spacing:-.035em;line-height:1.03;max-width:470px}
.shop-heading h2{font-weight:450;letter-spacing:-.035em;line-height:1.06}
.journal-grid h3{font-weight:450;font-size:22px;letter-spacing:-.035em}
.manifesto h2{font-size:clamp(45px,5.2vw,78px);font-weight:450;letter-spacing:-.035em;line-height:1.02}
.manifesto-emphasis{font-weight:450}
.newsletter h2{font-weight:450;letter-spacing:-.035em}
.footer-brand{display:flex;align-items:center;gap:14px;max-width:210px}
.footer-brand>img{min-width:0;flex:1}
.footer-brand>.footer-mark{width:29px;flex:none;height:36px;object-fit:contain}
.detail-copy h2,.story-text h2,.info-dialog h2,.drawer-heading h2,.empty-cart h3{font-family:var(--display-font);font-weight:450;letter-spacing:-.035em;line-height:1.07}
.button{position:relative;overflow:hidden}
.button>span,.text-link>span{transition:transform .35s cubic-bezier(.2,.75,.25,1)}
.button:hover>span,.text-link:hover>span{transform:translate(3px,-3px)}
.button:hover{transform:none}
.product-photo .product-visual,.photo-open>img,.story-image img{transition:transform .85s cubic-bezier(.2,.65,.25,1)}
.hero-img{transform:translate3d(0,var(--hero-drift,0px),0) scale(1.04)}
.manifesto>img{transform:translate3d(0,var(--coast-drift,0px),0) scale(1.055)}
/* No JavaScript: the complete design stays visible and lettering stays drawn. */
.ink-pen,.ink-finish,.hero-ink path{stroke-dasharray:1;stroke-dashoffset:0}
.motion-ready [data-reveal]{opacity:0;transform:translate3d(0,24px,0);transition:opacity .9s cubic-bezier(.2,.65,.25,1),transform .9s cubic-bezier(.2,.65,.25,1);transition-delay:var(--reveal-delay,0ms)}
.motion-ready [data-reveal].is-visible{opacity:1;transform:translate3d(0,0,0)}
.motion-ready .hero-line>span{transform:translateY(112%);opacity:0;transition:transform 1.2s cubic-bezier(.2,.75,.2,1),opacity .9s;transition-delay:.08s}
.motion-ready .hero-line:nth-child(2)>span{transition-delay:.2s}
.motion-ready .hero.is-visible .hero-line>span{transform:translateY(0);opacity:1}
.motion-ready .hero .hero-content>.eyebrow,.motion-ready .hero .hero-content>.button{opacity:0;transform:translateY(12px);transition:opacity 1s,transform 1s;transition-delay:.35s}
.motion-ready .hero.is-visible .hero-content>.eyebrow,.motion-ready .hero.is-visible .hero-content>.button{opacity:1;transform:translateY(0)}
.motion-ready .hero-ink path,.motion-ready .ink-pen,.motion-ready .ink-finish{stroke-dashoffset:1}
.motion-ready .hero.is-visible .hero-ink path{animation:ink-write 1.25s cubic-bezier(.4,0,.2,1) .8s forwards}
.motion-ready .ink-signature.is-visible .ink-pen{animation:ink-write .65s linear calc(.18s + var(--ink-delay)) forwards}
.motion-ready .ink-signature.is-visible .ink-finish{animation:ink-write .7s cubic-bezier(.4,0,.2,1) 1.6s forwards}
@keyframes ink-write{to{stroke-dashoffset:0}}
@media(min-width:701px) and (max-width:1000px){.intro{grid-template-columns:1fr 2fr 80px;gap:25px}.intro-symbol img{width:72px;height:72px}.intro-symbol>span{font-size:6px}.collection-stamp{width:86px;right:-22px}.collection-stamp img{width:86px;height:86px}.philosophy h2{font-size:45px}.philosophy-copy{padding-top:100px}}
@media(max-width:700px){
 .hero h1{font-size:clamp(52px,14.8vw,75px);letter-spacing:-.035em;line-height:1.04;margin-bottom:37px}
 .hero-content{top:auto;bottom:125px;max-width:89%}
 .hero-ink{bottom:-11px;height:20px}
 .intro{grid-template-columns:minmax(0,1fr) 68px;gap:18px;padding-top:40px;padding-bottom:40px}
 .intro>.eyebrow{grid-column:1/-1;font-size:7px}
 .intro>p{font-size:21px;line-height:1.36;letter-spacing:-.04em}
 .intro>p br{display:none}
 .intro-symbol{gap:11px}
 .intro-symbol img{width:62px;height:62px}
 .intro-symbol>span{font-size:5px;letter-spacing:.55px}
 .collection-stamp{bottom:-20px;right:9px;width:85px}
 .collection-stamp img{width:85px;height:85px}
 .collection-stamp>span{font-size:5px;letter-spacing:.6px;margin-top:7px}
 .collection-copy{padding-top:50px}
 .collection-copy h2{font-size:88px;line-height:.92;letter-spacing:-.035em}
 .philosophy-copy{padding-top:85px}
 .philosophy-monogram{top:24px;right:24px;width:35px;height:41px}
 .philosophy h2{font-size:clamp(39px,11vw,50px);letter-spacing:-.035em;line-height:1.04}
 .shop-heading h2{font-size:38px;letter-spacing:-.035em}
 .manifesto h2{font-size:44px;letter-spacing:-.035em;line-height:1.02}
 .journal-grid h3{font-size:25px;letter-spacing:-.035em}
 .footer-brand{width:180px;max-width:none}
 .footer-brand>.footer-mark{width:27px;height:33px}
 .detail-copy h2{font-size:34px}
 .motion-ready [data-reveal]{transform:translate3d(0,16px,0)}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .hero-img,.manifesto>img,.scroll-sun{transform:none!important}
 .motion-ready [data-reveal],.motion-ready .hero-line>span,.motion-ready .hero .hero-content>.eyebrow,.motion-ready .hero .hero-content>.button{opacity:1!important;transform:none!important}
 .ink-pen,.ink-finish,.hero-ink path{stroke-dashoffset:0!important;animation:none!important}
 *,*:before,*:after{transition:none!important;animation:none!important}
}
/* 03 / shop navigation and quieter product labels. */
.account-button{display:flex;align-items:center;gap:9px;padding:7px 0;font-size:12px;white-space:nowrap}
.account-button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.35}
.nav-tools{gap:22px}
.bag{font-size:12px}
.bag svg{display:block;stroke-linejoin:round;stroke-linecap:round}
.footer-brand{max-width:180px;gap:0}
.image-tag{font-size:11px;line-height:1.4;font-weight:500;letter-spacing:1.2px;left:22px;bottom:22px;padding:10px 13px;background:var(--paper);color:var(--ink)}
.collection-stamp{transform:none;bottom:44px}
.collection-stamp img{animation:husky-orbit 60s linear infinite;transform-origin:center}
.collection-stamp span{position:absolute;left:50%;bottom:-31px;transform:translateX(-50%);font-size:9px;line-height:1.4;font-weight:500;letter-spacing:.8px;padding:7px 10px;background:var(--paper);color:var(--ink);margin:0;white-space:nowrap}
@keyframes husky-orbit{to{transform:rotate(360deg)}}
/* Use a calm baseline in text fields, without the rectangular focus frame. */
input:focus-visible{outline:none;box-shadow:none}
.search-dialog>input:focus,.search-dialog>input:focus-visible{outline:none;outline-offset:0;box-shadow:none;border-bottom-color:var(--ink)}
.search-dialog>input{border-radius:0;-webkit-appearance:none;appearance:none}
.account-dialog{width:450px;padding:50px 38px 35px}
.account-dialog h2{font-family:var(--display-font);font-size:40px;font-weight:450;letter-spacing:-.035em;line-height:1.1;margin:0 0 15px}
.account-dialog>.eyebrow{margin-bottom:19px}
.account-intro{font-size:13px;line-height:1.7;color:var(--muted);margin:0 0 28px}
.account-dialog label{display:block;font-size:11px;margin:22px 0 8px}
.account-dialog input{display:block;width:100%;padding:10px 0 13px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;color:var(--ink);font-size:15px}
.account-dialog input:focus{outline:0;border-bottom-color:var(--ink)}
.account-dialog .button{width:100%;margin-top:28px}
.account-status{font-size:10px;line-height:1.6;color:var(--muted);margin:15px 0 0}
@media(max-width:1000px) and (min-width:701px){header nav{gap:22px}.nav-tools{gap:15px}.account-button{gap:7px}.collection-stamp span{font-size:8px;letter-spacing:.5px}}
@media(max-width:700px){
 .nav-tools{gap:11px}
 .account-button{padding:7px}
 .account-button .desktop{display:none}
 .hero h1{letter-spacing:-.035em}
 .image-tag{font-size:9px;left:14px;bottom:17px;letter-spacing:.75px;padding:9px 10px}
 .collection-stamp{bottom:48px;right:14px;width:76px}
 .collection-stamp img{width:76px;height:76px}
 .collection-stamp span{bottom:-27px;font-size:7px;letter-spacing:.5px;padding:6px 8px}
 .footer-brand{width:165px}
 .account-dialog{padding:45px 26px 28px}
}
@media(prefers-reduced-motion:reduce){.collection-stamp img{animation:none!important}}