/* webakademia — long-form service pages (RU / TM). Same tokens and type as the archive; own layout. */
:root{
  --bg:#f4f3f1; --bg-rgb:244,243,241; --ink:#0d0d0d; --muted:#8a8a86; --line:rgba(0,0,0,0.16);
  --text-2:rgba(13,13,13,0.62);
  --font:"Jost","Jost Fallback","Helvetica Neue",Arial,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  --text-xs:11px; --text-sm:13px; --text-base:15px; --text-lg:clamp(16px,1.2vw,19px);
  --gutter:2.4em; --max:1240px;
  --accent:#1f6a46; --accent-soft:rgba(31,106,70,0.09); --accent-on-ink:#8fd1aa;
}
@font-face{ font-family:"Jost"; font-style:italic; font-weight:300; font-display:swap; src:url("public/fonts/jost-italic-300-cyrillic.woff2") format("woff2"); unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face{ font-family:"Jost"; font-style:italic; font-weight:300; font-display:swap; src:url("public/fonts/jost-italic-300-latin-ext.woff2") format("woff2"); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:"Jost"; font-style:italic; font-weight:300; font-display:swap; src:url("public/fonts/jost-italic-300-latin.woff2") format("woff2"); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face{ font-family:"Jost"; font-style:italic; font-weight:400; font-display:swap; src:url("public/fonts/jost-italic-400-cyrillic.woff2") format("woff2"); unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face{ font-family:"Jost"; font-style:italic; font-weight:400; font-display:swap; src:url("public/fonts/jost-italic-400-latin-ext.woff2") format("woff2"); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:"Jost"; font-style:italic; font-weight:400; font-display:swap; src:url("public/fonts/jost-italic-400-latin.woff2") format("woff2"); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face{ font-family:"Jost"; font-style:normal; font-weight:300 600; font-display:swap; src:url("public/fonts/jost-normal-300-600-cyrillic.woff2") format("woff2"); unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face{ font-family:"Jost"; font-style:normal; font-weight:300 600; font-display:swap; src:url("public/fonts/jost-normal-300-600-latin-ext.woff2") format("woff2"); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face{ font-family:"Jost"; font-style:normal; font-weight:300 600; font-display:swap; src:url("public/fonts/jost-normal-300-600-latin.woff2") format("woff2"); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face{ font-family:"Jost Fallback"; src:local("Arial"), local("Helvetica Neue"); size-adjust:94%; ascent-override:98%; descent-override:30%; line-gap-override:0%; }
::selection{ background:var(--ink); color:var(--bg); }
:focus-visible{ outline:1.5px solid var(--ink); outline-offset:4px; }
*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ background:var(--bg); color:var(--ink); font-family:var(--font); -webkit-font-smoothing:antialiased; line-height:1.5; }
a{ color:inherit; text-decoration:none; }
img{ display:block; max-width:100%; height:auto; }
.skip{ position:absolute; left:-999px; top:0; background:var(--ink); color:var(--bg); padding:.6em 1em; z-index:100; }
.skip:focus{ left:1em; top:1em; }

/* header: same rhythm as the archive, sticky with the panel blur */
.p-header{ position:sticky; top:0; z-index:50; display:flex; align-items:center; justify-content:space-between; gap:1.5em;
  padding:1.4em var(--gutter); font-size:var(--text-sm); letter-spacing:0.03em; font-weight:500;
  background:rgba(var(--bg-rgb),0.86); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); }
.header-left{ display:flex; align-items:center; gap:3em; }
.brand{ display:flex; align-items:center; gap:10px; font-weight:500; font-size:15px; letter-spacing:0.01em; }
.brand-mark{ height:20px; width:auto; }
.p-nav{ display:flex; gap:2.2em; }
.p-nav a{ position:relative; opacity:0.62; transition:opacity .3s var(--ease); }
.p-nav a:hover, .p-nav a.is-active{ opacity:1; }
.p-nav a.is-active::after{ content:""; position:absolute; left:0; bottom:-6px; width:100%; height:1px; background:var(--ink); }
.header-right{ display:flex; align-items:center; gap:1.6em; }
.p-lang{ display:flex; align-items:center; gap:0.5em; }
.p-lang a, .p-lang span.cur{ opacity:0.4; transition:opacity .3s var(--ease); }
.p-lang a:hover, .p-lang span.cur{ opacity:1; }
.p-lang .sep{ opacity:0.4; }
.p-contact{ display:inline-flex; align-items:center; gap:0.3em; opacity:0.85; }
.p-contact:hover{ opacity:1; }
.link-icon{ width:12px; height:12px; stroke:currentColor; flex:none; }

main{ max-width:var(--max); margin:0 auto; padding:0 var(--gutter); }
.eyebrow{ font-size:var(--text-xs); letter-spacing:0.18em; text-transform:uppercase; color:var(--text-2); }
.hero{ padding:5.5em 0 0; display:grid; grid-template-columns:1.1fr 1fr; gap:2em 3.5em; align-items:end; }
.hero h1{ margin-top:1.1em; font-size:clamp(36px,4.6vw,66px); font-weight:400; line-height:1.04; letter-spacing:-0.03em; text-wrap:balance; }
.hero-side{ display:flex; flex-direction:column; gap:1.6em; }
.lead{ font-size:clamp(17px,1.25vw,19px); line-height:1.55; color:var(--text-2); max-width:30em; }
.lead strong{ font-weight:500; color:var(--ink); }
.actions{ display:flex; align-items:center; flex-wrap:wrap; gap:1em 2em; }
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:0.5em; min-height:48px; padding:0 1.5em; font:inherit; font-size:var(--text-base); font-weight:500;
  letter-spacing:0.01em; line-height:1; border:1px solid var(--ink); cursor:pointer; white-space:nowrap;
  transition:background-color .18s var(--ease), color .18s var(--ease), border-color .18s var(--ease), transform .18s var(--ease); }
.btn--primary{ background:var(--ink); color:var(--bg); }
.btn--primary:hover{ background:#2a2a2a; border-color:#2a2a2a; }
.btn:active{ transform:translateY(1px); }
.btn-link{ display:inline-flex; align-items:center; min-height:48px; font-size:var(--text-base); font-weight:500; letter-spacing:0.01em; color:var(--ink);
  border-bottom:1px solid var(--ink); line-height:1.2; padding-bottom:1px; transition:opacity .18s var(--ease); }
.btn-link:hover{ opacity:0.6; }
.btn-link .link-icon{ width:16px; height:16px; margin-left:0.35em; }

/* work strip: real sites right under the title */
.strip{ list-style:none; display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1.4em; margin-top:3.6em; }
.strip li a{ display:block; }
.strip img{ width:100%; aspect-ratio:16/10; object-fit:cover; background:#e7e6e3; border:1px solid rgba(255,255,255,0.65);
  filter:saturate(0.94); transition:filter .4s var(--ease), transform .6s var(--ease); }
.strip li a:hover img{ filter:none; transform:translateY(-2px); }
.strip figcaption{ margin-top:0.7em; display:flex; justify-content:space-between; gap:1em; font-size:var(--text-sm); }
.strip figcaption span:last-child{ color:var(--text-2); }

/* sections */
.sec{ margin-top:5.5em; padding-top:2.4em; border-top:1px solid var(--line); scroll-margin-top:4.2em; }
.plans-h3, .cta, .related{ scroll-margin-top:4.2em; }
.sec-head{ display:grid; grid-template-columns:1.1fr 1fr; gap:1.5em 3.5em; align-items:start; }
.sec h2{ font-size:clamp(28px,3vw,44px); font-weight:400; letter-spacing:-0.025em; line-height:1.08; text-wrap:balance; max-width:16em; }
.sec-intro{ font-size:var(--text-lg); line-height:1.6; color:var(--text-2); max-width:32em; }
.sec-intro p + p{ margin-top:1em; }
.prose{ margin-top:2.2em; max-width:38em; font-size:clamp(16px,1.2vw,18px); line-height:1.65; }
.prose p + p{ margin-top:1em; }
.prose a, .sec-intro a, .faq a{ border-bottom:1px solid var(--ink); padding-bottom:1px; }
.prose a:hover, .sec-intro a:hover, .faq a:hover{ opacity:0.6; }
.cards{ list-style:none; display:grid; grid-template-columns:repeat(3,1fr); gap:3em 3em; margin-top:3em; }
.cards.cols-2{ grid-template-columns:repeat(2,1fr); }
.cards li{ border-top:1px solid var(--line); padding-top:1.4em; display:flex; flex-direction:column; }
.cards .num{ font-size:var(--text-xs); letter-spacing:0.14em; color:var(--text-2); font-variant-numeric:tabular-nums; }
.cards h3{ margin-top:1.1em; font-size:clamp(21px,1.7vw,25px); font-weight:400; letter-spacing:-0.015em; line-height:1.15; text-wrap:balance; }
.cards p{ margin-top:0.6em; font-size:var(--text-base); line-height:1.6; color:var(--text-2); max-width:26em; }
.cards .scope{ margin-top:auto; padding-top:1.1em; font-size:var(--text-sm); color:var(--text-2); }
.checklist{ list-style:none; margin-top:2.6em; max-width:44em; counter-reset:c; }
.checklist li{ counter-increment:c; display:grid; grid-template-columns:3em 1fr; gap:1em; padding:1.05em 0; border-top:1px solid var(--line); font-size:clamp(16px,1.2vw,18px); line-height:1.5; }
.checklist li::before{ content:counter(c,decimal-leading-zero); font-size:var(--text-xs); letter-spacing:0.14em; color:var(--text-2); padding-top:0.5em; font-variant-numeric:tabular-nums; }
.checklist li strong{ font-weight:500; }
.checklist li span{ display:block; color:var(--text-2); font-size:var(--text-base); margin-top:0.2em; }
.stats{ list-style:none; display:grid; grid-template-columns:repeat(4,1fr); gap:2em; margin-top:3em; }
.stats li{ display:flex; flex-direction:column; }
.stat-num{ font-size:clamp(40px,4.4vw,60px); font-weight:400; letter-spacing:-0.03em; line-height:1; font-variant-numeric:tabular-nums; }
.stat-label{ margin-top:0.6em; font-size:15px; line-height:1.4; color:var(--text-2); max-width:14em; }
.faq{ margin-top:2.6em; max-width:46em; border-bottom:1px solid var(--line); }
.faq details{ border-top:1px solid var(--line); }
.faq summary{ list-style:none; cursor:pointer; padding:1.1em 0; display:flex; justify-content:space-between; align-items:baseline; gap:1.5em;
  font-size:clamp(17px,1.3vw,20px); line-height:1.3; letter-spacing:-0.01em; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; flex:none; font-size:1.2em; font-weight:300; color:var(--text-2); }
.faq details[open] summary::after{ content:"–"; }
.faq summary:hover{ color:var(--text-2); }
.faq .a{ padding:0 0 1.4em; max-width:38em; font-size:var(--text-base); line-height:1.65; color:var(--text-2); }
.faq .a p + p{ margin-top:0.8em; }
.proof{ list-style:none; display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:2.2em 2em; margin-top:3em; }
.proof img{ width:100%; aspect-ratio:16/10; object-fit:cover; background:#e7e6e3; border:1px solid rgba(255,255,255,0.65); }
.proof h3{ margin-top:0.9em; font-size:17px; font-weight:500; letter-spacing:-0.005em; }
.proof p{ margin-top:0.25em; font-size:var(--text-sm); color:var(--text-2); line-height:1.5; }
.proof a:hover img{ filter:saturate(1.05); }
.cta{ margin-top:6em; padding-top:2.6em; border-top:1px solid var(--line); display:grid; grid-template-columns:1.1fr 1fr; gap:1.4em 3.5em; align-items:start; }
.cta h2{ font-size:clamp(28px,3vw,44px); font-weight:400; letter-spacing:-0.025em; line-height:1.08; text-wrap:balance; max-width:16em; }
.cta .sec-intro{ max-width:30em; }
.cta .actions{ margin-top:1.6em; }
.channels{ list-style:none; margin-top:1.8em; display:flex; flex-direction:column; gap:0.55em; font-size:var(--text-lg); }
.channels li{ display:flex; align-items:baseline; gap:1em; }
.ch-label{ min-width:5.5em; font-size:var(--text-sm); color:var(--text-2); }
.channels a{ border-bottom:1px solid var(--ink); padding-bottom:1px; font-variant-numeric:tabular-nums; }
.note{ margin-top:1.4em; font-size:var(--text-sm); color:var(--text-2); max-width:34em; line-height:1.5; }
.related{ margin-top:5.5em; padding-top:2.4em; border-top:1px solid var(--line); }
.related ul{ list-style:none; display:grid; grid-template-columns:repeat(3,1fr); gap:1.6em 3em; margin-top:1.8em; }
.related li a{ display:flex; justify-content:space-between; gap:1em; align-items:baseline; padding:0.9em 0; border-top:1px solid var(--line); font-size:var(--text-lg); transition:opacity .2s var(--ease); }
.related li a:hover{ opacity:0.6; }
.related li a .link-icon{ width:14px; height:14px; }
.related small{ display:block; font-size:var(--text-sm); color:var(--text-2); margin-top:0.2em; }

/* packages: three fixed prices, the recommended one inverted (centre-stage), one green accent for gifts and the market comparison */
.plans{ list-style:none; display:grid; grid-template-columns:repeat(3,1fr); gap:1.6em; margin-top:3.2em; align-items:stretch; }
.plan{ position:relative; display:flex; flex-direction:column; padding:2.2em 1.8em 1.8em; border:1px solid var(--line); background:rgba(255,255,255,0.5); }
.plan.is-rec{ background:var(--ink); color:var(--bg); border-color:var(--ink); }
.plan.is-rec .plan-tag, .plan.is-rec .plan-for, .plan.is-rec .plan-items span, .plan.is-rec .plan-meta dt, .plan.is-rec .cur{ color:rgba(244,243,241,0.68); }
.plan-badge{ position:absolute; top:-0.9em; left:1.8em; background:var(--accent); color:#fff; font-size:var(--text-xs); letter-spacing:0.14em; text-transform:uppercase; padding:0.5em 0.85em; }
.plan-name{ font-size:clamp(24px,2vw,30px); font-weight:400; letter-spacing:-0.02em; line-height:1.1; }
.plan-tag{ margin-top:0.45em; font-size:var(--text-base); color:var(--text-2); line-height:1.4; }
.plan-price{ margin-top:1.1em; display:flex; align-items:baseline; gap:0.12em; font-size:clamp(42px,3.6vw,54px); font-weight:400; letter-spacing:-0.03em; line-height:1; font-variant-numeric:tabular-nums; }
.plan-price .cur{ font-size:0.5em; color:var(--text-2); }
.plan-for{ margin-top:1em; font-size:var(--text-sm); color:var(--text-2); line-height:1.5; }
.plan-upsell{ margin-top:1.1em; padding:0.75em 0.9em; background:var(--accent-soft); color:var(--accent); font-size:var(--text-sm); line-height:1.45; font-weight:500; }
.plan.is-rec .plan-upsell{ background:rgba(255,255,255,0.08); color:var(--accent-on-ink); }
.plan-items{ list-style:none; margin-top:1.6em; padding-top:1.4em; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:0.95em; }
.plan.is-rec .plan-items, .plan.is-rec .plan-meta{ border-color:rgba(244,243,241,0.22); }
.plan-items li{ position:relative; padding-left:1.5em; font-size:var(--text-base); line-height:1.45; }
.plan-items li::before{ content:""; position:absolute; left:0.05em; top:0.5em; width:0.6em; height:0.3em; border-left:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(-45deg); }
.plan-items strong{ font-weight:500; }
.plan-items span{ display:block; margin-top:0.2em; font-size:var(--text-sm); color:var(--text-2); line-height:1.5; }
.plan-items a{ border-bottom:1px solid currentColor; }
.gift-tag{ font-style:normal; font-weight:500; color:var(--accent); font-size:var(--text-xs); letter-spacing:0.1em; text-transform:uppercase; margin-left:0.35em; white-space:nowrap; }
.plan.is-rec .gift-tag{ color:var(--accent-on-ink); }
.plan-meta{ margin:auto 0 0; padding-top:1.4em; border-top:1px solid var(--line); display:grid; grid-template-columns:1fr 1fr 1fr; gap:1em; font-size:var(--text-sm); }
.plan-meta dt{ font-size:var(--text-xs); letter-spacing:0.1em; text-transform:uppercase; color:var(--text-2); }
.plan-meta dd{ margin-top:0.35em; font-weight:500; line-height:1.35; }
.plan .btn{ margin-top:1.6em; width:100%; }
.btn--inverse{ background:var(--bg); color:var(--ink); border-color:var(--bg); }
.btn--inverse:hover{ background:#fff; border-color:#fff; }
.plans-h3{ margin-top:4.5em; font-size:clamp(24px,2.2vw,32px); font-weight:400; letter-spacing:-0.02em; line-height:1.1; }
.guarantees{ margin-top:2em; }
.guarantees h4{ margin-top:1.1em; font-size:clamp(20px,1.5vw,23px); font-weight:400; letter-spacing:-0.015em; line-height:1.15; }
.compare-intro{ margin-top:0.8em; }
.compare-wrap{ overflow-x:auto; margin-top:1.8em; -webkit-overflow-scrolling:touch; }
.compare{ width:100%; min-width:720px; border-collapse:collapse; font-size:var(--text-sm); }
.compare th, .compare td{ text-align:left; vertical-align:top; padding:0.9em 0.8em; border-top:1px solid var(--line); line-height:1.45; }
.compare thead th{ font-weight:500; font-size:var(--text-xs); letter-spacing:0.12em; text-transform:uppercase; color:var(--text-2); border-top:0; }
.compare tbody th{ font-weight:400; color:var(--text-2); }
.compare th:last-child, .compare td:last-child{ background:var(--accent-soft); font-weight:500; }
.compare thead th:last-child{ color:var(--accent); }

/* blog: narrow measure, table of contents, article body */
.post{ max-width:var(--max); }
.post-head{ padding:5.5em 0 0; max-width:40em; }
.post-head h1{ margin-top:1em; font-size:clamp(32px,4vw,56px); font-weight:400; line-height:1.06; letter-spacing:-0.03em; text-wrap:balance; }
.post-head .lead{ margin-top:1.2em; max-width:34em; }
.post-meta{ margin-top:1.4em; font-size:var(--text-sm); color:var(--text-2); }
.post-head .eyebrow a{ border-bottom:1px solid currentColor; }
.toc{ margin-top:3em; padding:1.4em 1.6em; border:1px solid var(--line); max-width:40em; background:rgba(255,255,255,0.45); }
.toc ol{ margin-top:0.9em; padding-left:1.3em; display:flex; flex-direction:column; gap:0.45em; font-size:var(--text-base); line-height:1.4; }
.toc a:hover{ opacity:0.6; }
.post-body{ max-width:40em; margin-top:1em; font-size:clamp(16px,1.2vw,18px); line-height:1.68; }
.post-sec{ margin-top:3.2em; scroll-margin-top:4.2em; }
.post-sec h2{ font-size:clamp(26px,2.6vw,36px); font-weight:400; letter-spacing:-0.025em; line-height:1.1; text-wrap:balance; }
.post-sec h3{ margin-top:1.8em; font-size:clamp(19px,1.5vw,22px); font-weight:500; letter-spacing:-0.01em; line-height:1.25; }
.post-sec p{ margin-top:1em; }
.post-sec ul, .post-sec ol{ margin-top:1em; padding-left:1.3em; display:flex; flex-direction:column; gap:0.5em; }
.post-sec li::marker{ color:var(--text-2); }
.post-sec a{ border-bottom:1px solid var(--ink); padding-bottom:1px; }
.post-sec a:hover{ opacity:0.6; }
.post-sec strong{ font-weight:500; }
.post-sec blockquote{ margin-top:1.2em; padding:1em 1.3em; border-left:2px solid var(--ink); color:var(--text-2); }
.post-sec table{ width:100%; border-collapse:collapse; margin-top:1.2em; font-size:var(--text-sm); }
.post-sec th, .post-sec td{ text-align:left; vertical-align:top; padding:0.75em 0.6em; border-top:1px solid var(--line); line-height:1.45; }
.post-sec thead th{ font-weight:500; font-size:var(--text-xs); letter-spacing:0.12em; text-transform:uppercase; color:var(--text-2); border-top:0; }
.post-sec .faq{ margin-top:1.6em; }
.post-sec .faq summary{ font-size:clamp(16px,1.2vw,18px); }
.post-services{ margin-top:4em; padding-top:2em; border-top:1px solid var(--line); max-width:40em; }
.post-services ul{ list-style:none; margin-top:1em; }
.post-services li a{ display:flex; justify-content:space-between; align-items:baseline; gap:1em; padding:0.9em 0; border-top:1px solid var(--line); font-size:var(--text-lg); }
.post-services li a:hover{ opacity:0.6; }
.post-services small{ display:block; font-size:var(--text-sm); color:var(--text-2); margin-top:0.2em; }
.post .cta{ max-width:none; }
.post-list{ list-style:none; display:grid; grid-template-columns:repeat(2,1fr); gap:2.5em 3em; margin-top:3.5em; }
.post-list li a{ display:flex; flex-direction:column; height:100%; padding-top:1.4em; border-top:1px solid var(--line); }
.post-list h2{ margin-top:0.8em; font-size:clamp(22px,2vw,28px); font-weight:400; letter-spacing:-0.02em; line-height:1.15; text-wrap:balance; }
.post-list p{ margin-top:0.7em; font-size:var(--text-base); line-height:1.55; color:var(--text-2); }
.post-list .btn-link{ margin-top:auto; padding-top:1.2em; align-self:flex-start; }
@media (max-width:768px){
  .post-head{ padding-top:3em; }
  .post-head h1{ font-size:clamp(30px,8.4vw,40px); }
  .toc{ padding:1.1em 1.2em; }
  .post-list{ grid-template-columns:1fr; gap:2em; margin-top:2.4em; }
  .post-sec table{ display:block; width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; white-space:normal; }
  .post-sec table th, .post-sec table td{ min-width:9em; }
}

footer.p-footer{ margin-top:6em; padding:2.6em var(--gutter) 3em; border-top:1px solid var(--line); font-size:var(--text-sm); color:var(--text-2); }
.foot-grid{ max-width:var(--max); margin:0 auto; display:grid; grid-template-columns:1.2fr 1fr 1fr 1fr; gap:2.4em; }
.foot-grid h4{ font-size:var(--text-xs); letter-spacing:0.18em; text-transform:uppercase; font-weight:500; margin-bottom:1.1em; }
.foot-grid ul{ list-style:none; display:flex; flex-direction:column; gap:0.55em; }
.foot-grid a:hover{ color:var(--ink); }
.foot-brand{ display:flex; align-items:center; gap:10px; color:var(--ink); font-weight:500; font-size:15px; }
.foot-brand img{ height:20px; width:auto; }
.foot-copy{ margin-top:1.2em; max-width:24em; line-height:1.5; }

@media (max-width:1024px){
  .plans{ grid-template-columns:1fr; max-width:34em; }
  .strip{ grid-template-columns:repeat(2,1fr); }
  .cards{ grid-template-columns:repeat(2,1fr); }
  .proof{ grid-template-columns:repeat(2,1fr); }
  .foot-grid{ grid-template-columns:1fr 1fr; }
  .stats{ grid-template-columns:repeat(2,1fr); }
  .related ul{ grid-template-columns:1fr 1fr; }
}
@media (max-width:768px){
  :root{ --bg:#F5F4EF; --bg-rgb:245,244,239; --ink:#171717; --text-2:#5A5A56; --muted:#75756F; --line:rgba(23,23,23,0.14); --gutter:22px; }
  .p-header{ padding:0.8em var(--gutter); }
  .brand-mark{ height:28px; }
  .brand-word, .p-nav{ display:none; }
  .header-right{ gap:1.2em; }
  .hero{ grid-template-columns:1fr; gap:1.4em; padding-top:3em; }
  .hero h1{ font-size:clamp(34px,9.4vw,44px); margin-top:0.8em; }
  .strip{ grid-template-columns:1fr 1fr; gap:0.9em 0.9em; margin-top:2.6em; }
  .proof{ grid-template-columns:1fr 1fr; }
  .strip figcaption{ flex-direction:column; gap:0.1em; }
  .sec{ margin-top:3.5em; padding-top:2em; }
  .sec-head{ grid-template-columns:1fr; gap:1em; }
  .cards, .cards.cols-2{ grid-template-columns:1fr; gap:2.2em; margin-top:2.2em; }
  .cards h3{ font-size:clamp(22px,6vw,24px); }
  .checklist li{ grid-template-columns:2.4em 1fr; font-size:16px; }
  .stats{ gap:1.6em; margin-top:2.2em; }
  .proof{ grid-template-columns:1fr 1fr; gap:1.4em 1em; margin-top:2.2em; }
  .cta{ grid-template-columns:1fr; margin-top:3.5em; padding-top:2em; }
  .plans{ gap:1.4em; margin-top:2.4em; }
  .plan{ padding:1.8em 1.3em 1.4em; }
  .plan .btn{ max-width:none; }
  .plans-h3{ margin-top:3em; }
  .compare{ min-width:620px; }
  .btn{ width:100%; max-width:24em; }
  .related ul{ grid-template-columns:1fr; gap:0; margin-top:1.2em; }
  .related li a{ font-size:16px; }
  footer.p-footer{ margin-top:3.5em; padding:2em var(--gutter) 3em; }
  .foot-grid{ grid-template-columns:1fr; gap:2em; }
}
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } .strip img{ transition:none; } }