@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;500;600;700;800&family=Inter:wght@400;500;600;700;800&display=swap');
:root{--g:#18e45e;--g2:#0db94a;--bg:#060708;--panel:#0c0f11;--ink:#fff;--muted:#a1a7ad;--line:rgba(255,255,255,.11)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,Arial,sans-serif}a{color:inherit;text-decoration:none}button,input{font:inherit}.container{width:min(1440px,calc(100% - 82px));margin:auto}.announcement{height:46px;background:var(--g2);color:#001b09;display:flex;align-items:center;overflow:hidden;font:800 11px/1 'Roboto Mono',monospace;letter-spacing:.04em}.ticker{display:flex;gap:44px;min-width:max-content;animation:tick 25s linear infinite}@keyframes tick{to{transform:translateX(-45%)}}.ticker b{margin-left:28px}.header{height:70px;background:#060708;position:sticky;top:0;z-index:60;border-bottom:1px solid rgba(255,255,255,.07)}.nav{height:100%;display:flex;align-items:center;gap:30px}.brand{display:flex;align-items:baseline;gap:8px;flex:0 0 auto}.brand-main{font:700 28px/1 'Barlow Condensed';letter-spacing:-.02em}.brand-main span{color:var(--g)}.brand small{font-size:8px;color:#697178;letter-spacing:.18em}.nav-links{display:flex;gap:24px;margin-left:auto;align-items:center}.nav-links a{font-size:11px;color:#f0f2f3}.nav-links a.active,.nav-links a:hover{color:var(--g)}.nav-actions{display:flex;gap:4px;margin-left:12px}.nav-actions button{position:relative;border:0;background:none;color:#e7e9ea;width:38px;height:38px;font-size:23px;cursor:pointer}.mini-count{position:absolute;right:1px;top:2px;width:14px;height:14px;border-radius:50%;background:var(--g);color:#001b09;font:800 8px/14px Inter}.menu-btn{display:none}.hero{height:620px;position:relative;overflow:hidden}.hero-media{position:absolute;inset:0;background:url('hero.jpg') center/cover no-repeat}.hero-vignette{position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,4,4,.94),rgba(2,4,4,.58) 40%,rgba(2,4,4,.14) 72%,rgba(2,4,4,.7)),linear-gradient(0deg,rgba(2,4,4,.92),transparent 30%)}.hero-inner{height:100%;display:flex;align-items:center;position:relative;z-index:2}.hero-copy{padding-top:35px}.eyebrow{color:var(--g);font:800 11px/1 'Roboto Mono',monospace;letter-spacing:.28em}.hero h1{font:500 clamp(70px,7vw,112px)/.82 'Barlow Condensed';margin:19px 0 14px;letter-spacing:-.03em}.hero p{font-size:22px;margin:0 0 27px}.hero-actions{display:flex;align-items:center;gap:24px}.btn{height:56px;padding:0 29px;border:0;font:800 11px/56px 'Roboto Mono',monospace;letter-spacing:.08em;cursor:pointer;text-transform:uppercase;display:inline-flex;align-items:center;justify-content:center}.btn-green{background:var(--g);color:#00180a}.hero-meta{color:#d7dcdf;font:12px 'Roboto Mono',monospace}.hero-meta b{color:var(--g)}.hero-meta strong{padding:0 15px;color:#9da5aa}.hero-side{position:absolute;right:58px;top:98px;z-index:2;font:500 13px/1.55 'Roboto Mono',monospace;letter-spacing:.26em;text-align:left}.hero-side i{display:block;width:28px;height:2px;background:#fff;margin:26px 0}.hero-side small{font:600 9px/1.9 'Roboto Mono';letter-spacing:.15em}.hero-brand{position:absolute;right:58px;bottom:56px;font:700 25px 'Barlow Condensed'}.hero-brand span{color:var(--g)}.hero-dots{position:absolute;left:max(41px,calc((100vw - 1440px)/2 + 41px));bottom:20px;display:flex;gap:10px;z-index:3}.hero-dots i{width:32px;height:2px;background:#7b858b}.hero-dots i.active{background:var(--g)}.service-band{background:#0b0d0f;border-bottom:1px solid var(--line)}.service-grid{display:grid;grid-template-columns:repeat(5,1fr)}.service-grid>div{display:flex;gap:16px;align-items:center;padding:21px 20px;border-right:1px solid var(--line)}.service-grid>div:last-child{border-right:0}.service-grid span{font-size:27px}.service-grid b{display:block;font:800 11px 'Roboto Mono'}.service-grid small{display:block;color:#a5aaae;margin-top:5px;font-size:10px}.section{padding:40px 0}.section-title{display:flex;justify-content:space-between;align-items:end;margin-bottom:22px}.section-title h2{margin:0;font:600 37px/1 'Barlow Condensed';letter-spacing:.01em}.section-title a{color:var(--g);font:700 11px 'Roboto Mono'}.category-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.cat-card{min-height:142px;border-radius:7px;background-size:cover;background-position:center;position:relative;overflow:hidden;padding:17px;display:flex;justify-content:flex-end;flex-direction:column}.cat-card:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.9),rgba(0,0,0,.02) 70%)}.cat-card>*{position:relative;z-index:1}.cat-card span{font:600 19px 'Barlow Condensed'}.cat-card small{font-size:9px;margin-top:6px}.search-row{display:flex;gap:8px;margin-bottom:12px}.search-row input{flex:1;height:48px;background:#090b0d;border:1px solid #252b30;color:#fff;padding:0 15px;outline:none}.filters{display:flex;gap:7px;margin-bottom:18px;overflow:auto}.filter{height:35px;border:1px solid #2a3136;background:#090b0d;color:#aeb4b8;padding:0 13px;font:800 9px 'Roboto Mono';cursor:pointer}.filter.active,.filter:hover{background:#fff;color:#080a0c}.grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.product-card{background:#0b0e10;border:1px solid rgba(255,255,255,.05);cursor:pointer;transition:.2s;overflow:hidden}.product-card:hover{transform:translateY(-3px);border-color:rgba(24,228,94,.28)}.product-media{aspect-ratio:.83;position:relative;background:#181b1e;overflow:hidden}.product-media img{width:100%;height:100%;object-fit:cover;transition:.3s}.product-card:hover img{transform:scale(1.03)}.tag{position:absolute;z-index:2;left:8px;top:8px;background:var(--g);color:#002009;padding:5px 7px;font:900 8px 'Roboto Mono'}.heart{position:absolute;z-index:3;right:8px;top:8px;width:30px;height:30px;border:0;border-radius:50%;background:rgba(0,0,0,.45);color:#fff;cursor:pointer}.quick-add{position:absolute;left:10px;right:10px;bottom:10px;height:36px;border:0;background:#fff;color:#060708;font:800 9px 'Roboto Mono';transform:translateY(48px);transition:.2s;cursor:pointer}.product-card:hover .quick-add{transform:none}.product-info{padding:10px 8px 14px}.product-name{font-size:11px;font-weight:700}.product-meta{font:8px 'Roboto Mono';color:#767e84;margin-top:4px;text-transform:uppercase}.product-price{font-size:11px;margin-top:7px}.product-old{color:#616970;text-decoration:line-through;margin-left:5px}.product-sale{color:var(--g);font:800 8px 'Roboto Mono';margin-left:6px}.editorial{padding:30px 0 72px}.editorial-wrap{display:grid;grid-template-columns:1fr 1fr;min-height:470px}.editorial-copy{background:#0b0d0f;padding:64px}.editorial-copy h3{font:600 75px/.88 'Barlow Condensed';margin:13px 0 18px}.editorial-copy p{color:#aeb4b9;max-width:530px;font-size:13px;line-height:1.7;margin-bottom:26px}.editorial-image{background:url('https://images.unsplash.com/photo-1517466787929-bc90951d0974?auto=format&fit=crop&w=1200&q=85') center/cover}.newsletter{padding-bottom:75px}.newsletter-box{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:38px 0;display:flex;justify-content:space-between;align-items:center;gap:20px}.newsletter-box h3{font:600 46px 'Barlow Condensed';margin:9px 0 4px}.newsletter-box p{margin:0;color:#8e969c;font-size:10px}.newsletter-box form{display:flex;gap:8px;width:min(520px,100%)}.newsletter-box input{flex:1;height:56px;background:#090b0d;border:1px solid #2b3135;color:#fff;padding:0 13px;outline:none}footer{border-top:1px solid var(--line);padding:40px 0 55px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px}.footer-grid p{color:#747d83;font-size:11px;max-width:250px;margin-top:12px}.footer-grid>b,.footer-grid>div:not(:first-child)>b{font:800 9px 'Roboto Mono';color:#737b81;display:block;margin-bottom:12px}.footer-grid>div:not(:first-child){display:grid;align-content:start;gap:8px}.footer-grid a{font-size:11px;color:#d5d9db}.float-wa{position:fixed;right:26px;bottom:25px;width:58px;height:58px;border-radius:50%;background:#1ed760;color:#03100a;display:grid;place-items:center;font-size:29px;z-index:80}.float-help{position:fixed;right:18px;bottom:15px;transform:translateY(0);width:30px;height:30px;border-radius:50%;background:#fff;color:#111;display:grid;place-items:center;z-index:81;box-shadow:0 4px 14px rgba(0,0,0,.3);font-weight:800}.drawer-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.65);opacity:0;visibility:hidden;z-index:90;transition:.2s}.drawer-backdrop.open{opacity:1;visibility:visible}.cart-drawer{position:fixed;right:0;top:0;bottom:0;width:min(430px,100%);background:#07090a;border-left:1px solid #252a2e;z-index:91;transform:translateX(100%);transition:.25s;display:flex;flex-direction:column}.cart-drawer.open{transform:none}.drawer-head{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid var(--line)}.drawer-head strong{font:600 28px 'Barlow Condensed';text-transform:uppercase}.drawer-head button{border:0;background:none;color:#fff;font-size:28px;cursor:pointer}.cart-list{padding:17px;overflow:auto}.cart-item{display:grid;grid-template-columns:65px 1fr auto;gap:11px;align-items:center;margin-bottom:14px}.cart-item img{width:65px;height:80px;object-fit:cover}.cart-item b{font-size:11px}.cart-item span{display:block;color:#80888e;font-size:9px;margin-top:3px}.cart-remove{background:none;border:0;color:#6d7479;cursor:pointer}.drawer-bottom{margin-top:auto;padding:18px;border-top:1px solid var(--line)}.subtotal{display:flex;justify-content:space-between;margin-bottom:13px}.full{width:100%}.empty{padding:44px 0;text-align:center;color:#647078;font:700 10px 'Roboto Mono'}.modal{position:fixed;inset:0;background:rgba(0,0,0,.7);display:none;align-items:center;justify-content:center;z-index:100;padding:18px}.modal.open{display:flex}.modal-card{width:min(920px,100%);background:#0a0c0e;border:1px solid #282d31}.modal-body{padding:20px}.product-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.product-detail-img{background:#15181b}.product-detail-img img{width:100%;height:100%;max-height:520px;object-fit:cover}.detail-price{font-size:18px;margin:16px 0}.detail-copy{color:#a2a9ad;font-size:12px;line-height:1.7}.size-row{display:flex;gap:7px;margin:9px 0 20px}.size-btn{height:38px;min-width:42px;border:1px solid #30363b;background:#0b0d0f;color:#fff;cursor:pointer}.size-btn.active{background:#fff;color:#050607}.qty-row{display:flex;gap:9px}.qty{display:flex;border:1px solid #30363b}.qty button,.qty input{width:38px;height:46px;border:0;background:#0b0d0f;color:#fff;text-align:center}.toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,20px);background:#fff;color:#050607;padding:11px 16px;font:800 10px 'Roboto Mono';opacity:0;pointer-events:none;z-index:120;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1200px){.container{width:min(1180px,calc(100% - 36px))}.nav-links{gap:16px}.nav-links a{font-size:10px}.grid{grid-template-columns:repeat(4,1fr)}.category-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:900px){.nav-links{display:none;position:absolute;left:0;right:0;top:70px;background:#080a0b;padding:18px 20px;flex-wrap:wrap;border-bottom:1px solid var(--line)}.nav-links.open{display:flex}.menu-btn{display:block}.service-grid{grid-template-columns:repeat(2,1fr)}.service-grid>div:nth-child(2){border-right:0}.hero-side,.hero-brand{display:none}.hero{height:560px}.editorial-wrap{grid-template-columns:1fr}.editorial-image{height:330px}.newsletter-box{display:block}.newsletter-box form{margin-top:20px}.footer-grid{grid-template-columns:1fr 1fr}.grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:600px){.container{width:calc(100% - 24px)}.announcement{height:38px;font-size:9px}.header{height:62px}.brand-main{font-size:23px}.nav-links{top:62px}.hero{height:510px}.hero h1{font-size:62px}.hero p{font-size:16px}.hero-actions{align-items:flex-start;flex-direction:column}.hero-meta{font-size:9px}.service-grid{grid-template-columns:1fr}.service-grid>div{border-right:0;border-bottom:1px solid var(--line)}.category-grid{grid-template-columns:repeat(2,1fr)}.grid{grid-template-columns:repeat(2,1fr)}.section-title h2{font-size:31px}.editorial-copy{padding:38px 24px}.editorial-copy h3{font-size:59px}.newsletter-box h3{font-size:38px}.footer-grid{grid-template-columns:1fr}.product-detail-grid{grid-template-columns:1fr}.product-detail-img{max-height:330px}.float-wa{right:17px;width:52px;height:52px}.float-help{right:10px}}


/* Live customization preview */
.custom-live-card{margin:12px 0 14px;padding:16px 14px 13px;border:1px solid #22292b;border-radius:14px;background:linear-gradient(145deg,#111416,#070909);text-align:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.015)}
.custom-live-name{font:700 11px/1.1 monospace;letter-spacing:.28em;color:#fff;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.custom-live-number{margin-top:3px;font:800 58px/.82 'Barlow Condensed',Impact,sans-serif;color:#fff;letter-spacing:-.02em}
.custom-live-card small{display:block;margin-top:10px;color:#647174;font:400 10px/1.4 Inter,Arial,sans-serif;letter-spacing:.01em}
.detail-print-preview{position:absolute;left:50%;bottom:18px;transform:translate(-50%,8px);width:min(58%,220px);padding:10px 12px 8px;background:rgba(4,7,8,.82);border:1px solid rgba(255,255,255,.12);border-radius:14px;text-align:center;opacity:.84;backdrop-filter:blur(7px);pointer-events:none;transition:.18s ease}
.detail-print-preview.active{opacity:1;border-color:rgba(0,239,104,.38);transform:translate(-50%,0)}
.detail-print-name{font:700 10px/1.1 monospace;letter-spacing:.22em;color:#fff;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.detail-print-number{margin-top:3px;font:800 48px/.82 'Barlow Condensed',Impact,sans-serif;color:#fff}
@media(max-width:700px){.custom-live-number{font-size:48px}.detail-print-preview{width:min(62%,190px)}}


/* =========================================================
   TALKJERSEY — FUTURE READY PRODUCT DETAIL
   UI OVERRIDES — isolated to product/detail experience
========================================================= */

.modal{
  padding:20px;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.modal-card{
  width:min(1080px,96vw);
  max-height:92vh;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  background:
    radial-gradient(circle at 78% 10%,rgba(24,228,94,.055),transparent 28%),
    linear-gradient(145deg,#090d0f,#060809);
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  box-shadow:
    0 30px 90px rgba(0,0,0,.72),
    inset 0 1px 0 rgba(255,255,255,.035);
}

.modal-card>.drawer-head{
  flex:0 0 auto;
  min-height:58px;
  padding:15px 18px;
  background:rgba(0,0,0,.25);
  border-bottom:1px solid rgba(255,255,255,.08);
}

.modal-card>.drawer-head strong{
  font-size:26px;
  letter-spacing:.02em;
}

.modal-card>.drawer-head button{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border:1px solid #273338;
  border-radius:5px;
  background:#080c0e;
  color:#fff;
  font-size:22px;
  transition:.2s ease;
}

.modal-card>.drawer-head button:hover{
  color:#00ef68;
  border-color:#00ef68;
  box-shadow:0 0 18px rgba(0,239,104,.12);
}

.modal-body{
  padding:18px;
  overflow:auto;
  scrollbar-width:thin;
  scrollbar-color:#263338 transparent;
}

.modal-body::-webkit-scrollbar{
  width:5px;
}

.modal-body::-webkit-scrollbar-track{
  background:transparent;
}

.modal-body::-webkit-scrollbar-thumb{
  background:#263338;
  border-radius:20px;
}


/* PRODUCT DETAIL LAYOUT */

.product-detail-grid{
  display:grid;
  grid-template-columns:minmax(380px,46%) minmax(0,1fr);
  gap:26px;
  align-items:start;
}

.product-detail-img{
  position:relative;
  height:min(620px,calc(92vh - 105px));
  min-height:420px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  border-radius:9px;
  background:#0c1113;
}

.product-detail-img::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(0,0,0,.02),transparent 48%,rgba(0,0,0,.18));
}

.product-detail-img img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.detail-panel{
  min-width:0;
  padding:4px 2px 8px 0;
}

.detail-panel h2{
  max-width:100%;
}

.detail-price{
  color:#fff;
  font:700 20px 'Barlow Condensed',sans-serif;
}

.detail-copy{
  max-width:650px;
  margin:12px 0 18px;
}


/* SIZE */

.detail-section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:17px 0 9px;
}

.detail-section-head>span{
  color:#7f8d92;
  font:800 9px/1 'Roboto Mono',monospace;
  letter-spacing:.17em;
}

.detail-section-head em{
  color:#4f6065;
  font:700 8px 'Roboto Mono',monospace;
  font-style:normal;
  letter-spacing:.11em;
}

.size-guide-trigger{
  appearance:none;
  border:1px solid rgba(24,228,94,.45);
  border-radius:5px;
  background:rgba(24,228,94,.035);
  color:#1cf06b;
  padding:9px 12px;
  font:800 8px 'Roboto Mono',monospace;
  letter-spacing:.11em;
  cursor:pointer;
  white-space:nowrap;
  transition:.22s ease;
}

.size-guide-trigger:hover{
  background:#18e45e;
  color:#001608;
  border-color:#18e45e;
  box-shadow:0 0 24px rgba(24,228,94,.16);
}

.size-row{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
  margin:0 0 5px;
}

.size-row .size-btn{
  appearance:none;
  min-width:43px;
  height:39px;
  padding:0 12px;
  border:1px solid #29363b;
  border-radius:4px;
  background:#090d0f;
  color:#e8edef;
  font:700 12px 'Barlow Condensed',sans-serif;
  cursor:pointer;
  transition:.18s ease;
}

.size-row .size-btn:hover{
  border-color:#18e45e;
  color:#18e45e;
  transform:translateY(-1px);
}

.size-row .size-btn.active{
  background:#f4f7f7;
  color:#050708;
  border-color:#f4f7f7;
  box-shadow:none;
}


/* HIDDEN BY DEFAULT — ONLY OPENS ON CLICK */

.size-guide-inline{
  display:none;
  margin:11px 0 15px;
  padding:0;
  border:1px solid #1f2b2f;
  border-radius:8px;
  overflow:hidden;
  background:#080c0e;
}

.size-guide-inline.open{
  display:block;
  animation:JVSizeGuideIn .2s ease;
}

@keyframes JVSizeGuideIn{
  from{opacity:0;transform:translateY(-5px)}
  to{opacity:1;transform:none}
}

.size-guide-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:11px 13px;
  border-bottom:1px solid #1b272b;
  background:rgba(24,228,94,.03);
}

.size-guide-head b{
  color:#18e45e;
  font:800 9px 'Roboto Mono',monospace;
  letter-spacing:.15em;
}

.size-guide-head button{
  appearance:none;
  width:24px;
  height:24px;
  border:1px solid #28353a;
  border-radius:4px;
  background:#0b1012;
  color:#aab4b8;
  cursor:pointer;
}

.size-guide-inline table{
  width:100%;
  border-collapse:collapse;
}

.size-guide-inline th,
.size-guide-inline td{
  padding:8px 12px;
  border-bottom:1px solid rgba(255,255,255,.05);
  text-align:left;
}

.size-guide-inline th{
  color:#627277;
  font:800 8px 'Roboto Mono',monospace;
  letter-spacing:.12em;
}

.size-guide-inline td{
  color:#e3eaec;
  font:600 11px 'Roboto Mono',monospace;
}

.size-guide-inline small{
  display:block;
  padding:10px 12px 12px;
  color:#617176;
  font-size:9px;
  line-height:1.45;
}


/* CUSTOMIZATION */

.custom-box{
  margin-top:18px;
  padding:13px;
  border:1px solid #1e2b2f;
  border-radius:9px;
  background:
    radial-gradient(circle at 100% 0%,rgba(24,228,94,.055),transparent 34%),
    #080c0e;
}

.custom-live-card{
  min-height:124px;
  margin:10px 0 12px;
  border:1px solid #202d31;
  border-radius:9px;
  background:
    radial-gradient(circle at 50% 15%,rgba(255,255,255,.045),transparent 42%),
    linear-gradient(145deg,#101518,#090c0e);
}

.custom-live-name{
  color:#fff;
  font:900 10px 'Barlow Condensed',sans-serif;
  letter-spacing:.27em;
}

.custom-live-number{
  color:#fff;
  font:900 55px/.82 'Barlow Condensed',sans-serif;
}

.custom-live-card small{
  margin-top:12px;
  color:#536469;
  font-size:8px;
}

.print-options{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
}

.print-option{
  appearance:none;
  min-height:55px;
  padding:9px 10px;
  border:1px solid #263338;
  border-radius:6px;
  background:#090d0f;
  color:#cbd4d7;
  text-align:left;
  cursor:pointer;
  transition:.2s ease;
}

.print-option:hover{
  border-color:#536267;
}

.print-option.active{
  border-color:#18e45e;
  background:rgba(24,228,94,.065);
  box-shadow:0 0 18px rgba(24,228,94,.055);
}

.print-option span{
  display:block;
  margin-bottom:4px;
  font-size:10px;
  font-weight:700;
}

.print-option b{
  display:block;
  color:#66767b;
  font:700 8px 'Roboto Mono',monospace;
}

.print-option.active span,
.print-option.active b{
  color:#18e45e;
}

.custom-fields{
  display:grid;
  grid-template-columns:1fr 110px;
  gap:8px;
  margin-top:9px;
}

.custom-fields label{
  color:#6b7c81;
  font:800 8px 'Roboto Mono',monospace;
  letter-spacing:.1em;
}

.custom-fields input{
  width:100%;
  height:42px;
  margin-top:6px;
  padding:0 11px;
  border:1px solid #29373c;
  border-radius:5px;
  outline:none;
  background:#050809;
  color:#fff;
  font:600 11px 'Roboto Mono',monospace;
}

.custom-fields input:focus{
  border-color:#18e45e;
  box-shadow:0 0 0 2px rgba(24,228,94,.06);
}

.badge-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin:13px 0 7px;
}

.badge-head span{
  color:#738287;
  font:800 8px 'Roboto Mono',monospace;
  letter-spacing:.12em;
}

.badge-head small{
  color:#46565b;
  font:700 7px 'Roboto Mono',monospace;
}

.badge-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
  max-height:135px;
  overflow:auto;
  padding-right:2px;
}

.badge-option{
  appearance:none;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  min-height:34px;
  padding:7px 8px;
  border:1px solid #202d31;
  border-radius:5px;
  background:#090d0f;
  color:#748286;
  cursor:pointer;
  transition:.18s ease;
}

.badge-option span{
  font:700 7px 'Roboto Mono',monospace;
}

.badge-option b{
  color:#4f6065;
  font:700 7px 'Roboto Mono',monospace;
}

.badge-option:hover{
  border-color:#5b6a6f;
  color:#dfe6e8;
}

.badge-option.active{
  border-color:#18e45e;
  background:rgba(24,228,94,.06);
  color:#18e45e;
}

.badge-option.active b{
  color:#18e45e;
}

.prepaid-note{
  margin-top:10px;
  padding:8px 9px;
  border-left:2px solid #18e45e;
  background:rgba(24,228,94,.025);
  color:#668078;
  font:700 7px/1.5 'Roboto Mono',monospace;
  letter-spacing:.07em;
}

.detail-total-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-top:14px;
  padding:11px 0;
  border-top:1px solid #1a2529;
}

.detail-total-row span{
  color:#627176;
  font:800 8px 'Roboto Mono',monospace;
  letter-spacing:.14em;
}

.detail-total-row b{
  color:#18e45e;
  font:900 19px 'Barlow Condensed',sans-serif;
}

.qty-row{
  display:flex;
  gap:8px;
  margin-top:8px;
}

.qty{
  flex:0 0 auto;
  height:46px;
  display:flex;
  border:1px solid #29363b;
  border-radius:5px;
  overflow:hidden;
  background:#090d0f;
}

.qty button,
.qty input{
  width:40px;
  height:46px;
  border:0;
  background:transparent;
  color:#fff;
  text-align:center;
}

.qty button{
  cursor:pointer;
  color:#18e45e;
}

.qty input{
  font:800 12px 'Roboto Mono',monospace;
}

.qty-row>.btn{
  min-height:46px;
  height:46px;
  font-size:9px;
  border-radius:5px;
}


/* LIVE PRINT PREVIEW — deliberately subtle so product stays visible */

.detail-print-preview{
  position:absolute;
  left:51%;
  top:45%;
  width:140px;
  transform:translate(-50%,-50%);
  z-index:4;
  text-align:center;
  pointer-events:none;
  opacity:0;
  transition:.2s ease;
}

.detail-print-preview.active{
  opacity:1;
}

.detail-print-name{
  color:#fff;
  font:900 10px 'Barlow Condensed',sans-serif;
  letter-spacing:.19em;
  text-shadow:0 2px 7px #000;
}

.detail-print-number{
  color:#fff;
  font:900 58px/.82 'Barlow Condensed',sans-serif;
  text-shadow:0 3px 8px #000;
}


/* MOBILE DETAIL */

@media(max-width:850px){

  .modal{
    padding:10px;
    align-items:flex-end;
  }

  .modal-card{
    width:100%;
    max-height:94vh;
    border-radius:10px 10px 0 0;
  }

  .modal-body{
    padding:13px;
  }

  .product-detail-grid{
    grid-template-columns:1fr;
    gap:16px;
  }

  .product-detail-img{
    height:330px;
    min-height:0;
  }

  .print-options{
    grid-template-columns:1fr;
  }

  .custom-fields{
    grid-template-columns:1fr;
  }

  .badge-grid{
    grid-template-columns:1fr;
    max-height:160px;
  }
}

@media(max-width:520px){

  .modal-card>.drawer-head strong{
    font-size:22px;
  }

  .detail-panel h2{
    font-size:38px !important;
  }

  .detail-section-head{
    align-items:flex-start;
  }

  .size-guide-trigger{
    padding:8px 9px;
    font-size:7px;
  }

  .custom-live-number{
    font-size:49px;
  }
}


/* =========================================================
   LIVE JERSEY PRINT PREVIEW — FINAL OVERRIDE
   Fixes: input jumping + undersized left-side number
========================================================= */

.detail-print-preview{
  position:absolute !important;
  left:50% !important;
  top:43% !important;
  width:220px !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  display:block !important;
  transform:translate(-50%,-50%) !important;
  z-index:5 !important;
  text-align:center !important;
  pointer-events:none !important;
  opacity:0 !important;
  visibility:hidden !important;
  transition:opacity .18s ease !important;
  overflow:visible !important;
}

.detail-print-preview.active{
  opacity:1 !important;
  visibility:visible !important;
}

.detail-print-name{
  display:block !important;
  width:100% !important;
  color:#fff !important;
  font:900 15px/1 'Barlow Condensed',sans-serif !important;
  letter-spacing:.22em !important;
  text-transform:uppercase !important;
  text-shadow:
    0 2px 5px rgba(0,0,0,.95),
    0 0 8px rgba(0,0,0,.55) !important;
}

.detail-print-number{
  display:block !important;
  width:100% !important;
  margin-top:7px !important;
  color:#fff !important;
  font:900 118px/.75 'Barlow Condensed',sans-serif !important;
  letter-spacing:-.035em !important;
  text-shadow:
    0 4px 10px rgba(0,0,0,.95),
    0 0 12px rgba(0,0,0,.5) !important;
}

/* Prevent the name field from ever being forced out of its box */
.custom-fields{
  min-width:0 !important;
}

.custom-fields label{
  min-width:0 !important;
}

.custom-fields input{
  min-width:0 !important;
  width:100% !important;
  box-sizing:border-box !important;
}

/* Input typing must never rebuild / resize the modal */
.custom-fields input:focus{
  position:relative;
  z-index:3;
}

/* Keep the left preview aligned and contained */
.product-detail-img{
  position:relative !important;
  overflow:hidden !important;
}

@media(max-width:850px){
  .detail-print-preview{
    width:180px !important;
  }

  .detail-print-name{
    font-size:12px !important;
  }

  .detail-print-number{
    font-size:92px !important;
  }
}


/* BADGES — slightly larger, easier to scan */
.badge-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:8px !important;
  max-height:190px !important;
  padding-right:3px !important;
}

