:root{--bg:#070912;--bg2:#10162a;--panel:#111423;--panel2:#171b2f;--line:#2a2f4c;--text:#f5f7ff;--muted:#b9c0dd;--blue:#48d2ff;--violet:#cd31ff;--yellow:#ffd84a;--shadow:0 18px 45px rgba(0,0,0,.35)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,sans-serif;background:radial-gradient(circle at top,#151a35 0%,#070912 48%);color:var(--text);overflow-x:hidden}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
button,input,select{font:inherit}
button{cursor:pointer}
.container{width:min(100%,1240px);margin:0 auto;padding-inline:16px}
.grid{display:grid;gap:18px}
.topbar{background:#0d1120;border-bottom:1px solid #252945;color:#d6ddff;font-size:12px}
.topbar .container{display:flex;justify-content:center;text-align:center;padding:8px 16px}
.nav{position:sticky;top:0;z-index:30;background:rgba(10,12,23,.92);backdrop-filter:blur(14px);border-bottom:1px solid #242841}
.nav .container{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:72px;padding-block:10px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;min-width:0}
.brand-badge{width:40px;height:40px;border-radius:14px;background:linear-gradient(135deg,var(--blue),var(--violet));display:grid;place-items:center;font-weight:900;color:#040510;box-shadow:0 10px 35px rgba(72,210,255,.25);flex:0 0 auto}
.brand-logo{height:30px;width:auto;max-width:min(220px,58vw);object-fit:contain}
.brand-title{display:none}
.navlinks{display:none}
.actions{display:flex;gap:8px;align-items:center;width:100%}
.actions .btn{flex:1}
.pill{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border:1px solid #41507d;border-radius:999px;background:#ffffff08;color:#dbe2ff;font-size:12px;font-weight:700;max-width:100%;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;border-radius:14px;padding:12px 16px;font-weight:800;border:1px solid transparent;transition:.2s;text-align:center}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:linear-gradient(135deg,var(--blue),var(--violet));color:#06070e;box-shadow:0 12px 38px rgba(72,210,255,.18)}
.btn-secondary{background:#0f1426;border-color:#2e3657;color:#eef2ff}
.btn-accent{background:linear-gradient(135deg,#ffef6a,#ff9f2f);color:#211507}
.hero{padding:22px 0 20px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1fr;gap:18px;align-items:center}
.hero h1{font-family:Barlow Condensed,Impact,sans-serif;font-size:52px;line-height:.92;margin:12px 0 12px;letter-spacing:-.02em}
.hero h1 span{display:block;color:var(--blue)}
.hero p{font-size:15px;line-height:1.7;color:var(--muted);max-width:680px}
.hero-cards,.hero-ctas{display:flex;gap:10px;flex-wrap:wrap}
.hero-art{display:flex;flex-direction:column;gap:12px}
.hero-art .bg{position:relative;border-radius:26px;overflow:hidden;border:1px solid #334066;box-shadow:var(--shadow);min-height:260px}
.hero-art .bg img{width:100%;height:100%;object-fit:cover}
.hero-art .overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,6,17,.05),rgba(3,6,17,.72))}
.hero-art .floating{background:#08101d;border:1px solid #324266;border-radius:22px;padding:14px;box-shadow:var(--shadow)}
.hero-art .floating img{width:100%;height:160px;object-fit:contain}
.floating small{display:block;color:#b4c1ef;font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px}
.floating strong{display:block;font-size:24px;font-family:Barlow Condensed,Impact,sans-serif;color:#fff;margin-bottom:8px}
.section{padding:24px 0}
.section-head{display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin-bottom:18px}
.section-head h2{margin:0;font-family:Barlow Condensed,Impact,sans-serif;font-size:40px;line-height:.94}
.section-head p{margin:0;color:var(--muted);line-height:1.7;max-width:720px}
.quick-grid,.product-grid,.feature-grid,.steps,.legal-grid,.footer-grid{grid-template-columns:1fr}
.quick-card,.product-card,.legal-card,.feature,.step{background:linear-gradient(180deg,#141a31,#0d1223);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow)}
.quick-card{overflow:hidden}
.quick-card img{width:100%;aspect-ratio:16/10;object-fit:cover}
.quick-card .copy,.feature,.step,.legal-card{padding:18px}
.quick-card h3,.product-card h3,.feature h3,.step h3,.legal-card h3,.footer h4{margin:0 0 8px;font-family:Barlow Condensed,Impact,sans-serif}
.quick-card h3{font-size:28px}
.quick-card p,.feature p,.step p,.legal-card p,.footer p,.footer li,.footer a{margin:0;color:var(--muted);line-height:1.65}
.product-controls{display:flex;gap:10px;flex-wrap:wrap}
.chip{padding:10px 14px;border:1px solid #344164;border-radius:999px;background:#0c1121;color:#e6edff;font-weight:700}
.chip.active{background:linear-gradient(135deg,#1d2745,#222a58);border-color:#5f72b1}
.product-card{display:flex;flex-direction:column;overflow:hidden}
.product-card .visual{padding:16px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#0b1224,#0a1020)}
.product-card .visual img{width:100%;aspect-ratio:1/1;object-fit:contain;border-radius:18px;border:1px solid #2f4061;background:#0a0f1d}
.product-card .content{padding:18px;display:flex;flex-direction:column;gap:12px;flex:1}
.eyebrow{font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:var(--blue);font-weight:800}
.product-card h3{font-size:26px;line-height:.98}
.product-card p{margin:0;color:var(--muted);line-height:1.65;flex:1}
.price{font-size:34px;font-family:Barlow Condensed,Impact,sans-serif;color:var(--yellow);line-height:1}
.small{font-size:13px;color:#bac3ea;line-height:1.55}
.card-actions{display:flex;gap:10px;flex-wrap:wrap}
.card-actions .btn{flex:1 1 180px}
.feature .icon{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,#0e1f39,#1b2348);font-size:24px;margin-bottom:12px;border:1px solid #33456f}
.feature h3{font-size:22px}
.step .num{font-family:Barlow Condensed,Impact,sans-serif;color:var(--yellow);font-size:48px;line-height:1}
.step h3,.legal-card h3{font-size:24px}
.legal-card a{color:var(--blue);font-weight:800}
.cta{padding:28px 0 52px}
.cta-box{display:grid;grid-template-columns:1fr;gap:20px;padding:22px;background:linear-gradient(145deg,#12192d,#0b1020);border:1px solid var(--line);border-radius:28px;box-shadow:var(--shadow)}
.cta-box h2{margin:0;font-size:40px;font-family:Barlow Condensed,Impact,sans-serif;line-height:.95}
.cta-box p{color:var(--muted);line-height:1.7}
.cta-box ul{padding-left:18px;color:#dce4ff;line-height:1.8;margin:0}
.footer{border-top:1px solid #252b46;padding:26px 0 32px;background:#090d19}
.footer-grid{display:grid;gap:22px}
.footer ul{margin:0;padding:0;list-style:none}
.muted{color:var(--muted)}
.modal-backdrop{position:fixed;inset:0;background:rgba(5,8,16,.78);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:16px;z-index:80}
.modal-backdrop.open{display:flex}
.modal{max-width:580px;width:min(100%,580px);max-height:90vh;overflow:auto;background:linear-gradient(180deg,#151a2f,#0b1020);border:1px solid #33405f;border-radius:24px;box-shadow:var(--shadow);padding:20px}
.modal h3{margin:0 0 10px;font-size:36px;font-family:Barlow Condensed,Impact,sans-serif}
.modal p{margin:0 0 16px;color:var(--muted);line-height:1.7}
.form-grid{display:grid;grid-template-columns:1fr;gap:14px}
.field{display:flex;flex-direction:column;gap:8px;margin-bottom:6px}.field label{font-size:14px;font-weight:800;color:#edf2ff}.field input,.field select{border-radius:14px;background:#091020;border:1px solid #334160;color:#fff;padding:13px 14px}
.cookie-banner{position:fixed;left:12px;right:12px;bottom:12px;z-index:85;display:none}.cookie-banner.show{display:block}
.cookie-panel{margin:0 auto;max-width:1100px;background:linear-gradient(180deg,#151c34,#0c1120);border:1px solid #33415e;border-radius:20px;box-shadow:var(--shadow);padding:16px;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.cookie-panel p{margin:0;color:#cfdaff;line-height:1.65}.cookie-actions{display:flex;gap:10px;flex-wrap:wrap;width:100%}.cookie-actions .btn{flex:1}
.notice{padding:12px 14px;border:1px solid #35506f;border-radius:16px;background:#0a1326;color:#dfe8ff;font-size:14px;line-height:1.7}.badge{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;background:#10213b;border:1px solid #315078;color:#e3eeff;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.only-desktop{display:none}
@media (min-width:640px){
  .container{padding-inline:20px}
  .actions{width:auto}
  .actions .btn{flex:0 1 auto}
  .hero h1{font-size:64px}
  .quick-grid,.product-grid,.feature-grid,.steps,.legal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .form-grid{grid-template-columns:1fr 1fr}
  .cookie-panel{flex-direction:row;justify-content:space-between;align-items:center}
  .cookie-actions{width:auto}
}
@media (min-width:900px){
  .nav .container{flex-wrap:nowrap;min-height:78px}
  .navlinks{display:flex;gap:20px;align-items:center;color:#dfe5ff}
  .navlinks a{font-weight:700;font-size:15px;color:#d5ddff}
  .brand-logo{height:34px;max-width:320px}
  .actions .btn-secondary{display:inline-flex}
  .hero{padding:42px 0 28px}
  .hero-grid{grid-template-columns:1.02fr .98fr;gap:30px}
  .hero h1{font-size:82px}
  .hero-art{position:relative;display:block;min-height:510px}
  .hero-art .bg{position:absolute;inset:0;min-height:unset}
  .hero-art .floating{position:absolute;width:210px}
  .floating.frag{left:-10px;top:24px}.floating.ticket{right:-8px;bottom:30px}
  .section-head{flex-direction:row;justify-content:space-between;align-items:flex-end;gap:24px}
  .quick-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .feature-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .steps{grid-template-columns:repeat(4,minmax(0,1fr))}
  .legal-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .cta-box{grid-template-columns:1.2fr .8fr;padding:28px}
  .cta-box h2{font-size:56px}
  .footer-grid{grid-template-columns:1.2fr .9fr .9fr}
}

/* Carlos Gift v3: mobile-first navigation + product detail */
@media (max-width:899px){
 .nav .container{display:grid;grid-template-columns:minmax(0,1fr) 50px;align-items:center;gap:8px;padding-block:8px}
 .nav .brand{grid-column:1}.nav .nav-menu{grid-column:2;justify-self:end}
 .nav .actions{grid-column:1/-1;width:100%}
 .nav .navlinks{display:none;grid-column:1/-1;grid-row:3;flex-direction:column;align-items:stretch;gap:0;padding:6px;border-radius:14px;background:#10172e;border:1px solid #333d62}
 .nav .navlinks.is-open{display:flex}
 .nav .navlinks a{display:block;padding:12px 14px;font-size:14px;color:#fff}
 .nav .navlinks a+a{border-top:1px solid #242e4b}
}
.nav-menu{border:1px solid #3b4a73;border-radius:12px;background:#131c32;color:#fff;font-size:23px;width:46px;height:46px;display:grid;place-items:center}
@media (min-width:900px){.nav-menu{display:none}}
.modal-backdrop{padding:12px}
.modal{position:relative;max-height:calc(100dvh - 24px);overflow-y:auto;overscroll-behavior:contain}
.modal .detail-visual{height:clamp(200px,32vh,320px);display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,#111a30,#090d18);border:1px solid #2f4269;border-radius:18px;padding:12px;margin:12px 0}
.modal .detail-visual img{display:block;max-width:100%;width:auto;max-height:100%;object-fit:contain;border:0;box-shadow:none}
.modal .detail-actions{display:flex;flex-wrap:wrap;gap:10px}
@media(max-width:480px){.modal{padding:16px;border-radius:18px}.modal h3{font-size:30px}.detail-actions .btn{flex:1 1 100%}.cookie-banner{bottom:8px;left:8px;right:8px}.cookie-panel{max-height:55dvh;overflow:auto}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn{transition:none}}