:root{--medium: 500;--bold: 700;--White: hsl(0, 0%, 100%);--Black: hsl(0, 0%, 0%);--Lime: hsl(61, 70%, 52%);--Red: hsl(4, 69%, 50%);--Slate-100: hsl(202, 86%, 94%);--Slate-300: hsl(203, 41%, 72%);--Slate-500: hsl(200, 26%, 54%);--Slate-700: hsl(200, 24%, 40%);--Slate-900: hsl(202, 55%, 16%)}*,*:before,*:after{box-sizing:border-box}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Plus Jakarta Sans,serif;font-optical-sizing:auto;font-weight:var(--medium);font-style:normal;font-size:1em;line-height:1.5;color:var(--Slate-900);background-color:var(--Slate-100);height:100vh;margin:0}#root{width:100%;height:100%;display:flex;flex-direction:column}@media (min-width: 1200px){#root{justify-content:center}}h1,h2,h3,h4,h5,h6{font-weight:var(--bold);line-height:1;margin:0}p{font-weight:var(--medium);margin:0}ul{padding-left:0;margin:0;list-style-type:none}.container{display:flex;flex-direction:column;width:100%;margin:0 auto}@media (min-width: 768px){.container{padding-top:2.5rem;width:43rem}}@media (min-width: 1200px){.container{width:63rem}}.main{background-color:var(--White);display:flex;flex-direction:column;justify-content:space-between;margin-bottom:1.5rem}.calculator{display:flex;flex-direction:column;background-color:var(--White);overflow:hidden}@media (min-width: 768px){.calculator{border-radius:1.5rem}}@media (min-width: 1200px){.calculator{flex-direction:row}}.calculator__head{display:flex;flex-direction:column;align-items:flex-start;margin-bottom:1.5rem}@media (min-width: 768px){.calculator__head{flex-direction:row;justify-content:space-between}}@media (min-width: 1200px){.calculator__head{margin-bottom:2.25rem}}.calculator h1{font-size:1.5rem;margin-bottom:.75rem}@media (min-width: 1200px){.calculator h1{margin-bottom:0}}.calculator__clear-btn{color:var(--Slate-700);font-size:1rem;text-decoration:underline;background-color:transparent;border:0;cursor:pointer}.calculator label,.calculator .calculator__legend{display:inline-block;color:var(--Slate-700);font-size:1rem;margin-bottom:.5rem}.calculator__inputgroup{position:relative;margin-bottom:1rem}.calculator__inputgroup:has(.calculator__err) input[type=text]{border:solid 1px var(--Red)!important}.calculator__inputgroup:has(.calculator__err) span{color:var(--White)!important;background-color:var(--Red)!important}.calculator input{z-index:1;cursor:pointer;color:var(--Slate-900);font-size:1.125rem;font-weight:var(--bold);position:relative;background:transparent;width:100%;height:3rem;border-radius:.25rem;border:solid 1px var(--Slate-700);transition:border .2s}.calculator input:hover{border:solid 1px var(--Slate-900)}.calculator input:focus{border:solid 1px var(--Lime);outline:0}.calculator input:focus+span{color:var(--Slate-900);background-color:var(--Lime)}.calculator__inputgroup--mortgageAmount input{padding:0 0 0 3.75rem}.calculator__inputgroup--mortgageAmount span{border-radius:.25rem 0 0 .25rem;color:var(--Slate-700);font-weight:var(--bold);background-color:var(--Slate-100);position:absolute;top:0;display:flex;justify-content:center;align-items:center;width:2.75rem;height:3rem;transition:color .2s,background-color .2s}.calculator__inputgroup--mortgageTerm input[type=text]{padding:0 6rem 0 1rem}.calculator__inputgroup--mortgageTerm span{transition:color .2s,background-color .2s;border-radius:0 .25rem .25rem 0;color:var(--Slate-700);font-weight:var(--bold);background-color:var(--Slate-100);position:absolute;top:0;right:0;display:flex;justify-content:center;align-items:center;width:5rem;height:3rem}.calculator__inputgroup--interestRate input[type=text]{padding:0 4.188rem 0 1rem}.calculator__inputgroup--interestRate span{transition:color .2s,background-color .2s;border-radius:0 .25rem .25rem 0;color:var(--Slate-700);font-weight:var(--bold);background-color:var(--Slate-100);position:absolute;top:0;right:0;display:flex;justify-content:center;align-items:center;width:3.188rem;height:3rem}.calculator__2-col{display:flex;flex-direction:column}@media (min-width: 768px){.calculator__2-col{flex-direction:row;gap:1.5rem}}.calculator__col{width:100%}@media (min-width: 768px){.calculator__col{width:50%}}.calculator__form{display:flex;flex-direction:column}.calculator__calc{width:100%;padding:2.5rem 1.5rem}@media (min-width: 768px){.calculator__calc{padding:2.5rem}}@media (min-width: 1200px){.calculator__calc{width:50%}}.calculator__results{width:100%;background-color:var(--Slate-900)}@media (min-width: 1200px){.calculator__results{width:50%;border-radius:0 0 0 5rem}}.calculator__radio-group{height:3rem;position:relative;margin-bottom:.75rem}.calculator__radio-group.calculator__radio-group--last{margin-bottom:0}.calculator__radio-group input[type=radio]{accent-color:var(--Slate-700);height:1.25rem;width:1.25rem;margin:0 1rem}.calculator__radio-group label{cursor:pointer;font-size:1.125rem;font-weight:var(--bold);color:var(--Slate-900);border:solid 1px var(--Slate-700);display:flex;align-items:center;width:100%;height:100%;margin:0;border-radius:.25rem;transition:border .2s,background-color .2s}.calculator__radio-group label:has(input[type=radio]:hover){background-color:var(--White);border:solid 1px var(--Lime)}.calculator__radio-group label:has(input[type=radio]:checked){background-color:#d8db2f26;border:solid 1px var(--Lime)}.calculator__submit{cursor:pointer;display:flex;align-items:center;font-size:1.125rem;font-weight:var(--bold);color:var(--Slate-900);background-color:var(--Lime);width:19.625rem;padding:0 0 0 2.5rem;margin-top:1.75rem;height:3.5rem;border-radius:1.75rem;border:0;transition:background-color .2s}.calculator__submit:hover{background-color:#eced97}.calculator__submit img{margin-right:.75rem}.calculator__err{font-size:.875rem;color:var(--Red);margin-top:.5rem}.calculator__results{display:flex}.calculator__empty{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:2rem}.calculator__empty h2{color:var(--White);font-size:1.5rem;margin-bottom:1rem}.calculator__empty p{color:var(--Slate-300);font-size:1rem;text-align:center}.calculator__your-results{padding:2.5rem 1.5rem}@media (min-width: 768px){.calculator__your-results{padding:2.5rem}}.calculator__your-results h2{color:var(--White);font-size:1.5rem;margin-bottom:1rem}.calculator__your-results p{color:var(--Slate-300);font-size:1rem}.calculator__results-container{background-color:#00000040;padding:2rem;margin-top:2.5rem;border-radius:.5rem;border-top:solid 4px var(--Lime)}p.calculator__repayments{line-height:1;font-size:3.5rem;color:var(--Lime);font-weight:var(--bold);margin-top:.75rem;margin-bottom:1.75rem}.calculator__results-container hr{border-top:solid 1px #9abed5;opacity:.25;margin-bottom:1.5rem}p.calculator__total{font-size:1.5rem;color:var(--White);font-weight:var(--bold);margin-top:.25rem}.footer{margin:0 auto;padding-top:2rem;padding-bottom:2rem;text-align:center}.footer p{font-size:.75rem;margin:0}.footer a{color:var(--Slate-900)}