/* RiantSoft, design E. Built from the logo: olive-green wordmark, sky-blue orbit, deep-teal descender.
   Self-contained; does not load site.css. No serif, no cream, no mono micro-labels. */

@import url("../fonts/fonts.css");

:root{
  /* straight from logo.svg */
  --green:#4e7422;        /* the wordmark, so: our primary */
  --green-d:#47691e;
  --green-t:#eef3e3;      /* tint */
  --blue:#06a5d9;         /* the orbit */
  --blue-d:#046d8f;       /* same hue, darkened for text on white */
  --blue-t:#e4f5fc;
  --teal:#02536e;         /* the descender: our dark surface */
  --teal-d:#023c51;
  --teal-t:#e8f1f4;

  --ink:#0f3240;          /* body text, a teal-black, never neutral black */
  --ink-2:#2d5564;
  --mu:#52707a;
  --line:#dbe6e5;
  --line-2:#c2d4d3;
  --canvas:#ffffff;
  --sheet:#f2f7f1;        /* cool moss-tinted band */
  --sheet-2:#eef4f5;      /* cool teal-tinted band */

  --r:12px; --r-s:9px; --r-l:18px; --pill:999px;
  --sans:"Geist",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --w:1200px;
  --sh:0 18px 40px -26px rgba(2,83,110,.38);
  --sh-l:0 30px 70px -40px rgba(2,83,110,.55);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
body{margin:0;background:var(--canvas);color:var(--ink);font:400 16.5px/1.6 var(--sans);-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;height:auto;display:block}
.wrap{max-width:var(--w);margin:0 auto;padding:0 28px}
.skip{position:absolute;left:-999px;top:8px;background:var(--teal);color:#fff;padding:10px 14px;z-index:100;border-radius:var(--r-s)}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:4px}

h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-.032em;line-height:1.08;color:var(--teal)}
h1{font-size:clamp(38px,5.1vw,62px);letter-spacing:-.04em;line-height:1.04}
h2{font-size:clamp(28px,3.5vw,42px)}
h3{font-size:21px;letter-spacing:-.025em}
p{margin:0}
a{color:var(--blue-d);text-decoration:none}
a:hover{color:var(--teal)}

.eyebrow{font:600 12px var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--green);margin:0 0 16px;display:flex;align-items:center;gap:9px}
.eyebrow::before{content:"";width:22px;height:2px;border-radius:2px;background:var(--green)}
.lead{font-size:18.5px;line-height:1.58;color:var(--ink-2);max-width:50ch;margin:20px 0 0}
.sub{font-size:16.5px;line-height:1.6;color:var(--mu);max-width:56ch;margin:14px 0 0}
.body{font-size:17px;line-height:1.62;color:var(--ink-2);max-width:54ch;margin:16px 0 0}

/* buttons live in site.css so every page shares one definition (13 Oct).
   Do not re-add them here: the `font:` shorthand resets line-height and the
   home button silently drifted 1px taller than every other page. */
