/* ═══════════════════════════════════════════════
   PRIMAVERA 90 — Design System v4
   VHS dropout · cinematic red · full-bleed
   ═══════════════════════════════════════════════ */

:root {
  --bg-primary:   #050508;
  --bg-secondary: #0c0c12;
  --bg-card:      #111119;
  --bg-card-hover:#181824;
  /* Red as primary VHS accent */
  --red:          #ff2244;
  --red-dim:      #cc1133;
  --red-glow:     rgba(255,34,68,0.15);
  --red-glitch:   #ff2244;
  /* Secondary accents */
  --cyan:         #00d4ff;
  --cyan-dim:     #0099bb;
  --cyan-glow:    rgba(0,212,255,0.12);
  --amber:        #f0a500;
  --amber-dim:    #c88a00;
  --amber-glow:   rgba(240,165,0,0.12);
  --amber-soft:   #d4a574;
  --gold:         #c8a45e;
  --purple:       #7c6df0;
  --purple-glow:  rgba(124,109,240,0.14);
  --text-primary: #f0f0f5;
  --text-secondary:#9898b0;
  --text-muted:   #55556a;
  --border:       rgba(255,255,255,0.055);
  --border-hover: rgba(255,255,255,0.11);
  --radius-sm:    8px;
  --radius-md:    14px;
  --radius-lg:    22px;
  --radius-xl:    32px;
  --font-heading: 'Playfair Display', Georgia, serif;
  --font-body:    'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono:    'Courier New', monospace;
  --transition:   0.3s cubic-bezier(0.4,0,0.2,1);
  --max-width:    1340px;
  --section-padding: clamp(60px,9vw,120px);
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; font-size:16px; }
body {
  font-family:var(--font-body);
  background:var(--bg-primary);
  color:var(--text-primary);
  line-height:1.7;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  /* No body jitter — causes layout recalc on every frame */
}

/* ── CSS noise overlay (replaces JS canvas — zero JS cost) ── */
body::before {
  content:'';
  position:fixed; inset:0;
  pointer-events:none;
  z-index:9996;
  opacity:0.022;            /* much subtler — barely there texture */
  mix-blend-mode:screen;
  background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/></filter><rect width='180' height='180' filter='url(%23n)'/></svg>");
  background-size:180px 180px;
  animation:noise-drift 6s steps(4) infinite;   /* slow, calm drift — no flicker */
  will-change:background-position;
}
@keyframes noise-drift {
  0%   { background-position:0 0; }
  25%  { background-position:30px 20px; }
  50%  { background-position:-20px 35px; }
  75%  { background-position:25px -15px; }
  100% { background-position:0 0; }
}
img { max-width:100%; height:auto; display:block; }
a { text-decoration:none; color:inherit; }
ul,ol { list-style:none; }
.container {
  width:100%;
  max-width:var(--max-width);
  margin:0 auto;
  padding:0 clamp(20px,4vw,48px);
}

/* ═══════════════════════════════════════
   VHS OVERLAY SYSTEM
   ═══════════════════════════════════════ */

/* 1. CRT Scanlines */
#scanlines-overlay {
  position:fixed;
  inset:0;
  z-index:9997;
  pointer-events:none;
  background:repeating-linear-gradient(
    0deg,
    transparent,
    transparent 3px,
    rgba(0,0,0,0.08) 3px,
    rgba(0,0,0,0.08) 4px
  );
  mix-blend-mode:multiply;
}

/* 2. VHS dropout bands — 2 subtle bands, occasional, low-key.
   Long durations with a long invisible gap = rare tracking glitch,
   not a constant light show. nth-child 3-6 are dormant. */



/* Remaining bands dormant — keeps markup but no motion */


/* Band only visible during a brief 18% window of each cycle,
   then long dark gap — feels like an occasional tape artifact */



/* 5. Glitch text RGB-split — rare & subtle (one quick flicker every ~18s) */
@keyframes glitch-rgb {
  0%,96%,100% { text-shadow:none; transform:none; }
  97%  { text-shadow:-1px 0 var(--red-glitch), 1px 0 var(--cyan); }
  98%  { text-shadow:1px 0 var(--red-glitch), -1px 0 var(--cyan); }
  99%  { text-shadow:none; }
}

.glitch-text {
  animation: glitch-rgb 18s infinite;
  display:inline-block;
}

/* 6. VHS stamp on images hover — gentle, no hue spin */
@keyframes img-glitch {
  0%,100% { filter:none; }
  50%     { filter:saturate(1.15) contrast(1.05); }
}

/* ═══════════════════════════════════════
   TYPOGRAPHY
   ═══════════════════════════════════════ */

h1,h2,h3,h4 { font-family:var(--font-heading); font-weight:700; line-height:1.12; }
h1 { font-size:clamp(2.8rem,6.5vw,5rem); letter-spacing:-0.025em; }
h2 { font-size:clamp(2rem,4vw,3.2rem); letter-spacing:-0.015em; }
h3 { font-size:clamp(1.35rem,2.5vw,1.9rem); }
h4 { font-size:clamp(1.05rem,1.5vw,1.2rem); }

.section-label {
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:0.7rem;
  font-weight:700;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--red);           /* ← red primary */
  margin-bottom:18px;
}
.section-label::before {
  content:'';
  width:28px; height:1px;
  background:var(--red);
}
.section-label.amber  { color:var(--amber);  }
.section-label.amber::before  { background:var(--amber); }
.section-label.cyan   { color:var(--cyan);   }
.section-label.cyan::before   { background:var(--cyan); }
.section-label.purple { color:var(--purple); }
.section-label.purple::before { background:var(--purple); }

.section-title { margin-bottom:20px; }
.section-subtitle {
  font-size:clamp(1rem,1.5vw,1.1rem);
  color:var(--text-secondary);
  max-width:620px;
  line-height:1.85;
}

/* ═══════════════════════════════════════
   NAVIGATION
   ═══════════════════════════════════════ */

.nav {
  position:fixed;
  top:37px; /* below ticker */
  left:0; right:0;
  z-index:1000;
  padding:0 clamp(20px,4vw,40px);
  transition:var(--transition);
}
.nav.scrolled {
  top:0;
  background:rgba(5,5,8,0.94);
  backdrop-filter:blur(24px);
  -webkit-backdrop-filter:blur(24px);
  border-bottom:1px solid var(--border);
}
.nav-inner {
  max-width:var(--max-width);
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:72px;
}
.nav-logo {
  font-family:var(--font-heading);
  font-size:1.5rem;
  font-weight:700;
  display:flex;
  align-items:center;
  gap:10px;
}
.logo-90 { color:var(--amber); }
.logo-dot {
  width:7px; height:7px;
  background:var(--red);
  border-radius:50%;
  display:inline-block;
  box-shadow:0 0 10px var(--red);
  animation:pulse 2.5s infinite;
}
@keyframes pulse {
  0%,100% { opacity:1; box-shadow:0 0 0 0 rgba(255,34,68,0.5); }
  50%      { opacity:0.75; box-shadow:0 0 0 8px rgba(255,34,68,0); }
}
.nav-links {
  display:flex;
  align-items:center;
  gap:34px;
}
.nav-links a {
  font-size:0.85rem;
  font-weight:500;
  color:var(--text-secondary);
  transition:var(--transition);
  position:relative;
}
.nav-links a:hover { color:var(--text-primary); }
.nav-links a::after {
  content:'';
  position:absolute;
  bottom:-4px; left:0;
  width:0; height:1px;
  background:var(--red);
  transition:var(--transition);
}
.nav-links a:hover::after { width:100%; }
.lang-toggle {
  display:flex;
  background:rgba(255,255,255,0.06);
  border-radius:100px;
  padding:3px;
  gap:2px;
}
.lang-btn {
  padding:6px 15px;
  border-radius:100px;
  border:none;
  background:transparent;
  color:var(--text-secondary);
  font-size:0.78rem;
  font-weight:700;
  cursor:pointer;
  transition:var(--transition);
  font-family:var(--font-body);
  letter-spacing:0.05em;
}
.lang-btn.active { background:var(--cyan); color:var(--bg-primary); }
.nav-hamburger {
  display:none;
  flex-direction:column;
  gap:5px;
  background:none;
  border:none;
  cursor:pointer;
  padding:4px;
}
.nav-hamburger span {
  width:24px; height:2px;
  background:var(--text-primary);
  transition:var(--transition);
  border-radius:2px;
}

/* ═══════════════════════════════════════
   HERO
   ═══════════════════════════════════════ */

