:root{
  --bg:#050606;
  --text:#d8d6cf;
  --muted:#9f9f9a;
  --green:#7cff00;
  --pink:#ff2aa3;--yellow:#fff200;
  --border:rgba(124,255,0,.28);
  --soft:rgba(255,255,255,.10);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:Arial,Helvetica,sans-serif;
  background:
    linear-gradient(rgba(5,6,6,.55),rgba(5,6,6,.64)),
    url("images/hero-bg.webp");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  background-attachment:fixed;
  color:var(--text);
  line-height:1.5;
}
a{color:inherit;text-decoration:none}

.topbar{
  position:sticky;
  top:0;
  z-index:20;
  border-bottom:1px solid rgba(124,255,0,.22);
  background:rgba(0,0,0,.76);
  backdrop-filter:blur(12px);
}
.nav{
  max-width:1240px;
  margin:0 auto;
  padding:18px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.logo{
  color:var(--green);
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:24px;
  line-height:.9;
  text-transform:uppercase;
  letter-spacing:.8px;
  text-shadow:0 0 12px rgba(124,255,0,.45);
}
.logo small{
  display:block;
  color:#d8d6cf;
  font-size:11px;
  letter-spacing:2.2px;
  margin-top:4px;
}
.menu{
  display:flex;
  gap:24px;
  color:#c9c7bf;
  font-size:14px;
  text-transform:uppercase;
  letter-spacing:.8px;
  font-weight:900;
}
.menu a:hover,.menu a.active{color:var(--green)}
.lang{
  display:flex;
  border:1px solid var(--border);
  background:rgba(0,0,0,.38);
}
.lang a{
  padding:10px 11px;
  font-size:12px;
  font-weight:900;
  color:var(--muted);
  border-right:1px solid var(--border);
}
.lang a:last-child{border-right:0}
.lang a.active,.lang a:hover{background:var(--green);color:#020302}

.hero{
  min-height:100vh;
  display:grid;
  align-items:center;
  padding:110px 24px 72px;
  background:linear-gradient(90deg,rgba(5,6,6,.48),rgba(5,6,6,.10));
}
.hero-inner{max-width:1240px;margin:0 auto;width:100%}
.eyebrow{
  display:inline-block;
  color:var(--green);
  text-transform:uppercase;
  font-weight:900;
  letter-spacing:2px;
  font-size:13px;
  margin-bottom:20px;
  padding:8px 12px;
  border-left:4px solid var(--green);
  background:rgba(0,0,0,.42);
}
.graffiti-title{
  max-width:1080px;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:clamp(54px,9vw,126px);
  line-height:.82;
  letter-spacing:-2px;
  text-transform:uppercase;
  margin-bottom:28px;
  transform:skew(-5deg) rotate(-1deg);
  text-shadow:
    3px 3px 0 #000,
    -2px 2px 0 rgba(124,255,0,.24),
    2px -1px 0 rgba(255,42,163,.14),
    0 0 18px rgba(124,255,0,.12);
}
.graffiti-title span{
  display:inline-block;
  color:var(--green);
  position:relative;
  text-shadow:
    3px 3px 0 #000,
    0 0 12px rgba(124,255,0,.75),
    0 0 28px rgba(124,255,0,.30);
}
.graffiti-title span::before,
.graffiti-title span::after,
.drip::before,
.drip::after{
  content:"";
  position:absolute;
  bottom:-18px;
  width:7px;
  border-radius:0 0 8px 8px;
  background:linear-gradient(to bottom,var(--green),rgba(124,255,0,0));
  box-shadow:0 0 10px rgba(124,255,0,.45);
}
.graffiti-title span::before{left:18%;height:24px}
.graffiti-title span::after{left:72%;height:34px}

.lead{
  max-width:710px;
  color:#d2d0c8;
  font-size:21px;
  margin-bottom:34px;
  text-shadow:0 2px 8px rgba(0,0,0,.75);
}
.actions{display:flex;flex-wrap:wrap;gap:14px}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  padding:0 24px;
  border:1px solid var(--green);
  color:var(--green);
  text-transform:uppercase;
  font-size:13px;
  font-weight:900;
  letter-spacing:.8px;
  background:rgba(0,0,0,.42);
  transition:.2s ease;
}
.btn.primary{background:var(--green);color:#020302;box-shadow:0 0 28px rgba(124,255,0,.32)}
.btn:hover{transform:translateY(-2px)}

.section{padding:82px 24px}
.inner{max-width:1240px;margin:0 auto}
.section-title{
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:clamp(42px,6vw,78px);
  line-height:.88;
  text-transform:uppercase;
  letter-spacing:-1px;
  transform:skew(-4deg);
  text-shadow:
    3px 3px 0 #000,
    0 0 18px rgba(124,255,0,.16);
}
.head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:28px;
  margin-bottom:30px;
}
.head p{max-width:540px;color:#c8c6be;font-size:17px}

.crew-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.crew-card{
  min-height:260px;
  padding:28px;
  border:1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 70% 15%,rgba(124,255,0,.13),transparent 32%),
    linear-gradient(180deg,rgba(8,10,10,.78),rgba(0,0,0,.68));
  backdrop-filter:blur(2px);
  position:relative;
  overflow:hidden;
}
.crew-card::before{
  content:"";
  position:absolute;
  inset:14px;
  border:1px dashed rgba(124,255,0,.20);
  transform:rotate(-1.2deg);
  pointer-events:none;
}
.crew-card h3{
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:54px;
  line-height:.85;
  text-transform:uppercase;
  letter-spacing:-1px;
  margin-bottom:22px;
  color:#d8d6cf;
  text-shadow:3px 3px 0 #000,0 0 10px rgba(124,255,0,.10);
}
.crew-card p{
  position:relative;
  z-index:1;
  color:#bdbbb3;
  font-size:16px;
}
.crew-card .tag{
  display:inline-block;
  color:var(--green);
  font-weight:900;
  letter-spacing:1.8px;
  text-transform:uppercase;
  margin-bottom:18px;
}
.vyra-card{
  background:
    radial-gradient(circle at 70% 15%,rgba(255,42,163,.16),transparent 32%),
    linear-gradient(180deg,rgba(8,10,10,.78),rgba(0,0,0,.68));
  border-color:rgba(255,42,163,.30);
}
.vyra-card::before{border-color:rgba(255,42,163,.22)}
.vyra-card .tag{color:var(--pink)}

.product-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}
.product{
  border:1px solid rgba(255,255,255,.11);
  background:linear-gradient(180deg,rgba(13,15,15,.88),rgba(5,6,6,.80));
  backdrop-filter:blur(2px);
  overflow:hidden;
}
.pic{
  min-height:230px;
  background:
    radial-gradient(circle at 50% 42%,rgba(124,255,0,.18),transparent 34%),
    linear-gradient(145deg,#171a1a,#050606);
  display:grid;
  place-items:center;
  color:rgba(124,255,0,.72);
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:42px;
  text-transform:uppercase;
}
.pic img{width:100%;height:100%;object-fit:cover;display:block}
.product-body{padding:22px}
.product h3{
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:30px;
  text-transform:uppercase;
  line-height:.95;
  margin-bottom:10px;
}
.product p{color:var(--muted);font-size:15px;min-height:72px;margin-bottom:18px}
.price{
  display:block;
  color:var(--green);
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:32px;
  line-height:1;
  margin-bottom:4px;
}
.shipping{display:block;color:var(--muted);font-size:13px;margin-bottom:18px}

.shop-hero{
  padding:96px 24px 70px;
  border-bottom:1px solid var(--border);
  background:linear-gradient(90deg,rgba(5,6,6,.42),rgba(5,6,6,.12));
}
.shop-hero .inner{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:40px;
  align-items:end;
}
.note{
  border:1px solid var(--border);
  padding:24px;
  background:rgba(0,0,0,.46);
  backdrop-filter:blur(2px);
}
.note h3{
  color:var(--green);
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:28px;
  text-transform:uppercase;
  margin-bottom:10px;
}
.note p{color:#bdbbb3}

.size-section,.info{background:rgba(5,6,6,.48);border-top:1px solid var(--border)}
.size-table-wrap{overflow-x:auto;border:1px solid var(--border);background:rgba(0,0,0,.28)}
.size-table{width:100%;border-collapse:collapse;min-width:620px}
.size-table th,.size-table td{padding:16px 14px;border-bottom:1px solid rgba(255,255,255,.08);text-align:left}
.size-table th{color:var(--green);text-transform:uppercase;font-size:13px;letter-spacing:.8px;background:rgba(124,255,0,.04)}
.size-table td{color:#bdbbb3;font-size:15px}
.size-note{color:var(--muted);font-size:14px;margin-top:14px}
.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.info-card{
  border:1px solid var(--border);
  padding:24px;
  background:linear-gradient(180deg,rgba(13,15,15,.80),rgba(5,6,6,.68));
  min-height:180px;
}
.info-card h3{
  font-family:Impact,"Arial Black",Arial,sans-serif;
  color:var(--green);
  text-transform:uppercase;
  font-size:26px;
  margin-bottom:10px;
}
.info-card p{color:var(--muted);font-size:15px}


.future-card{
  border-color:rgba(255,242,0,.30);
  background:
    radial-gradient(circle at 70% 15%,rgba(255,242,0,.13),transparent 32%),
    linear-gradient(180deg,rgba(8,10,10,.78),rgba(0,0,0,.68));
}
.future-card::before{border-color:rgba(255,242,0,.22)}
.future-card .tag{color:var(--yellow)}
.multi-neon-line{
  height:2px;
  width:min(620px,100%);
  margin:30px 0 0;
  background:linear-gradient(90deg,var(--green),var(--pink),var(--yellow));
  box-shadow:
    0 0 12px rgba(124,255,0,.32),
    0 0 18px rgba(255,42,163,.22),
    0 0 20px rgba(255,242,0,.14);
}

.footer{border-top:1px solid var(--soft);background:rgba(3,4,4,.78)}
.footer-inner{max-width:1240px;margin:0 auto;padding:34px 24px;display:flex;justify-content:space-between;gap:24px;color:var(--muted);font-size:14px}
.footer-links{display:flex;flex-wrap:wrap;gap:18px}
.footer-links a:hover{color:var(--green)}

body.shop-page{
  background:
    linear-gradient(rgba(5,6,6,.60),rgba(5,6,6,.66)),
    url("images/shop-bg.webp");
  background-size:cover;
  background-position:center 30%;
  background-repeat:no-repeat;
  background-attachment:fixed;
}


.cta-panel{
  border:1px solid var(--border);
  background:
    radial-gradient(circle at 15% 20%,rgba(124,255,0,.15),transparent 28%),
    radial-gradient(circle at 85% 30%,rgba(255,42,163,.12),transparent 28%),
    linear-gradient(180deg,rgba(7,9,9,.86),rgba(0,0,0,.68));
  padding:34px;
  backdrop-filter:blur(2px);
}
.cta-panel h2{
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:clamp(38px,5vw,72px);
  line-height:.9;
  text-transform:uppercase;
  margin-bottom:18px;
  color:var(--green);
  text-shadow:3px 3px 0 #000,0 0 14px rgba(124,255,0,.28);
}
.cta-panel p{
  max-width:760px;
  color:#c8c6be;
  font-size:18px;
  margin-bottom:24px;
}
.steps{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}
.step{
  border:1px solid rgba(255,255,255,.11);
  background:rgba(0,0,0,.42);
  padding:22px;
  min-height:165px;
  position:relative;
}
.step strong{
  display:block;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:36px;
  color:var(--green);
  margin-bottom:18px;
}
.step h3{
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:24px;
  text-transform:uppercase;
  line-height:.95;
  margin-bottom:8px;
}
.step p{
  color:var(--muted);
  font-size:15px;
}
.about-split{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
  align-items:stretch;
}
.about-mark{
  border:1px solid var(--border);
  background:
    linear-gradient(135deg,rgba(124,255,0,.10),rgba(255,42,163,.08),rgba(255,242,0,.07)),
    rgba(0,0,0,.48);
  min-height:340px;
  display:grid;
  place-items:center;
  padding:28px;
}
.about-mark span{
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:clamp(72px,12vw,160px);
  color:var(--green);
  text-shadow:
    4px 4px 0 #000,
    0 0 22px rgba(124,255,0,.38),
    0 0 34px rgba(255,42,163,.14);
  transform:skew(-6deg) rotate(-2deg);
}
.social-row{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:18px;
}
.social-link{
  border:1px solid var(--border);
  color:var(--green);
  padding:12px 16px;
  text-transform:uppercase;
  font-weight:900;
  font-size:13px;
  background:rgba(0,0,0,.42);
}
.social-link:hover{
  background:var(--green);
  color:#020302;
}

.brand-tag-panel{
  border:1px solid var(--border);
  background:
    radial-gradient(circle at 20% 20%,rgba(124,255,0,.13),transparent 28%),
    radial-gradient(circle at 78% 28%,rgba(255,42,163,.12),transparent 30%),
    radial-gradient(circle at 55% 90%,rgba(255,242,0,.10),transparent 30%),
    rgba(0,0,0,.48);
  min-height:340px;
  padding:26px;
  display:grid;
  gap:14px;
  align-content:center;
  backdrop-filter:blur(2px);
  position:relative;
  overflow:hidden;
}
.brand-tag-panel::before{
  content:"";
  position:absolute;
  inset:16px;
  border:1px dashed rgba(124,255,0,.18);
  transform:rotate(-1.4deg);
  pointer-events:none;
}
.brand-tag{
  position:relative;
  z-index:1;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.38);
  padding:18px 20px;
  transform:skew(-4deg);
}
.brand-tag strong{
  display:block;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:clamp(34px,5vw,58px);
  line-height:.82;
  text-transform:uppercase;
  letter-spacing:-1px;
  text-shadow:3px 3px 0 #000;
}
.brand-tag span{
  display:block;
  margin-top:8px;
  color:var(--muted);
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:1.2px;
  font-weight:900;
}
.brand-tag.nox strong{color:var(--green);text-shadow:3px 3px 0 #000,0 0 16px rgba(124,255,0,.38)}
.brand-tag.vyra strong{color:var(--pink);text-shadow:3px 3px 0 #000,0 0 16px rgba(255,42,163,.34)}
.brand-tag.next strong{color:var(--yellow);text-shadow:3px 3px 0 #000,0 0 16px rgba(255,242,0,.26)}


/* --- stronger graffiti / streetwear styling --- */
.graffiti-title{
  position:relative;
}
.graffiti-title::after{
  content:"// FE CREW //";
  display:block;
  margin-top:10px;
  font-size:14px;
  letter-spacing:3px;
  color:rgba(255,242,0,.85);
  text-shadow:none;
  transform:translateX(6px) rotate(-2deg);
}
.hero{
  position:relative;
  overflow:hidden;
}
.hero::before{
  content:"XX";
  position:absolute;
  right:6%;
  top:14%;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:clamp(80px,12vw,180px);
  color:rgba(124,255,0,.10);
  transform:rotate(-14deg);
  text-shadow:0 0 18px rgba(124,255,0,.18);
  pointer-events:none;
}
.hero::after{
  content:"SYSTEMFEHLER";
  position:absolute;
  right:7%;
  bottom:10%;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:clamp(22px,3.2vw,46px);
  color:rgba(255,42,163,.12);
  transform:rotate(-8deg);
  letter-spacing:2px;
  pointer-events:none;
}
.eyebrow{
  box-shadow:0 0 14px rgba(124,255,0,.12);
}
.section{
  position:relative;
}
.section::before{
  content:"";
  position:absolute;
  inset:auto auto 16px 24px;
  width:78px;
  height:6px;
  background:linear-gradient(90deg,var(--green),var(--pink),var(--yellow));
  opacity:.7;
}
.section-title{
  position:relative;
}
.section-title::after{
  content:"#";
  color:rgba(124,255,0,.18);
  margin-left:8px;
}
.crew-card,
.product,
.info-card,
.note,
.cta-panel,
.brand-tag-panel,
.step{
  box-shadow:
    0 10px 30px rgba(0,0,0,.20),
    inset 0 1px 0 rgba(255,255,255,.03);
}
.crew-card{
  transform:rotate(-0.6deg);
}
.crew-card:nth-child(2){
  transform:rotate(0.7deg);
}
.crew-card:nth-child(3){
  transform:rotate(-0.3deg);
}
.crew-card h3::after{
  content:" TAG";
  display:inline-block;
  font-size:14px;
  letter-spacing:2px;
  vertical-align:top;
  margin-left:8px;
  color:rgba(255,242,0,.82);
}
.product{
  transform:rotate(-0.4deg);
}
.product:nth-child(even){
  transform:rotate(0.5deg);
}
.pic{
  position:relative;
  overflow:hidden;
}
.steps .step{
  transform:rotate(-0.5deg);
}
.steps .step:nth-child(2),
.steps .step:nth-child(4){
  transform:rotate(0.6deg);
}
.cta-panel{
  position:relative;
  overflow:hidden;
}
.cta-panel::after{
  content:"GO TO ETSY";
  position:absolute;
  top:18px;
  right:18px;
  color:rgba(255,242,0,.65);
  font-size:12px;
  font-weight:900;
  letter-spacing:2px;
  transform:rotate(-6deg);
}
.visual-strip{
  display:grid;
  grid-template-columns:1.05fr .95fr .95fr;
  gap:18px;
  margin-top:28px;
}
.visual-card{
  min-height:220px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.34);
  overflow:hidden;
  position:relative;
  transform:rotate(-1deg);
}
.visual-card:nth-child(2){
  transform:rotate(0.8deg);
}
.visual-card:nth-child(3){
  transform:rotate(-0.4deg);
}
.visual-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  filter:saturate(1.02) contrast(1.02);
}
.visual-card .cap{
  position:absolute;
  left:12px;
  bottom:12px;
  padding:8px 10px;
  background:rgba(0,0,0,.55);
  border:1px solid rgba(124,255,0,.18);
  color:#d8d6cf;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:1.4px;
  font-weight:900;
}
.about-split{
  align-items:start;
}
.brand-tag-panel::after{
  content:"CREW BOARD";
  position:absolute;
  right:16px;
  top:14px;
  color:rgba(255,242,0,.55);
  font-size:12px;
  letter-spacing:2px;
  font-weight:900;
  transform:rotate(-5deg);
}
.footer{
  position:relative;
}
.footer::before{
  content:"FRANZ-ELIZABETH DESIGN STUDIO";
  position:absolute;
  left:24px;
  top:-14px;
  background:#050606;
  padding:0 10px;
  color:rgba(124,255,0,.42);
  font-size:11px;
  letter-spacing:2px;
}

/* === V32 FINAL BRAND DESIGN OVERRIDE === */
:root{
  --green:#baff00;
  --pink:#ff2aa3;
  --yellow:#fff200;
  --text:#d8d6cf;
  --muted:#aaa69b;
  --panel:rgba(0,0,0,.68);
  --border:rgba(186,255,0,.24);
}

body{
  background:
    linear-gradient(rgba(5,6,6,.55),rgba(5,6,6,.68)),
    url("images/hero-bg.webp") !important;
  background-size:cover !important;
  background-position:center !important;
  background-attachment:fixed !important;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 16%, rgba(186,255,0,.12), transparent 22%),
    radial-gradient(circle at 86% 24%, rgba(255,42,163,.09), transparent 26%),
    linear-gradient(90deg, rgba(0,0,0,.36), rgba(0,0,0,.10));
  z-index:-1;
}

.graphic-headline{
  display:block;
  width:min(100%,860px);
  height:auto;
  margin:0 0 12px;
  filter:drop-shadow(0 14px 26px rgba(0,0,0,.55));
}

.graphic-headline.center{
  margin-left:auto;
  margin-right:auto;
}

.graphic-headline.small{
  width:min(100%,560px);
}

.hero-graphic-stack{
  display:grid;
  gap:0;
  margin-bottom:24px;
}

.hero-graphic-stack .graphic-headline{
  margin-bottom:-22px;
}

.hero-graphic-stack .graphic-headline:last-child{
  margin-bottom:0;
}

.text-title-hidden{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
}

.section-title-img{
  margin-bottom:20px;
}

.section-title-img img{
  display:block;
  width:min(100%,560px);
  height:auto;
  filter:drop-shadow(0 10px 20px rgba(0,0,0,.48));
}

.brand-hero-card{
  border:1px solid rgba(186,255,0,.28);
  background:
    radial-gradient(circle at 20% 18%,rgba(186,255,0,.16),transparent 28%),
    radial-gradient(circle at 85% 70%,rgba(255,42,163,.10),transparent 34%),
    rgba(0,0,0,.58);
  padding:26px;
  min-height:420px;
  display:grid;
  align-content:center;
  position:relative;
  overflow:hidden;
  box-shadow:0 20px 50px rgba(0,0,0,.38);
}

.brand-hero-card::before{
  content:"XX";
  position:absolute;
  right:28px;
  top:18px;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:78px;
  color:rgba(216,214,207,.16);
  transform:rotate(-8deg);
}

.brand-hero-card::after{
  content:"";
  position:absolute;
  left:-5%;
  bottom:18%;
  width:110%;
  height:12px;
  background:linear-gradient(90deg,var(--green),var(--green),rgba(255,42,163,.55));
  transform:rotate(-5deg);
  box-shadow:0 0 18px rgba(186,255,0,.22);
}

.brand-hero-logo{
  width:min(100%,420px);
  margin:auto;
  opacity:.95;
  filter:drop-shadow(0 12px 28px rgba(0,0,0,.55));
  position:relative;
  z-index:2;
}

.brand-mini-row{
  position:relative;
  z-index:3;
  margin-top:22px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}

.brand-mini{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.48);
  padding:14px;
  text-align:center;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  text-transform:uppercase;
  font-style:italic;
  font-size:22px;
  line-height:.9;
  text-shadow:2px 2px 0 #000;
}

.brand-mini.green{color:var(--green)}
.brand-mini.pink{color:var(--pink)}
.brand-mini.yellow{color:var(--yellow)}

.crew-card,
.product,
.info-card,
.note,
.cta-panel,
.step,
.brand-tag-panel,
.visual-card,
.about-card{
  background:
    radial-gradient(circle at 18% 18%,rgba(186,255,0,.08),transparent 28%),
    rgba(0,0,0,.66) !important;
  border-color:rgba(186,255,0,.22) !important;
}

.vyra-card,
.card-vyra{
  border-color:rgba(255,42,163,.30)!important;
  background:
    radial-gradient(circle at 18% 18%,rgba(255,42,163,.12),transparent 28%),
    rgba(0,0,0,.66) !important;
}

.future-card,
.card-future{
  border-color:rgba(255,242,0,.20)!important;
  background:
    radial-gradient(circle at 18% 18%,rgba(255,242,0,.09),transparent 28%),
    rgba(0,0,0,.66) !important;
}

.brand-word{
  display:inline-block;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-style:italic;
  text-transform:uppercase;
  font-size:clamp(44px,7vw,92px);
  line-height:.82;
  letter-spacing:-2px;
  text-shadow:4px 4px 0 #000,0 0 16px rgba(0,0,0,.5);
}

.brand-word.green{color:var(--green)}
.brand-word.pink{color:var(--pink)}
.brand-word.yellow{color:var(--yellow)}
.brand-word.white{color:var(--text)}

.brand-word::after{
  content:"";
  display:block;
  width:72%;
  height:8px;
  margin-top:10px;
  background:currentColor;
  transform:rotate(-2deg);
  box-shadow:0 0 12px currentColor;
}

.shop-note{
  font-size:13px!important;
  color:var(--muted)!important;
  opacity:.88;
}

.product .shipping,
.shipping{
  font-size:13px!important;
  color:var(--muted)!important;
  opacity:.76;
}

.product h3,
.step h3,
.card h3,
.crew-card h3{
  font-family:Impact,"Arial Black",Arial,sans-serif!important;
  font-style:italic!important;
  text-transform:uppercase!important;
}

.product-title-graphic{
  display:block;
  width:100%;
  height:auto;
  margin-bottom:12px;
  filter:drop-shadow(0 8px 16px rgba(0,0,0,.45));
}

@media(max-width:980px){
  .brand-hero-card{min-height:320px}
  .hero-graphic-stack .graphic-headline{margin-bottom:-18px}
  .brand-mini-row{grid-template-columns:1fr}
}

@media(max-width:980px){
  .visual-strip{
    grid-template-columns:1fr;
  }
}


/* === V32 FINAL BRAND DESIGN OVERRIDE === */
:root{
  --green:#baff00;
  --pink:#ff2aa3;
  --yellow:#fff200;
  --text:#d8d6cf;
  --muted:#aaa69b;
  --panel:rgba(0,0,0,.68);
  --border:rgba(186,255,0,.24);
}

body{
  background:
    linear-gradient(rgba(5,6,6,.55),rgba(5,6,6,.68)),
    url("images/hero-bg.webp") !important;
  background-size:cover !important;
  background-position:center !important;
  background-attachment:fixed !important;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 16%, rgba(186,255,0,.12), transparent 22%),
    radial-gradient(circle at 86% 24%, rgba(255,42,163,.09), transparent 26%),
    linear-gradient(90deg, rgba(0,0,0,.36), rgba(0,0,0,.10));
  z-index:-1;
}

