html{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:inherit;box-sizing:inherit;margin:0;padding:0}:focus-visible{outline:2px solid currentcolor;outline-offset:2px}:root{font-size:16px;--z-base: 1;--z-header: 1000;--z-side-menu: 1100;--z-hamburger: 1200;--hamburger-border-color: transparent;--hamburger-border-width: 0;--hamburger-margin-top: 20px;--hamburger-margin-left: 20px;--side-menu-background: hsl(263deg 100% 87%);--side-menu-color: hsl(0deg 0% 0% / 0.14);--side-menu-item-background-hover: hsl(306deg 100% 61% / 0.15);--side-menu-width: 100%;--side-menu-padding: 22px;--side-menu-padding-top: 39px;--side-menu-item-height: 50px;--side-menu-item-lines: 2;--header-height: 60px;--theme-background: hsl(141deg 93% 83%);--page-background: hsl(from var(--theme-background) h s l / 0.4);--cards-grid-background: var(--page-background);--cards-item-background: hsl(0deg 0% 0% / 0.1);--cards-item-background-hover: hsl(from var(--theme-background) calc(h + 120) s l);--cards-item-title-lines: 2;--cards-item-title-heigh: calc(var(--cards-item-title-lines) * 1lh);--cards-item-description-lines: 3;--footer-color: hsl(0deg 0% 0%);--animation-timing: 0.2s;--animation-delay: 0.2s}@media(640px <= width <= 1023px){:root{--theme-background: hsl(202deg 100% 79%);--side-menu-width: 260px}}@media(width >= 1024px){:root{--theme-background: hsl(263deg 100% 87% / 0.4);--side-menu-background: var(--theme-background);--side-menu-width: 310px}}@media(prefers-reduced-motion: reduce){:root{--animation-timing: 0.01ms;--animation-delay: 0s}}body{display:grid;grid-template:"header" auto "main" 1fr "footer" auto/1fr;min-height:100vh;background-color:#fff}.header{grid-area:header}main{grid-area:main;background-color:var(--page-background)}.footer{grid-area:footer}@media(width >= 1024px){body{grid-template:"menu header" auto "menu main" 1fr "footer footer" auto/310px 1fr}.side-menu{grid-area:menu}}body{font-family:Roboto,sans-serif}.header{position:sticky;top:0;z-index:var(--z-header);width:-moz-available;width:-webkit-fill-available;width:stretch;height:var(--header-height);background-color:var(--theme-background);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.header__buttons{margin-left:auto;margin-right:10px;display:-webkit-box;display:-ms-flexbox;display:flex;gap:16px}@media(width >= 1024px){.header{position:static;z-index:auto}}.footer{color:var(--footer-color);background-color:var(--theme-background);padding:12px;font-size:12px;font-weight:500}.footer__title{font-weight:700;font-size:14px}@media(640px <= width <= 1023px){.footer{-webkit-padding-after:0;padding-block-end:0}}@media(width >= 1024px){.footer{border-top:1px solid rgba(0,0,0,.14)}.footer__text{display:block;width:960px}}.side-menu{position:fixed;top:0;bottom:0;left:0;z-index:var(--z-side-menu);width:var(--side-menu-width);height:100vh;height:100dvh;padding-inline:var(--side-menu-padding);overflow-y:auto;background-color:var(--side-menu-background);color:var(--side-menu-color);-webkit-transition:translate var(--animation-timing);transition:translate var(--animation-timing)}.side-menu[aria-hidden=true]{translate:-100%}.side-menu[aria-hidden=false]{translate:0}.side-menu__header{position:sticky;top:0;z-index:var(--z-base);height:var(--header-height);margin-inline:calc(var(--side-menu-padding)*-1);background-color:var(--side-menu-background)}.side-menu__list{list-style:none}.side-menu__item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:var(--side-menu-item-height);padding-inline:12px 20px;border-radius:9999px}.side-menu__item::before{-ms-flex-negative:0;flex-shrink:0;width:31px;height:31px;-webkit-margin-end:20px;margin-inline-end:20px;content:"";background-color:var(--side-menu-color);-webkit-mask:url("../images/list-icon.svg") no-repeat center/contain;mask:url("../images/list-icon.svg") no-repeat center/contain}@media(hover: hover){.side-menu__item:hover{background-color:var(--side-menu-item-background-hover)}}.side-menu__link{font-weight:500;color:var(--side-menu-color);text-decoration:none;overflow-wrap:break-word;-ms-hyphens:auto;hyphens:auto;display:-webkit-box;-webkit-box-orient:vertical;line-clamp:var(--side-menu-item-lines);-webkit-line-clamp:var(--side-menu-item-lines);overflow:hidden}@media(width >= 1024px){.side-menu{-webkit-padding-before:var(--side-menu-padding-top);padding-block-start:var(--side-menu-padding-top);position:static;height:100%;translate:0;-webkit-transition:none;transition:none;border-right:1px solid rgba(0,0,0,.14)}.side-menu__header{display:none}.side-menu[aria-hidden=true]{translate:0}}.cards{display:grid;grid-template-columns:repeat(auto-fit, minmax(115px, -webkit-max-content));grid-template-columns:repeat(auto-fit, minmax(115px, max-content));-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;gap:16px;padding:10px}.cards__item{font-size:clamp(.875rem,.8rem + .3vw,1rem);background-color:var(--cards-item-background);padding:8px;border-radius:8px;aspect-ratio:1/1;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;max-width:150px;margin:0 auto;overflow:hidden;-webkit-transition:background-color var(--animation-timing);transition:background-color var(--animation-timing)}.cards__item-title{height:var(--cards-item-title-heigh);font-weight:bold;overflow-wrap:break-word;-ms-hyphens:auto;hyphens:auto;display:-webkit-box;-webkit-box-orient:vertical;line-clamp:var(--cards-item-title-lines);-webkit-line-clamp:var(--cards-item-title-lines);overflow:hidden}.cards__item-desc{-webkit-margin-before:.5lh;margin-block-start:.5lh;display:-webkit-box;-webkit-box-orient:vertical;line-clamp:var(--cards-item-description-lines);-webkit-line-clamp:var(--cards-item-description-lines);overflow:hidden}@media(width >= 640px){.cards{grid-template-columns:repeat(auto-fill, minmax(128px, -webkit-max-content));grid-template-columns:repeat(auto-fill, minmax(128px, max-content))}.cards__item{height:128px;max-width:174px;aspect-ratio:auto}}.hamburger{position:fixed;top:var(--hamburger-margin-top);left:var(--hamburger-margin-left);z-index:var(--z-hamburger);border:var(--hamburger-border-width) solid var(--hamburger-border-color);background:rgba(0,0,0,0);cursor:pointer;padding:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}.hamburger__icon{opacity:.15;-webkit-transition:opacity var(--animation-timing) ease-in-out;transition:opacity var(--animation-timing) ease-in-out}.hamburger:hover .hamburger__icon{opacity:.5}.hamburger[aria-expanded=true] .hamburger__icon{opacity:.15}.hamburger[aria-expanded=true]:hover .hamburger__icon{opacity:.5}.hamburger__line{-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center;-webkit-transition:y var(--animation-timing) ease-in-out var(--animation-delay),rotate var(--animation-timing) ease-in-out,opacity 0ms var(--animation-delay);transition:y var(--animation-timing) ease-in-out var(--animation-delay),rotate var(--animation-timing) ease-in-out,opacity 0ms var(--animation-delay)}.hamburger[aria-expanded=true] .hamburger__line{-webkit-transition:y var(--animation-timing) ease-in-out,rotate var(--animation-timing) ease-in-out var(--animation-delay),opacity 0ms var(--animation-delay);transition:y var(--animation-timing) ease-in-out,rotate var(--animation-timing) ease-in-out var(--animation-delay),opacity 0ms var(--animation-delay)}.hamburger[aria-expanded=true] .hamburger__line--top,.hamburger[aria-expanded=true] .hamburger__line--bottom{y:8px}.hamburger[aria-expanded=true] .hamburger__line--top{rotate:45deg}.hamburger[aria-expanded=true] .hamburger__line--middle{opacity:0}.hamburger[aria-expanded=true] .hamburger__line--bottom{rotate:-45deg}@media(width >= 1024px){.hamburger{display:none}}.icon-button{width:var(--icon-size, 21px);height:var(--icon-size, 21px);border:0;background:none;cursor:pointer;background-color:currentcolor;-webkit-mask:var(--icon) center/contain no-repeat;mask:var(--icon) center/contain no-repeat;opacity:.13;-webkit-transition:color var(--animation-timing) ease,opacity var(--animation-timing) ease;transition:color var(--animation-timing) ease,opacity var(--animation-timing) ease}.icon-button--first{--icon: url("../images/header-button-1.svg")}.icon-button--second{--icon: url("../images/header-button-2.svg")}.icon-button--third{--icon: url("../images/header-button-3.svg")}.icon-button:hover{opacity:.5}.icon-button:focus-visible{opacity:1}@media(width < 640px){html:has(.hamburger[aria-expanded=true]){overflow:hidden}}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}