.hero {
  min-height:100vh;
  display:flex;
  align-items:center;
  position:relative;
  overflow:hidden;
  padding-top:clamp(110px,15vw,160px);
  padding-bottom:60px;
}
.hero-bg {
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse at 15% 60%, rgba(240,165,0,0.1) 0%, transparent 50%),
    radial-gradient(ellipse at 85% 40%, rgba(0,212,255,0.08) 0%, transparent 50%),
    radial-gradient(ellipse at 50% 100%, rgba(124,109,240,0.06) 0%, transparent 40%),
    var(--bg-primary);
}
.hero-bg::after {
  content:'';
  position:absolute;
  inset:0;
  background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80"><defs><pattern id="dots" patternUnits="userSpaceOnUse" width="20" height="20"><circle cx="1" cy="1" r="0.7" fill="rgba(255,255,255,0.025)"/></pattern></defs><rect fill="url(%23dots)" width="80" height="80"/></svg>');
}
.hero-content {
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1fr 1.05fr;
  gap:clamp(48px,7vw,100px);
  align-items:center;
}
.hero-text { max-width:640px; }
.hero-badge {
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 18px;
  background:rgba(255,34,68,0.1);
  border:1px solid rgba(255,34,68,0.28);
  border-radius:100px;
  font-size:0.72rem;
  font-weight:700;
  color:var(--red);
  text-transform:uppercase;
  letter-spacing:0.12em;
  margin-bottom:28px;
}
.hero-badge .pulse { width:7px; height:7px; background:var(--amber); border-radius:50%; animation:pulse-amber 2s infinite; }
@keyframes pulse-amber {
  0%,100% { box-shadow:0 0 0 0 rgba(255,34,68,0.5); }
  50%      { box-shadow:0 0 0 8px rgba(255,34,68,0); }
}
.hero h1 { margin-bottom:28px; }
.hero h1 .highlight-cyan  { color:var(--cyan); }
.hero h1 .highlight-amber { color:var(--red); }   /* Passado = red */
.hero-description {
  font-size:clamp(1rem,1.5vw,1.1rem);
  color:var(--text-secondary);
  margin-bottom:44px;
  max-width:520px;
  line-height:1.85;
}
.hero-ctas { display:flex; gap:16px; flex-wrap:wrap; }

/* REC indicator */
.rec-badge {
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-family:var(--font-mono);
  font-size:0.65rem;
  font-weight:700;
  color:var(--red-glitch);
  letter-spacing:0.15em;
  text-transform:uppercase;
  margin-bottom:20px;
  opacity:0.85;
}
.rec-dot {
  width:8px; height:8px;
  background:var(--red-glitch);
  border-radius:50%;
  animation:rec-blink 1.2s step-end infinite;
  box-shadow:0 0 8px var(--red-glitch);
}
@keyframes rec-blink {
  0%,100% { opacity:1; }
  50%      { opacity:0; }
}
.rec-counter {
  font-family:var(--font-mono);
  font-size:0.65rem;
  color:var(--text-muted);
  letter-spacing:0.1em;
  margin-left:16px;
}

/* Hero gallery */
.hero-gallery-wrap {
  position:relative;
}
.hero-gallery {
  display:grid;
  grid-template-columns:1.4fr 1fr;
  grid-template-rows:1fr 1fr;
  gap:10px;
  width:100%;
  max-width:560px;
  aspect-ratio:1/1;
  margin-left:auto;
}
.gallery-item {
  border-radius:var(--radius-sm);
  overflow:hidden;
  position:relative;
  border:1px solid var(--border);
}
.gallery-item:first-child {
  grid-row:1/3;
  border-radius:var(--radius-lg) var(--radius-sm) var(--radius-sm) var(--radius-lg);
}
.gallery-item img {
  width:100%; height:100%;
  object-fit:cover;
  transition:transform 0.7s ease;
}
.gallery-item:hover img { transform:scale(1.04); }
.gallery-label {
  position:absolute;
  bottom:10px; left:10px;
  padding:4px 10px;
  border-radius:100px;
  font-size:0.6rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:0.08em;
  background:rgba(0,0,0,0.72);
  backdrop-filter:blur(8px);
  color:var(--text-primary);
  border:1px solid var(--border);
}
.gallery-label.retro  { color:var(--amber); border-color:rgba(240,165,0,0.3); }
.gallery-label.modern { color:var(--cyan);  border-color:rgba(0,212,255,0.3); }

