:root{--bg:#070d1a;--bg2:#0b1426;--card:#0f1b33;--card2:#13223f;--line:#1e2f52;--text:#e6edf9;--muted:#8a9bbd;--blue:#3b82f6;--blue2:#22d3ee;--green:#22c55e;--amber:#f59e0b;--red:#ef4444;--r:16px;--grad:linear-gradient(135deg,#3b82f6,#22d3ee);--shadow:0 20px 50px -20px rgba(59,130,246,.35)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:Manrope,system-ui,sans-serif;font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--blue2);text-decoration:none}a:hover{color:#fff}
h1,h2,h3,h4{margin:0 0 .5em;line-height:1.2;letter-spacing:-.02em;color:#fff}h1{font-size:clamp(28px,4vw,44px);font-weight:800}h2{font-size:clamp(22px,3vw,30px);font-weight:800}
img{max-width:100%;display:block}
.cf-wrap{max-width:1240px;margin:0 auto;padding:0 20px}.cf-section{padding:48px 20px}.cf-center{text-align:center}.cf-muted{color:var(--muted)}.cf-narrow{max-width:560px;margin:0 auto}
/* top bar + header */
.cf-topbar{background:var(--grad);color:#04101f;font-size:13px;font-weight:600}.cf-topbar .cf-wrap{display:flex;justify-content:space-between;gap:12px;padding:7px 20px}.cf-topbar a{color:#04101f}
.cf-header{position:sticky;top:0;z-index:50;background:rgba(7,13,26,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.cf-header-in{display:flex;align-items:center;gap:24px;height:72px}
.cf-logo{display:flex;align-items:center;gap:10px;color:#fff;font-size:24px;font-weight:800;letter-spacing:-.03em}.cf-logo b{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.cf-logo-mark{width:38px;height:38px;border-radius:11px;background:var(--grad);display:grid;place-items:center;color:#04101f;font-size:20px;box-shadow:var(--shadow)}
.cf-search{flex:1;display:flex;max-width:520px;background:var(--card);border:1px solid var(--line);border-radius:999px;overflow:hidden;transition:.2s}.cf-search:focus-within{border-color:var(--blue);box-shadow:0 0 0 4px rgba(59,130,246,.15)}
.cf-search input{flex:1;background:none;border:0;color:var(--text);padding:11px 18px;font:inherit;outline:0}.cf-search button{background:none;border:0;color:var(--blue2);font-size:20px;padding:0 16px;cursor:pointer}
.cf-nav{display:flex;align-items:center;gap:22px;margin-left:auto;font-weight:600}.cf-nav>a,.cf-dd>span{color:var(--text);cursor:pointer}.cf-nav>a:hover,.cf-dd:hover>span{color:var(--blue2)}
.cf-dd{position:relative;padding:24px 0}.cf-dd-menu{position:absolute;top:100%;left:-12px;min-width:220px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:8px;box-shadow:0 30px 60px -20px #000;opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s}
.cf-dd:hover .cf-dd-menu{opacity:1;visibility:visible;transform:none}.cf-dd-menu a{display:block;padding:10px 12px;border-radius:9px;color:var(--text)}.cf-dd-menu a:hover{background:var(--card2)}
.cf-cart-btn{position:relative;background:var(--card2);border:1px solid var(--line);padding:9px 16px;border-radius:999px}.cf-cart-btn i{position:absolute;top:-6px;right:-6px;background:var(--grad);color:#04101f;font-style:normal;font-size:11px;font-weight:800;min-width:20px;height:20px;border-radius:10px;display:grid;place-items:center}
.cf-burger{display:none;background:none;border:1px solid var(--line);color:#fff;border-radius:10px;font-size:20px;padding:4px 12px;margin-left:auto}
/* buttons + forms */
.cf-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--grad);color:#04101f;border:0;border-radius:12px;padding:12px 22px;font:700 15px Manrope,sans-serif;cursor:pointer;box-shadow:var(--shadow);transition:transform .15s,filter .15s}.cf-btn:hover{color:#04101f;transform:translateY(-1px);filter:brightness(1.1)}
.cf-btn-ghost{background:transparent;color:var(--text);border:1px solid var(--line);box-shadow:none}.cf-btn-ghost:hover{color:#fff;border-color:var(--blue)}
.cf-btn-lg{padding:16px 30px;font-size:16px}.cf-block{width:100%}.cf-link{background:none;border:0;color:var(--blue2);cursor:pointer;font:inherit;padding:0}
label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:14px}
input,select,textarea,.cf-input{background:var(--bg2);border:1px solid var(--line);color:var(--text);border-radius:10px;padding:11px 13px;font:500 15px Manrope,sans-serif;width:100%;outline:0}input:focus,select:focus,textarea:focus{border-color:var(--blue)}
.cf-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.cf-span2{grid-column:span 2}
.cf-alert{padding:12px 16px;border-radius:12px;margin:16px 0;font-weight:600}.cf-alert-error{background:rgba(239,68,68,.12);color:#fca5a5;border:1px solid rgba(239,68,68,.3)}.cf-alert-success{background:rgba(34,197,94,.12);color:#86efac;border:1px solid rgba(34,197,94,.3)}
.cf-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r)}.cf-pad{padding:24px}
/* hero */
.cf-hero{position:relative;overflow:hidden;padding:70px 0 60px;background:radial-gradient(900px 500px at 85% -10%,rgba(59,130,246,.28),transparent 60%),radial-gradient(700px 400px at 0% 110%,rgba(34,211,238,.14),transparent 60%)}
.cf-hero-in{display:grid;grid-template-columns:1.15fr 1fr;gap:48px;align-items:center}
.cf-hero h1{font-size:clamp(32px,5vw,56px)}.cf-hero em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.cf-pill{display:inline-block;border:1px solid var(--line);background:var(--card);padding:6px 14px;border-radius:999px;font-size:13px;color:var(--blue2);margin-bottom:18px;font-weight:600}
.cf-lead{font-size:18px;color:var(--muted);max-width:520px}
.cf-hero-search{display:flex;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:6px;max-width:540px;margin:24px 0}.cf-hero-search input{border:0;background:none}
.cf-stats{display:flex;gap:36px}.cf-stats b{display:block;font-size:26px;color:#fff}.cf-stats span{font-size:13px;color:var(--muted)}
.cf-hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.cf-action{display:flex;flex-direction:column;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:20px;padding:22px;color:var(--text);transition:.2s;position:relative}.cf-action:hover{border-color:var(--blue);transform:translateY(-3px);box-shadow:var(--shadow);color:#fff}
.cf-action>span{font-size:30px}.cf-action b{font-size:18px;display:block}.cf-action small{color:var(--muted)}.cf-action i{position:absolute;right:20px;top:20px;font-style:normal;color:var(--blue2)}
.cf-action-sell{background:linear-gradient(160deg,rgba(59,130,246,.22),var(--card) 70%)}
/* sections */
.cf-sec-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px}
.cf-brand-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:12px}.cf-brand-tile{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px 10px;text-align:center;color:#fff;font-weight:700;transition:.2s}.cf-brand-tile:hover{border-color:var(--blue);color:var(--blue2)}
.cf-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.cf-grid-3{grid-template-columns:repeat(3,1fr)}
.cf-product{display:block;padding:16px;color:var(--text);position:relative;transition:.2s}.cf-product:hover{border-color:var(--blue);transform:translateY(-3px);box-shadow:var(--shadow);color:var(--text)}
.cf-product-img{aspect-ratio:1;background:radial-gradient(circle at 50% 40%,var(--card2),var(--bg2));border-radius:12px;display:grid;place-items:center;margin-bottom:12px;overflow:hidden}.cf-product-img img{width:70%;height:70%;object-fit:contain}
.cf-product h3{font-size:15px;margin:6px 0 2px}.cf-product p{font-size:13px;margin:0 0 8px}
.cf-grade{display:inline-block;font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px;text-transform:uppercase;letter-spacing:.04em;background:rgba(34,197,94,.14);color:#86efac}.cf-grade-good{background:rgba(59,130,246,.15);color:#93c5fd}.cf-grade-fair{background:rgba(245,158,11,.15);color:#fcd34d}
.cf-price-row{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.cf-price-row strong{font-size:19px;color:#fff}.cf-price-row s{color:var(--muted);font-size:13px}.cf-off{color:var(--green);font-weight:700;font-size:13px}.cf-price-lg strong{font-size:32px}
.cf-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px}.cf-steps b{width:40px;height:40px;border-radius:12px;background:var(--grad);color:#04101f;display:grid;place-items:center;margin-bottom:12px}
/* page hero + tabs */
.cf-page-hero{padding:44px 0 28px;border-bottom:1px solid var(--line);background:radial-gradient(700px 300px at 90% 0,rgba(59,130,246,.2),transparent 60%)}
.cf-tabs{display:inline-flex;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:4px;margin-top:10px}.cf-tabs a,.cf-tabs button{padding:8px 18px;border-radius:9px;color:var(--muted);font:700 14px Manrope;background:none;border:0;cursor:pointer}.cf-tabs .on{background:var(--grad);color:#04101f}
.cf-shop{display:grid;grid-template-columns:260px 1fr;gap:24px;padding-top:28px;padding-bottom:48px}.cf-filters{align-self:start;position:sticky;top:96px}
/* pdp */
.cf-crumbs{font-size:13px;color:var(--muted)}.cf-crumbs a{color:var(--muted)}
.cf-pdp{display:grid;grid-template-columns:1fr 1fr;gap:40px}.cf-pdp-img{aspect-ratio:1;display:grid;place-items:center;background:radial-gradient(circle,var(--card2),var(--card))}.cf-pdp-img img{width:65%}
.cf-specs{width:100%;border-collapse:collapse;margin:20px 0}.cf-specs th,.cf-specs td{text-align:left;padding:10px 0;border-bottom:1px solid var(--line)}.cf-specs th{color:var(--muted);font-weight:600;width:40%}
.cf-buy-actions{display:flex;gap:12px}.cf-buy-actions .cf-btn{flex:1}.cf-stock{color:var(--green);font-weight:600}
.cf-perks{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}.cf-perks li{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:14px}
/* wizard */
.cf-wizard-layout{display:grid;grid-template-columns:1fr 320px;gap:24px;align-items:start}
.cf-progress{display:flex;gap:6px;list-style:none;padding:0;margin:0 0 24px;overflow-x:auto}.cf-progress li{flex:1;min-width:80px;font-size:12px;font-weight:700;color:var(--muted);padding-top:10px;border-top:3px solid var(--line)}.cf-progress li.on{color:#fff;border-color:var(--blue)}.cf-progress li.done{color:var(--blue2);border-color:var(--blue2)}
.cf-step{display:none;animation:cfIn .3s ease}.cf-step.on{display:block}@keyframes cfIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.cf-choice-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin:14px 0 22px}.cf-choice-wide{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.cf-choice{background:var(--bg2);border:1px solid var(--line);color:var(--text);border-radius:12px;padding:16px;text-align:left;cursor:pointer;font:inherit;transition:.15s}.cf-choice:hover{border-color:var(--blue)}.cf-choice.on{border-color:var(--blue2);background:rgba(59,130,246,.15)}.cf-choice b{display:block}.cf-choice small{color:var(--green);font-size:12px}
.cf-q{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}.cf-q small{display:block;color:var(--muted);font-weight:400}
.cf-yn{display:flex;gap:6px}.cf-yn label{margin:0}.cf-yn input{display:none}.cf-yn span{padding:8px 18px;border:1px solid var(--line);border-radius:9px;cursor:pointer;color:var(--text)}.cf-yn input:checked+span{background:var(--grad);color:#04101f;border-color:transparent}
.cf-wizard-nav{margin-top:16px}.cf-summary{position:sticky;top:96px}
.cf-sum-row{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px dashed var(--line);font-size:14px}.cf-sum-row span:last-child{color:#fff;text-align:right}.cf-sum-total{font-size:18px;font-weight:800;border:0;margin:8px 0 16px}
.cf-quote{background:linear-gradient(135deg,rgba(59,130,246,.25),rgba(34,211,238,.12));border:1px solid rgba(59,130,246,.4);border-radius:16px;padding:22px;text-align:center;margin-bottom:24px}.cf-quote span{color:var(--muted);font-size:13px;font-weight:600}.cf-quote strong{display:block;font-size:40px;color:#fff;font-weight:800}.cf-quote small{color:var(--muted)}
.cf-quote-sm{margin:16px 0 0;padding:16px}.cf-quote-sm strong{font-size:28px}
/* cart / checkout / account */
.cf-checkout-grid{display:grid;grid-template-columns:1fr 360px;gap:24px;align-items:start}
.cf-line{display:grid;grid-template-columns:72px 1fr 80px 110px;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}.cf-line img{width:72px;height:72px;object-fit:contain;background:var(--bg2);border-radius:10px;padding:8px}.cf-line p{margin:0;font-size:13px}.cf-line strong{text-align:right;color:#fff}.cf-line a{color:#fff}
.cf-pay-options{display:grid;gap:10px}.cf-radio-card{flex-direction:row;align-items:center;gap:12px;background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:14px;cursor:pointer;margin:0;color:var(--text)}.cf-radio-card input{width:auto}.cf-radio-card small{display:block;color:var(--muted);font-weight:400}.cf-radio-card:has(input:checked){border-color:var(--blue)}
.cf-auth{max-width:440px;margin:0 auto}.cf-tabs-auth{display:flex;margin-bottom:20px}.cf-tabs-auth button{flex:1}
.cf-table{width:100%;border-collapse:collapse;font-size:14px}.cf-table th,.cf-table td{text-align:left;padding:10px;border-bottom:1px solid var(--line)}.cf-table th{color:var(--muted)}
.cf-status{background:var(--card2);border:1px solid var(--line);padding:3px 10px;border-radius:999px;font-size:12px;text-transform:capitalize}
.cf-big-check{width:72px;height:72px;margin:0 auto 16px;border-radius:50%;background:var(--grad);color:#04101f;display:grid;place-items:center;font-size:34px;font-weight:800}
/* trust + footer */
.cf-trust{border-top:1px solid var(--line);background:var(--bg2)}.cf-trust-in{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:28px 20px}.cf-trust b{display:block;color:#fff}.cf-trust span{font-size:13px;color:var(--muted)}
.cf-footer{background:#050a14;border-top:1px solid var(--line);padding:56px 0 24px;position:relative}.cf-footer:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--grad)}
.cf-footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:32px}.cf-footer h4{font-size:13px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.cf-footer-grid>div>a:not(.cf-btn):not(.cf-logo){display:block;color:var(--text);padding:4px 0;font-size:14px}.cf-footer-grid a:hover{color:var(--blue2)}
.cf-footer-brand p{color:var(--muted);max-width:340px}
.cf-footer-bottom{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:40px;padding-top:20px;font-size:13px;color:var(--muted)}
/* responsive */
@media(max-width:1024px){.cf-grid{grid-template-columns:repeat(3,1fr)}.cf-brand-grid{grid-template-columns:repeat(4,1fr)}.cf-hero-in,.cf-pdp{grid-template-columns:1fr}}
@media(max-width:860px){.cf-search{display:none}.cf-burger{display:block}.cf-nav{display:none;position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:var(--bg2);border-bottom:1px solid var(--line);padding:10px 20px}.cf-nav.open{display:flex}.cf-dd{padding:10px 0}.cf-dd-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;background:none;border:0;padding:4px 0 0 12px}.cf-nav>a{padding:10px 0}
.cf-shop,.cf-wizard-layout,.cf-checkout-grid{grid-template-columns:1fr}.cf-filters,.cf-summary{position:static}.cf-grid,.cf-grid-3{grid-template-columns:repeat(2,1fr)}.cf-steps,.cf-trust-in{grid-template-columns:1fr 1fr}.cf-footer-grid{grid-template-columns:1fr 1fr}.cf-topbar .cf-wrap span:first-child{display:none}}
@media(max-width:560px){.cf-form-grid{grid-template-columns:1fr}.cf-span2{grid-column:auto}.cf-hero-actions{grid-template-columns:1fr}.cf-line{grid-template-columns:56px 1fr;}.cf-line strong{text-align:left}.cf-steps,.cf-footer-grid{grid-template-columns:1fr}.cf-q{flex-direction:column;align-items:flex-start}.cf-brand-grid{grid-template-columns:repeat(2,1fr)}}