.badge-option{
  min-height:44px !important;
  padding:10px 12px !important;
  border-radius:6px !important;
}

.badge-option span{
  font-size:9px !important;
  letter-spacing:.05em !important;
}

.badge-option b{
  font-size:8px !important;
}

.badge-head{
  margin-top:16px !important;
  margin-bottom:9px !important;
}

.badge-head span{
  font-size:9px !important;
}

.badge-head small{
  font-size:8px !important;
}

.prepaid-note{
  font-size:8px !important;
  padding:10px 11px !important;
}

/* Keep the customization panel comfortable on shorter screens */
@media(max-height:760px) and (min-width:851px){
  .badge-grid{
    max-height:160px !important;
  }
}


/* PRODUCT PRICE — larger + bolder */
.detail-price{
  font-size:30px !important;
  line-height:1 !important;
  font-weight:900 !important;
  letter-spacing:.01em !important;
  color:#ffffff !important;
  margin:16px 0 !important;
}

.detail-price .product-old{
  font-size:14px !important;
  font-weight:700 !important;
  margin-left:8px !important;
}

.detail-price .product-sale{
  font-size:9px !important;
  font-weight:900 !important;
  letter-spacing:.1em !important;
  margin-left:7px !important;
  color:#18e45e !important;
}

.detail-total-row b{
  font-size:21px !important;
  font-weight:900 !important;
}

