/* ============================================================
   PK MCQs — shared site theme (site.css)
   New design system: Sora + Hanken Grotesk, green palette, dark mode.
   Loaded after the legacy style.css so tokens + shell win on conflicts.
   ============================================================ */
:root{
  --bg:#F7FAF9;--surface:#FFFFFF;--surface-2:#EFF5F2;--surface-3:#E7F0EC;
  --ink:#0B1F1A;--ink-2:#43574F;--ink-3:#7A8C84;
  --primary:#0D8A61;--primary-ink:#0B7150;--primary-soft:#E4F3EC;--accent:#16A34A;--accent-bright:#22C55E;
  --border:#E0EAE5;--border-2:#D3E1DB;--ring:rgba(13,138,97,.32);
  --shadow-sm:0 1px 2px rgba(11,31,26,.06),0 1px 3px rgba(11,31,26,.05);
  --shadow-md:0 4px 12px rgba(11,31,26,.07),0 12px 28px rgba(11,31,26,.06);
  --shadow-lg:0 8px 24px rgba(11,31,26,.10),0 24px 60px rgba(11,31,26,.10);
  --warn:#B5741A;--warn-soft:#FBF0DC;--crit:#C0392B;--crit-soft:#FBE6E3;--success:#198754;--danger:#C0392B;
  --navy:#0B1F1A;
  --band:#0B1F1A;--band-ink:#EAF3EF;--band-ink-2:#9DB6AC;--band-surface:rgba(255,255,255,.06);--band-border:rgba(255,255,255,.12);
  --radius:16px;--radius-sm:11px;--radius-lg:22px;--maxw:1200px;
  --font-display:"Sora","Hanken Grotesk",system-ui,sans-serif;
  --font-body:"Hanken Grotesk",system-ui,-apple-system,sans-serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#081712;--surface:#0F241C;--surface-2:#132C22;--surface-3:#173328;
  --ink:#EAF3EF;--ink-2:#A6BEB4;--ink-3:#6F887D;
  --primary:#2CC07D;--primary-ink:#43D089;--primary-soft:#123027;--accent:#2FBE7E;--accent-bright:#34D77F;
  --border:#20382D;--border-2:#2A4638;--ring:rgba(52,215,127,.34);
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);--shadow-md:0 6px 18px rgba(0,0,0,.42);--shadow-lg:0 14px 40px rgba(0,0,0,.5);
  --warn:#E7B860;--warn-soft:#2C2413;--crit:#F0938A;--crit-soft:#2E1A18;--success:#43D089;--danger:#F0938A;
  --navy:#EAF3EF;
  --band:#04100C;--band-ink:#EAF3EF;--band-ink-2:#8DA79C;--band-surface:rgba(255,255,255,.05);--band-border:rgba(255,255,255,.10);
}}
:root[data-theme="dark"]{
  --bg:#081712;--surface:#0F241C;--surface-2:#132C22;--surface-3:#173328;
  --ink:#EAF3EF;--ink-2:#A6BEB4;--ink-3:#6F887D;
  --primary:#2CC07D;--primary-ink:#43D089;--primary-soft:#123027;--accent:#2FBE7E;--accent-bright:#34D77F;
  --border:#20382D;--border-2:#2A4638;--ring:rgba(52,215,127,.34);
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);--shadow-md:0 6px 18px rgba(0,0,0,.42);--shadow-lg:0 14px 40px rgba(0,0,0,.5);
  --warn:#E7B860;--warn-soft:#2C2413;--crit:#F0938A;--crit-soft:#2E1A18;--success:#43D089;--danger:#F0938A;
  --navy:#EAF3EF;
  --band:#04100C;--band-ink:#EAF3EF;--band-ink-2:#8DA79C;--band-surface:rgba(255,255,255,.05);--band-border:rgba(255,255,255,.10);
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:700;line-height:1.14;margin:0;text-wrap:balance;letter-spacing:-.02em;color:var(--ink)}
p{margin:0}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}
ul{margin:0;padding:0;list-style:none}
button{font-family:inherit;cursor:pointer}
:focus-visible{outline:2.5px solid var(--ring);outline-offset:2px;border-radius:6px}
svg.ic{width:1.25em;height:1.25em;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
img{max-width:100%}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:clamp(16px,4vw,40px);width:100%}
.eyebrow{font-size:.74rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--primary)}
.tnum{font-variant-numeric:tabular-nums}
.section{padding-block:clamp(40px,5vw,68px)}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;margin-bottom:1.8rem}
.section-head h2{font-size:clamp(1.5rem,3vw,2.05rem)}
.section-head p{color:var(--ink-2);margin-top:.5rem;max-width:56ch}
.seelink{display:inline-flex;align-items:center;gap:.4rem;color:var(--primary);font-weight:600;font-size:.95rem;white-space:nowrap}
.seelink:hover{gap:.6rem;text-decoration:none}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-weight:600;font-size:.98rem;border-radius:12px;padding:.72rem 1.25rem;border:1px solid transparent;transition:transform .12s ease,box-shadow .2s ease,background .2s ease;white-space:nowrap;cursor:pointer;text-decoration:none}
.btn:hover{text-decoration:none}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--primary);color:#fff;box-shadow:0 4px 14px var(--ring)}
.btn-primary:hover{background:var(--primary-ink);color:#fff}
.btn-ghost{background:var(--surface);color:var(--ink);border-color:var(--border-2)}
.btn-ghost:hover{background:var(--surface-2);color:var(--ink)}
.btn-line{background:transparent;color:var(--ink);border-color:var(--border-2)}
.btn-line:hover{border-color:var(--primary);color:var(--primary)}
.btn-block{width:100%}
.pill{display:inline-flex;align-items:center;gap:.34rem;font-size:.76rem;font-weight:700;padding:.24rem .6rem;border-radius:999px}
.pill-primary{background:var(--primary-soft);color:var(--primary-ink)}
.pill-warn{background:var(--warn-soft);color:var(--warn)}
.pill-crit{background:var(--crit-soft);color:var(--crit)}
.chip{display:inline-flex;align-items:center;gap:.35rem;padding:.42rem .8rem;border-radius:999px;background:var(--surface);border:1px solid var(--border);font-size:.86rem;font-weight:500;color:var(--ink-2);transition:.15s;text-decoration:none}
.chip:hover{border-color:var(--primary);color:var(--primary);background:var(--primary-soft);text-decoration:none}
/* ---- top bar + header ---- */
.topbar{background:var(--band);color:var(--band-ink-2);font-size:.82rem}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:.4rem;min-height:34px}
.topbar .tb-links{display:flex;gap:1.2rem}
.topbar .tb-links a{color:var(--band-ink-2);font-weight:500;text-decoration:none}
.topbar .tb-links a:hover{color:var(--band-ink)}
.site-header{position:sticky;top:0;z-index:60;background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--border)}
.site-nav{display:flex;align-items:center;gap:1.1rem;padding-block:.7rem}
.brand{display:flex;align-items:center;gap:.6rem;font-family:var(--font-display);font-weight:800;font-size:1.24rem;letter-spacing:-.03em;color:var(--ink);flex-shrink:0;text-decoration:none}
.brand:hover{text-decoration:none}
.brand .logo{width:38px;height:38px;border-radius:11px;background:linear-gradient(150deg,var(--primary),var(--accent-bright));display:grid;place-items:center;color:#fff;box-shadow:0 4px 12px var(--ring)}
.brand small{display:block;font-family:var(--font-body);font-weight:600;font-size:.6rem;letter-spacing:.2em;color:var(--ink-3);text-transform:uppercase;margin-top:2px}
.mainnav{display:flex;align-items:center;gap:.15rem;margin-inline:auto}
.mainnav>li{position:relative}
.navlink{display:inline-flex;align-items:center;gap:.3rem;padding:.55rem .7rem;border-radius:10px;font-weight:600;font-size:.94rem;color:var(--ink-2);transition:.15s;text-decoration:none}
.navlink:hover,.navlink.active{color:var(--ink);background:var(--surface-2);text-decoration:none}
.navlink .chev{width:1rem;height:1rem;transition:transform .2s}
.has-mega:hover .navlink .chev{transform:rotate(180deg)}
.mega{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(6px);width:min(640px,92vw);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-lg);padding:1.25rem;opacity:0;visibility:hidden;transition:.18s;display:grid;grid-template-columns:1fr 1fr 1fr;gap:1.4rem}
.has-mega:hover .mega,.has-mega:focus-within .mega{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.mega h4{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:.7rem;font-family:var(--font-body);font-weight:700}
.mega a{display:flex;align-items:center;gap:.55rem;padding:.4rem .5rem;margin-inline:-.5rem;border-radius:9px;font-size:.92rem;color:var(--ink-2);font-weight:500;text-decoration:none}
.mega a:hover{background:var(--surface-2);color:var(--primary);text-decoration:none}
.mega a .ic{width:1.05rem;height:1.05rem;color:var(--primary)}
.mega .feat{background:linear-gradient(160deg,var(--primary),var(--primary-ink));color:#fff;border-radius:12px;padding:1rem;display:flex;flex-direction:column;justify-content:space-between}
.mega .feat h4{color:rgba(255,255,255,.8)}
.mega .feat strong{font-family:var(--font-display);font-size:1.02rem;display:block;margin-bottom:.3rem}
.mega .feat p{font-size:.8rem;color:rgba(255,255,255,.85);margin-bottom:.7rem}
.mega .feat a{color:#fff;font-weight:700;font-size:.84rem;padding:0;margin:0}
.mega .feat a:hover{background:none;color:#fff}
.nav-cta{display:flex;align-items:center;gap:.5rem;flex-shrink:0}
.icon-btn{display:grid;place-items:center;width:40px;height:40px;border-radius:11px;background:var(--surface);border:1px solid var(--border);color:var(--ink-2);transition:.15s;cursor:pointer}
.icon-btn:hover{color:var(--primary);border-color:var(--primary)}
.icon-btn .ic{width:1.15rem;height:1.15rem}
.link-login{font-weight:600;font-size:.94rem;color:var(--ink-2);padding:.5rem .4rem;text-decoration:none}
.link-login:hover{color:var(--ink);text-decoration:none}
.burger{display:none}
.sun{display:none}
:root[data-theme="dark"] .sun{display:block}:root[data-theme="dark"] .moon{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .sun{display:block}:root:not([data-theme="light"]) .moon{display:none}}
.drawer-scrim{position:fixed;inset:0;background:rgba(11,31,26,.5);z-index:70;opacity:0;visibility:hidden;transition:.2s}
.drawer-scrim.open{opacity:1;visibility:visible}
.drawer{position:fixed;top:0;right:0;height:100%;width:min(360px,86vw);background:var(--surface);z-index:71;transform:translateX(100%);transition:transform .25s ease;padding:1.2rem;overflow-y:auto;box-shadow:var(--shadow-lg)}
.drawer.open{transform:none}
.drawer-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}
.drawer nav a{display:flex;align-items:center;gap:.7rem;padding:.8rem .6rem;border-radius:10px;font-weight:600;color:var(--ink);border-bottom:1px solid var(--border);text-decoration:none}
.drawer nav a .ic{color:var(--primary);width:1.2rem;height:1.2rem}
.drawer nav a:hover{background:var(--surface-2)}
.drawer .drawer-cta{display:grid;gap:.6rem;margin-top:1.2rem}
/* ---- page hero (inner pages) ---- */
.page-hero{position:relative;overflow:hidden;border-bottom:1px solid var(--border)}
.page-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(50% 60% at 85% 0%,var(--primary-soft),transparent 70%);opacity:.8;pointer-events:none}
.page-hero .wrap{position:relative;padding-block:clamp(28px,4vw,48px)}
.breadcrumb{display:flex;gap:.45rem;flex-wrap:wrap;align-items:center;color:var(--ink-3);font-size:.85rem;margin-bottom:.9rem}
.breadcrumb a{color:var(--ink-2);text-decoration:none}
.breadcrumb a:hover{color:var(--primary)}
.page-hero h1{font-size:clamp(1.8rem,3.6vw,2.6rem);font-weight:800;letter-spacing:-.03em}
.page-hero .sub{color:var(--ink-2);margin-top:.7rem;max-width:60ch;font-size:1.05rem}
/* ---- generic cards / grids ---- */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.2rem}
.grid{display:grid;gap:1rem}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
/* ---- forms ---- */
label.field{display:block;font-weight:600;font-size:.88rem;color:var(--ink-2);margin-bottom:.35rem}
input,select,textarea{font-family:inherit;font-size:1rem;color:var(--ink);background:var(--surface);border:1px solid var(--border-2);border-radius:10px;padding:.62rem .8rem;width:100%}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--ring)}
input::placeholder{color:var(--ink-3)}
/* ---- calculator ---- */
.calc{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:1.5rem;max-width:640px}
.calc h2{font-size:1.3rem;margin-bottom:.3rem}
.calc .lead{color:var(--ink-2);font-size:.95rem;margin-bottom:1.2rem}
.calc-row{display:flex;gap:.7rem;flex-wrap:wrap;align-items:flex-end;margin-bottom:.8rem}
.calc-row>div{flex:1;min-width:120px}
.calc-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.4rem}
.calc-result{margin-top:1.3rem;background:var(--primary-soft);border:1px solid var(--border);border-radius:14px;padding:1.1rem 1.2rem;display:none}
.calc-result.show{display:block;animation:fadeUp .25s ease}
@keyframes fadeUp{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.calc-result .big{font-family:var(--font-display);font-weight:800;font-size:2.2rem;color:var(--primary-ink);letter-spacing:-.03em;line-height:1.1}
.calc-result .lbl{font-size:.8rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--primary-ink);opacity:.8}
.calc-result .detail{color:var(--ink-2);font-size:.92rem;margin-top:.5rem}
.rows-list{display:flex;flex-direction:column;gap:.6rem;margin-bottom:.8rem}
.subject-row-calc{display:grid;grid-template-columns:1.6fr 1fr 1fr auto;gap:.5rem;align-items:center}
.subject-row-calc .rm{background:var(--surface-2);border:1px solid var(--border);color:var(--ink-3);border-radius:9px;width:38px;height:38px;display:grid;place-items:center}
.subject-row-calc .rm:hover{color:var(--crit);border-color:var(--crit)}
.tool-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.tool-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.2rem;display:flex;flex-direction:column;gap:.6rem;transition:.18s;text-decoration:none;color:var(--ink)}
.tool-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--border-2);text-decoration:none}
.tool-card .ti{width:46px;height:46px;border-radius:12px;background:var(--primary-soft);color:var(--primary);display:grid;place-items:center}
.tool-card h3{font-size:1.05rem}
.tool-card p{font-size:.87rem;color:var(--ink-2);flex:1}
.tool-card .go{color:var(--primary);font-weight:600;font-size:.88rem;display:inline-flex;align-items:center;gap:.4rem}
/* ---- roadmap ---- */
.rm-hero-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.rm-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.2rem;display:flex;flex-direction:column;gap:.6rem;transition:.18s;text-decoration:none;color:var(--ink)}
.rm-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);text-decoration:none}
.rm-card .step{font-family:var(--font-display);font-weight:800;font-size:1.5rem;color:var(--border-2)}
.rm-card h3{font-size:1.08rem}
.rm-card p{font-size:.86rem;color:var(--ink-2);flex:1}
.timeline{position:relative;margin-top:1rem;padding-left:2.4rem}
.timeline::before{content:"";position:absolute;left:12px;top:6px;bottom:6px;width:2px;background:var(--border)}
.tl-step{position:relative;padding-bottom:1.6rem}
.tl-step:last-child{padding-bottom:0}
.tl-step .num{position:absolute;left:-2.4rem;top:0;width:26px;height:26px;border-radius:50%;background:var(--primary);color:#fff;display:grid;place-items:center;font-family:var(--font-display);font-weight:700;font-size:.8rem;box-shadow:0 0 0 4px var(--bg)}
.tl-step h3{font-size:1.1rem;margin-bottom:.3rem}
.tl-step p{color:var(--ink-2);margin-bottom:.5rem}
.tl-step ul.bullets{list-style:disc;padding-left:1.2rem;color:var(--ink-2);display:flex;flex-direction:column;gap:.25rem}
.tl-step ul.bullets li{margin:0}
.prose{max-width:70ch}
.prose p{margin-bottom:1rem;color:var(--ink-2)}
.prose h2{font-size:1.4rem;margin:1.8rem 0 .8rem}
.prose h3{font-size:1.12rem;margin:1.4rem 0 .6rem}
.prose ul{list-style:disc;padding-left:1.3rem;color:var(--ink-2);margin-bottom:1rem;display:flex;flex-direction:column;gap:.3rem}
.faq-list{border-top:1px solid var(--border);margin-top:1rem}
.faq-item{border-bottom:1px solid var(--border)}
.faq-item summary{list-style:none;cursor:pointer;padding:1.1rem 0;display:flex;align-items:center;justify-content:space-between;gap:1rem;font-family:var(--font-display);font-weight:600;font-size:1.02rem;color:var(--ink)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary .ic{color:var(--primary);transition:transform .2s;flex-shrink:0}
.faq-item[open] summary .ic{transform:rotate(45deg)}
.faq-item .ans{padding:0 0 1.1rem;color:var(--ink-2);max-width:64ch}
/* ---- footer ---- */
.pre-foot{background:linear-gradient(160deg,var(--primary),var(--primary-ink));color:#fff}
.pre-foot .wrap{display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap;padding-block:2.2rem}
.pre-foot h2{color:#fff;font-size:clamp(1.4rem,2.6vw,2rem)}
.pre-foot p{color:rgba(255,255,255,.85);margin-top:.4rem}
.pre-foot .btn{background:#fff;color:var(--primary-ink)}
.pre-foot .btn:hover{background:var(--band-ink);color:var(--primary-ink)}
.pre-foot .btn-line{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.pre-foot .btn-line:hover{background:rgba(255,255,255,.12);color:#fff}
.site-footer{background:var(--band);color:var(--band-ink-2)}
.foot-main{display:grid;grid-template-columns:1.4fr repeat(5,1fr);gap:2rem;padding-block:3rem}
.foot-brand .brand{color:#fff}
.foot-brand p{color:var(--band-ink-2);font-size:.88rem;margin-top:.9rem;max-width:34ch}
.foot-social{display:flex;gap:.5rem;margin-top:1.1rem}
.foot-social a{width:36px;height:36px;border-radius:10px;border:1px solid var(--band-border);display:grid;place-items:center;color:var(--band-ink-2);transition:.15s}
.foot-social a:hover{background:var(--band-surface);color:#fff}
.foot-col h4{color:#fff;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;font-family:var(--font-body);font-weight:700;margin-bottom:.9rem}
.foot-col a{display:block;color:var(--band-ink-2);font-size:.88rem;padding:.3rem 0;transition:.15s;text-decoration:none}
.foot-col a:hover{color:#fff;padding-left:.2rem}
.foot-bot{border-top:1px solid var(--band-border)}
.foot-bot .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding-block:1.3rem;font-size:.82rem;color:var(--band-ink-2)}
.foot-bot .fb-links{display:flex;gap:1.3rem}
.foot-bot .fb-links a{color:var(--band-ink);text-decoration:none}
.mobile-cta{position:fixed;bottom:0;left:0;right:0;z-index:55;background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(12px);border-top:1px solid var(--border);padding:.7rem clamp(16px,4vw,40px);display:none;gap:.6rem;box-shadow:0 -4px 20px rgba(11,31,26,.08)}
.mobile-cta .btn{flex:1}
/* ============================================================
   Dark-mode adaptations for legacy style.css components.
   These only take effect once a page also loads site.css AND is
   in dark mode; they map hardcoded light surfaces to tokens.
   ============================================================ */
:root[data-theme="dark"] .mcq-card,
:root:not([data-theme="light"]) .mcq-card,
:root[data-theme="dark"] .widget,
:root[data-theme="dark"] .quiz-card,
:root[data-theme="dark"] .comment,
:root[data-theme="dark"] .list-card{background:var(--surface)!important;border-color:var(--border)!important;color:var(--ink)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .widget,:root:not([data-theme="light"]) .quiz-card,:root:not([data-theme="light"]) .comment,:root:not([data-theme="light"]) .list-card{background:var(--surface);border-color:var(--border)}}
:root[data-theme="dark"] .option-btn,:root[data-theme="dark"] .option-label{background:var(--surface-2)!important;color:var(--ink)!important;border-color:var(--border-2)!important}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .option-btn,:root:not([data-theme="light"]) .option-label{background:var(--surface-2);color:var(--ink);border-color:var(--border-2)}}
/* ---- responsive ---- */
@media(max-width:1080px){
  .tool-cards{grid-template-columns:repeat(2,1fr)}
  .rm-hero-cards{grid-template-columns:repeat(2,1fr)}
  .grid-4{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:900px){
  .mainnav,.topbar,.nav-cta .link-login,.nav-cta .btn-line{display:none}
  .burger{display:grid}
  .foot-main{grid-template-columns:1fr 1fr;gap:1.6rem}
  .foot-brand{grid-column:1 / -1}
}
@media(max-width:600px){
  .tool-cards,.rm-hero-cards,.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
  .subject-row-calc{grid-template-columns:1fr 1fr auto}
  .foot-main{grid-template-columns:1fr 1fr}
  .pre-foot .wrap{flex-direction:column;align-items:flex-start}
  .mobile-cta{display:flex}
  body{padding-bottom:70px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
