@font-face{font-family:'Host Grotesk';src:url('/fonts/host-grotesk-latin.woff2') format('woff2');font-weight:300 800;font-display:swap}
html{color-scheme:light;background:#fff}body{margin:0;padding:clamp(12px,2vw,28px);font-family:'Host Grotesk',system-ui,sans-serif;color:#171717;line-height:1.6}*{box-sizing:border-box}body>div{font-family:inherit!important}h1{display:none}h2,h3,h4{color:#171717!important;line-height:1.4}h2{font-size:clamp(1.25rem,1.05rem + 1vw,1.75rem)!important}button,input,select,textarea{font:inherit}button{min-height:40px;cursor:pointer}button:not([data-color]):not([aria-label*="color"]){border-radius:5px!important}input,select,textarea{max-width:100%;min-width:0}img,canvas,video{max-width:100%;height:auto}pre{white-space:pre-wrap;overflow-wrap:anywhere}a{color:inherit}p,label{line-height:1.65}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:2px solid #171717;outline-offset:3px}[style*="background:#5300d8"],[style*="background: #5300d8"],[style*="background:#5b2e91"]{background:#171717!important}h1[style],h2[style],h3[style]{color:#171717!important}[style*="color:#5300d8"],[style*="color: #5300d8"]{color:#171717!important}:root{--groot-purple:#171717;--purple:#171717;--brand:#171717}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}
button:not([class*="swatch"]):not([data-color]):not([style*="background-color"]){background:#171717!important;color:#fff!important;border:1px solid #171717!important}
button:hover{filter:brightness(1.15)}
.gc-code-title{color:#171717!important}
@media(max-width:980px){
  #groot-webcalc-final main{grid-template-columns:minmax(0,1fr)!important}
  #groot-webcalc-final main>*,#groot-webcalc-final .card-grid{min-width:0}
  #groot-webcalc-final .row.two{flex-direction:column}
  #groot-webcalc-final .check-wrap{white-space:normal!important}
  #groot-seo-tool>div[style*="grid-template-columns"]{grid-template-columns:minmax(0,1fr)!important}
  #groot-seo-tool>div[style*="grid-template-columns"]>*{min-width:0}
}
@media(max-width:640px){
  body *{min-width:0!important}
  button{white-space:normal;max-width:100%}
  iframe{max-width:100%}
  [style*="display:flex"],[style*="display: flex"]{flex-wrap:wrap}
  [style*="flex:0 0"],[style*="flex: 0 0"]{flex:1 1 100%!important;max-width:100%}
  [style*="grid-template-columns"]{grid-template-columns:minmax(0,1fr)!important}
  #groot-webcalc-final .row{flex-direction:column!important;flex-wrap:nowrap!important}
  #groot-webcalc-final .row>*{width:100%!important;max-width:100%!important}
}