@media(max-width:520px){
  .detail-price{
    font-size:26px !important;
  }

  .detail-price .product-old{
    font-size:12px !important;
  }
}


/* =========================================================
   TALKJERSEY — MOBILE FIRST EXPERIENCE
   Optimized for 320–767px touch screens
========================================================= */

html,
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden !important;
}

img{
  max-width:100%;
}

button,
a{
  -webkit-tap-highlight-color:transparent;
}

@media (max-width: 767px){

  /* ---------- TOP TICKER ---------- */

  .announcement{
    height:34px !important;
    font-size:8px !important;
    letter-spacing:.025em !important;
  }

  .ticker{
    gap:28px !important;
    animation-duration:22s !important;
  }

  /* ---------- HEADER ---------- */

  .header{
    height:62px !important;
  }

  .nav{
    width:100% !important;
    height:62px !important;
    padding:0 13px !important;
    gap:7px !important;
    justify-content:space-between !important;
  }

  .brand{
    min-width:0 !important;
    gap:5px !important;
  }

  .brand-main{
    font-size:23px !important;
    letter-spacing:-1.2px !important;
    white-space:nowrap;
  }

  .brand small{
    display:none !important;
  }

  .nav-links{
    position:absolute !important;
    top:62px !important;
    left:10px !important;
    right:10px !important;
    display:none;
    flex-direction:column !important;
    gap:0 !important;
    padding:7px !important;
    margin:0 !important;
    border:1px solid #193136 !important;
    border-radius:12px !important;
    background:rgba(4,8,9,.97) !important;
    box-shadow:0 20px 55px rgba(0,0,0,.6) !important;
    backdrop-filter:blur(18px);
    z-index:100 !important;
  }

  .nav-links.open{
    display:flex !important;
  }

  .nav-links a{
    width:100% !important;
    padding:13px 12px !important;
    border-radius:7px !important;
    font-size:11px !important;
  }

  .nav-links a:after{
    display:none !important;
  }

  .nav-links a:hover,
  .nav-links a.active{
    background:rgba(0,239,104,.07) !important;
    color:#18e45e !important;
  }

  .nav-actions{
    margin-left:auto !important;
    gap:2px !important;
    flex:0 0 auto !important;
  }

  .nav-actions button{
    width:34px !important;
    height:34px !important;
    font-size:20px !important;
    padding:0 !important;
  }

  .mini-count{
    width:12px !important;
    height:12px !important;
    line-height:12px !important;
    right:0 !important;
    top:0 !important;
    font-size:7px !important;
  }

  .menu-btn{
    display:block !important;
    color:#fff !important;
  }


  /* ---------- HERO ---------- */

  .hero{
    height:auto !important;
    min-height:calc(100svh - 96px) !important;
    max-height:760px !important;
  }

  .hero-media{
    transform:scale(1.01) !important;
    background-position:57% center !important;
  }

  .hero-vignette{
    background:
      linear-gradient(
        180deg,
        rgba(1,3,3,.18) 0%,
        rgba(1,3,3,.18) 28%,
        rgba(1,3,3,.72) 58%,
        rgba(1,3,3,.96) 100%
      ) !important;
  }

  .hero-inner{
    min-height:calc(100svh - 96px) !important;
    height:auto !important;
    align-items:flex-end !important;
    padding:0 18px 62px !important;
  }

  .hero-copy{
    width:100% !important;
    max-width:620px;
    padding:0 !important;
  }

  .hero-status{
    margin-bottom:11px !important;
    padding:6px 9px !important;
    font-size:8px !important;
    letter-spacing:1.1px !important;
  }

  .hero-copy .eyebrow{
    font-size:9px !important;
    letter-spacing:3px !important;
  }

  .hero-copy h1{
    margin:11px 0 10px !important;
    font-size:clamp(52px,15vw,76px) !important;
    line-height:.86 !important;
    letter-spacing:-2px !important;
    max-width:100% !important;
  }

  .hero-copy p{
    margin:0 0 17px !important;
    font-size:16px !important;
    line-height:1.35 !important;
    max-width:340px !important;
  }

  .hero-actions{
    width:100% !important;
    display:flex !important;
    align-items:stretch !important;
    flex-direction:column !important;
    gap:12px !important;
  }

  .hero-actions .btn{
    width:100% !important;
    height:52px !important;
    font-size:10px !important;
  }

  .hero-meta{
    display:flex !important;
    align-items:center !important;
    flex-wrap:wrap !important;
    gap:4px 6px !important;
    font-size:9px !important;
    line-height:1.5 !important;
  }

  .hero-meta strong{
    padding:0 4px !important;
  }

  .hero-side,
  .hero-brand{
    display:none !important;
  }

  .hero-dots{
    left:18px !important;
    bottom:19px !important;
    gap:7px !important;
  }

  .hero-dots i{
    width:25px !important;
  }


  /* ---------- SERVICE STRIP ---------- */

  .service-band{
    overflow:hidden;
  }

  .service-grid{
    width:100% !important;
    grid-template-columns:repeat(2,1fr) !important;
  }

  .service-grid>div{
    min-width:0 !important;
    padding:14px 12px !important;
    gap:9px !important;
    border-right:1px solid rgba(255,255,255,.08) !important;
  }

  .service-grid>div:nth-child(2n){
    border-right:0 !important;
  }

  .service-grid>div:nth-child(n+5){
    grid-column:1/-1;
  }

  .service-grid span{
    font-size:22px !important;
    flex:0 0 auto;
  }

  .service-grid b{
    font-size:8px !important;
    line-height:1.2 !important;
  }

  .service-grid small{
    font-size:8px !important;
    margin-top:3px !important;
    line-height:1.3 !important;
  }


  /* ---------- GLOBAL SECTIONS ---------- */

  .container{
    width:calc(100% - 28px) !important;
    max-width:none !important;
  }

  .section{
    padding:30px 0 !important;
  }

  .section-title{
    margin-bottom:16px !important;
    align-items:flex-end !important;
  }

  .section-title h2{
    font-size:30px !important;
    line-height:.95 !important;
  }

  .section-title a{
    font-size:8px !important;
    white-space:nowrap;
  }


  /* ---------- CATEGORY ---------- */

  .category-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
  }

  .cat-card{
    min-height:132px !important;
    padding:13px !important;
    border-radius:8px !important;
  }

  .cat-card span{
    font-size:17px !important;
    line-height:.95 !important;
  }

  .cat-card small{
    font-size:8px !important;
    margin-top:5px !important;
  }


  /* ---------- PRODUCT SECTION ---------- */

  .search-row{
    display:grid !important;
    grid-template-columns:1fr auto !important;
    gap:7px !important;
    margin:12px 0 13px !important;
  }

  .search-row input{
    min-width:0 !important;
    height:45px !important;
    border-radius:8px !important;
    padding:0 12px !important;
    font-size:11px !important;
  }

  .search-row .btn{
    height:45px !important;
    padding:0 15px !important;
    min-width:auto !important;
    font-size:9px !important;
  }

  .filters{
    gap:6px !important;
    margin-bottom:14px !important;
    padding-bottom:2px;
    scrollbar-width:none;
  }

  .filters::-webkit-scrollbar{
    display:none;
  }

  .filter{
    height:32px !important;
    padding:0 11px !important;
    flex:0 0 auto !important;
    font-size:8px !important;
  }

  .grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:9px !important;
  }

  .product-card{
    min-width:0 !important;
    border-radius:7px !important;
  }

  .product-media{
    aspect-ratio:.78 !important;
  }

  .product-media img{
    object-position:center;
  }

  .tag{
    left:6px !important;
    top:6px !important;
    padding:4px 5px !important;
    font-size:7px !important;
  }

  .heart{
    right:6px !important;
    top:6px !important;
    width:28px !important;
    height:28px !important;
    font-size:17px !important;
  }

  /*
   * No hover on phones — keep CTA visible
   */
  .quick-add{
    left:6px !important;
    right:6px !important;
    bottom:6px !important;
    height:34px !important;
    transform:none !important;
    opacity:1 !important;
    font-size:8px !important;
    border-radius:5px !important;
  }

  .product-info{
    padding:8px 7px 11px !important;
  }

  .product-name{
    font-size:10px !important;
    line-height:1.2 !important;
  }

  .product-meta{
    font-size:7px !important;
    margin-top:4px !important;
  }

  .product-price{
    font-size:11px !important;
    margin-top:6px !important;
    font-weight:800 !important;
  }


  /* ---------- EDITORIAL ---------- */

  .editorial{
    padding:22px 0 45px !important;
  }

  .editorial-wrap{
    grid-template-columns:1fr !important;
    min-height:0 !important;
  }

  .editorial-copy{
    padding:34px 22px !important;
    min-height:310px;
  }

  .editorial-copy h3{
    font-size:56px !important;
    line-height:.85 !important;
  }

  .editorial-copy p{
    font-size:11px !important;
    line-height:1.65 !important;
  }

  .editorial-copy .btn{
    width:100% !important;
    font-size:9px !important;
  }

  .editorial-image{
    min-height:260px !important;
    height:260px !important;
  }


  /* ---------- NEWSLETTER ---------- */

  .newsletter{
    padding-bottom:50px !important;
  }

  .newsletter-box{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:17px !important;
    padding:28px 0 !important;
  }

  .newsletter-box h3{
    font-size:40px !important;
  }

  .newsletter-box form{
    display:grid !important;
    grid-template-columns:1fr auto !important;
    width:100% !important;
    gap:7px !important;
  }

  .newsletter-box input{
    min-width:0 !important;
    height:48px !important;
    font-size:11px !important;
  }

  .newsletter-box .btn{
    height:48px !important;
    padding:0 14px !important;
  }


  /* ---------- FOOTER ---------- */

  footer{
    padding:30px 0 42px !important;
  }

  .footer-grid{
    grid-template-columns:1fr 1fr !important;
    gap:26px 18px !important;
  }

  .footer-grid>div:first-child{
    grid-column:1/-1;
  }

  .footer-grid a{
    font-size:10px !important;
  }

  .footer-grid p{
    font-size:10px !important;
  }


  /* ---------- FLOATING ACTIONS ---------- */

  .float-wa{
    right:14px !important;
    bottom:15px !important;
    width:53px !important;
    height:53px !important;
    z-index:200 !important;
  }

  .float-help{
    right:7px !important;
    bottom:8px !important;
    width:27px !important;
    height:27px !important;
    z-index:201 !important;
  }


  /* ---------- CART DRAWER ---------- */

  .cart-drawer{
    width:min(94vw,430px) !important;
  }

  .drawer-head{
    padding:16px !important;
  }

  .drawer-head strong{
    font-size:25px !important;
  }

  .cart-list{
    padding:14px !important;
  }


  /* ---------- PRODUCT DETAIL MODAL ---------- */

  .modal{
    padding:0 !important;
    align-items:flex-end !important;
    overflow:hidden !important;
  }

  .modal-card{
    width:100% !important;
    max-width:none !important;
    max-height:94svh !important;
    border-radius:14px 14px 0 0 !important;
  }

  .modal-card>.drawer-head{
    min-height:52px !important;
    padding:12px 15px !important;
  }

  .modal-body{
    padding:13px !important;
    max-height:calc(94svh - 52px) !important;
  }

  .product-detail-grid{
    grid-template-columns:1fr !important;
    gap:14px !important;
  }

  .product-detail-img{
    height:285px !important;
    min-height:285px !important;
    border-radius:8px !important;
  }

  .detail-panel{
    padding:0 !important;
  }

  .detail-panel h2{
    font-size:37px !important;
    line-height:.9 !important;
    margin-top:7px !important;
  }

  .detail-price{
    font-size:25px !important;
    margin:12px 0 !important;
  }

  .detail-copy{
    font-size:10px !important;
    line-height:1.55 !important;
  }

  .detail-section-head{
    margin-top:15px !important;
  }

  .size-guide-trigger{
    padding:8px 10px !important;
    font-size:7px !important;
  }

  .size-row .size-btn{
    min-width:43px !important;
    height:40px !important;
  }

  .custom-box{
    margin-top:14px !important;
    padding:11px !important;
  }

  .custom-live-card{
    min-height:118px !important;
  }

  .custom-live-number{
    font-size:52px !important;
  }

  .print-options{
    grid-template-columns:1fr !important;
  }

  .custom-fields{
    grid-template-columns:1fr 100px !important;
  }

  .badge-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    max-height:175px !important;
  }

  .badge-option{
    min-height:42px !important;
    padding:9px 10px !important;
  }

  .qty-row{
    position:sticky;
    bottom:0;
    padding-top:9px;
    margin-top:10px;
    background:linear-gradient(180deg,transparent,#080c0e 35%);
  }

  .qty-row>.btn{
    min-height:48px !important;
    height:48px !important;
  }


  /* ---------- SIZE GUIDE ---------- */

  .size-guide-inline{
    margin-top:8px !important;
    margin-bottom:11px !important;
  }

  .size-guide-inline th,
  .size-guide-inline td{
    padding:8px 10px !important;
  }

  .size-guide-inline small{
    font-size:8px !important;
  }

}