.graphic-headline{
  display:block;
  width:min(100%,860px);
  height:auto;
  margin:0 0 12px;
  filter:drop-shadow(0 14px 26px rgba(0,0,0,.55));
}

.graphic-headline.center{
  margin-left:auto;
  margin-right:auto;
}

.graphic-headline.small{
  width:min(100%,560px);
}

.hero-graphic-stack{
  display:grid;
  gap:0;
  margin-bottom:24px;
}

.hero-graphic-stack .graphic-headline{
  margin-bottom:-22px;
}

.hero-graphic-stack .graphic-headline:last-child{
  margin-bottom:0;
}

.text-title-hidden{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
}

.section-title-img{
  margin-bottom:20px;
}

.section-title-img img{
  display:block;
  width:min(100%,560px);
  height:auto;
  filter:drop-shadow(0 10px 20px rgba(0,0,0,.48));
}

.brand-hero-card{
  border:1px solid rgba(186,255,0,.28);
  background:
    radial-gradient(circle at 20% 18%,rgba(186,255,0,.16),transparent 28%),
    radial-gradient(circle at 85% 70%,rgba(255,42,163,.10),transparent 34%),
    rgba(0,0,0,.58);
  padding:26px;
  min-height:420px;
  display:grid;
  align-content:center;
  position:relative;
  overflow:hidden;
  box-shadow:0 20px 50px rgba(0,0,0,.38);
}

