@import url('/assets/fonts/intertight.css');
@font-face{font-family:'Bauhaus Regular';src:url('/assets/fonts/Bauhaus-Regular.woff2') format('woff2'),url('/assets/fonts/Bauhaus-Regular.woff') format('woff');font-weight:400;font-display:swap}
@font-face{font-family:'Bauhaus Regular';src:url('/assets/fonts/Bauhaus-Medium.woff2') format('woff2'),url('/assets/fonts/Bauhaus-Medium.woff') format('woff');font-weight:500 700;font-display:swap}

:root{
--sg-colour-ink:#12181C;
--sg-colour-ink-soft:#2B2C28;
--sg-colour-paper:#FFFFFF;
--sg-colour-accent:#FF1964;
--sg-colour-accent-deep:#B6005F;
--sg-colour-mist:#F4F5F5;
--sg-colour-mist-warm:#FFF8F8;
--sg-colour-cream:#FFF8E8;
--sg-colour-blush:#F1DEDE;
--sg-colour-teal:#5AB1BB;
--sg-colour-rule:#DEE0E0;
--sg-colour-muted:#BEBEBE;
--sg-font-display:'Bauhaus Regular';
--sg-font-body:'Inter Tight';
--sg-font-fallback-display:Georgia, serif;
--sg-font-fallback-body:system-ui, sans-serif;
--sg-size-hero:100px;
--sg-size-display:75px;
--sg-size-title:50px;
--sg-size-heading:43px;
--sg-size-subhead:27px;
--sg-size-lead:18px;
--sg-size-body:16px;
--sg-viewport-md:768px;
--sg-viewport-lg:1025px;
--sg-measure:68ch;
--sg-gutter:24px;
--sg-space-section:96px;
--sg-col-side:5fr;
--sg-col-main:7fr;
--sg-space-1:8px;
--sg-space-2:16px;
--sg-space-3:24px;
--sg-space-4:40px;
--sg-space-5:64px;
--sg-space-6:104px;
--sg-space-7:168px;
--sg-shell-max:1440px;
--sg-measure-tight:56ch;
--sg-hero-focus:center 28%;
--sg-ease:cubic-bezier(.22,.61,.36,1);
--sg-dur-fast:.22s;
--sg-dur-slow:.6s;
--sg-dur-veil:1.1s;
--sg-radius:0px;
--sg-scrim-strong:.62;
--sg-scrim-soft:.30;
--sg-shadow-lift:0 18px 50px rgba(18,24,28,.18);
--sg-rule-hair:1px;
--sg-track-wide:.18em;
--sg-track-tight:-.02em;
--sg-leading-tight:1.02;
--sg-leading-body:1.65;
--sg-size-micro:13px;
--sg-family-display:var(--sg-font-display),var(--sg-font-fallback-display);
--sg-family-body:var(--sg-font-body),var(--sg-font-fallback-body);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--sg-colour-paper);color:var(--sg-colour-ink);
  font-family:var(--sg-family-body);font-size:var(--sg-size-body);
  line-height:var(--sg-leading-body);-webkit-font-smoothing:antialiased;
  overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:var(--sg-family-display);font-weight:400;
  line-height:var(--sg-leading-tight);letter-spacing:var(--sg-track-tight);margin:0;
  overflow-wrap:break-word;word-break:normal}
:focus-visible{outline:2px solid var(--sg-colour-accent);outline-offset:3px}

.sg-shell{max-width:var(--sg-shell-max);margin:0 auto;padding:0 var(--sg-space-4)}
.sg-skip{position:absolute;left:-9999px}
.sg-skip:focus{left:var(--sg-space-3);top:var(--sg-space-3);z-index:99;
  background:var(--sg-colour-paper);padding:var(--sg-space-2)}

/* ---------- header: glass over the photograph, solid once you move ---------- */
.sg-head{position:fixed;top:0;left:0;right:0;z-index:40;
  transition:background var(--sg-dur-fast) var(--sg-ease),
             box-shadow var(--sg-dur-fast) var(--sg-ease);}
.sg-head-in{display:flex;align-items:center;justify-content:space-between;
  gap:var(--sg-space-3);min-height:var(--sg-space-6);color:var(--sg-colour-paper);
  text-shadow:0 1px 14px rgba(0,0,0,.45)}
