:root{
  --brand:hsl(161 78% 36%);
  --brand-2:hsl(168 75% 28%);
  --emerald:hsl(152 76% 42%);
  --indigo:hsl(239 62% 58%);
  --gold:hsl(42 91% 56%);
  --slate-950:hsl(222 47% 7%);
  --slate-900:hsl(222 40% 11%);
  --slate-800:hsl(215 32% 18%);
  --slate-700:hsl(215 24% 28%);
  --slate-200:hsl(214 32% 91%);
  --slate-100:hsl(210 40% 96%);
  --white:hsl(0 0% 100%);
  --ring:hsl(161 78% 36% / .38);
  --glass:hsl(0 0% 100% / .72);
  --glass-dark:hsl(222 47% 7% / .66);
  --shadow-sm:0 8px 22px hsl(222 47% 7% / .08);
  --shadow-md:0 18px 48px hsl(222 47% 7% / .14);
  --shadow-lg:0 28px 90px hsl(161 78% 36% / .24);
  --radius:1.5rem;
}

*,*::before,*::after{box-sizing:border-box}
html{min-width:320px;text-rendering:optimizeLegibility;-webkit-text-size-adjust:100%}
body{margin:0;line-height:1.5}
p,h1,h2,h3,h4,h5,h6,span,div,a,button,label,input,select,textarea,li,td,th{
  word-wrap:break-word;
  overflow-wrap:break-word;
}
img,svg,video,canvas,iframe{max-width:100%;height:auto}
button,input,select,textarea{font:inherit;max-width:100%}
a{transition:color .2s ease,background-color .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease}
button{cursor:pointer;transition:transform .18s ease,box-shadow .22s ease,background-color .22s ease,border-color .22s ease,color .22s ease}
button:disabled{cursor:not-allowed;opacity:.58;filter:saturate(.75)}
.hidden,[hidden]{display:none!important}

::selection{background:hsl(161 78% 36% / .24);color:var(--slate-950)}
.dark ::selection{background:hsl(161 70% 50% / .34);color:white}
::-webkit-scrollbar{width:12px;height:12px}
::-webkit-scrollbar-track{background:hsl(210 40% 96%)}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--brand),var(--indigo));border:3px solid hsl(210 40% 96%);border-radius:999px}
.dark ::-webkit-scrollbar-track{background:hsl(222 47% 7%)}
.dark ::-webkit-scrollbar-thumb{border-color:hsl(222 47% 7%);background:linear-gradient(180deg,hsl(161 70% 48%),hsl(239 62% 64%))}

:focus{outline:none}
:focus-visible{
  outline:3px solid transparent;
  box-shadow:0 0 0 4px var(--ring),0 0 0 7px hsl(0 0% 100% / .88);
}
.dark :focus-visible{box-shadow:0 0 0 4px hsl(161 70% 50% / .42),0 0 0 7px hsl(222 47% 7% / .9)}

body::before,body::after{
  content:"";
  position:fixed;
  inset:auto;
  pointer-events:none;
  z-index:-1;
  width:34rem;
  height:34rem;
  border-radius:999px;
  filter:blur(60px);
  opacity:.42;
}
body::before{top:-11rem;left:-10rem;background:hsl(161 78% 65% / .85)}
body::after{right:-12rem;bottom:-13rem;background:hsl(239 62% 72% / .7)}
.dark body::before{background:hsl(161 78% 30% / .5);opacity:.55}
.dark body::after{background:hsl(239 62% 38% / .46);opacity:.5}

header{
  box-shadow:0 1px 0 hsl(0 0% 100% / .5),0 14px 38px hsl(222 47% 7% / .06);
}
.dark header{box-shadow:0 1px 0 hsl(0 0% 100% / .08),0 18px 48px hsl(0 0% 0% / .3)}
nav>a:first-child span:first-child{
  position:relative;
  isolation:isolate;
  background:linear-gradient(135deg,hsl(161 78% 32%),hsl(170 86% 26%));
}
nav>a:first-child span:first-child::after{
  content:"";
  position:absolute;
  inset:-5px;
  z-index:-1;
  border-radius:1.25rem;
  background:linear-gradient(135deg,hsl(161 78% 46% / .35),hsl(239 62% 64% / .28));
  filter:blur(10px);
}
nav a[href^="#"]:hover{transform:translateY(-1px)}
nav a[href^="#"]:active,button:active{transform:translateY(1px) scale(.985)}