.brand-hero-card::before{
  content:"XX";
  position:absolute;
  right:28px;
  top:18px;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:78px;
  color:rgba(216,214,207,.16);
  transform:rotate(-8deg);
}

.brand-hero-card::after{
  content:"";
  position:absolute;
  left:-5%;
  bottom:18%;
  width:110%;
  height:12px;
  background:linear-gradient(90deg,var(--green),var(--green),rgba(255,42,163,.55));
  transform:rotate(-5deg);
  box-shadow:0 0 18px rgba(186,255,0,.22);
}

.brand-hero-logo{
  width:min(100%,420px);
  margin:auto;
  opacity:.95;
  filter:drop-shadow(0 12px 28px rgba(0,0,0,.55));
  position:relative;
  z-index:2;
}

.brand-mini-row{
  position:relative;
  z-index:3;
  margin-top:22px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}

.brand-mini{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.48);
  padding:14px;
  text-align:center;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  text-transform:uppercase;
  font-style:italic;
  font-size:22px;
  line-height:.9;
  text-shadow:2px 2px 0 #000;
}

.brand-mini.green{color:var(--green)}
.brand-mini.pink{color:var(--pink)}
.brand-mini.yellow{color:var(--yellow)}

.crew-card,
.product,
.info-card,
.note,
.cta-panel,
.step,
.brand-tag-panel,
.visual-card,
.about-card{
  background:
    radial-gradient(circle at 18% 18%,rgba(186,255,0,.08),transparent 28%),
    rgba(0,0,0,.66) !important;
  border-color:rgba(186,255,0,.22) !important;
}