.sg-head.is-solid{background:var(--sg-colour-paper);box-shadow:var(--sg-shadow-lift)}
.sg-head.is-solid .sg-head-in{color:var(--sg-colour-ink);text-shadow:none}
.sg-brand{font-family:var(--sg-family-display);font-size:var(--sg-size-subhead);
  letter-spacing:var(--sg-track-wide);text-transform:uppercase}
.sg-nav{display:flex;gap:var(--sg-space-4);flex-wrap:wrap}
.sg-nav a{font-size:var(--sg-size-micro);letter-spacing:var(--sg-track-wide);
  text-transform:uppercase;position:relative;padding:var(--sg-space-1) 0}
.sg-nav a::after{content:"";position:absolute;left:0;right:100%;bottom:0;
  height:2px;background:var(--sg-colour-accent);
  transition:right var(--sg-dur-fast) var(--sg-ease)}
.sg-nav a:hover::after,.sg-nav a[aria-current="page"]::after{right:0}
.sg-burger{display:none;background:none;border:0;color:inherit;cursor:pointer;
  font-size:var(--sg-size-subhead);line-height:1;padding:var(--sg-space-1)}

.sg-main-plain{padding-top:var(--sg-space-6)}

/* ---------- hero ---------- */
.sg-hero{position:relative;min-height:100svh;display:grid;align-items:end;
  overflow:hidden;color:var(--sg-colour-paper);isolation:isolate}
.sg-hero-bg{position:absolute;inset:0;background-size:cover;background-position:var(--sg-hero-focus);
  z-index:-2;transform:scale(1.06);animation:sg-drift var(--sg-dur-veil) var(--sg-ease) forwards}
@keyframes sg-drift{to{transform:scale(1)}}
.sg-hero::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,
    rgba(0,0,0,var(--sg-scrim-soft)) 0%,
    rgba(0,0,0,0) 38%,
    rgba(0,0,0,var(--sg-scrim-strong)) 100%)}
.sg-hero-in{padding:var(--sg-space-7) var(--sg-space-4) var(--sg-space-6)}
.sg-hero h1{font-size:clamp(var(--sg-size-title),12vw,var(--sg-size-hero));
  text-transform:uppercase}
.sg-eyebrow{letter-spacing:var(--sg-track-wide);text-transform:uppercase;
  font-size:var(--sg-size-micro);color:var(--sg-colour-accent);
  margin:0 0 var(--sg-space-2)}
.sg-hero .sg-eyebrow{color:var(--sg-colour-paper);opacity:.85}
.sg-scroll{position:absolute;left:50%;bottom:var(--sg-space-3);translate:-50% 0;
  width:1px;height:var(--sg-space-4);background:var(--sg-colour-paper);opacity:.6;
  animation:sg-pulse 2.4s var(--sg-ease) infinite}
@keyframes sg-pulse{0%,100%{transform:scaleY(.3);transform-origin:top}50%{transform:scaleY(1)}}

/* ---------- bands: a heading column and a reading column ---------- */
.sg-band{padding:var(--sg-space-6) 0}
.sg-band + .sg-band{padding-top:0}
.sg-band > .sg-shell{display:grid;
  grid-template-columns:minmax(0,var(--sg-col-side)) minmax(0,var(--sg-col-main));
  column-gap:var(--sg-space-5);row-gap:var(--sg-space-3);align-items:start}
.sg-band > .sg-shell > *{grid-column:2}
.sg-band > .sg-shell > h2{grid-column:1;grid-row:1}
/* media wants the whole width */
.sg-band > .sg-shell > .sg-grid,
.sg-band > .sg-shell > .sg-gallery,
.sg-band > .sg-shell > .sg-product{grid-column:1 / -1}
.sg-band h2{font-size:clamp(var(--sg-size-heading),4.6vw,var(--sg-size-display));
  text-transform:uppercase;margin-bottom:var(--sg-space-3)}
.sg-band h2::after{content:"";display:block;width:var(--sg-space-5);height:2px;
  background:var(--sg-colour-accent);margin-top:var(--sg-space-3)}
.sg-prose{max-width:var(--sg-measure);font-size:var(--sg-size-lead);
  color:var(--sg-colour-ink-soft)}
.sg-prose p{margin:0 0 var(--sg-space-3)}

/* ---------- the button ---------- */
.sg-cta{display:inline-block;margin-top:var(--sg-space-3);
  padding:var(--sg-space-2) var(--sg-space-4);border:1px solid currentColor;
  letter-spacing:var(--sg-track-wide);text-transform:uppercase;
  font-size:var(--sg-size-micro);position:relative;overflow:hidden;
  transition:color var(--sg-dur-fast) var(--sg-ease),
             border-color var(--sg-dur-fast) var(--sg-ease)}