main{position:relative}
main::before{
  content:"";
  position:absolute;
  top:3rem;
  right:1rem;
  width:min(48vw,38rem);
  height:min(48vw,38rem);
  pointer-events:none;
  border-radius:999px;
  background:radial-gradient(circle,hsl(161 78% 65% / .24),transparent 65%);
  filter:blur(14px);
}
.dark main::before{background:radial-gradient(circle,hsl(161 78% 36% / .18),transparent 68%)}

h1,h2,h3,.font-display{letter-spacing:-.045em}
h1{
  text-wrap:balance;
  background:linear-gradient(110deg,var(--slate-950) 8%,hsl(161 78% 25%) 52%,hsl(239 62% 42%) 96%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent!important;
}
.dark h1{background:linear-gradient(110deg,#fff 5%,hsl(161 70% 76%) 56%,hsl(239 85% 78%) 100%);-webkit-background-clip:text;background-clip:text}
p{max-width:100%}

.inline-flex.rounded-full.border,
section .rounded-2xl,
section .rounded-3xl,
article,
aside,
form,
.card,
.panel,
.glass{
  backdrop-filter:blur(18px) saturate(145%);
  -webkit-backdrop-filter:blur(18px) saturate(145%);
}
section .rounded-3xl,article,aside,form,.card,.panel{
  box-shadow:var(--shadow-md);
  border-color:hsl(0 0% 100% / .52);
}
.dark section .rounded-3xl,.dark article,.dark aside,.dark form,.dark .card,.dark .panel{
  box-shadow:0 24px 70px hsl(0 0% 0% / .38);
  border-color:hsl(0 0% 100% / .12);
}

a[href="#calculator"],button[type="submit"],.btn-primary,
.bg-brand-700,.bg-brand-800{
  background:linear-gradient(135deg,hsl(161 78% 31%),hsl(170 84% 24%))!important;
  color:#fff!important;
  box-shadow:0 18px 45px hsl(161 78% 31% / .3);
}
a[href="#calculator"]:hover,button[type="submit"]:hover,.btn-primary:hover,
.bg-brand-700:hover,.bg-brand-800:hover{
  background:linear-gradient(135deg,hsl(161 78% 26%),hsl(170 84% 20%))!important;
  box-shadow:0 22px 58px hsl(161 78% 31% / .38);
  transform:translateY(-2px);
}
#themeToggle{
  background:linear-gradient(135deg,hsl(222 47% 10%),hsl(215 32% 18%))!important;
  color:white!important;
  border-color:hsl(222 47% 7% / .24)!important;
}
.dark #themeToggle{
  background:linear-gradient(135deg,#fff,hsl(161 68% 91%))!important;
  color:hsl(222 47% 9%)!important;
  border-color:hsl(0 0% 100% / .28)!important;
}
#openAssumptionsModal{
  background:hsl(0 0% 100% / .92)!important;
  color:hsl(222 47% 7%)!important;
  box-shadow:0 14px 32px hsl(222 47% 7% / .1);
}
#openAssumptionsModal:hover{box-shadow:0 18px 42px hsl(222 47% 7% / .14);transform:translateY(-2px)}
.dark #openAssumptionsModal{
  background:hsl(222 47% 7% / .78)!important;
  color:white!important;
  border-color:hsl(0 0% 100% / .82)!important;
}

