/* Softomate calculator. Every rule is prefixed .sc- so it cannot touch the rest of the site
   (style.css is large and uses !important in places). Font and colour follow the site:
   Red Hat Display, #003d82. Slim on purpose: 15px text, 38px controls, tight gaps. */
.sc-calc{
  --sc-blue:#003d82; --sc-blue-2:#002f66; --sc-soft:#e8eff9; --sc-panel:#f3f6fb; --sc-field:#fff;
  --sc-ink:#0f172a; --sc-muted:#5b6779; --sc-edge:#d3dcea; --sc-track:#d5deeb; --sc-good:#1d6a4b; --sc-warn:#9a5a12;
  font-family:'Red Hat Display',system-ui,-apple-system,'Segoe UI',sans-serif; font-size:15px; line-height:1.45; color:var(--sc-ink);
  text-align:left; margin:0 auto; max-width:1360px; padding:0 20px; box-sizing:border-box;
}
.sc-calc *,.sc-calc *::before,.sc-calc *::after{box-sizing:border-box}
.sc-calc h2,.sc-calc h3,.sc-calc p{margin:0;font-family:inherit}
.sc-calc [hidden]{display:none!important}
.sc-calc input,.sc-calc select,.sc-calc textarea,.sc-calc button{font-family:inherit;font-size:inherit;margin:0;letter-spacing:normal;text-transform:none}

.sc-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:22px;align-items:start}
@media (max-width:900px){.sc-grid{grid-template-columns:minmax(0,1fr)}}
.sc-left{display:flex;flex-direction:column;gap:12px;min-width:0}

/* mode switch */
.sc-modebar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.sc-seg{display:inline-flex;background:var(--sc-soft);border-radius:9px;padding:3px}
.sc-calc .sc-seg button{all:unset;box-sizing:border-box;cursor:pointer;padding:7px 18px;border-radius:7px;font-weight:700;font-size:14px;color:var(--sc-blue);font-family:inherit}
.sc-calc .sc-seg button[aria-pressed=true]{background:var(--sc-blue);color:#fff}
.sc-calc .sc-seg button:focus-visible{outline:2px solid var(--sc-blue);outline-offset:2px}
.sc-modehint{font-size:13px;color:var(--sc-muted)}

/* form + panels. Basic: one panel, panels dissolve into it. Advanced: separate panels. */
.sc-form{display:flex;flex-direction:column;gap:12px}
.sc-calc[data-mode=basic] .sc-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 24px;background:var(--sc-panel);border-radius:12px;padding:18px}
.sc-calc[data-mode=basic] .sc-panel,.sc-calc[data-mode=basic] .sc-fg{display:contents}
.sc-calc[data-mode=basic] .sc-ph,.sc-calc[data-mode=basic] .sc-cost,.sc-calc[data-mode=basic] [data-tier=adv]{display:none}
.sc-calc[data-mode=adv] .sc-panel{background:var(--sc-panel);border-radius:12px;padding:16px 18px 18px}
.sc-calc[data-mode=adv] .sc-fg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 24px;margin-top:14px}
@media (max-width:640px){
  .sc-calc[data-mode=basic] .sc-form,.sc-calc[data-mode=adv] .sc-fg{grid-template-columns:minmax(0,1fr)}
}
.sc-ph{display:flex;align-items:center;gap:12px}
.sc-ph h3{flex:1;font-size:17px;font-weight:800;line-height:1.2;color:var(--sc-ink)}
.sc-ph h3 small{display:block;font-size:13px;font-weight:500;color:var(--sc-muted);margin-top:2px}
.sc-panel.sc-off .sc-fg{display:none!important}
.sc-panel.sc-off .sc-ph h3{color:var(--sc-muted)}

.sc-switch{position:relative;width:38px;height:22px;flex:none;display:block}
.sc-switch input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer;z-index:1;width:100%;height:100%}
.sc-switch i{position:absolute;inset:0;background:#c2cddd;border-radius:11px;transition:background .15s}
.sc-switch i::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.3);transition:transform .15s}
.sc-switch input:checked + i{background:var(--sc-blue)}
.sc-switch input:checked + i::after{transform:translateX(16px)}
.sc-switch input:focus-visible + i{outline:2px solid var(--sc-blue);outline-offset:3px}

