@font-face{font-family:Theano;src:url('/assets/theano.ttf') format('truetype');font-display:swap}@font-face{font-family:Inter;src:url('/assets/inter.ttf') format('truetype');font-weight:100 900;font-display:swap}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#0c0c0c;color:#f1eae2;font-family:Inter,Arial,sans-serif}a{color:inherit;text-decoration:none}a:focus-visible{outline:2px solid #f1eae2;outline-offset:5px}img{display:block;width:100%;object-fit:cover}.eyebrow,.site-header,.piece-row span,.back,.back-link{font-size:11px;font-weight:600;letter-spacing:.14em;color:#848484}.site-header{max-width:1400px;margin:auto;height:83px;padding:0 32px;display:flex;align-items:center;justify-content:space-between}.site-header a{color:#f1eae2}.opening{max-width:1400px;margin:auto;padding:0 32px;display:grid;grid-template-columns:35% 35% 30%;height:clamp(660px,62vw,850px);align-items:end}.opening-title{align-self:end;z-index:1}.opening-title h1{font:400 clamp(58px,6.5vw,90px)/.86 Theano,serif;letter-spacing:-.08em;margin:0 0 14px}.opening-logo{align-self:center}.opening-logo img{object-fit:contain}.opening-portrait{height:100%}.opening-portrait img{height:100%;object-position:center top}.intro{text-align:center;padding:32px 20px 65px;font-size:16px;line-height:1.5}.intro p{margin:0 0 20px}.down{display:block;font-size:23px;margin-top:30px}.catalogue-link{max-width:1148px;margin:0 auto;min-height:64px;border-top:1px solid #303030;border-bottom:1px solid #303030;display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:600;letter-spacing:.08em}.catalogue-link span:last-child{font-size:18px;font-weight:400}.vision{max-width:1082px;margin:94px auto 170px;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}.vision-image img{aspect-ratio:542/700;object-fit:cover}.vision-copy{padding-top:12px}.vision-copy h2{font:400 clamp(60px,6.4vw,88px)/.88 Theano,serif;letter-spacing:-.035em;margin:22px 0 24px;max-width:470px}.vision-copy p,.featured-copy p{font-size:16px;line-height:1.45;margin:0 0 24px;max-width:410px}.catalogue{max-width:1082px;margin:0 auto 120px}.catalogue-heading{display:grid;grid-template-columns:45% 55%;align-items:end;margin-bottom:44px}.catalogue-heading h2{font:400 48px/1 Theano,serif;margin:0}.featured{display:grid;grid-template-columns:68% 1fr;gap:30px;align-items:end}.featured .featured-media>a img{width:100%;aspect-ratio:1/1;object-fit:cover}.featured-copy{padding-bottom:32px}.featured-copy h3{font:400 40px/.95 Theano,serif;margin:16px 0}.featured-copy p{margin:20px 0}.view-link{font-size:11px;color:#848484;font-weight:600;letter-spacing:.14em}.rows{margin-top:44px}.piece-row{border-top:1px solid #303030;display:flex;align-items:center;gap:16px;padding:19px 0;min-height:120px}.piece-row img{width:65px;height:80px;object-fit:cover}.piece-row h3{font:400 28px/1 Theano,serif;margin:0 0 6px}.piece-row b{font-weight:400;margin-left:auto}.footer{margin:0 auto;max-width:1400px;min-height:650px;background:url('/assets/footer-logo.png') center center/cover no-repeat;display:flex;align-items:end;justify-content:center;text-align:center;padding:0 20px 120px}.footer>div{display:grid;justify-items:center;gap:24px}.instagram-pill{display:inline-flex;align-items:center;gap:8px;background:#f1eae2;color:#0c0c0c;border-radius:24px;padding:10px 18px;font-size:10px;letter-spacing:.08em;font-weight:700}.available{max-width:1082px;margin:auto;padding:30px 0 100px}.back-link,.back{display:inline-block;margin-bottom:24px}.available-heading{display:flex;justify-content:space-between;align-items:end;border-bottom:1px solid #303030;padding:0 0 22px;margin-bottom:47px}.available-heading h1{font:400 68px/.85 Theano,serif;margin:0}.available-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px 26px}.available-grid img{aspect-ratio:1/1;object-fit:cover}.available-grid h2{font:400 34px/1 Theano,serif;margin:20px 0 8px}.product{max-width:1100px;margin:auto;padding:30px 20px 80px}.product-layout{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start}.gallery{display:grid;gap:12px}.gallery img{width:100%}.product-info{position:sticky;top:64px;padding-top:20px}.product-info h1{font:400 clamp(60px,6vw,88px)/.83 Theano,serif;margin:24px 0}.product-info p{font-size:16px;line-height:1.5;margin:24px 0 18px}.pill{border:1px solid #f1eae2;border-radius:30px;padding:14px 20px;display:inline-block;font-size:10px;letter-spacing:.12em;white-space:nowrap}.light{background:#f1eae2;color:#0c0c0c;font-weight:bold}
@media(max-width:1190px){.catalogue-link{margin-left:4%;margin-right:4%}.vision,.catalogue,.available{margin-left:6.5%;margin-right:6.5%}}@media(max-width:700px){.site-header{height:70px;padding:0 20px}.opening{height:auto;min-height:600px;padding:0 20px;grid-template-columns:1fr 1fr;position:relative}.opening-title{position:absolute;left:20px;bottom:0}.opening-title h1{font-size:clamp(49px,10vw,72px)}.opening-logo{align-self:center}.opening-portrait{height:600px}.intro{padding:48px 20px 50px;font-size:14px}.catalogue-link{margin:0 20px}.vision{margin:70px 20px 110px;display:block}.vision-image img{aspect-ratio:4/5}.vision-copy{padding-top:36px}.vision-copy h2{font-size:clamp(48px,11vw,70px)}.catalogue{margin:0 20px 90px}.catalogue-heading{display:block}.catalogue-heading h2{font-size:42px;margin-top:20px}.featured{display:block}.featured-copy{padding:30px 0 0}.rows{margin-top:40px}.piece-row h3{font-size:23px}.footer{min-height:520px;background-size:cover;padding-bottom:90px}.available{margin:0;padding:24px 20px 80px}.available-heading h1{font-size:54px}.available-grid{gap:35px 15px}.available-grid h2{font-size:24px}.product-layout{display:flex;flex-direction:column-reverse;gap:30px}.product-info{position:static}.product-info h1{font-size:60px}.product{padding:20px}}
@media(min-width:701px){.opening-title h1{font-size:clamp(58px,5.3vw,74px)}.opening-logo img{transform:scale(1.6) translateX(-4%)} }
/* Typography: display headings in Theano Didot, supporting text and labels in Inter. */
:root{--type-display:Theano,serif;--type-info:Inter,Arial,sans-serif;--type-body:16px;--type-label:11px;--leading-body:1.5;--label-tracking:.14em;--text-main:#f1eae2;--text-muted:#848484}
body{font-family:var(--type-info);font-size:var(--type-body);line-height:var(--leading-body);color:var(--text-main)}
.opening-title h1,.vision-copy h2,.catalogue-heading h2,.featured-copy h3,.piece-row h3,.available-heading h1,.available-grid h2,.product-info h1{font-family:var(--type-display);font-weight:400}
.eyebrow,.site-header,.piece-row span,.back,.back-link,.view-link{font-family:var(--type-info);font-size:var(--type-label);font-weight:600;line-height:1.35;letter-spacing:var(--label-tracking);color:var(--text-muted)}
.vision-copy p,.featured-copy p,.product-info p{font-size:var(--type-body);line-height:var(--leading-body)}
.catalogue{margin-top:94px}.vision{margin-top:0}
@media(max-width:700px){.catalogue{margin-top:70px}.vision{margin-top:0}}
/* Cinematic art direction: quiet contrast, deliberate pacing and restrained motion. */
body{background:#0c0c0c;background-image:radial-gradient(ellipse 70% 50% at 50% 0%,rgba(60,65,68,.12),transparent 75%)}
.site-header{position:relative;z-index:2}.opening{position:relative}.opening-title h1{position:relative;text-shadow:0 3px 28px rgba(0,0,0,.45);animation:title-arrive 1.25s cubic-bezier(.2,.7,.2,1) both}.opening-logo img{animation:label-arrive 1.6s ease both}.opening-portrait{overflow:hidden;position:relative}.opening-portrait:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.02) 35%,rgba(0,0,0,.32) 100%);pointer-events:none}.opening-portrait img{animation:portrait-arrive 2s cubic-bezier(.2,.65,.2,1) both}.intro{padding-top:60px;padding-bottom:90px}.intro p{opacity:.88}.down{animation:drift 2.8s ease-in-out infinite}.catalogue-link,.piece-row{transition:border-color .4s ease,color .4s ease}.catalogue-link:hover,.piece-row:hover{border-color:#f1eae2;color:#fff}.catalogue-link span:last-child,.piece-row b{transition:transform .35s ease}.catalogue-link:hover span:last-child,.piece-row:hover b{transform:translate(4px,-4px)}.featured .featured-media>a,.available-grid>a{overflow:hidden}.featured .featured-media>a img,.available-grid>a img,.piece-row img{transition:transform 1s cubic-bezier(.2,.65,.2,1),filter .7s ease}.featured .featured-media>a:hover img,.available-grid>a:hover img{transform:scale(1.035);filter:brightness(1.06)}.piece-row:hover img{filter:brightness(1.12)}.vision-image{overflow:hidden}.vision-image img{transition:transform 1.4s cubic-bezier(.2,.65,.2,1)}.vision-image:hover img{transform:scale(1.025)}.instagram-pill,.pill{transition:background .3s ease,transform .3s ease}.instagram-pill:hover,.pill:hover{background:#fff;transform:translateY(-2px)}.cinematic-reveal{opacity:0;transform:translateY(28px);transition:opacity .9s ease,transform 1.1s cubic-bezier(.2,.65,.2,1)}.cinematic-reveal.is-visible{opacity:1;transform:none}.piece-row.cinematic-reveal{transition-duration:.7s}.product-info.cinematic-reveal{transform:translateY(16px)}.product-info.cinematic-reveal.is-visible{transform:none}
@keyframes title-arrive{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}@keyframes label-arrive{from{opacity:0}to{opacity:1}}@keyframes portrait-arrive{from{opacity:.45;transform:scale(1.06)}to{opacity:1;transform:scale(1)}}@keyframes drift{0%,100%{transform:translateY(0);opacity:.65}50%{transform:translateY(7px);opacity:1}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.cinematic-reveal{opacity:1;transform:none}}
/* Full-screen opening and product scenes. */
.opening-scene{min-height:100svh;display:flex;flex-direction:column;scroll-snap-align:start}.opening-scene .site-header{width:100%;flex:none}.opening-scene .opening{width:100%;height:auto;min-height:0;flex:1}.opening-scene .opening-portrait{min-height:0}.opening-scene .opening-portrait img{height:100%}.catalogue{margin-top:0}.product-scene{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:35px 0;scroll-snap-align:start}.product-scene .catalogue-heading{margin-bottom:24px}.product-scene .featured{min-height:0}.product-scene .featured .featured-media>a img{height:min(70svh,730px);aspect-ratio:auto;object-fit:cover}.rows{margin-top:44px}.intro{margin-top:70px}.vision{margin-top:94px}
@media(max-width:700px){.opening-scene .opening{min-height:0}.opening-scene .opening-portrait{height:100%;min-height:0}.opening-scene .opening-title{bottom:10px}.product-scene{padding:40px 0;min-height:100svh}.product-scene .catalogue-heading{margin-bottom:20px}.product-scene .catalogue-heading h2{font-size:clamp(32px,9vw,42px);margin-top:12px}.product-scene .featured .featured-media>a img{height:45svh;object-fit:cover}.product-scene .featured-copy{padding-top:18px}.product-scene .featured-copy h3{font-size:34px;margin:10px 0}.product-scene .featured-copy p{font-size:14px;margin:10px 0}.intro{margin-top:35px}.vision{margin-top:70px}}
/* Each chapter is at least one viewport; tall content can still be read naturally. */
.catalogue-scene{min-height:100svh;display:flex;flex-direction:column;justify-content:center;margin-top:0;padding:50px 0}.statement-scene{min-height:100svh;display:flex;flex-direction:column;justify-content:center}.statement-scene .intro{margin:0}.statement-scene .catalogue-link{width:calc(100% - 40px)}.vision{min-height:100svh;margin-top:0;margin-bottom:0;padding:70px 0;align-items:center}.footer{min-height:100svh}
@media(max-width:700px){.catalogue-scene{padding:40px 0}.statement-scene .intro{margin:0}.vision{padding:60px 0;margin-top:0;margin-bottom:0}.footer{min-height:100svh}}
/* Phone layouts: native touch scrolling, with gentle scene alignment. */
@media(max-width:700px){
  html.home-page{scroll-snap-type:y proximity;scroll-padding-top:0}
  .opening-scene,.product-scene,.catalogue-scene,.statement-scene,.vision,.footer{scroll-snap-align:start;scroll-snap-stop:normal}
  .opening-scene .opening-logo img{transform:scale(1.5)}
  .opening-scene .opening-title h1{font-size:clamp(43px,10vw,62px);line-height:.88}
  .catalogue{margin-bottom:0}
  .product-scene{padding:24px 0;justify-content:center}
  .product-scene .catalogue-heading{margin-bottom:12px}
  .product-scene .featured .featured-media>a img{height:min(42svh,420px);object-position:center}
  .product-scene .featured-copy{padding:14px 0 0}
  .product-scene .featured-copy h3{font-size:clamp(29px,8vw,36px);line-height:.95;margin:8px 0}
  .product-scene .featured-copy p{line-height:1.4;margin:8px 0;font-size:14px}
  .piece-row{min-height:100px;padding:14px 0}
  .piece-row img{width:58px;height:72px;flex:none}
  .piece-row h3{font-size:clamp(19px,5.5vw,23px);line-height:1.05}
  .piece-row b{padding:10px}
  .statement-scene .catalogue-link{min-height:60px}
  .vision-copy h2{font-size:clamp(42px,10vw,62px);line-height:.95}
  .available-heading h1{font-size:clamp(44px,12vw,58px)}
  .available-grid h2{font-size:clamp(19px,5.7vw,25px);line-height:1.1}
  .product-info h1{font-size:clamp(44px,12vw,60px);line-height:.92;overflow-wrap:break-word}
  .product-info p br{display:none}
  .gallery{gap:8px}
}
@media(max-width:700px) and (max-height:650px){.product-scene .featured .featured-media>a img{height:36svh}.product-scene .featured-copy h3{font-size:29px}.product-scene .featured-copy p{font-size:13px}.product-scene{padding:18px 0}}
@media(prefers-reduced-motion:reduce){html{scroll-snap-type:none}}
/* On phones, use native scroll snapping so momentum settles on each chapter. */
@media (max-width:700px) and (prefers-reduced-motion:no-preference){
  html.home-page{scroll-snap-type:y mandatory;scroll-padding-top:0;overscroll-behavior-y:contain}
  .opening-scene,.product-scene,.catalogue-scene,.statement-scene,.vision,.footer{scroll-snap-align:start;scroll-snap-stop:always}
}
/* V1: statement first, then a compact, square featured product. */
.product-scene .catalogue-heading,.product-scene .featured{width:min(100%,900px);margin-left:auto;margin-right:auto}
.product-scene .featured{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,6vw,72px);align-items:center}
.product-scene .featured-copy{min-width:0;padding:0}
.product-scene .featured-copy h2{font:400 clamp(32px,3.5vw,44px)/1.03 var(--type-display);letter-spacing:-.02em;margin:16px 0}
.product-scene .featured-copy p{max-width:32ch;font-size:15px;line-height:1.55;margin:18px 0 24px}
.product-scene .featured .featured-media>a{width:100%;max-width:min(100%,480px,65svh);justify-self:end;aspect-ratio:1;overflow:hidden}
.product-scene .featured .featured-media>a img{width:100%;height:100%;aspect-ratio:1;object-fit:cover}
@media(max-width:700px){
  .product-scene{padding:26px 0}
  .product-scene .featured{grid-template-columns:1fr;gap:18px}
  .product-scene .featured-copy h2{font-size:clamp(29px,8vw,36px);margin:9px 0}
  .product-scene .featured-copy p{font-size:14px;line-height:1.45;margin:10px 0 14px}
  .product-scene .featured .featured-media>a{justify-self:start;max-width:min(100%,38svh,380px)}
}
/* The brand statement and featured bandana form one scene. */
.product-scene{padding:clamp(20px,3.5svh,38px) 0;gap:clamp(14px,2.4svh,26px)}
.product-intro{width:min(100%,900px);margin:0 auto;text-align:center}
.product-intro .intro{padding:0;margin:0;font-size:clamp(13px,1.15vw,16px);line-height:1.45}
.product-intro .intro p{margin:0 0 6px}
.product-intro .down{font-size:17px;margin-top:6px}
.product-intro .catalogue-link{margin:12px auto 0;min-height:42px;text-align:left}
.product-scene .catalogue-heading{margin-bottom:0}
.product-scene .featured .featured-media>a{max-width:min(100%,420px,48svh)}
@media(max-width:700px){
  .product-scene{gap:12px;padding:20px 0}
  .product-intro .intro{font-size:13px;line-height:1.4}
  .product-intro .intro p{margin-bottom:4px}
  .product-intro .down{font-size:15px;margin-top:4px}
  .product-intro .catalogue-link{width:100%;margin:8px auto 0;min-height:38px;font-size:10px}
  .product-scene .catalogue-heading{margin:0}
  .product-scene .featured{gap:12px}
  .product-scene .featured .featured-media>a{max-width:min(100%,30svh,300px)}
  .product-scene .featured-copy h2{font-size:clamp(26px,7vw,32px);margin:6px 0}
  .product-scene .featured-copy p{font-size:13px;line-height:1.4;margin:7px 0 10px}
}
/* The complete bandana scene fits in one viewport at common screen sizes. */
.product-scene{min-height:100svh;padding:clamp(16px,3svh,28px) 0;gap:clamp(12px,2svh,20px);box-sizing:border-box}
.product-intro .intro p{margin:0 0 4px}
.product-intro .down{margin-top:4px}
.product-intro .catalogue-link{min-height:40px;margin-top:8px}
.product-scene .featured{width:min(100%,820px);grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,60px);align-items:center}
.product-scene .featured-copy h2{font-size:clamp(30px,3.2vw,40px);line-height:1.02;margin:12px 0}
.product-scene .featured-copy p{font-size:14px;line-height:1.5;margin:14px 0 18px}
.product-scene .featured .featured-media>a{max-width:min(100%,380px,43svh)}
@media(max-width:700px){
  .product-scene{padding:16px 0;gap:clamp(14px,2.5svh,22px)}
  .product-intro .intro{font-size:clamp(12px,3.3vw,13px);line-height:1.35}
  .product-intro .intro p{margin-bottom:3px}
  .product-intro .down{font-size:15px;margin-top:3px}
  .product-intro .catalogue-link{min-height:38px;margin-top:7px}
  .product-scene .featured{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(12px,4vw,20px);align-items:center}
  .product-scene .featured-copy h2{font-size:clamp(23px,6.4vw,30px);line-height:1.04;margin:8px 0}
  .product-scene .featured-copy p{font-size:clamp(12px,3.1vw,13px);line-height:1.4;margin:9px 0 12px}
  .product-scene .featured-copy .eyebrow,.product-scene .view-link{font-size:10px;letter-spacing:.1em}
  .product-scene .featured .featured-media>a{width:100%;max-width:min(100%,32svh,240px);justify-self:end}
}
/* Give the statement and the bandana their own space within the scene. */
.product-scene{justify-content:space-between;padding-top:clamp(38px,8svh,88px);padding-bottom:clamp(38px,8svh,88px)}
@media(max-width:700px){
  .product-scene{justify-content:space-between;padding-top:clamp(30px,7svh,62px);padding-bottom:clamp(34px,8svh,70px)}
}
/* Keep the vision scene within a desktop viewport without clipping its text. */
@media(min-width:701px){
  .vision{box-sizing:border-box;gap:clamp(28px,4vw,48px);padding:clamp(22px,4svh,42px) 0;align-items:center}
  .vision-image img{height:min(70svh,640px);width:100%;aspect-ratio:auto;object-position:center}
  .vision-copy{padding-top:0}
  .vision-copy h2{font-size:clamp(38px,min(5vw,8svh),68px);line-height:.98;margin:clamp(12px,2svh,20px) 0}
  .vision-copy p{font-size:clamp(14px,1.2vw,16px);line-height:1.45;margin-bottom:clamp(14px,2svh,24px)}
}
/* Opening sequence: the center label leads; framing elements follow. */
.site-header{animation:opening-ui-arrive .85s cubic-bezier(.2,.7,.2,1) .5s both}
.opening-title h1{animation-delay:.5s}
.opening-portrait img{animation-delay:.5s}
@keyframes opening-ui-arrive{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.site-header,.opening-title h1,.opening-portrait img,.opening-logo img{animation:none}}
/* Keep the portrait completely hidden until its delayed entrance. */
@keyframes portrait-arrive{from{opacity:0;transform:scale(1.06)}to{opacity:1;transform:scale(1)}}
/* Give the center label an extra second before the surrounding elements enter. */
.site-header,.opening-title h1,.opening-portrait img{animation-delay:1.5s}
/* Show the portrait without the dark gradient overlay. */
.opening-portrait::after{content:none}
/* The label gently emerges into focus before the rest of the opening. */
.opening-logo{animation:label-emerge 1.6s cubic-bezier(.16,1,.3,1) both}
@keyframes label-emerge{from{transform:translateY(16px) scale(.96);filter:blur(8px)}to{transform:translateY(0) scale(1);filter:blur(0)}}
@media(prefers-reduced-motion:reduce){.opening-logo{animation:none}}
/* Ease into a gentle settle instead of moving at a uniform pace. */
.opening-logo{animation-timing-function:cubic-bezier(.22,.8,.25,1)}
@keyframes label-emerge{
  0%{transform:translateY(22px) scale(.94);filter:blur(8px)}
  68%{transform:translateY(-2px) scale(1.012);filter:blur(.5px)}
  100%{transform:translateY(0) scale(1);filter:blur(0)}
}
/* Enlarge the featured bandana while preserving the square image. */
.product-scene .featured{width:min(100%,980px)}
.product-scene .featured .featured-media>a{max-width:min(100%,440px,48svh)}
.product-scene .featured-copy h2{font-size:clamp(34px,3.8vw,48px)}
.product-scene .featured-copy p{font-size:16px}
@media(max-width:700px){
  .product-scene .featured .featured-media>a{max-width:min(100%,35svh,260px)}
  .product-scene .featured-copy h2{font-size:clamp(25px,7vw,34px)}
  .product-scene .featured-copy p{font-size:clamp(12px,3.4vw,14px)}
}
/* Keep the bandana details visible while browsing the gallery. */
.bandana-page .product-info{position:sticky;top:24px;z-index:2;align-self:start}
@media(max-width:700px){
  .bandana-page .product-info{position:sticky;top:0;z-index:3;align-self:stretch;max-height:46svh;overflow:auto;background:#0c0c0c;padding:14px 0 16px;border-bottom:1px solid #303030}
  .bandana-page .product-info h1{font-size:clamp(28px,8vw,38px);line-height:1;margin:8px 0}
  .bandana-page .product-info h1 br{display:none}
  .bandana-page .product-info p{font-size:13px;line-height:1.4;margin:8px 0 10px}
  .bandana-page .product-info .pill{padding:10px 16px}
}

/* Animate the contents on entry while leaving the sticky container stationary. */
.bandana-page .product-info>*{animation:bandana-detail-in .7s cubic-bezier(.22,1,.36,1) both}
.bandana-page .product-info>*:nth-child(2){animation-delay:.07s}
.bandana-page .product-info>*:nth-child(3){animation-delay:.14s}
.bandana-page .product-info>*:nth-child(4){animation-delay:.21s}
.bandana-page .product-info>*:nth-child(5){animation-delay:.28s}
@keyframes bandana-detail-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.bandana-page .product-info>*{animation:none}}
.bandana-page .gallery img{height:auto}
/* Keep the details at the same viewport position from the start of the page. */
@media(min-width:701px){
  .bandana-page .product-info{position:fixed;top:clamp(54px,10svh,90px);left:calc(50% + 22px);width:min(calc(50% - 42px),508px);max-height:calc(100svh - 48px);overflow:auto}
}
@media(max-width:700px){
  .bandana-page .product{padding-top:var(--bandana-header-height,250px)}
  .bandana-page .product>.back{position:fixed;top:14px;left:20px;z-index:5;margin:0}
  .bandana-page .product-info{position:fixed;top:0;left:0;width:100%;max-height:48svh;box-sizing:border-box;padding:48px 20px 14px;background:#0c0c0c}
  .bandana-page .product-layout{gap:0}
}
/* Hide scrollbar chrome while preserving normal scrolling. */
html,body,*{scrollbar-width:none}
html::-webkit-scrollbar,body::-webkit-scrollbar,*::-webkit-scrollbar{display:none}
/* Square gallery: images slide horizontally in response to the arrows. */
.product-scene .featured-media{position:relative;width:100%;max-width:min(100%,440px,48svh);aspect-ratio:1;justify-self:end;overflow:hidden}
.product-scene .featured-media>a{position:relative;display:block;width:100%;height:100%;max-width:none;aspect-ratio:1;overflow:hidden}
.product-scene .featured-media .slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:translateX(0);transition:transform .65s cubic-bezier(.22,1,.36,1);pointer-events:none}
.product-scene .featured-media .slide.slide-in-right{transform:translateX(100%)}
.product-scene .featured-media .slide.slide-in-left{transform:translateX(-100%)}
.product-scene .featured-media .slide.slide-out-left{transform:translateX(-100%)}
.product-scene .featured-media .slide.slide-out-right{transform:translateX(100%)}
.product-scene .featured-media>a:hover .slide{filter:none}
.slideshow-controls{position:absolute;right:10px;bottom:10px;z-index:2;display:flex;gap:6px}
.slideshow-controls button{display:grid;place-items:center;width:36px;height:36px;border:1px solid rgba(241,234,226,.65);border-radius:50%;color:#f1eae2;background:rgba(12,12,12,.8);font:20px/1 Inter,Arial,sans-serif;cursor:pointer}
.slideshow-controls button:focus-visible{outline:2px solid #f1eae2;outline-offset:3px}
@media(max-width:700px){.product-scene .featured-media{max-width:min(100%,35svh,260px)}.slideshow-controls{right:6px;bottom:6px}.slideshow-controls button{width:32px;height:32px}}
@media(prefers-reduced-motion:reduce){.product-scene .featured-media .slide{transition:none}}
/* Phone-only proportions for the bandana and Vision scenes. */
@media(max-width:700px){
  .product-scene .featured{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(10px,3vw,16px)}
  .product-scene .featured-media{max-width:min(100%,42svh,300px)}
  .vision{display:flex;flex-direction:column;justify-content:center;align-items:stretch;gap:0;padding:clamp(16px,3svh,28px) 0}
  .vision-image{flex:none}
  .vision-image img{height:clamp(120px,23svh,210px);aspect-ratio:auto;object-position:center 35%}
  .vision-copy{padding-top:clamp(12px,2svh,20px)}
  .vision-copy h2{font-size:clamp(28px,7.4vw,40px);line-height:1;letter-spacing:-.025em;margin:9px 0 11px;max-width:none}
  .vision-copy p{font-size:clamp(12px,3.4vw,14px);line-height:1.38;margin:0 0 10px}
}
@media(max-width:700px) and (max-height:650px){
  .vision-image img{height:20svh;min-height:105px}
  .vision-copy h2{font-size:clamp(26px,7vw,34px);margin:7px 0}
  .vision-copy p{font-size:12px;line-height:1.34;margin-bottom:8px}
}
/* Preserve existing image layout when the browser selects an optimized source. */
picture{display:contents}img{height:auto}
@media(max-width:700px){.footer{background-image:url('/assets/mobile/footer-logo.webp')}}
@media(min-width:701px){.footer{background-image:url('/assets/desktop/footer-logo.webp')}}
/* Align the Instagram icon with the inquiry label. */
.bandana-page .product-info .pill{display:inline-flex;align-items:center;gap:8px}
.bandana-page .product-info .pill svg{display:block;flex:none}

/* Unreleased pieces */
.coming-image{overflow:hidden}.coming-soon .coming-image img,.piece-row.coming-soon:hover img{filter:blur(4px);transform:scale(1.03)}.piece-row.coming-soon .coming-image img,.piece-row.coming-soon:hover .coming-image img{filter:blur(1.5px);transform:scale(1.05)}.piece-row .coming-image{width:65px;height:80px;flex:none}.piece-row .coming-image img{width:100%;height:100%}@media(max-width:700px){.piece-row .coming-image{width:58px;height:72px}}

/* Native chapter snapping keeps wheel, trackpad and touch gestures responsive. */
@media (prefers-reduced-motion:no-preference){html.home-page{scroll-snap-type:y proximity;scroll-padding-top:0}.home-page .opening-scene,.home-page .product-scene,.home-page .catalogue-scene,.home-page .vision,.home-page .footer{scroll-snap-align:start;scroll-snap-stop:normal}}
.home-nav{display:flex;align-items:center;gap:24px}.home-gallery-link{font-size:11px;letter-spacing:.14em;font-weight:600}.home-gallery-link:hover{opacity:.7}