.vyra-card,
.card-vyra{
  border-color:rgba(255,42,163,.30)!important;
  background:
    radial-gradient(circle at 18% 18%,rgba(255,42,163,.12),transparent 28%),
    rgba(0,0,0,.66) !important;
}

.future-card,
.card-future{
  border-color:rgba(255,242,0,.20)!important;
  background:
    radial-gradient(circle at 18% 18%,rgba(255,242,0,.09),transparent 28%),
    rgba(0,0,0,.66) !important;
}

.brand-word{
  display:inline-block;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-style:italic;
  text-transform:uppercase;
  font-size:clamp(44px,7vw,92px);
  line-height:.82;
  letter-spacing:-2px;
  text-shadow:4px 4px 0 #000,0 0 16px rgba(0,0,0,.5);
}

.brand-word.green{color:var(--green)}
.brand-word.pink{color:var(--pink)}
.brand-word.yellow{color:var(--yellow)}
.brand-word.white{color:var(--text)}

.brand-word::after{
  content:"";
  display:block;
  width:72%;
  height:8px;
  margin-top:10px;
  background:currentColor;
  transform:rotate(-2deg);
  box-shadow:0 0 12px currentColor;
}

.shop-note{
  font-size:13px!important;
  color:var(--muted)!important;
  opacity:.88;
}