.acts{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.arrowlink{position:relative;display:inline-block;padding-right:28px;font-weight:600;font-size:15px}
.arrowlink::before{content:"";position:absolute;right:4px;top:50%;width:15px;height:1.6px;background:currentColor;transform:translateY(-50%)}
.arrowlink::after{content:"";position:absolute;right:4px;top:50%;width:7px;height:7px;border-right:1.6px solid currentColor;border-top:1.6px solid currentColor;transform:translateY(-50%) rotate(45deg)}
.arrowlink:hover{color:var(--teal)}

/* The header and logo are .site-header/.brand in site.css, shared by all 30 pages.
   E's original .hd/.logo rules were deleted on 13 Oct: they had never matched any
   markup, which is why the logo sat at V6's 36px until the owner spotted it. */

/* ---------- the orbit, our graphic device, lifted from the logo ---------- */
.orbit{position:absolute;pointer-events:none;z-index:0}
.orbit svg{width:100%;height:auto;overflow:visible}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;padding:72px 0 64px;background:linear-gradient(170deg,var(--sheet) 0%,#fff 58%)}
.hero .orbit{top:-170px;right:-200px;width:900px;opacity:.1}
.hero .wrap{position:relative;z-index:1;display:grid;grid-template-columns:1.06fr .94fr;gap:52px;align-items:center}
.hero h1{max-width:14ch}
.hero h1 .g{color:var(--green)}
.trust{display:flex;gap:28px;flex-wrap:wrap;margin-top:36px;padding-top:24px;border-top:1px solid var(--line)}
.trust div{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--mu)}
.trust b{display:block;font-size:15px;font-weight:600;color:var(--teal)}
.trust .tick{flex:none;width:22px;height:22px;border-radius:50%;background:var(--green-t);display:grid;place-items:center}
.trust .tick::after{content:"";width:5px;height:9px;border:solid var(--green);border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-1px)}
@media (max-width:1000px){.hero .wrap{grid-template-columns:1fr;gap:40px}.hero{padding:44px 0 44px}}

/* the scope document */
.doc{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--r-l);box-shadow:var(--sh-l);overflow:hidden}
.doc-hd{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:14px 22px;background:var(--teal);color:#cfe4ec;
  font:600 12px var(--sans);letter-spacing:.07em;text-transform:uppercase}