/* =========================================================
   EXTRA SMALL PHONES — 320–380px
========================================================= */

@media(max-width:380px){

  .nav-actions button{
    width:31px !important;
    font-size:18px !important;
  }

  .brand-main{
    font-size:21px !important;
  }

  .hero-inner{
    padding-left:15px !important;
    padding-right:15px !important;
  }

  .hero-copy h1{
    font-size:50px !important;
  }

  .hero-copy p{
    font-size:14px !important;
  }

  .category-grid{
    gap:6px !important;
  }

  .cat-card{
    min-height:118px !important;
  }

  .cat-card span{
    font-size:15px !important;
  }

  .grid{
    gap:7px !important;
  }

  .product-name{
    font-size:9px !important;
  }

  .product-meta{
    font-size:6px !important;
  }

  .quick-add{
    height:31px !important;
  }

  .custom-fields{
    grid-template-columns:1fr !important;
  }

  .badge-grid{
    grid-template-columns:1fr !important;
  }

}


/* =========================================================
   TALKJERSEY FINAL FUTURISTIC POLISH
   Isolated additive layer for this final build
========================================================= */

html{
  background:#020506;
  color-scheme:dark;
}

body{
  overscroll-behavior-x:none;
  -webkit-tap-highlight-color:transparent;
}