.sg-cta::before{content:"";position:absolute;inset:0;background:var(--sg-colour-accent);
  transform:scaleX(0);transform-origin:left;z-index:-1;
  transition:transform var(--sg-dur-fast) var(--sg-ease)}
.sg-cta{z-index:0}
.sg-cta:hover{color:var(--sg-colour-paper);border-color:var(--sg-colour-accent)}
.sg-cta:hover::before{transform:scaleX(1)}
.sg-cta-dead{opacity:.45;pointer-events:none}

/* ---------- grids ---------- */
.sg-grid{display:grid;gap:var(--sg-space-3)}
.sg-grid-3{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.sg-doors{grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:var(--sg-space-2)}
.sg-door{position:relative;aspect-ratio:3/4;overflow:hidden;
  background:var(--sg-colour-mist);display:block}
.sg-door img{width:100%;height:100%;object-fit:cover;
  transition:transform var(--sg-dur-slow) var(--sg-ease),
             filter var(--sg-dur-slow) var(--sg-ease)}
.sg-door::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,var(--sg-scrim-strong)))}
.sg-door:hover img{transform:scale(1.06)}
.sg-door span{position:absolute;left:0;right:0;bottom:0;z-index:1;
  padding:var(--sg-space-3);color:var(--sg-colour-paper);
  font-family:var(--sg-family-display);font-size:var(--sg-size-subhead);
  text-transform:uppercase;letter-spacing:var(--sg-track-tight);
  display:flex;align-items:center;gap:var(--sg-space-2)}
.sg-door span::after{content:"";flex:0 0 auto;width:var(--sg-space-4);height:1px;
  background:var(--sg-colour-accent);
  transition:width var(--sg-dur-fast) var(--sg-ease)}
.sg-door:hover span::after{width:var(--sg-space-5)}

/* ---------- gallery ---------- */
.sg-gallery{columns:3;column-gap:var(--sg-space-2)}
.sg-gallery figure{margin:0 0 var(--sg-space-2);break-inside:avoid;
  position:relative;overflow:hidden;background:var(--sg-colour-mist)}
.sg-gallery img{width:100%;transition:transform var(--sg-dur-slow) var(--sg-ease)}
.sg-gallery button{display:block;width:100%;padding:0;border:0;background:none;
  cursor:zoom-in;position:relative}
.sg-gallery figure:hover img{transform:scale(1.04)}
.sg-gallery figure::after{content:"";position:absolute;inset:0;
  background:var(--sg-colour-ink);opacity:0;
  transition:opacity var(--sg-dur-fast) var(--sg-ease);pointer-events:none}
.sg-gallery figure:hover::after{opacity:.12}

/* ---------- lightbox ---------- */
.sg-box{position:fixed;inset:0;z-index:80;background:var(--sg-colour-ink);
  display:none;place-items:center}
.sg-box[open]{display:grid}
.sg-box img{max-width:92vw;max-height:86vh;object-fit:contain}
.sg-box-close,.sg-box-prev,.sg-box-next{position:absolute;background:none;border:0;
  color:var(--sg-colour-paper);cursor:pointer;font-size:var(--sg-size-subhead);
  padding:var(--sg-space-2);line-height:1;opacity:.75;
  transition:opacity var(--sg-dur-fast) var(--sg-ease)}
.sg-box-close:hover,.sg-box-prev:hover,.sg-box-next:hover{opacity:1}
.sg-box-close{top:var(--sg-space-2);right:var(--sg-space-3)}
.sg-box-prev{left:var(--sg-space-2);top:50%;translate:0 -50%}
.sg-box-next{right:var(--sg-space-2);top:50%;translate:0 -50%}
.sg-box-count{position:absolute;bottom:var(--sg-space-3);left:50%;translate:-50% 0;
  color:var(--sg-colour-paper);font-size:var(--sg-size-micro);
  letter-spacing:var(--sg-track-wide);opacity:.7}

/* ---------- cards ---------- */
.sg-card{display:block;position:relative}
.sg-card-shot{overflow:hidden;background:var(--sg-colour-mist);aspect-ratio:4/5}
.sg-card img{width:100%;height:100%;object-fit:cover;
  transition:transform var(--sg-dur-slow) var(--sg-ease)}