.product .shipping,
.shipping{
  font-size:13px!important;
  color:var(--muted)!important;
  opacity:.76;
}

.product h3,
.step h3,
.card h3,
.crew-card h3{
  font-family:Impact,"Arial Black",Arial,sans-serif!important;
  font-style:italic!important;
  text-transform:uppercase!important;
}

.product-title-graphic{
  display:block;
  width:100%;
  height:auto;
  margin-bottom:12px;
  filter:drop-shadow(0 8px 16px rgba(0,0,0,.45));
}

@media(max-width:980px){
  .brand-hero-card{min-height:320px}
  .hero-graphic-stack .graphic-headline{margin-bottom:-18px}
  .brand-mini-row{grid-template-columns:1fr}
}

@media(max-width:980px){
  .steps{grid-template-columns:repeat(2,1fr)}
  .about-split{grid-template-columns:1fr}
}
@media(max-width:620px){
  .steps{grid-template-columns:1fr}
  .cta-panel{padding:24px}
}


.brand-tag-panel{
  border:1px solid var(--border);
  background:
    radial-gradient(circle at 20% 20%,rgba(124,255,0,.13),transparent 28%),
    radial-gradient(circle at 78% 28%,rgba(255,42,163,.12),transparent 30%),
    radial-gradient(circle at 55% 90%,rgba(255,242,0,.10),transparent 30%),
    rgba(0,0,0,.48);
  min-height:340px;
  padding:26px;
  display:grid;
  gap:14px;
  align-content:center;
  backdrop-filter:blur(2px);
  position:relative;
  overflow:hidden;
}
.brand-tag-panel::before{
  content:"";
  position:absolute;
  inset:16px;
  border:1px dashed rgba(124,255,0,.18);
  transform:rotate(-1.4deg);
  pointer-events:none;
}
.brand-tag{
  position:relative;
  z-index:1;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.38);
  padding:18px 20px;
  transform:skew(-4deg);
}
.brand-tag strong{
  display:block;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:clamp(34px,5vw,58px);
  line-height:.82;
  text-transform:uppercase;
  letter-spacing:-1px;
  text-shadow:3px 3px 0 #000;
}
.brand-tag span{
  display:block;
  margin-top:8px;
  color:var(--muted);
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:1.2px;
  font-weight:900;
}
.brand-tag.nox strong{color:var(--green);text-shadow:3px 3px 0 #000,0 0 16px rgba(124,255,0,.38)}
.brand-tag.vyra strong{color:var(--pink);text-shadow:3px 3px 0 #000,0 0 16px rgba(255,42,163,.34)}
.brand-tag.next strong{color:var(--yellow);text-shadow:3px 3px 0 #000,0 0 16px rgba(255,242,0,.26)}


/* --- stronger graffiti / streetwear styling --- */
.graffiti-title{
  position:relative;
}
.graffiti-title::after{
  content:"// FE CREW //";
  display:block;
  margin-top:10px;
  font-size:14px;
  letter-spacing:3px;
  color:rgba(255,242,0,.85);
  text-shadow:none;
  transform:translateX(6px) rotate(-2deg);
}
.hero{
  position:relative;
  overflow:hidden;
}
.hero::before{
  content:"XX";
  position:absolute;
  right:6%;
  top:14%;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:clamp(80px,12vw,180px);
  color:rgba(124,255,0,.10);
  transform:rotate(-14deg);
  text-shadow:0 0 18px rgba(124,255,0,.18);
  pointer-events:none;
}
.hero::after{
  content:"SYSTEMFEHLER";
  position:absolute;
  right:7%;
  bottom:10%;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:clamp(22px,3.2vw,46px);
  color:rgba(255,42,163,.12);
  transform:rotate(-8deg);
  letter-spacing:2px;
  pointer-events:none;
}
.eyebrow{
  box-shadow:0 0 14px rgba(124,255,0,.12);
}
.section{
  position:relative;
}
.section::before{
  content:"";
  position:absolute;
  inset:auto auto 16px 24px;
  width:78px;
  height:6px;
  background:linear-gradient(90deg,var(--green),var(--pink),var(--yellow));
  opacity:.7;
}
.section-title{
  position:relative;
}
.section-title::after{
  content:"#";
  color:rgba(124,255,0,.18);
  margin-left:8px;
}
.crew-card,
.product,
.info-card,
.note,
.cta-panel,
.brand-tag-panel,
.step{
  box-shadow:
    0 10px 30px rgba(0,0,0,.20),
    inset 0 1px 0 rgba(255,255,255,.03);
}
.crew-card{
  transform:rotate(-0.6deg);
}
.crew-card:nth-child(2){
  transform:rotate(0.7deg);
}
.crew-card:nth-child(3){
  transform:rotate(-0.3deg);
}
.crew-card h3::after{
  content:" TAG";
  display:inline-block;
  font-size:14px;
  letter-spacing:2px;
  vertical-align:top;
  margin-left:8px;
  color:rgba(255,242,0,.82);
}
.product{
  transform:rotate(-0.4deg);
}
.product:nth-child(even){
  transform:rotate(0.5deg);
}
.pic{
  position:relative;
  overflow:hidden;
}
.steps .step{
  transform:rotate(-0.5deg);
}
.steps .step:nth-child(2),
.steps .step:nth-child(4){
  transform:rotate(0.6deg);
}
.cta-panel{
  position:relative;
  overflow:hidden;
}
.cta-panel::after{
  content:"GO TO ETSY";
  position:absolute;
  top:18px;
  right:18px;
  color:rgba(255,242,0,.65);
  font-size:12px;
  font-weight:900;
  letter-spacing:2px;
  transform:rotate(-6deg);
}
.visual-strip{
  display:grid;
  grid-template-columns:1.05fr .95fr .95fr;
  gap:18px;
  margin-top:28px;
}
.visual-card{
  min-height:220px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.34);
  overflow:hidden;
  position:relative;
  transform:rotate(-1deg);
}
.visual-card:nth-child(2){
  transform:rotate(0.8deg);
}
.visual-card:nth-child(3){
  transform:rotate(-0.4deg);
}
.visual-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  filter:saturate(1.02) contrast(1.02);
}
.visual-card .cap{
  position:absolute;
  left:12px;
  bottom:12px;
  padding:8px 10px;
  background:rgba(0,0,0,.55);
  border:1px solid rgba(124,255,0,.18);
  color:#d8d6cf;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:1.4px;
  font-weight:900;
}
.about-split{
  align-items:start;
}
.brand-tag-panel::after{
  content:"CREW BOARD";
  position:absolute;
  right:16px;
  top:14px;
  color:rgba(255,242,0,.55);
  font-size:12px;
  letter-spacing:2px;
  font-weight:900;
  transform:rotate(-5deg);
}
.footer{
  position:relative;
}
.footer::before{
  content:"FRANZ-ELIZABETH DESIGN STUDIO";
  position:absolute;
  left:24px;
  top:-14px;
  background:#050606;
  padding:0 10px;
  color:rgba(124,255,0,.42);
  font-size:11px;
  letter-spacing:2px;
}

/* === V32 FINAL BRAND DESIGN OVERRIDE === */
:root{
  --green:#baff00;
  --pink:#ff2aa3;
  --yellow:#fff200;
  --text:#d8d6cf;
  --muted:#aaa69b;
  --panel:rgba(0,0,0,.68);
  --border:rgba(186,255,0,.24);
}

body{
  background:
    linear-gradient(rgba(5,6,6,.55),rgba(5,6,6,.68)),
    url("images/hero-bg.webp") !important;
  background-size:cover !important;
  background-position:center !important;
  background-attachment:fixed !important;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 16%, rgba(186,255,0,.12), transparent 22%),
    radial-gradient(circle at 86% 24%, rgba(255,42,163,.09), transparent 26%),
    linear-gradient(90deg, rgba(0,0,0,.36), rgba(0,0,0,.10));
  z-index:-1;
}