img{
  user-select:none;
  -webkit-user-drag:none;
}

button,
a{
  -webkit-tap-highlight-color:transparent;
}

.product-card{
  position:relative;
  isolation:isolate;
}

.product-card:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:4;
  border:1px solid transparent;
  transition:.25s ease;
}

.product-card:hover:before{
  border-color:rgba(24,228,94,.20);
  box-shadow:
    inset 0 0 26px rgba(24,228,94,.025),
    0 0 24px rgba(24,228,94,.035);
}

.product-media:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(
      115deg,
      transparent 0 42%,
      rgba(255,255,255,.035) 48%,
      transparent 54%
    );
  transform:translateX(-130%);
  transition:.55s ease;
  z-index:2;
}

.product-card:hover .product-media:after{
  transform:translateX(130%);
}

.quick-add:disabled{
  opacity:.46!important;
  cursor:not-allowed!important;
  transform:none!important;
}

.modal{
  backdrop-filter:blur(12px);
}

.modal-card{
  box-shadow:
    0 40px 120px rgba(0,0,0,.58),
    0 0 60px rgba(0,239,104,.045);
}

.btn{
  position:relative;
  overflow:hidden;
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    filter .18s ease;
}

.btn:hover{
  transform:translateY(-1px);
}

.btn:active{
  transform:translateY(0);
}