/* Scroll indicator */
.scroll-hint {
  position:absolute;
  bottom:28px; left:50%;
  transform:translateX(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  opacity:0.4;
  animation:fade-scroll 2s ease infinite;
}
.scroll-hint span { font-size:0.65rem; font-weight:600; letter-spacing:0.15em; text-transform:uppercase; }
.scroll-hint .arrow { font-size:1rem; animation:bounce-down 1.5s ease infinite; }
@keyframes fade-scroll { 0%,100%{opacity:0.4;} 50%{opacity:0.8;} }
@keyframes bounce-down { 0%,100%{transform:translateY(0);} 50%{transform:translateY(5px);} }

/* ═══════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════ */

.btn {
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:14px 28px;
  border-radius:var(--radius-sm);
  font-family:var(--font-body);
  font-size:0.9rem;
  font-weight:600;
  border:none;
  cursor:pointer;
  transition:var(--transition);
  white-space:nowrap;
  position:relative;
  overflow:hidden;
}
.btn::after {
  content:'';
  position:absolute;
  inset:0;
  background:rgba(255,255,255,0);
  transition:0.2s;
}
.btn:hover::after { background:rgba(255,255,255,0.06); }
.btn-primary  { background:var(--cyan); color:var(--bg-primary); }
.btn-primary:hover  { background:#00bde6; box-shadow:0 0 32px rgba(0,212,255,0.3); transform:translateY(-2px); }
.btn-secondary{ background:transparent; color:var(--text-primary); border:1px solid var(--border-hover); }
.btn-secondary:hover{ border-color:var(--amber); color:var(--amber); }
.btn-amber { background:var(--amber); color:var(--bg-primary); }
.btn-amber:hover { background:var(--amber-dim); box-shadow:0 0 32px rgba(240,165,0,0.3); transform:translateY(-2px); }
.btn-whatsapp { background:#25d366; color:#fff; }
.btn-whatsapp:hover { background:#20bd5a; box-shadow:0 4px 24px rgba(37,211,102,0.35); transform:translateY(-2px); }
.btn-sm { padding:10px 20px; font-size:0.8rem; }
.btn-lg { padding:17px 40px; font-size:1rem; }

/* ═══════════════════════════════════════
   CATALOG SECTIONS
   ═══════════════════════════════════════ */

.catalog-section { padding:var(--section-padding) 0; }
.catalog-section.alt { background:var(--bg-secondary); }
.catalog-header {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  margin-bottom:clamp(36px,5vw,56px);
  flex-wrap:wrap;
  gap:20px;
}

/* Full-bleed product grid */
.product-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:20px;
}
.product-grid.wide { grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); }

/* Product card v3 — full-bleed photo */
.product-card {
  position:relative;
  border-radius:var(--radius-md);
  overflow:hidden;
  border:1px solid var(--border);
  background:var(--bg-card);
  cursor:pointer;
  transition:var(--transition);
  aspect-ratio:3/4;
  display:flex;
  flex-direction:column;
}
.product-card:hover { border-color:var(--border-hover); transform:translateY(-4px); }
.product-card.retro:hover  { border-color:rgba(240,165,0,0.5); box-shadow:0 16px 48px rgba(240,165,0,0.1); }
.product-card.modern:hover { border-color:rgba(0,212,255,0.5); box-shadow:0 16px 48px rgba(0,212,255,0.1); }
.product-card.perfume:hover{ border-color:rgba(124,109,240,0.5);box-shadow:0 16px 48px rgba(124,109,240,0.1); }

.product-photo {
  position:absolute; inset:0;
  width:100%; height:100%;
}
.product-photo img {
  width:100%; height:100%;
  object-fit:cover;
  transition:transform 0.7s ease;
}
.product-card:hover .product-photo img { transform:scale(1.06); }

/* VHS glitch on hover */
.product-card:hover .product-photo::after {
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(
    transparent 0%,
    rgba(0,212,255,0.04) 45%,
    rgba(255,34,68,0.03) 55%,
    transparent 100%
  );
  animation:img-glitch 0.4s steps(2) 1;
  pointer-events:none;
}

.product-overlay {
  position:absolute; inset:0;
  background:linear-gradient(
    to top,
    rgba(5,5,8,0.97) 0%,
    rgba(5,5,8,0.75) 35%,
    rgba(5,5,8,0.2)  65%,
    transparent       100%
  );
  transition:var(--transition);
}
.product-card:hover .product-overlay {
  background:linear-gradient(
    to top,
    rgba(5,5,8,1)    0%,
    rgba(5,5,8,0.88) 45%,
    rgba(5,5,8,0.35) 70%,
    transparent       100%
  );
}
.product-badge {
  position:absolute;
  top:14px; left:14px;
  padding:4px 12px;
  border-radius:100px;
  font-size:0.62rem;
  font-weight:700;
  letter-spacing:0.1em;
  text-transform:uppercase;
  z-index:3;
}
.product-badge.retro    { background:rgba(240,165,0,0.18); color:var(--amber);  border:1px solid rgba(240,165,0,0.4); }
.product-badge.modern   { background:rgba(0,212,255,0.18); color:var(--cyan);   border:1px solid rgba(0,212,255,0.4); }
.product-badge.perfume  { background:rgba(124,109,240,0.18);color:var(--purple);border:1px solid rgba(124,109,240,0.4); }
.product-badge.exclusive{ background:rgba(240,165,0,0.25); color:var(--amber);  border:1px solid rgba(240,165,0,0.5); }
.product-badge.vhs      { background:rgba(240,165,0,0.22); color:var(--amber);  border:1px solid rgba(240,165,0,0.5); }

/* Lightbox trigger icon */
.product-expand {
  position:absolute;
  top:14px; right:56px;
  width:32px; height:32px;
  border-radius:8px;
  background:rgba(0,0,0,0.6);
  border:1px solid var(--border-hover);
  display:flex; align-items:center; justify-content:center;
  font-size:0.9rem;
  z-index:3;
  opacity:0;
  transition:var(--transition);
  cursor:pointer;
}
.product-card:hover .product-expand { opacity:1; }

.product-info {
  position:absolute; bottom:0; left:0; right:0;
  padding:20px 20px 18px;
  z-index:2;
  transform:translateY(0);
}
.product-info h4 {
  font-size:1rem;
  margin-bottom:5px;
  line-height:1.3;
}
.product-desc {
  font-size:0.82rem;
  color:var(--text-secondary);
  line-height:1.55;
  margin-bottom:14px;
  /* Always visible — users shouldn't hunt for info */
  max-height:72px;
  overflow:hidden;
  transition:max-height 0.4s ease, color 0.3s;
}
.product-card:hover .product-desc { max-height:100px; color:rgba(240,240,245,0.85); }

.product-footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.price-label {
  font-family:var(--font-mono);
  font-size:0.65rem;
  font-weight:700;
  color:var(--text-muted);
  text-transform:uppercase;
  letter-spacing:0.12em;
}

/* ═══════════════════════════════════════
   PHOTO MOSAIC
   ═══════════════════════════════════════ */

.photo-mosaic {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:200px;
  gap:12px;
  margin-top:clamp(28px,4vw,44px);
}
.mosaic-item {
  border-radius:var(--radius-sm);
  overflow:hidden;
  border:1px solid var(--border);
  position:relative;
  cursor:pointer;
}
.mosaic-item img {
  width:100%; height:100%;
  object-fit:cover;
  transition:transform 0.5s ease;
}
.mosaic-item:hover img { transform:scale(1.07); }
.mosaic-item:hover { border-color:var(--amber); }
.mosaic-item.wide  { grid-column:span 2; }
.mosaic-item.tall  { grid-row:span 2; }

/* ═══════════════════════════════════════
   VHS SECTION
   ═══════════════════════════════════════ */

.vhs-banner {
  padding:var(--section-padding) 0;
  position:relative;
  overflow:hidden;
  background:var(--bg-secondary);
}
.vhs-banner-bg {
  position:absolute; inset:0;
  background:
    repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(240,165,0,0.018) 3px,rgba(240,165,0,0.018) 4px),
    radial-gradient(ellipse at 25% 50%, rgba(240,165,0,0.1) 0%, transparent 55%),
    radial-gradient(ellipse at 75% 70%, rgba(124,109,240,0.05) 0%, transparent 40%),
    var(--bg-secondary);
}
.vhs-banner .container { position:relative; z-index:2; }
.vhs-grid {
  display:grid;
  grid-template-columns:1fr 1.3fr;
  gap:clamp(48px,7vw,96px);
  align-items:center;
}
.vhs-visual { position:relative; }
.vhs-main-img {
  width:100%;
  border-radius:var(--radius-lg);
  border:1px solid rgba(240,165,0,0.2);
  box-shadow:0 0 60px rgba(240,165,0,0.08);
}
.vhs-badge-float {
  position:absolute;
  top:-14px; right:-14px;
  background:var(--amber);
  color:var(--bg-primary);
  padding:9px 18px;
  border-radius:100px;
  font-size:0.68rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:0.12em;
  box-shadow:0 4px 24px rgba(240,165,0,0.4);
}
.vhs-info .vhs-tag {
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:7px 16px;
  background:rgba(240,165,0,0.1);
  border:1px solid rgba(240,165,0,0.25);
  border-radius:100px;
  font-size:0.68rem;
  font-weight:700;
  color:var(--amber);
  text-transform:uppercase;
  letter-spacing:0.12em;
  margin-bottom:24px;
}
.vhs-info h2 { margin-bottom:18px; }
.vhs-info p  { color:var(--text-secondary); margin-bottom:14px; line-height:1.85; }
.vhs-features { margin:28px 0; display:flex; flex-direction:column; gap:14px; }
.vhs-feature {
  display:flex; align-items:center; gap:14px;
  font-size:0.9rem; color:var(--text-secondary);
}
.vf-icon {
  width:36px; height:36px;
  border-radius:9px;
  background:rgba(240,165,0,0.1);
  border:1px solid rgba(240,165,0,0.18);
  display:flex; align-items:center; justify-content:center;
  font-size:1rem; flex-shrink:0;
}

/* VHS Camera gallery */
.vhs-cam-gallery {
  margin-top:clamp(44px,6vw,72px);
}
.vhs-cam-gallery-title {
  font-family:var(--font-mono);
  font-size:0.7rem;
  font-weight:700;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--amber);
  margin-bottom:20px;
  display:flex;
  align-items:center;
  gap:10px;
}
.vhs-cam-gallery-title::before {
  content:'▶';
  font-size:0.6rem;
}
.cam-grid {
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:12px;
}
.cam-item {
  border-radius:var(--radius-sm);
  overflow:hidden;
  border:1px solid var(--border);
  cursor:pointer;
  transition:var(--transition);
  aspect-ratio:1/1;
}
.cam-item img { width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease; }
.cam-item:hover { border-color:var(--amber); }
.cam-item:hover img { transform:scale(1.08); }

/* ═══════════════════════════════════════
   FAQ
   ═══════════════════════════════════════ */

.faq { padding:var(--section-padding) 0; background:var(--bg-secondary); }
.faq-header { text-align:center; margin-bottom:clamp(36px,5vw,52px); }
.faq-list { max-width:820px; margin:0 auto; }
.faq-item { border-bottom:1px solid var(--border); }
.faq-question {
  width:100%; padding:26px 0;
  background:none; border:none;
  color:var(--text-primary);
  font-family:var(--font-body);
  font-size:1rem; font-weight:600;
  text-align:left; cursor:pointer;
  display:flex; justify-content:space-between; align-items:center; gap:16px;
  transition:var(--transition);
}
.faq-question:hover { color:var(--cyan); }
.faq-icon {
  flex-shrink:0;
  width:26px; height:26px;
  display:flex; align-items:center; justify-content:center;
  font-size:1.3rem;
  color:var(--text-muted);
  transition:var(--transition);
  border:1px solid var(--border);
  border-radius:50%;
}
.faq-item.open .faq-icon { transform:rotate(45deg); color:var(--cyan); border-color:var(--cyan); }
.faq-answer { max-height:0; overflow:hidden; transition:max-height 0.4s ease, padding 0.4s ease; }
.faq-item.open .faq-answer { max-height:300px; padding-bottom:24px; }
.faq-answer p { color:var(--text-secondary); font-size:0.9rem; line-height:1.85; }

/* ═══════════════════════════════════════
   LOCATION
   ═══════════════════════════════════════ */

.location { padding:var(--section-padding) 0; }
.location-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(48px,7vw,96px);
  align-items:center;
}
.location-map-placeholder {
  width:100%; aspect-ratio:16/10;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  display:flex; align-items:center; justify-content:center;
  flex-direction:column; gap:12px;
  color:var(--text-muted); font-size:0.85rem;
}
.location-map-placeholder .placeholder-icon { font-size:2.5rem; }
.location-info h3 { margin-bottom:22px; }
.location-detail {
  display:flex; align-items:flex-start; gap:14px;
  margin-bottom:18px; color:var(--text-secondary); font-size:0.9rem;
}
.detail-icon {
  flex-shrink:0;
  width:38px; height:38px;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:9px;
  display:flex; align-items:center; justify-content:center;
  font-size:1rem;
}
.location-ctas { display:flex; gap:12px; margin-top:28px; flex-wrap:wrap; }

/* ═══════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════ */

.footer {
  padding:56px 0 24px;
  border-top:1px solid var(--border);
  background:var(--bg-secondary);
}
.footer-grid {
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:44px;
  margin-bottom:44px;
}
.footer-brand .nav-logo { margin-bottom:18px; }
.footer-brand p { color:var(--text-secondary); font-size:0.84rem; line-height:1.75; max-width:280px; }
.footer-col h4 {
  font-size:0.72rem; font-weight:700;
  text-transform:uppercase; letter-spacing:0.12em;
  color:var(--text-muted); margin-bottom:18px;
  font-family:var(--font-body);
}
.footer-col a { display:block; color:var(--text-secondary); font-size:0.84rem; padding:4px 0; transition:var(--transition); }
.footer-col a:hover { color:var(--cyan); }
.footer-bottom {
  padding-top:24px;
  border-top:1px solid var(--border);
  display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:16px;
}
.footer-bottom p { color:var(--text-muted); font-size:0.78rem; }
.footer-legal { display:flex; gap:24px; }
.footer-legal a { color:var(--text-muted); font-size:0.78rem; transition:var(--transition); }
.footer-legal a:hover { color:var(--text-secondary); }

