/* ==========================================================================
   Variant A — «دفتر» : sober practice page
   Restraint variant: hairlines instead of cards-with-shadows, ink buttons,
   orange kept for one mark and small accents only. No illustration, no mascot.
   ========================================================================== */

@font-face{font-family:'Vazirmatn';src:url('/fonts/Vazirmatn-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Vazirmatn';src:url('/fonts/Vazirmatn-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Vazirmatn';src:url('/fonts/Vazirmatn-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Vazirmatn';src:url('/fonts/Vazirmatn-Bold.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Vazirmatn';src:url('/fonts/Vazirmatn-ExtraBold.woff2') format('woff2');font-weight:800;font-display:swap}

:root{
  --paper:#fbfaf7;
  --surface:#fffefc;
  --ink:#1b1613;
  --body:#4d463f;
  --muted:#847b71;
  --line:#e2dcd2;
  --line-strong:#cfc7bb;
  --tint:#f4f0e8;
  --orange:#e2531c;
  --orange-ink:#c4470f;
  --mint:#137a6f;
  --radius:8px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Vazirmatn',system-ui,Tahoma,sans-serif;
  background:var(--paper);color:var(--body);
  font-size:16.5px;line-height:1.95;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
h1,h2,h3,h4{color:var(--ink);line-height:1.35;font-weight:700}
a{color:inherit;text-decoration:none}
ul{list-style:none}
::selection{background:var(--ink);color:#fff}
.ltr{direction:ltr;unicode-bidi:isolate}
.nb{white-space:nowrap}
.container{max-width:1120px;margin:0 auto;padding:0 28px}
.container.narrow{max-width:820px}
section{padding:88px 0;scroll-margin-top:84px}
section.alt{background:var(--surface);border-block:1px solid var(--line)}
section.band{background:var(--tint);border-block:1px solid var(--line)}

/* ---------- contact topbar ---------- */
.topbar{background:var(--ink);color:rgba(255,255,255,.76)}
.topbar-in{display:flex;align-items:center;gap:14px;padding-block:8px;font-size:12.5px}
.top-hours{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.top-sep{width:1px;height:12px;background:rgba(255,255,255,.22);flex:none}
.top-mail{color:inherit;border-bottom:1px solid transparent;padding-bottom:1px}
.top-mail:hover{color:#fffefb;border-bottom-color:rgba(255,255,255,.4)}
.top-phone{
  display:inline-flex;align-items:center;gap:7px;margin-inline-start:auto;
  color:#fffefb;font-weight:600;font-size:13px;
}
.top-phone svg{color:#f2926a}
.top-phone:hover{color:#fff}
.phone-num{direction:ltr;unicode-bidi:isolate;font-variant-numeric:tabular-nums;letter-spacing:.01em;white-space:nowrap}

/* ---------- header ---------- */
header{
  position:sticky;top:0;z-index:20;
  background:rgba(251,250,247,.94);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.nav{display:flex;align-items:center;gap:36px;padding-block:12px}
.nav-menu{display:none;position:relative;margin-inline-start:auto}
.nav-menu > summary{
  display:inline-flex;align-items:center;gap:7px;cursor:pointer;list-style:none;
  font-size:14px;font-weight:600;color:var(--ink);
  border:1px solid var(--line-strong);border-radius:6px;padding:8px 12px;
}
.nav-menu > summary::-webkit-details-marker{display:none}
.nav-menu[open] > summary{background:var(--tint)}
.nav-sheet{
  position:absolute;top:calc(100% + 6px);inset-inline-end:0;z-index:30;
  display:flex;flex-direction:column;min-width:196px;
  background:var(--surface);border:1px solid var(--line-strong);border-radius:8px;
  box-shadow:0 14px 34px rgba(27,22,19,.14);padding:6px;
}
.nav-sheet a{
  font-size:14.5px;color:#4d463f;padding:7px 10px;border-radius:4px;line-height:1.7;
}
.nav-sheet a:hover{background:var(--tint);color:var(--ink)}
.brand{display:flex;align-items:center;gap:10px;color:var(--ink)}
.brand-text{display:flex;flex-direction:column;gap:0;line-height:1.35}
.brand-name{font-size:19px;font-weight:800;letter-spacing:0}
.brand-tag{font-size:11.5px;font-weight:500;color:#665d54;line-height:1.4;white-space:nowrap}
.brand .logo{width:24px;height:24px;color:var(--orange)}
.nav-links{display:flex;gap:28px;margin-inline-start:auto;font-size:15px;font-weight:500;color:#5d554d}
.nav-links a{padding-block:4px;border-bottom:1px solid transparent}
.nav-links a:hover{color:var(--ink);border-bottom-color:var(--line-strong)}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:inherit;font-weight:600;font-size:15px;
  padding:11px 20px;border-radius:var(--radius);border:1px solid transparent;
  transition:background .16s ease,border-color .16s ease,color .16s ease;
  white-space:nowrap;
}
.btn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
/* channel CTAs are the loudest thing on a quiet page: colour = channel */
.btn-tg{
  background:var(--orange-ink);border-color:var(--orange-ink);color:#fff;
  font-weight:700;padding:12px 22px;font-size:15.5px;
  box-shadow:0 1px 0 rgba(27,22,19,.06);
}
.btn-tg:hover{background:#a83c0d;border-color:#a83c0d}
.btn-tg:active{background:#96340b}
.btn-bale{
  background:#e9f5f1;border-color:#a9d6c8;color:#0b6b58;
  font-weight:700;padding:12px 22px;font-size:15.5px;
}
.btn-bale:hover{background:#dcf0ea;border-color:#9fd3c4}
.btn-bale:active{background:#d2e9e2}
.btn-bale-dark{
  background:rgba(0,184,148,.16);border-color:rgba(0,184,148,.5);color:#8ee9d3;
  font-weight:700;padding:12px 22px;font-size:15.5px;
}
.btn-bale-dark:hover{background:rgba(0,184,148,.26)}

.text-link{
  display:inline-flex;align-items:center;gap:7px;
  font-size:14.5px;font-weight:600;color:var(--ink);
  border-bottom:1px solid var(--line-strong);padding-bottom:2px;
}
.text-link:hover{border-bottom-color:var(--ink)}
.text-link svg{color:var(--orange)}

/* ---------- hero ---------- */
.hero{padding:84px 0 80px}
.hero-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:64px;align-items:start}
.hero h1{
  font-size:clamp(32px,3.7vw,46px);line-height:1.34;font-weight:800;
  letter-spacing:-.002em;margin-bottom:22px;text-wrap:balance;
}
.hero h1 .mark{
  background-image:linear-gradient(transparent 66%,rgba(226,83,28,.22) 66%);
  background-repeat:no-repeat;background-size:100% 100%;
}
.lead{font-size:17.5px;line-height:2.05;color:#4a433c;max-width:33em;margin-bottom:30px}
.cta-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.micro{font-size:13.5px;line-height:1.9;color:var(--muted);margin-top:16px;max-width:36em}
.cta-email-line{
  display:flex;align-items:center;gap:8px;margin-top:14px;
  font-size:13.5px;color:#5a5248;
}
.cta-email-line svg{color:var(--muted);flex:none}
.cta-email-line a{color:#4d463f;border-bottom:1px solid var(--line-strong);padding-bottom:1px}
.cta-email-line a:hover{color:var(--ink);border-bottom-color:var(--ink)}
.cta-email-line.light{color:rgba(253,251,246,.74)}
.cta-email-line.light svg{color:rgba(253,251,246,.55)}
.cta-email-line.light a{color:#fdfbf6;border-bottom-color:rgba(255,255,255,.36)}
#start{scroll-margin-top:96px}
.hero .text-link{margin-top:22px}

/* ---------- chat demo (hero panel) ---------- */
.chat{
  background:var(--surface);border:1px solid var(--line);border-radius:10px;
  overflow:hidden;
}
.chat-head{
  display:flex;align-items:center;gap:11px;
  padding:13px 16px;border-bottom:1px solid var(--line);background:#faf7f1;
}
.chat-avatar{
  width:32px;height:32px;border-radius:50%;flex:none;
  background:var(--ink);color:#fffefb;
  display:flex;align-items:center;justify-content:center;
}
.chat-who{display:flex;flex-direction:column;line-height:1.5}
.chat-name{font-size:14px;font-weight:700;color:var(--ink)}
.chat-status{
  display:flex;align-items:center;gap:5px;
  font-size:11px;color:var(--muted);
}
.chat-status i{width:6px;height:6px;border-radius:50%;background:var(--mint);flex:none}
.chat-body{padding:18px 16px 20px;display:flex;flex-direction:column;gap:8px}
.bubble{
  max-width:82%;font-size:13.5px;line-height:1.85;color:#3f3830;
  padding:8px 12px;border-radius:12px;background:var(--tint);
  border-start-start-radius:4px;
}
.bubble.user{
  align-self:flex-end;background:#2a231e;color:#fdfbf6;
  border-start-start-radius:12px;border-start-end-radius:4px;
}
.bubble .meta{font-size:10.5px;color:#8c8177;margin-inline-start:5px;font-variant-numeric:tabular-nums}
.bubble.user .meta{color:rgba(253,251,246,.62)}
.bubble.file{
  display:flex;align-items:center;gap:11px;max-width:82%;
  background:var(--surface);border:1px solid var(--line-strong);
  border-start-start-radius:12px;padding:10px 12px;
}
.file-ico{color:var(--ink);opacity:.75;flex:none;display:flex}
.file-body{display:flex;flex-direction:column;min-width:0;line-height:1.5}
.file-body b{font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.file-body small{font-size:11px;color:var(--muted);margin-top:2px}
.chat-note{font-size:11.5px;color:var(--muted);margin-top:10px}

/* ---------- section heads ---------- */
.sec-head{max-width:46em;margin-bottom:44px}
.kicker{display:block;font-size:12.5px;font-weight:600;color:var(--orange-ink);margin-bottom:10px}
.sec-head h2{font-size:clamp(24px,2.6vw,31px);font-weight:700;line-height:1.45;margin-bottom:12px}
.sec-head p{font-size:16px;color:#595149;max-width:40em}

/* ---------- split (work division) ---------- */
.split{display:grid;grid-template-columns:1.35fr 1fr;gap:0;border-top:1px solid var(--line-strong)}
.split-col{padding:30px 0 0;border-inline-start:1px solid var(--line);padding-inline-start:34px}
.split-col:first-child{border-inline-start:0;padding-inline-start:0;padding-inline-end:34px}
.split-col h3{font-size:15px;font-weight:700;color:var(--ink);margin-bottom:16px}
.tick-list li{
  position:relative;padding-inline-start:20px;margin-bottom:12px;
  font-size:15.5px;line-height:1.95;
}
.tick-list li::before{
  content:"";position:absolute;inset-inline-start:0;top:13px;
  width:7px;height:7px;border-radius:1px;background:var(--orange);
}
.tick-list.quiet li::before{background:var(--line-strong)}
.split-note{font-size:13.5px;line-height:1.9;color:var(--muted);margin-top:18px;max-width:30em}

/* ---------- method pipeline ---------- */
.pipe{
  display:grid;grid-template-columns:repeat(6,1fr);gap:24px;
  list-style:none;
}
.pipe-card{
  position:relative;display:flex;flex-direction:column;
  background:var(--surface);border:1px solid var(--line);border-radius:7px;
  padding:13px 14px 15px;
}
/* flat chevron in the gap: flow runs right to left */
/* connector sits mid-height in the gap, so it reads as flow, not as a rule */
.pipe-card:not(:last-child)::before{
  content:"";position:absolute;top:calc(50% - .5px);inset-inline-end:-24px;
  width:24px;height:1px;background:#c1b8aa;
}
.pipe-card:not(:last-child)::after{
  content:"";position:absolute;top:calc(50% - 6px);inset-inline-end:-25px;
  width:13px;height:13px;z-index:1;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'><path d='M9 2 4 7l5 5' fill='none' stroke='%237a6f61' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/13px 13px no-repeat;
}
.pipe-head{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding-bottom:9px;border-bottom:1px solid var(--line);margin-bottom:11px;
}
.pipe-num{font-size:11.5px;font-weight:700;color:#6f665c;line-height:1.7;font-variant-numeric:tabular-nums}
.pipe-owner{
  font-size:11px;font-weight:700;line-height:1.6;
  padding:1px 7px;border-radius:3px;
  color:#8a3210;background:#fbeade;border:1px solid #ddbda9;
}
.pipe-owner.you{color:#fffefb;background:var(--ink);border-color:var(--ink)}
/* on the inverted card the chip has to invert too, or it disappears */
.pipe-card.you .pipe-owner.you{background:#fdfbf6;color:var(--ink);border-color:#fdfbf6}
.pipe-name{font-size:15px;font-weight:700;color:var(--ink);line-height:1.6;margin-bottom:6px}
.pipe-cap{font-size:13px;line-height:1.8;color:#57504a;text-wrap:pretty}
.pipe-out{
  margin-top:auto;padding-top:9px;border-top:1px solid var(--line);
  font-size:11px;color:var(--muted);
}
/* the client's step: inverted, so the handoff is the only dark block */
.pipe-card.you{background:var(--ink);border-color:var(--ink)}
.pipe-card.you .pipe-head{border-bottom-color:rgba(255,255,255,.18)}
.pipe-card.you .pipe-num{color:rgba(255,255,255,.55)}
.pipe-card.you .pipe-name{color:#fdfbf6}
.pipe-card.you .pipe-cap{color:rgba(253,251,246,.74)}
.pipe-card.you .pipe-out{color:rgba(253,251,246,.72);border-top-color:rgba(255,255,255,.24)}

/* ---------- deliverable ---------- */
.deliverable-grid{display:grid;grid-template-columns:520px 1fr;gap:56px;align-items:start}
.sheet{
  background:var(--surface);border:1px solid var(--line-strong);border-radius:4px;
  padding:26px 26px 22px;
}
.sheet-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;border-bottom:1px solid var(--line);padding-bottom:16px}
.sheet-kicker{font-size:10.5px;font-weight:600;color:var(--muted);margin-bottom:6px}
.sheet-head h3{font-size:22px;font-weight:700;line-height:1.4}
.sheet-role{font-size:12.5px;color:#6b6259;margin-top:3px}
.sheet-grade{text-align:center;border-inline-start:1px solid var(--line);padding-inline-start:16px;flex:none}
.sheet-grade small{display:block;font-size:10.5px;color:var(--muted);margin-bottom:2px}
.sheet-grade b{font-size:26px;font-weight:800;color:var(--mint);line-height:1.2}
.sheet-facts{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);
  margin:16px 0;border:1px solid var(--line);
}
.sheet-facts > div{background:var(--surface);padding:8px 10px}
.sheet-facts dt{font-size:10.5px;color:var(--muted);line-height:1.7}
.sheet-facts dd{font-size:12.5px;font-weight:600;color:var(--ink);line-height:1.7}
.sheet-block{margin-top:16px}
.sheet-block h4{font-size:11.5px;font-weight:700;color:#5f574e;margin-bottom:7px}
.sheet-block ul{list-style:none}
.sheet-block li{
  position:relative;padding-inline-start:13px;font-size:12.5px;line-height:1.85;
  color:#554e46;margin-bottom:4px;
}
.sheet-block li::before{content:"";position:absolute;inset-inline-start:0;top:9px;width:4px;height:4px;border-radius:50%;background:var(--line-strong)}
.sheet-foot{font-size:10.5px;line-height:1.8;color:var(--muted);margin-top:18px;padding-top:12px;border-top:1px solid var(--line)}

.deliverable-copy h3{font-size:16px;font-weight:700;margin-bottom:16px}
.deliverable-copy .text-link{margin-top:18px}

/* ---------- pricing (one offer, two rates by role) ---------- */
.offer{
  display:grid;grid-template-columns:1.06fr .94fr;
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);overflow:hidden;
}
.offer-rate{padding:26px 24px;border-inline-end:1px solid var(--line)}
.offer-what{padding:26px 24px;background:var(--tint)}
.offer-eyebrow{font-size:11.5px;font-weight:600;color:var(--orange-ink);margin-bottom:10px}
.rate-row{
  display:grid;grid-template-columns:1fr auto;column-gap:16px;row-gap:10px;
  align-items:center;padding:16px 0;border-top:1px solid var(--line);
}
.rate-row:first-of-type{border-top:0;padding-top:4px}
.rate-name{font-size:15.5px;font-weight:700;color:var(--ink);line-height:1.6}
.rate-for{font-size:12.5px;color:#6b6259;margin-top:2px}
.rate-price{
  font-size:25px;font-weight:800;color:var(--ink);line-height:1.2;
  display:flex;align-items:baseline;gap:5px;white-space:nowrap;
}
.rate-price small{font-size:12px;font-weight:500;color:var(--muted)}
.rate-row .btn{grid-column:1 / -1;justify-self:start;padding:8px 18px;font-size:13.5px}
.rate-row .btn-plan{width:auto}
.offer-what .tick-list li{font-size:14.5px;margin-bottom:11px}
.offer-note{
  font-size:12.5px;line-height:1.9;color:#6b6259;
  margin-top:18px;padding-top:14px;border-top:1px solid var(--line-strong);
}
.btn-plan{
  background:transparent;border-color:var(--line-strong);color:var(--ink);
  font-weight:600;justify-content:center;
}
.btn-plan:hover{background:var(--tint);border-color:#b8afa2}

/* ---------- faq ---------- */
.faq{border-top:1px solid var(--line-strong)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{
  display:flex;align-items:baseline;gap:12px;cursor:pointer;list-style:none;
  padding:17px 0;font-size:16px;font-weight:600;color:var(--ink);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{
  content:"";flex:none;width:9px;height:9px;margin-top:8px;
  border-inline-end:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);
  transform:rotate(45deg);transition:transform .2s ease;
}
.faq details[open] summary::before{transform:rotate(-135deg)}
.faq .a{font-size:15px;line-height:2;color:#595149;padding:0 21px 20px 0;max-width:44em}

/* ---------- closing ---------- */
.closing{background:var(--ink);padding:76px 0}
.closing-inner{max-width:44em}
.closing h2{color:#fdfbf6;font-size:clamp(23px,2.5vw,29px);line-height:1.5;margin-bottom:14px}
.closing p{color:rgba(253,251,246,.72);font-size:16px;line-height:2;margin-bottom:28px;max-width:34em}
.closing .cta-row{gap:10px}

/* ---------- footer ---------- */
footer{background:var(--paper);border-top:1px solid var(--line);padding:44px 0 40px}
.foot{display:grid;grid-template-columns:1.2fr .8fr 1fr;gap:40px;align-items:start}
.foot-brand p{font-size:13.5px;color:#6f665c;margin-top:10px;max-width:22em;line-height:1.9}
.foot-links{display:flex;flex-direction:column;gap:7px;font-size:14px;color:#5d554d}
.foot-links a:hover{color:var(--ink)}
.foot-contact{display:flex;flex-direction:column;gap:7px;font-size:13.5px;color:#6f665c;justify-self:end;text-align:start}
.foot-contact a:hover{color:var(--ink)}

/* ---------- contact page ---------- */
.page-hero{padding:64px 0 0}
.page-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:start}
.page-hero-copy h1{
  font-size:clamp(27px,3.2vw,38px);font-weight:800;line-height:1.4;
  margin-bottom:16px;max-width:16em;
}
.page-hero .lead{margin-bottom:26px;max-width:30em}
.page-hero .cta-email-line{margin-top:14px}

.quick-card{
  background:var(--surface);border:1px solid var(--line);border-radius:8px;
  padding:14px 20px 16px;
}
.quick-row{
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  padding:10px 0;border-bottom:1px solid #f0ebe3;
}
.quick-row:last-of-type{border-bottom:0}
.quick-row span{font-size:12.5px;color:var(--muted)}
.quick-row a{font-size:13.5px;font-weight:600;color:var(--ink)}
.quick-row a:hover{color:var(--orange-ink)}
.quick-note{
  font-size:11.5px;line-height:1.85;color:var(--muted);
  margin-top:8px;padding-top:11px;border-top:1px solid var(--line);
}

.prose p{font-size:15.5px;line-height:2.05;color:#4f4842;max-width:46em}
.prose p + p{margin-top:14px}

.chan-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(232px,1fr));gap:18px}
.chan-card{
  display:flex;flex-direction:column;gap:5px;
  background:var(--surface);border:1px solid var(--line);border-radius:8px;
  padding:18px 18px 14px;
}
.chan-card .ico{color:var(--ink);opacity:.7;margin-bottom:4px}
.chan-card h3{font-size:15.5px;font-weight:700;color:var(--ink)}
.chan-card .val{font-size:13.5px;font-weight:600;color:var(--ink)}
.chan-card .val a:hover{color:var(--orange-ink)}
.chan-card .desc{font-size:13px;line-height:1.9;color:#57504a}
.chan-card .go{
  margin-top:auto;padding-top:12px;border-top:1px solid var(--line);
  font-size:13px;font-weight:600;color:var(--ink);
}
.chan-card .go:hover{color:var(--orange-ink)}

.contact-note{margin-top:28px;font-size:13px;line-height:1.95;color:var(--muted);max-width:60em}
.contact-note p + p{margin-top:6px}

/* ---------- responsive ---------- */
@media (max-width:1000px){
  .nav-links{display:none}
  .page-hero{padding-top:44px}
  .page-hero-grid{grid-template-columns:1fr;gap:30px}
  .page-hero-copy h1{max-width:none}
  .nav-menu{display:block}
  .hero-grid{grid-template-columns:1fr;gap:40px}
  .chat-scene{max-width:480px}
  .pipe{grid-template-columns:repeat(3,1fr);gap:16px}
  .pipe-card:not(:last-child)::after{display:none}
  .split{grid-template-columns:1fr;border-top:1px solid var(--line-strong)}
  .split-col{border-inline-start:0;padding-inline:0;padding-block:26px;border-bottom:1px solid var(--line)}
  .split-col:first-child{padding-inline-end:0;border-bottom:1px solid var(--line)}
  .deliverable-grid{grid-template-columns:1fr;gap:36px}
  .foot{grid-template-columns:1fr;gap:26px}
  .foot-contact{justify-self:start;text-align:start}
}
@media (max-width:900px){
  .offer{grid-template-columns:1fr}
  .offer-rate{border-inline-end:0;border-bottom:1px solid var(--line)}
}
@media (max-width:640px){
  .page-hero{padding-top:36px}
  .chan-grid{grid-template-columns:1fr}
  .quick-card{padding:12px 16px 14px}
  body{font-size:16px}
  .container{padding:0 20px}
  section{padding:60px 0}
  .hero{padding-top:52px}
  .hero h1{font-size:30px;line-height:1.42}
  .lead{font-size:16px}
  .topbar-in{gap:10px;font-size:11.5px;padding-block:7px}
  .top-hours,.top-sep{display:none}
  .top-phone{order:-1;font-size:12px;margin-inline-start:0}
  .top-mail{margin-inline-start:auto}
  .nav{gap:12px}
  .brand .logo{width:22px;height:22px}
  .brand-tag{white-space:normal;max-width:112px;font-size:10px;line-height:1.4}
  .bubble{max-width:88%}
  .sheet{padding:20px}
  .sheet-facts{grid-template-columns:1fr}
  .btn{padding:11px 16px}
  .pipe{grid-template-columns:1fr;gap:12px}
  .plan-for{min-height:0}
  .cta-row .btn{flex:1 1 auto}
  .rate-price{font-size:22px}
}

@media (max-width:359px){
  .brand-tag{display:none}
  .nav{gap:8px}
}