.mortgage-page{--mortgage-green:var(--accent);--mortgage-green-dark:var(--accent-hover);--mortgage-cream:#f6f8f3;--mortgage-border:#dbe4d7;--mortgage-ink:var(--text-primary);--mortgage-muted:var(--text-secondary);background:linear-gradient(180deg,var(--bg-base) 0,#fff 34rem);color:var(--mortgage-ink);padding:2.25rem 1rem 4rem}
.mortgage-shell{max-width:1120px;margin:0 auto}.mortgage-hero{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;margin-bottom:1.5rem}.mortgage-eyebrow{color:var(--mortgage-green);font-weight:750;letter-spacing:.06em;text-transform:uppercase;font-size:.78rem;margin:0 0 .45rem}.mortgage-page h1{font-size:clamp(2rem,5vw,3.35rem);line-height:1.05;letter-spacing:-.045em;margin:0 0 .65rem;color:var(--mortgage-ink)}.mortgage-lede{font-size:1.02rem;line-height:1.65;color:var(--mortgage-muted);max-width:710px;margin:0}.language-switch{display:flex;border:1px solid var(--mortgage-border);border-radius:999px;background:#fff;padding:.22rem;flex:0 0 auto}.language-switch button{border:0;background:transparent;border-radius:999px;padding:.45rem .7rem;font-weight:700;color:var(--mortgage-muted)}.language-switch button.active{background:var(--mortgage-green);color:#fff}
.mortgage-grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:1.25rem;align-items:start}.mortgage-card{background:#fff;border:1px solid var(--mortgage-border);border-radius:20px;box-shadow:0 14px 42px rgba(var(--accent-rgb),.07);padding:1.4rem}.mortgage-card h2{font-size:1.2rem;margin:0 0 1.15rem}.field{margin-bottom:1rem}.field label,.field legend{display:block;font-weight:720;font-size:.9rem;margin-bottom:.42rem;color:var(--text-primary)}.field-help{font-size:.78rem;color:var(--mortgage-muted);margin:.35rem 0 0;line-height:1.45}.input-affix{position:relative}.input-affix span{position:absolute;left:.9rem;top:50%;transform:translateY(-50%);color:var(--text-secondary);font-weight:650}.input-affix.suffix span{left:auto;right:.9rem}.input-affix input{padding-left:2rem}.input-affix.suffix input{padding-left:.85rem;padding-right:2.3rem}.mortgage-page input,.mortgage-page select{width:100%;min-height:48px;border:1px solid var(--border);border-radius:10px;background:#fff;color:var(--mortgage-ink);font:inherit;font-size:1rem;padding:.7rem .85rem;outline:none}.mortgage-page input:focus,.mortgage-page select:focus{border-color:var(--mortgage-green);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.13)}.down-grid{display:grid;grid-template-columns:1fr .72fr;gap:.7rem}.segmented{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}.segmented label{position:relative;margin:0}.segmented input{position:absolute;opacity:0;pointer-events:none}.segmented span{display:flex;min-height:45px;align-items:center;justify-content:center;text-align:center;border:1px solid var(--border);border-radius:10px;font-weight:700;font-size:.88rem;padding:.45rem}.segmented input:checked+span{background:var(--accent-light);border-color:var(--mortgage-green);color:var(--mortgage-green)}.check-row{display:flex;gap:.65rem;align-items:flex-start;margin:.65rem 0}.check-row input{width:19px;min-height:19px;margin-top:.15rem;accent-color:var(--mortgage-green)}.check-row label{font-size:.88rem;line-height:1.45}.eligibility{border-left:3px solid var(--accent);background:var(--accent-light);border-radius:0 10px 10px 0;padding:.75rem .9rem;margin:.3rem 0 1rem}.field-error{display:none;color:#a22929;background:#fff2f2;border:1px solid #efc4c4;border-radius:9px;padding:.7rem .8rem;font-size:.86rem;line-height:1.45;margin:.75rem 0}.field-error.visible{display:block}.reset-button{border:1px solid #aebdac;background:#fff;color:var(--mortgage-green);font-weight:750;border-radius:10px;padding:.68rem 1rem;cursor:pointer}
.result-card{background:var(--mortgage-green);color:#fff;border:0;position:sticky;top:1rem}.result-label{font-size:.86rem;color:#dce8d9;margin:0}.payment-amount{font-size:clamp(2.5rem,7vw,4.25rem);font-weight:800;letter-spacing:-.055em;line-height:1.08;margin:.25rem 0 0}.payment-frequency{color:#e1eadf;font-weight:650;margin:.25rem 0 1.2rem}.result-summary{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.18);border-radius:12px;overflow:hidden}.result-stat{background:rgba(24,49,20,.36);padding:.8rem}.result-stat span{display:block;color:#d7e5d4;font-size:.76rem;margin-bottom:.22rem}.result-stat strong{font-size:1.04rem}.finance-toggle{background:rgba(255,255,255,.09);border-radius:10px;padding:.7rem .8rem;margin:.8rem 0}.finance-toggle .check-row{margin:0}.finance-toggle label{color:#fff}.breakdown{margin-top:1.1rem}.breakdown h3{font-size:.92rem;margin:0 0 .7rem}.bar{display:flex;height:12px;border-radius:999px;overflow:hidden;background:#fff}.bar span:nth-child(1){background:#b9d9ae}.bar span:nth-child(2){background:#f1c96d}.bar span:nth-child(3){background:#9fb1d9}.legend{display:grid;gap:.55rem;margin-top:.8rem}.legend-row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.55rem;font-size:.84rem}.dot{width:9px;height:9px;border-radius:50%}.dot.principal{background:#b9d9ae}.dot.insurance{background:#f1c96d}.dot.interest{background:#9fb1d9}.result-note{font-size:.76rem;line-height:1.55;color:#dce8d9;margin:1rem 0 0}.result-invalid{display:none;background:#fff4df;color:#533c0b;border-radius:10px;padding:.8rem;margin-bottom:1rem;font-size:.88rem}.result-invalid.visible{display:block}
.mortgage-info{margin-top:1.5rem;display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.info-block{background:#fff;border:1px solid var(--mortgage-border);border-radius:16px;padding:1.2rem}.info-block h2{font-size:1.08rem;margin:0 0 .45rem}.info-block p{color:var(--mortgage-muted);line-height:1.65;font-size:.91rem;margin:0}.sources{margin-top:1rem;color:var(--mortgage-muted);font-size:.78rem;line-height:1.6}.sources a{color:var(--mortgage-green);font-weight:650}.source-list{padding-left:1.1rem;margin:.4rem 0}.source-list li{margin:.2rem 0}

/* Keep currency and percentage symbols outside the editable typing area. */
.input-affix{display:grid;grid-template-columns:auto minmax(0,1fr);min-height:48px;border:1px solid var(--border);border-radius:10px;background:#fff;overflow:hidden}
.input-affix.suffix{grid-template-columns:minmax(0,1fr) auto}
.input-affix:focus-within{border-color:var(--mortgage-green);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.13)}
.input-affix span,.input-affix.suffix span{position:static;transform:none;display:flex;align-items:center;justify-content:center;min-width:42px;padding:0 .75rem;background:#f1f5ef;border-right:1px solid #d5dfd2;color:#526353;font-weight:750;user-select:none}
.input-affix.suffix span{grid-column:2;grid-row:1;border-right:0;border-left:1px solid #d5dfd2}
.input-affix input,.input-affix input:focus{grid-column:2;grid-row:1;min-width:0;min-height:46px;border:0;border-radius:0;padding:.7rem .85rem;box-shadow:none;background:#fff}
.input-affix.suffix input,.input-affix.suffix input:focus{grid-column:1;grid-row:1;padding:.7rem .85rem}
.calculator-actions{display:flex;gap:.65rem;margin-top:.25rem}.calculate-button,.reset-button{min-height:46px;border-radius:10px;padding:.68rem 1rem;font:inherit;font-weight:750;cursor:pointer}.calculate-button{flex:1;border:1px solid var(--mortgage-green);background:var(--mortgage-green);color:#fff}.calculate-button:hover{background:var(--mortgage-green-dark)}.reset-button{border:1px solid #aebdac;background:#fff;color:var(--mortgage-green)}
@media(max-width:780px){.mortgage-page{padding:1.35rem .75rem 6.5rem}.mortgage-hero{display:block}.language-switch{width:max-content;margin-top:1rem}.mortgage-grid{grid-template-columns:1fr}.result-card{position:static}.mortgage-info{grid-template-columns:1fr}.mortgage-card{padding:1.05rem;border-radius:15px}.payment-amount{font-size:2.65rem}.calculator-actions{position:fixed;z-index:1000;left:max(.75rem,env(safe-area-inset-left));right:max(.75rem,env(safe-area-inset-right));bottom:max(.65rem,env(safe-area-inset-bottom));margin:0;padding:.55rem;background:rgba(255,255,255,.96);border:1px solid var(--mortgage-border);border-radius:14px;box-shadow:0 10px 30px rgba(20,40,18,.22);backdrop-filter:blur(10px)}.calculate-button,.reset-button{min-height:50px}.reset-button{flex:0 0 auto}}
@media(max-width:420px){.down-grid{grid-template-columns:1fr 1fr;gap:.55rem}.segmented{gap:.35rem}.segmented span{font-size:.8rem;padding:.35rem}.result-summary{grid-template-columns:1fr 1fr}}