/* ═══════════════════════════════════════
   WHATSAPP FAB
   ═══════════════════════════════════════ */

.whatsapp-fab {
  position:fixed;
  bottom:28px; right:28px;
  width:60px; height:60px;
  background:#25d366;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:1.7rem;
  box-shadow:0 4px 24px rgba(37,211,102,0.45);
  z-index:998;
  transition:var(--transition);
}
.whatsapp-fab:hover { transform:scale(1.1); box-shadow:0 6px 36px rgba(37,211,102,0.55); }

/* ═══════════════════════════════════════
   LIGHTBOX
   ═══════════════════════════════════════ */

.lightbox {
  position:fixed; inset:0;
  background:rgba(0,0,0,0.95);
  backdrop-filter:blur(12px);
  z-index:10000;
  display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none;
  transition:opacity 0.3s;
  padding:20px;
}
.lightbox.open { opacity:1; pointer-events:all; }
.lightbox-inner {
  position:relative;
  max-width:90vw; max-height:90vh;
  display:flex; flex-direction:column; align-items:center; gap:16px;
}
.lightbox-inner img {
  max-width:100%; max-height:78vh;
  border-radius:var(--radius-md);
  border:1px solid var(--border);
  object-fit:contain;
  transition:opacity 0.28s ease;
}
.lightbox-close {
  position:absolute;
  top:20px; right:24px;
  width:46px; height:46px;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:50%;
  color:var(--text-primary);
  font-size:1.4rem; line-height:1;
  cursor:pointer; z-index:3;
  display:flex; align-items:center; justify-content:center;
  transition:var(--transition);
}
.lightbox-close:hover { background:var(--red); border-color:var(--red); transform:rotate(90deg); }

/* Gallery prev/next */
.lightbox-nav {
  position:absolute; top:50%; transform:translateY(-50%);
  width:54px; height:54px;
  background:rgba(17,17,25,0.55);
  border:1px solid var(--border);
  border-radius:50%;
  color:var(--text-primary);
  font-size:2rem; line-height:1; padding-bottom:5px;
  cursor:pointer; z-index:3;
  display:flex; align-items:center; justify-content:center;
  -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px);
  transition:var(--transition);
}
.lightbox-nav:hover { background:var(--red); border-color:var(--red); }
.lightbox-prev { left:24px; }
.lightbox-next { right:24px; }
.lightbox-counter {
  position:absolute; bottom:22px; left:50%; transform:translateX(-50%);
  font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.28em;
  color:var(--text-secondary); z-index:3;
}
.lightbox-caption {
  font-size:0.85rem;
  color:var(--text-secondary);
  text-align:center;
  max-width:70ch;
}
@media (max-width:600px) {
  .lightbox-nav { width:44px; height:44px; font-size:1.6rem; }
  .lightbox-prev { left:10px; }
  .lightbox-next { right:10px; }
  .lightbox-close { top:12px; right:12px; }
}

/* ═══════════════════════════════════════
   SECTION DIVIDERS
   ═══════════════════════════════════════ */

.section-divider {
  height:1px;
  background:linear-gradient(90deg,transparent,var(--border-hover),transparent);
}
.section-divider.amber {
  background:linear-gradient(90deg,transparent,rgba(240,165,0,0.3),transparent);
}
.section-divider.cyan {
  background:linear-gradient(90deg,transparent,rgba(0,212,255,0.3),transparent);
}

/* ═══════════════════════════════════════
   REVEAL ANIMATION
   ═══════════════════════════════════════ */

.reveal {
  opacity:0;
  transform:translateY(28px);
  transition:opacity 0.65s ease, transform 0.65s ease;
}
.reveal.visible { opacity:1; transform:translateY(0); }

/* ═══════════════════════════════════════
   MOBILE MENU
   ═══════════════════════════════════════ */

.mobile-menu {
  display:none;
  position:fixed; inset:0;
  background:rgba(5,5,8,0.98);
  backdrop-filter:blur(24px);
  z-index:999;
  flex-direction:column;
  align-items:center; justify-content:center;
  gap:30px;
  opacity:0; pointer-events:none;
  transition:opacity 0.3s;
}
.mobile-menu.open { opacity:1; pointer-events:all; }
.mobile-menu a { font-size:1.3rem; font-weight:600; color:var(--text-primary); transition:var(--transition); }
.mobile-menu a:hover { color:var(--cyan); }
.mobile-menu .lang-toggle { margin-top:16px; }
.mobile-close {
  position:absolute; top:24px; right:24px;
  background:none; border:none;
  color:var(--text-primary); font-size:1.8rem; cursor:pointer;
}

/* ═══════════════════════════════════════
   VHS TUNE-IN INTRO
   ═══════════════════════════════════════ */
#vhs-intro {
  position:fixed; inset:0;
  z-index:10000;
  background:#000;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
  /* Failsafe: if JS never runs, fade away by 9s so the site is NEVER blocked */
  animation:intro-failsafe 0.6s ease 9s forwards;
}
#vhs-intro.done { animation:intro-out 0.7s ease forwards; }
#vhs-intro.gone { display:none; }

/* ── CRT power-on: a white line blooms then expands to fill ── */
.crt-power {
  position:absolute; left:0; right:0; top:50%;
  height:3px; background:#fff;
  transform:translateY(-50%) scaleX(0);
  box-shadow:0 0 50px 10px rgba(255,255,255,0.9);
  z-index:6; pointer-events:none;
  animation:crt-line 0.55s ease forwards;
}
@keyframes crt-line {
  0%   { transform:translateY(-50%) scaleX(0); height:3px;  opacity:1; }
  30%  { transform:translateY(-50%) scaleX(1); height:3px;  opacity:1; }
  55%  { height:16px;  opacity:1; }
  100% { height:104vh; opacity:0; }
}

/* ── Rolling analog static (loading bed) ── */
.intro-static {
  position:absolute; inset:0; z-index:1;
  opacity:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='s'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23s)'/%3E%3C/svg%3E");
  background-size:240px 240px;
  animation:intro-static-flicker 0.16s steps(2) infinite;
  transition:opacity 0.5s ease;
}
#vhs-intro.snow   .intro-static { opacity:0.42; }
#vhs-intro.locked .intro-static { opacity:0.05; }

