:root{
  --bg:#08070f;
  --bg-2:#0d0c1a;
  --panel:#13122180;
  --line:#ffffff14;
  --text:#eef0ff;
  --muted:#9aa0c0;
  --brand:#ff7a3d;
  --brand-2:#ffb454;
  --grad:linear-gradient(135deg,#ff5e1f 0%,#ff9d3d 55%,#ffc266 100%);
  --radius:16px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg);
  color:var(--text);
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px}
.eyebrow{
  display:inline-block;
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:12px;
  font-weight:600;
  color:var(--brand-2);
  background:#ff7a3d14;
  padding:6px 12px;
  border-radius:999px;
  border:1px solid #ff7a3d44;
}
.eyebrow.center{display:block;text-align:center;margin:0 auto 14px;width:fit-content}
h1,h2,h3,h4{font-family:'Space Grotesk','Inter',sans-serif;letter-spacing:-.02em;margin:0}
h1{font-size:clamp(40px,5.6vw,72px);line-height:1.04;font-weight:700;margin:18px 0 18px}
.section-title{font-size:clamp(28px,3.4vw,44px);font-weight:700;margin:8px 0 32px;text-align:center}
.muted{color:var(--muted)}

/* nav */
.nav{position:sticky;top:0;z-index:50;backdrop-filter:blur(18px);background:#08070faa;border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;gap:24px;padding-top:16px;padding-bottom:16px}
.logo{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:20px;display:inline-flex;align-items:center;gap:10px}
.logo .dot{width:10px;height:10px;border-radius:3px;background:var(--grad);box-shadow:0 0 18px #ff7a3d88}
.logo .tld{color:var(--muted);font-weight:500}
.nav nav{display:flex;gap:22px;margin-left:auto;font-size:14px;color:var(--muted)}
.nav nav a:hover{color:var(--text)}
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:12px;font-weight:600;font-size:14px;border:1px solid transparent;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}
.btn-primary{background:var(--grad);color:#1a0e05;box-shadow:0 10px 30px -10px #ff7a3d88}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 16px 40px -12px #ff7a3daa}
.btn-ghost{background:#ffffff08;border:1px solid var(--line);color:var(--text)}
.btn-ghost:hover{background:#ffffff14}
.btn.big{padding:14px 24px;font-size:15px;border-radius:14px}
.lang-toggle{
  background:transparent;border:1px solid var(--line);color:var(--text);
  width:38px;height:32px;border-radius:8px;
  font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:12px;letter-spacing:.06em;
  cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease;
  display:inline-flex;align-items:center;justify-content:center;
}
.lang-toggle:hover{background:#ff7a3d18;border-color:#ff7a3d66;color:var(--brand-2)}

/* hero */
.hero{position:relative;padding:90px 0 80px;overflow:hidden}
.bg-grid{position:absolute;inset:0;background-image:linear-gradient(#ffffff09 1px,transparent 1px),linear-gradient(90deg,#ffffff09 1px,transparent 1px);background-size:46px 46px;mask-image:radial-gradient(ellipse 70% 50% at 50% 0%,#000 30%,transparent 80%);pointer-events:none}
.bg-glow{position:absolute;top:-200px;left:50%;transform:translateX(-50%);width:1100px;height:600px;background:radial-gradient(closest-side,#ff7a3d55,transparent 70%);filter:blur(20px);pointer-events:none}
.hero-grid{position:relative;display:grid;grid-template-columns:1.15fr 1fr;gap:60px;align-items:center}
.grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:18px;color:var(--muted);max-width:560px;margin:0 0 28px}
.cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:42px}
.trust{display:flex;gap:36px;border-top:1px solid var(--line);padding-top:22px;max-width:560px}
.trust div{display:flex;flex-direction:column}
.trust strong{font-family:'Space Grotesk',sans-serif;font-size:24px}
.trust span{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.12em}

/* hero mockups */
.hero-mock{display:flex;justify-content:center;align-items:center;gap:24px;position:relative;min-height:560px}

/* device tag (shared) */
.device-tag{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--grad);color:#1a0e05;font-size:11px;font-weight:700;padding:4px 12px;border-radius:999px;text-transform:uppercase;letter-spacing:.1em;white-space:nowrap;box-shadow:0 6px 18px -6px #ff7a3d99;z-index:5}
.device-tag.web{background:linear-gradient(135deg,#3aa9ff 0%,#5fc8ff 100%);color:#04141f;box-shadow:0 6px 18px -6px #3aa9ff99}

/* === TELEGRAM PHONE (authentic dark theme) === */
.device-tg{
  position:relative;width:270px;height:560px;border-radius:42px;
  background:#000;
  border:9px solid #1a1a1c;
  box-shadow:
    0 60px 120px -40px #000,
    0 0 0 1px #2a2a2c inset,
    0 0 0 11px #000;
  transform:rotate(-4deg) translateY(-10px);z-index:2;
  padding:0;overflow:hidden;
}
.device-island{position:absolute;top:8px;left:50%;transform:translateX(-50%);width:96px;height:26px;background:#000;border-radius:14px;z-index:5}
.tg-screen{width:100%;height:100%;border-radius:33px;overflow:hidden;background:#0e1621;display:flex;flex-direction:column;font-family:-apple-system,'SF Pro Text','Helvetica Neue','Inter',sans-serif;color:#fff;position:relative}

/* Status bar - iOS style with real-looking icons */
.tg-status{display:flex;justify-content:space-between;align-items:center;padding:14px 24px 6px;height:42px}
.tg-time-status{font-size:14px;font-weight:600;color:#fff;letter-spacing:-.01em}
.tg-status-icons{display:inline-flex;align-items:center;gap:5px}
.tg-status-icons svg{display:block}

/* Telegram header */
.tg-header{display:flex;align-items:center;gap:9px;background:#212d3b;padding:6px 10px 8px;color:#fff;position:relative;z-index:3;box-shadow:0 1px 0 #00000033}
.tg-back{font-size:26px;color:#5eb5f7;font-weight:300;line-height:1;padding:0 2px;margin-right:-2px}
.tg-avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#ff8e54,#e54e1c);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:14px;color:#fff;flex-shrink:0;letter-spacing:-.02em}
.tg-meta{flex:1;line-height:1.15;min-width:0;text-align:right;margin-right:6px}
.tg-name{font-size:14.5px;font-weight:600;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tg-online{font-size:11.5px;color:#7d8e9c;margin-top:1px}

/* Telegram chat — authentic dark wallpaper (deep navy/teal gradient with subtle abstract shapes) */
.tg-chat{
  flex:1;padding:8px 6px;display:flex;flex-direction:column;gap:2px;overflow:hidden;
  background:
    radial-gradient(ellipse 70% 50% at 30% 20%, #2a3d6d 0%, transparent 60%),
    radial-gradient(ellipse 60% 50% at 80% 70%, #1d4a5e 0%, transparent 55%),
    radial-gradient(ellipse 60% 50% at 50% 95%, #2c2a5a 0%, transparent 60%),
    linear-gradient(160deg,#1a1f3a 0%,#0e2030 50%,#1a2438 100%);
  position:relative;
}
/* Telegram default doodle wallpaper — hearts, stars, music notes, planes, kites, etc */
.tg-pattern{
  position:absolute;inset:0;pointer-events:none;opacity:.18;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240' viewBox='0 0 240 240' fill='%23ffffff'><g><path d='M30 28c-3-5 1-10 6-9 2 0 4 2 5 4 1-2 3-4 5-4 5-1 9 4 6 9-3 6-11 11-11 11s-8-5-11-11z'/><path d='M85 18l3 7 7 1-5 5 1 7-6-3-6 3 1-7-5-5 7-1z'/><path d='M138 30c-2 0-4 1-5 3 1-1 1-3 0-5-1-2-4-3-6-2-3 1-4 4-3 6l11 13 11-13c1-2 0-5-3-6-2-1-5 0-6 2-1 2-1 4 0 5-1-2-3-3-5-3z' opacity='.9'/><path d='M192 22c-1-1-3-1-4 0l-6 6c-1 1-1 3 0 4l6 6c1 1 3 1 4 0l6-6c1-1 1-3 0-4z'/><path d='M22 78c5-3 11-1 14 4l8 14-14 8c-5 3-11 1-14-4-3-5-1-11 4-14z'/><circle cx='75' cy='80' r='7'/><circle cx='75' cy='80' r='3' fill='none' stroke='%23ffffff' stroke-width='2'/><path d='M120 70l4 9 9 1-7 7 2 9-8-5-8 5 2-9-7-7 9-1z'/><path d='M170 75c0-4 3-7 7-7s7 3 7 7v8h2c2 0 3 2 2 4l-4 8c-1 2-3 3-5 3h-4c-2 0-4-1-5-3l-4-8c-1-2 0-4 2-4h2z'/><path d='M218 72l-2 14h2l-1 7 7-12h-3l3-9z'/><path d='M30 130c0-2 2-4 4-4h12c2 0 4 2 4 4v3l-3 1v9c0 1-1 2-2 2h-10c-1 0-2-1-2-2v-9l-3-1z'/><path d='M88 122c-3 0-5 2-5 5v8c0 1 1 2 2 2 1 0 2-1 2-2v-7h2v9c0 1 1 2 2 2s2-1 2-2v-9h2v7c0 1 1 2 2 2s2-1 2-2v-8c0-3-2-5-5-5z'/><path d='M138 125l-8 16h4v8l8-16h-4v-8z'/><path d='M180 122l4 8 8 1-6 6 1 8-7-4-7 4 1-8-6-6 8-1z'/><path d='M218 130c-2-2-6-2-8 0l-2 2-2-2c-2-2-6-2-8 0s-2 6 0 8l10 10 10-10c2-2 2-6 0-8z' opacity='.85'/><path d='M22 178c-1 0-2 1-2 2v8c0 1 1 2 2 2h16c1 0 2-1 2-2v-8c0-1-1-2-2-2zm0 4h16v6h-16z'/><path d='M75 175c-4 0-7 3-7 7s3 7 7 7 7-3 7-7-3-7-7-7zm0 3a4 4 0 110 8 4 4 0 010-8z'/><path d='M125 174c-1 0-2 0-2 1l-7 14c0 1 0 2 1 2h14c1 0 2-1 1-2l-7-14c0-1-1-1-2-1z' opacity='.9'/><path d='M165 178l-3 14 14-3-3-3 6-6-3-3-6 6z'/><circle cx='215' cy='185' r='4'/><circle cx='205' cy='180' r='2'/><circle cx='225' cy='180' r='2'/><circle cx='205' cy='190' r='2'/><circle cx='225' cy='190' r='2'/><path d='M30 222c2 0 4-2 4-4 0-1-1-2-2-3l-2-2-2 2c-1 1-2 2-2 3 0 2 2 4 4 4z'/><path d='M82 218c-3-3-8-3-11 0s-3 8 0 11l11 11 11-11c3-3 3-8 0-11s-8-3-11 0z' opacity='.85'/><path d='M132 215l-5 5c-1 1-1 3 0 4l5 5c1 1 3 1 4 0l5-5c1-1 1-3 0-4l-5-5c-1-1-3-1-4 0z'/><path d='M180 215l3 7 7 1-5 5 1 7-6-3-6 3 1-7-5-5 7-1z'/><path d='M218 222c-1-1-3-1-4 0l-3 3 3 3c1 1 3 1 4 0l3-3z'/></g></svg>");
  background-size:240px 240px;
  background-repeat:repeat;
}

/* Service message pill */
.tg-date{align-self:center;background:#1f2c3aaa;color:#fff;font-size:11px;font-weight:500;padding:3px 11px;border-radius:11px;margin:6px 0;backdrop-filter:blur(6px);position:relative;z-index:2}

/* Telegram-style bubbles with proper tails */
.tg-msg{
  position:relative;z-index:2;
  padding:5px 9px 16px;font-size:13px;line-height:1.32;
  max-width:75%;color:#fff;
  box-shadow:0 1px 1px #00000040;
  word-wrap:break-word;
}
.tg-msg.in{
  background:#182533;
  align-self:flex-start;
  margin-left:8px;
  border-radius:12px 12px 12px 4px;
}
.tg-msg.in:first-of-type,.tg-msg.in + .tg-msg.in{border-radius:12px 12px 12px 12px}
.tg-msg.in:last-child,.tg-msg.in:has(+ .tg-msg.out),.tg-msg.in + .tg-msg.out{border-bottom-left-radius:4px}
/* tail for first .in in a group */
.tg-msg.in:first-child:before,
.tg-msg.in:not(.in + .in):before{
  content:"";position:absolute;left:-6px;bottom:0;width:10px;height:14px;
  background:#182533;
  clip-path:polygon(100% 0, 100% 100%, 0 100%);
  border-bottom-left-radius:8px;
}
.tg-msg.out{
  background:#2b5278;
  align-self:flex-end;
  margin-right:8px;
  border-radius:12px 12px 4px 12px;
}
.tg-msg.out:before{
  content:"";position:absolute;right:-6px;bottom:0;width:10px;height:14px;
  background:#2b5278;
  clip-path:polygon(0 0, 0 100%, 100% 100%);
  border-bottom-right-radius:8px;
}
.tg-msg b{font-weight:600}
.tg-time{position:absolute;right:8px;bottom:3px;font-size:10px;color:#7d8e9c;font-weight:400;display:inline-flex;align-items:center;gap:2px;line-height:1}
.tg-msg.out .tg-time{color:#7fc1ee}
.tg-msg.out .tg-time i{font-style:normal;color:#5fc8ff;font-weight:600;font-size:11px;margin-left:2px;letter-spacing:-2px}

/* Telegram reply keyboard (the buttons that show up below messages, above input) */
.tg-keyboard{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:#17212b;padding:6px 6px 4px;border-top:1px solid #ffffff08}
.tg-keyboard button{background:#2a3a4d;color:#fff;border:0;border-radius:6px;padding:8px 6px;font-size:12px;font-weight:500;font-family:inherit;cursor:pointer;text-align:center}
.tg-keyboard button:hover{background:#34465c}

/* Telegram input bar */
.tg-input{display:flex;align-items:center;gap:10px;background:#17212b;padding:8px 14px 10px;color:#7d8e9c;font-size:14px}
.tg-emoji,.tg-clip,.tg-mic{font-size:18px;line-height:1;cursor:default}
.tg-placeholder{flex:1;color:#7d8e9c;font-size:14px;font-weight:400}

/* === WEBSITE CHAT WIDGET === */
.widget{
  position:relative;width:300px;height:520px;border-radius:18px;
  background:#fff;color:#1a1f2e;
  box-shadow:0 60px 120px -40px #000,0 20px 40px -20px #00000080,0 0 0 1px #00000010;
  transform:rotate(4deg) translateY(20px);z-index:1;
  display:flex;flex-direction:column;overflow:hidden;
  font-family:'Inter',-apple-system,sans-serif;
}
.widget-head{display:flex;align-items:center;gap:12px;padding:16px 16px 14px;background:linear-gradient(135deg,#3aa9ff,#1f7fd6);color:#fff;position:relative}
.widget-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#ff7a3d,#ff5e1f);position:relative;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:14px}
.widget-avatar:after{content:"M";position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.widget-online{position:absolute;bottom:-2px;right:-2px;width:11px;height:11px;border-radius:50%;background:#22c55e;border:2px solid #fff;z-index:2}
.widget-title{font-size:14px;font-weight:700;line-height:1.2}
.widget-sub{font-size:11px;opacity:.9;margin-top:2px}
.widget-actions{margin-left:auto;display:flex;gap:10px;color:#fff;font-size:18px;line-height:1;cursor:default}
.widget-actions span{opacity:.85}
.widget-body{flex:1;background:#f5f7fb;padding:14px 12px;overflow:hidden;display:flex;flex-direction:column;gap:8px}
.widget-day{align-self:center;font-size:10.5px;color:#8b94a8;font-weight:500;margin-bottom:4px}
.widget-row{display:flex;gap:6px;align-items:flex-end}
.widget-row.out{justify-content:flex-end}
.widget-mini{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#ff7a3d,#ff5e1f);flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:10px;font-weight:700}
.widget-mini:empty{visibility:hidden}
.widget-bub{background:#fff;color:#1a1f2e;font-size:12.5px;line-height:1.4;padding:9px 12px;border-radius:14px;border-top-left-radius:4px;max-width:78%;box-shadow:0 1px 2px #00000010;border:1px solid #00000008}
.widget-bub.me{background:linear-gradient(135deg,#3aa9ff,#1f7fd6);color:#fff;border-top-right-radius:4px;border-top-left-radius:14px;border:0}
.widget-quick{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.widget-quick button{background:#fff;color:#1f7fd6;border:1px solid #3aa9ff55;border-radius:10px;padding:7px 12px;font-size:12px;font-weight:600;text-align:left;cursor:pointer;font-family:inherit;transition:background .12s}
.widget-quick button:hover{background:#eaf5ff}
.widget-input{display:flex;align-items:center;gap:8px;padding:10px 12px;background:#fff;border-top:1px solid #00000010}
.widget-input input{flex:1;border:0;outline:0;font:inherit;font-size:13px;color:#1a1f2e;padding:6px 0;background:transparent}
.widget-input input::placeholder{color:#9aa3b5}
.widget-send{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#3aa9ff,#1f7fd6);color:#fff;border:0;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 4px 10px -2px #3aa9ff66}
.widget-foot{text-align:center;font-size:10.5px;color:#8b94a8;padding:6px 0 8px;background:#fff;border-top:1px solid #00000008}
.widget-foot b{color:var(--brand);font-weight:700}

/* sections */
.section{padding:100px 0;position:relative}
.section.alt{background:linear-gradient(180deg,#0a0915,#08070f);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}

/* services cards */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:26px;transition:transform .2s ease,border-color .2s ease,background .2s ease}
.card:hover{transform:translateY(-3px);border-color:#ff7a3d55;background:#1a130c80}
.icon{width:44px;height:44px;border-radius:12px;background:#ff7a3d22;border:1px solid #ff7a3d44;display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:14px}
.card h3{font-size:18px;margin-bottom:8px}
.card p{color:var(--muted);font-size:14.5px;margin:0}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:5px 10px;border-radius:999px;border:1px solid var(--line);color:var(--text)}
.chip-tg{background:#229ED914;border-color:#229ED944;color:#5fc8ff}
.chip-vb{background:#665CAC14;border-color:#7e6cff44;color:#a78bff}
.chip-wa{background:#25D36614;border-color:#25D36644;color:#5fe89b}

/* why */
.why-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center}
.why-grid .section-title{text-align:left;margin-top:14px}
.checks{list-style:none;padding:0;margin:18px 0 0}
.checks li{position:relative;padding:10px 0 10px 30px;color:#d4d8f0;border-bottom:1px solid var(--line)}
.checks li:before{content:"";position:absolute;left:0;top:14px;width:18px;height:18px;border-radius:50%;background:var(--grad);box-shadow:0 0 10px #ff7a3d88}
.checks li:after{content:"✓";position:absolute;left:4px;top:9px;font-size:13px;color:#1a0e05;font-weight:800}
.checks.two-col{display:grid;grid-template-columns:repeat(2,1fr);gap:0 24px}
.compare{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.compare-card{padding:22px;border-radius:var(--radius);border:1px solid var(--line);background:var(--panel)}
.compare-card h4{font-size:14px;text-transform:uppercase;letter-spacing:.16em;color:var(--muted);margin-bottom:14px}
.compare-card ul{list-style:none;padding:0;margin:0}
.compare-card li{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}
.compare-card li:last-child{border:0}
.compare-card.us{border-color:#ff7a3d66;background:linear-gradient(180deg,#ff7a3d18,#ffb45414)}
.compare-card.us b{color:var(--brand-2)}

/* pricing */
.center-block{text-align:center;margin:-18px auto 40px;max-width:560px}
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:8px}
.plans-4{grid-template-columns:repeat(4,1fr);gap:14px}
.plan{background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:32px 28px;display:flex;flex-direction:column;position:relative;transition:transform .2s ease,border-color .2s ease}
.plan:hover{transform:translateY(-3px);border-color:#ff7a3d44}
.plan-head h3{font-size:20px;margin-bottom:6px}
.plan-head p{color:var(--muted);font-size:14px;margin:0 0 20px;min-height:42px}
.plan-price{display:flex;align-items:baseline;gap:6px;margin-top:6px}
.plan-price .num{font-family:'Space Grotesk',sans-serif;font-size:48px;font-weight:700;line-height:1}
.plan-price .per{color:var(--muted);font-size:14px}
.plan-setup{font-size:12.5px;color:var(--muted);margin:6px 0 22px;text-transform:uppercase;letter-spacing:.08em}
.plan .checks{margin:0 0 26px;flex:1}
.plan .checks li{font-size:14px;padding:9px 0 9px 28px}
.plan .checks li:before{top:13px;width:16px;height:16px}
.plan .checks li:after{top:9px;left:3px;font-size:11px}
.plan .btn{width:100%;justify-content:center}
.plan-featured{background:linear-gradient(180deg,#ff7a3d18,#13122180);border-color:#ff7a3d66;box-shadow:0 30px 60px -30px #ff7a3d55}
.plan-featured:before{content:"";position:absolute;inset:-1px;border-radius:22px;padding:1px;background:var(--grad);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;opacity:.6}
.plan-featured .plan-price .num{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.plan-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--grad);color:#1a0e05;font-size:11px;font-weight:700;padding:5px 14px;border-radius:999px;text-transform:uppercase;letter-spacing:.12em;white-space:nowrap;box-shadow:0 8px 20px -6px #ff7a3daa}
.plan-badge.season{background:linear-gradient(135deg,#ffd166 0%,#ffb454 50%,#ff9d3d 100%);color:#3a1f00;box-shadow:0 8px 20px -6px #ffb45499}
.plan-summer{background:linear-gradient(180deg,#ffb45418,#13122180);border-color:#ffd16655;position:relative}
.plan-summer:after{content:"";position:absolute;top:20px;right:20px;width:90px;height:90px;border-radius:50%;background:radial-gradient(circle,#ffd16633 0%,transparent 70%);pointer-events:none;z-index:0}
.plan-summer > *{position:relative;z-index:1}
.plan-summer .plan-price .num{color:#ffd166}
.addon{display:flex;align-items:center;justify-content:space-between;gap:24px;background:var(--panel);border:1px dashed #ff7a3d55;border-radius:18px;padding:22px 28px;margin-top:22px}
.addon h4{font-size:16px;margin-bottom:4px}
.addon p{margin:0;font-size:14px}
.addon-price{display:flex;align-items:baseline;gap:6px;flex-shrink:0}
.addon-price .num{font-family:'Space Grotesk',sans-serif;font-size:32px;font-weight:700;color:var(--brand-2)}
.addon-price .per{color:var(--muted);font-size:13px}
.yearly-note{text-align:center;color:var(--muted);font-size:14px;margin-top:24px}
.yearly-note:before{content:"💰 ";font-size:16px}

/* contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
.contact-grid .section-title{text-align:left}
.contact-line{font-size:16px;color:var(--text);margin:6px 0}
.form{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:28px;display:flex;flex-direction:column;gap:14px}
.form label{display:flex;flex-direction:column;font-size:13px;color:var(--muted);gap:6px;font-weight:500}
.form input,.form textarea,.form select{background:#0a0915;border:1px solid var(--line);border-radius:10px;color:var(--text);padding:12px 14px;font:inherit;font-size:14.5px;outline:none;transition:border-color .15s ease;font-family:inherit}
.form input:focus,.form textarea:focus,.form select:focus{border-color:#ff7a3d88}
.form textarea{resize:vertical}
.form select{appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='%239aa0c0'><path d='M1 1l5 5 5-5'/></svg>");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px;cursor:pointer}
.form select option{background:#0a0915;color:var(--text)}
.row-2-form{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-note{font-size:12.5px;text-align:center;margin:4px 0 0}

/* How it works steps */
.how-it-works{margin-top:28px;padding:20px;background:var(--panel);border:1px solid var(--line);border-radius:14px}
.how-it-works h4{font-size:14px;text-transform:uppercase;letter-spacing:.14em;color:var(--brand-2);margin-bottom:14px}
.how-it-works ol{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.how-it-works li{font-size:14px;color:#d4d8f0;line-height:1.5}
.how-it-works li b{color:var(--brand);font-family:'Space Grotesk',sans-serif;margin-right:6px}

/* Contact-line links */
.contact-line a{color:var(--text);transition:color .15s ease}
.contact-line a:hover{color:var(--brand-2)}

/* footer */
.foot{padding:30px 0;border-top:1px solid var(--line);background:#06050d}
.foot-row{display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:13px}

/* responsive */
@media (max-width:1280px){
  .plans-4{grid-template-columns:repeat(2,1fr);gap:18px}
}
@media (max-width:900px){
  .hero-grid,.why-grid,.contact-grid{grid-template-columns:1fr;gap:40px}
  .cards,.plans{grid-template-columns:1fr 1fr}
  .hero-mock{order:-1}
  .nav nav{display:none}
  .addon{flex-direction:column;align-items:flex-start;text-align:left}
}
@media (max-width:560px){
  .cards,.plans{grid-template-columns:1fr}
  .compare{grid-template-columns:1fr}
  .checks.two-col{grid-template-columns:1fr}
  .trust{flex-wrap:wrap;gap:18px}
  .foot-row{flex-direction:column}
  .hero-mock{flex-direction:column;gap:40px;min-height:auto}
  .device-tg,.widget{transform:none}
  .row-2-form{grid-template-columns:1fr}
}


/* ── Brand channel logos + Messenger chip ─────────────────────────── */
.chip svg{width:14px;height:14px;display:block;flex-shrink:0}
.chip-ms{background:#0084FF14;border-color:#0084FF55;color:#6cb6ff}

/* ── Launch offer on the custom-website add-on ────────────────────── */
.addon-price{flex-direction:column;align-items:flex-end;gap:2px}
.addon-price .was{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:600;color:var(--muted);text-decoration:line-through;line-height:1}
.addon-price .now{display:flex;align-items:baseline;gap:6px}
.addon-badge{display:inline-block;margin-top:10px;background:#ff7a3d22;border:1px solid #ff7a3d66;color:#ffb38a;font-size:12px;font-weight:700;padding:4px 11px;border-radius:999px}

/* ── Footer social links ──────────────────────────────────────────── */
.foot-social{display:flex;gap:12px;align-items:center}
.foot-social a{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;border-radius:50%;border:1px solid var(--line);color:var(--muted);transition:.2s ease}
.foot-social a:hover{color:#fff;border-color:var(--brand-2);transform:translateY(-2px)}
.foot-social svg{width:17px;height:17px;display:block}
@media(max-width:760px){.foot-row{align-items:flex-start}}

/* ═══════════════ PREMIUM VISUAL UPGRADE ═══════════════ */
/* Logo ring mark */
.logo-mark{display:inline-flex;align-items:center;justify-content:center;filter:drop-shadow(0 3px 12px #ff7a3d77)}
.logo-mark svg{display:block}
.logo:hover .logo-mark{filter:drop-shadow(0 3px 18px #ff7a3daa)}

/* Glassy depth + richer hover on feature cards */
.card{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 1px 0 #ffffff0d,0 22px 44px -30px #000}
.card:hover{transform:translateY(-6px);border-color:#ff7a3d66;box-shadow:inset 0 1px 0 #ffffff1a,0 34px 60px -28px #ff7a3d3a}
.card .icon{transition:transform .28s cubic-bezier(.34,1.56,.64,1)}
.card:hover .icon{transform:scale(1.14) rotate(-5deg)}

/* Plans: deeper lift + featured gradient-border pulse */
.plan{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 22px 50px -34px #000}
.plan:hover{transform:translateY(-7px);box-shadow:0 34px 64px -30px #ff7a3d40}
.plan-featured:hover{transform:translateY(-11px)}
.plan-featured::before{opacity:1;animation:ofBorderPulse 3.6s ease-in-out infinite}
@keyframes ofBorderPulse{0%,100%{opacity:.5}50%{opacity:1}}

/* Section title — gradient accent bar */
.section-title::after{content:"";display:block;width:56px;height:3px;margin:18px auto 0;border-radius:3px;background:var(--grad);box-shadow:0 0 18px #ff7a3d88}

/* Eyebrow soft halo */
.eyebrow{box-shadow:0 0 26px -10px #ff7a3d88}

/* Animated hero glow */
.bg-glow{animation:ofGlow 7.5s ease-in-out infinite}
@keyframes ofGlow{0%,100%{opacity:.8;transform:translateX(-50%) scale(1)}50%{opacity:1;transform:translateX(-50%) scale(1.07)}}

/* Primary button sheen on hover */
.btn-primary{position:relative;overflow:hidden}
.btn-primary::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(90deg,transparent,#ffffff70,transparent);transform:skewX(-20deg);transition:left .6s ease}
.btn-primary:hover::after{left:130%}

/* Compare 'us' card subtle glow */
.compare-card.us{box-shadow:0 24px 50px -32px #ff7a3d55}

/* Scroll-reveal */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s cubic-bezier(.22,1,.36,1)}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}.bg-glow,.plan-featured::before{animation:none}}