/* ════════════════════════════════════════════════════════════════
   ULTRASZONE, SHARED STYLES (styles.css)
   One stylesheet for the whole site. Edit here, changes apply everywhere.
   Sections: variables · nav · mobile · ticker · buttons · product cards
             · page hero · footer · shabbat · cart drawer · search · upgrade
   ════════════════════════════════════════════════════════════════ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  /* ── CYAN / ELECTRIC palette (original UltrasZone accent) ── */
  --white:#ffffff; --card:#ffffff; --off:#f5f5f3; --light:#e8e8e4;
  --black:#0d0d0d; --ink:#1a1a1a; --muted:#6b6b6b;
  --accent:#00d4e8; --accent-deep:#00b8cc; --ember:#00d4e8; --glow:rgba(0,212,232,0.35);
  --cyan:var(--accent); --cyan2:var(--accent-deep);
}

body { background:var(--white); color:var(--ink); font-family:'Karantina','Heebo',sans-serif; overflow-x:hidden; }

/* ── NAV DESKTOP ── */
nav {
  position:fixed; top:0; width:100%; z-index:200;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 56px;
  background:rgba(255,255,255,0.92); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(0,0,0,.08);
  transition:padding .3s;
}
.logo { font-family:'Bebas Neue','Karantina',sans-serif; font-size:1.9rem; letter-spacing:5px; color:var(--black); text-decoration:none; }
.logo span { color:var(--cyan2); }
.nav-links { list-style:none; display:flex; gap:28px; align-items:center; }
.nav-links a { color:var(--ink); text-decoration:none; font-size:.75rem; letter-spacing:2px; text-transform:uppercase; opacity:.55; transition:opacity .2s,color .2s; }
.nav-links a:hover, .nav-links a.active { opacity:1; color:var(--cyan2); }
.nav-links .has-sub { position:relative; }
.nav-links .has-sub > a::after { content:' ▾'; font-size:.6rem; }
.sub-menu {
  display:none; position:absolute; top:100%; right:0;
  background:var(--white); border:1px solid var(--light);
  min-width:180px; padding:8px 0;
  box-shadow:0 8px 24px rgba(0,0,0,.08);
  z-index:300;
}
.has-sub:hover .sub-menu { display:block; }
.sub-menu a { display:block; padding:9px 18px; font-size:.72rem; letter-spacing:1.5px; opacity:.7; }
.sub-menu a:hover { opacity:1; background:var(--off); }
.nav-cta { background:var(--black); color:var(--white); padding:9px 20px; font-size:.7rem; letter-spacing:2px; text-transform:uppercase; border:none; cursor:pointer; font-family:'Karantina','Heebo',sans-serif; font-weight:700; transition:background .2s; text-decoration:none; display:inline-block; }
.nav-cta:hover { background:var(--cyan2); color:var(--black); }
.nav-ig { display:flex; align-items:center; gap:6px; color:var(--ink); text-decoration:none; opacity:.6; transition:opacity .2s; }
.nav-ig:hover { opacity:1; }
.nav-ig svg { width:18px; height:18px; }

/* ── MOBILE NAV ── */
.hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:4px; background:none; border:none; }
.hamburger span { width:24px; height:2px; background:var(--black); transition:all .3s; display:block; }
.hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity:0; }
.hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

.mobile-menu {
  display:none; position:fixed; inset:0; z-index:190;
  background:var(--white); flex-direction:column;
  align-items:center; justify-content:center; gap:32px;
  padding:80px 32px 32px;
}
.mobile-menu.open { display:flex; }
.mobile-menu a { font-family:'Bebas Neue','Karantina',sans-serif; font-size:2.5rem; letter-spacing:4px; color:var(--black); text-decoration:none; transition:color .2s; }
.mobile-menu a:hover { color:var(--cyan2); }
.mobile-menu .m-sub { display:flex; flex-direction:column; align-items:center; gap:14px; border-top:1px solid var(--light); border-bottom:1px solid var(--light); padding:24px 0; width:100%; }
.mobile-menu .m-sub a { font-size:1.4rem; opacity:.65; }
.mobile-menu .m-cta { background:var(--black); color:var(--white); padding:14px 40px; font-size:.8rem; letter-spacing:3px; text-transform:uppercase; font-family:'Karantina','Heebo',sans-serif; font-weight:700; text-decoration:none; margin-top:8px; }

