/* ricardoacuy.eu  ·  shared stylesheet */

:root{
  --blue:#0B3A63; --blue2:#0E4D86; --orange:#F28C28;
  --bg:#F6F8FB; --card:#fff; --text:#0F172A; --muted:#475569;
  --line:#E5E7EB; --line2:#CBD5E1;
  --radius:18px; --max:1140px;
  --shadow:0 18px 45px rgba(2,6,23,.10);
  --shadowSm:0 10px 26px rgba(2,6,23,.06);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%}
body{
  margin:0; color:var(--text); line-height:1.6;
  font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:
    radial-gradient(1200px 650px at 8% -12%, rgba(11,58,99,.15), transparent 60%),
    radial-gradient(900px 520px at 95% -4%, rgba(242,140,40,.16), transparent 55%),
    linear-gradient(180deg,var(--bg),#fff 42%);
}
img{max-width:100%; height:auto; display:block}
a{color:inherit}
h1,h2,h3{letter-spacing:-.02em; line-height:1.18; margin:0}
.wrap{max-width:var(--max); margin:0 auto; padding:18px 16px 70px}

/* ---------------------------------------------------------------- topbar */
/* Two fixed rows, the same in every language: brand and flags on top,
   navigation and the call to action underneath. A longer word in Spanish or
   Portuguese then cannot push the button onto a third line. */
.topbar{
  display:flex; flex-direction:column; align-items:stretch; gap:9px;
  padding:10px 14px; background:rgba(255,255,255,.86); border:1px solid var(--line);
  border-radius:16px; backdrop-filter:blur(10px); position:sticky; top:10px; z-index:50;
  box-shadow:var(--shadowSm);
}
.topRow{display:flex; align-items:center; justify-content:space-between;
  gap:10px; flex-wrap:wrap}
.navSide{display:flex; gap:8px; flex-wrap:wrap; align-items:center}
.brand{display:flex; align-items:center; gap:11px; text-decoration:none}
.logo{width:44px;height:44px;border-radius:12px;background:#fff;border:1px solid var(--line);
  overflow:hidden;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.logo img{width:100%;height:100%;object-fit:contain;padding:5px}
.brandTitle{display:block;font-size:15px;font-weight:900;color:var(--blue);line-height:1.15}
.brandSub{display:block;color:var(--muted);font-weight:700;font-size:12px;margin-top:1px}
.navWrap{gap:10px}
.nav{display:flex; gap:6px; flex-wrap:wrap}
.chip{padding:7px 11px;border-radius:999px;border:1px solid var(--line);background:#fff;
  color:var(--blue);text-decoration:none;font-weight:800;font-size:13px;white-space:nowrap}
.chip:hover{border-color:rgba(11,58,99,.4)}
.chip.cta{background:var(--orange);border-color:var(--orange);color:#1b2633}
.chip.phone{font-variant-numeric:tabular-nums}
.langs{display:flex;gap:3px;border:1px solid var(--line);border-radius:999px;padding:3px;background:#fff}
.lang{padding:5px 8px;border-radius:999px;font-size:11.5px;font-weight:900;color:var(--muted);
  text-decoration:none;white-space:nowrap}
.lang.active{background:var(--blue);color:#fff}

/* ------------------------------------------------------------------ hero */
.hero{
  margin-top:16px; border-radius:var(--radius); padding:30px 26px; color:#fff; position:relative;
  overflow:hidden; box-shadow:var(--shadow);
  background:linear-gradient(135deg,rgba(11,58,99,.97),rgba(14,77,134,.97));
}
.hero:before{content:"";position:absolute;inset:-90px -90px auto auto;width:320px;height:320px;
  background:radial-gradient(circle at 30% 30%,rgba(242,140,40,.5),transparent 62%)}
.heroGrid{position:relative;display:grid;grid-template-columns:1.4fr .6fr;gap:26px;align-items:center}
.hero h1{font-size:38px}
.hero p{margin:14px 0 0;color:rgba(255,255,255,.9);max-width:62ch;font-size:16.5px}
.hero .pick{margin-top:16px;font-weight:900;color:#fff}
.heroPhoto{margin:0}
.heroPhoto img{border-radius:16px;box-shadow:0 20px 50px rgba(2,6,23,.35);
  border:3px solid rgba(255,255,255,.22)}

/* ------------------------------------------------------------- sections */
.section{margin-top:16px;background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius);padding:22px;box-shadow:var(--shadowSm)}
.secHead{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  flex-wrap:wrap;margin-bottom:12px}
.secHead h2{font-size:23px;color:var(--blue)}
.secHead .sub{color:var(--muted);font-weight:700;font-size:13px}
.lead{color:var(--muted);margin:0;max-width:78ch}

/* --------------------------------------------------------------- chooser */
.choose{padding:22px}
.chooseGrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.pathCard{border:1px solid var(--line);border-radius:16px;padding:20px;position:relative;
  background:#fbfcfe;display:flex;flex-direction:column}
.pathCard:before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:4px;border-radius:4px}
.pathCard.a{border-color:rgba(11,58,99,.3)}
.pathCard.a:before{background:var(--blue2)}
.pathCard.b{border-color:rgba(242,140,40,.38)}
.pathCard.b:before{background:var(--orange)}
.pathCard h2{font-size:20px;color:var(--blue)}
.pathCard p{color:var(--muted);margin:9px 0 16px;flex:1}
.mortgageLine{margin:14px 0 0;color:var(--muted);font-size:14px;
  border-top:1px dashed var(--line2);padding-top:14px}

.btn{display:inline-block;padding:11px 15px;border-radius:13px;text-decoration:none;
  font-weight:900;font-size:14px;text-align:center;border:1px solid transparent}
.btn.primary{background:var(--orange);color:#1b2633}
.btn.primary:hover{filter:brightness(1.05)}
.btn.ghost{background:#fff;color:var(--blue);border-color:var(--line2)}
.btn.ghost:hover{border-color:rgba(11,58,99,.45)}
.btn.disabled{background:#F1F5F9;color:#94A3B8;border-color:var(--line);cursor:default}
.btnRow{display:flex;gap:9px;flex-wrap:wrap}

/* ----------------------------------------------------------------- trust */
.trust{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px;align-items:stretch}
.trustItem{flex:1 1 auto;background:#fff;border:1px solid var(--line);border-radius:13px;
  padding:11px 14px;font-size:13px;font-weight:800;color:var(--muted);
  display:flex;align-items:center;gap:8px;justify-content:center;text-align:center}
.trustItem.link{text-decoration:none;border-color:rgba(14,124,90,.35);background:rgba(14,124,90,.05);
  color:var(--blue);flex-direction:column;gap:2px}
.trustItem.link b{font-size:13px}
.trustItem.link span{font-size:11.5px;font-weight:900;color:#0E7C5A;text-decoration:underline}

/* ----------------------------------------------------------------- cards */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:14px}
.card{border:1px solid var(--line);border-radius:16px;padding:18px;background:#fbfcfe}
.card h3{font-size:16.5px;color:var(--blue);margin-bottom:7px}
.card p{margin:0;color:var(--muted);font-size:14px}
.card.tool{display:flex;flex-direction:column;background:#fff}
.card.tool p{flex:1;margin-bottom:14px}
.card.tool.soon{background:#fbfcfe}
.toolTop{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.num{width:26px;height:26px;border-radius:8px;background:rgba(11,58,99,.08);color:var(--blue);
  font-weight:900;font-size:13px;display:flex;align-items:center;justify-content:center}
.tag{font-size:11px;font-weight:900;color:var(--muted);background:#F1F5F9;
  border-radius:999px;padding:4px 9px}
.tag.live{background:rgba(242,140,40,.14);color:#8a4d05}

/* ----------------------------------------------------------------- about */
.aboutGrid{display:grid;grid-template-columns:220px 1fr;gap:22px;align-items:start}
.portrait{margin:0}
.portrait img{border-radius:18px;border:1px solid var(--line);box-shadow:var(--shadowSm)}
.aboutGrid p{margin:0 0 12px;color:var(--muted)}
.aboutGrid p:last-child{margin-bottom:0}

/* ----------------------------------------------------------------- steps */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.steps li{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--line);
  border-radius:16px;padding:16px;background:#fbfcfe}
.step{flex:0 0 auto;width:30px;height:30px;border-radius:50%;background:var(--blue);color:#fff;
  font-weight:900;display:flex;align-items:center;justify-content:center;font-size:14px}
.steps h3{font-size:15.5px;color:var(--blue);margin-bottom:4px}
.steps p{margin:0;color:var(--muted);font-size:14px}

/* ------------------------------------------------------------------- faq */
.faqList{display:grid;gap:8px}
details.faq{border:1px solid var(--line);border-radius:14px;background:#fff;padding:0 14px}
details.faq summary{cursor:pointer;font-weight:900;color:var(--blue);padding:13px 0;
  list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:15px}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary:after{content:"+";font-size:19px;color:var(--orange);flex:0 0 auto;line-height:1}
details.faq[open] summary:after{content:"\2013"}
details.faq p{margin:0 0 14px;color:var(--muted);max-width:80ch}

/* --------------------------------------------------------------- contact */
.contactGrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.box{border:1px solid var(--line);border-radius:16px;padding:18px;background:#fbfcfe}
.box p{margin:6px 0;color:var(--muted);font-size:14.5px}
.box .k{display:inline-block;min-width:72px;font-weight:800;color:var(--text)}
.box .btnRow{margin-top:14px}
.socialRow{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
details.mapWrap{border:1px dashed var(--line2);border-radius:13px;padding:10px 12px;background:#fff}
details.mapWrap summary{cursor:pointer;font-weight:800;color:var(--blue);font-size:13.5px}
.mapSlot iframe{width:100%;height:280px;border:0;border-radius:12px;margin-top:10px;display:block}
.legalBlock{margin-top:14px}
.legalBlock h3{font-size:14.5px;color:var(--blue);margin-bottom:6px}
.legalBlock p{margin:6px 0;color:var(--muted);font-size:12.6px;line-height:1.55}
.legalBlock ul{margin:8px 0;padding-left:18px;color:var(--muted);font-size:12.6px;line-height:1.55}
.legalBlock li{margin:4px 0}
.legal{margin-top:16px;padding-top:14px;border-top:1px solid var(--line);
  color:var(--muted);font-size:12.4px;line-height:1.6}
.footLinks{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;font-weight:800}
.footLinks a{color:var(--blue)}

/* ------------------------------------------------------- inner pages */
.pageHead h1{font-size:30px;color:var(--blue);margin:8px 0 8px}
.back{display:inline-block;font-weight:900;font-size:13px;color:var(--muted);text-decoration:none}
.back:before{content:"\2190  "}
.back:hover{color:var(--blue)}
.prose h2{font-size:17px;color:var(--blue);margin:20px 0 6px}
.prose h2:first-child{margin-top:0}
.prose p{margin:0;color:var(--muted);max-width:82ch;font-size:14.5px}
.nfList{margin-top:14px;display:grid;gap:4px}
.nf{margin:0;font-size:14px}
.nf a{color:var(--blue);text-decoration:none}
.nf a:hover{text-decoration:underline}

/* ----------------------------------------------------------- responsive */
@media (max-width:980px){
  .topbar{position:static}
  .heroGrid{grid-template-columns:1fr}
  .heroPhoto{max-width:280px;margin:4px auto 0}
  .hero h1{font-size:30px}
  .chooseGrid,.grid3,.steps,.contactGrid{grid-template-columns:1fr}
  .aboutGrid{grid-template-columns:1fr}
  .portrait{max-width:180px}
  .nav{display:none}
  .trustItem{flex:1 1 100%}
}
@media (max-width:560px){
  .wrap{padding:12px 12px 56px}
  .hero{padding:24px 18px}
  .hero h1{font-size:26px}
  .pageHead h1{font-size:24px}
  .brandSub{display:none}
  .btnRow .btn{flex:1 1 100%}
}

@media print{
  .topbar,.heroPhoto,.btnRow,.socialRow,details.mapWrap,.langs{display:none!important}
  body{background:#fff}
  .section,.hero{box-shadow:none}
  .hero{background:#0B3A63!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  details.faq[open] p,details.faq p{display:block}
}

/* ------------------------------------------------------- qualifications */
.certList{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}
.cert{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;align-items:baseline;
  border:1px solid var(--line);border-radius:13px;padding:12px 14px;background:#fbfcfe}
.cert b{display:block;color:var(--blue);font-size:14.5px}
.cert span{display:block;color:var(--muted);font-size:12.8px;margin-top:2px}
.certMeta{color:var(--muted);font-size:12.4px;font-weight:700;font-variant-numeric:tabular-nums;
  text-align:right;white-space:normal}
@media (max-width:560px){.certMeta{text-align:left}}
.certLink{display:inline-block;margin-top:5px;font-weight:900;color:var(--blue2);font-size:12.4px}
.certLink:after{content:" (PDF)";font-weight:700;color:var(--muted)}

/* ---------------------------------------------------------------- formulář */
.leadForm{display:grid;gap:12px;margin-top:6px}
.leadForm .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.fRow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.leadForm .fld{display:grid;gap:5px}
.leadForm .fld > span{font-weight:800;color:var(--blue);font-size:13.5px}
.leadForm .fld i{font-style:normal;font-weight:700;color:var(--muted);font-size:12px}
.leadForm input[type=text],.leadForm input[type=email],.leadForm input[type=tel],
.leadForm select,.leadForm textarea{
  width:100%;padding:11px 12px;border:1px solid var(--line2);border-radius:12px;
  font-size:15.5px;font-family:inherit;background:#fff;color:var(--text)}
.leadForm textarea{resize:vertical;min-height:96px}
.leadForm input:focus,.leadForm select:focus,.leadForm textarea:focus{
  outline:none;border-color:rgba(11,58,99,.5);box-shadow:0 0 0 3px rgba(11,58,99,.12)}
.leadForm input[aria-invalid=true],.leadForm textarea[aria-invalid=true]{
  border-color:rgba(220,38,38,.6);box-shadow:0 0 0 3px rgba(220,38,38,.12)}
.consent{display:flex;gap:10px;align-items:flex-start;color:var(--muted);font-size:13px;line-height:1.5}
.consent input{width:18px;height:18px;margin-top:2px;accent-color:var(--orange);flex:0 0 auto}
.consent a{color:var(--blue);font-weight:800}
.formMsg{margin:0;font-size:13.5px;font-weight:800;min-height:1.2em}
.formMsg.ok{color:#0E7C5A}
.formMsg.err{color:#b91c1c}
button[disabled]{opacity:.6;cursor:progress}

/* ------------------------------------------------------------------- tým */
.teamGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.member{border:1px solid var(--line);border-radius:14px;padding:14px;background:#fbfcfe;
  display:grid;gap:4px;justify-items:start}
.member b{color:var(--blue);font-size:15.5px}
.member span{color:var(--muted);font-size:13px}
.member .chip{margin-top:6px}
@media (max-width:640px){.fRow,.teamGrid{grid-template-columns:1fr}}

/* --------------------------------------------------------- obsahové stránky */
.crumbs{margin-top:12px;color:var(--muted);font-size:12.5px;font-weight:700}
.crumbs a{color:var(--blue);text-decoration:none}
.crumbs span{margin:0 6px;opacity:.6}
.section > h2{font-size:22px;color:var(--blue);margin-bottom:10px}
.tickList{margin:12px 0 0;padding:0;list-style:none;display:grid;gap:8px}
.tickList li{position:relative;padding-left:24px;color:var(--muted);font-size:14.5px;line-height:1.55}
.tickList li:before{content:"";position:absolute;left:6px;top:9px;width:7px;height:7px;
  border-radius:50%;background:var(--orange)}
.hintNote{margin:10px 0 0;color:var(--muted);font-size:12.6px;line-height:1.55;
  border-left:3px solid var(--line2);padding-left:10px}
.ctaBox{background:linear-gradient(135deg,rgba(11,58,99,.06),#fff);
  border-color:rgba(11,58,99,.25)}
.ctaBox h2{margin-bottom:8px}
.ctaBox .btnRow{margin-top:14px}

/* Tabulky v obsahových stránkách: text, ne čísla, takže vše doleva a s odsazením. */
.contentTable{font-size:14px}
.contentTable th,.contentTable td{text-align:left;padding:11px 14px;vertical-align:top;
  border-bottom:1px solid var(--line)}
.contentTable th{background:#F8FAFC;color:var(--blue);font-size:12.5px;font-weight:900;
  letter-spacing:.01em;position:static}
.contentTable td{color:var(--muted);line-height:1.45}
.contentTable td:first-child{color:var(--text);font-weight:800}
.contentTable tbody tr:nth-child(even) td{background:#fcfdfe}
.contentTable th+th,.contentTable td+td{border-left:1px solid var(--line)}
.contentTable tbody tr:last-child td{border-bottom:none}
@media (max-width:640px){
  .contentTable th,.contentTable td{padding:9px 10px;font-size:13px}
}

/* Poznámka o spolupráci patří ke kontaktům, ne jako samostatná sekce. */
.teamNote{margin-top:16px;padding-top:14px;border-top:1px dashed var(--line2)}
.teamNote b{display:block;color:var(--blue);font-size:14px}
.teamNote p{margin:4px 0 8px;color:var(--muted);font-size:13.5px;line-height:1.5}

/* ------------------------------------------- intro strip and the four paths */
/* One calm line under the hero. The real choice happens in the four cards
   below, so this must not compete with them for attention. */
.introStrip{display:flex;align-items:center;justify-content:space-between;
  gap:16px;flex-wrap:wrap;padding:16px 22px}
/* No width cap here, otherwise a Spanish sentence breaks onto a second line
   while there is still room to the right of it. */
.introStrip p{margin:0;color:var(--muted);font-weight:700;font-size:14px;
  flex:1 1 380px;min-width:0}
.introStrip .btnRow{flex:0 0 auto}

.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:14px}
.card.path{display:flex;flex-direction:column;background:#fff}
.card.path p{flex:1;margin-bottom:14px}
.card.path .toolTop{margin-bottom:10px}
.card.path h3{margin-bottom:7px}
@media(max-width:1000px){.grid4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.grid4{grid-template-columns:1fr}
  .introStrip{flex-direction:column;align-items:flex-start}}

.alsoLine{margin:16px 0 0;color:var(--muted);font-size:14px;
  border-top:1px dashed var(--line2);padding-top:14px}
.alsoLine a{color:var(--blue);font-weight:800}

/* ================================================== calculators (.mcalc) */
/* Scoped to .mcalc so nothing here can collide with the site stylesheet. */
.mcalc{--gap:14px}
.mcalc .grid2{display:grid;grid-template-columns:minmax(0,0.95fr) minmax(0,1.05fr);
  gap:16px;align-items:start;margin-top:14px}
.mcalc .col{display:grid;gap:var(--gap);min-width:0}
.mcalc .panel{border:1px solid var(--line);border-radius:16px;padding:15px;background:#fbfcfe;min-width:0}
.mcalc .panel > h3{font-size:15px;color:var(--blue);margin:0 0 2px;display:flex;
  justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.mcalc .segRow{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.mcalc .seg{padding:8px 12px;border-radius:11px;border:1px solid var(--line2);background:#fff;
  color:var(--muted);font-weight:800;font-size:12.5px;cursor:pointer;font-family:inherit;line-height:1.2}
.mcalc .seg.active{background:var(--blue);color:#fff;border-color:var(--blue)}
.mcalc .seg.sm{padding:6px 9px;font-size:11.5px}
.mcalc .fld{margin-top:12px;min-width:0}
.mcalc .lrow{display:flex;justify-content:space-between;gap:10px;align-items:center;min-width:0}
.mcalc .lrow label{font-weight:800;color:var(--blue);font-size:13.4px;line-height:1.3;min-width:0}
.mcalc .vbox{display:flex;align-items:center;gap:5px;flex:0 0 auto}
.mcalc .vbox input{width:84px;padding:6px 8px;border:1px solid var(--line2);border-radius:10px;
  text-align:right;font-weight:900;font-size:13px;color:var(--blue);background:#fff;
  font-variant-numeric:tabular-nums;font-family:inherit}
.mcalc .vbox .u{font-size:12px;font-weight:800;color:var(--muted)}
.mcalc input[type=range]{width:100%;margin-top:8px;accent-color:var(--blue2)}
.mcalc .money,.mcalc select{width:100%;margin-top:8px;padding:10px 12px;border:1px solid var(--line2);
  border-radius:12px;font-size:15.5px;background:#fff;font-weight:700;font-family:inherit;
  font-variant-numeric:tabular-nums;color:var(--text)}
.mcalc select{font-size:14px;font-weight:800;color:var(--blue)}
.mcalc input:focus,.mcalc select:focus{outline:none;border-color:rgba(11,58,99,.5);
  box-shadow:0 0 0 3px rgba(11,58,99,.12)}
.mcalc .hint{margin:5px 0 0;color:var(--muted);font-size:12.1px;line-height:1.45}
.mcalc .g2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mcalc .g4{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.mcalc .g4 .lrow{flex-direction:column;align-items:flex-start;gap:4px}
.mcalc .g4 .lrow label{font-size:11.5px}
.mcalc .g4 .vbox input{width:100%}

/* results */
.mcalc .head{background:linear-gradient(135deg,rgba(11,58,99,.06),#fff);
  border:1px solid rgba(11,58,99,.25);border-radius:16px;padding:16px 17px;min-width:0}
.mcalc .head b{display:block;color:var(--muted);font-size:12.5px;font-weight:800;margin-bottom:3px}
.mcalc .headVal{font-size:clamp(21px,4.4vw,32px);font-weight:900;color:var(--blue);
  font-variant-numeric:tabular-nums;letter-spacing:-.02em;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;line-height:1.15}
.mcalc .head small{display:block;color:var(--muted);font-size:12.2px;margin-top:5px;font-weight:700}
.mcalc .cards{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mcalc .mkpi{background:#fff;border:1px solid var(--line);border-radius:14px;padding:11px 13px;
  min-width:0;overflow:hidden}
.mcalc .mkpi span{display:block;color:var(--muted);font-size:11.7px;font-weight:800;margin-bottom:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mcalc .mval{font-size:clamp(14px,2.6vw,19px);font-weight:900;font-variant-numeric:tabular-nums;
  color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}
.mcalc .lim{display:grid;gap:7px}
.mcalc .limRow{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:9px 12px;font-size:12.8px}
.mcalc .limRow .n{font-weight:800;color:var(--blue);min-width:0}
.mcalc .limRow .v{font-variant-numeric:tabular-nums;font-weight:800;color:var(--muted);
  text-align:right;white-space:nowrap}
.mcalc .limRow .sub{display:block;font-weight:700;font-size:11.3px;color:var(--muted);
  white-space:normal;margin-top:2px}
.mcalc .limRow.bind{border-color:rgba(242,140,40,.55);background:rgba(242,140,40,.07)}
.mcalc .limRow.bind .v{color:#8a4d05}
.mcalc .pill{font-size:10.5px;font-weight:900;padding:2px 7px;border-radius:999px;
  background:#F1F5F9;color:var(--muted);margin-left:6px;white-space:nowrap}
.mcalc .pill.on{background:rgba(242,140,40,.18);color:#8a4d05}
.mcalc canvas{width:100%;height:240px;display:block;touch-action:pan-y}
.mcalc .tbl{max-height:330px;overflow:auto;border:1px solid var(--line);border-radius:12px;background:#fff}
.mcalc table{width:100%;border-collapse:collapse;font-size:12.5px}
.mcalc th,.mcalc td{padding:7px 8px;text-align:right;font-variant-numeric:tabular-nums;
  border-bottom:1px solid var(--line);white-space:nowrap}
.mcalc th{position:sticky;top:0;background:#F8FAFC;color:var(--blue);font-size:11.4px;z-index:1}
.mcalc th:first-child,.mcalc td:first-child{text-align:left;font-weight:800;color:var(--muted)}
.mcalc tbody tr:last-child td{border-bottom:none}
.mcalc .warn{border:1px solid rgba(220,38,38,.35);background:#fef6f6;color:#7f1d1d;
  border-radius:12px;padding:10px 13px;font-size:12.5px;line-height:1.5}
.mcalc .good{border:1px solid rgba(14,124,90,.35);background:rgba(14,124,90,.06);color:#0E7C5A;
  border-radius:12px;padding:10px 13px;font-size:12.5px;font-weight:800;line-height:1.5}
@media (max-width:1000px){.mcalc .grid2{grid-template-columns:1fr}}
@media (max-width:520px){.mcalc .cards,.mcalc .g2{grid-template-columns:1fr}
  .mcalc .g4{grid-template-columns:1fr 1fr}}
/* ------------------------------------------------------- print, all tools */
/* A calculator is two screens tall. Telling the browser not to break the whole
   section is impossible to honour, so it breaks anywhere. Instead every card
   is protected and only the page furniture is dropped. */
@page{margin:14mm 12mm}
@media print{
  .mcalc .segRow,.mcalc input[type=range],.btnRow,.topbar{display:none!important}
  .mcalc .tbl{max-height:none;overflow:visible}
  /* One column on paper. Two columns of 90 mm squeeze every label. */
  .mcalc .grid2,.icalc .calcGrid{display:block!important}
  .mcalc .col,.icalc .col{display:block}
  /* Nothing that belongs together may be torn in half. */
  .mcalc .panel,.mcalc .head,.mcalc .mkpi,.mcalc .limRow,.mcalc .note,.mcalc .cards,
  .icalc .ibox,.icalc .verdict,.icalc .kpi,.icalc .chartCard,.icalc .tableCard,
  .icalc .note,.printHead,table,tr,figure{break-inside:avoid;page-break-inside:avoid}
  thead{display:table-header-group}
  h1,h2,h3,h4{break-after:avoid;page-break-after:avoid}
  /* The dark banner eats a third of the first page and a lot of ink. */
  .mcalc .hero,.icalc .hero{display:none!important}
  /* The call to action and the legal block belong on the site, not in a print out. */
  #shellCta,#shellFooter,.footer{display:none!important}
  .printHead{display:block!important;border-bottom:2px solid var(--blue);
    padding-bottom:8px;margin-bottom:12px}
  .printHead .pTitle{font-size:17px;font-weight:900;color:var(--blue)}
  .printHead .pMeta{font-size:11.5px;color:var(--muted);font-weight:700;margin-top:3px}
  .printHead .pFoot{font-size:10.5px;color:var(--muted);margin-top:5px}
  .icalc canvas{max-height:150mm}
}
.printHead{display:none}

.calcNote{margin:10px 0 0;padding:9px 12px;border-radius:11px;font-size:12.6px;
  font-weight:700;color:#0E7C5A;background:rgba(14,124,90,.07);
  border:1px solid rgba(14,124,90,.3)}