/* ── SMPTE colour bars: brief channel-sync flash after power-on ── */
.intro-bars {
  position:absolute; inset:0; z-index:2;
  display:flex; flex-direction:column;
  opacity:0;
  animation:intro-bars-flash 0.9s ease 0.5s 1 both;
}
.intro-bars span { flex:1; }
.intro-bars span:nth-child(1){ background:#c0c0c0; }
.intro-bars span:nth-child(2){ background:#c0c000; }
.intro-bars span:nth-child(3){ background:#00c0c0; }
.intro-bars span:nth-child(4){ background:#00c000; }
.intro-bars span:nth-child(5){ background:#c000c0; }
.intro-bars span:nth-child(6){ background:#c00000; }
.intro-bars span:nth-child(7){ background:#0000c0; }
@keyframes intro-bars-flash { 0%{opacity:0;} 18%{opacity:0.92;} 78%{opacity:0.92;} 100%{opacity:0;} }

/* ── Picture-lock scan sweep (plays on .locked) ── */
.intro-scan {
  position:absolute; left:0; right:0;
  height:34vh; top:-34vh;
  background:linear-gradient(transparent,rgba(255,255,255,0.06) 44%,rgba(255,255,255,0.16) 50%,rgba(255,255,255,0.06) 56%,transparent);
  z-index:3; pointer-events:none; opacity:0;
}
#vhs-intro.locked .intro-scan { animation:intro-scan-sweep 0.95s ease-in forwards; }
@keyframes intro-scan-sweep { 0%{top:-34vh;opacity:1;} 100%{top:108vh;opacity:1;} }

/* ── CRT scanlines + vignette (curvature feel) ── */
.intro-scanlines {
  position:absolute; inset:0; z-index:4; pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,0.16) 2px,rgba(0,0,0,0.16) 3px);
  mix-blend-mode:multiply; opacity:0.6;
}
.intro-vignette {
  position:absolute; inset:0; z-index:5; pointer-events:none;
  background:radial-gradient(ellipse at center, transparent 52%, rgba(0,0,0,0.55) 100%);
  box-shadow:inset 0 0 160px 30px rgba(0,0,0,0.9);
}

/* ── Corner HUD ── */
.intro-osd, .intro-date, .intro-ch {
  position:absolute; z-index:7;
  font-family:var(--font-mono,'Courier New',monospace);
  opacity:0;
  animation:intro-osd-in 0.4s ease 1.0s forwards;
}
.intro-osd {
  top:7%; left:7%;
  display:flex; align-items:center; gap:12px;
  color:#fff; font-size:1.25rem; letter-spacing:0.22em;
  text-shadow:0 0 8px rgba(255,255,255,0.4);
}
.intro-play { color:var(--red); font-size:1.45rem; animation:pulse 1.1s infinite; }
.intro-ch {
  top:calc(7% + 2.4rem); left:7%;
  color:rgba(255,255,255,0.58); font-size:0.8rem; letter-spacing:0.3em;
}
.intro-date {
  top:7%; right:7%;
  color:rgba(255,255,255,0.78); font-size:0.92rem; letter-spacing:0.14em;
  text-shadow:0 0 6px rgba(0,0,0,0.6);
}

/* ── Centerpiece: brand + tagline (revealed on picture-lock) ── */
.intro-center { position:relative; z-index:7; text-align:center; }
.intro-brand {
  font-family:var(--font-heading);
  font-size:clamp(2.2rem,8.5vw,5.2rem);
  font-weight:700; color:#fff; letter-spacing:0.04em;
  opacity:0; text-shadow:-2px 0 var(--red), 2px 0 var(--cyan);
}
.intro-brand b { color:var(--red); }
.intro-tagline {
  margin-top:14px;
  font-family:var(--font-mono,'Courier New',monospace);
  font-size:clamp(0.58rem,1.6vw,0.82rem);
  letter-spacing:0.42em; color:rgba(255,255,255,0.62);
  opacity:0;
}
#vhs-intro.locked .intro-brand {
  animation:intro-brand-in 0.8s cubic-bezier(0.2,0.8,0.2,1) 0.25s forwards, glitch-rgb 0.45s 1.0s;
}
#vhs-intro.locked .intro-tagline { animation:intro-tagline-in 0.8s ease 0.7s forwards; }

/* ── Tape loader (counter + progress + status) ── */
.intro-loader {
  position:absolute; bottom:11%; left:50%;
  transform:translateX(-50%);
  z-index:7; width:min(360px,72vw); text-align:center;
  opacity:0; transition:opacity 0.5s ease, transform 0.5s ease;
}
#vhs-intro.snow   .intro-loader { opacity:1; }
#vhs-intro.locked .intro-loader { opacity:0; transform:translateX(-50%) translateY(12px); }
.intro-counter {
  display:flex; align-items:center; justify-content:center; gap:14px;
  font-family:var(--font-mono,'Courier New',monospace);
  font-size:1.9rem; font-weight:700; letter-spacing:0.18em;
  color:#fff; text-shadow:0 0 10px rgba(255,34,68,0.4);
}
.intro-counter .reel {
  width:13px; height:13px; border-radius:50%;
  border:2px solid rgba(255,255,255,0.5);
  border-top-color:var(--red);
  display:inline-block;
  animation:reel-spin 0.8s linear infinite;
}
.intro-progress {
  margin:14px auto 10px;
  height:3px; width:100%;
  background:rgba(255,255,255,0.12);
  border-radius:2px; overflow:hidden;
}
.intro-progress span {
  display:block; height:100%; width:0;
  background:linear-gradient(90deg,var(--red),var(--amber));
}
.intro-status {
  font-family:var(--font-mono,'Courier New',monospace);
  font-size:0.68rem; letter-spacing:0.34em;
  color:rgba(255,255,255,0.55);
}

@keyframes reel-spin { to { transform:rotate(360deg); } }
@keyframes intro-static-flicker { 0%{transform:translate(0,0);} 100%{transform:translate(-3px,2px);} }
@keyframes intro-osd-in   { from{opacity:0;transform:translateY(-6px);} to{opacity:1;transform:none;} }
@keyframes intro-brand-in { from{opacity:0;transform:scale(1.12);filter:blur(10px);} to{opacity:1;transform:none;filter:none;} }
@keyframes intro-tagline-in { from{opacity:0;letter-spacing:0.7em;} to{opacity:1;letter-spacing:0.42em;} }
@keyframes intro-out      { to{opacity:0;visibility:hidden;} }
@keyframes intro-failsafe { to{opacity:0;visibility:hidden;pointer-events:none;} }

/* ═══════════════════════════════════════
   SCROLL PROGRESS TRACKING BAR
   ═══════════════════════════════════════ */
#scroll-progress {
  position:fixed;
  top:0; left:0; right:0;
  height:2px;
  z-index:9999;
  background:rgba(255,255,255,0.03);
  pointer-events:none;
}
#scroll-progress span {
  display:block;
  height:100%;
  width:0;
  background:var(--red);
  opacity:0.7;
  transition:width 0.1s linear;
}

/* ═══════════════════════════════════════
   ON-SCREEN DISPLAY (persistent HUD)
   ═══════════════════════════════════════ */

   /* subtle HUD, doesn't shout */



/* ═══════════════════════════════════════
   BACK-TO-TOP REW BUTTON
   ═══════════════════════════════════════ */
#back-to-top {
  position:fixed;
  bottom:clamp(20px,4vw,32px);
  left:clamp(20px,4vw,32px);
  z-index:995;
  display:flex; flex-direction:column; align-items:center; gap:1px;
  width:56px; height:56px;
  border-radius:50%;
  border:1px solid rgba(255,34,68,0.4);
  background:rgba(15,15,20,0.85);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  color:var(--red);
  cursor:pointer;
  font-family:var(--font-mono,'Courier New',monospace);
  opacity:0; visibility:hidden;
  transform:translateY(12px);
  transition:opacity 0.3s, transform 0.3s, box-shadow 0.3s, background 0.3s;
}
#back-to-top.show { opacity:1; visibility:visible; transform:none; }
#back-to-top:hover {
  background:var(--red);
  color:#fff;
  box-shadow:0 0 18px rgba(255,34,68,0.5);
}
#back-to-top .rew-icon  { font-size:1.05rem; line-height:1; }
#back-to-top .rew-label { font-size:0.55rem; letter-spacing:0.12em; font-weight:700; }

/* WhatsApp FAB — calm, no pulsing ring (subtle hover lift only) */
.whatsapp-fab { position:relative; transition:transform 0.25s ease, box-shadow 0.25s ease; }
.whatsapp-fab:hover { transform:translateY(-2px); }

/* Nav scrollspy active state */
.nav-links a.active { color:var(--text-primary); }
.nav-links a.active::after { width:100%; background:var(--red); }

/* ═══════════════════════════════════════
   ACCESSIBILITY — REDUCED MOTION
   ═══════════════════════════════════════ */
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after {
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
    scroll-behavior:auto !important;
  }
  #vhs-intro { display:none !important; }
  
  #scanlines-overlay { opacity:0.4; }
}

:focus-visible {
  outline:2px solid var(--red);
  outline-offset:3px;
  border-radius:3px;
}

/* ═══════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════ */

/* ── Tablet landscape ── */
@media (max-width:1100px) {
  .hero-content      { grid-template-columns:1fr; }
  .hero-gallery-wrap { display:none; }
  .about-grid        { grid-template-columns:1fr; }
  .categories-grid   { grid-template-columns:1fr 1fr; }
  .diff-grid         { grid-template-columns:1fr 1fr; }
  .testimonials-grid { grid-template-columns:1fr 1fr; }
  .location-grid     { grid-template-columns:1fr; }
  .footer-grid       { grid-template-columns:1fr 1fr; }
  .vhs-grid          { grid-template-columns:1fr; }
  .cam-grid          { grid-template-columns:repeat(3,1fr); }
}