.graphic-headline{
  display:block;
  width:min(100%,860px);
  height:auto;
  margin:0 0 12px;
  filter:drop-shadow(0 14px 26px rgba(0,0,0,.55));
}

.graphic-headline.center{
  margin-left:auto;
  margin-right:auto;
}

.graphic-headline.small{
  width:min(100%,560px);
}

.hero-graphic-stack{
  display:grid;
  gap:0;
  margin-bottom:24px;
}

.hero-graphic-stack .graphic-headline{
  margin-bottom:-22px;
}

.hero-graphic-stack .graphic-headline:last-child{
  margin-bottom:0;
}

.text-title-hidden{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
}

.section-title-img{
  margin-bottom:20px;
}

.section-title-img img{
  display:block;
  width:min(100%,560px);
  height:auto;
  filter:drop-shadow(0 10px 20px rgba(0,0,0,.48));
}

.brand-hero-card{
  border:1px solid rgba(186,255,0,.28);
  background:
    radial-gradient(circle at 20% 18%,rgba(186,255,0,.16),transparent 28%),
    radial-gradient(circle at 85% 70%,rgba(255,42,163,.10),transparent 34%),
    rgba(0,0,0,.58);
  padding:26px;
  min-height:420px;
  display:grid;
  align-content:center;
  position:relative;
  overflow:hidden;
  box-shadow:0 20px 50px rgba(0,0,0,.38);
}

.brand-hero-card::before{
  content:"XX";
  position:absolute;
  right:28px;
  top:18px;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:78px;
  color:rgba(216,214,207,.16);
  transform:rotate(-8deg);
}

.brand-hero-card::after{
  content:"";
  position:absolute;
  left:-5%;
  bottom:18%;
  width:110%;
  height:12px;
  background:linear-gradient(90deg,var(--green),var(--green),rgba(255,42,163,.55));
  transform:rotate(-5deg);
  box-shadow:0 0 18px rgba(186,255,0,.22);
}

.brand-hero-logo{
  width:min(100%,420px);
  margin:auto;
  opacity:.95;
  filter:drop-shadow(0 12px 28px rgba(0,0,0,.55));
  position:relative;
  z-index:2;
}

.brand-mini-row{
  position:relative;
  z-index:3;
  margin-top:22px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}

.brand-mini{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.48);
  padding:14px;
  text-align:center;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  text-transform:uppercase;
  font-style:italic;
  font-size:22px;
  line-height:.9;
  text-shadow:2px 2px 0 #000;
}

.brand-mini.green{color:var(--green)}
.brand-mini.pink{color:var(--pink)}
.brand-mini.yellow{color:var(--yellow)}

.crew-card,
.product,
.info-card,
.note,
.cta-panel,
.step,
.brand-tag-panel,
.visual-card,
.about-card{
  background:
    radial-gradient(circle at 18% 18%,rgba(186,255,0,.08),transparent 28%),
    rgba(0,0,0,.66) !important;
  border-color:rgba(186,255,0,.22) !important;
}

.vyra-card,
.card-vyra{
  border-color:rgba(255,42,163,.30)!important;
  background:
    radial-gradient(circle at 18% 18%,rgba(255,42,163,.12),transparent 28%),
    rgba(0,0,0,.66) !important;
}

.future-card,
.card-future{
  border-color:rgba(255,242,0,.20)!important;
  background:
    radial-gradient(circle at 18% 18%,rgba(255,242,0,.09),transparent 28%),
    rgba(0,0,0,.66) !important;
}

.brand-word{
  display:inline-block;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-style:italic;
  text-transform:uppercase;
  font-size:clamp(44px,7vw,92px);
  line-height:.82;
  letter-spacing:-2px;
  text-shadow:4px 4px 0 #000,0 0 16px rgba(0,0,0,.5);
}

