*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html{font-size:0.9375rem}body{min-height:100vh;background-color:var(--color-bg)}a:not([class]){-webkit-text-decoration-skip:ink;text-decoration-skip-ink:auto}img,picture{max-width:100%;display:block}a,input,button,textarea,select,::before,::after{font:inherit}:root{--red: hsl(0, 78%, 62%);--cyan: hsl(180, 62%, 55%);--orange: hsl(34, 97%, 64%);--blue: hsl(212, 86%, 64%);--color-bg: rgba(250, 250, 250, 255);--color-surface: rgb(255, 255, 255);--color-shadow: rgba(0, 0, 0, 0.1);--color-text-1: hsl(234, 12%, 34%);--color-text-2: hsl(212, 6%, 44%);--spacing-xs: 0.5rem;--spacing-sm: 0.75rem;--spacing-md-1: 1rem;--spacing-md-2: 1.5rem;--spacing-lg-1: 2rem;--spacing-lg-2: 2.5rem;--spacing-xl: 4rem}[data-theme=dark]{--color-bg: rgba(18, 18, 18, 1);--color-surface: rgb(28, 28, 30);--color-shadow: rgba(0, 0, 0, 0.5);--color-text-1: hsl(0, 0%, 95%);--color-text-2: hsl(0, 0%, 70%)}body{font-family:Poppins,Arial,Helvetica,sans-serif}h1,h2{color:var(--color-text-1)}h1{font-weight:600;text-align:center;font-size:clamp(1.6rem,3.6vw + .7rem,2.4rem);line-height:1.3}h1 span{font-weight:200}h2{font-weight:600}p{color:var(--color-text-2);line-height:1.5}.header__description{font-size:1rem;font-weight:400;text-align:center}.card__description{font-size:.9rem;font-weight:200}main{padding:var(--spacing-lg-1)}.header{display:grid;gap:var(--spacing-md-1);padding-block:var(--spacing-lg-1);max-width:34rem}@media screen and (min-width: 51.2rem){.header{padding-top:0}}.header,.card-section{margin-inline:auto}.card-section{display:grid;align-items:center;gap:var(--spacing-lg-1);width:-moz-fit-content;width:fit-content;margin-top:var(--spacing-lg-1)}@media screen and (min-width: 51.2rem){.card-section{grid-template-columns:repeat(2, 1fr);max-height:40em}}@media screen and (min-width: 68.26rem){.card-section{grid-template-columns:repeat(3, 1fr)}}.card,.card--cyan,.card--red,.card--orange,.card--blue{position:relative;display:flex;flex-direction:column;border-radius:.5rem;box-shadow:0 4px 20px var(--color-shadow);max-width:21rem;padding:var(--spacing-lg-1) var(--spacing-lg-1) var(--spacing-lg-2);background-color:var(--color-surface);overflow:hidden}.card__description{margin-top:var(--spacing-sm);margin-bottom:var(--spacing-lg-1)}.card__image{align-self:flex-end;width:4rem}.card--cyan::before,.card--red::before,.card--orange::before,.card--blue::before{content:"";position:absolute;top:0;left:0;width:100%}@media screen and (min-width: 68.26rem){.card--cyan{grid-row:1/3;grid-column:1/2}.card--red{grid-row:1/2;grid-column:2/3}.card--orange{grid-row:2/3;grid-column:2/3}.card--blue{grid-row:1/3;grid-column:3/4}}.card--cyan::before{border-top:.3rem solid var(--cyan)}.card--red::before{border-top:.3rem solid var(--red)}.card--orange::before{border-top:.3rem solid var(--orange)}.card--blue::before{border-top:.3rem solid var(--blue)}.theme-button{box-sizing:content-box;height:20px;width:45px;border:1px solid gray;border-radius:2rem;padding:3px;position:relative}.theme-button__toggle-knob{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);z-index:2;margin-left:2px;border-radius:100%;height:23px;width:23px;background-color:#000}.theme-button[data-theme=dark] .theme-button__toggle-knob{margin-left:27px;background-color:#fff}.theme-button>img{position:absolute;top:50%;left:0;height:20px;-webkit-user-select:none;-moz-user-select:none;user-select:none;transform:translateY(-50%)}.theme-button__light{margin-left:29px}.theme-button__dark{margin-left:3px}/*# sourceMappingURL=style.css.map */