:root{--lime-green: hsl(163, 72%, 41%);--white: hsl(0, 0%, 100%);--bright-red: hsl(356, 69%, 56%);--facebook: hsl(208, 92%, 53%);--twitter: hsl(203, 89%, 53%);--youtube: hsl(348, 97%, 39%);--instagram-grad1: hsl(37, 97%, 70%);--instagram-grad2: hsl(329, 70%, 58%);--very-dark-blue: hsl(230, 17%, 14%);--very-dark-blue-pattern: hsl(232, 19%, 15%);--dark-desaturated-blue: hsl(228, 28%, 20%);--very-pale-blue: hsl(225, 100%, 98%);--light-grayish-blue: hsl(227, 47%, 96%);--dark-grayish-blue: hsl(228, 12%, 44%);--dark-toggle-grad1: hsl(210, 78%, 56%);--dark-toggle-grad2: hsl(146, 68%, 55%);--light-toggle-bg: hsl(230, 22%, 74%)}@media (prefers-media-scheme: dark){:root{--main-bg: var(--very-dark-blue);--text-clr-: var(--white);--card-bg: var(--dark-desaturated-blue);--toggle-bg: var(--dark-toggle-grad2) }}@media (prefers-media-scheme: light){:root{--main-bg: var(var(--white));--text-clr: var(--very-dark-blue);--card-bg: var(--light-grayish-blue);--toggle-bg: var(--light-toggle-bg) }}html{color-scheme:light dark;font-size:100%;scroll-behavior:smooth}[data-theme=dark]{color-scheme:dark;--main-bg: var(--very-dark-blue);--text-clr-: var(--white);--card-bg: var(--dark-desaturated-blue);--toggle-bg: var(--dark-toggle-grad2);--toggle-btn: var(--dark-desaturated-blue)}[data-theme=light]{color-scheme:light;--main-bg: var(--white);--text-clr: var(--very-dark-blue);--card-bg: var(--light-grayish-blue);--toggle-bg: var(--light-toggle-bg);--toggle-btn: var(--very-pale-blue)}*,*:after,*:before{margin:0;padding:0;box-sizing:border-box}img{display:block;height:auto;max-width:100%}fieldset{border:none}body{line-height:1.5;background-color:var(--main-bg);min-height:100dvh;transition:background-color .4s ease-in,color .4s ease-in;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;font-family:Inter,serif}.content--wrapper{margin-inline:auto;width:min(1200px,100% - 3rem)}.flex{display:flex;align-items:center}.flex__jcsb{justify-content:space-between}.grid{display:grid;gap:1.5em}@media screen and (width >= 768px){.grid{grid-template-columns:1fr 1fr}}@media screen and (width >= 980px){.grid{grid-template-columns:repeat(4,1fr)}}.text-accent{color:var(--text-clr);opacity:.85}h1,h2,h3,h4,label{font-weight:700;color:var(--text-clr);line-height:1.1}h1{font-size:clamp(1.5rem,.239vw + 1.424rem,1.75rem)}h1+p{color:var(--text-clr);opacity:.8}h2{font-size:1.5rem}h3{font-size:3.5rem}h3+p{letter-spacing:5px;text-transform:uppercase;font-weight:100;font-size:.75rem}h4{font-size:2rem}.up{color:var(--lime-green)}.down{color:var(--bright-red)}small,span{font-size:.85rem;font-weight:700}.header{padding-block:2rem}@media screen and (width <= 768px){.header .banner{border-bottom:1px solid steelblue;padding-bottom:1rem;margin-bottom:1rem}}@media screen and (width >= 768px){.header .content--wrapper{display:flex;align-items:center;justify-content:space-between}}.social-section,.stats-section h2{margin-bottom:1rem}.toggle-switch{-webkit-appearance:unset;-moz-appearance:unset;appearance:unset;background:var(--toggle-bg);width:4rem;height:2rem;border-radius:1.5rem;background-color:var(--toggle-bg);position:relative;transition:background-color .5s ease;cursor:pointer}.toggle-switch:after{content:"";position:absolute;width:1.5rem;height:1.5rem;border-radius:50%;background-color:var(--toggle-btn);box-shadow:0 2px 10px #00000040;top:calc(50% - .75rem);left:.25rem;transition:transform .3s ease}.toggle-switch:checked:after{transform:translate(2rem)}@media screen and (width >= 768px){.toggle-switch{display:inline-block;margin-inline-start:2rem}}.card{background-color:var(--card-bg);padding-block:2.5rem;text-align:center;display:flex;flex-direction:column;align-items:center;gap:1.5rem;border-radius:.25rem}.card.facebook{border-top:5px solid var(--facebook)}.card.twitter{border-top:5px solid var(--twitter)}.card.instagram{border-top:5px solid var(--instagram-grad2)}.card.youtube{border-top:5px solid var(--youtube)}.card__heading,.card__stat{gap:.5rem}.stat-card{background-color:var(--card-bg);padding:2rem}.stat-card__heading{margin-bottom:2rem}.stat-card__heading p{color:var(--text-clr);opacity:.75;font-size:.875rem}.stat-card__body .flex{gap:.25rem}