/* a question */
.sc-f{min-width:0}
.sc-f label{display:block;font-weight:700;font-size:14.5px;line-height:1.3;color:var(--sc-ink);margin:0}
.sc-hint{font-size:12.5px;color:var(--sc-muted);line-height:1.35;margin-top:1px}
.sc-ctl{display:flex;align-items:center;gap:12px;margin-top:6px}
.sc-box{display:flex;align-items:center;gap:2px;background:var(--sc-field);border:1px solid var(--sc-edge);border-radius:8px;height:38px;padding:0 10px;flex:none;width:92px;justify-content:flex-end}
.sc-box:focus-within{border-color:var(--sc-blue);box-shadow:0 0 0 3px rgba(0,61,130,.15)}
.sc-box span{color:var(--sc-muted);font-size:14px}
.sc-calc .sc-box input{all:unset;box-sizing:content-box;width:5ch;text-align:right;font:700 16px 'Red Hat Display',system-ui,sans-serif;font-variant-numeric:tabular-nums;color:var(--sc-ink)}
.sc-calc .sc-box input::-webkit-outer-spin-button,.sc-calc .sc-box input::-webkit-inner-spin-button{-webkit-appearance:none}
.sc-dd{position:relative;margin-top:6px}
.sc-calc .sc-dd select{-webkit-appearance:none;appearance:none;width:100%;height:38px;background:var(--sc-field);border:1px solid var(--sc-edge);border-radius:8px;color:var(--sc-ink);font-weight:700;font-size:15px;padding:0 34px 0 11px;cursor:pointer}
.sc-calc .sc-dd select:focus-visible{outline:none;border-color:var(--sc-blue);box-shadow:0 0 0 3px rgba(0,61,130,.15)}
.sc-dd::after{content:"";position:absolute;right:14px;top:13px;width:7px;height:7px;border-right:2px solid var(--sc-muted);border-bottom:2px solid var(--sc-muted);transform:rotate(45deg);pointer-events:none}
.sc-calc input[type=range]{-webkit-appearance:none;appearance:none;flex:1;min-width:0;height:22px;background:transparent;margin:0;padding:0;cursor:pointer;border:0;box-shadow:none}
.sc-calc input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(to right,var(--sc-blue) var(--p,50%),var(--sc-track) var(--p,50%))}
.sc-calc input[type=range]::-moz-range-track{height:4px;border-radius:2px;background:var(--sc-track)}
.sc-calc input[type=range]::-moz-range-progress{height:4px;border-radius:2px;background:var(--sc-blue)}
.sc-calc input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;margin-top:-7px;border-radius:50%;background:#fff;border:2px solid var(--sc-blue);box-shadow:0 1px 3px rgba(15,23,42,.25)}
.sc-calc input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid var(--sc-blue)}
.sc-calc input[type=range]:focus-visible{outline:2px solid var(--sc-blue);outline-offset:4px;border-radius:4px}
.sc-basicnote{font-size:13px;color:var(--sc-muted)}
.sc-calc[data-mode=adv] .sc-basicnote{display:none}

/* prices (Advanced) */
.sc-cost{background:var(--sc-panel);border-radius:12px;padding:0 18px}
.sc-cost summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;padding-block:14px;font-size:17px;font-weight:800}
.sc-cost summary::-webkit-details-marker{display:none}
.sc-cost summary::after{content:"+";font-weight:500;font-size:22px;color:var(--sc-muted)}
.sc-cost[open] summary::after{content:"\2212"}
.sc-cost table{width:100%;border-collapse:collapse;font-size:14px;margin:0 0 4px;background:none}
.sc-cost th{font-weight:600;font-size:12.5px;color:var(--sc-muted);text-align:right;padding:0 0 6px;border:0;background:none}
.sc-cost th:first-child{text-align:left}
.sc-cost td{padding:4px 0;border:0;background:none}
.sc-cost td:first-child{font-weight:700}
.sc-cost td .sc-box{height:34px;width:88px;margin-left:auto}
.sc-cost td .sc-box input{width:5ch;font-size:15px}
.sc-cost .sc-note{font-size:12.5px;color:var(--sc-muted);padding-bottom:14px}

