/* BuzzCraft Media - Updated UI Styles */
:root{
  --bg:#020617;
  --surface:#0b1222;
  --card:rgba(15,23,42,.70);
  --border:rgba(255,255,255,.10);
  --text:#cbd5e1;
  --muted:#94a3b8;
  --white:#ffffff;
  --accent:#f97316;
  --accent2:#ffb44c;
  --shadow: 0 18px 40px rgba(0,0,0,.45);
  --radius: 18px;
  --radius-lg: 26px;
  --container: 1120px;
}
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; overflow-x:hidden; width:100%; height:100%; background:var(--bg); }
body{ margin:0; font-family: Inter, system-ui, -apple-system, Segoe UI, sans-serif; color:var(--text); background:var(--bg); min-height:100%; overflow-x:hidden; width:100%; -webkit-text-size-adjust:100%; }
img, svg, video, canvas{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
strong{ color:#e8eefc; font-weight:700; }
em{ font-style:normal; color:var(--accent); }
.container{ width: min(100% - 32px, var(--container)); margin-inline:auto; }
.center{ text-align:center; }

.site-header{ position:sticky; top:0; z-index:60; backdrop-filter: blur(12px); background: rgba(2,6,23,.78); border-bottom: 1px solid rgba(255,255,255,.06); }
.header-inner{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding: 14px 0; }
.brand{ display:flex; align-items:center; gap:10px; min-width:0; }
.brand img{ width:44px; height:44px; object-fit:contain; }
.brand-text{ display:none; font-weight:800; letter-spacing:-.02em; font-size: 18px; color:var(--white); white-space:nowrap; }
@media (min-width: 520px){ .brand-text{ display:inline; } }
.nav-desktop{ display:none; align-items:center; gap:18px; }
.nav-desktop a{ font-weight:600; font-size:14px; color:rgba(255,255,255,.80); padding:10px 8px; border-radius:12px; transition: color .2s ease, background .2s ease, transform .2s ease; }
.nav-desktop a:hover{ color:var(--white); background: rgba(255,255,255,.05); transform: translateY(-1px); }
@media (min-width: 920px){ .nav-desktop{ display:flex; } }
.nav-toggle{ width:44px; height:44px; border-radius:14px; background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10); display:grid; place-items:center; gap:6px; padding:10px; cursor:pointer; transition: transform .2s ease, border-color .2s ease; }
.nav-toggle:hover{ transform: translateY(-1px); border-color: rgba(249,115,22,.35); }
.nav-toggle span{ width:18px; height:2px; background: rgba(255,255,255,.85); border-radius:99px; }
@media (min-width: 920px){ .nav-toggle{ display:none; } }
.nav-mobile{ border-top: 1px solid rgba(255,255,255,.06); background: rgba(11,18,34,.98); padding: 12px 16px 16px; }
.nav-mobile a{ display:block; padding: 14px 12px; font-weight:700; color: rgba(255,255,255,.88); border-radius:14px; }
.nav-mobile a:hover{ background: rgba(255,255,255,.05); }
.nav-mobile .btn{ margin-top:8px; }

.btn{ appearance:none; border:none; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:10px; font-weight:800; border-radius: 16px; padding: 12px 16px; line-height:1; text-align:center; width:auto; }
.btn-sm{ padding: 10px 14px; border-radius:14px; font-size:13px; }
.btn-lg{ padding: 14px 18px; border-radius: 18px; font-size:16px; }
.btn-primary{ background: linear-gradient(135deg, var(--accent), #ea580c); color:var(--white); border: 1px solid rgba(249,115,22,.25); }
.btn-ghost{ background: rgba(255,255,255,.06); color: var(--white); border: 1px solid rgba(255,255,255,.12); }
.btn-whatsapp{ background: #25D366; color:#06120a; border: 1px solid rgba(255,255,255,.10); }
.btn-full{ width:100%; }

.section{ padding: clamp(56px, 8vw, 92px) 0; position:relative; overflow-x: clip; }
.section-alt{ background: radial-gradient(900px 400px at 30% 0%, rgba(249,115,22,.10), transparent 60%), linear-gradient(to bottom, rgba(11,18,34,.80), rgba(2,6,23,1)); border-top: 1px solid rgba(255,255,255,.05); border-bottom: 1px solid rgba(255,255,255,.05); }
.h2{ font-size: clamp(26px, 4.6vw, 44px); letter-spacing: -.03em; color: var(--white); margin: 0 0 10px; }
.p{ margin: 0 auto 0; max-width: 58ch; color: var(--muted); font-size: 16px; line-height: 1.65; }
.tag{ display:inline-flex; padding: 6px 10px; border-radius: 999px; border: 1px solid rgba(249,115,22,.25); background: rgba(249,115,22,.10); color: rgba(255,190,140,.95); font-weight:800; font-size:12px; margin-bottom:10px; }

.hero{ padding: clamp(56px, 9vw, 92px) 0 34px; position:relative; overflow-x:clip; overflow-y:hidden; }
.hero-bg{ position:absolute; inset:0; background: radial-gradient(900px 520px at 20% 25%, rgba(249,115,22,.22), transparent 55%), radial-gradient(900px 520px at 80% 0%, rgba(130,200,255,.10), transparent 60%), linear-gradient(to bottom, rgba(2,6,23,.18), rgba(2,6,23,.82)), url('/assets/hero-bg.webp'); background-size:cover; background-position:center; filter:saturate(1.05); transform:scale(1.02); will-change:transform; }
.hero-bg::after{ content:""; position:absolute; inset:0; background: linear-gradient(180deg, rgba(2,6,23,.20), rgba(2,6,23,.55), rgba(2,6,23,.78)); pointer-events:none; }
.hero-inner{ position:relative; z-index:1; text-align:left; }
.pill{ display:inline-flex; align-items:center; gap:10px; padding: 8px 12px; border-radius: 999px; border: 1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.05); color: rgba(255,255,255,.80); font-weight:700; font-size:12px; }
.dot{ width:8px; height:8px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 6px rgba(249,115,22,.15); animation: pulse 2.4s ease-in-out infinite; }
@keyframes pulse{ 0%,100%{ transform: scale(1); opacity:1; } 50%{ transform: scale(1.12); opacity:.86; } }
.hero-title{ margin: 16px 0 12px; font-size: clamp(34px, 7vw, 64px); color: var(--white); letter-spacing: -.04em; line-height: 1.05; max-width: 16ch; }
.hero-sub{ max-width: 62ch; margin: 0 0 18px; color: rgba(203,213,225,.88); font-size: clamp(15px, 2.1vw, 18px); line-height: 1.65; }
.hero-cta{ display:flex; flex-wrap:wrap; gap:12px; margin: 18px 0 18px; }
.chip{ border: 1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.04); padding: 8px 10px; border-radius: 999px; color: rgba(255,255,255,.78); font-weight:700; font-size: 12px; white-space: nowrap;}
.hero-proof{ margin-top: 18px; display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:10px; }
.proof-card{ border: 1px solid rgba(255,255,255,.10); background: rgba(15,23,42,.55); backdrop-filter: blur(10px); border-radius: 18px; padding: 14px; box-shadow: 0 14px 30px rgba(0,0,0,.25); }
.proof-big{ font-weight:900; font-size: 18px; color:var(--white); }
.proof-small{ font-weight:700; font-size: 12px; color: rgba(203,213,225,.78); }

.grid-2{ display:grid; grid-template-columns: 1fr; gap: 22px; }
@media (min-width: 960px){ .grid-2{ grid-template-columns: 1.05fr .95fr; gap: 36px; align-items:center; } }
.cards-3{ margin-top: 28px; display:grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 900px){ .cards-3{ grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; } }
.card{ background: rgba(15,23,42,.60); border: 1px solid rgba(255,255,255,.09); backdrop-filter: blur(12px); border-radius: var(--radius); padding: 18px; box-shadow: 0 16px 36px rgba(0,0,0,.30); }
.card-highlight{ border: 1px solid rgba(249,115,22,.40); background: linear-gradient(180deg, rgba(249,115,22,.10), rgba(15,23,42,.70)); position:relative; }
.badge{ position:absolute; top:-12px; left: 16px; padding: 6px 10px; border-radius: 999px; background: var(--accent); color: #1a0903; font-weight:900; font-size: 12px; box-shadow: 0 18px 40px rgba(249,115,22,.25); }
.card-top h3{ margin: 0 0 8px; color: var(--white); font-size: 18px; letter-spacing: -.02em; }
.price{ display:flex; align-items:baseline; gap:6px; margin-bottom: 8px; }
.price span{ font-weight:900; color: var(--accent); font-size: 30px; letter-spacing:-.03em; }
.price small{ color: rgba(255,255,255,.60); font-weight:700; }
.card-top p{ margin: 0; color: rgba(203,213,225,.82); font-size: 14px; line-height: 1.6; }
.list{ margin: 14px 0 16px; padding: 0; list-style:none; display:grid; gap: 10px; color: rgba(203,213,225,.86); font-weight:600; font-size: 14px; }
.list li{ padding-left: 18px; position:relative; }
.list li::before{ content:"✓"; position:absolute; left:0; top:0; color: rgba(249,115,22,.95); font-weight:900; }
.note{ margin-top: 18px; padding: 14px 16px; border: 1px solid rgba(255,255,255,.08); border-radius: 16px; background: rgba(255,255,255,.03); color: rgba(203,213,225,.78); font-size: 13px; }

.compare{ margin-top: 16px; display:grid; gap: 12px; }
.compare-card{ border-radius: 18px; padding: 14px 14px 10px; border: 1px solid rgba(255,255,255,.09); background: rgba(255,255,255,.03); }
.compare-card h3{ margin:0 0 8px; color: var(--white); font-size: 15px; }
.compare-card ul{ margin:0; padding-left: 18px; color: rgba(203,213,225,.75); font-weight:600; font-size: 13px; line-height: 1.65; }
.compare-card.bad{ border-color: rgba(239,68,68,.18); background: rgba(239,68,68,.06); }
.compare-card.good{ border-color: rgba(34,197,94,.18); background: rgba(34,197,94,.06); }

.feature-grid{ display:grid; gap: 12px; }
.feature{ display:flex; align-items:flex-start; gap: 12px; padding: 14px; border-radius: 18px; border: 1px solid rgba(255,255,255,.08); background: rgba(15,23,42,.45); }
.icon{ width: 38px; height: 38px; border-radius: 14px; display:grid; place-items:center; background: rgba(249,115,22,.10); border: 1px solid rgba(249,115,22,.18); flex:0 0 auto; }
.feature-title{ color: var(--white); font-weight:900; margin-bottom: 3px; }
.feature-sub{ color: rgba(203,213,225,.74); font-weight:600; font-size: 13px; line-height: 1.55; }

.ai-grid{ margin-top: 22px; }
.ai-box{ border-radius: var(--radius-lg); border: 1px solid rgba(249,115,22,.22); background: rgba(15,23,42,.55); padding: 18px; }
.ai-box h3{ margin: 0 0 10px; color: var(--white); letter-spacing:-.02em; }
.ai-actions{ display:flex; flex-wrap:wrap; gap:10px; margin-top: 14px; }
.micro{ color: rgba(148,163,184,.85); font-size: 12px; line-height: 1.55; }
.micro.center{ text-align:center; }
.img-grid{ display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
.img-card{ border-radius: 18px; overflow:hidden; border: 1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.02); }
.img-card img{ width:100%; height: 180px; object-fit:cover; }
@media (min-width: 520px){ .img-card img{ height: 210px; } }
.img-hint{ margin-top: 10px; color: rgba(148,163,184,.78); font-size: 12px; }

.fit-grid{ margin-top: 18px; display:grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 900px){ .fit-grid{ grid-template-columns: 1fr 1fr; gap: 16px; } }
.fit{ border-radius: var(--radius-lg); padding: 18px; border: 1px solid rgba(255,255,255,.09); background: rgba(15,23,42,.52); }
.fit h3{ margin: 0 0 10px; color: var(--white); }
.fit.good{ border-color: rgba(34,197,94,.22); background: rgba(34,197,94,.06); }
.fit.bad{ border-color: rgba(239,68,68,.18); background: rgba(239,68,68,.05); }

.leadmag{ border-radius: var(--radius-lg); border: 1px solid rgba(255,255,255,.10); background: linear-gradient(180deg, rgba(15,23,42,.60), rgba(11,18,34,.90)); padding: 18px; display:grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 900px){ .leadmag{ grid-template-columns: 1.2fr .8fr; gap: 18px; align-items:center; } }

.proof-row{ margin-top: 18px; display:grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 780px){ .proof-row{ grid-template-columns: repeat(3, minmax(0,1fr)); } }
.proof-img{ border-radius: 18px; overflow:hidden; border: 1px solid rgba(255,255,255,.10); }
.proof-img img{ width:100%; height: 220px; object-fit:cover; }
.case-grid{ margin-top: 14px; display:grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 900px){ .case-grid{ grid-template-columns: repeat(3, minmax(0,1fr)); } }
.case-card{ position:relative; border-radius: 22px; overflow:hidden; border: 1px solid rgba(255,255,255,.10); }
.case-card img{ width:100%; height: 250px; object-fit:cover; }
.case-overlay{ position:absolute; inset:0; display:flex; flex-direction:column; justify-content:flex-end; padding: 14px; background: linear-gradient(to top, rgba(2,6,23,.85), transparent 58%); }
.case-title{ color: var(--white); font-weight:900; }
.case-sub{ color: rgba(203,213,225,.75); font-weight:700; font-size: 12px; margin-top: 2px; }
.trust{ margin-top: 14px; display:flex; flex-wrap:wrap; gap: 10px; color: rgba(203,213,225,.82); font-weight:700; font-size: 13px; }
.trust-item{ border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.03); padding: 10px 12px; border-radius: 999px; }

.faq{ margin-top: 18px; display:grid; gap: 10px; }
details{ border: 1px solid rgba(255,255,255,.09); background: rgba(15,23,42,.50); border-radius: 18px; padding: 14px 14px 10px; }
summary{ cursor:pointer; color: var(--white); font-weight:900; list-style:none; }
summary::-webkit-details-marker{ display:none; }
details p{ margin: 10px 0 0; color: rgba(203,213,225,.76); font-weight:600; font-size: 13px; line-height: 1.6; }

.form{ display:grid; gap: 12px; }
.field label{ display:block; font-size: 12px; font-weight:900; letter-spacing:.02em; color: rgba(148,163,184,.95); margin-bottom: 6px; text-transform: uppercase; }
.field input, .field select, .field textarea{ width:100%; padding: 12px 12px; border-radius: 14px; border: 1px solid rgba(255,255,255,.10); background: rgba(2,6,23,.55); color: rgba(255,255,255,.92); outline:none; }
.field input:focus, .field select:focus{ border-color: rgba(249,115,22,.45); box-shadow: 0 0 0 4px rgba(249,115,22,.16); }
.field select{ appearance:none; background-image: linear-gradient(45deg, transparent 50%, rgba(255,255,255,.6) 50%), linear-gradient(135deg, rgba(255,255,255,.6) 50%, transparent 50%); background-position: calc(100% - 18px) calc(1em + 2px), calc(100% - 13px) calc(1em + 2px); background-size: 5px 5px, 5px 5px; background-repeat:no-repeat; }
.contact-grid{ margin-top: 18px; }
.contact-card{ border-radius: var(--radius-lg); border: 1px solid rgba(255,255,255,.09); background: rgba(15,23,42,.55); padding: 18px; }
.contact-card h3{ margin:0 0 6px; color: var(--white); }
.contact-card p{ margin:0 0 12px; color: rgba(203,213,225,.75); font-weight:600; font-size: 14px; }
.steps{ margin-top: 14px; border-radius: var(--radius-lg); border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.03); padding: 16px; }
.steps h3{ margin:0 0 10px; color: var(--white); font-size: 16px; }
.steps ol{ margin:0; padding-left: 18px; color: rgba(203,213,225,.78); font-weight:700; font-size: 13px; line-height: 1.7; }

.site-footer{ border-top: 1px solid rgba(255,255,255,.06); background: rgba(11,18,34,.95); padding: 22px 0 92px; }
@media (min-width: 920px){ .site-footer{ padding-bottom: 22px; } }
.footer-inner{ display:flex; flex-direction:column; gap: 14px; align-items:flex-start; justify-content:space-between; }
@media (min-width: 780px){ .footer-inner{ flex-direction:row; align-items:center; } }
.footer-brand{ display:flex; align-items:center; gap:12px; }
.footer-title{ color: var(--white); font-weight:900; }
.footer-links{ display:flex; gap:14px; color: rgba(203,213,225,.72); font-weight:700; font-size: 13px; }

.mobile-bar{ position:fixed; left:0; right:0; bottom:0; width: 100vw; max-width: 100%; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); background: rgba(11,18,34,.92); border-top: 1px solid rgba(255,255,255,.10); backdrop-filter: blur(12px); display:grid; grid-template-columns: 1fr 1fr; gap: 10px; z-index:70; }
@media (min-width: 920px){ .mobile-bar{ display:none; } }
.wa-float{ position:fixed; right: 18px; bottom: 94px; width: 54px; height: 54px; border-radius: 999px; background: #25D366; color: #06120a; display:none; align-items:center; justify-content:center; box-shadow: 0 22px 44px rgba(37,211,102,.20); border: 1px solid rgba(255,255,255,.10); z-index: 65; }
@media (min-width: 920px){ .wa-float{ display:flex; bottom: 22px; } }

.modal[hidden]{ display:none; }
.modal{ position:fixed; inset:0; z-index:120; display:grid; place-items:center; padding: 16px; }
.modal-backdrop{ position:absolute; inset:0; background: rgba(0,0,0,.75); backdrop-filter: blur(6px); }
.modal-card{ position:relative; width: min(520px, 100%); border-radius: 22px; border: 1px solid rgba(255,255,255,.10); background: rgba(11,18,34,.96); padding: 18px; animation: modalIn .18s ease forwards; }
@keyframes modalIn{ to{ transform: translateY(0); } }
.modal-close{ position:absolute; top: 10px; right: 10px; width: 40px; height: 40px; border-radius: 14px; border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.06); color: rgba(255,255,255,.85); cursor:pointer; }
.modal-head h2{ margin: 8px 0 6px; color: var(--white); letter-spacing:-.03em; }