.brand-word.green{color:var(--green)}
.brand-word.pink{color:var(--pink)}
.brand-word.yellow{color:var(--yellow)}
.brand-word.white{color:var(--text)}

.brand-word::after{
  content:"";
  display:block;
  width:72%;
  height:8px;
  margin-top:10px;
  background:currentColor;
  transform:rotate(-2deg);
  box-shadow:0 0 12px currentColor;
}

.shop-note{
  font-size:13px!important;
  color:var(--muted)!important;
  opacity:.88;
}

.product .shipping,
.shipping{
  font-size:13px!important;
  color:var(--muted)!important;
  opacity:.76;
}

.product h3,
.step h3,
.card h3,
.crew-card h3{
  font-family:Impact,"Arial Black",Arial,sans-serif!important;
  font-style:italic!important;
  text-transform:uppercase!important;
}

.product-title-graphic{
  display:block;
  width:100%;
  height:auto;
  margin-bottom:12px;
  filter:drop-shadow(0 8px 16px rgba(0,0,0,.45));
}

@media(max-width:980px){
  .brand-hero-card{min-height:320px}
  .hero-graphic-stack .graphic-headline{margin-bottom:-18px}
  .brand-mini-row{grid-template-columns:1fr}
}

@media(max-width:980px){
  .visual-strip{
    grid-template-columns:1fr;
  }
}


/* === V32 FINAL BRAND DESIGN OVERRIDE === */
:root{
  --green:#baff00;
  --pink:#ff2aa3;
  --yellow:#fff200;
  --text:#d8d6cf;
  --muted:#aaa69b;
  --panel:rgba(0,0,0,.68);
  --border:rgba(186,255,0,.24);
}

body{
  background:
    linear-gradient(rgba(5,6,6,.55),rgba(5,6,6,.68)),
    url("images/hero-bg.webp") !important;
  background-size:cover !important;
  background-position:center !important;
  background-attachment:fixed !important;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 16%, rgba(186,255,0,.12), transparent 22%),
    radial-gradient(circle at 86% 24%, rgba(255,42,163,.09), transparent 26%),
    linear-gradient(90deg, rgba(0,0,0,.36), rgba(0,0,0,.10));
  z-index:-1;
}

.graphic-headline{
  display:block;
  width:min(100%,860px);
  height:auto;
  margin:0 0 12px;
  filter:drop-shadow(0 14px 26px rgba(0,0,0,.55));
}

.graphic-headline.center{
  margin-left:auto;
  margin-right:auto;
}

.graphic-headline.small{
  width:min(100%,560px);
}

.hero-graphic-stack{
  display:grid;
  gap:0;
  margin-bottom:24px;
}

.hero-graphic-stack .graphic-headline{
  margin-bottom:-22px;
}

.hero-graphic-stack .graphic-headline:last-child{
  margin-bottom:0;
}

.text-title-hidden{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
}

.section-title-img{
  margin-bottom:20px;
}

.section-title-img img{
  display:block;
  width:min(100%,560px);
  height:auto;
  filter:drop-shadow(0 10px 20px rgba(0,0,0,.48));
}

.brand-hero-card{
  border:1px solid rgba(186,255,0,.28);
  background:
    radial-gradient(circle at 20% 18%,rgba(186,255,0,.16),transparent 28%),
    radial-gradient(circle at 85% 70%,rgba(255,42,163,.10),transparent 34%),
    rgba(0,0,0,.58);
  padding:26px;
  min-height:420px;
  display:grid;
  align-content:center;
  position:relative;
  overflow:hidden;
  box-shadow:0 20px 50px rgba(0,0,0,.38);
}

.brand-hero-card::before{
  content:"XX";
  position:absolute;
  right:28px;
  top:18px;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:78px;
  color:rgba(216,214,207,.16);
  transform:rotate(-8deg);
}

.brand-hero-card::after{
  content:"";
  position:absolute;
  left:-5%;
  bottom:18%;
  width:110%;
  height:12px;
  background:linear-gradient(90deg,var(--green),var(--green),rgba(255,42,163,.55));
  transform:rotate(-5deg);
  box-shadow:0 0 18px rgba(186,255,0,.22);
}

.brand-hero-logo{
  width:min(100%,420px);
  margin:auto;
  opacity:.95;
  filter:drop-shadow(0 12px 28px rgba(0,0,0,.55));
  position:relative;
  z-index:2;
}

.brand-mini-row{
  position:relative;
  z-index:3;
  margin-top:22px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}

.brand-mini{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.48);
  padding:14px;
  text-align:center;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  text-transform:uppercase;
  font-style:italic;
  font-size:22px;
  line-height:.9;
  text-shadow:2px 2px 0 #000;
}

.brand-mini.green{color:var(--green)}
.brand-mini.pink{color:var(--pink)}
.brand-mini.yellow{color:var(--yellow)}

.crew-card,
.product,
.info-card,
.note,
.cta-panel,
.step,
.brand-tag-panel,
.visual-card,
.about-card{
  background:
    radial-gradient(circle at 18% 18%,rgba(186,255,0,.08),transparent 28%),
    rgba(0,0,0,.66) !important;
  border-color:rgba(186,255,0,.22) !important;
}

.vyra-card,
.card-vyra{
  border-color:rgba(255,42,163,.30)!important;
  background:
    radial-gradient(circle at 18% 18%,rgba(255,42,163,.12),transparent 28%),
    rgba(0,0,0,.66) !important;
}

.future-card,
.card-future{
  border-color:rgba(255,242,0,.20)!important;
  background:
    radial-gradient(circle at 18% 18%,rgba(255,242,0,.09),transparent 28%),
    rgba(0,0,0,.66) !important;
}

.brand-word{
  display:inline-block;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-style:italic;
  text-transform:uppercase;
  font-size:clamp(44px,7vw,92px);
  line-height:.82;
  letter-spacing:-2px;
  text-shadow:4px 4px 0 #000,0 0 16px rgba(0,0,0,.5);
}

.brand-word.green{color:var(--green)}
.brand-word.pink{color:var(--pink)}
.brand-word.yellow{color:var(--yellow)}
.brand-word.white{color:var(--text)}

.brand-word::after{
  content:"";
  display:block;
  width:72%;
  height:8px;
  margin-top:10px;
  background:currentColor;
  transform:rotate(-2deg);
  box-shadow:0 0 12px currentColor;
}

.shop-note{
  font-size:13px!important;
  color:var(--muted)!important;
  opacity:.88;
}

.product .shipping,
.shipping{
  font-size:13px!important;
  color:var(--muted)!important;
  opacity:.76;
}

.product h3,
.step h3,
.card h3,
.crew-card h3{
  font-family:Impact,"Arial Black",Arial,sans-serif!important;
  font-style:italic!important;
  text-transform:uppercase!important;
}

.product-title-graphic{
  display:block;
  width:100%;
  height:auto;
  margin-bottom:12px;
  filter:drop-shadow(0 8px 16px rgba(0,0,0,.45));
}

