/* selfemployed.mt landing — light/blue design from the owner's mockup (2026-10-10) */
:root{--ink:#0B1B3A;--ink2:#53627E;--blue:#1F6BF5;--blue2:#1557D6;--green:#18B07A;--line:#E3EAF5;--bg:#FFFFFF;--soft:#F3F8FF;--card:0 10px 30px rgba(20,56,120,.10);--f:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:500 16px/1.55 var(--f);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:8px}
.wrap{width:min(1200px,100% - 32px);margin-inline:auto}
.eyebrow{font:700 12px/1 var(--f);letter-spacing:.16em;text-transform:uppercase;color:var(--ink2)}
h1,h2{font-weight:800;letter-spacing:-.03em;text-wrap:balance;margin:0}
h1 span,h2 span{color:var(--blue)}
.hero h1:not(.h1-long) span{white-space:nowrap}
@media (min-width:601px){.hero h1 span{white-space:nowrap}}
@media (max-width:600px){.hero h1{-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:14px;font:700 15px/1 var(--f);height:50px;padding:0 24px;border:1.5px solid transparent;transition:transform .15s,box-shadow .15s,background .15s}
.btn:hover{transform:translateY(-1px)}
.btn--sm{height:42px;padding:0 18px;font-size:14px;border-radius:12px}.btn--lg{height:58px;padding:0 30px;font-size:16px;border-radius:16px}
.btn--pri{background:linear-gradient(180deg,#2F7BFF,var(--blue));color:#fff;box-shadow:0 10px 24px rgba(31,107,245,.30)}
.btn--ghost{background:#fff;color:var(--ink);border-color:var(--line);box-shadow:0 4px 14px rgba(20,56,120,.06)}
.btn--white{background:#fff;color:var(--ink);box-shadow:var(--card);height:48px}
/* header */
.top{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(227,234,245,.7)}
.top__in{display:flex;align-items:center;gap:14px;height:76px}
.logo{display:flex;align-items:center;gap:9px;font-weight:800;font-size:20px;letter-spacing:-.02em;margin-right:auto}
.nav{display:flex;gap:30px;margin-right:18px}.nav a{font-weight:600;font-size:14.5px;color:var(--ink2)}.nav a:hover{color:var(--ink)}
/* hero */
.hero{background:radial-gradient(70% 90% at 15% 0%,#EAF3FF 0%,transparent 60%),linear-gradient(180deg,#F5F9FF,#fff);overflow:hidden}
.hero__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:30px;align-items:center;min-height:620px;padding-block:40px 30px}
.hero h1{font-size:clamp(44px,5.6vw,72px);line-height:1.02;margin:18px 0 22px}
.lede{font-size:18px;color:var(--ink2);max-width:46ch;margin:0}
.hero__ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}.hero__login{display:none}
.perks{list-style:none;display:flex;flex-wrap:wrap;gap:22px;padding:0;margin:34px 0 0}
.perks li{display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:center}
.perk__ic{grid-row:span 2;width:38px;height:38px;border-radius:11px;background:#E8F1FF;display:grid;place-items:center}
.perks b{font-size:14px}.perks small{font-size:12.5px;color:var(--ink2)}
.hero__art{position:relative;height:560px}
.hero__blob{position:absolute;inset:0 0 0 22%;border-radius:200px 40px 40px 200px;overflow:hidden;box-shadow:var(--card)}
.hero__bg{width:100%;height:100%;object-fit:cover;object-position:85% 40%}
.hero__man{position:absolute;bottom:0;right:4%;height:96%;width:auto;object-fit:contain;filter:drop-shadow(0 20px 30px rgba(11,27,58,.18))}
.fcard{position:absolute;background:#fff;border-radius:18px;box-shadow:var(--card);padding:14px 16px;display:flex;gap:12px;align-items:center;font-size:13px}
.fcard b{display:block;font-size:13.5px}.fcard small{color:var(--ink2);font-size:12px}
.tick{width:34px;height:34px;border-radius:50%;background:var(--green);display:grid;place-items:center;flex:none}
.fcard--a{top:40px;left:0}
.fcard--steps{top:150px;left:0;flex-direction:column;align-items:stretch;gap:12px;padding:16px 18px}
.st{display:flex;align-items:center;gap:10px;font-weight:600;color:var(--ink2);font-size:13px}
.st span{width:20px;height:20px;border-radius:50%;background:#7FA8F5;display:grid;place-items:center;flex:none}.st--last span{background:var(--green)}
.fcard--b{right:0;bottom:30px;max-width:290px}.fcard--b img{width:40px;height:40px}
.chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}.chips span{font-size:11px;font-weight:700;background:#EEF4FF;color:var(--blue2);padding:3px 8px;border-radius:999px}
/* categories */
.cats{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:10px;background:#fff;border-radius:22px;box-shadow:var(--card);padding:20px;margin-top:-10px;position:relative}
.cat{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;font-size:13px;line-height:1.3;padding:6px 4px}
.cat__ic{width:56px;height:56px;border-radius:16px;display:grid;place-items:center}
/* how */
section{scroll-margin-top:90px}
.how{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center;padding-block:90px 70px}
.how__art{position:relative;border-radius:32px;overflow:hidden;box-shadow:var(--card)}
.how__art>img{width:100%;aspect-ratio:4/3.3;object-fit:cover;object-position:70% 50%}
.mini{position:absolute;left:26px;background:#fff;border-radius:16px;box-shadow:var(--card);padding:12px 16px;display:flex;gap:12px;align-items:center;min-width:220px}
.mini b{display:block;font-size:13.5px}.mini small{font-size:12px;color:var(--ink2)}
.mini--1{top:40px}.mini--2{top:118px}.mini--3{top:196px}
.mi{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;flex:none}.mi--g{background:var(--green);border-radius:50%}.mi--b{background:#E8F1FF}.mi--y{background:#FFF4DE}
.how h2{font-size:clamp(30px,3.4vw,42px);line-height:1.1;margin:14px 0 26px}
.steps{list-style:none;padding:0;margin:0;display:grid;gap:18px}
.steps li{display:flex;gap:18px;align-items:flex-start}
.num{width:40px;height:40px;border-radius:50%;background:#EEF4FF;color:var(--blue);font-weight:800;display:grid;place-items:center;flex:none}
.steps b{font-size:16px}.steps p{margin:2px 0 0;color:var(--ink2);font-size:14.5px}
/* supported */
.sup{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:40px;align-items:center;background:linear-gradient(135deg,#F3F8FF,#EEF9F5);border-radius:32px;padding:44px}
.sup h2{font-size:clamp(28px,3vw,38px);line-height:1.1}.sup p{color:var(--ink2);margin:14px 0 24px;max-width:44ch}
.sup__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.sup__card{background:#fff;border-radius:18px;box-shadow:0 6px 20px rgba(20,56,120,.07);padding:18px;display:flex;gap:14px;align-items:center}
.sup__card img{width:52px;height:52px;object-fit:contain;flex:none}.sup__card b{display:block;font-size:14.5px}.sup__card small{color:var(--ink2);font-size:12.5px}
/* network */
.net{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);background:linear-gradient(135deg,#EAF3FF,#E6F7FF);border-radius:32px;overflow:hidden;margin-top:28px}
.net>img{width:100%;height:100%;min-height:300px;object-fit:cover}
.net__txt{padding:40px}.net h2{font-size:clamp(26px,2.8vw,36px);line-height:1.12;margin:12px 0}.net p{color:var(--ink2);margin:0 0 22px}
/* why + faq */
.why{text-align:center;padding-block:80px 30px}.why h2{font-size:clamp(28px,3vw,38px)}.why .sub{color:var(--ink2);margin:10px 0 40px}
.why__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;text-align:left}
.why__grid>div{display:flex;flex-direction:column;gap:4px}.why__grid b{font-size:16px;margin-top:10px}.why__grid small{color:var(--ink2);font-size:14px}
.wi{width:52px;height:52px;border-radius:15px;display:grid;place-items:center}
.faq{padding-block:50px 70px}.faq h2{font-size:clamp(26px,2.8vw,34px);margin-bottom:22px;text-align:center}
.faq__list{max-width:800px;margin:0 auto;display:grid;gap:10px}
.faq details{border:1px solid var(--line);border-radius:16px;padding:0 20px;background:#fff}
.faq summary{cursor:pointer;list-style:none;padding:18px 0;font-weight:700;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:"+";color:var(--blue);font-size:20px;line-height:1}.faq details[open] summary::after{content:"–"}
.faq details p{margin:0 0 18px;color:var(--ink2)}
/* tablet */
@media (max-width:1060px){.cats{grid-template-columns:repeat(4,minmax(0,1fr))}.why__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){
  .hero__in{grid-template-columns:1fr;min-height:0}.hero__art{height:500px}
  .how,.sup,.net{grid-template-columns:1fr}.how{gap:34px;padding-block:60px 40px}.sup{padding:30px}
  .foot__legal{text-align:left}
}
/* phones: the hero is the whole first screen — text, photo, two buttons */
@media (max-width:600px){
  .wrap{width:calc(100% - 32px)}
  .top__in{height:64px;gap:8px}.logo{font-size:18px}.top .btn{display:none}.langdd__code{display:none}.langdd summary{width:44px;padding:0;justify-content:center}
  .hero__in{display:flex;flex-direction:column;align-items:stretch;min-height:calc(100svh - 64px);padding-block:22px 18px;gap:0}
  .hero__copy{display:contents}
  .hero .eyebrow{order:1}.hero h1{order:2;font-size:clamp(38px,11vw,50px);margin:12px 0 12px}.lede{order:3;font-size:16px}
  .hero__art{order:4;flex:1 1 0;min-height:220px;height:auto;margin:14px -16px 0}
  .hero__blob{inset:10% 0 0 18%;border-radius:120px 0 0 120px}
  .hero__man{height:100%;right:6%}
  .fcard--steps,.fcard--b{display:none}.fcard--a{top:auto;bottom:18px;left:16px;padding:10px 12px}
  .hero__ctas{order:5;display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
  .hero__ctas .btn{height:54px;padding:0 10px;font-size:15px}.hero__how{display:none}.hero__login{display:inline-flex}
  .perks{order:6;display:none}
  .cats{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:20px;padding:14px}
  .cat{flex-direction:row;text-align:left;font-size:12.5px}.cat__ic{width:44px;height:44px;flex:none}
  .mini{left:14px;min-width:0;padding:9px 12px}.mini--1{top:14px}.mini--2{top:76px}.mini--3{top:138px}
  .sup__grid{grid-template-columns:1fr}.sup{padding:24px;border-radius:24px}
  .net__txt{padding:26px}.net{border-radius:24px}
  .why__grid{grid-template-columns:1fr 1fr;gap:20px}
}
@media (max-width:600px) and (max-height:700px){.hero__art{min-height:160px}.hero .eyebrow{display:none}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.btn{white-space:nowrap}
@media (max-width:380px){.logo{font-size:16.5px;gap:7px}.logo svg{width:28px;height:28px}}

/* ── header: language menu, phone menu, scroll shadow ── */
.top.solid{background:rgba(255,255,255,.94);box-shadow:0 6px 24px rgba(20,56,120,.08)}
.skip{position:absolute;left:12px;top:-60px;z-index:50;background:var(--ink);color:#fff;padding:10px 14px;border-radius:10px;font-weight:700}.skip:focus{top:12px}
.langdd{position:relative}
.langdd summary{list-style:none;display:inline-flex;align-items:center;gap:7px;height:42px;padding:0 13px;border:1px solid var(--line);border-radius:12px;font-weight:700;font-size:13px;cursor:pointer;background:#fff;color:var(--ink)}
.langdd summary::-webkit-details-marker{display:none}
.langdd summary:hover{border-color:#BCD0F2}
.langdd[open] summary{border-color:var(--blue);box-shadow:0 0 0 3px rgba(31,107,245,.12)}
.langdd__menu{position:absolute;right:0;top:calc(100% + 8px);z-index:40;width:min(440px,calc(100vw - 24px));max-height:min(70vh,520px);overflow:auto;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 24px 60px rgba(11,27,58,.18);padding:10px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px}
.langdd__menu a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:11px;font-size:14px;font-weight:600;color:var(--ink)}
.langdd__menu a:hover{background:var(--soft)}
.langdd__menu a[aria-current]{background:#EAF2FF;color:var(--blue2)}
.langdd__menu small{margin-left:auto;font-size:11px;font-weight:700;color:var(--ink2);text-transform:uppercase;letter-spacing:.06em}
.burger{display:none;width:44px;height:44px;border-radius:12px;border:1px solid var(--line);background:#fff;cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:0}
.burger span{display:block;width:18px;height:2px;border-radius:2px;background:var(--ink);transition:transform .2s,opacity .2s}
.top.open .burger span:nth-child(1){transform:translateY(6px) rotate(45deg)}.top.open .burger span:nth-child(2){opacity:0}.top.open .burger span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.nav__only-sm{display:none}
@media (max-width:1060px){
  .burger{display:inline-flex}
  .nav{display:none;position:absolute;left:12px;right:12px;top:calc(100% + 6px);flex-direction:column;gap:0;margin:0;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 24px 60px rgba(11,27,58,.16);padding:8px}
  .top.open .nav{display:flex}
  .nav a{padding:14px 14px;border-radius:12px;font-size:16px;color:var(--ink)}.nav a:hover{background:var(--soft)}
  .nav__only-sm{display:block}
  .top__in{position:relative}
}
/* ── closing call to action ── */
.cta{margin-top:56px;border-radius:32px;padding:46px 48px;display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;color:#fff;
  background:radial-gradient(120% 140% at 100% 0%,#3D8BFF 0%,transparent 55%),linear-gradient(135deg,#1F6BF5,#1449B8)}
.cta h2{font-size:clamp(26px,3vw,36px);color:#fff}.cta p{margin:8px 0 0;color:rgba(255,255,255,.85);max-width:52ch}
.cta__btns{display:flex;gap:12px;flex-wrap:wrap}
.btn--line{background:transparent;color:#fff;border-color:rgba(255,255,255,.45)}.btn--line:hover{border-color:#fff}
/* ── footer + legal bar ── */
.foot{margin-top:70px;background:#0B1B3A;color:#C9D4E8}
.foot__grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(4,minmax(0,1fr));gap:36px;padding-block:60px 46px}
.foot .logo{color:#fff;margin:0}
.foot__brand p{margin:16px 0 20px;max-width:34ch;font-size:14.5px;color:#9FB0CF}
.foot__badge{display:flex;align-items:center;gap:8px;margin-top:20px;font-size:12.5px;font-weight:600;color:#9FB0CF}
.foot__col{display:flex;flex-direction:column;gap:2px}
.foot__col h3{margin:0 0 10px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#fff;font-weight:800}
.foot__col a{padding:6px 0;font-size:14.5px;color:#C9D4E8}.foot__col a:hover{color:#fff}
.foot address{font-style:normal;font-size:14px;line-height:1.6;color:#9FB0CF;margin-bottom:8px}
.legalbar{background:#071330;border-top:1px solid rgba(255,255,255,.08)}
.legalbar__in{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px;padding-block:18px;font-size:12.5px;color:#8C9CBB}
.legalbar__co{flex:1;min-width:220px}
.legalbar__links{display:flex;gap:18px;flex-wrap:wrap}.legalbar a{color:#C9D4E8}.legalbar a:hover{color:#fff}
@media (max-width:1060px){.foot__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.foot__brand{grid-column:1/-1}}
@media (max-width:600px){.cta{padding:30px 24px;border-radius:24px}.cta__btns{width:100%}.cta__btns .btn{flex:1;min-width:0;padding:0 14px}
  .foot__grid{gap:26px;padding-block:44px 30px}.foot__col a{padding:9px 0}.legalbar__in{flex-direction:column;align-items:flex-start;gap:8px}}
/* ── auth pages (sign in, register) ── */
.auth{min-height:calc(100svh - 76px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);background:linear-gradient(180deg,#F5F9FF,#fff)}
.auth__art{position:relative;overflow:hidden;background:#EAF3FF}
.auth__art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 40%}
.auth__art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(11,27,58,.55))}
.auth__quote{position:absolute;left:36px;right:36px;bottom:36px;z-index:2;color:#fff;font-size:22px;font-weight:800;line-height:1.25;letter-spacing:-.01em;max-width:24ch}
.auth__box{display:flex;align-items:center;justify-content:center;padding:40px 20px}
.auth__card{width:100%;max-width:420px}
.auth__card h1{font-size:34px;line-height:1.1}.auth__card .sub{color:var(--ink2);margin:10px 0 26px}
.field{display:flex;flex-direction:column;gap:7px;margin-bottom:16px}
.field label{font-size:13px;font-weight:700}
.field input{height:52px;border-radius:14px;border:1.5px solid var(--line);background:#fff;padding:0 16px;font:500 16px var(--f);color:var(--ink)}
.field input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 4px rgba(31,107,245,.12)}
.field small{font-size:12.5px;color:var(--ink2)}
.auth__card .btn{width:100%}
.alert{border-radius:14px;padding:12px 14px;font-size:14px;font-weight:600;margin-bottom:16px;background:#FFF0F1;color:#B42335;border:1px solid #F8CDD3}
.auth__alt{margin-top:20px;text-align:center;color:var(--ink2);font-size:14.5px}.auth__alt a{color:var(--blue);font-weight:700}
.consent{font-size:13px;color:var(--ink2);margin:-4px 0 16px;line-height:1.5}.consent a{color:var(--blue);font-weight:600}
@media (max-width:900px){.auth{grid-template-columns:1fr}.auth__art{display:none}}
/* ── document pages (privacy) + 404 ── */
.doc{max-width:780px;padding-block:56px 20px}
.doc h1{font-size:clamp(32px,4vw,44px)}.doc .upd{color:var(--ink2);margin:8px 0 28px;font-size:14px}
.doc h2{font-size:21px;margin:34px 0 10px;letter-spacing:-.01em}
.doc p,.doc li{color:#34445F;line-height:1.7}.doc ul{padding-left:20px}
.doc .note{background:var(--soft);border:1px solid var(--line);border-radius:16px;padding:14px 16px;font-size:14px;color:var(--ink2)}
.nf{text-align:center;padding-block:90px 40px}.nf b{display:block;font-size:84px;line-height:1;letter-spacing:-.04em;color:var(--blue)}
.nf h1{font-size:30px;margin:14px 0 10px}.nf p{color:var(--ink2);margin:0 0 26px}
@media (max-width:600px){.langdd{position:static}.langdd__menu{left:12px;right:12px;width:auto}}
@media (max-width:600px){.hero h1.h1-long{font-size:clamp(28px,8.2vw,40px)}}

/* ══ Clean premium layer (2026-10-16) — Aftermath house style: Manrope, one blue accent, thin lines, small radii,
   flat line icons, flat dark closing band, white footer. Layout and content stay as in the owner's mockup. ══ */
:root{--ink:#0f1419;--ink2:#59626e;--ink3:#2a313a;--blue:#2478F2;--blue2:#166ff1;--acc-h:#0e67ea;--acc-soft:#EEF5FF;--line:#ececee;--soft:#f7f7f8;
  --card:0 1px 2px rgba(15,20,25,.04),0 10px 28px -12px rgba(15,20,25,.16);--f:"Manrope",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
body{font:400 16px/1.6 var(--f);color:var(--ink)}
h1,h2{font-weight:800;letter-spacing:-.035em}
.btn{border-radius:8px;font-weight:700;letter-spacing:-.005em;border-width:1px}
.btn--sm{height:42px;border-radius:8px}.btn--lg{height:52px;padding:0 26px;font-size:15.5px;border-radius:8px}
.btn--pri{background:var(--blue);box-shadow:0 8px 20px -10px rgba(36,120,242,.9)}.btn--pri:hover{background:var(--acc-h)}
.btn--ghost{border-color:#dfe1e4;box-shadow:none}.btn--ghost:hover{border-color:var(--ink)}
.btn--white{border-radius:8px;box-shadow:none;border:1px solid #dfe1e4}
/* header */
.top{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:1px solid var(--line)}
.top.solid{background:#fff;box-shadow:0 6px 20px -14px rgba(15,20,25,.35)}
.top__in{height:72px}
.logo{font-size:20px;letter-spacing:-.035em}.logo b{color:var(--blue);font-weight:800}
.nav a{font-size:14px;font-weight:600;color:var(--ink3)}
.langdd summary,.burger{border-radius:8px;border-color:#dfe1e4}
.langdd__menu{border-radius:12px}.langdd__menu a{border-radius:8px}
/* hero */
.hero{background:radial-gradient(60% 80% at 8% 0%,rgba(36,120,242,.10),transparent 65%),linear-gradient(180deg,#F2F7FF 0%,#F7FAFF 60%,#fff 100%)}
.eyebrow{font:600 11.5px/1 var(--f);letter-spacing:.16em;color:var(--ink3)}
.eyebrow--line{display:flex;align-items:center;gap:12px}.eyebrow--line::before{content:"";width:30px;height:1.5px;background:var(--blue);flex:none}
.hero h1{font-size:clamp(44px,4.8vw,64px);line-height:1.04;letter-spacing:-.04em}
.lede{font-size:17px;color:var(--ink2);line-height:1.6}
.hpill{display:none;align-self:flex-start;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 14px 7px 10px;font-size:13px;font-weight:500;color:var(--ink3)}
.hpill i{width:9px;height:9px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 4px rgba(36,120,242,.15)}
.perk__ic{background:var(--acc-soft);color:var(--blue);border-radius:50%}
.perks b{font-weight:700}
.fcard{border-radius:10px;border:1px solid var(--line);box-shadow:var(--card)}
.fcard b{font-weight:700}
.tick{background:var(--blue)}
.st span{background:#9CC2F9}.st--last span{background:var(--blue)}
.fb__ic{width:40px;height:40px;border-radius:50%;background:var(--acc-soft);color:var(--blue);display:grid;place-items:center;flex:none}
.chips span{border-radius:6px;background:var(--acc-soft);color:var(--blue2)}
.hero__blob{border-radius:200px 16px 16px 200px}
.hrail{display:none}
/* categories */
.cats{border:1px solid var(--line);border-radius:16px;box-shadow:var(--card)}
.cat{font-weight:600;font-size:13px;color:var(--ink3)}
.cat__ic{width:56px;height:56px;border-radius:50%;background:var(--acc-soft);color:var(--blue)}
/* how */
.how__art{border-radius:16px}
.mini{border-radius:10px;border:1px solid var(--line);box-shadow:var(--card)}
.mini b{font-weight:700}
.mi{border-radius:50%}.mi--g{background:var(--blue)}.mi--b,.mi--y{background:var(--acc-soft);color:var(--blue)}
.sample{position:absolute;right:14px;top:14px;background:rgba(255,255,255,.92);border:1px solid var(--line);border-radius:6px;padding:4px 8px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2)}
.how h2{font-size:clamp(28px,3vw,36px)}
.num{background:var(--acc-soft);color:var(--blue)}
.steps b{font-weight:700}
/* supported + network (soft blue bands) */
.sup{border-radius:16px;background:linear-gradient(135deg,#F2F7FF,#EEF4FE)}
.sup h2,.why h2{font-size:clamp(28px,2.8vw,34px)}
.sup__card{border:1px solid var(--line);border-radius:10px;box-shadow:none;transition:transform .2s,border-color .2s}
.sup__card:hover{transform:translateY(-2px);border-color:#BCD4FB}
.sup__ic{width:48px;height:48px;border-radius:50%;background:var(--acc-soft);color:var(--blue);display:grid;place-items:center;flex:none}
.sup__card b{font-weight:700}
.net{border-radius:16px;background:linear-gradient(135deg,#EEF5FF,#F2F7FF)}.net h2{font-size:clamp(26px,2.6vw,32px)}
.btn--white:hover{border-color:var(--ink)}
/* why + faq */
.wi{border-radius:50%;background:var(--acc-soft);color:var(--blue)}
.why__grid b{font-weight:700}
.faq h2{font-size:clamp(26px,2.6vw,32px)}
.faq details{border-radius:10px}.faq summary{font-weight:700}
/* closing band: flat dark */
.cta{border-radius:16px;background:radial-gradient(60% 120% at 100% 0%,rgba(36,120,242,.28),transparent 60%),#0b0f13}
.cta p{color:#a3acb6}
.btn--line{border-color:rgba(255,255,255,.7)}.btn--line:hover{background:rgba(255,255,255,.06)}
/* footer: white */
.foot{background:#fff;color:var(--ink2);border-top:1px solid var(--line)}
.foot .logo{color:var(--ink)}
.foot__brand p{color:var(--ink2)}
.foot__badge{color:var(--blue)}
.foot__col h3{color:var(--ink);font-size:11.5px;font-weight:700;letter-spacing:.16em}
.foot__col a{color:var(--ink3)}.foot__col a:hover{color:var(--blue)}
.foot address{color:var(--ink2)}
.legalbar{background:#fff;border-top:1px solid var(--line)}
.legalbar__in{color:#8a929c}
.legalbar a{color:var(--ink3)}.legalbar a:hover{color:var(--blue)}
/* auth + forms */
.field input{border-radius:8px;border-width:1px;border-color:#dfe1e4}
.field input:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(36,120,242,.14)}
.alert{border-radius:8px}
.doc .note{border-radius:10px}
/* phones: the approved Aftermath phone hero */
@media (max-width:600px){
  .top__in{height:64px}
  .hero__in{min-height:0;padding-block:20px 22px}
  .hpill{display:inline-flex;order:0;margin-bottom:14px}
  .hero .eyebrow{order:1}
  .hero h1{order:2;font-size:clamp(34px,10vw,44px);margin:12px 0 12px}
  .lede{order:3;font-size:16px}
  .hero__art{order:4;flex:none;height:300px;min-height:0;margin:10px -16px 0}
  .hero__blob{inset:6% 0 0 16%}
  .fcard--a{bottom:58px;left:16px;background:rgba(17,21,26,.92);border-color:transparent;color:#fff}
  .fcard--a b{color:#fff}.fcard--a small{color:#c9d0d8}
  .hrail{order:5;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:-40px;position:relative;z-index:3}
  .hrail a{display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;background:#fff;border-radius:8px;padding:12px 4px 10px;box-shadow:0 1px 2px rgba(15,20,25,.05),0 12px 26px -12px rgba(15,20,25,.25)}
  .hrail span{width:40px;height:40px;border-radius:50%;background:var(--acc-soft);color:var(--blue);display:grid;place-items:center;margin-bottom:5px}
  .hrail b{font-size:12.5px;font-weight:700;line-height:1.2}
  .hrail small{font-size:11px;color:var(--ink2);line-height:1.25}
  .hero__ctas{order:6;grid-template-columns:1fr;gap:10px;margin-top:18px}
  .hero__ctas .btn{height:52px;width:100%}
  .perks{order:7;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:18px 0 0}
  .perks li{display:flex;align-items:center;gap:7px;padding:0 8px;border-left:1px solid var(--line)}
  .perks li:first-child{border-left:0;padding-left:0}
  .perk__ic{width:24px;height:24px;flex:none}.perk__ic svg{width:13px;height:13px}
  .perks b{font-size:12px;font-weight:600;color:var(--ink2);line-height:1.25}.perks small{display:none}
  .cat__ic{width:44px;height:44px}
  .cta__btns{flex-direction:column}.cta__btns .btn{width:100%;flex:none}
  .sample{right:10px;top:auto;bottom:10px}
}
@media (max-width:600px) and (max-height:700px){.hero .eyebrow{display:flex}}
@media (max-width:360px){.hrail small{display:none}.perks b{font-size:11.5px}}