.sg-card:hover img{transform:scale(1.05)}
.sg-card h3{font-size:var(--sg-size-subhead);margin:var(--sg-space-2) 0 var(--sg-space-1);
  text-transform:uppercase}
.sg-card time,.sg-price{color:var(--sg-colour-muted);font-size:var(--sg-size-micro);
  letter-spacing:var(--sg-track-wide);text-transform:uppercase}
.sg-price{color:var(--sg-colour-accent)}

/* ---------- article ---------- */
.sg-article{max-width:var(--sg-measure-tight);margin:0 auto;
  padding:var(--sg-space-7) var(--sg-space-4) var(--sg-space-6)}
.sg-article h1{font-size:clamp(var(--sg-size-heading),6vw,var(--sg-size-display));
  margin-bottom:var(--sg-space-2);text-transform:uppercase}
.sg-article > time{color:var(--sg-colour-muted);font-size:var(--sg-size-micro);
  letter-spacing:var(--sg-track-wide);text-transform:uppercase;
  display:block;margin-bottom:var(--sg-space-4)}
.sg-article .sg-prose > p:first-of-type::first-letter{
  font-family:var(--sg-family-display);float:left;font-size:var(--sg-size-title);
  line-height:.82;padding:0 var(--sg-space-2) 0 0;color:var(--sg-colour-accent)}
.sg-article img{margin:var(--sg-space-4) 0}

/* ---------- product ---------- */
.sg-product{display:grid;grid-template-columns:1.15fr 1fr;gap:var(--sg-space-5);
  align-items:start}
.sg-product h2{font-size:clamp(var(--sg-size-subhead),4vw,var(--sg-size-heading));
  text-transform:uppercase;margin-bottom:var(--sg-space-2)}
.sg-product .sg-price{font-size:var(--sg-size-lead);display:block;
  margin-bottom:var(--sg-space-3)}
.sg-stock{font-size:var(--sg-size-micro);letter-spacing:var(--sg-track-wide);
  text-transform:uppercase;color:var(--sg-colour-muted)}

/* ---------- footer ---------- */
.sg-foot{background:var(--sg-colour-ink);color:var(--sg-colour-paper);
  padding:var(--sg-space-6) 0 var(--sg-space-4);margin-top:var(--sg-space-6)}
.sg-foot-in{display:flex;flex-wrap:wrap;gap:var(--sg-space-4);
  justify-content:space-between;align-items:flex-end}
.sg-foot .sg-nav a{font-size:var(--sg-size-micro)}
.sg-foot-mark{font-family:var(--sg-family-display);
  font-size:clamp(var(--sg-size-heading),9vw,var(--sg-size-display));
  text-transform:uppercase;line-height:.9;opacity:.14;
  margin-top:var(--sg-space-4);pointer-events:none;user-select:none}
.sg-foot small{font-size:var(--sg-size-micro);letter-spacing:var(--sg-track-wide);
  text-transform:uppercase;opacity:.6}

/* ---------- arrival ---------- */
.sg-rise{opacity:0;transform:translateY(var(--sg-space-2));
  transition:opacity var(--sg-dur-fast) var(--sg-ease),
             transform var(--sg-dur-fast) var(--sg-ease)}
.sg-rise.is-in{opacity:1;transform:none}

@media (max-width: 1025px){
  .sg-gallery{columns:2}
  .sg-product{grid-template-columns:1fr;gap:var(--sg-space-4)}
}
@media (max-width: 768px){
  .sg-gallery{columns:1}
  .sg-burger{display:block}
  .sg-head-in{position:relative;min-height:var(--sg-space-5)}
  .sg-nav{display:none;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;gap:var(--sg-space-2);
    background:var(--sg-colour-paper);color:var(--sg-colour-ink);
    padding:var(--sg-space-3)}
  .sg-nav.is-open{display:flex}
  .sg-hero-in{padding:var(--sg-space-6) var(--sg-space-3) var(--sg-space-5)}
  .sg-hero h1{font-size:clamp(var(--sg-size-heading),11vw,var(--sg-size-title))}
  .sg-band h2{font-size:clamp(var(--sg-size-subhead),8vw,var(--sg-size-heading))}
  .sg-foot-mark{font-size:var(--sg-size-heading)}
  .sg-band{padding:var(--sg-space-5) 0}
  .sg-shell{padding:0 var(--sg-space-3)}
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
  .sg-rise{opacity:1;transform:none}
}