.doc-hd b{color:#fff;font-weight:600}
.doc-ttl{padding:20px 22px 16px;border-bottom:1px solid var(--line)}
.doc-ttl h3{font-size:22px;margin-top:6px}
.doc-ttl .k{font-size:13px;color:var(--mu);font-weight:500}
.doc-rows{margin:0;padding:4px 22px}
.doc-rows div{display:flex;justify-content:space-between;gap:18px;align-items:baseline;padding:11px 0;border-bottom:1px dashed var(--line)}
.doc-rows div:last-child{border-bottom:0}
.doc-rows dt{margin:0;font-size:14.5px;color:var(--ink-2)}
.doc-rows dd{margin:0;font:500 14px var(--mono);color:var(--teal);white-space:nowrap}
.doc-rows dd.inc{color:var(--green);font-weight:600}
.doc-ft{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:18px 22px;background:var(--green-t);border-top:1px solid #dde9cc}
.doc-ft .k{font:600 11.5px var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--green-d)}
.doc-ft .big{font-size:38px;font-weight:600;letter-spacing:-.04em;color:var(--teal);line-height:1;margin-top:4px}
.doc-dates{text-align:right;font-size:13px;line-height:1.75;color:var(--ink-2)}
.doc-dates b{color:var(--teal);font-weight:600}
.doc figcaption{padding:13px 22px 15px;font-size:12.5px;line-height:1.5;color:var(--mu);border-top:1px solid var(--line)}

/* ---------- sections ---------- */
.sec{padding:76px 0}
.sec-sheet{background:var(--sheet)}
.sec-sheet2{background:var(--sheet-2)}
.sec-hd{max-width:62ch;margin-bottom:40px}
.sec-hd.row{max-width:none;display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:end}
.sec-hd.row .sub{margin:0}
.sec-hd h2{max-width:20ch}
@media (max-width:900px){.sec{padding:52px 0}.sec-hd.row{grid-template-columns:1fr;gap:14px}}
.two{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.two>*{min-width:0}
@media (max-width:1000px){.two{grid-template-columns:1fr;gap:40px}}

/* ---------- service cards ---------- */
.svc{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:950px){.svc{grid-template-columns:1fr}}
.svc .c{background:#fff;border:1px solid var(--line);border-radius:var(--r-l);padding:28px 26px 26px;display:flex;flex-direction:column;gap:12px;
  transition:transform .16s,box-shadow .16s,border-color .16s}
.svc .c:hover{transform:translateY(-3px);box-shadow:var(--sh);border-color:var(--line-2)}
.svc .ic{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:var(--green-t);color:var(--green)}
.svc .c:nth-child(2) .ic{background:var(--blue-t);color:var(--blue-d)}
.svc .c:nth-child(3) .ic{background:var(--teal-t);color:var(--teal)}
.svc .ic svg{width:23px;height:23px}
.svc h3{margin-top:6px}
.svc p{font-size:15px;line-height:1.55;color:var(--mu)}
.svc .price{margin-top:auto;padding-top:14px;border-top:1px dashed var(--line);display:flex;align-items:baseline;gap:8px}
.svc .price b{font-size:30px;font-weight:600;letter-spacing:-.04em;color:var(--teal)}
.svc .price span{font-size:13px;color:var(--mu)}
.svc .c>a{margin-top:14px;align-self:flex-start;color:var(--green);font-weight:600;font-size:14.5px}
.svc .c>a:hover{color:var(--green-d)}

/* ---------- price table ---------- */
.tbl{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden}
.tbl th,.tbl td{text-align:left;padding:16px 20px;border-bottom:1px solid var(--line)}
.tbl thead th{background:var(--teal);color:#cfe4ec;font:600 12px var(--sans);letter-spacing:.08em;text-transform:uppercase;border-bottom:0}
.tbl tbody th{font-weight:600;font-size:16px;color:var(--teal);width:27%}
.tbl td{font-size:15.5px;color:var(--mu)}
.tbl .r{text-align:right;white-space:nowrap}
.tbl tbody td.r{font-size:17px;font-weight:600;color:var(--green);letter-spacing:-.02em}
.tbl tr:last-child th,.tbl tr:last-child td{border-bottom:0}
.tbl tbody tr:hover th,.tbl tbody tr:hover td{background:var(--sheet)}
.tbl-ft{margin-top:16px;font-size:14.5px;color:var(--mu)}
@media (max-width:760px){
  .tbl thead{display:none}
  .tbl tr{display:grid;grid-template-columns:1fr auto;gap:2px 14px;padding:14px 18px;border-bottom:1px solid var(--line)}
  .tbl th,.tbl td{border:0;padding:0;width:auto}
  .tbl tbody th{grid-column:1}.tbl tbody td.r{grid-column:2;grid-row:1/span 2;align-self:center}
  .tbl td:not(.r){grid-column:1;font-size:14px}
}

/* ---------- chips ---------- */
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0;padding:0}
.chips li{border:1px solid var(--line-2);border-radius:var(--pill);padding:6px 14px;font-size:13.5px;color:var(--ink-2);background:#fff}
.chips-light li{border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.07);color:#d4e6ed}

/* ---------- migration drawing ---------- */
.viz{margin:0}
.viz svg{width:100%;height:auto}
.viz .bx{fill:#fff;stroke:var(--line-2)}
.viz .bx-d{fill:var(--teal);stroke:var(--teal)}
.viz .t-h{font:600 14px var(--sans);fill:var(--teal)}
.viz .t-s{font:400 11px var(--sans);fill:var(--mu)}
.viz .t-r{font:400 12.5px var(--sans);fill:var(--ink-2)}
.viz .t-rs{font:400 11.5px var(--sans);fill:var(--ink-2)}
.viz .t-w{fill:#eaf4f8}.viz .t-wm{fill:#8fb4c2}
.viz .t-lb{font:600 10px var(--sans);letter-spacing:.1em;fill:var(--mu)}
.viz .t-ok{font:600 10px var(--sans);letter-spacing:.06em;fill:#9ccc62}
.viz .pill{fill:var(--sheet);stroke:var(--line)}
.viz .lane{stroke:url(#lg);stroke-width:2.5;fill:none;stroke-linecap:round}
.viz .tip{fill:var(--green)}

/* ---------- dark band ---------- */
.dark{position:relative;overflow:hidden;background:var(--teal);color:#d4e6ed}
.dark .orbit{bottom:-260px;left:-180px;width:720px;opacity:.14}
.dark .wrap{position:relative;z-index:1}
.dark h2,.dark h3{color:#fff}
.dark .body,.dark .sub{color:#aecbd6}
.dark .eyebrow{color:#8fd8f2}
.dark .eyebrow::before{background:#8fd8f2}
.chat{border:1px solid rgba(255,255,255,.16);border-radius:var(--r-l);padding:20px;background:rgba(255,255,255,.05)}
.chat-hd{display:flex;align-items:center;gap:9px;font-size:12.5px;color:#b8d6df;margin-bottom:16px;font-weight:500}
.chat-hd i{width:8px;height:8px;border-radius:50%;background:var(--blue);box-shadow:0 0 10px var(--blue)}
.m{font-size:14.5px;line-height:1.55;padding:13px 16px;border-radius:14px;margin-bottom:10px;max-width:92%}
.m.u{background:#fff;color:var(--teal);margin-left:auto;border-bottom-right-radius:5px;font-weight:500}
.m.a{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-bottom-left-radius:5px;color:#dceaef}
.m .src{display:block;margin-top:8px;font-size:11.5px;color:#8fb4c2}

/* ---------- visibility grid ---------- */
.grid{margin:0;border:1px solid var(--line);border-radius:var(--r-l);background:#fff;padding:18px 20px;box-shadow:var(--sh)}
.g-hd,.g-r{display:grid;grid-template-columns:minmax(0,1.7fr) repeat(4,58px);gap:7px;align-items:center}
.g-hd span{font:600 11px var(--sans);letter-spacing:.05em;text-transform:uppercase;color:var(--mu);text-align:center;padding-bottom:9px}
.g-hd span:first-child{text-align:left}
.g-r{border-top:1px solid var(--line);padding:8px 0}
.g-r .q{font-size:13px;color:var(--ink-2)}
.g-r span:not(.q){text-align:center;font:600 10.5px var(--sans);letter-spacing:.04em;text-transform:uppercase;padding:6px 0;border-radius:var(--r-s)}
.g-r .hit{background:var(--green-t);color:var(--green)}
.g-r .miss{background:var(--sheet-2);color:var(--mu)}
.grid figcaption{margin-top:14px;padding-top:13px;border-top:1px solid var(--line);font-size:12.5px;line-height:1.5;color:var(--mu)}

/* ---------- steps ---------- */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:s}
.steps li{counter-increment:s;background:#fff;border:1px solid var(--line);border-radius:var(--r-l);padding:24px 22px;position:relative}
.steps li::before{content:counter(s);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;
  background:var(--teal);color:#fff;font-weight:600;font-size:15px;margin-bottom:14px}
.steps li:nth-child(1)::before{background:var(--green)}
.steps h3{font-size:18px;margin-bottom:9px}
.steps p{font-size:14.5px;line-height:1.55;color:var(--mu)}
@media (max-width:980px){.steps{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.steps{grid-template-columns:1fr}}

/* ---------- work ---------- */
.wk{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin:0;padding:0}
.wk li{list-style:none;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);
  border-radius:var(--r-l);overflow:hidden;transition:border-color .15s,box-shadow .15s,transform .15s}
.wk li:hover{border-color:var(--line-2);box-shadow:var(--sh);transform:translateY(-2px)}
.wk-face{position:relative;padding:24px 26px 22px;min-height:146px;overflow:hidden;border-bottom:1px solid var(--line)}
.wk-face.f-moss{background:var(--green-t)}
.wk-face.f-blue{background:var(--blue-t)}
.wk-face.f-teal{background:var(--teal-t)}
.wk-face.f-dark{background:var(--teal);border-bottom-color:var(--teal)}
.wk-art{position:absolute;right:0;top:0;width:220px;height:140px;opacity:.85;pointer-events:none}
.wk-fig{position:relative;margin:0;font:600 44px/1 var(--sans);letter-spacing:-.025em;color:var(--teal)}
.wk-fig span{font-size:26px;color:var(--green);margin-left:1px}
.f-dark .wk-fig{color:#fff}
.wk-lab{position:relative;margin:10px 0 0;max-width:23ch;font-size:13px;line-height:1.5;color:var(--mu)}
.f-dark .wk-lab{color:#a6c4cf}
.wk-bd{display:flex;flex-direction:column;flex:1;padding:22px 26px 22px}
.wk .cat{margin:0;font:600 11.5px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--green)}
.wk h3{margin:9px 0 9px;font-size:19px;line-height:1.3}
.wk p.d{margin:0;font-size:14.8px;line-height:1.55;color:var(--mu)}
.wk .meta{margin:18px 0 0;margin-top:auto;padding-top:14px;border-top:1px solid var(--line);font-size:12.5px;color:var(--mu)}
@media (max-width:900px){
  .wk{grid-template-columns:1fr;gap:14px}
  .wk-face{min-height:0;padding:20px 22px 18px}
  .wk-art{width:138px;height:90px;opacity:.55}
  .wk-lab{max-width:none;padding-right:116px}
  .wk-fig{font-size:38px}
  .wk-bd{padding:18px 22px 20px}
}

/* ---------- closing ---------- */
.close{padding:72px 0}
.close .wrap{display:grid;grid-template-columns:1.2fr .8fr;gap:48px;align-items:center}
@media (max-width:1000px){.close .wrap{grid-template-columns:1fr;gap:34px}}

/* ---------- footer ---------- */
.ft{background:var(--teal-d);color:#a6c4cf;padding:52px 0 26px;font-size:14.5px}
.ft h4{font-size:14px;color:#fff;margin:0 0 12px;font-weight:600;letter-spacing:0}
.ft-cols{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:36px}
.ft p{line-height:1.6;margin-bottom:10px;max-width:34ch}
.ft ul{list-style:none;margin:0;padding:0}
.ft li{margin-bottom:8px}
.ft a{color:#a6c4cf}
.ft a:hover{color:#fff}
.ft address{font-style:normal;line-height:1.65}
.ft-legal{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:38px;padding-top:18px;border-top:1px solid rgba(255,255,255,.14);font-size:13px;color:#8fb0bc}
@media (max-width:900px){.ft-cols{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.ft-cols{grid-template-columns:1fr}}

@media (max-width:620px){
  :root{--w:100%}
  .wrap{padding:0 20px}
  .grid{padding:14px 15px}
  .g-hd,.g-r{grid-template-columns:minmax(0,1.5fr) repeat(4,36px);gap:5px}
  .g-hd span,.g-r span:not(.q){font-size:9.5px;letter-spacing:.02em}
  .g-r .q{font-size:11.5px;line-height:1.35}
  .doc-ft .big{font-size:32px}
}

/* ---------- migration diagram, three panels and a timeline ---------- */
.mig{display:grid;grid-template-columns:1fr 46px .92fr 46px 1fr;gap:0;align-items:stretch}
.mig-p{background:#fff;border:1px solid var(--line);border-radius:var(--r-l);padding:24px 24px 22px;display:flex;flex-direction:column}
.mig-k{font:600 11.5px var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--mu);margin-bottom:14px}
.mig-p h3{font-size:22px;margin:0}
.mig-s{font-size:13.5px;color:var(--mu);margin-top:4px}
.mig-arrow{display:grid;place-items:center;color:var(--green)}
.mig-arrow svg{width:30px;height:30px;stroke-width:2.1}

.mig-count{list-style:none;margin:18px 0 0;padding:0;border-top:1px solid var(--line)}
.mig-count li{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:11px 0;border-bottom:1px solid var(--line)}
.mig-count span{font-size:14.5px;color:var(--ink-2)}
.mig-count b{font:600 17px var(--mono);color:var(--teal);letter-spacing:-.02em;white-space:nowrap}
.mig-note{margin-top:auto;padding-top:16px;font-size:12.5px;line-height:1.5;color:var(--mu)}

.mig-do{background:var(--teal);border-color:var(--teal)}
.mig-do .mig-k{color:#8fd8f2}
.mig-steps{list-style:none;counter-reset:m;margin:2px 0 0;padding:0}
.mig-steps li{counter-increment:m;position:relative;padding:0 0 20px 40px;color:#aecbd6;font-size:14px;line-height:1.5}
.mig-steps li:last-child{padding-bottom:0}
.mig-steps li::before{content:counter(m);position:absolute;left:0;top:0;width:26px;height:26px;border-radius:50%;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);color:#fff;font:600 12px var(--sans);display:grid;place-items:center}
.mig-steps li::after{content:"";position:absolute;left:13px;top:28px;bottom:6px;width:1px;background:rgba(255,255,255,.18)}
.mig-steps li:last-child::after{display:none}
.mig-steps b{display:block;color:#fff;font-size:15.5px;font-weight:600;margin-bottom:3px;letter-spacing:-.01em}

.mig-get{border-color:#d7e4c7;background:linear-gradient(180deg,var(--green-t),#fff 55%)}
.mig-ticks{list-style:none;margin:18px 0 0;padding:0}
.mig-ticks li{position:relative;padding:0 0 13px 28px;font-size:14.5px;line-height:1.45;color:var(--ink-2)}
.mig-ticks li::before{content:"";position:absolute;left:0;top:1px;width:18px;height:18px;border-radius:50%;background:var(--green)}
.mig-ticks li::after{content:"";position:absolute;left:6px;top:5px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.mig-price{margin-top:auto;padding-top:16px;border-top:1px solid #d7e4c7;font-size:13px;color:var(--mu);line-height:1.45}
.mig-price b{display:block;font-size:24px;font-weight:600;letter-spacing:-.03em;color:var(--green);margin-bottom:2px}

.mig-time{list-style:none;display:grid;grid-template-columns:1.35fr .75fr 1fr;margin:18px 0 0;padding:0;
  border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden;background:#fff}
.mig-time li{padding:16px 20px 17px;border-left:1px solid var(--line);position:relative;font-size:13.5px;line-height:1.5;color:var(--mu)}
.mig-time li:first-child{border-left:0}
.mig-time li::before{content:"";position:absolute;left:0;right:0;top:0;height:3px}
.mig-time .a::before{background:var(--green)}
.mig-time .b::before{background:var(--blue)}
.mig-time .c::before{background:var(--teal)}
.mig-time b{display:block;font-size:14.5px;font-weight:600;color:var(--teal);margin-bottom:3px}

.mig-foot{display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap;margin-top:26px}
.mig-foot .chips{margin:0;max-width:56%}
.mig-foot .acts{margin:0}

@media (max-width:1050px){
  .mig{grid-template-columns:1fr;gap:0}
  .mig-arrow{padding:12px 0;transform:rotate(90deg)}
  .mig-time{grid-template-columns:1fr}
  .mig-time li{border-left:0;border-top:1px solid var(--line)}
  .mig-time li:first-child{border-top:0}
  .mig-foot .chips{max-width:none}
}

/* ---------- problem spine ---------- */
.prob{margin:0;padding:0;border-top:1px solid var(--line)}
.prob li{list-style:none;display:grid;grid-template-columns:1fr 272px;gap:44px;align-items:center;
  padding:34px 0 34px 26px;border-bottom:1px solid var(--line);border-left:2px solid var(--green-t);transition:border-left-color .18s,background .18s}
.prob li:hover{border-left-color:var(--green);background:linear-gradient(90deg,rgba(89,133,39,.045),rgba(89,133,39,0) 55%)}
.prob h3{margin:0 0 11px;max-width:27ch;font-size:25px;line-height:1.3;letter-spacing:-.012em;color:var(--teal);font-weight:600}
.prob p{margin:0;max-width:64ch;font-size:15.2px;line-height:1.62;color:var(--mu)}
.prob-fix{display:block;padding:17px 19px;border:1px solid var(--line);border-radius:var(--r);
  background:var(--green-t);text-decoration:none;transition:border-color .18s,box-shadow .18s,transform .18s}
.prob-fix:hover{border-color:var(--green);box-shadow:var(--sh);transform:translateY(-2px)}
.prob-fix span{display:block;font:600 11px var(--sans);letter-spacing:.085em;text-transform:uppercase;color:var(--green)}
.prob-fix strong{display:block;margin:7px 0 4px;font-size:16.5px;line-height:1.3;color:var(--teal);font-weight:600}
.prob-fix em{display:block;font-style:normal;font-size:13.5px;color:var(--ink-2)}
.prob-ft{margin:26px 0 0;font-size:15px;color:var(--mu)}
.prob-ft a{color:var(--green);font-weight:600}
@media (max-width:900px){
  .prob li{grid-template-columns:1fr;gap:18px;align-items:start;padding:26px 0 28px 18px}
  .prob h3{font-size:21px;max-width:none}
}

/* ---------- where we fit ---------- */
.fit{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.fit-col{background:#fff;border:1px solid var(--line);border-radius:var(--r-l);padding:26px 28px 28px}
.fit-col.fit-y{border-top:3px solid var(--green)}
.fit-col.fit-n{border-top:3px solid var(--line-2)}
.fit-col h3{display:flex;align-items:center;gap:11px;margin:0 0 4px;font-size:18px;color:var(--teal);font-weight:600}
.fit-m{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:24px;padding:0 10px;
  border-radius:var(--pill);font:600 11.5px var(--sans);letter-spacing:.06em;text-transform:uppercase}
.fit-y .fit-m{background:var(--green);color:#fff}
.fit-n .fit-m{background:var(--teal-t);color:var(--ink-2)}
.fit-col ul{margin:18px 0 0;padding:0;list-style:none}
.fit-col li{position:relative;padding:14px 0 14px 20px;border-top:1px solid var(--line);font-size:14.8px;line-height:1.58;color:var(--mu)}
.fit-col li:first-child{border-top:0;padding-top:4px}
.fit-col li b{display:block;color:var(--teal);font-weight:600;margin-bottom:3px}
.fit-col li::before{content:"";position:absolute;left:0;top:21px;width:7px;height:7px;border-radius:50%}
.fit-col li:first-child::before{top:11px}
.fit-y li::before{background:var(--green)}
.fit-n li::before{background:var(--line-2)}
@media (max-width:900px){
  .fit{grid-template-columns:1fr;gap:14px}
  .fit-col{padding:22px 22px 24px}
}

/* ---------- home page: out-specify the V6 rules left in site.css ----------
   site.css is loaded first but uses descendant selectors (.hero .lead,
   .hero .trust, .steps li) that beat design E's single-class rules on
   specificity, not order. These restore E's intent at equal or higher weight. */
.hero .lead{font-size:18.5px;line-height:1.58;color:var(--ink-2);max-width:50ch;margin:20px 0 0;font-weight:400}
.hero .trust{gap:28px;margin-top:36px;padding-top:24px;border-top:1px solid var(--line);font-size:14px;color:var(--mu)}
.hero .trust b{display:block;font-size:15px;font-weight:600;color:var(--teal)}
.sec .steps li{display:block;grid-template-columns:none;gap:0;padding:24px 22px;border-color:var(--line);border-radius:var(--r-l)}
.sec .steps h3{font-size:18px;margin-bottom:9px}
.sec .steps p{margin:0;font-size:14.5px;line-height:1.55;color:var(--mu)}

/* WCAG 1.4.1: a link inside running text must be distinguishable by something
   other than colour. brand.css drops underlines globally for nav and cards, which
   is fine for those, but it left inline prose links colour-only. */
.sec p a:not(.btn):not(.arrowlink),
.tbl-ft a,
.hero p a:not(.btn){text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