/* ============================
   PREMIUM MOTION LAYER
   ============================ */
.btn, .card, .case-card, .contact-card, .ai-box, .leadmag, .img-card, .proof-img {
  transition: transform .25s cubic-bezier(.19,1,.22,1), box-shadow .25s cubic-bezier(.19,1,.22,1), border-color .25s ease;
}
.card:hover, .case-card:hover, .contact-card:hover, .ai-box:hover, .leadmag:hover {
  transform: translateY(-6px) scale(1.015); box-shadow: 0 26px 70px rgba(0,0,0,.55);
}
.btn-primary:hover, .btn-whatsapp:hover { transform: translateY(-2px) scale(1.02); }
.btn-ghost:hover { transform: translateY(-1px) translateX(1px); }
.img-card:hover { transform: translateY(-6px) scale(1.03) rotate(-1.2deg); box-shadow: 0 26px 70px rgba(0,0,0,.55); }
.proof-img:hover { transform: translateY(-5px) rotate(0.8deg) scale(1.02); box-shadow: 0 24px 60px rgba(0,0,0,.50); }

.hero-bg::before, .hero-bg::after { content:""; position:absolute; border-radius:999px; mix-blend-mode:screen; opacity:.28; filter: blur(40px); animation: heroBlobA 16s ease-in-out infinite alternate; pointer-events:none; }
.hero-bg::before { width:220px; height:220px; background: radial-gradient(circle at 30% 30%, rgba(249,115,22,.95), transparent 60%); top:18%; left:12%; }
.hero-bg::after { width:260px; height:260px; background: radial-gradient(circle at 70% 60%, rgba(59,130,246,.95), transparent 60%); bottom:10%; right:8%; animation-name: heroBlobB; }

