/* ── TARANTULA WRAP v2.0 — MAIN STYLES ── */
:root {
  --green: #7FFF00;
  --black: #0a0a0a;
  --dark:  #111111;
  --card-bg: #161616;
  --text:  #f0f0f0;
  --muted: #888888;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }

body.tw-body {
  background: var(--black);
  color: var(--text);
  font-family: 'Barlow Condensed', sans-serif;
  overflow-x: hidden;
  cursor: crosshair;
}
body.tw-body::before {
  content:'';
  position:fixed;
  inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  pointer-events:none;
  z-index:9999;
  opacity:0.35;
}

/* ── AGE GATE ── */
.tw-age-gate { position:fixed; inset:0; background:rgba(0,0,0,0.97); z-index:10000; display:flex; align-items:center; justify-content:center; flex-direction:column; text-align:center; padding:2rem; gap:1.25rem; }
.age-gate-logo { font-family:'Bebas Neue',sans-serif; font-size:3rem; color:var(--green); letter-spacing:4px; }
.age-gate-title { font-family:'Bebas Neue',sans-serif; font-size:clamp(2rem,6vw,4rem); color:#fff; }
.age-gate-sub { font-size:0.9rem; color:var(--muted); letter-spacing:2px; text-transform:uppercase; }
.age-gate-btns { display:flex; gap:1rem; flex-wrap:wrap; justify-content:center; }
.age-btn { font-family:'Barlow Condensed',sans-serif; font-size:1rem; font-weight:900; letter-spacing:3px; text-transform:uppercase; padding:1rem 2.5rem; border:none; cursor:pointer; clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%); transition:all 0.2s; }
.age-btn.yes { background:var(--green); color:#000; }
.age-btn.yes:hover { background:#fff; }
.age-btn.no { background:rgba(255,255,255,0.08); color:var(--muted); border:1px solid rgba(255,255,255,0.15); }
.age-gate-disclaimer { font-size:0.65rem; color:#333; letter-spacing:1px; max-width:400px; line-height:1.6; }

/* ── NAV ── */
.tw-nav { position:fixed; top:0; left:0; right:0; z-index:100; display:flex; align-items:center; justify-content:space-between; padding:0 4vw; height:70px; background:rgba(10,10,10,0.88); backdrop-filter:blur(12px); border-bottom:1px solid rgba(127,255,0,0.15); }
.nav-logo { font-family:'Bebas Neue',sans-serif; font-size:1.8rem; color:var(--green); letter-spacing:3px; text-decoration:none; cursor:pointer; }
.nav-logo span { color:#fff; }
.nav-links { display:flex; gap:2rem; list-style:none; }
.nav-links a { color:var(--muted); text-decoration:none; font-size:0.95rem; font-weight:600; letter-spacing:2px; text-transform:uppercase; transition:color 0.2s; cursor:pointer; }
.nav-links a:hover { color:var(--green); }
.tw-hamburger { display:none; background:none; border:1px solid rgba(127,255,0,0.3); color:var(--green); font-size:1.2rem; padding:0.3rem 0.7rem; cursor:pointer; }

/* ── PAGES ── */
#tw-app { min-height:100vh; }
.tw-page { display:none; min-height:100vh; }
.tw-page.active { display:block; }

/* ── HERO ── */
.tw-hero { min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:100px 5vw 60px; position:relative; overflow:hidden; }
.hero-bg { position:absolute; inset:0; background:radial-gradient(ellipse 70% 60% at 50% 40%,rgba(127,255,0,0.07) 0%,transparent 70%),radial-gradient(ellipse 40% 40% at 20% 80%,rgba(127,255,0,0.04) 0%,transparent 60%); }
.web-lines { position:absolute; inset:0; opacity:0.06; pointer-events:none; }
.hero-eyebrow { font-size:0.8rem; font-weight:700; letter-spacing:6px; text-transform:uppercase; color:var(--green); margin-bottom:1.5rem; animation:fadeUp 0.8s ease both; }
.hero-title { font-family:'Bebas Neue',sans-serif; font-size:clamp(5rem,14vw,13rem); line-height:0.88; letter-spacing:2px; color:#fff; text-shadow:0 0 60px rgba(127,255,0,0.2),0 4px 0 rgba(0,0,0,0.8); animation:fadeUp 0.8s 0.1s ease both; position:relative; z-index:1; display:flex; flex-direction:column; }
.hero-title .accent { color:var(--green); }
.hero-sub { font-size:clamp(1rem,2.5vw,1.4rem); font-weight:300; letter-spacing:3px; text-transform:uppercase; color:var(--muted); margin:1.5rem 0 3rem; animation:fadeUp 0.8s 0.2s ease both; }
.hero-btns { display:flex; gap:1rem; flex-wrap:wrap; justify-content:center; animation:fadeUp 0.8s 0.3s ease both; }
.hero-cta { display:inline-flex; align-items:center; gap:0.75rem; background:var(--green); color:#000; font-family:'Barlow Condensed',sans-serif; font-size:1rem; font-weight:900; letter-spacing:3px; text-transform:uppercase; padding:1rem 2.5rem; border:none; cursor:pointer; clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%); transition:background 0.2s,transform 0.2s; }
.hero-cta:hover { background:#fff; transform:scale(1.04); }
.hero-cta-alt { background:transparent; color:var(--green); border:2px solid var(--green); clip-path:none; }
.hero-cta-alt:hover { background:var(--green); color:#000; }

/* ── TICKER ── */
.tw-ticker-wrap { overflow:hidden; background:var(--green); padding:0.6rem 0; border-top:2px solid #000; border-bottom:2px solid #000; }
.tw-ticker { display:flex; animation:ticker 22s linear infinite; white-space:nowrap; }
.ticker-item { font-family:'Bebas Neue',sans-serif; font-size:1rem; letter-spacing:3px; color:#000; padding:0 2rem; display:inline-flex; align-items:center; gap:1rem; }
.ticker-dot { width:6px; height:6px; background:#000; border-radius:50%; display:inline-block; flex-shrink:0; }

/* ── SECTIONS ── */
.section-label { text-align:center; font-size:0.75rem; font-weight:700; letter-spacing:6px; text-transform:uppercase; color:var(--green); margin-bottom:0.75rem; }
.section-title { text-align:center; font-family:'Bebas Neue',sans-serif; font-size:clamp(2.5rem,6vw,5rem); line-height:1; color:#fff; margin-bottom:3.5rem; }
.tw-products-section { padding:4rem 5vw 6rem; }

/* ── PRODUCTS GRID ── */
.tw-products-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:2px; max-width:1400px; margin:0 auto; }

.product-card { background:var(--card-bg); position:relative; overflow:hidden; cursor:pointer; transition:transform 0.3s; }
.product-card::before { content:''; position:absolute; inset:0; background:linear-gradient(135deg,rgba(255,255,255,0.03) 0%,transparent 50%); z-index:1; pointer-events:none; }
.product-card:hover { transform:scale(1.02); z-index:2; }
.product-card-accent { position:absolute; top:0; left:0; right:0; height:3px; z-index:3; }

.card-img-wrap { position:relative; height:340px; display:flex; align-items:center; justify-content:center; overflow:hidden; background:#0d0d0d; }
.card-img-wrap img { height:85%; width:auto; object-fit:contain; transition:transform 0.5s cubic-bezier(0.25,0.46,0.45,0.94); filter:drop-shadow(0 20px 40px rgba(0,0,0,0.6)); display:block; }
.product-card:hover .card-img-wrap img { transform:translateY(-8px) scale(1.06); }
.card-emoji-fallback { font-size:5rem; line-height:1; display:flex; align-items:center; justify-content:center; height:85%; }
.card-glow { position:absolute; bottom:-20px; left:50%; transform:translateX(-50%); width:60%; height:60px; border-radius:50%; filter:blur(20px); opacity:0; transition:opacity 0.4s; }
.product-card:hover .card-glow { opacity:0.4; }

.card-body { padding:1.5rem 1.5rem 2rem; position:relative; z-index:2; }
.card-flavor-tag { display:inline-block; font-size:0.7rem; font-weight:700; letter-spacing:4px; text-transform:uppercase; padding:0.3rem 0.8rem; margin-bottom:0.75rem; clip-path:polygon(4px 0%,100% 0%,calc(100% - 4px) 100%,0% 100%); }
.card-name { font-family:'Bebas Neue',sans-serif; font-size:2.4rem; letter-spacing:1px; color:#fff; line-height:1; margin-bottom:0.5rem; }
.card-desc { font-size:0.9rem; color:var(--muted); letter-spacing:1px; line-height:1.5; margin-bottom:1.25rem; font-weight:300; }
.card-cta { display:inline-flex; align-items:center; gap:0.5rem; font-family:'Barlow Condensed',sans-serif; font-size:0.8rem; font-weight:700; letter-spacing:3px; text-transform:uppercase; background:none; border:1px solid rgba(255,255,255,0.15); color:var(--text); padding:0.6rem 1.2rem; cursor:pointer; transition:all 0.2s; }
.card-cta:hover { border-color:var(--green); color:var(--green); }
.card-cta .arrow { transition:transform 0.2s; }
.card-cta:hover .arrow { transform:translateX(4px); }

/* ── FEATURES ── */
.tw-features-section { padding:4rem 5vw 5rem; background:var(--dark); border-top:1px solid rgba(127,255,0,0.08); }
.tw-features-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:2rem; max-width:1400px; margin:0 auto; border-top:1px solid rgba(127,255,0,0.1); border-bottom:1px solid rgba(127,255,0,0.1); padding:3rem 0; }
.feature-item { text-align:center; }
.feature-icon { font-size:2rem; margin-bottom:0.75rem; display:block; }
.feature-title { font-family:'Bebas Neue',sans-serif; font-size:1.3rem; letter-spacing:2px; color:var(--green); margin-bottom:0.35rem; }
.feature-text { font-size:0.85rem; color:var(--muted); letter-spacing:1px; font-weight:300; line-height:1.5; }

/* ── FLAVOR NAV ── */
.flavor-nav { display:flex; gap:0.5rem; flex-wrap:wrap; padding:1rem 5vw; background:rgba(10,10,10,0.6); border-bottom:1px solid rgba(255,255,255,0.06); position:sticky; top:70px; z-index:50; backdrop-filter:blur(12px); }
.flavor-nav-label { font-size:0.7rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--muted); align-self:center; margin-right:0.5rem; }
.flavor-btn { font-family:'Barlow Condensed',sans-serif; font-size:0.75rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; padding:0.4rem 1rem; background:none; border:1px solid rgba(255,255,255,0.1); color:var(--muted); cursor:pointer; transition:all 0.2s; clip-path:polygon(4px 0%,100% 0%,calc(100% - 4px) 100%,0% 100%); }
.flavor-btn:hover { border-color:currentColor; color:inherit; }

/* ── DETAIL PAGE ── */
.tw-product-detail { padding:120px 5vw 6rem; }
.back-btn { display:inline-flex; align-items:center; gap:0.5rem; font-family:'Barlow Condensed',sans-serif; font-size:0.8rem; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--muted); background:none; border:none; cursor:pointer; margin-bottom:3rem; transition:color 0.2s; padding:0; }
.back-btn:hover { color:var(--green); }
.detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:6rem; max-width:1200px; margin:0 auto; align-items:center; }
.detail-img-wrap { position:relative; display:flex; align-items:center; justify-content:center; min-height:400px; }
.detail-img-bg { position:absolute; inset:-20%; border-radius:50%; filter:blur(60px); opacity:0.15; }
.detail-img-wrap img { position:relative; z-index:1; width:100%; max-width:420px; height:auto; object-fit:contain; filter:drop-shadow(0 30px 60px rgba(0,0,0,0.7)); animation:float 4s ease-in-out infinite; display:block; }
.detail-emoji-fallback { font-size:10rem; text-align:center; position:relative; z-index:1; animation:float 4s ease-in-out infinite; }
.detail-eyebrow { font-size:0.75rem; font-weight:700; letter-spacing:5px; text-transform:uppercase; margin-bottom:0.75rem; }
.detail-title { font-family:'Bebas Neue',sans-serif; font-size:clamp(3.5rem,7vw,6.5rem); line-height:0.9; color:#fff; margin-bottom:0.5rem; }
.detail-subtitle { font-family:'Bebas Neue',sans-serif; font-size:clamp(1.5rem,3vw,2.5rem); margin-bottom:2rem; }
.detail-desc { font-size:1rem; line-height:1.7; color:#aaa; font-weight:300; letter-spacing:0.5px; margin-bottom:2.5rem; max-width:480px; }
.detail-desc p { margin-bottom:0.75rem; }
.detail-specs { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(255,255,255,0.05); margin-bottom:2.5rem; }
.spec-item { background:var(--card-bg); padding:1rem 1.25rem; }
.spec-label { font-size:0.65rem; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--muted); margin-bottom:0.25rem; }
.spec-value { font-family:'Bebas Neue',sans-serif; font-size:1.2rem; letter-spacing:1px; color:#fff; }
.detail-badges { display:flex; flex-wrap:wrap; gap:0.75rem; margin-bottom:2.5rem; }
.badge { display:inline-flex; align-items:center; gap:0.4rem; font-size:0.75rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; padding:0.5rem 1rem; background:rgba(127,255,0,0.08); border:1px solid rgba(127,255,0,0.2); color:var(--green); clip-path:polygon(6px 0%,100% 0%,calc(100% - 6px) 100%,0% 100%); }

/* ── GIVEAWAY TEASER ── */
.tw-giveaway-teaser { background:var(--dark); padding:5rem 5vw; border-top:1px solid rgba(127,255,0,0.08); }
.giveaway-teaser-inner { max-width:1100px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center; }
.giveaway-teaser-steps { display:flex; flex-direction:column; gap:1.5rem; }
.giveaway-step { display:flex; align-items:flex-start; gap:1.25rem; }
.step-num { font-family:'Bebas Neue',sans-serif; font-size:2.5rem; color:var(--green); line-height:1; flex-shrink:0; opacity:0.5; }
.step-text { display:flex; flex-direction:column; gap:0.25rem; }
.step-text strong { font-size:1rem; font-weight:700; letter-spacing:1px; color:#fff; }
.step-text span { font-size:0.85rem; color:var(--muted); letter-spacing:0.5px; }

/* ── GIVEAWAY PAGE ── */
.tw-giveaway-page { padding-top:70px; }
.giveaway-hero { text-align:center; padding:5rem 5vw 3rem; background:radial-gradient(ellipse 60% 50% at 50% 0%,rgba(127,255,0,0.06) 0%,transparent 70%); }
.giveaway-title { font-family:'Bebas Neue',sans-serif; font-size:clamp(4rem,12vw,10rem); line-height:0.9; color:#fff; margin-bottom:1.5rem; }
.giveaway-title .accent { color:var(--green); display:block; }
.giveaway-subtitle { font-size:clamp(0.95rem,2vw,1.1rem); color:var(--muted); letter-spacing:1px; line-height:1.7; max-width:620px; margin:0 auto; font-weight:300; }
.giveaway-how { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; padding:0 5vw; max-width:1100px; margin:3rem auto; }
.how-step { background:var(--card-bg); padding:2rem 1.5rem; }
.how-num { font-family:'Bebas Neue',sans-serif; font-size:3rem; color:var(--green); opacity:0.4; line-height:1; margin-bottom:0.75rem; }
.how-step h3 { font-family:'Bebas Neue',sans-serif; font-size:1.5rem; letter-spacing:2px; color:#fff; margin-bottom:0.5rem; }
.how-step p { font-size:0.85rem; color:var(--muted); line-height:1.6; letter-spacing:0.5px; font-weight:300; }
.giveaway-form-wrap { padding:3rem 5vw 6rem; display:flex; justify-content:center; }
.giveaway-form-card { background:var(--card-bg); border:1px solid rgba(127,255,0,0.12); padding:2.5rem; width:100%; max-width:580px; position:relative; }
.giveaway-form-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--green),#aaff44); }
.form-title { font-family:'Bebas Neue',sans-serif; font-size:2.2rem; letter-spacing:2px; color:#fff; margin-bottom:0.4rem; }
.form-subtitle { font-size:0.8rem; color:var(--muted); letter-spacing:2px; text-transform:uppercase; margin-bottom:2rem; }
.gf-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.gf-group { display:flex; flex-direction:column; gap:0.4rem; margin-bottom:1.25rem; }
.gf-label { font-size:0.7rem; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--muted); }
.gf-optional { color:#555; font-size:0.65rem; letter-spacing:1px; }
.req { color:var(--green); }
.gf-input { background:#0d0d0d; border:1px solid rgba(255,255,255,0.08); color:#fff; font-family:'Barlow Condensed',sans-serif; font-size:1rem; letter-spacing:1px; padding:0.8rem 1rem; outline:none; transition:border-color 0.2s; width:100%; }
.gf-input:focus { border-color:var(--green); }
.gf-input::placeholder { color:#333; }
.gf-hint { font-size:0.7rem; color:#555; letter-spacing:0.5px; margin-top:0.25rem; }
.gf-checkbox { display:flex; align-items:flex-start; gap:0.75rem; cursor:pointer; margin-bottom:1.5rem; font-size:0.85rem; color:var(--muted); letter-spacing:0.5px; line-height:1.5; }
.gf-checkbox input { flex-shrink:0; accent-color:var(--green); width:16px; height:16px; margin-top:2px; cursor:pointer; }
.gf-submit { width:100%; background:var(--green); color:#000; font-family:'Barlow Condensed',sans-serif; font-size:1rem; font-weight:900; letter-spacing:3px; text-transform:uppercase; padding:1rem; border:none; cursor:pointer; clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%); transition:all 0.2s; }
.gf-submit:hover { background:#fff; }
.gf-submit:disabled { background:#333; color:#666; cursor:not-allowed; clip-path:none; }
.form-error { background:rgba(232,41,77,0.1); border:1px solid rgba(232,41,77,0.3); color:#e8294d; font-size:0.8rem; letter-spacing:1px; padding:0.75rem 1rem; margin-bottom:1rem; }
.form-success { text-align:center; padding:2rem 1rem; }
.form-success h3 { font-family:'Bebas Neue',sans-serif; font-size:2.5rem; color:var(--green); letter-spacing:3px; margin-bottom:0.75rem; }
.form-success p { color:var(--muted); font-size:0.95rem; letter-spacing:1px; line-height:1.6; }

/* ── FOOTER ── */
.tw-footer { background:var(--dark); border-top:1px solid rgba(255,255,255,0.06); padding:4rem 5vw 2rem; text-align:center; }
.footer-logo { font-family:'Bebas Neue',sans-serif; font-size:3rem; color:var(--green); letter-spacing:4px; margin-bottom:0.5rem; }
.footer-tagline { font-size:0.75rem; letter-spacing:4px; text-transform:uppercase; color:var(--muted); margin-bottom:2rem; }
.footer-disclaimer { font-size:0.7rem; color:#444; letter-spacing:0.5px; line-height:1.6; max-width:600px; margin:0 auto 1rem; }
.footer-bottom { font-size:0.7rem; color:#333; letter-spacing:2px; text-transform:uppercase; border-top:1px solid rgba(255,255,255,0.04); padding-top:1.5rem; margin-top:2rem; }

/* ── ANIMATIONS ── */
@keyframes fadeUp { from { opacity:0; transform:translateY(30px); } to { opacity:1; transform:translateY(0); } }
@keyframes float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-12px); } }
@keyframes ticker { from { transform:translateX(0); } to { transform:translateX(-50%); } }

/* ── RESPONSIVE ── */
@media (max-width:768px) {
  .tw-hamburger { display:block; }
  .nav-links { display:none; position:absolute; top:70px; left:0; right:0; background:rgba(10,10,10,0.97); flex-direction:column; padding:1rem 2rem; gap:1rem; border-bottom:1px solid rgba(127,255,0,0.15); }
  .nav-links.open { display:flex; }
  .detail-grid { grid-template-columns:1fr; gap:3rem; }
  .giveaway-teaser-inner { grid-template-columns:1fr; gap:3rem; }
  .giveaway-how { grid-template-columns:1fr; }
  .gf-row { grid-template-columns:1fr; }
  .tw-product-detail { padding:100px 5vw 4rem; }
}