/* ── Tablet portrait / large phone ── */
@media (max-width:768px) {
  /* Nav */
  .nav             { top:0; padding:0 16px; }
  .nav-inner       { height:60px; }
  .nav-links       { display:none; }
  .nav-hamburger   { display:flex; }
  .mobile-menu     { display:flex; }

  /* Ticker: keep on tablet but shrink */
  .ticker-wrap     { padding:7px 0; }
  .ticker-track span {
    font-size:0.62rem;
    padding:0 16px;
    letter-spacing:0.08em;
  }

  /* Hero */
  .hero            { min-height:auto; padding-top:100px; padding-bottom:48px; }
  .hero h1         { font-size:clamp(2.2rem,8vw,3.2rem); }
  .hero-ctas       { flex-direction:column; gap:12px; }
  .hero-ctas .btn  { width:100%; justify-content:center; }
  .hero-badge      { flex-wrap:wrap; gap:6px; }

  /* Stats */
  .stats-grid      { grid-template-columns:1fr 1fr; gap:20px; }
  .stat-number     { font-size:clamp(2rem,7vw,3rem); }

  /* Categories */
  .categories-grid { grid-template-columns:1fr 1fr; gap:16px; }
  .cat-card        { min-height:220px; }

  /* Products */
  .product-grid    { grid-template-columns:1fr 1fr; gap:16px; }

  /* Mosaic */
  .photo-mosaic    { grid-template-columns:1fr 1fr; grid-auto-rows:150px; }

  /* Cam grid */
  .cam-grid        { grid-template-columns:repeat(3,1fr); gap:8px; }

  /* Differentials */
  .diff-grid       { grid-template-columns:1fr; }

  /* Testimonials */
  .testimonials-grid { grid-template-columns:1fr; }

  /* Comparison table — allow horizontal scroll */
  .comparison-table  { overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .comparison-table table { min-width:520px; }

  /* Footer */
  .footer-grid     { grid-template-columns:1fr; gap:32px; }

  /* Section spacing */
  section          { padding-top:clamp(48px,8vw,80px); padding-bottom:clamp(48px,8vw,80px); }
  .section-subtitle { font-size:0.95rem; }

  /* OSD lower on tablet (ticker still shown) */
  
}

/* ── Phones (portrait) ── */
@media (max-width:480px) {
  /* Ticker: hide on very small screens to save space */
  .ticker-wrap         { display:none; }

  /* Hide OSD on phones to save space */
  

  /* Smaller floating buttons */
  #back-to-top         { width:48px; height:48px; bottom:16px; left:16px; }

  /* Nav: adjust for no ticker */
  .nav                 { top:0; }
  .nav-inner           { height:56px; }
  .nav-logo            { font-size:1.25rem; }

  /* Hero */
  .hero                { padding-top:80px; padding-bottom:40px; }
  .hero h1             { font-size:clamp(1.9rem,9.5vw,2.6rem); line-height:1.1; }
  .hero .section-label { font-size:0.62rem; }
  .rec-badge           { flex-wrap:wrap; gap:6px; padding:8px 12px; }

  /* Stats: keep 2 col */
  .stats-grid          { grid-template-columns:1fr 1fr; gap:14px; }
  .stat-card           { padding:20px 14px; }
  .stat-number         { font-size:clamp(1.8rem,8vw,2.4rem); }

  /* Categories: single col */
  .categories-grid     { grid-template-columns:1fr; gap:12px; }
  .cat-card            { min-height:200px; }

  /* Products: single col */
  .product-grid        { grid-template-columns:1fr; gap:14px; }

  /* Cam grid: 2 col */
  .cam-grid            { grid-template-columns:1fr 1fr; gap:8px; }

  /* Mosaic */
  .photo-mosaic        { grid-template-columns:1fr 1fr; grid-auto-rows:130px; }
  .mosaic-item.wide    { grid-column:span 1; }

  /* VHS grid already 1-col from 1100px */

  /* Differentials */
  .diff-card           { padding:24px 18px; }

  /* Comparison table */
  .comparison-table table { min-width:440px; }
  .gt-table td, .gt-table th { font-size:0.78rem; padding:10px 12px; }

  /* Testimonials */
  .testimonial-card    { padding:24px 18px; }

  /* FAQ */
  .faq-question        { font-size:0.9rem; padding:16px 18px; }
  .faq-answer          { font-size:0.85rem; padding:0 18px 16px; }

  /* CTA section */
  .cta-section         { padding:60px 20px; }
  .cta-section h2      { font-size:clamp(1.7rem,7vw,2.2rem); }

  /* Footer */
  .footer              { padding:48px 0 28px; }
  .footer-grid         { grid-template-columns:1fr; gap:24px; }
  .footer-brand        { margin-bottom:0; }

  /* Timeline strip — shrink on phones */
  .timeline-strip      { padding:24px 0; }
  .timeline-year       { font-size:0.72rem; }
  .timeline-item       { min-width:100px; }

  /* Section headings */
  h2                   { font-size:clamp(1.65rem,7vw,2.4rem); }
  h3                   { font-size:clamp(1.1rem,5vw,1.5rem); }

  /* Reduce dropout z-fighters on small screens (perf) */
  
}

/* ═══════════════════════════════════════
   UPGRADE: ADD-TO-LIST TOGGLE
   ═══════════════════════════════════════ */
.product-list-btn {
  position:absolute; top:14px; right:14px;
  width:34px; height:34px; border-radius:9px;
  background:rgba(0,0,0,0.6);
  border:1px solid var(--border-hover);
  color:var(--text-secondary);
  display:flex; align-items:center; justify-content:center;
  font-size:1.2rem; line-height:1;
  cursor:pointer; z-index:4;
  opacity:0.62;
  transition:var(--transition);
}
.product-card:hover .product-list-btn { opacity:1; }
.product-list-btn:hover { border-color:var(--text-secondary); color:var(--text-primary); transform:translateY(-1px); }
.product-list-btn:focus-visible { opacity:1; }
.product-list-btn.in-list { opacity:1; color:#fff; background:var(--red); border-color:var(--red); }
.product-card.retro   .product-list-btn.in-list { background:var(--amber);  border-color:var(--amber);  color:#1a1400; }
.product-card.modern  .product-list-btn.in-list { background:var(--cyan);   border-color:var(--cyan);   color:#00181f; }
.product-card.perfume .product-list-btn.in-list { background:var(--purple); border-color:var(--purple); color:#fff; }
.product-list-btn .pl-ico { pointer-events:none; }

/* ═══════════════════════════════════════
   UPGRADE: INTEREST-LIST TRAY
   ═══════════════════════════════════════ */
#interest-tray {
  position:fixed; left:50%; bottom:20px;
  transform:translateX(-50%) translateY(150%);
  z-index:9500;
  width:min(390px, calc(100vw - 32px));
  display:flex; flex-direction:column; align-items:center; gap:10px;
  opacity:0; pointer-events:none;
  transition:transform 0.45s cubic-bezier(0.2,0.9,0.2,1), opacity 0.3s;
}
#interest-tray.active { transform:translateX(-50%) translateY(0); opacity:1; pointer-events:auto; }
.tray-toggle {
  display:flex; align-items:center; gap:10px;
  padding:12px 18px;
  background:var(--bg-card); border:1px solid var(--border-hover);
  border-radius:100px;
  color:var(--text-primary); cursor:pointer;
  box-shadow:0 12px 44px rgba(0,0,0,0.55);
  font-family:var(--font-body); font-size:0.85rem; font-weight:600;
  transition:var(--transition);
}
.tray-toggle:hover { border-color:var(--red); transform:translateY(-1px); }
.tray-toggle .tray-icon { font-size:1.1rem; line-height:1; }
.tray-toggle .tray-text { letter-spacing:0.01em; }
.tray-count {
  min-width:22px; height:22px; padding:0 6px;
  background:var(--red); color:#fff; border-radius:100px;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-mono); font-size:0.72rem; font-weight:700;
}
.tray-count.bump { animation:tray-bump 0.4s ease; }
@keyframes tray-bump { 0%{transform:scale(1);} 40%{transform:scale(1.4);} 100%{transform:scale(1);} }
.tray-panel {
  width:100%;
  background:var(--bg-card); border:1px solid var(--border-hover);
  border-radius:var(--radius-md);
  box-shadow:0 18px 54px rgba(0,0,0,0.62);
  max-height:0; overflow:hidden; opacity:0;
  padding:0 18px;
  transition:max-height 0.4s ease, opacity 0.3s, padding 0.4s;
}
#interest-tray.open .tray-panel { max-height:64vh; overflow:auto; opacity:1; padding:18px; }
.tray-panel-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.tray-panel-head strong { font-size:0.95rem; font-family:var(--font-heading); }
.tray-clear { background:none; border:none; color:var(--text-muted); font-size:0.74rem; cursor:pointer; text-decoration:underline; padding:0; }
.tray-clear:hover { color:var(--red); }
.tray-items { list-style:none; margin:0 0 14px; padding:0; display:flex; flex-direction:column; gap:8px; }
.tray-items li {
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  font-size:0.82rem; color:var(--text-secondary);
  padding:9px 11px; background:var(--bg-secondary); border-radius:9px;
}
.tray-items li .ti-name { line-height:1.35; }
.tray-items li .ti-remove { background:none; border:none; color:var(--text-muted); cursor:pointer; font-size:1.1rem; line-height:1; flex-shrink:0; }
.tray-items li .ti-remove:hover { color:var(--red); }
.tray-empty { color:var(--text-muted); font-size:0.82rem; text-align:center; padding:6px 0 16px; }
.tray-send { width:100%; justify-content:center; }

/* ═══════════════════════════════════════
   UPGRADE: OPEN-NOW PILL
   ═══════════════════════════════════════ */
.open-pill {
  display:inline-flex; align-items:center; gap:8px;
  padding:5px 13px; border-radius:100px;
  font-size:0.7rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase;
  font-family:var(--font-mono);
  border:1px solid var(--border-hover);
  margin-bottom:20px;
}
.open-pill .op-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.open-pill.is-open   { color:#43e88a; background:rgba(67,232,138,0.10); border-color:rgba(67,232,138,0.35); }
.open-pill.is-open .op-dot { background:#43e88a; box-shadow:0 0 8px rgba(67,232,138,0.7); animation:op-pulse 2.4s ease-in-out infinite; }
.open-pill.is-closed { color:var(--text-muted); background:rgba(255,255,255,0.03); }
.open-pill.is-closed .op-dot { background:var(--text-muted); }
@keyframes op-pulse { 0%,100%{opacity:1;} 50%{opacity:0.35;} }

@media (prefers-reduced-motion:reduce) {
  #interest-tray, .tray-panel, .tray-count, .open-pill .op-dot, .product-list-btn { transition:none; animation:none; }
}

/* ═══════════════════════════════════════
   PROFESSIONAL SECTION BANNERS
   ═══════════════════════════════════════ */
.section-banner {
  position:relative; overflow:hidden;
  height:clamp(200px, 28vh, 380px);
  display:flex; align-items:flex-end; justify-content:center;
  background:linear-gradient(135deg, var(--bg-secondary) 0%, var(--bg-card) 50%, rgba(255,34,68,0.08) 100%);
  border-bottom:1px solid var(--border);
  margin-bottom:var(--section-padding);
}
.section-banner::before {
  content:''; position:absolute; inset:0;
  background:repeating-linear-gradient(
    90deg,
    transparent, transparent 2px,
    rgba(255,255,255,0.02) 2px, rgba(255,255,255,0.02) 4px
  );
  opacity:0.5;
}
.section-banner::after {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse at 50% 0%, rgba(255,34,68,0.1), transparent 70%);
}
.section-banner-content {
  position:relative; z-index:2;
  text-align:center; padding:clamp(20px, 6vh, 40px);
  max-width:720px; margin:0 auto;
}
.section-banner h2 {
  font-size:clamp(1.8rem, 6vw, 3.2rem);
  font-weight:700;
  margin-bottom:12px;
  text-shadow: 2px 2px 12px rgba(0,0,0,0.6);
  letter-spacing:-0.02em;
}
.section-banner p {
  font-size:clamp(0.9rem, 2.2vw, 1.05rem);
  color:var(--text-secondary);
  line-height:1.6;
  max-width:560px;
  margin:0 auto;
}

/* Accent line under banner titles */
.section-banner::after {
  bottom:auto; top:auto;
}
.section-banner-accent {
  display:inline-block;
  height:3px;
  background:linear-gradient(90deg, var(--red), var(--amber), var(--cyan));
  margin-top:8px;
  border-radius:2px;
}

@media (max-width:768px) {
  .section-banner { height:clamp(160px, 24vh, 280px); }
  .section-banner-content { padding:clamp(16px, 5vh, 32px); }
}

/* ═══════════════════════════════════════
   CATALOG NAVIGATOR (emoji quick-scroll)
   ═══════════════════════════════════════ */
.catalog-nav {
  position:sticky; top:62px; z-index:90;
  background:rgba(5,5,8,0.88);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--border);
}
.catalog-nav-inner {
  max-width:var(--max-width);
  margin:0 auto;
  padding:0 clamp(16px,4vw,48px);
  display:flex;
  gap:4px;
  overflow-x:auto;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.catalog-nav-inner::-webkit-scrollbar { display:none; }
.cnav-pill {
  flex:0 0 auto;
  display:inline-flex; align-items:center; gap:6px;
  padding:12px 18px;
  font-size:0.82rem; font-weight:600;
  letter-spacing:0.01em;
  color:var(--text-secondary);
  text-decoration:none;
  border-bottom:2px solid transparent;
  white-space:nowrap;
  transition:color 0.2s, border-color 0.2s;
}
.cnav-pill:hover  { color:var(--text-primary); }
.cnav-pill.retro:hover,  .cnav-pill.retro.active  { color:var(--amber);  border-color:var(--amber); }
.cnav-pill.modern:hover, .cnav-pill.modern.active { color:var(--cyan);   border-color:var(--cyan); }
.cnav-pill.vhs:hover,    .cnav-pill.vhs.active    { color:var(--amber);  border-color:var(--amber); }
.cnav-pill.perfume:hover,.cnav-pill.perfume.active { color:var(--purple); border-color:var(--purple); }

/* ═══════════════════════════════════════
   APPLE-LIKE DESIGN REFINEMENTS
   — clean typography, generous space,
     no gratuitous borders or patterns
   ═══════════════════════════════════════ */

/* --- Section banners: flat, type-first --- */
.section-banner {
  background: var(--bg-secondary);
  border-bottom:1px solid var(--border);
}
.section-banner::before { display:none; }  /* remove grid pattern */
.section-banner::after  { display:none; }  /* remove glow gradient */
.section-banner h2 {
  font-size:clamp(2rem, 5.5vw, 3.8rem);
  font-weight:700;
  letter-spacing:-0.03em;
  text-shadow:none;
}
.section-banner p {
  font-size:clamp(0.9rem, 1.8vw, 1.05rem);
  color:var(--text-secondary);
  margin-top:14px;
}
.section-banner-accent {
  height:2px;
  width:48px;
  margin:16px auto 0;
  border-radius:2px;
}

/* --- Stats: bigger, bolder --- */
.stats-bar { border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.stat-item .stat-number { font-size:clamp(2.6rem,4.5vw,4rem); }
.stat-item .stat-label  { font-size:0.77rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-muted); }

/* --- Product cards: cleaner --- */
.product-card {
  border-radius:16px;
  border-color:rgba(255,255,255,0.04);
}
.product-card:hover { transform:translateY(-5px); box-shadow:0 24px 64px rgba(0,0,0,0.35); }
.product-card.retro:hover  { border-color:rgba(240,165,0,0.25); box-shadow:0 24px 64px rgba(240,165,0,0.08); }
.product-card.modern:hover { border-color:rgba(0,212,255,0.25); box-shadow:0 24px 64px rgba(0,212,255,0.08); }
.product-card.perfume:hover{ border-color:rgba(124,109,240,0.25); }
.product-info h4 { font-size:1.05rem; font-weight:700; letter-spacing:-0.01em; }
.product-desc    { font-size:0.83rem; line-height:1.65; }
.price-label     { font-size:0.64rem; letter-spacing:0.14em; }

/* --- Testimonials: card-first, no emoji avatar hack --- */
.testimonials-grid { gap:24px; }
.testimonial-card {
  padding:36px 32px;
  border-radius:18px;
  border-color:rgba(255,255,255,0.05);
  background:var(--bg-card);
  transition:var(--transition);
}
.testimonial-card:hover { transform:translateY(-3px); box-shadow:0 16px 48px rgba(0,0,0,0.28); border-color:var(--border-hover); }
.testimonial-stars { font-size:0.95rem; letter-spacing:3px; margin-bottom:20px; }
.testimonial-text {
  font-size:0.97rem;
  line-height:1.75;
  font-style:normal;
  color:var(--text-primary);
  opacity:0.88;
  margin-bottom:24px;
  font-weight:400;
}
.testimonial-avatar {
  width:40px; height:40px;
  border-radius:50%;
  background:var(--bg-secondary);
  border:1px solid var(--border-hover);
  font-size:0.88rem;
  letter-spacing:0.02em;
  display:flex; align-items:center; justify-content:center;
  color:var(--text-secondary);
}
.testimonial-avatar-initials {
  background:var(--bg-card);
  border-color:var(--border-hover);
  color:var(--amber);
  font-family:var(--font-mono);
  font-size:0.7rem;
  font-weight:700;
  letter-spacing:0.04em;
}
.testimonial-name     { font-size:0.88rem; font-weight:700; letter-spacing:-0.01em; }
.testimonial-location { font-size:0.68rem; letter-spacing:0.06em; color:var(--text-muted); margin-top:2px; }

/* --- FAQ: cleaner separator lines --- */
.faq-question { font-size:0.98rem; font-weight:600; }
.faq-answer p { font-size:0.88rem; line-height:1.9; color:var(--text-secondary); }

/* --- Section labels: lighter, wider-tracked --- */
.section-label {
  font-size:0.67rem;
  letter-spacing:0.22em;
  font-weight:600;
  opacity:0.7;
}

/* --- Diff cards: left-accent style --- */
.diff-grid { gap:14px; }
.diff-card {
  border-radius:14px;
  padding:28px 24px;
  border-left:3px solid transparent;
  transition:var(--transition);
}
.diff-card:nth-child(1) { border-left-color:var(--amber); }
.diff-card:nth-child(2) { border-left-color:var(--cyan); }
.diff-card:nth-child(3) { border-left-color:var(--amber); }
.diff-card:nth-child(4) { border-left-color:#25d366; }
.diff-card:nth-child(5) { border-left-color:var(--amber); }
.diff-card:nth-child(6) { border-left-color:var(--cyan); }
.diff-card h4 { font-size:0.96rem; font-weight:700; margin-bottom:8px; letter-spacing:-0.01em; }
.diff-card p  { font-size:0.86rem; line-height:1.7; }
/* hide pseudo-element top line in favour of left border */
.diff-card::before { display:none; }

/* --- Responsive nav pill tweaks --- */
@media (max-width:768px) {
  .catalog-nav { top:56px; }
  .cnav-pill { padding:10px 14px; font-size:0.78rem; }
  .section-banner h2 { font-size:clamp(1.7rem,8vw,2.6rem); }
  .testimonials-grid { grid-template-columns:1fr; gap:14px; }
  .testimonial-card { padding:28px 22px; }
  .stats-grid { grid-template-columns:repeat(3,1fr); gap:16px; }
  .stat-item .stat-number { font-size:clamp(2rem,8vw,2.8rem); }
}

/* ═══════════════════════════════════════
   CATÁLOGO COMPLETO — filter + compact grid
   ═══════════════════════════════════════ */
.catalog-filter {
  display:flex; flex-wrap:wrap; gap:8px;
  margin-bottom:30px;
}
.cf-pill {
  padding:9px 16px;
  border-radius:100px;
  border:1px solid var(--border-hover);
  background:var(--bg-card);
  color:var(--text-secondary);
  font-family:var(--font-body);
  font-size:0.8rem; font-weight:600;
  letter-spacing:0.01em;
  cursor:pointer;
  transition:var(--transition);
}
.cf-pill:hover { color:var(--text-primary); border-color:var(--text-muted); transform:translateY(-1px); }
.cf-pill.active { background:var(--red); border-color:var(--red); color:#fff; }

.catalog-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));
  gap:14px;
}
.cat-card {
  aspect-ratio:auto;
  cursor:pointer;
}
.cat-card .product-photo {
  position:static;
  width:100%; height:auto;
  aspect-ratio:1/1;
  overflow:hidden;
}
.cat-card .product-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.cat-card .product-info {
  position:static;
  padding:13px 14px 14px;
  background:none;
}
.cat-card .product-info h4 {
  font-size:0.9rem;
  font-weight:700;
  letter-spacing:-0.01em;
  margin-bottom:10px;
  line-height:1.3;
  min-height:2.34em; /* two lines — keeps buttons aligned across the row */
  display:flex; align-items:flex-end;
}
.cat-card .product-badge { top:10px; left:10px; font-size:0.55rem; padding:3px 10px; }
.cat-card .product-expand { top:10px; right:48px; width:30px; height:30px; font-size:0.8rem; }
.cat-card .product-list-btn { top:10px; right:10px; width:30px; height:30px; font-size:1.05rem; border-radius:8px; }
.cat-card .product-footer { gap:0; }
.cat-card .product-footer .btn-consult {
  width:100%;
  justify-content:center; text-align:center;
  background:var(--bg-secondary);
  border:1px solid var(--border-hover);
  color:var(--text-primary);
}
.cat-card:hover .product-footer .btn-consult,
.cat-card .product-footer .btn-consult:hover {
  background:var(--red); border-color:var(--red); color:#fff;
}

@media (max-width:640px) {
  .catalog-grid { grid-template-columns:repeat(2, 1fr); gap:10px; }
  .cat-card .product-info { padding:11px 12px 12px; }
  .cat-card .product-info h4 { font-size:0.8rem; }
  .catalog-filter { gap:6px; }
  .cf-pill { padding:8px 13px; font-size:0.74rem; }
}

/* ═══════════════════════════════════════
   LOCATION — real storefront photo
   ═══════════════════════════════════════ */
.location-photo {
  position:relative;
  width:100%; aspect-ratio:16/10;
  border-radius:var(--radius-md);
  overflow:hidden;
  border:1px solid var(--border);
  cursor:pointer;
}
.location-photo img {
  width:100%; height:100%;
  object-fit:cover;
  transition:transform 0.7s ease;
}
.location-photo:hover img { transform:scale(1.04); }
.location-photo-tag {
  position:absolute; bottom:14px; left:14px;
  display:inline-flex; align-items:center; gap:6px;
  padding:7px 14px;
  background:rgba(5,5,8,0.78);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  border:1px solid var(--border-hover);
  border-radius:100px;
  font-size:0.72rem; font-weight:600;
  color:var(--text-primary);
  letter-spacing:0.02em;
  pointer-events:none;
}

/* ═══════════════════════════════════════
   CATALOG TOOLS — search + filters + count
   ═══════════════════════════════════════ */
.catalog-tools {
  position:sticky; top:104px; z-index:80;
  padding:16px 0 12px;
  margin-bottom:18px;
  background:linear-gradient(to bottom, var(--bg-secondary) 78%, transparent);
}
.catalog-search {
  position:relative;
  max-width:440px;
  margin-bottom:14px;
}
.catalog-search .cs-icon {
  position:absolute; left:15px; top:50%; transform:translateY(-50%);
  font-size:0.85rem; opacity:0.5; pointer-events:none;
}
#catalog-search {
  width:100%;
  padding:12px 40px 12px 40px;
  border-radius:100px;
  border:1px solid var(--border-hover);
  background:var(--bg-card);
  color:var(--text-primary);
  font-family:var(--font-body);
  font-size:0.88rem;
  transition:var(--transition);
  -webkit-appearance:none; appearance:none;
}
#catalog-search::placeholder { color:var(--text-muted); }
#catalog-search::-webkit-search-cancel-button { display:none; }
#catalog-search:focus {
  outline:none;
  border-color:var(--red);
  box-shadow:0 0 0 3px var(--red-glow);
}
.cs-clear {
  position:absolute; right:8px; top:50%; transform:translateY(-50%);
  width:28px; height:28px;
  border:none; border-radius:50%;
  background:var(--bg-secondary);
  color:var(--text-secondary);
  font-size:1.1rem; line-height:1;
  cursor:pointer;
  transition:var(--transition);
}
.cs-clear:hover { background:var(--red); color:#fff; }
.catalog-filter { margin-bottom:0; }
.catalog-count {
  margin-top:12px;
  font-family:var(--font-mono);
  font-size:0.7rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--text-muted);
}
.catalog-empty {
  padding:52px 20px;
  text-align:center;
  color:var(--text-secondary);
  font-size:0.92rem;
}

@media (max-width:768px) {
  .catalog-tools { top:96px; padding:12px 0 10px; }
  .catalog-search { max-width:none; margin-bottom:11px; }
  #catalog-search { padding:11px 38px; font-size:0.85rem; }
}
@media (prefers-reduced-motion:reduce) {
  .catalog-tools { position:static; }
}

/* ═══════════════════════════════════════
   CLEAN 90s — menos ruído, mais respiro.
   Mantém: paleta VHS, tipo mono, REC,
   scanlines da intro. Remove: excesso.
   ═══════════════════════════════════════ */

/* Grão de filme quase imperceptível */
body::before { opacity:0.012 !important; }

/* Glitch só como tempero, bem raro */
.glitch-text { animation:glitch-rgb 26s infinite; }

/* Mais respiro entre blocos */
:root { --section-padding: clamp(72px,10vw,132px); }

/* Banners de seção: mais leves e baixos */
.section-banner {
  height:auto;
  min-height:0;
  padding:clamp(56px,8vw,92px) 0 clamp(30px,4vw,44px);
  margin-bottom:0;
  background:transparent;
  border-bottom:none;
}
.section-banner-content { padding:0 clamp(16px,4vw,48px); }
.section-banner h2 { font-size:clamp(1.9rem,4.6vw,3rem); letter-spacing:-0.028em; }
.section-banner p  { font-size:clamp(0.88rem,1.6vw,1rem); color:var(--text-muted); max-width:52ch; }
.section-banner-accent { width:40px; height:2px; margin-top:18px; }

/* Divisores: linha fina em vez de barra colorida */
.section-divider {
  height:1px;
  background:var(--border);
  opacity:0.7;
  margin:0 auto;
  max-width:var(--max-width);
}
.section-divider.cyan, .section-divider.amber { background:var(--border); }

/* Cards: borda limpa, sombra discreta, sem halo colorido */
.product-card { border-radius:14px; border-color:rgba(255,255,255,0.05); }
.product-card:hover {
  transform:translateY(-3px);
  border-color:rgba(255,255,255,0.14);
  box-shadow:0 14px 34px rgba(0,0,0,0.4);
}
.product-card.retro:hover,
.product-card.modern:hover,
.product-card.perfume:hover {
  border-color:rgba(255,255,255,0.14);
  box-shadow:0 14px 34px rgba(0,0,0,0.4);
}
/* sem o flash de glitch na foto ao passar o mouse */
.product-card:hover .product-photo::after { display:none; }
.product-card:hover .product-photo img { transform:scale(1.03); }

/* Badges discretos e uniformes */
.product-badge {
  background:rgba(0,0,0,0.62) !important;
  border:1px solid rgba(255,255,255,0.14) !important;
  color:var(--text-secondary) !important;
  font-weight:600;
  letter-spacing:0.09em;
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
}

/* Barra de categorias mais sóbria */
.catalog-nav { background:rgba(5,5,8,0.9); }
.cnav-pill { font-weight:500; }

/* Filtros: pílula ativa sólida, resto neutro */
.cf-pill { background:transparent; border-color:var(--border); }
.cf-pill:hover { background:var(--bg-card); }
.cf-pill.active { background:var(--text-primary); border-color:var(--text-primary); color:var(--bg-primary); }

/* Progresso de leitura mais fino */
#scroll-progress { height:2px; }
#scroll-progress span { opacity:0.55; }

/* VHS: painel sem gradiente pesado */
.vhs-banner-bg { opacity:0.35; }

/* Rodapé enxuto */
.footer { padding-top:clamp(48px,6vw,72px); }