.btn-green{
  box-shadow:
    0 12px 30px rgba(0,239,104,.12);
}

.btn-green:hover{
  filter:brightness(1.06);
  box-shadow:
    0 14px 36px rgba(0,239,104,.20),
    0 0 28px rgba(0,239,104,.07);
}

.custom-live-card{
  position:relative;
  overflow:hidden;
}

.custom-live-card:before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-100%;
  height:100%;
  background:
    linear-gradient(
      180deg,
      transparent,
      rgba(0,239,104,.055),
      transparent
    );
  animation:jvPreviewSweep 4.8s ease-in-out infinite;
  pointer-events:none;
}

@keyframes jvPreviewSweep{
  0%,55%,100%{transform:translateY(0);opacity:0}
  20%{transform:translateY(210%);opacity:1}
}

.size-btn.sold-out{
  position:relative;
  color:#687276!important;
  border-color:#20282b!important;
  background:#080b0c!important;
  cursor:not-allowed!important;
}

.size-btn.sold-out small{
  display:block;
  margin-top:3px;
  font:700 6px/1 monospace;
  color:#ff7187;
}

.product-soldout-banner{
  margin:-5px 0 16px;
  padding:10px 12px;
  border:1px solid rgba(255,77,105,.25);
  border-radius:9px;
  background:rgba(255,77,105,.045);
  color:#ff9aaa;
  font:800 8px/1.4 monospace;
  letter-spacing:.08em;
}