@media(max-width:980px){
  .brand-hero-card{min-height:320px}
  .hero-graphic-stack .graphic-headline{margin-bottom:-18px}
  .brand-mini-row{grid-template-columns:1fr}
}

@media(max-width:980px){
  .menu{display:none}
  .head{display:block}
  .head p{margin-top:14px}
  .crew-grid,.product-grid,.info-grid{grid-template-columns:1fr}
  .shop-hero .inner{grid-template-columns:1fr}
}
@media(max-width:620px){
  .nav,.hero,.section,.shop-hero,.footer-inner{padding-left:16px;padding-right:16px}
  .graffiti-title{letter-spacing:-1px}
  .footer-inner{display:block}
  .footer-links{margin-top:16px}
}

/* === V34 headline transparency fixed: preserve XX/crown marks + smaller size === */
.graphic-headline{
  max-width:620px !important;
  width:min(100%,620px) !important;
  margin-bottom:8px !important;
}

.graphic-headline.small{
  max-width:420px !important;
  width:min(100%,420px) !important;
}

.hero-graphic-stack{
  gap:0 !important;
  margin-bottom:18px !important;
}

.hero-graphic-stack .graphic-headline{
  margin-bottom:-8px !important;
}

.hero-graphic-stack .graphic-headline:last-child{
  margin-bottom:0 !important;
}

.section-title-img img{
  max-width:440px !important;
  width:min(100%,440px) !important;
}

.product-title-graphic{
  max-width:360px !important;
  width:min(100%,360px) !important;
}

@media(max-width:620px){
  .graphic-headline{
    max-width:100% !important;
  }
  .hero-graphic-stack .graphic-headline{
    margin-bottom:-4px !important;
  }
}



/* === V36 logic cleanup ===
   - remove small colored side stripes
   - keep yellow only as tiny accent
   - homepage uses one FE graphic headline: CHARACTER / STREETWEAR / & 3D / BUNDLES
*/
.section::before{display:none!important;}
.hero-main-headline{
  max-width:760px!important;
  width:min(100%,760px)!important;
  margin-bottom:18px!important;
}
.hero .lead{max-width:760px;}
@media(max-width:620px){
  .hero-main-headline{max-width:100%!important;width:100%!important;}
}



/* === Asset protection without layout change === */
img, .section-title-img, .hero-graphic-stack, .pic {
  -webkit-user-drag: none;
  user-select: none;
}


/* === V45 trust / FAQ / launch information === */
.trust-grid,.faq-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.trust-card,.faq-card{
  border:1px solid rgba(186,255,0,.18);
  background:rgba(0,0,0,.52);
  padding:22px;
  box-shadow:0 10px 30px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.03);
}
.trust-card h3,.faq-card h3{
  margin:0 0 10px;
  color:#f2f2e9;
  font-size:17px;
  text-transform:uppercase;
  letter-spacing:1.2px;
}
.trust-card p,.faq-card p{
  margin:0;
  color:var(--muted);
  line-height:1.65;
  font-size:15px;
}
.faq-card strong{color:var(--green)}
.legal-note{
  margin-top:18px;
  padding:14px 16px;
  border:1px dashed rgba(255,242,0,.32);
  color:var(--muted);
  background:rgba(255,242,0,.045);
  font-size:14px;
  line-height:1.6;
}
@media(max-width:900px){.trust-grid,.faq-grid{grid-template-columns:1fr}}

.collection-showcase{
  padding-top:36px;
  padding-bottom:82px;
}
.collection-showcase-card{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(124,255,0,.26);
  background:linear-gradient(135deg,rgba(6,8,7,.94),rgba(0,0,0,.78));
  box-shadow:0 24px 70px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.04);
}
.collection-showcase-image{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:2/1;
  object-fit:cover;
}
.collection-showcase-copy{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  padding:24px 28px 28px;
  border-top:1px solid rgba(124,255,0,.18);
}
.collection-showcase-copy h2{
  margin:0 0 8px;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:clamp(28px,4vw,48px);
  line-height:.95;
  font-style:italic;
  text-transform:uppercase;
  color:#f0efe9;
}
.collection-showcase-copy p{margin:0;max-width:710px;color:#c8c6be;font-size:16px}
@media(max-width:700px){
  .collection-showcase{padding-top:18px!important;padding-bottom:46px!important}
  .collection-showcase-copy{display:block;padding:20px}
  .collection-showcase-copy .btn{width:100%;margin-top:18px}
}

/* === ETSY VERSION 1.0: SAFE CONVERSION LAYER === */
.bundle-configurator,.shirt-card-options{display:none!important}
.etsy-card-cta{display:inline-flex;align-items:center;justify-content:center;margin-top:14px;min-height:46px;width:100%;font-weight:900;text-transform:uppercase;letter-spacing:.8px}
.etsy-shop-note{margin-top:8px;font-size:12px;color:#9f9f9a;line-height:1.4}

.etsy-social-head{display:block;margin-bottom:20px}


/* === Etsy 1.0 · NOX origin story === */
.nox-origin{
  padding-top:22px;
  padding-bottom:82px;
}
.nox-origin-card{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(186,255,0,.22);
  background:
    radial-gradient(circle at 88% 12%,rgba(124,255,0,.11),transparent 34%),
    linear-gradient(180deg,rgba(8,10,10,.82),rgba(0,0,0,.72));
  padding:clamp(28px,5vw,58px);
  box-shadow:0 18px 46px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.035);
}
.nox-origin-card::before{
  content:"";
  position:absolute;
  inset:16px;
  border:1px dashed rgba(124,255,0,.16);
  pointer-events:none;
}
.nox-origin-kicker{
  position:relative;
  z-index:1;
  display:inline-block;
  margin-bottom:14px;
  color:var(--green);
  font-weight:900;
  letter-spacing:2px;
  font-size:12px;
}
.nox-origin h2{
  position:relative;
  z-index:1;
  max-width:880px;
  margin:0 0 28px;
  color:#f2f2e9;
  font-family:Impact,"Arial Black",Arial,sans-serif;
  font-size:clamp(34px,6vw,72px);
  line-height:.94;
  text-transform:uppercase;
  letter-spacing:-.7px;
  text-shadow:3px 3px 0 #000;
}
.nox-origin-copy{
  position:relative;
  z-index:1;
  max-width:900px;
}
.nox-origin-copy p{
  margin:0 0 18px;
  color:#c8c6be;
  font-size:16px;
  line-height:1.75;
}
.nox-origin-copy p:last-child{margin-bottom:0;}
.nox-origin-copy .nox-origin-closing{
  margin-top:26px;
  color:#f2f2e9;
  font-weight:900;
  font-size:18px;
  letter-spacing:.25px;
}
@media(max-width:700px){
  .nox-origin{padding-top:12px;padding-bottom:64px;}
  .nox-origin-card{padding:28px 22px;}
  .nox-origin-card::before{inset:10px;}
  .nox-origin h2{margin-bottom:22px;}
  .nox-origin-copy p{font-size:15px;line-height:1.68;}
}