/* ── TICKER ── */
.ticker-wrap { border-top:1px solid var(--light); border-bottom:1px solid var(--light); overflow:hidden; padding:11px 0; background:var(--white); }
.ticker { display:flex; gap:56px; width:max-content; animation:ticker 24s linear infinite; font-size:.62rem; letter-spacing:4px; text-transform:uppercase; font-weight:700; color:var(--ink); }
.ticker .hi { color:var(--cyan2); }
@keyframes ticker { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ── SECTION UTILS ── */
.section-label { display:inline-flex; align-items:center; gap:10px; font-size:.63rem; letter-spacing:4px; text-transform:uppercase; color:var(--cyan2); margin-bottom:10px; }
.section-label::before { content:''; width:20px; height:2px; background:var(--cyan); box-shadow:0 0 6px var(--cyan); }
.section-title { font-family:'Bebas Neue','Karantina',sans-serif; font-size:clamp(2rem,4.5vw,3.4rem); letter-spacing:1px; color:var(--black); margin-bottom:44px; }

/* ── BUTTONS ── */
.btn-primary { background:var(--black); color:var(--white); padding:14px 36px; font-size:.76rem; letter-spacing:3px; text-transform:uppercase; border:none; cursor:pointer; font-family:'Karantina','Heebo',sans-serif; font-weight:700; transition:all .2s; text-decoration:none; display:inline-block; }
.btn-primary:hover { background:var(--cyan); color:var(--black); box-shadow:0 0 28px var(--glow); }
.btn-outline { background:transparent; color:var(--ink); padding:13px 28px; font-size:.76rem; letter-spacing:2px; text-transform:uppercase; border:1.5px solid rgba(0,0,0,.15); cursor:pointer; font-family:'Karantina','Heebo',sans-serif; font-weight:600; transition:all .2s; text-decoration:none; display:inline-block; }
.btn-outline:hover { border-color:var(--cyan2); color:var(--cyan2); }

/* ── PRODUCT CARD ── */
.product-card { cursor:pointer; }
/* Square frame + object-fit:contain, the product photos are near-square,
   so a 3/4 crop was slicing sleeves and hems off every card. */
.product-img { aspect-ratio:1/1; background:var(--off); display:flex; align-items:center; justify-content:center; font-size:3rem; color:rgba(0,0,0,.1); position:relative; overflow:hidden; transition:background .3s; }
.product-card:hover .product-img { background:var(--light); }
.product-img img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; object-position:center; }
.product-img::after { content:''; position:absolute; bottom:0; left:0; right:0; height:3px; background:var(--cyan); box-shadow:0 0 12px var(--glow); transform:scaleX(0); transform-origin:right; transition:transform .3s ease; pointer-events:none; }
.product-card:hover .product-img::after { transform:scaleX(1); transform-origin:left; }
.product-badge { position:absolute; top:12px; right:12px; background:var(--cyan); color:var(--black); font-size:.56rem; letter-spacing:2px; text-transform:uppercase; padding:4px 9px; font-weight:900; box-shadow:0 0 12px var(--glow); z-index:2; }
.product-info { padding:14px 2px; }
.product-name { font-size:.86rem; font-weight:700; color:var(--black); margin-bottom:3px; }
.product-type { font-size:.63rem; color:var(--muted); letter-spacing:2px; text-transform:uppercase; }
.product-bottom { display:flex; align-items:center; justify-content:space-between; margin-top:10px; }
.product-price { font-size:.96rem; font-weight:900; color:var(--black); }
.product-add { background:none; border:none; cursor:pointer; font-size:.63rem; letter-spacing:2px; text-transform:uppercase; color:var(--cyan2); font-family:'Karantina','Heebo',sans-serif; font-weight:700; transition:text-shadow .2s; }
.product-add:hover { text-shadow:0 0 10px var(--cyan); }

/* ── PAGE HERO (inner pages) ── */
.page-hero { padding:140px 56px 70px; background:var(--off); position:relative; overflow:hidden; }
.page-hero::before { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(0,0,0,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.04) 1px,transparent 1px); background-size:60px 60px; pointer-events:none; }
.page-hero-title { font-family:'Bebas Neue','Karantina',sans-serif; font-size:clamp(3.5rem,8vw,7rem); line-height:.9; color:var(--black); position:relative; }
.page-hero-title .accent { color:var(--cyan2); text-shadow:0 0 32px var(--glow); }
.page-hero-sub { margin-top:20px; font-size:.92rem; color:var(--muted); max-width:480px; line-height:1.7; position:relative; }
.page-hero-badge { display:inline-block; margin-top:24px; background:var(--cyan); color:var(--black); padding:8px 18px; font-size:.62rem; letter-spacing:3px; text-transform:uppercase; font-weight:900; box-shadow:0 0 20px var(--glow); position:relative; }