.product-soldout-banner span{
  color:#ff5570;
  margin-right:6px;
}

.detail-gallery-strip{
  display:flex;
  gap:7px;
  overflow:auto;
  padding-top:8px;
  scrollbar-width:none;
}

.detail-gallery-strip::-webkit-scrollbar{
  display:none;
}

.detail-gallery-thumb{
  flex:0 0 62px;
  width:62px;
  height:62px;
  padding:0;
  overflow:hidden;
  border:1px solid #263136;
  background:#080b0c;
  border-radius:7px;
  cursor:pointer;
  opacity:.65;
  transition:.18s ease;
}

.detail-gallery-thumb:hover,
.detail-gallery-thumb.active{
  opacity:1;
  border-color:#00ef68;
  box-shadow:0 0 16px rgba(0,239,104,.08);
}

.detail-gallery-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.prepaid-note{
  border:1px solid rgba(0,239,104,.18);
  background:rgba(0,239,104,.035);
  color:#8de5aa;
  border-radius:8px;
}

@media(max-width:700px){

  .container{
    width:calc(100% - 22px);
  }

  .hero{
    min-height:76svh!important;
    height:76svh!important;
  }

  .hero-media{
    transform:scale(1.025);
    background-position:center 38%!important;
  }

  .hero-copy{
    max-width:90vw;
  }

  .hero-copy h1{
    font-size:clamp(49px,14vw,78px)!important;
    letter-spacing:-2px!important;
  }

  .hero-copy p{
    font-size:15px!important;
    max-width:340px;
  }

  .hero-actions{
    gap:13px!important;
  }

  .service-grid{
    grid-template-columns:1fr 1fr!important;
  }

  .service-grid>div{
    min-width:0;
    padding:16px 11px;
  }

  .category-grid{
    grid-template-columns:1fr 1fr!important;
  }

  .grid{
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
  }

  .product-media{
    aspect-ratio:.78;
  }

  .product-info{
    padding:9px 7px 12px;
  }

  .product-name{
    font-size:10px;
    line-height:1.25;
  }

  .quick-add{
    position:relative;
    left:auto;
    right:auto;
    bottom:auto;
    width:calc(100% - 14px);
    margin:0 7px 7px;
    transform:none!important;
    background:#fff;
  }

  .product-card:hover .quick-add{
    transform:none!important;
  }

  .product-detail-grid{
    grid-template-columns:1fr!important;
  }

  .modal{
    padding:8px;
    align-items:flex-end;
  }

  .modal-card{
    max-height:96svh;
    overflow:auto;
    border-radius:15px 15px 0 0;
  }

  .modal-body{
    padding:14px;
  }

  .product-detail-img{
    max-height:330px;
  }

  .product-detail-img img{
    max-height:330px;
    object-fit:cover;
  }

  .custom-live-number{
    font-size:54px;
  }

  .print-options{
    grid-template-columns:1fr!important;
  }

  .badge-grid{
    grid-template-columns:1fr 1fr!important;
  }

  .qty-row{
    position:sticky;
    bottom:0;
    background:linear-gradient(
      180deg,
      transparent,
      #05090a 20%
    );
    padding-top:10px;
    z-index:5;
  }

  .float-wa{
    box-shadow:
      0 0 28px rgba(24,228,94,.22)!important;
  }
}