@keyframes heroBlobA { 0% { transform: scale(1); } 100% { transform: translate3d(-10px,12px,0) scale(0.96); } }
@keyframes heroBlobB { 0% { transform: scale(1); } 100% { transform: translate3d(14px,-10px,0) scale(0.94); } }

.reveal { opacity:0; transform: translateY(14px); filter: blur(6px); transition: opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1), filter .7s cubic-bezier(.2,.8,.2,1); }
.reveal.is-visible { opacity:1; transform: none; filter: blur(0); }
.reveal-left { transform: translateX(-26px); }
.reveal-right { transform: translateX(26px); }
.reveal-up { transform: translateY(26px); }
.reveal { transition-delay: var(--d, 0ms); }

.hero-title .grad { background: linear-gradient(90deg,#f97316,#ffd6b3,#f97316); background-size: 200% 100%; -webkit-background-clip:text; background-clip:text; color: transparent; animation: gradMove 6s ease-in-out infinite; }
@keyframes gradMove { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
.shine { position:relative; display:inline-block; }
.shine::after { content:""; position:absolute; inset:-12px -20px; background: linear-gradient(115deg,transparent 0,rgba(255,255,255,.18) 45%,transparent 60%); transform: translateX(-120%) skewX(-12deg); animation: shineSweep 4.8s ease-in-out infinite; mix-blend-mode:screen; }
@keyframes shineSweep { 0%,55% { transform: translateX(-120%) skewX(-12deg); opacity:0; } 60% { opacity:1; } 100% { transform: translateX(120%) skewX(-12deg); opacity:0; } }

/* PREMIUM CTA LIGHT SWEEP */
.btn-primary { position: relative; overflow: hidden; box-shadow: 0 18px 40px rgba(249,115,22,.22); }
.btn-primary::before { content: ""; position: absolute; top: 0; left: -150%; width: 50%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent); transform: skewX(-20deg); animation: premiumSweep 4s infinite cubic-bezier(0.19, 1, 0.22, 1); }
@keyframes premiumSweep { 0%, 60% { left: -150%; } 100% { left: 200%; } }

/* INFINITE MOBILE MARQUEE */
.chips-marquee { width: 100%; overflow: hidden; margin-top: 18px; -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.chips-track { display: flex; gap: 10px; width: max-content; animation: scrollMarquee 15s linear infinite; }
.chips-track:hover { animation-play-state: paused; }
@keyframes scrollMarquee { to { transform: translateX(calc(-50% - 5px)); } }

@media (prefers-reduced-motion: reduce) { .hero-bg::before, .hero-bg::after, .btn-primary::before, .chips-track, .hero-title .grad, .shine::after, .reveal, .card, .btn { animation: none !important; transition: none !important; transform: none !important; opacity: 1 !important; filter: none !important; } }

/* --- FORCE MARQUEE FIX --- */
.chips-marquee { 
  width: 100%; 
  overflow: hidden; 
  margin-top: 30px; 
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); 
  mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}

.chips-track { 
  display: flex !important; 
  flex-direction: row !important;
  gap: 12px; 
  width: max-content; 
  animation: scrollMarquee 20s linear infinite; 
}

.chip { 
  display: inline-flex !important;
  padding: 10px 20px; 
  border-radius: 99px; 
  background: rgba(255,255,255,0.05); 
  border: 1px solid rgba(255,255,255,0.1); 
  color: #94A3B8; 
  font-size: 13px; 
  font-weight: 600; 
  text-transform: uppercase; 
  letter-spacing: 1px;
  white-space: nowrap !important; 
  width: auto !important;
}

@keyframes scrollMarquee { 
  to { transform: translateX(calc(-50% - 6px)); } 
}