/* ── FOOTER ── */
footer { background:var(--black); padding:56px 56px 32px; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:48px; margin-bottom:48px; }
.footer-logo { font-family:'Bebas Neue','Karantina',sans-serif; font-size:2rem; letter-spacing:5px; color:var(--white); margin-bottom:14px; display:block; text-decoration:none; }
.footer-logo span { color:var(--cyan2); }
.footer-desc { font-size:.78rem; color:rgba(255,255,255,.35); line-height:1.7; max-width:220px; }
.footer-ig { display:inline-flex; align-items:center; gap:8px; margin-top:16px; color:var(--cyan2); font-size:.7rem; letter-spacing:2px; text-transform:uppercase; text-decoration:none; font-weight:700; transition:text-shadow .2s; }
.footer-ig:hover { text-shadow:0 0 10px var(--cyan); }
.footer-col-title { font-family:'Bebas Neue','Karantina',sans-serif; font-size:1rem; letter-spacing:3px; color:var(--white); margin-bottom:18px; }
.footer-col a { display:block; color:rgba(255,255,255,.4); font-size:.73rem; letter-spacing:1px; text-decoration:none; margin-bottom:10px; transition:color .2s; }
.footer-col a:hover { color:var(--cyan2); }
/* Site-wide independence notice, sits above the copyright line */
.footer-disclaimer { border-top:1px solid rgba(255,255,255,.07); padding-top:20px; margin-top:8px; }
.footer-disclaimer p { font-size:.68rem; line-height:1.75; color:rgba(255,255,255,.34); max-width:960px; }
.footer-disclaimer strong { color:rgba(255,255,255,.55); font-weight:700; }
.footer-disclaimer a { color:rgba(255,255,255,.5); text-decoration:underline; }
.footer-disclaimer a:hover { color:var(--cyan,#00d4e8); }

.footer-bottom { border-top:1px solid rgba(255,255,255,.07); padding-top:24px; margin-top:20px; display:flex; justify-content:space-between; align-items:center; }
.footer-copy { font-size:.62rem; color:rgba(255,255,255,.2); letter-spacing:1px; }
.footer-shabbat { font-size:.62rem; color:rgba(255,255,255,.2); letter-spacing:1px; }

/* ── SHABBAT OVERLAY ── */
#shabbat-overlay {
  display:none; position:fixed; inset:0; z-index:9999;
  background:var(--black);
  flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:32px;
}
#shabbat-overlay.active { display:flex; }
.shabbat-candles { font-size:4rem; margin-bottom:24px; animation:flicker 2s ease-in-out infinite; }
@keyframes flicker { 0%,100%{opacity:1} 50%{opacity:.7} }
.shabbat-title { font-family:'Bebas Neue','Karantina',sans-serif; font-size:clamp(2.5rem,6vw,5rem); letter-spacing:4px; color:var(--white); margin-bottom:16px; }
.shabbat-sub { font-size:1rem; color:rgba(255,255,255,.5); line-height:1.8; max-width:420px; }
.shabbat-logo { font-family:'Bebas Neue','Karantina',sans-serif; font-size:1.4rem; letter-spacing:5px; color:rgba(255,255,255,.15); margin-top:48px; }
.shabbat-logo span { color:rgba(236,68,19,.4); }

/* ── RESPONSIVE ── */
@media(max-width:900px){
  nav { padding:16px 24px; }
  .nav-links, .nav-cta, .nav-ig { display:none; }
  .hamburger { display:flex; }
  .page-hero { padding:110px 24px 50px; }
  footer { padding:48px 24px 24px; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:32px; }
}
@media(max-width:560px){
  .footer-grid { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column; gap:8px; text-align:center; }
}


.nav-cart{position:relative;display:inline-flex;align-items:center;justify-content:center;color:var(--ink);text-decoration:none;opacity:.6;transition:opacity .2s;padding:6px;margin-left:6px;}
.nav-cart:hover{opacity:1;color:var(--cyan2);}
.nav-cart svg{width:20px;height:20px;}
.uz-cart-count{position:absolute;top:-2px;left:-2px;background:var(--cyan);color:#000;font-size:.55rem;font-weight:900;padding:2px 5px;min-width:16px;text-align:center;border-radius:8px;line-height:1;letter-spacing:0;}

/* ── SEARCH OVERLAY ── */
#uz-search-overlay{position:fixed;inset:0;z-index:9998;background:rgba(10,10,10,.96);backdrop-filter:blur(8px);display:none;padding:80px 24px;overflow-y:auto;}
#uz-search-overlay.open{display:block;animation:uzFade .2s ease;}
@keyframes uzFade{from{opacity:0}to{opacity:1}}
.uz-search-inner{max-width:640px;margin:0 auto;position:relative;}
.uz-search-close{position:absolute;top:-50px;left:0;background:none;border:none;color:#fff;font-size:2.4rem;cursor:pointer;opacity:.6;transition:opacity .2s;line-height:1;}
.uz-search-close:hover{opacity:1;}
.uz-search-label{font-size:.7rem;letter-spacing:4px;text-transform:uppercase;color:var(--cyan);margin-bottom:16px;}
#uz-search-input{width:100%;background:transparent;border:none;border-bottom:2px solid rgba(255,255,255,.2);color:#fff;font-family:'Bebas Neue','Karantina',sans-serif;font-size:2.4rem;letter-spacing:2px;padding:12px 0;outline:none;}
#uz-search-input:focus{border-color:var(--cyan);}
#uz-search-input::placeholder{color:rgba(255,255,255,.25);}
#uz-search-results{margin-top:24px;display:flex;flex-direction:column;gap:8px;}
.uz-search-item{display:flex;align-items:center;gap:16px;padding:12px;background:rgba(255,255,255,.04);text-decoration:none;transition:background .2s;}
.uz-search-item:hover{background:rgba(0,212,232,.1);}
.uz-sr-img{width:54px;height:54px;background:rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0;}
.uz-sr-img img{width:100%;height:100%;object-fit:cover;}
.uz-sr-ph{color:rgba(255,255,255,.2);font-size:1.5rem;}
.uz-sr-info{flex:1;display:flex;flex-direction:column;gap:2px;}
.uz-sr-name{color:#fff;font-weight:700;font-size:.92rem;}
.uz-sr-type{color:rgba(255,255,255,.4);font-size:.7rem;letter-spacing:1px;text-transform:uppercase;}
.uz-sr-price{color:var(--cyan);font-weight:900;font-size:1rem;}
.uz-search-empty{color:rgba(255,255,255,.4);text-align:center;padding:32px;font-size:.9rem;}
.uz-search-trigger{cursor:pointer;}

/* ── BACK TO TOP ── */
#uz-back-top{position:fixed;bottom:24px;right:24px;z-index:90;width:46px;height:46px;background:var(--black);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transform:translateY(10px);transition:all .25s;}
#uz-back-top.show{opacity:1;pointer-events:auto;transform:translateY(0);}
#uz-back-top:hover{background:var(--cyan);color:var(--black);box-shadow:0 0 20px var(--glow);}
#uz-back-top svg{width:20px;height:20px;}
@media(max-width:900px){#uz-back-top{bottom:80px;right:16px;width:42px;height:42px;}}

/* ════════ CART DRAWER ════════ */
#uz-drawer-overlay{position:fixed;inset:0;background:rgba(10,10,10,.5);backdrop-filter:blur(3px);z-index:9996;opacity:0;pointer-events:none;transition:opacity .3s;}
#uz-drawer-overlay.open{opacity:1;pointer-events:auto;}
#uz-drawer{position:fixed;top:0;left:0;bottom:0;width:400px;max-width:90vw;background:#fff;z-index:9997;transform:translateX(-100%);transition:transform .35s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;box-shadow:4px 0 40px rgba(0,0,0,.25);}
#uz-drawer.open{transform:translateX(0);}
.uz-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:22px 24px;border-bottom:1px solid var(--light);}
.uz-drawer-title{font-family:'Bebas Neue','Karantina',sans-serif;font-size:1.5rem;letter-spacing:2px;color:var(--black);}
#uz-drawer-count{display:inline-flex;align-items:center;justify-content:center;background:var(--cyan);color:#000;font-family:'Karantina','Heebo',sans-serif;font-size:.75rem;font-weight:900;min-width:22px;height:22px;border-radius:11px;padding:0 6px;margin-right:4px;}
.uz-drawer-close{background:none;border:none;font-size:2rem;line-height:1;color:var(--muted);cursor:pointer;padding:0 4px;transition:color .2s;}
.uz-drawer-close:hover{color:var(--black);}

#uz-drawer-ship-bar{padding:0 24px;}
.uz-ship-msg{font-size:.8rem;color:var(--ink);padding:14px 0 8px;text-align:center;}
.uz-ship-msg strong{color:var(--cyan2);}
.uz-ship-done{color:#00a651;font-weight:700;padding:16px 0;}
.uz-ship-track{height:5px;background:var(--light);border-radius:3px;overflow:hidden;margin-bottom:4px;}
.uz-ship-fill{height:100%;background:linear-gradient(90deg,var(--cyan2),var(--cyan));border-radius:3px;transition:width .4s;}

#uz-drawer-body{flex:1;overflow-y:auto;padding:16px 24px;}
.uz-drawer-item{display:grid;grid-template-columns:64px 1fr auto;gap:14px;padding:16px 0;border-bottom:1px solid var(--light);align-items:start;}
.uz-di-img{width:64px;height:64px;background:var(--off);display:flex;align-items:center;justify-content:center;overflow:hidden;}
.uz-di-img img{width:100%;height:100%;object-fit:cover;}
.uz-di-img svg{width:28px;height:28px;color:rgba(0,0,0,.2);}
.uz-di-name{font-weight:700;font-size:.88rem;color:var(--black);line-height:1.3;margin-bottom:3px;}
.uz-di-size{font-size:.72rem;color:var(--muted);margin-bottom:10px;}
.uz-di-controls{display:flex;align-items:center;gap:12px;}
.uz-di-qty{display:flex;align-items:center;border:1px solid var(--light);border-radius:4px;overflow:hidden;}
.uz-qty-btn{width:28px;height:28px;background:none;border:none;cursor:pointer;font-size:1rem;color:var(--ink);transition:background .15s;}
.uz-qty-btn:hover{background:var(--off);}
.uz-di-qty span{min-width:30px;text-align:center;font-weight:700;font-size:.82rem;}
.uz-di-remove{background:none;border:none;color:var(--muted);font-size:.72rem;cursor:pointer;text-decoration:underline;padding:0;transition:color .2s;}
.uz-di-remove:hover{color:#c0392b;}
.uz-di-price{font-weight:900;font-size:.92rem;color:var(--black);white-space:nowrap;}

.uz-drawer-empty{text-align:center;padding:60px 24px;}
.uz-drawer-empty svg{width:54px;height:54px;color:var(--light);margin-bottom:18px;}
.uz-drawer-empty-title{font-family:'Bebas Neue','Karantina',sans-serif;font-size:1.5rem;letter-spacing:2px;color:var(--black);margin-bottom:6px;}
.uz-drawer-empty-sub{color:var(--muted);font-size:.85rem;margin-bottom:24px;}
.uz-drawer-shop{display:inline-block;background:var(--black);color:#fff;padding:13px 32px;font-size:.78rem;letter-spacing:2px;text-transform:uppercase;font-weight:700;text-decoration:none;transition:all .2s;}
.uz-drawer-shop:hover{background:var(--cyan);color:#000;}

#uz-drawer-foot{padding:20px 24px;border-top:1px solid var(--light);background:var(--off);}
.uz-drawer-subtotal,.uz-drawer-ship-line{display:flex;justify-content:space-between;font-size:.85rem;color:var(--ink);padding:5px 0;}
.uz-drawer-total{display:flex;justify-content:space-between;font-size:1.15rem;font-weight:900;color:var(--black);padding:12px 0;margin-top:6px;border-top:2px solid var(--black);}
.uz-drawer-checkout{display:block;background:var(--black);color:#fff;text-align:center;padding:16px;font-size:.82rem;letter-spacing:2px;text-transform:uppercase;font-weight:700;text-decoration:none;margin-top:12px;transition:all .2s;}
.uz-drawer-checkout:hover{background:var(--cyan);color:#000;box-shadow:0 0 24px var(--glow);}
.uz-drawer-viewcart{display:block;text-align:center;padding:12px;font-size:.75rem;letter-spacing:1px;color:var(--muted);text-decoration:underline;margin-top:4px;transition:color .2s;}
.uz-drawer-viewcart:hover{color:var(--black);}

@media(max-width:480px){#uz-drawer{width:100%;max-width:100%;}}

/* ════════════════════════════════════════════════════════════════
   ULTRASZONE, UPGRADE LAYER  (added during 2026 rebuild)
   Accessibility · performance · mobile polish · micro-interactions
   ════════════════════════════════════════════════════════════════ */

/* ── Smooth scrolling + better text rendering ── */
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body { -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }

/* ── Accessibility: visible keyboard focus everywhere ── */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline:3px solid var(--cyan2);
  outline-offset:2px;
  border-radius:2px;
}
/* don't show the outline for mouse users who didn't tab */
:focus:not(:focus-visible){ outline:none; }

/* ── Skip-to-content link (screen readers / keyboard) ── */
.skip-link {
  position:absolute; right:8px; top:-60px; z-index:10000;
  background:var(--black); color:#fff; padding:12px 20px;
  font-size:.8rem; font-weight:700; letter-spacing:1px; text-decoration:none;
  transition:top .2s;
}
.skip-link:focus { top:8px; }

/* ── Visually hidden but readable by screen readers / search engines ── */
.sr-only {
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* ── Respect users who prefer reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
}

/* ── Nav: shrink + stronger shadow once scrolled ── */
nav.scrolled {
  padding-top:12px; padding-bottom:12px;
  box-shadow:0 6px 24px rgba(0,0,0,.08);
}

/* ── Product card: lift on hover, smoother image zoom ── */
.product-card {
  border-radius:2px;
  transition:transform .25s ease;
}
.product-card:hover { transform:translateY(-4px); }
.product-img img { transition:transform .5s cubic-bezier(.2,.6,.2,1), filter .4s ease; }
.product-card:hover .product-img img { transform:scale(1.03); filter:brightness(1.06); }

/* ── Image skeleton loader (shown until product image loads) ── */
.product-img { background:linear-gradient(110deg,var(--off) 8%,var(--light) 18%,var(--off) 33%); background-size:200% 100%; }
/* The product shots are on a pure-black backdrop, so a black tile makes the
   letterbox area invisible, full image, no visible empty margin. */
.product-img.has-img { background:#000; }
.product-img img { opacity:0; transition:opacity .4s ease, transform .5s cubic-bezier(.2,.6,.2,1); }
.product-img img.loaded { opacity:1; }
@keyframes uzShimmer { to { background-position-x:-200%; } }
.product-img:not(.has-img):not(.no-shimmer){ animation:uzShimmer 1.4s linear infinite; }

/* ── Out-of-stock card treatment ── */
.product-card.is-out .product-img { filter:grayscale(.6) opacity(.75); }
.product-stock-tag {
  display:inline-block; margin-top:6px; font-size:.6rem; letter-spacing:1px;
  text-transform:uppercase; color:#c0392b; font-weight:700;
}

/* ── Buttons: subtle press feedback + disabled state ── */
.btn-primary:active, .btn-outline:active, .nav-cta:active,
.product-add:active { transform:translateY(1px); }
button[disabled], .btn-primary[disabled] {
  opacity:.45; cursor:not-allowed; pointer-events:none;
}

/* ── Toast (cart add), refined, RTL-aware ── */
#uz-cart-toast { border-radius:3px; box-shadow:0 10px 40px rgba(0,0,0,.35); }

/* ── Lazy-fade entrance for sections (added by components.js) ──
   IMPORTANT: content is visible by DEFAULT. The fade-in only applies
   once <html> gets the 'reveal-ready' class (added by JS immediately
   on load). If JS ever fails, everything stays fully visible instead
   of being stuck invisible. This prevents a blank page below the hero. */
.uz-reveal { opacity:1; transform:none; }
html.reveal-ready .uz-reveal { opacity:0; transform:translateY(16px); }
html.reveal-ready .uz-reveal.in { opacity:1; transform:none; transition:opacity .6s ease, transform .6s cubic-bezier(.2,.6,.2,1); }

/* ── Forms: consistent inputs across pages ── */
input, select, textarea { font-family:'Karantina','Heebo',sans-serif; }

/* ── Mobile menu: scrollable + active state ── */
.mobile-menu { overflow-y:auto; }
.mobile-menu a.active { color:var(--cyan2); }
.mobile-menu .m-close {
  position:absolute; top:24px; left:24px; background:none; border:none;
  font-size:2.4rem; line-height:1; color:var(--black); cursor:pointer;
}

/* ── Better tap targets + spacing on small screens ── */
@media (max-width:560px){
  .btn-primary, .btn-outline, .nav-cta { padding-top:13px; padding-bottom:13px; }
  .section-title { margin-bottom:32px; }
  .products-grid { gap:14px; }
}
@media (max-width:380px){
  .products-grid { grid-template-columns:1fr 1fr; gap:10px; }
  .product-name { font-size:.8rem; }
}

/* ── Print: hide chrome ── */
@media print {
  nav, footer, #uz-back-top, #uz-drawer, #uz-drawer-overlay, .ticker-wrap { display:none !important; }
}

/* ── Selection color ── */
::selection { background:var(--cyan); color:#000; }

/* ── Scrollbar (webkit) ── */
::-webkit-scrollbar { width:10px; height:10px; }
::-webkit-scrollbar-thumb { background:var(--light); border-radius:5px; }
::-webkit-scrollbar-thumb:hover { background:#cfcfca; }

/* ════════════════════════════════════════════════════════════════
   PYRO THEME LAYER, texture · editorial · terrace culture · de-AI
   (2026 rebrand: warm bone + concrete + flare-orange, film grain,
    editorial rhythm, statement typography)
   ════════════════════════════════════════════════════════════════ */

/* ── Film grain removed: feTurbulence + mix-blend-mode rendered as a black
   wash on iOS Safari, covering page content. Not worth the mobile bug. ── */
/* grain (body::before, z-index:1, pointer-events:none) overlays content subtly.
   nav / drawer / overlays keep their own fixed positioning + higher z-index, do NOT lift them here
   (a previous lift broke the nav dropdown, cart drawer and shabbat overlay). */
.manifesto-section, .hero, .page-hero, .org-hero, .trust-bar, .org-strip { position:relative; z-index:2; }

/* ── Fonts: add Frank Ruhl Libre (Hebrew serif) for editorial voice ── */
.font-serif, .m-right p, .pull-quote, .lead { font-family:'Karantina','Heebo',serif; }

/* ── Deep-ember link/accent legibility on light already handled via --cyan2 ── */

/* ── Warm the hero grid + category gradients (were cool grey) ── */
.hero::before{ background-image:linear-gradient(rgba(0,0,0,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.05) 1px,transparent 1px); }
.cat-card:nth-child(1) .cat-bg{ background:linear-gradient(135deg,#20222a,#0f1013); }
.cat-card:nth-child(2) .cat-bg{ background:linear-gradient(135deg,#26282f,#141519); }
.cat-card:nth-child(3) .cat-bg{ background:linear-gradient(135deg,#2b2d33,#17181d); }
.cat-emoji{ color:var(--accent); opacity:.14; }
.cat-card:hover .cat-emoji{ opacity:.22; }

/* ── TRUST BAR → editorial dark "spec band" (breaks the AI icon-grid) ── */
.trust-bar{
  background:var(--black); color:var(--white);
  display:grid; grid-template-columns:repeat(4,1fr); gap:0;
  border-top:2px solid var(--accent);
}
.trust-item{
  display:flex; align-items:center; gap:14px;
  padding:24px 30px;
  border-inline-start:1px solid rgba(255,255,255,.09);
}
.trust-item:first-child{ border-inline-start:none; }
.trust-item svg{ width:26px; height:26px; color:var(--accent); flex-shrink:0; }
.trust-item .trust-title{ font-family:'Bebas Neue','Karantina',sans-serif; letter-spacing:1.5px; font-size:1.05rem; color:var(--white); line-height:1; }
.trust-item .trust-sub{ font-size:.6rem; letter-spacing:2px; text-transform:uppercase; color:rgba(255,255,255,.42); margin-top:4px; }
@media(max-width:760px){ .trust-bar{ grid-template-columns:1fr 1fr; }
  .trust-item:nth-child(3){ border-inline-start:none; }
  .trust-item{ border-top:1px solid rgba(255,255,255,.07); } }

/* ── Buttons: sharper, stamped, warm press ── */
.btn-primary{ background:var(--black); border:2px solid var(--black); }
.btn-primary:hover{ background:var(--accent); border-color:var(--accent); color:#fff; box-shadow:0 0 0 0 transparent; }
.nav-cta:hover{ background:var(--accent); color:#fff; }
.btn-outline:hover{ border-color:var(--accent-deep); color:var(--accent-deep); }

/* ── Product cards: warmer, crisper, terrace-tag price ── */
.product-badge{ color:#fff; box-shadow:none; border-radius:0; }
.product-add{ color:var(--accent-deep); }
.product-img::after{ background:var(--accent); box-shadow:none; }

/* ── Section labels: stamped ── */
.section-label{ color:var(--accent-deep); font-weight:700; }
.section-label::before{ background:var(--accent); box-shadow:none; }

/* ── Manifesto: serif editorial body + flare accent ── */
.manifesto-section::before{ color:var(--accent); opacity:.05; }
.m-right p{ font-size:.98rem; line-height:1.9; color:rgba(255,255,255,.5); }
.m-text em{ color:var(--accent); text-shadow:none; -webkit-text-stroke:0; }

/* ── Fix remaining cool tints ── */
.uz-search-item:hover{ background:rgba(236,68,19,.12); }
.hero-shape::after{ background:linear-gradient(135deg,transparent 50%,rgba(236,68,19,.12) 100%); }

/* ── Ticker: pyro tint + concrete feel ── */
.ticker .hi{ color:var(--accent); }
.ticker-wrap{ background:var(--card); }

/* ── Org cards hover: warm ── */
.org-card:hover{ border-color:var(--accent); box-shadow:none; transform:translateY(-2px); }

/* ── Newsletter + IG: warm CTA ── */
.ig-btn:hover{ background:var(--accent); color:#fff; box-shadow:none; }

/* ── Editorial: oversized flare-orange pull accent utility ── */
.flare{ color:var(--accent); }

/* ════════════════════════════════════════════════════════════════
   MOBILE EXCELLENCE LAYER, built for phones first (~80% of traffic)
   Bottom nav · sticky add-to-cart · big touch targets · safe areas
   ════════════════════════════════════════════════════════════════ */

/* never allow horizontal scroll on phones */
html, body { max-width:100%; overflow-x:hidden; }
img, svg, video { max-width:100%; }

/* ── Mobile bottom navigation bar (injected by components.js) ── */
.uz-mobnav{ display:none; }
@media(max-width:760px){
  .uz-mobnav{
    display:grid; grid-template-columns:repeat(4,1fr);
    position:fixed; left:0; right:0; bottom:0; top:auto; width:auto; z-index:180;
    background:rgba(13,13,13,.96); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
    border-top:1px solid rgba(255,255,255,.08); border-bottom:none;
    padding:0 0 env(safe-area-inset-bottom,0) 0; transition:none;
  }
  .uz-mobnav a{
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
    padding:9px 4px 8px; text-decoration:none; color:rgba(255,255,255,.62);
    font-size:.56rem; letter-spacing:.5px; position:relative; min-height:52px;
    transition:color .15s;
  }
  .uz-mobnav a.active, .uz-mobnav a:active{ color:var(--accent); }
  .uz-mobnav svg{ width:22px; height:22px; }
  .uz-mobnav .uz-cart-count{
    position:absolute; top:5px; left:50%; margin-left:4px;
    background:var(--accent); color:#fff; font-size:.5rem; font-weight:900;
    min-width:15px; height:15px; border-radius:8px; display:flex; align-items:center;
    justify-content:center; padding:0 3px; line-height:1;
  }
  /* leave room so content/footer aren't hidden behind the bar */
  body{ padding-bottom:64px; }
  #uz-back-top{ bottom:76px; }
  #uz-drawer, #uz-drawer-overlay{ z-index:9997; }
}

/* ── Sticky Add-to-Cart bar on product page (injected by page-product.js) ── */
.uz-pdp-bar{ display:none; }
@media(max-width:760px){
  .uz-pdp-bar{
    display:flex; align-items:center; gap:12px;
    position:fixed; left:0; right:0; bottom:64px; z-index:181;
    background:var(--card); border-top:1px solid var(--light);
    padding:10px 16px calc(10px + env(safe-area-inset-bottom,0));
    box-shadow:0 -6px 20px rgba(0,0,0,.08);
  }
  .uz-pdp-bar .uz-pdp-bar-price{ font-weight:900; font-size:1.15rem; color:var(--black); white-space:nowrap; }
  .uz-pdp-bar .uz-pdp-bar-price .old{ font-size:.8rem; color:var(--muted); text-decoration:line-through; font-weight:400; margin-inline-start:6px; }
  .uz-pdp-bar button{
    flex:1; background:var(--black); color:#fff; border:none; cursor:pointer;
    font-family:'Karantina','Heebo',sans-serif; font-weight:700; font-size:.86rem; letter-spacing:1px;
    text-transform:uppercase; padding:15px; min-height:50px; border-radius:2px;
  }
  .uz-pdp-bar button:disabled{ opacity:.5; }
  /* the desktop PDP add button is redundant on mobile once the bar exists */
  .pdp .pdp-actions{ display:none; }
}

/* ── Bigger, thumb-friendly touch targets across the board (mobile) ── */
@media(max-width:760px){
  .btn-primary, .btn-outline, .nav-cta, .m-cta, .ig-btn,
  .cs-checkout, .co-pay-btn, .uz-drawer-checkout, .product-add,
  .filter-btn, .pdp-size, .pdp-qty button, .uz-qty-btn{
    min-height:44px;
  }
  .product-add{ padding:8px 10px; font-size:.7rem; }
  .pdp-size{ min-width:56px; }
  .nav-cart, .nav-search{ padding:10px; }        /* easier tap in header */
  .sub-menu a, .footer-col a{ padding-top:11px; padding-bottom:11px; }
}

/* ── Mobile typography + spacing polish ── */
@media(max-width:760px){
  nav{ padding:13px 18px; }
  .logo{ font-size:1.6rem; letter-spacing:3px; }
  .hero{ min-height:auto; padding:96px 20px 44px; }
  .hero-title{ font-size:clamp(3.4rem,17vw,5rem); }
  .hero-sub{ font-size:1rem; max-width:100%; }
  .hero-actions{ gap:10px; }
  .hero-actions .btn-primary, .hero-actions .btn-outline{ flex:1; text-align:center; }
  .section-title{ font-size:clamp(1.8rem,7vw,2.4rem); margin-bottom:26px; }
  section, .org-strip, .ig-section, .manifesto-section, .newsletter{ padding-left:20px; padding-right:20px; }
  .products-grid{ gap:12px; }
  .m-text{ font-size:clamp(2rem,9vw,2.6rem); }
  .newsletter .nl-inner{ flex-direction:column; gap:20px; }
  .nl-form{ width:100%; }
  .nl-form input{ width:100%; }
}
@media(max-width:400px){
  .products-grid{ grid-template-columns:1fr 1fr; gap:10px; }
  .hero-title{ font-size:clamp(3rem,16vw,4.4rem); }
}

/* ── Mobile menu: bigger, safe-area aware ── */
@media(max-width:760px){
  .mobile-menu{ padding:76px 24px calc(32px + env(safe-area-inset-bottom,0)); gap:22px; overflow-y:auto; }
  .mobile-menu a{ font-size:2rem; }
  .mobile-menu .m-sub a{ font-size:1.15rem; }
}

/* ── Cart / checkout single-column comfort on mobile ── */
@media(max-width:760px){
  .cart-layout{ grid-template-columns:1fr !important; }
  .cart-summary{ position:static !important; }
  .co-grid{ grid-template-columns:1fr !important; }
  .co-summary{ position:static !important; order:-1; }  /* show order summary first */
}

/* ════════════════════════════════════════════════════════════════
   MOBILE MENU, clean redesign (section labels · list · one CTA)
   The nav's hamburger (which becomes ✕) is the only close control.
   ════════════════════════════════════════════════════════════════ */
.mobile-menu{ inset:0; background:var(--white); display:none; padding:0; gap:0;
  overflow-y:auto; -webkit-overflow-scrolling:touch; }
.mobile-menu.open{ display:block; }
.mobile-menu .mm-inner{ display:flex; flex-direction:column; align-items:stretch; text-align:right;
  max-width:520px; margin:0 auto; padding:82px 28px calc(44px + env(safe-area-inset-bottom,0)); }
.mobile-menu .mm-home{ font-family:'Bebas Neue','Karantina',sans-serif; font-size:2rem; letter-spacing:2px;
  color:var(--black); text-decoration:none; padding:4px 0 16px; border-bottom:2px solid var(--black); }
.mobile-menu .mm-home.active{ color:var(--cyan2); }
.mobile-menu .mm-label{ font-size:.6rem; letter-spacing:3px; text-transform:uppercase;
  color:var(--cyan2); font-weight:700; margin:24px 0 2px; }
.mobile-menu .mm-group{ display:flex; flex-direction:column; }
.mobile-menu .mm-group a{ font-family:'Karantina','Heebo',sans-serif; font-weight:600; font-size:1.05rem;
  color:var(--ink); text-decoration:none; padding:13px 2px; border-bottom:1px solid var(--light);
  transition:color .15s, padding .15s; }
.mobile-menu .mm-group a:active, .mobile-menu .mm-group a.active{ color:var(--cyan2); padding-inline-start:8px; }
.mobile-menu .m-cta{ font-family:'Karantina','Heebo',sans-serif; font-weight:700; font-size:.85rem; letter-spacing:2px;
  text-transform:uppercase; text-align:center; background:var(--black); color:#fff; padding:17px;
  margin-top:28px; text-decoration:none; border:none; display:block; }
.mobile-menu .m-cta:active{ background:var(--cyan2); color:#000; }


/* ── ZOOM BUTTON ON PRODUCT CARDS ───────────────────────────── */
.uz-zoom {
  position:absolute; top:10px; inset-inline-end:10px; z-index:3;
  width:34px; height:34px; display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.22); border-radius:2px;
  color:#fff; cursor:pointer; padding:0; opacity:0;
  transition:opacity .22s ease, background .22s ease, border-color .22s ease;
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
}
.product-card:hover .uz-zoom, .product-card:focus-within .uz-zoom { opacity:1; }
.uz-zoom:hover { background:rgba(0,0,0,.8); border-color:var(--cyan,#00d4e8); }
.uz-zoom svg { width:17px; height:17px; stroke:currentColor; fill:none; stroke-width:2; }
/* touch devices have no hover, keep it permanently visible */
@media (hover:none) { .uz-zoom { opacity:.85; } }

/* ── LIGHTBOX ───────────────────────────────────────────────── */
/* Solid background and a z-index above every other overlay, so nothing from
   the page (footer, Shabbat notice, sticky bars) can show through or sit on top. */
.uz-lightbox {
  position:fixed; inset:0; z-index:100000; display:none;
  align-items:center; justify-content:center; padding:36px;
  background:#000;
}
/* While the viewer is open, every other fixed overlay stays out of the way. */
html.uz-lb-open #shabbat-overlay,
html.uz-lb-open .footer-shabbat,
html.uz-lb-open .uz-pdp-bar,
html.uz-lb-open #uz-back-top,
html.uz-lb-open #uz-search-overlay,
html.uz-lb-open #uz-drawer,
html.uz-lb-open #uz-drawer-overlay { display:none !important; }
.uz-lightbox.open { display:flex; animation:uzLbIn .18s ease; }
@keyframes uzLbIn { from{opacity:0} to{opacity:1} }
.uz-lb-fig { margin:0; max-width:min(1400px,94vw); max-height:92vh; display:flex; flex-direction:column; gap:14px; align-items:center; }
.uz-lb-fig img {
  max-width:100%; max-height:84vh; object-fit:contain; display:block;
  background:#000; box-shadow:0 24px 70px rgba(0,0,0,.75);
}
.uz-lb-fig figcaption {
  color:rgba(255,255,255,.75); font-size:.85rem; letter-spacing:1px; text-align:center;
}
.uz-lb-close {
  position:absolute; top:20px; inset-inline-end:24px;
  width:46px; height:46px; font-size:2rem; line-height:1;
  background:none; border:1px solid rgba(255,255,255,.25); color:#fff;
  cursor:pointer; transition:border-color .2s, background .2s;
}
.uz-lb-close:hover { background:rgba(255,255,255,.1); border-color:var(--cyan,#00d4e8); }
.pdp-main-img { cursor:zoom-in; }
@media(max-width:700px){ .uz-lightbox { padding:14px; } .uz-lb-close { top:10px; inset-inline-end:12px; } }

/* ── LIVE FILTER CHIPS (above product grids) ────────────────── */
.uz-filterbar { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 20px; }
.uz-fchip {
  padding:9px 16px; cursor:pointer; font-family:inherit; font-weight:700;
  font-size:.74rem; letter-spacing:1.5px;
  background:transparent; color:var(--ink,#111);
  border:1px solid rgba(128,128,128,.35); border-radius:2px;
  transition:all .2s ease;
}
.uz-fchip span { opacity:.5; font-size:.68rem; margin-inline-start:4px; }
.uz-fchip:hover { border-color:var(--cyan,#00d4e8); color:var(--cyan,#00d4e8); }
.uz-fchip.active {
  background:var(--cyan,#00d4e8); border-color:var(--cyan,#00d4e8); color:#000;
}
.uz-fchip.active span { opacity:.65; }
@media(max-width:700px){ .uz-fchip { padding:8px 12px; font-size:.7rem; } }