:root{
  --bg:#07142d;
  --panel:#0c1b3b;
  --panel2:#11264f;
  --text:#f7fbff;
  --muted:#b8c5db;
  --cyan:#21e1d2;
  --pink:#ec2c8b;
  --purple:#7c3aed;
  --orange:#f59e0b;
  --red:#ef3340;
  --green:#74d13c;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  background:
    radial-gradient(circle at 20% 10%,rgba(29,78,216,.16),transparent 28%),
    linear-gradient(180deg,#061226,#08152e 60%,#0a1934);
  font-family:Inter,Segoe UI,Arial,sans-serif;
}
a{color:inherit}
.shell{width:min(1420px,calc(100% - 44px));margin:auto}
.responsible-bar{background:#041022;border-bottom:1px solid rgba(255,255,255,.05);font-size:13px}
.responsible-inner{height:34px;display:flex;justify-content:space-between;align-items:center;color:#eef5ff}
.responsible-inner b{display:inline-grid;place-items:center;width:27px;height:27px;margin-right:10px;border-radius:50%;background:#e11d48;color:#fff}
.site-header{position:sticky;top:0;z-index:20;background:rgba(7,20,45,.95);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.08)}
.nav{min-height:80px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:grid;grid-template-columns:46px auto;grid-template-rows:auto auto;align-items:center;text-decoration:none;font-size:27px;font-weight:900;line-height:1}
.brand>span:nth-child(2)>span,.footer-brand .brand>span:nth-child(2)>span{color:#24d9c9}
.brand small{grid-column:2;color:#b7c6dd;font-size:11px;font-weight:500;margin-top:4px}
.brand-ball{grid-row:1/3;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;margin-right:10px;background:radial-gradient(circle at 35% 30%,#fff 0 18%,#2d8df3 19% 45%,#082e63 46% 64%,#f8b72d 65% 76%,#0f274d 77%);color:#07142d;font-weight:900;border:2px solid #f4b324}
.menu{display:flex;gap:34px;align-items:center}
.menu a{text-decoration:none;font-size:14px;font-weight:700;color:#f6f8fb;position:relative}
.menu a.active{color:#22d3ee}
.menu a.active::after{content:"";position:absolute;height:3px;left:0;right:0;bottom:-17px;background:#22d3ee}
.header-actions{display:flex;align-items:center;gap:16px}
.search-btn{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:transparent;color:#fff;font-size:23px}
.header-cta,.btn-primary{background:linear-gradient(90deg,#f66b36,#df1779);border-radius:10px;text-decoration:none;font-weight:800}
.header-cta{padding:14px 24px}

.hero{position:relative;overflow:hidden;background:linear-gradient(90deg,#0b2552,#071c3d 55%,#280847);border-bottom:1px solid rgba(255,255,255,.06)}
.hero::before{content:"";position:absolute;inset:0;background:url("assets/hero-pattern.svg") center/cover no-repeat;opacity:.85}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,27,65,.08),rgba(7,24,53,.22))}
.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr 1fr .95fr;align-items:center;min-height:330px;gap:34px}
.hero-copy h1{font-size:46px;line-height:1.05;margin:0 0 18px;letter-spacing:-.03em}
.hero-copy h1 span{color:#19e0be}
.hero-copy p{max-width:560px;color:#e5efff;font-size:16px}
.hero-actions{display:flex;gap:15px;margin-top:28px}
.btn{padding:14px 24px;border-radius:10px;text-decoration:none;font-weight:800;border:1px solid transparent}
.btn-primary span{margin-left:12px}
.btn-secondary{border-color:#7ad7ff;background:rgba(255,255,255,.03)}
.hero-benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;text-align:center}
.hero-benefits article{padding:4px}
.benefit-icon{width:52px;height:52px;border-radius:50%;margin:0 auto 10px;display:grid;place-items:center;font-size:23px;border:1px solid currentColor;background:rgba(255,255,255,.03)}
.benefit-icon.teal{color:#12d5b6}.benefit-icon.orange{color:#f59e0b}.benefit-icon.yellow{color:#f5d44c}.benefit-icon.pink{color:#ec4899}
.hero-benefits h3{font-size:13px;margin:0 0 7px}.hero-benefits p{font-size:11px;color:#d5def0;margin:0;line-height:1.35}
.hero-art img{width:100%;max-height:300px;object-fit:contain}

.comparison{padding:18px 0 14px;background:linear-gradient(180deg,#06142e,#07162f)}
.comparison-layout{display:grid;grid-template-columns:245px 1fr;gap:20px}
.compare-intro{border:1px solid #f4c24b;border-right-color:#775cf3;border-radius:16px;padding:22px;background:linear-gradient(160deg,rgba(19,41,82,.97),rgba(8,22,48,.97));box-shadow:0 0 28px rgba(39,84,190,.12)}
.spark{font-size:20px}.compare-intro h2{font-size:28px;line-height:1.1;margin:6px 0 12px}.compare-intro p{color:#dbe6f7;font-size:14px}
.feature-list{display:grid;gap:9px;margin-top:22px;padding:14px;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:rgba(15,40,83,.75)}
.feature-list div{display:flex;align-items:center;gap:9px;font-size:13px}
.icon-chip{width:24px;height:24px;border-radius:6px;display:grid;place-items:center}.purple{background:#7c3aed}.orange{background:#f59e0b}.green{background:#22c55e}.blue{background:#3b82f6}.violet{background:#8b5cf6}
.provider-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.provider-card{position:relative;min-height:158px;padding:12px;border:2px solid #8b5cf6;border-radius:13px;background:linear-gradient(180deg,#172750,#0a1735 75%);box-shadow:inset 0 0 35px rgba(255,255,255,.02),0 10px 22px rgba(0,0,0,.22)}
.provider-card .rank{position:absolute;left:8px;top:8px;width:28px;height:28px;border:2px solid #a7e8ff;border-radius:50%;display:grid;place-items:center;background:#0a1530;font-weight:800}
.pill{display:table;margin:0 auto 9px;padding:4px 11px;border-radius:99px;font-size:10px;font-weight:800;background:#384ea3}.pill-violet{background:#6631a9}.pill-red{background:#a73558}.pill-gold{background:#7c6323}.pill-cyan{background:#157da5}.pill-pink{background:#9a2d70}.pill-green{background:#477b35}.pill-orange{background:#8b4930}
.provider-name{height:37px;display:grid;place-items:center;text-align:center;font-weight:900;font-size:22px;letter-spacing:.02em}.provider-name small{display:block;font-size:11px;color:#40d447;letter-spacing:2px}.green-text{color:#58c636}.lime-text{color:#b8df3d}.cyan-text{color:#1eb4d4}.red-text{color:#ef3340}.red-block{display:inline-grid!important;width:max-content;height:auto!important;padding:2px 8px;margin:auto;background:#df1f42;color:#fff;border-radius:2px}
.mini-icons{text-align:center;font-size:15px;letter-spacing:2px;margin:4px 0 8px}
.card-bottom{display:grid;grid-template-columns:1fr 58px;align-items:center;gap:8px}
.card-bottom a{display:flex;justify-content:center;align-items:center;gap:7px;padding:7px 6px;border-radius:6px;text-decoration:none;font-size:10px;font-weight:800;background:linear-gradient(180deg,#3da447,#137b2b)}
.red-btn{background:linear-gradient(180deg,#ed334b,#c30d2d)!important}.gold-btn{background:linear-gradient(180deg,#edae16,#bb6f00)!important}.cyan-btn{background:linear-gradient(180deg,#1aa5c7,#08718d)!important}.lime-btn{background:linear-gradient(180deg,#77c02d,#4b8f12)!important}.orange-btn{background:linear-gradient(180deg,#e89313,#b45f04)!important}
.score-ring{--score:80;position:relative;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#7c5cff calc(var(--score)*1%),#21345e 0);box-shadow:0 0 0 4px rgba(255,255,255,.04),inset 0 0 0 5px #0c1733}
.score-ring::after{content:"";position:absolute;inset:7px;border-radius:50%;background:#101d3c}.score-ring span{position:relative;z-index:2;font-size:13px;font-weight:900}.teal-ring{background:conic-gradient(#12d2c5 calc(var(--score)*1%),#21345e 0)}.red-ring{background:conic-gradient(#ff334d calc(var(--score)*1%),#21345e 0)}.gold-ring{background:conic-gradient(#f2b322 calc(var(--score)*1%),#21345e 0)}.lime-ring{background:conic-gradient(#86d542 calc(var(--score)*1%),#21345e 0)}.orange-ring{background:conic-gradient(#f18f17 calc(var(--score)*1%),#21345e 0)}
.border-violet{border-color:#7656ff}.border-teal{border-color:#12cfc7}.border-pink{border-color:#d62aae}.border-red{border-color:#ff2745}.border-gold{border-color:#d69b11}.border-lime{border-color:#79bd19}.border-orange{border-color:#e37c11}

.info-row{display:grid;grid-template-columns:1.1fr .95fr 1.03fr;gap:12px;padding:14px 0 16px}
.panel{border:1px solid #bd59ff;border-radius:14px;background:linear-gradient(145deg,#16244b,#0a1835);padding:14px;min-height:230px;box-shadow:0 10px 26px rgba(0,0,0,.2)}
.panel-purple{background:linear-gradient(145deg,#291352,#0b1938)}.panel-cyan{background:linear-gradient(145deg,#063e59,#062c45)}.panel-pink{background:linear-gradient(145deg,#51204e,#26153d)}
.panel-title{display:flex;gap:10px;align-items:flex-start;margin-bottom:13px}.panel-title>span{font-size:24px}.panel-title h2{font-size:20px;margin:0}.panel-title p{font-size:12px;color:#d6dced;margin:2px 0 0}
.three-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.info-card,.variant-card{border:1px solid rgba(144,154,255,.45);border-radius:10px;background:linear-gradient(145deg,rgba(36,50,101,.9),rgba(22,31,72,.9));padding:12px;text-align:center}
.big-icon{width:46px;height:46px;margin:0 auto 10px;border-radius:14px;display:grid;place-items:center;font-size:22px}.purple-bg{background:#7c3aed}.blue-bg{background:#2775de}.pink-bg{background:#c33392}
.info-card h3,.variant-card h3{font-size:13px;margin:0 0 8px}.info-card p,.variant-card p{font-size:11px;color:#eef3ff;margin:0;line-height:1.45}
.panel-note{text-align:center;color:#f0ccff;font-size:12px;margin-top:10px}
.variant-cols{grid-template-columns:repeat(3,1fr)}.variant-card{background:linear-gradient(145deg,rgba(6,71,104,.95),rgba(7,48,78,.95));border-color:#15a5d5}
.ball{width:58px;height:58px;margin:0 auto 9px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:24px;color:#0a1c38;border:4px solid rgba(255,255,255,.7);box-shadow:inset 0 0 13px rgba(255,255,255,.7),0 7px 16px rgba(0,0,0,.28)}.blue-ball{background:linear-gradient(#fff,#69aefa)}.green-ball{background:linear-gradient(#fff,#7cc34b)}.orange-ball{background:linear-gradient(#fff,#ff9b2d)}
.faq-panel details{border-bottom:1px solid rgba(255,255,255,.16);padding:4px 0}.faq-panel summary{cursor:pointer;list-style:none;font-size:11px;display:flex;justify-content:space-between}.faq-panel summary::after{content:"⌄"}.faq-panel details[open] summary::after{content:"⌃"}.faq-panel p{font-size:11px;color:#e6dff0;margin:5px 0 2px}

.footer{border-top:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,#09182f,#08162c);padding:18px 0 14px}
.footer-grid{display:grid;grid-template-columns:1.35fr repeat(4,.75fr) 1.25fr;gap:22px}
.footer .brand{font-size:24px;grid-template-columns:38px auto}.footer .brand-ball{width:34px;height:34px}.footer-brand p,.footer p{font-size:11px;color:#c4cfe1}.socials{display:flex;gap:10px}.socials span{width:26px;height:26px;border-radius:50%;background:#1d3158;display:grid;place-items:center;font-size:12px}
.footer h3{font-size:13px;margin:4px 0 8px}.footer a{display:block;text-decoration:none;color:#d9e2f1;font-size:11px;margin:5px 0}.license-box{border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:12px;background:#0d2040}.license-box strong{display:block;font-size:12px}.license-box small{font-size:10px;color:#c8d5e8}
.footer-bottom{border-top:1px solid rgba(255,255,255,.07);margin-top:12px;padding-top:10px;display:flex;justify-content:space-between;color:#9cabc0;font-size:10px}

@media(max-width:1200px){
  .provider-grid{grid-template-columns:repeat(3,1fr)}
  .hero-grid{grid-template-columns:1fr 1fr}
  .hero-art{display:none}
  .hero-benefits{grid-column:2}
  .info-row{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:900px){
  .menu{display:none}
  .header-actions .search-btn{display:none}
  .hero-grid{grid-template-columns:1fr}
  .hero-benefits{grid-column:auto}
  .comparison-layout{grid-template-columns:1fr}
  .provider-grid{grid-template-columns:repeat(2,1fr)}
  .responsible-inner span:last-child{display:none}
}
@media(max-width:620px){
  .shell{width:min(100% - 24px,1420px)}
  .header-cta{display:none}
  .hero-copy h1{font-size:36px}
  .hero-benefits{grid-template-columns:repeat(2,1fr)}
  .provider-grid{grid-template-columns:1fr}
  .three-cols,.variant-cols{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-bottom{flex-direction:column;gap:6px}
}