/* answer card */
.sc-side{position:sticky;top:16px;min-width:0}
@media (max-width:900px){.sc-side{position:static}}
.sc-card{background:var(--sc-soft);border-radius:12px;padding:22px;min-height:420px}
@media (max-width:520px){.sc-card{padding:18px 16px}}
.sc-k{font-size:14px;color:var(--sc-muted)}
.sc-fig{font-weight:800;font-size:clamp(46px,7vw,64px);line-height:1;letter-spacing:-.03em;margin-top:4px;color:var(--sc-blue);font-variant-numeric:tabular-nums}
.sc-upto{margin-top:8px;font-size:14px;color:var(--sc-muted)}
.sc-upto b{color:var(--sc-ink);font-weight:700}
.sc-ver{margin-top:16px;display:flex;gap:9px;align-items:baseline}
.sc-ver::before{content:"";flex:none;width:9px;height:9px;border-radius:50%;background:var(--sc-good);transform:translateY(-1px)}
.sc-ver.sc-warn::before{background:var(--sc-warn)}
.sc-v-title{display:block;font-weight:800;font-size:16px}
.sc-v-text{color:var(--sc-muted);font-size:14px;margin-top:2px}
.sc-three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:18px}
.sc-three > div{background:#fff;border-radius:9px;padding:10px 12px}
.sc-three .sc-l{font-size:12px;color:var(--sc-muted);line-height:1.3;min-height:2.6em}
.sc-three .sc-v{font-weight:800;font-size:17px;margin-top:3px;font-variant-numeric:tabular-nums;white-space:nowrap}
@media (max-width:440px){.sc-three{gap:6px}.sc-three > div{padding:9px}.sc-three .sc-v{font-size:14px}}
.sc-calc .sc-btn{display:flex;justify-content:center;align-items:center;width:100%;margin-top:18px;padding:13px 18px;background:var(--sc-blue);color:#fff;border:0;border-radius:9px;font-weight:700;font-size:15px;line-height:1.2;cursor:pointer;text-decoration:none;text-align:center}
.sc-calc .sc-btn:hover{background:var(--sc-blue-2);color:#fff}
.sc-calc .sc-btn:disabled{opacity:.7;cursor:not-allowed}
.sc-calc .sc-btn:focus-visible{outline:2px solid var(--sc-blue);outline-offset:3px}
.sc-call{display:block;text-align:center;margin-top:10px;font-size:13.5px;color:var(--sc-muted)}
.sc-call a{color:var(--sc-blue);font-weight:700;text-decoration:none}

/* lead form */
.sc-lead-form{margin-top:16px;background:#fff;border-radius:10px;padding:16px}
.sc-lead-form h3{font-size:16px;font-weight:800}
.sc-lead-form .sc-sub{font-size:13px;color:var(--sc-muted);margin:2px 0 12px}
.sc-lead-form .sc-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
@media (max-width:520px){.sc-lead-form .sc-row{grid-template-columns:minmax(0,1fr)}}
.sc-lead-form label{display:block;font-size:12.5px;font-weight:700;margin-bottom:3px}
.sc-calc .sc-lead-form input[type=text],.sc-calc .sc-lead-form input[type=email],.sc-calc .sc-lead-form input[type=tel],.sc-calc .sc-lead-form textarea{width:100%;border:1px solid var(--sc-edge);border-radius:8px;padding:9px 10px;background:#fff;color:var(--sc-ink);font-size:14.5px;min-height:38px}
.sc-calc .sc-lead-form textarea{min-height:120px;font-size:12.5px;line-height:1.4;color:var(--sc-muted);resize:vertical;background:#f8fafc}
.sc-calc .sc-lead-form input:focus-visible,.sc-calc .sc-lead-form textarea:focus-visible{outline:none;border-color:var(--sc-blue);box-shadow:0 0 0 3px rgba(0,61,130,.15)}
.sc-lead-form .sc-field{margin-bottom:10px}
.sc-consent{font-size:12px;color:var(--sc-muted);margin:6px 0 2px}
.sc-consent a{color:var(--sc-blue)}
.sc-lead-msg{font-size:13.5px;margin-top:10px;padding:9px 11px;border-radius:8px}
.sc-lead-msg.sc-err{background:#fdecea;color:#8a2b1f}
.sc-lead-ok{margin-top:16px;background:#fff;border-radius:10px;padding:16px;font-weight:700}
.sc-lead-ok span{display:block;font-weight:500;color:var(--sc-muted);font-size:14px;margin-top:3px}
.sc-hp{position:absolute!important;left:-9999px!important;top:-9999px!important;height:0!important;width:0!important;overflow:hidden!important}

/* breakdown */
.sc-more{margin-top:16px;border-top:1px solid #cdd9ea;padding-top:12px;font-size:14px}
.sc-more summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;font-weight:700;padding-block:2px}
.sc-more summary::-webkit-details-marker{display:none}
.sc-more summary::after{content:"+";font-weight:500;font-size:20px;color:var(--sc-muted)}
.sc-more[open] summary::after{content:"\2212"}
.sc-more table{width:100%;border-collapse:collapse;margin-top:8px;font-size:13.5px;background:none}
.sc-more th{font-size:12px;font-weight:600;color:var(--sc-muted);text-align:right;padding:0 6px 6px;border:0;background:none}
.sc-more th:first-child{text-align:left;padding-left:0}
.sc-more td{padding:8px 6px;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;border:0;border-top:1px solid #d5e0ef;background:none}
.sc-more td:first-child{text-align:left;color:var(--sc-muted);white-space:normal;padding-left:0}
.sc-more td.sc-e{font-weight:800;background:#fff}
.sc-costline{margin-top:8px;font-size:13px;color:var(--sc-muted)}
.sc-more ul{padding-left:18px;margin:10px 0 6px;color:var(--sc-muted);font-size:13px;list-style:disc}
.sc-more li{margin-bottom:3px}
.sc-more code{font-family:ui-monospace,Consolas,monospace;font-size:12px;background:#fff;padding:1px 4px;border-radius:3px;color:var(--sc-ink)}
.sc-more p{font-size:13px;color:var(--sc-muted)}

.sc-noscript{background:var(--sc-panel);border-radius:12px;padding:16px;font-size:14px}
@media (prefers-reduced-motion:reduce){.sc-calc *{transition:none!important}}

/* page chrome around the calculator (full page only) */
.sc-page{font-family:'Red Hat Display',system-ui,sans-serif;color:#0f172a}
.sc-wrap{max-width:1360px;margin:0 auto;padding:0 20px}
.sc-intro{padding-block:36px 22px}
.sc-crumbs{font-size:13px;color:#5b6779;margin-bottom:10px}
.sc-crumbs a{color:#003d82;text-decoration:none}
.sc-intro h1{font-size:clamp(28px,4.4vw,44px);line-height:1.1;font-weight:900;letter-spacing:-.02em;margin:0;max-width:20ch;color:#0f172a;text-wrap:balance}
.sc-intro .sc-lede{font-size:17px;line-height:1.55;color:#475569;margin:12px 0 0;max-width:60ch}
.sc-after{padding-block:40px 10px}
.sc-after h2{font-size:22px;font-weight:800;margin:0 0 8px;color:#0f172a;letter-spacing:normal;line-height:1.25}
.sc-after p{font-size:15.5px;line-height:1.65;color:#334155;margin:0 0 10px}

/* worked example + what it counts + what it leaves out: three cards across the full width */
.sc-info{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr);gap:18px}
@media (max-width:1100px){.sc-info{grid-template-columns:repeat(2,minmax(0,1fr))}.sc-info .sc-info-main{grid-column:1/-1}}
@media (max-width:640px){.sc-info{grid-template-columns:minmax(0,1fr)}}
.sc-info > div{background:#f4f8ff;border:1px solid #dbe7f8;border-radius:18px;padding:22px 24px}
.sc-info p{margin:0}
.sc-after ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.sc-after li{position:relative;padding-left:28px;font-size:15.5px;line-height:1.5;color:#334155}
.sc-after li::before{content:"";position:absolute;left:0;top:2px;width:19px;height:19px;border-radius:50%;background-color:#003d82;background-position:center;background-repeat:no-repeat;background-size:12px}
.sc-after .sc-yes li::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.sc-after .sc-no li::before{background-color:#7a8599;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 7l10 10M17 7L7 17' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E")}

/* questions: same look as the FAQ on the other Softomate pages. Full width, numbered, first one open */
.sc-faqwrap{margin-top:52px}
.sc-after .sc-faqwrap h2{font-size:clamp(26px,3.4vw,38px);font-weight:900;letter-spacing:-.015em;margin-bottom:12px}
.sc-faq{counter-reset:scq;max-width:none}
.sc-faq details{counter-increment:scq;border-top:1px solid #e2e8f0;padding:18px 0}
.sc-faq details:last-child{border-bottom:1px solid #e2e8f0}
.sc-faq summary{cursor:pointer;display:flex;align-items:center;gap:18px;font-weight:600;font-size:17px;line-height:1.4;color:#0f172a;list-style:none}
.sc-faq summary::-webkit-details-marker{display:none}
.sc-faq summary::before{content:counter(scq,decimal-leading-zero);flex:none;width:38px;height:38px;border-radius:50%;background:#e8f0fb;color:#003d82;font-weight:800;font-size:13px;display:grid;place-items:center}
.sc-faq details[open] summary::before{background:#003d82;color:#fff}
.sc-faq summary::after{content:"+";margin-left:auto;flex:none;width:28px;height:28px;border:1px solid #d3dcea;border-radius:50%;display:grid;place-items:center;font-size:17px;font-weight:500;color:#003d82}
.sc-faq details[open] summary::after{content:"\2212"}
.sc-faq summary:focus-visible{outline:2px solid #003d82;outline-offset:4px;border-radius:8px}
.sc-after .sc-faq details p{margin:12px 0 0 56px;font-size:15.5px;line-height:1.7;color:#475569;max-width:980px}
@media (max-width:560px){.sc-faq summary{gap:12px;font-size:16px}.sc-after .sc-faq details p{margin-left:0}}

/* services, guides and more calculators */
.sc-sec{margin-top:52px}
.sc-sec-sub{margin:0 0 4px!important;color:#5b6779!important}
.sc-after .sc-updated{margin-top:30px!important;margin-bottom:10px}
.sc-updated{font-size:13px;color:#64748b;margin-top:14px}

/* teaser strip / card (homepage and blog posts) */
.sc-teaser{font-family:'Red Hat Display',system-ui,sans-serif;max-width:1120px;margin:0 auto;padding:0 16px}
.sc-teaser-in{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;background:#e8eff9;border-radius:12px;padding:18px 22px}
.sc-teaser-in strong{display:block;font-size:18px;font-weight:800;color:#0f172a;line-height:1.25}
.sc-teaser-in span{display:block;font-size:14px;color:#475569;margin-top:2px}
.sc-teaser-in a{flex:none;padding:11px 20px;background:#003d82;color:#fff;border-radius:9px;font-weight:700;font-size:14.5px;text-decoration:none}
.sc-teaser-in a:hover{background:#002f66;color:#fff}
.sc-teaser-in a:focus-visible{outline:2px solid #003d82;outline-offset:3px}

/* The site's global heading rules add tight letter-spacing; undo it inside our blocks. */
.sc-calc h2,.sc-calc h3,.sc-page h1,.sc-page h2,.sc-page h3{letter-spacing:normal;word-spacing:normal}
.sc-intro h1{letter-spacing:-.02em}
.sc-single .sc-ph{display:none}
.sc-single[data-mode=adv] .sc-fg{margin-top:0}