:root{
  --font-head:'Archivo Black',Arial,sans-serif;
  --font-sans:'Space Grotesk',system-ui,sans-serif;

  --color-bg:#FFFFFF;
  --color-bg-alt:#FDF0F6;
  --color-border:#000000;
  --color-heading:#000000;
  --color-body:#5A1535;
  --color-white:#FFFFFF;
  --color-black:#000000;

  --brand:#E0387B;
  --brand-strong:#B82F66;
  --brand-soft:#FBE4ED;
  --brand-soft-fg:#9A2454;

  --navy:#1A000E;
  --navy-strong:#2D0018;

  --yellow:#FFE0EE;
  --yellow-strong:#FFCCE3;

  --orange:#C42D6A;
  --orange-strong:#A82460;

  --shadow-2xs:1px 1px 0 0 var(--color-border);
  --shadow-xs:2px 2px 0 0 var(--color-border);
  --shadow-sm:3px 3px 0 0 var(--color-border);
  --shadow-md:4px 4px 0 0 var(--color-border);
  --shadow-lg:6px 6px 0 0 var(--color-border);
  --shadow-xl:10px 10px 0 1px var(--color-border);

  --focus-ring:#000000;
  --navbar-height:76px;
  --ease:cubic-bezier(.2,.8,.2,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:var(--navbar-height);background:var(--navy);}
body{
  margin:0;font-family:var(--font-sans);color:var(--color-body);
  background:var(--color-bg);-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img,svg{max-width:100%;display:block;}
a{color:inherit;}
button{font-family:inherit;}

h1,h2,h3,h4,h5,h6{font-family:var(--font-head);color:var(--color-heading);margin:0;text-wrap:balance;}

.heading-display{font-size:clamp(2.5rem,7vw,4.75rem);line-height:0.95;letter-spacing:-1px;margin-bottom:32px;color:var(--color-white);}
.heading-section{font-size:clamp(1.875rem,4vw,3rem);line-height:1.1;letter-spacing:-0.5px;margin-bottom:16px;}
.heading-card{font-size:18px;line-height:1.25;margin-bottom:8px;}
.heading-label{font-size:16px;line-height:1.25;margin-bottom:16px;}

p{margin:0 0 16px;line-height:1.7;max-width:65ch;}
.lead{font-size:20px;line-height:1.7;max-width:38ch;}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

.skip-link{
  position:absolute;left:8px;top:-48px;z-index:100;background:var(--yellow);color:var(--color-black);
  font-weight:600;padding:10px 16px;border:2px solid var(--color-border);transition:top 150ms var(--ease);
}
.skip-link:focus{top:8px;}

*:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px;}

.container{max-width:1152px;margin:0 auto;padding-inline:24px;}
.section{padding-block:48px;position:relative;}
@media(min-width:1024px){.section{padding-block:72px;}}
.section--alt{background:var(--color-bg-alt);}
.section-header{margin-bottom:40px;max-width:60ch;}
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;
  letter-spacing:0.1em;text-transform:uppercase;padding:4px 10px;border:2px solid var(--color-border);
  background:var(--yellow);color:var(--color-black);margin-bottom:16px;
}

