/* =========================================================
   AKON CHAT — stylesheet
   ========================================================= */
:root{
  --bg:#0a0c14; --bg2:#10131e; --panel:#141824; --panel2:#191e2c; --line:rgba(255,255,255,.09); --line2:rgba(255,60,70,.35);
  --red:#e31b23; --red-d:#c3121a; --red-g:rgba(255,42,58,.18);
  --text:#f4f5f8; --mute:#a3a8b8; --r:14.4px; --font:'Plus Jakarta Sans',system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);background:var(--bg);color:var(--text);font-size:13.1px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
.ic{width:18px;height:18px;flex:none}
.wrap{width:min(1080px,100% - 36px);margin-inline:auto}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.red{color:var(--red)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8.1px;height:41.4px;padding:0 19.8px;border-radius:9px;font-weight:700;font-size:13.1px;border:1.5px solid transparent;cursor:pointer;transition:.2s;white-space:nowrap}
.btn .ic{width:16.2px;height:16.2px}
.btn-red{background:linear-gradient(180deg,#ff3a48,#e3131f);color:#fff;box-shadow:0 9px 27px rgba(255,42,58,.35)}
.btn-red:hover{transform:translateY(-1px);box-shadow:0 12.6px 32.4px rgba(255,42,58,.5)}
.btn-line{border-color:rgba(255,255,255,.55);color:#fff;background:rgba(255,255,255,.02)}
.btn-line:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.btn-sm{height:34.2px;padding:0 14.4px;font-size:12.2px}

/* header */
.hdr{position:sticky;top:0;z-index:50;background:rgba(10,12,20,.8);backdrop-filter:blur(12.6px);border-bottom:1px solid var(--line)}
.hdr .wrap{display:flex;align-items:center;gap:27px;height:59.4px}
.brand{display:flex;align-items:center;gap:9px;font-weight:800;font-size:18px;letter-spacing:.4px;white-space:nowrap}
.brand .mark{width:30.6px;height:27px;color:var(--red)}
.nav{display:flex;gap:3.6px;margin-left:50.4px}
.nav a{position:relative;padding:19.8px 11.7px;font-size:12.2px;font-weight:500;color:#d7d9e0;display:flex;align-items:center;gap:3.6px}
.nav a:hover{color:#fff}
.nav a.on{color:#fff;font-weight:700}
.nav a.on::after{content:"";position:absolute;left:11.7px;right:11.7px;bottom:11.7px;height:2.2px;border-radius:2.7px;background:var(--red)}
.hdr-act{display:flex;align-items:center;gap:10.8px;margin-left:auto}
.lang{display:flex;align-items:center;gap:5.4px;font-size:11.7px;color:#d7d9e0;padding:0 7.2px}
.lang .ic{width:15.3px;height:15.3px}
.icbtn{width:34.2px;height:34.2px;border-radius:50%;display:grid;place-items:center;background:none;border:0;color:#fff;cursor:pointer}
.burger{display:none}

/* hero */
.hero{position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(540px 342px at 78% 30%,rgba(255,42,58,.30),transparent 70%),radial-gradient(450px 270px at 10% 0%,rgba(255,42,58,.12),transparent 70%)}
.hero .swoosh{position:absolute;right:-10%;bottom:-36px;width:80%;opacity:.6;pointer-events:none}
.hero .wrap{position:relative;display:grid;grid-template-columns:1fr 1.2fr;gap:21.6px;align-items:center;padding:36px 0 36px}
.pill{display:inline-flex;align-items:center;gap:9px;border:1px solid var(--line2);border-radius:27px;padding:4.5px 12.6px;font-size:11.2px;background:rgba(255,42,58,.06)}
.pill b{display:flex;align-items:center;gap:5.4px} .pill .ic{width:13.5px;height:13.5px;color:var(--red)}
.pill i{width:1px;height:12.6px;background:var(--line)}
.hero h1{font-size:41.4px;line-height:1.08;font-weight:800;margin:18px 0 14.4px;letter-spacing:-1px}
.hero p{color:#cfd2dc;font-size:14px;max-width:423px}
.hero .cta{display:flex;gap:12.6px;margin:23.4px 0 25.2px;flex-wrap:wrap}
.trusted{display:flex;align-items:center;gap:16.2px;font-size:11.2px;color:#cfd2dc}
.avs{display:flex}
.avs img{width:36px;height:36px;border-radius:50%;border:2px solid var(--bg);margin-left:-9px;object-fit:cover}
.avs img:first-child{margin:0}
.trusted span{border-left:1px solid var(--line);padding-left:16.2px;max-width:180px;line-height:1.5}
.device img{width:100%;-webkit-mask-image:radial-gradient(ellipse 72% 72% at 50% 50%,#000 62%,transparent 100%);mask-image:radial-gradient(ellipse 72% 72% at 50% 50%,#000 62%,transparent 100%)}

/* feature strip */
.fstrip{display:grid;grid-template-columns:repeat(5,1fr);border:1px solid var(--line);border-radius:16.2px;background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));padding:19.8px 0}
.fstrip div{text-align:center;padding:3.6px 14.4px;border-left:1px solid var(--line)}
.fstrip div:first-child{border:0}
.fstrip .ic{width:32.4px;height:32.4px;color:var(--red);margin:0 auto 9px}
.fstrip b{display:block;font-size:14px;font-weight:700;line-height:1.3}
.fstrip span{font-size:11.7px;color:var(--mute);display:block;margin-top:3.6px;line-height:1.45}

.sec{padding:40px 0}
.eyebrow{font-size:10.8px;font-weight:700;letter-spacing:2.7px;text-transform:uppercase;color:var(--red)}
.h2{font-size:28.8px;line-height:1.15;font-weight:800;letter-spacing:-.5px;margin:9px 0 10.8px}
.lead{color:#c9ccd6;font-size:13.5px}
.center{text-align:center} .center .lead{max-width:540px;margin:0 auto}
.split{display:grid;grid-template-columns:1fr 1fr;gap:45px;align-items:center}
.split .vis img{width:100%;border-radius:18px;-webkit-mask-image:radial-gradient(ellipse 75% 75% at 50% 50%,#000 62%,transparent 100%);mask-image:radial-gradient(ellipse 75% 75% at 50% 50%,#000 62%,transparent 100%)}
.ticks{list-style:none;display:grid;gap:10.8px;margin:18px 0 0}
.ticks li{display:flex;gap:10.8px;align-items:center;font-size:13.5px}
.ticks .ic{width:19.8px;height:19.8px;padding:3.6px;border-radius:50%;background:var(--red);color:#fff;stroke-width:3}

.suite{display:flex;align-items:center;gap:25.2px;border:1px solid var(--line);border-radius:16.2px;padding:18px 25.2px;background:linear-gradient(90deg,rgba(255,42,58,.08),rgba(255,255,255,.02) 40%)}
.suite .logo{width:46.8px;height:46.8px;border-radius:11.7px;background:linear-gradient(180deg,#ff3a48,#c30d19);display:grid;place-items:center;flex:none;box-shadow:0 7.2px 21.6px rgba(255,42,58,.35)}
.suite .logo .mark{width:25.2px;height:23.4px;color:#fff}
.suite h3{font-size:17.1px;font-weight:700;white-space:nowrap;padding-right:25.2px;border-right:1px solid var(--line)}
.suite p{flex:1;color:#c9ccd6;font-size:12.6px}

/* pricing */
.toggle{display:inline-flex;gap:3.6px;padding:3.6px;border:1px solid var(--line);border-radius:27px;margin:16.2px 0 0;background:var(--panel)}
.toggle button{border:0;background:none;padding:7.2px 16.2px;border-radius:27px;font-size:11.7px;font-weight:600;cursor:pointer;color:var(--mute)}
.toggle button.on{background:var(--red);color:#fff}
.toggle small{color:#4ade80;font-weight:700}
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:21.6px;max-width:900px;margin:30.6px auto 0}
.plan{position:relative;border:1px solid var(--line);border-radius:16.2px;padding:23.4px 23.4px 23.4px;background:linear-gradient(180deg,#161a26,#11141e);display:flex;flex-direction:column}
.plan.pop{border-color:var(--red);box-shadow:0 0 0 1px var(--red),0 18px 54px rgba(255,42,58,.22);background:linear-gradient(180deg,#1d1520,#13141e)}
.plan .tag{position:absolute;top:-11.7px;left:50%;transform:translateX(-50%);background:var(--red);color:#fff;font-size:10.8px;font-weight:700;padding:3.6px 12.6px;border-radius:6.3px}
.plan h3{font-size:18px;font-weight:700}
.plan .amt{font-size:27px;font-weight:800;margin:3.6px 0 0;line-height:1.2}
.plan .amt small{font-size:12.6px;font-weight:500;color:var(--mute)}
.plan hr{border:0;border-top:1px solid var(--line);margin:14.4px 0}
.plan ul{list-style:none;display:grid;gap:9.9px;margin-bottom:21.6px;flex:1}
.plan li{display:flex;gap:9px;align-items:center;font-size:12.2px;color:#d7d9e0}
.plan li .ic{width:15.3px;height:15.3px;color:#fff}
.plan.pop li .ic{color:var(--red)}
.plan .btn{width:100%}
.plan .btn-line{border-color:rgba(255,255,255,.75)}

/* cards */
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:16.2px}
.cards4{display:grid;grid-template-columns:repeat(4,1fr);gap:16.2px}
.cards2{display:grid;grid-template-columns:1fr 1fr;gap:16.2px}
.card{border:1px solid var(--line);border-radius:var(--r);padding:21.6px;background:linear-gradient(180deg,#151925,#10131d);transition:.25s}
.card:hover{border-color:var(--line2);transform:translateY(-2.7px)}
.card .ic.big{width:41.4px;height:41.4px;padding:9.9px;border-radius:10.8px;background:var(--red-g);color:var(--red)}
.card h3{font-size:15.3px;font-weight:700;margin:12.6px 0 5.4px}
.card p{font-size:12.2px;color:var(--mute)}
.card ul{list-style:none;margin-top:10.8px;display:grid;gap:6.3px}
.card li{display:flex;gap:7.2px;font-size:11.7px;color:#d7d9e0;align-items:center}
.card li .ic{width:13.5px;height:13.5px;color:var(--red)}

/* in-page tabs (solutions) */
.stabs{display:flex;gap:7.2px;flex-wrap:wrap;justify-content:center;margin:21.6px 0}
.stabs button{border:1px solid var(--line);background:var(--panel);border-radius:27px;padding:8.1px 16.2px;font-size:12.2px;font-weight:600;cursor:pointer;color:#d7d9e0;display:flex;gap:7.2px;align-items:center}
.stabs button .ic{width:14.4px;height:14.4px}
.stabs button.on{background:var(--red);border-color:var(--red);color:#fff}
.spane{display:none}.spane.on{display:grid;animation:fade .45s}
@keyframes fade{from{opacity:0;transform:translateY(7.2px)}}

/* mock chat */
.mock{border:1px solid var(--line);border-radius:16.2px;background:#0e1119;overflow:hidden;box-shadow:0 27px 72px rgba(0,0,0,.5),0 0 0 1px rgba(255,42,58,.1)}
.mock .bar{display:flex;align-items:center;gap:9px;padding:10.8px 14.4px;border-bottom:1px solid var(--line);font-size:11.7px}
.mock .bar .av{width:27px;height:27px;border-radius:50%;background:#7c3aed;display:grid;place-items:center;font-size:9.9px;font-weight:700}
.mock .bar small{display:block;color:#4ade80;font-size:9.9px}
.mock .msgs{padding:14.4px;display:grid;gap:9px}
.bub{max-width:78%;padding:8.1px 11.7px;border-radius:12.6px;font-size:11.2px;line-height:1.45}
.bub.in{background:#1d2230;border-bottom-left-radius:3.6px}
.bub.out{background:var(--red);justify-self:end;border-bottom-right-radius:3.6px}
.bub small{display:block;font-size:9px;opacity:.65;margin-top:2.7px;text-align:right}
.mock .inp{display:flex;align-items:center;gap:9px;margin:0 14.4px 14.4px;padding:7.2px 7.2px 7.2px 12.6px;border:1px solid var(--line);border-radius:27px;font-size:10.8px;color:var(--mute)}
.mock .inp span{flex:1}
.mock .inp b{width:27px;height:27px;border-radius:50%;background:var(--red);display:grid;place-items:center}
.mock .inp b .ic{width:12.6px;height:12.6px;color:#fff}

/* stats / table */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16.2px}
.stats div{text-align:center;padding:21.6px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel)}
.stats b{display:block;font-size:28.8px;font-weight:800}
.stats b em{font-style:normal;color:var(--red)}
.stats span{font-size:11.7px;color:var(--mute)}
.ctable{width:100%;border-collapse:collapse;font-size:12.2px;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.ctable th,.ctable td{padding:11.7px 14.4px;text-align:left;border-bottom:1px solid var(--line)}
.ctable th{background:var(--panel2);font-weight:700}
.ctable td:not(:first-child),.ctable th:not(:first-child){text-align:center}
.ctable .ic{width:15.3px;height:15.3px;color:var(--red);display:inline-block}
.ctable .no{color:#545a6b}

.faq{display:grid;gap:9px;max-width:774px;margin:0 auto}
.faq details{border:1px solid var(--line);border-radius:10.8px;padding:0 16.2px;background:var(--panel)}
.faq summary{list-style:none;cursor:pointer;padding:14.4px 0;font-weight:600;display:flex;justify-content:space-between;gap:10.8px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ic{transition:.3s;width:16.2px;height:16.2px}
.faq details[open] summary .ic{transform:rotate(180deg);color:var(--red)}
.faq details p{padding:0 0 14.4px;font-size:12.2px;color:var(--mute)}

/* page hero */
.phero{position:relative;padding:48.6px 0 36px;text-align:center;overflow:hidden;border-bottom:1px solid var(--line)}
.phero::before{content:"";position:absolute;inset:0;background:radial-gradient(450px 216px at 50% 0%,rgba(255,42,58,.25),transparent 70%)}
.phero .wrap{position:relative}
.crumbs{display:inline-flex;gap:5.4px;align-items:center;font-size:11.2px;color:var(--mute)}
.crumbs .ic{width:11.7px;height:11.7px}
.phero h1{font-size:34.2px;font-weight:800;letter-spacing:-.6px;line-height:1.15;margin:10.8px 0 7.2px}
.phero p{color:#c9ccd6;max-width:558px;margin:0 auto;font-size:13.5px}

/* downloads */
.dl{display:grid;grid-template-columns:repeat(4,1fr);gap:16.2px}
.dl .card{text-align:center}
.dl .card .ic.big{margin:0 auto}
.dl .btn{margin-top:12.6px;width:100%}
.store{display:flex;gap:10.8px;flex-wrap:wrap}
.storebtn{display:flex;align-items:center;gap:8.1px;height:43.2px;padding:0 14.4px;border-radius:9px;background:#000;color:#fff;border:1px solid #3a3d48;transition:.2s}
.storebtn:hover{border-color:#fff}
.storebtn svg{width:21.6px;height:21.6px}
.storebtn span{display:flex;flex-direction:column;font-size:14.4px;font-weight:700;line-height:1.1}
.storebtn small{font-size:8.6px;font-weight:500}

/* blog */
.post{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--panel);transition:.25s}
.post:hover{border-color:var(--line2);transform:translateY(-2.7px)}
.post .ph{aspect-ratio:1.85;overflow:hidden;background:#1a1e2a}
.post .ph img{width:100%;height:100%;object-fit:cover}
.post .bd{padding:16.2px}
.post .tag{font-size:9.9px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--red)}
.post h3{font-size:14.4px;font-weight:700;margin:5.4px 0}
.post p{font-size:11.7px;color:var(--mute)}

/* forms */
.form{display:grid;gap:12.6px}
.form .two{display:grid;grid-template-columns:1fr 1fr;gap:12.6px}
.form label{font-size:11.2px;font-weight:600;color:#d7d9e0;display:grid;gap:5.4px}
.form input,.form select,.form textarea{border:1px solid var(--line);border-radius:9px;padding:10.8px 12.6px;font-size:12.6px;background:#0d1018;outline:0;transition:.2s;color-scheme:dark}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--red);box-shadow:0 0 0 3.6px var(--red-g)}
.form textarea{min-height:108px;resize:vertical}
.panelbox{border:1px solid var(--line);border-radius:16.2px;padding:25.2px;background:linear-gradient(180deg,#151925,#10131d)}
.cinfo{display:grid;gap:10.8px}
.cinfo>*{display:flex;gap:12.6px;align-items:center;padding:16.2px;border:1px solid var(--line);border-radius:12.6px;background:var(--panel)}
.cinfo .ic{width:37.8px;height:37.8px;padding:9px;border-radius:10.8px;background:var(--red-g);color:var(--red)}
.cinfo b{display:block} .cinfo small{color:var(--mute);font-size:11.2px}

.cta-band{position:relative;overflow:hidden;border-radius:19.8px;padding:39.6px;text-align:center;border:1px solid var(--line2);background:radial-gradient(450px 198px at 50% 120%,rgba(255,42,58,.45),transparent 70%),linear-gradient(180deg,#171a26,#10121b)}
.cta-band h2{font-size:27px;font-weight:800;letter-spacing:-.5px}
.cta-band p{color:#c9ccd6;margin:7.2px 0 19.8px}
.cta-band .row{display:flex;gap:10.8px;justify-content:center;flex-wrap:wrap}

.auth{min-height:calc(100vh - 59.4px);display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center;padding:36px 0}
.auth .card{max-width:396px;width:100%;margin:auto}
.auth h1{font-size:23.4px;font-weight:800}
.auth .sub{color:var(--mute);margin:3.6px 0 19.8px}
.or{display:flex;align-items:center;gap:10.8px;color:var(--mute);font-size:10.8px}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line)}

.legal{max-width:774px;margin:0 auto}
.legal h2{font-size:17.1px;font-weight:700;margin:23.4px 0 7.2px}
.legal p{font-size:12.6px;color:#cfd2dc;margin-bottom:7.2px}

.nf{min-height:calc(100vh - 59.4px);display:grid;place-items:center;text-align:center;padding:36px 18px;background:radial-gradient(450px 270px at 50% 40%,rgba(255,42,58,.2),transparent 70%)}
.nf .big{font-size:126px;font-weight:800;line-height:1;letter-spacing:-5.4px}
.nf .big span{color:var(--red)}
.nf .typing{display:inline-flex;gap:4.5px;padding:10.8px 14.4px;border-radius:14.4px;background:#1d2230;margin-bottom:12.6px}
.nf .typing i{width:7.2px;height:7.2px;border-radius:50%;background:#fff;opacity:.4;animation:dot 1.2s infinite}
.nf .typing i:nth-child(2){animation-delay:.2s}.nf .typing i:nth-child(3){animation-delay:.4s}
@keyframes dot{50%{opacity:1;transform:translateY(-2.7px)}}
.nf h1{font-size:21.6px;font-weight:800;margin:9px 0 5.4px}
.nf p{color:var(--mute);margin-bottom:19.8px}

/* footer */
.ftr{border-top:1px solid var(--line);margin-top:54px;background:#07080e;font-size:12.2px;color:var(--mute)}
.ftr .top{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:27px;padding:45px 0 30.6px}
.ftr .brand{color:#fff}
.ftr p{margin:10.8px 0 14.4px;font-size:11.7px;max-width:270px}
.ftr h4{color:#fff;font-size:12.6px;font-weight:700;margin-bottom:10.8px}
.ftr ul{list-style:none;display:grid;gap:7.2px}
.ftr a:hover{color:#fff}
.soc{display:flex;gap:7.2px}
.soc a{width:30.6px;height:30.6px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center}
.soc a:hover{background:var(--red);border-color:var(--red);color:#fff}.soc .ic{width:14.4px;height:14.4px}
.ftr .bot{border-top:1px solid var(--line);padding:14.4px 0;display:flex;justify-content:space-between;gap:10.8px;flex-wrap:wrap;font-size:11.2px}

.toast{position:fixed;left:50%;bottom:21.6px;transform:translate(-50%,108px);opacity:0;visibility:hidden;background:#1b1f2c;border:1px solid var(--line2);color:#fff;padding:10.8px 18px;border-radius:10.8px;font-size:12.2px;z-index:99;transition:.35s;display:flex;gap:9px;align-items:center}
.toast.on{transform:translate(-50%,0);opacity:1;visibility:visible}
.toast .ic{color:#4ade80}
.rv{opacity:0;transform:translateY(16.2px);transition:opacity .6s,transform .6s}
.rv.in{opacity:1;transform:none}

@media (max-width:1100px){
  .nav{margin-left:9px} .nav a{padding:19.8px 8.1px}
  .lang{display:none}
  .fstrip{grid-template-columns:repeat(3,1fr);row-gap:19.8px} .fstrip div:nth-child(4){border:0}
  .cards4,.dl{grid-template-columns:1fr 1fr}
  .ftr .top{grid-template-columns:1fr 1fr 1fr}
}
@media (max-width:900px){
  .burger{display:grid}
  .nav{position:fixed;inset:59.4px 0 auto 0;background:#0e1019;flex-direction:column;gap:0;margin:0;padding:7.2px 18px 16.2px;border-bottom:1px solid var(--line);transform:translateY(-130%);transition:.35s;z-index:-1}
  .nav.open{transform:none}
  .nav a{padding:10.8px 3.6px;border-bottom:1px solid var(--line)} .nav a.on::after{display:none}
  .hdr-act .btn-line{display:none}
  .hero .wrap,.split,.auth{grid-template-columns:1fr}
  .plans{grid-template-columns:1fr;max-width:396px}
  .cards3{grid-template-columns:1fr 1fr}
  .suite{flex-wrap:wrap} .suite h3{border:0;padding:0}
  .stats{grid-template-columns:1fr 1fr}
  .auth .vis{display:none}
}
@media (max-width:640px){
  .hdr-act .btn-red{display:none}
  .brand{font-size:16.2px}
  .hero h1{font-size:30.6px}
  .h2,.phero h1{font-size:24.3px}
  .fstrip{grid-template-columns:1fr 1fr} .fstrip div{border:0!important}
  .cards3,.cards4,.cards2,.dl,.form .two{grid-template-columns:1fr}
  .ftr .top{grid-template-columns:1fr 1fr}.ftr .top>div:first-child{grid-column:1/-1}
  .ctable{font-size:10.8px}.ctable th,.ctable td{padding:9px 7.2px}
  .trusted{flex-wrap:wrap}
  .cta-band{padding:27px 18px}
}
.center .store{justify-content:center}

/* ---- compact pricing block (home) ---- */
.pricing-x{display:grid;grid-template-columns:290px 1fr;gap:34px;align-items:center}
.pricing-x .h2{font-size:30px;margin:8px 0 10px}
.pricing-x .lead{font-size:14px}
.pricing-x .toggle{margin-top:18px}
.pricing-x .plans{max-width:none;margin:0;gap:16px}
.pricing-x .plan{padding:22px 20px}
.pricing-x .plan ul{gap:9px;margin-bottom:18px}
.pricing-x .plan hr{margin:12px 0}
.perks{list-style:none;display:grid;gap:9px;margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.perks li{display:flex;gap:9px;align-items:center;font-size:13px;color:#cfd2dc}
.perks .ic{width:16px;height:16px;color:var(--red)}

/* ---- app CTA band ---- */
.appcta{position:relative;display:grid;grid-template-columns:150px 1fr auto;gap:30px;align-items:center;padding:0 34px 0 30px;border-radius:20px;border:1px solid var(--line2);
  background:radial-gradient(420px 220px at 18% 110%,rgba(255,42,58,.45),transparent 70%),radial-gradient(380px 200px at 100% 0%,rgba(255,42,58,.18),transparent 70%),linear-gradient(100deg,#1a1520,#10121b 55%,#151822);
  min-height:150px;margin-top:40px;overflow:visible}
.appcta .swoosh{position:absolute;left:0;right:0;bottom:0;width:100%;height:100%;opacity:.55;pointer-events:none;border-radius:20px}
.appcta .phone{width:132px;align-self:end;margin:-40px 0 0 10px;position:relative;
  -webkit-mask-image:linear-gradient(180deg,#000 75%,transparent);mask-image:linear-gradient(180deg,#000 75%,transparent);filter:drop-shadow(0 18px 30px rgba(255,42,58,.35))}
.appcta .t{position:relative;padding:22px 0}
.appcta .eyebrow{font-size:11px}
.appcta h2{font-size:24px;font-weight:800;letter-spacing:-.4px;line-height:1.2;margin:6px 0 6px}
.appcta p{color:#c9ccd6;font-size:13.5px;max-width:460px}
.appcta .acts{position:relative;display:grid;gap:10px;justify-items:stretch}
.appcta .acts .btn{height:44px}
.appcta .store{gap:10px}
.appcta .storebtn{height:44px;padding:0 13px}
.appcta .storebtn span{font-size:14px}
.appcta .rate{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--mute);justify-content:center}
.appcta .rate .ic{width:13px;height:13px;color:#ffb547;fill:currentColor}
@media (max-width:1100px){.pricing-x{grid-template-columns:1fr}.pricing-x>div:first-child{text-align:center}.pricing-x .perks{grid-template-columns:repeat(3,auto);justify-content:center}}
@media (max-width:900px){.appcta{grid-template-columns:120px 1fr;padding:0 22px}.appcta .phone{width:120px;margin-top:-30px}.appcta .acts{grid-column:1/-1;padding-bottom:22px;grid-template-columns:1fr 1fr}.appcta .acts .store{grid-column:1/-1;justify-content:center}}
@media (max-width:640px){.appcta{grid-template-columns:1fr;text-align:center}.appcta .phone{margin:-30px auto 0}.appcta .t{padding:6px 0 0}.appcta p{margin:auto}.appcta .acts{grid-template-columns:1fr}.pricing-x .perks{grid-template-columns:1fr;justify-content:start}}

/* ---- extra pages ---- */
.chip{display:inline-flex;font-size:12px;font-weight:600;padding:6px 14px;border-radius:30px;border:1px solid var(--line);background:var(--panel);color:#d7d9e0}
.chip.on{background:var(--red);border-color:var(--red);color:#fff}
.filters-x{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.intg{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.intg .card{padding:20px}
.ilogo{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;color:#fff;font-weight:800;font-size:14px;box-shadow:0 8px 18px rgba(0,0,0,.35)}
.itag{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--red);margin-top:12px}
.intg h3{margin-top:2px}
.hsearch{display:flex;align-items:center;gap:10px;max-width:560px;margin:18px auto 0;padding:6px 6px 6px 16px;border:1px solid var(--line2);border-radius:14px;background:#0d1018}
.hsearch input{flex:1;border:0;outline:0;background:none;font-size:14px;padding:8px 0}
.hsearch>span .ic{width:18px;height:18px;color:var(--mute)}
.timeline{display:grid;gap:16px;max-width:820px;margin:0 auto;position:relative}
.timeline::before{content:"";position:absolute;left:96px;top:6px;bottom:6px;width:1px;background:var(--line2)}
.tl{display:grid;grid-template-columns:110px 1fr;gap:26px;align-items:start}
.tl-d{text-align:right;position:relative;padding-top:18px}
.tl-d::after{content:"";position:absolute;right:-19px;top:23px;width:11px;height:11px;border-radius:50%;background:var(--red);box-shadow:0 0 0 4px rgba(255,42,58,.2)}
.tl-d b{display:block;font-size:17px} .tl-d small{color:var(--mute);font-size:12px}
.tl .itag{margin-top:0}
.sec-hx{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.sec-hx .itag{margin:0}
.jobs{display:grid;gap:10px}
.job{display:grid;grid-template-columns:1fr 220px 90px;align-items:center;gap:16px;padding:16px 20px;border:1px solid var(--line);border-radius:14px;background:var(--panel);transition:.2s}
.job:hover{border-color:var(--line2);transform:translateX(3px)}
.job b{display:block;font-size:15px} .job small{color:var(--mute);font-size:12px}
.job span{display:flex;align-items:center;gap:6px;font-size:13px;color:#cfd2dc}
.job span .ic{width:15px;height:15px}
.job .red{justify-content:flex-end;font-weight:700;color:var(--red)}
.code{background:#07080e;border:1px solid var(--line);border-radius:16px;padding:22px;font:12.5px/1.7 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#e6e7eb;overflow:auto;box-shadow:0 24px 60px rgba(0,0,0,.45)}
.code .c{color:#6b7184} .code .s{color:#ff8a93}
.okbar{display:flex;align-items:center;gap:12px;padding:18px 22px;border-radius:14px;background:rgba(74,222,128,.08);border:1px solid rgba(74,222,128,.3);margin-bottom:16px}
.okbar .ic{color:#4ade80;width:24px;height:24px} .okbar b{font-size:16px} .okbar small{margin-left:auto;color:var(--mute)}
.svc{display:grid;gap:10px}
.srow{display:grid;grid-template-columns:220px 1fr 100px;align-items:center;gap:18px;padding:14px 18px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.srow b{display:block;font-size:14px} .srow small{color:var(--mute);font-size:11.5px}
.bars{display:flex;gap:2px;height:26px}
.bars i{flex:1;background:#2fbf71;border-radius:2px;opacity:.85}
.bars i.warn{background:#f5a524}
.srow .ok{color:#4ade80;font-size:12.5px;font-weight:700;text-align:right}
.post-full{max-width:820px}
.post-full h1{font-size:36px;font-weight:800;letter-spacing:-.6px;line-height:1.15;margin:8px 0 10px}
.post-full>img{width:100%;border-radius:18px;margin:24px 0}
.prose h2{font-size:20px;font-weight:800;margin:24px 0 6px}
.prose p{color:#cfd2dc;font-size:15px;line-height:1.75}
@media (max-width:1100px){.intg{grid-template-columns:repeat(3,1fr)}}
@media (max-width:900px){.intg{grid-template-columns:1fr 1fr}.job{grid-template-columns:1fr auto}.job span:not(.red){display:none}.srow{grid-template-columns:1fr}.bars{order:3}}
@media (max-width:640px){.intg{grid-template-columns:1fr}.tl{grid-template-columns:1fr}.timeline::before,.tl-d::after{display:none}.tl-d{text-align:left;padding:0}.post-full h1{font-size:28px}.okbar{flex-wrap:wrap}.okbar small{margin:0}}


/* ─── Akon One platform bar ───────────────────────────────────────────────
   Shared chrome across all 16 app sites. Self-contained on purpose: no site
   token is referenced, so it renders identically whatever the app's palette.
   ------------------------------------------------------------------------ */
.akon1{--a1-ink:#0b0b0b;--a1-red:#e31b23;--a1-dim:rgba(255,255,255,.62);
  background:var(--a1-ink);color:#fff;font-size:12.5px;line-height:1;
  border-bottom:1px solid rgba(255,255,255,.08)}
.akon1 .akon1-in{max-width:1200px;margin:0 auto;padding:0 20px;
  display:flex;align-items:center;gap:18px;min-height:40px;flex-wrap:wrap}
.akon1 a{color:inherit;text-decoration:none}
.akon1-brand{display:inline-flex;align-items:center;gap:8px;font-weight:600;letter-spacing:.01em}
.akon1-mark{display:grid;place-items:center;width:20px;height:20px;flex:none;
  background:var(--a1-red);color:#fff;font-size:9.5px;font-weight:800;letter-spacing:-.02em}
.akon1-sep{color:var(--a1-dim)}
.akon1-tag{color:var(--a1-dim)}
.akon1-links{margin-left:auto;display:inline-flex;align-items:center;gap:16px}
.akon1-links a{color:var(--a1-dim);transition:color .2s}
.akon1-links a:hover{color:#fff}
.akon1-cta{display:inline-flex;align-items:center;gap:6px;
  background:var(--a1-red);color:#fff!important;padding:7px 13px;font-weight:600;border-radius:6px;
  transition:filter .2s}
.akon1-cta:hover{filter:brightness(1.1)}
@media(max-width:760px){
  /* One row only: the tagline and secondary links drop out so the strip stays
     ~40px and never pushes the site's own header down the page. */
  .akon1 .akon1-in{flex-wrap:nowrap;min-height:38px;padding:0 14px;gap:10px}
  .akon1-tag,.akon1-sep{display:none}
  .akon1-links{margin-left:auto;gap:10px}
  .akon1-links a:not(.akon1-cta){display:none}
  .akon1-cta{padding:6px 11px;font-size:12px;white-space:nowrap}
  .akon1-brand{font-size:12.5px;white-space:nowrap}
}

/* Footer strip: the same relationship, restated where people look for it. */
.akon1-foot{border-top:1px solid rgba(127,127,127,.22);margin-top:28px;padding:18px 0 4px;
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:13px;opacity:.9}
.akon1-foot .akon1-mark{width:22px;height:22px;font-size:10px}
.akon1-foot a{text-decoration:underline;text-underline-offset:2px}