input,select,textarea{
  width:100%;
  border:1px solid hsl(215 18% 72%);
  border-radius:1rem;
  background:hsl(0 0% 100% / .9);
  color:var(--slate-950);
  padding:.85rem 1rem;
  box-shadow:inset 0 1px 0 hsl(0 0% 100% / .7),0 8px 22px hsl(222 47% 7% / .045);
  transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease;
}
input:hover,select:hover,textarea:hover{border-color:hsl(161 50% 45%)}
input:focus,select:focus,textarea:focus{
  border-color:var(--brand);
  box-shadow:0 0 0 4px hsl(161 78% 36% / .18),0 12px 28px hsl(222 47% 7% / .08);
}
.dark input,.dark select,.dark textarea{
  background:hsl(222 47% 9% / .78);
  border-color:hsl(0 0% 100% / .18);
  color:white;
  box-shadow:inset 0 1px 0 hsl(0 0% 100% / .06);
}
.dark input::placeholder,.dark textarea::placeholder{color:hsl(214 20% 72%)}
label{font-weight:700;color:hsl(215 32% 18%)}
.dark label{color:hsl(210 40% 94%)}

table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border-radius:1rem}
th,td{padding:.9rem 1rem;text-align:left;border-bottom:1px solid hsl(214 32% 91%);vertical-align:top}
th{font-size:.82rem;text-transform:uppercase;letter-spacing:.06em;color:hsl(215 25% 27%);background:hsl(161 55% 96%)}
tr:hover td{background:hsl(161 55% 96% / .6)}
.dark th{background:hsl(161 54% 18% / .36);color:hsl(161 70% 84%)}
.dark td{border-color:hsl(0 0% 100% / .1)}
.dark tr:hover td{background:hsl(0 0% 100% / .05)}

#calculator,#insights,#faq{scroll-margin-top:6rem}
[id*="modal" i],.modal,.dialog,.overlay{
  z-index:9999;
}
.modal,.dialog,[role="dialog"]{
  max-width:min(92vw,760px);
  max-height:min(86vh,900px);
  overflow:auto;
  border-radius:1.5rem;
  background:hsl(0 0% 100% / .92);
  box-shadow:0 40px 120px hsl(222 47% 7% / .32);
  animation:modalIn .28s cubic-bezier(.2,.8,.2,1) both;
}
.dark .modal,.dark .dialog,.dark [role="dialog"]{
  background:hsl(222 47% 8% / .94);
  color:white;
  box-shadow:0 44px 130px hsl(0 0% 0% / .64);
}
.overlay,.backdrop,[data-backdrop]{
  position:fixed;
  inset:0;
  background:radial-gradient(circle at 50% 20%,hsl(161 78% 36% / .24),transparent 32%),hsl(222 47% 7% / .68);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  animation:fadeIn .22s ease both;
}

.loading,.is-loading{position:relative;color:transparent!important;pointer-events:none}
.loading::after,.is-loading::after{
  content:"";
  position:absolute;
  inset:50% auto auto 50%;
  width:1.25rem;
  height:1.25rem;
  margin:-.625rem 0 0 -.625rem;
  border-radius:999px;
  border:3px solid hsl(0 0% 100% / .48);
  border-top-color:#fff;
  animation:spin .75s linear infinite;
}
.skeleton{
  color:transparent!important;
  border-radius:.8rem;
  background:linear-gradient(90deg,hsl(214 32% 91%),hsl(0 0% 100%),hsl(214 32% 91%));
  background-size:220% 100%;
  animation:shimmer 1.35s ease-in-out infinite;
}
.dark .skeleton{background:linear-gradient(90deg,hsl(215 32% 18%),hsl(215 25% 27%),hsl(215 32% 18%));background-size:220% 100%}

.fade-in{animation:fadeUp .55s cubic-bezier(.2,.8,.2,1) both}
.pulse-soft{animation:pulseSoft 2.6s ease-in-out infinite}
[aria-live]{min-height:1.25rem}

@media (max-width:768px){
  h1{text-wrap:pretty}
  nav{align-items:center}
  nav>a:first-child{max-width:calc(100% - 8.5rem)}
  .rounded-2xl,.rounded-3xl{border-radius:1.1rem}
  th,td{padding:.75rem .8rem}
  table{display:block;overflow-x:auto;white-space:nowrap}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
}

@keyframes spin{to{transform:rotate(360deg)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes modalIn{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes shimmer{0%{background-position:120% 0}100%{background-position:-120% 0}}
@keyframes pulseSoft{0%,100%{box-shadow:0 0 0 0 hsl(161 78% 36% / .22)}50%{box-shadow:0 0 0 12px hsl(161 78% 36% / 0)}}