/* Motion */
@media(prefers-reduced-motion:no-preference){
  .reveal{opacity:0;transform:translateY(28px);transition:opacity 600ms var(--ease),transform 600ms var(--ease);}
  .reveal.is-visible{opacity:1;transform:translateY(0);}
}
@media(prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;}
  .marquee-track,.float,.spin-badge,.pulse{animation:none!important;}
}
@keyframes float{0%,100%{transform:translateY(0) rotate(var(--r,0deg));}50%{transform:translateY(-14px) rotate(var(--r,0deg));}}
@keyframes spin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}
@keyframes pulse{0%,100%{transform:scale(1);}50%{transform:scale(1.06);}}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@keyframes popIn{from{opacity:0;transform:scale(.7) translateY(8px);}to{opacity:1;transform:scale(1) translateY(0);}}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;font-size:16px;
  line-height:1;white-space:nowrap;flex-shrink:0;padding:12px 24px;border:2px solid var(--color-border);
  box-shadow:var(--shadow-sm);cursor:pointer;text-decoration:none;min-height:44px;
  transition:transform 100ms var(--ease),box-shadow 100ms var(--ease),background-color 100ms var(--ease);
}
.btn:hover{transform:translate(-1px,-1px);box-shadow:var(--shadow-md);}
.btn:active{transform:translate(2px,2px);box-shadow:var(--shadow-2xs);}
.btn--primary{background:var(--brand);color:var(--color-black);}
.btn--primary:hover{background:var(--brand-strong);}
.btn--dark{background:var(--color-black);color:var(--color-white);}
.btn--dark:hover{background:#222;}
.btn--outline{background:var(--color-white);color:var(--color-black);}
.btn--outline:hover{background:var(--yellow);}
.btn--sm{padding:8px 16px;font-size:14px;min-height:40px;}
@media(prefers-reduced-motion:reduce){.btn{transition:none;}}

/* Badges */
.badge{display:inline-flex;align-items:center;gap:4px;width:max-content;font-size:12px;font-weight:600;padding:4px 8px;border:2px solid var(--color-border);}
.badge--brand{background:var(--brand-soft);color:var(--brand-soft-fg);}
.badge--orange{background:#FDE6D6;color:#9C4112;}
.icon{width:20px;height:20px;flex-shrink:0;}
.icon--sm{width:16px;height:16px;}

/* Navbar */
.navbar{position:sticky;top:0;z-index:50;background:var(--color-white);border-bottom:3px solid var(--color-border);transition:padding 150ms var(--ease),box-shadow 150ms var(--ease);}
.navbar.is-scrolled{box-shadow:0 3px 0 0 rgba(0,0,0,0.06);}
.navbar-inner{display:flex;align-items:center;justify-content:space-between;padding-block:12px;}
.logo{display:inline-flex;align-items:center;text-decoration:none;}
.logo img{height:30px;width:auto;transition:transform 150ms var(--ease);}
.logo:hover img{transform:rotate(-2deg) scale(1.04);}
.nav-links{display:none;align-items:center;gap:32px;list-style:none;margin:0;padding:0;}
.nav-links a{position:relative;font-weight:600;font-size:16px;text-decoration:none;color:var(--color-heading);padding:8px 0;}
.nav-links a::after{content:"";position:absolute;left:0;bottom:2px;width:0;height:3px;background:var(--brand);transition:width 200ms var(--ease);}
.nav-links a:hover::after{width:100%;}
.nav-right{display:flex;align-items:center;gap:12px;}
.cart-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:2px solid var(--color-border);background:var(--color-white);box-shadow:var(--shadow-xs);cursor:pointer;transition:transform 100ms,box-shadow 100ms;}
.cart-btn:hover{transform:translate(-1px,-1px);box-shadow:var(--shadow-sm);}
.cart-btn:active{transform:translate(1px,1px);box-shadow:none;}
.cart-btn.bump{animation:pulse 300ms var(--ease);}
.cart-count{position:absolute;top:-8px;right:-8px;min-width:20px;height:20px;padding:0 4px;background:var(--orange);color:var(--color-black);border:2px solid var(--color-border);font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;}
.nav-toggle{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:2px solid var(--color-border);background:var(--color-white);box-shadow:var(--shadow-xs);cursor:pointer;}
.mobile-menu{display:none;border-top:2px solid var(--color-border);background:var(--color-white);}
.mobile-menu.is-open{display:block;}
.mobile-menu ul{list-style:none;margin:0;padding:16px 24px;display:flex;flex-direction:column;gap:16px;}
.mobile-menu a{font-weight:600;font-size:16px;text-decoration:none;color:var(--color-heading);}
@media(min-width:768px){.nav-links{display:flex;}.nav-toggle{display:none;}.mobile-menu{display:none!important;}}

/* Marquee */
.marquee{background:var(--yellow);border-bottom:3px solid var(--color-border);overflow:hidden;margin:0;display:block;}
.marquee-track{display:flex;width:max-content;animation:marquee 55s linear infinite;}
.marquee-set{display:flex;align-items:center;flex-shrink:0;}
.marquee-set span{
  display:inline-flex;align-items:center;gap:20px;color:var(--color-black);font-family:var(--font-head);
  font-size:14px;padding:8px 0;white-space:nowrap;letter-spacing:0.04em;
}
.marquee-set img{height:14px;width:auto;}

/* Hero */
.hero{background:var(--navy);color:var(--color-white);--focus-ring:var(--yellow);padding-top:72px;padding-bottom:72px;position:relative;overflow:hidden;}
.hero-watermark{position:absolute;top:-10%;right:-12%;width:60%;max-width:520px;opacity:0.07;transform:rotate(8deg);pointer-events:none;}
@media(prefers-reduced-motion:no-preference){.hero-watermark{animation:spin 90s linear infinite;}}
.hero .container{display:grid;gap:48px;position:relative;z-index:1;}
@media(min-width:1024px){.hero .container{grid-template-columns:1.1fr 0.9fr;align-items:center;}}
.hero-copy p{color:#D8D8EE;}
.heading-display .line-accent{color:var(--yellow);}
.hero-actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:8px;}

.hero-visual{display:flex;justify-content:center;position:relative;min-height:320px;align-items:center;}
.deco-block{position:absolute;border:2px solid var(--color-border);display:flex;align-items:center;justify-content:center;padding:10px;}
.deco-block img{width:100%;height:100%;object-fit:contain;}
.deco-block--yellow{background:var(--brand);width:90px;height:90px;top:4%;right:6%;--r:12deg;border-radius:9999px;}
.deco-block--orange{background:var(--yellow);width:60px;height:60px;bottom:8%;left:4%;--r:-8deg;}
@media(prefers-reduced-motion:no-preference){.deco-block{animation:float 5s ease-in-out infinite;}.deco-block--orange{animation-delay:.6s;}}

.spin-badge-wrap{position:absolute;top:-8%;left:-6%;width:120px;z-index:3;}
@media(min-width:640px){.spin-badge-wrap{width:140px;}}
.spin-badge{animation:spin 14s linear infinite;}

/* Hero slideshow */
.hero-slideshow{position:relative;width:min(460px,95%);z-index:2;aspect-ratio:1/1;}
.slide{
  position:absolute;top:0;left:0;width:100%;height:100%;
  background:transparent;border:none;box-shadow:none;
  padding:0;transform:none;
  opacity:0;transition:opacity 1s ease-in-out;pointer-events:none;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.slide.active{opacity:1;pointer-events:auto;}
.hero-visual:hover .slide.active{transform:scale(1.03);}
.slide img{width:100%;height:100%;object-fit:contain;object-position:center;transform:rotate(-8deg) scale(1.1);}
.slide .garment{width:100%;height:100%;}

/* Product grid */
.grid{display:grid;gap:24px;grid-template-columns:1fr;}
@media(min-width:640px){.grid{grid-template-columns:repeat(2,1fr);}}
@media(min-width:1024px){.grid--4{grid-template-columns:repeat(4,1fr);}.grid--3{grid-template-columns:repeat(3,1fr);}}

.card{background:var(--color-white);border:2px solid var(--color-border);box-shadow:var(--shadow-md);display:flex;flex-direction:column;transition:transform 150ms var(--ease),box-shadow 150ms var(--ease);}
.card:hover{transform:translate(-3px,-3px);box-shadow:var(--shadow-lg);}
@media(prefers-reduced-motion:reduce){.card:hover{transform:none;}}
.card-media{aspect-ratio:1/1;border-bottom:2px solid var(--color-border);display:flex;align-items:center;justify-content:center;padding:28px;background:var(--color-bg-alt);overflow:hidden;}
.card-body{padding:16px;display:flex;flex-direction:column;gap:8px;flex:1;}
.card-price{font-weight:700;color:var(--color-heading);font-size:16px;}
.card-footer{margin-top:auto;padding-top:8px;}
.badge--pulse{animation:pulse 1.8s ease-in-out infinite;}

.garment{width:78%;aspect-ratio:1/1;position:relative;display:flex;align-items:center;justify-content:center;border:3px solid var(--color-border);background:var(--g-color);transition:transform 200ms var(--ease);clip-path:polygon(30% 2%,70% 2%,70% 10%,88% 10%,100% 32%,84% 44%,74% 36%,74% 98%,26% 98%,26% 36%,16% 44%,0% 32%,12% 10%,30% 10%);}
.garment--hoodie{clip-path:polygon(38% 0%,62% 0%,62% 6%,72% 4%,72% 14%,88% 12%,100% 34%,84% 46%,72% 38%,72% 98%,28% 98%,28% 38%,16% 46%,0% 34%,12% 12%,28% 14%,28% 4%,38% 6%);}
.card:hover .garment{transform:scale(1.06) rotate(-1deg);}
@media(prefers-reduced-motion:reduce){.card:hover .garment{transform:none;}}
.garment-print{width:34%;}

/* Newsletter */
.newsletter-form{display:flex;flex-direction:column;gap:16px;max-width:480px;margin-top:24px;}
@media(min-width:640px){.newsletter-form{flex-direction:row;align-items:flex-end;}}
.field{flex:1;}
.field label{display:block;font-size:14px;font-weight:600;color:var(--color-heading);margin-bottom:8px;}
.field input{display:block;width:100%;font-family:var(--font-sans);font-size:16px;color:var(--color-heading);background:var(--color-white);border:2px solid var(--color-border);box-shadow:var(--shadow-xs);padding:12px;height:44px;transition:border-color 150ms,box-shadow 150ms;}
.field input::placeholder{color:var(--color-body);}
.field input:hover{border-color:#333;}
.field input:focus{outline:none;border-color:var(--brand);box-shadow:var(--shadow-sm);}
.newsletter-form .btn{height:44px;}
.form-status{margin-top:12px;font-weight:600;}
.form-status[hidden]{display:none;}

/* Footer */
.footer{background:var(--navy);color:var(--color-white);--focus-ring:var(--yellow);}
.footer-logo{height:32px;margin-bottom:16px;}
.social-row{display:flex;gap:12px;margin-top:8px;}
.social-row a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:2px solid var(--color-white);color:var(--color-white);transition:transform 150ms var(--ease);}
.social-row a:hover{background:var(--yellow);color:var(--color-black);border-color:var(--yellow);transform:translateY(-2px);}
.footer-bottom{border-top:2px solid #FFFFFF;padding-top:16px;font-size:14px;color:#9C9CD0;margin-top:8px;}