@media(max-width:420px){
  .service-grid{
    grid-template-columns:1fr!important;
  }

  .hero{
    min-height:72svh!important;
    height:72svh!important;
  }

  .hero-copy h1{
    font-size:56px!important;
  }

  .newsletter-box form{
    flex-direction:column;
  }

  .badge-grid{
    grid-template-columns:1fr!important;
  }
}


/* =========================================================
   FUTURISTIC HERO SLIDER v2
========================================================= */
.hero{position:relative;overflow:hidden;isolation:isolate}
.hero-slider-track{position:absolute;inset:0}
.hero-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transform:scale(1.02);transition:opacity .65s ease,visibility .65s ease,transform 1.4s cubic-bezier(.2,.7,.2,1);overflow:hidden}
.hero-slide.active{opacity:1;visibility:visible;transform:scale(1)}
.hero-slide .hero-media{position:absolute;inset:-1.5%;background:url('hero.jpg') var(--hero-pos,50% center)/cover no-repeat;transform:scale(var(--hero-scale,1.015));transition:transform 6.2s cubic-bezier(.2,.7,.2,1),background-position 1s ease;will-change:transform,background-position}
.hero-slide.active .hero-media{transform:scale(calc(var(--hero-scale,1.015) + .025))}
.hero-slide .hero-vignette{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(2,4,4,.94),rgba(2,4,4,.58) 40%,rgba(2,4,4,.14) 72%,rgba(2,4,4,.70)),linear-gradient(0deg,rgba(2,4,4,.92),transparent 30%)}
.hero-vignette-alt{background:linear-gradient(90deg,rgba(2,4,4,.92),rgba(2,4,4,.50) 45%,rgba(2,4,4,.18) 75%,rgba(2,4,4,.75)),linear-gradient(0deg,rgba(2,4,4,.88),transparent 35%)!important}
.hero-vignette-alt2{background:linear-gradient(90deg,rgba(2,4,4,.96),rgba(2,4,4,.62) 42%,rgba(2,4,4,.20) 76%,rgba(2,4,4,.72)),linear-gradient(0deg,rgba(2,4,4,.94),transparent 32%)!important}
.hero-slide .hero-inner{position:relative;z-index:3}
.hero-slide .hero-copy{animation:heroCopyOut .55s ease both}
.hero-slide.active .hero-copy{animation:heroCopyIn .72s cubic-bezier(.2,.8,.2,1) .08s both}
@keyframes heroCopyIn{from{opacity:0;transform:translate3d(0,20px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes heroCopyOut{from{opacity:1;transform:translate3d(0,0,0)}to{opacity:0;transform:translate3d(0,-10px,0)}}
.hero-slide .hero-status{display:inline-flex;align-items:center;gap:8px;margin-bottom:16px;padding:7px 11px;border:1px solid rgba(0,242,106,.28);border-radius:999px;background:rgba(0,242,106,.05);font:700 10px monospace;letter-spacing:1.5px;color:#bfead0}
.hero-slide .hero-status span{width:7px;height:7px;border-radius:50%;background:#00f26a;box-shadow:0 0 12px #00f26a;animation:pulse 1.5s infinite}
.hero-controls{position:absolute;left:max(41px,calc((100vw - 1440px)/2 + 41px));bottom:18px;z-index:8;display:flex;align-items:center;gap:12px}
.hero-controls .hero-dots{position:static;display:flex;gap:9px;align-items:center}
.hero-controls .hero-dots button{width:32px;height:3px;border:0;border-radius:99px;background:#7b858b;padding:0;cursor:pointer;transition:width .25s ease,background .25s ease,box-shadow .25s ease}
.hero-controls .hero-dots button.active{width:42px;background:var(--g);box-shadow:0 0 16px rgba(0,242,106,.50)}
.hero-progress{width:85px;height:2px;background:rgba(255,255,255,.14);overflow:hidden;border-radius:2px}
.hero-progress span{display:block;width:0;height:100%;background:var(--g);box-shadow:0 0 12px rgba(0,242,106,.45)}
.hero-slider-track.paused .hero-progress span{animation-play-state:paused!important}
@media(max-width:900px){.hero-controls{left:18px;bottom:16px}.hero-progress{display:none}.hero-slide .hero-media{transform:scale(var(--hero-scale,1.015))}}
@media(max-width:600px){.hero-controls{left:12px;bottom:14px}.hero-controls .hero-dots button{width:24px}.hero-controls .hero-dots button.active{width:34px}.hero-slide .hero-status{font-size:8px;letter-spacing:1.1px;margin-bottom:12px}.hero-slide .hero-copy{padding-top:20px}}


/* =========================================================
   HERO MOTION + CLARITY FINAL OVERRIDE
========================================================= */
.hero-slider-track{position:absolute;inset:0;overflow:hidden}
.hero-slide{isolation:isolate}
.hero-slide .hero-media{
  filter:none !important;
  background-position:var(--hero-pos,50% center) !important;
  animation:heroContinuousDrift 9.5s ease-in-out infinite alternate !important;
  will-change:transform,background-position;
}
.hero-slide:not(.active) .hero-media{
  animation-play-state:paused !important;
}
.hero-slide.active .hero-media{
  animation-play-state:running !important;
}
.hero-slider-track.paused .hero-slide.active .hero-media{
  animation-play-state:paused !important;
}
@keyframes heroContinuousDrift{
  0%{
    transform:translate3d(calc(var(--hero-drift-x,2%) * -1),calc(var(--hero-drift-y,1%) * -1),0) scale(var(--hero-scale,1.015));
    background-position:calc(var(--hero-pos-x,50%) - 1.5%) center;
  }
  100%{
    transform:translate3d(var(--hero-drift-x,2%),var(--hero-drift-y,1%),0) scale(calc(var(--hero-scale,1.015) + .035));
    background-position:calc(var(--hero-pos-x,50%) + 1.5%) center;
  }
}
/* Keep the desktop left side readable without the heavy black/blur veil */
.hero-slide .hero-vignette,
.hero-vignette-alt,
.hero-vignette-alt2{
  background:
    linear-gradient(90deg,rgba(2,4,4,.72) 0%,rgba(2,4,4,.48) 34%,rgba(2,4,4,.16) 70%,rgba(2,4,4,.50) 100%),
    linear-gradient(0deg,rgba(2,4,4,.76),transparent 34%) !important;
}
.hero-slide .hero-copy{
  text-shadow:0 8px 28px rgba(0,0,0,.35);
}
@media(max-width:900px){
  .hero-slide .hero-media{animation-duration:8s !important}
}
@media(prefers-reduced-motion:reduce){
  .hero-slide .hero-media{animation:none !important}
}


/* =========================================================
   CART LINE DETAILS + SOLD OUT TAG
========================================================= */
.cart-item .cart-custom{color:#8de5aa!important;font:700 8px/1.5 'Roboto Mono',monospace!important;letter-spacing:.04em}
.tag.tag-soldout{background:#ff4d69;color:#fff}
.quick-add.added{background:var(--g);color:#00180a}