@layer reset,tokens,base,layout,components,utilities;@layer reset{*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;scroll-behavior:smooth;hanging-punctuation:first last}body{min-height:100dvh;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeSpeed;overscroll-behavior-y:none}img,picture,svg,video{display:block;max-width:100%}img{content-visibility:auto}button,input,select,textarea{font:inherit}button{cursor:pointer;border:none;background:none}a{color:inherit;text-decoration:none}ol,ul{list-style:none}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}:focus-visible{outline:2px solid var(--color-brand);outline-offset:3px;border-radius:4px}@media(prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;transition-duration:.01ms!important}html{scroll-behavior:auto}}}@layer tokens{:root{--text-xs:clamp(.72rem,.69rem + .15vw,.8rem);--text-sm:clamp(.875rem,.84rem + .18vw,.95rem);--text-md:clamp(1rem,.95rem + .25vw,1.1rem);--text-lg:clamp(1.125rem,1.05rem + .38vw,1.3rem);--text-xl:clamp(1.35rem,1.2rem + .75vw,1.75rem);--text-2xl:clamp(1.62rem,1.4rem + 1.1vw,2.25rem);--text-3xl:clamp(1.95rem,1.6rem + 1.75vw,3rem);--text-4xl:clamp(2.35rem,1.85rem + 2.5vw,4rem);--sp-1:clamp(.25rem,.2rem + .25vw,.4rem);--sp-2:clamp(.5rem,.44rem + .3vw,.65rem);--sp-3:clamp(.75rem,.68rem + .35vw,.95rem);--sp-4:clamp(1rem,.9rem + .5vw,1.35rem);--sp-5:clamp(1.5rem,1.35rem + .75vw,2rem);--sp-6:clamp(2rem,1.75rem + 1.25vw,2.75rem);--sp-8:clamp(3rem,2.5rem + 2.5vw,4.5rem);--sp-10:clamp(4rem,3rem + 5vw,7rem);--sp-12:clamp(5rem,3.5rem + 7.5vw,9rem);--clr-brand-h:225;--clr-brand-s:38%;--clr-brand-l:29%;--color-brand:hsl(var(--clr-brand-h) var(--clr-brand-s) var(--clr-brand-l));--color-brand-dark:hsl(var(--clr-brand-h) var(--clr-brand-s) 20%);--color-brand-light:hsl(var(--clr-brand-h) var(--clr-brand-s) 95%);--color-brand-mid:hsl(var(--clr-brand-h) var(--clr-brand-s) 88%);--color-text:#0c1322;--color-muted:#667085;--color-border:#dce2ea;--color-surface:#f5f7fa;--color-bg:#fff;--color-primary:var(--color-brand);--color-accent:var(--color-brand);--radius-sm:6px;--radius:10px;--radius-lg:16px;--radius-xl:24px;--radius-full:9999px;--shadow-sm:0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.03);--shadow:0 4px 16px rgba(0,0,0,.07),0 2px 6px rgba(0,0,0,.04);--shadow-lg:0 12px 48px rgba(0,0,0,.09),0 4px 16px rgba(0,0,0,.05);--shadow-xl:0 24px 80px rgba(0,0,0,.12),0 8px 24px rgba(0,0,0,.06);--font-sans:"Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semi:600;--font-weight-bold:700;--font-weight-extra:800;--container:min(1440px,100% - clamp(2rem,5vw,8rem));--header-h:72px;--ease:cubic-bezier(.4,0,.2,1);--ease-spring:cubic-bezier(.34,1.56,.64,1);--ease-out:cubic-bezier(0,0,.2,1);--dur-fast:.12s;--dur-base:.22s;--dur-slow:.38s}}@layer base{html{font-size:var(--text-md);color:var(--color-text);color-scheme:light}body,html{font-family:var(--font-sans);background:var(--color-bg)}body{color:var(--color-text);line-height:1.65}h1{font-size:var(--text-3xl);line-height:1.15}h1,h2{font-weight:var(--font-weight-bold)}h2{font-size:var(--text-2xl);line-height:1.2}h3{font-size:var(--text-xl);line-height:1.3}h3,h4{font-weight:var(--font-weight-semi)}h4{font-size:var(--text-lg);line-height:1.4}p{max-width:72ch}p+p{margin-block-start:.75em}}@layer layout{.skip-nav{position:absolute;inset-inline-start:1rem;inset-block-start:-100%;z-index:9999;padding:.75rem 1.5rem;background:var(--color-brand);color:#fff;border-radius:0 0 var(--radius) var(--radius);font-weight:var(--font-weight-semi);transition:inset-block-start var(--dur-fast)}.skip-nav:focus{inset-block-start:0}.container{width:min(1920px,100%);margin-inline:auto;padding-inline:20px}.page{padding-block-start:var(--header-h);min-height:100dvh;display:grid;grid-template-rows:1fr auto}.section{padding-block:var(--sp-10)}.section__title{font-size:var(--text-2xl);font-weight:var(--font-weight-bold);color:var(--color-brand);margin-block-end:var(--sp-6);letter-spacing:-.02em}.header{position:fixed;inset-block-start:0;inset-inline:0;z-index:200;height:var(--header-h);background:transparent;transition:background var(--dur-base) var(--ease),box-shadow var(--dur-base) var(--ease),backdrop-filter var(--dur-base) var(--ease)}.header.scrolled{background:#ffffffe0;backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);box-shadow:0 1px 0 var(--color-border),0 4px 24px #0000000a}.header__inner{justify-content:space-between;height:var(--header-h);gap:var(--sp-4)}.header__inner,.nav{display:flex;align-items:center}.nav{gap:var(--sp-5)}.nav__link{font-size:var(--text-sm);font-weight:var(--font-weight-medium);letter-spacing:.02em;color:var(--color-muted);position:relative;padding-block-end:2px;transition:color var(--dur-fast) var(--ease)}.nav__link:after{content:"";position:absolute;inset-block-end:-4px;inset-inline-start:0;width:100%;height:2px;background:var(--color-brand);border-radius:2px;transform:scaleX(0);transform-origin:left;transition:transform var(--dur-base) var(--ease-spring)}.nav__link.router-link-active,.nav__link:hover{color:var(--color-brand)}:is(.nav__link.router-link-active,.nav__link:hover):after{transform:scaleX(1)}}@layer components{.product-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}@media(min-width:768px){.product-grid{grid-template-columns:repeat(3,1fr)}}@media(min-width:1024px){.product-grid{grid-template-columns:repeat(4,1fr)}}.product-card{display:grid;grid-template-rows:auto 1fr;background:transparent;border:none;border-radius:0;container-type:inline-size;transition:transform var(--dur-base) var(--ease)}.product-card:hover{transform:translateY(-2px)}.product-card__image{aspect-ratio:4/3;background:var(--color-surface);overflow:hidden;border-radius:6px;position:relative;transition:box-shadow var(--dur-base) var(--ease)}.product-card__image img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;transition:transform var(--dur-slow) var(--ease)}.product-card:hover .product-card__image{box-shadow:0 8px 28px #0000001a}.product-card:hover .product-card__image img{transform:scale(1.05)}.product-card__body{padding:var(--sp-3) var(--sp-2) 0;display:flex;flex-direction:column;gap:var(--sp-1)}.product-card__cat{font-size:var(--text-xs);font-weight:var(--font-weight-medium);color:var(--color-brand);text-transform:uppercase;letter-spacing:.08em;opacity:.65}.product-card__name{font-size:var(--text-sm);font-weight:var(--font-weight-semi);color:var(--color-text);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.product-card__price{font-size:var(--text-md);font-weight:var(--font-weight-bold);color:var(--color-brand);margin-block-start:var(--sp-1);letter-spacing:-.01em}.pagination{display:flex;justify-content:center;gap:var(--sp-2);margin-block-start:var(--sp-8);flex-wrap:wrap}.pagination__btn{min-width:40px;height:40px;padding-inline:var(--sp-3);border:1.5px solid var(--color-border);border-radius:0;background:transparent;font-size:var(--text-sm);font-weight:var(--font-weight-medium);color:var(--color-muted);transition:background var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease)}.pagination__btn:hover{background:var(--color-brand-light);color:var(--color-brand);border-color:var(--color-brand-mid)}.pagination__btn.active{background:var(--color-brand);color:#fff;border-color:var(--color-brand)}.btn-primary{display:inline-flex;align-items:center;justify-content:center;padding:14px 36px;background:var(--color-brand);color:#fff;border:none;border-radius:0;font-size:var(--text-md);font-weight:var(--font-weight-semi);font-family:var(--font-sans);line-height:1;cursor:pointer;margin-block-start:var(--sp-5);transition:background var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease-spring)}.btn-primary:hover{background:var(--color-brand-dark)}.btn-primary:active{transform:scale(.98)}.catalog-search{display:flex;gap:var(--sp-3);margin-block-end:var(--sp-6);max-width:600px}.catalog-search__input{flex:1;height:48px;padding-inline:var(--sp-4);border:1.5px solid var(--color-border);border-radius:var(--radius);font-size:var(--text-md);background:var(--color-bg);color:var(--color-text);transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease);outline:none}.catalog-search__input::-moz-placeholder{color:var(--color-muted);opacity:.65}.catalog-search__input::placeholder{color:var(--color-muted);opacity:.65}.catalog-search__input:focus{border-color:var(--color-brand);box-shadow:0 0 0 3px hsl(var(--clr-brand-h) var(--clr-brand-s) var(--clr-brand-l)/.12)}.catalog-search__btn{height:48px;padding-inline:var(--sp-5);background:var(--color-brand);color:#fff;border-radius:0;font-size:var(--text-sm);font-weight:var(--font-weight-semi);white-space:nowrap;transition:background var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease-spring)}.catalog-search__btn:hover{background:var(--color-brand-dark)}.catalog-search__btn:active{transform:scale(.97)}.footer{background:var(--color-brand);color:#ffffffd9;padding-block:var(--sp-10) var(--sp-6)}.footer__grid{display:grid;grid-template-columns:1fr;gap:var(--sp-8);margin-block-end:var(--sp-8)}@media(min-width:640px){.footer__grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.footer__grid{grid-template-columns:2fr 1fr 1fr}}.footer__brand{max-width:320px}.footer__logo{filter:brightness(0) invert(1);margin-block-end:var(--sp-4)}.footer__desc{font-size:var(--text-sm);line-height:1.75;color:#fff9;max-width:34ch}.footer__col-title{font-size:var(--text-xs);font-weight:var(--font-weight-semi);text-transform:uppercase;letter-spacing:.1em;color:#ffffff73;margin-block-end:var(--sp-4)}.footer__links{display:flex;flex-direction:column;gap:var(--sp-3)}.footer__link{font-size:var(--text-sm);color:#ffffffb3;transition:color var(--dur-fast) var(--ease)}.footer__link:hover{color:#fff}.footer__contact{display:flex;flex-direction:column;gap:var(--sp-3)}.footer__contact-item{display:flex;align-items:flex-start;gap:var(--sp-3);font-size:var(--text-sm);color:#ffffffb3}.footer__contact-item svg{flex-shrink:0;margin-block-start:2px;opacity:.5}.footer__bottom{padding-block-start:var(--sp-5);border-block-start:1px solid hsla(0,0%,100%,.1);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--sp-3)}.footer__copy{font-size:var(--text-xs);color:#fff6}.footer__legal{display:flex;gap:var(--sp-5)}.footer__legal-link{font-size:var(--text-xs);color:#fff6;transition:color var(--dur-fast)}.footer__legal-link:hover{color:#ffffffb3}.mobile-menu{position:fixed;inset:0;z-index:300;display:flex;flex-direction:column;background:var(--color-bg);padding:var(--sp-5) var(--sp-5) var(--sp-8);overflow-y:auto;view-transition-name:mobile-menu}.mobile-menu__header{display:flex;align-items:center;justify-content:space-between;margin-block-end:var(--sp-8)}.mobile-menu__close{width:40px;height:40px;border-radius:50%;background:var(--color-surface);display:flex;align-items:center;justify-content:center;color:var(--color-muted);transition:background var(--dur-fast),color var(--dur-fast)}.mobile-menu__close:hover{background:var(--color-border);color:var(--color-text)}.mobile-menu__nav{display:flex;flex-direction:column;gap:var(--sp-2)}.mobile-menu__link{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-4) var(--sp-3);border-radius:var(--radius);font-size:var(--text-lg);font-weight:var(--font-weight-semi);color:var(--color-text);transition:background var(--dur-fast),color var(--dur-fast)}.mobile-menu__link.router-link-active,.mobile-menu__link:hover{background:var(--color-brand-light);color:var(--color-brand)}.mobile-menu__contacts{margin-block-start:auto;padding-block-start:var(--sp-8);border-block-start:1px solid var(--color-border);display:flex;flex-direction:column;gap:var(--sp-3)}.mobile-menu__contact{font-size:var(--text-md);color:var(--color-muted)}.hamburger{display:none;width:44px;height:44px;flex-direction:column;align-items:center;justify-content:center;gap:5px;border-radius:var(--radius);background:transparent;transition:background var(--dur-fast)}@media not (min-width:768px){.hamburger{display:flex}}.hamburger:hover{background:var(--color-surface)}.hamburger__line{width:22px;height:2px;background:var(--color-brand);border-radius:2px;transition:transform var(--dur-base) var(--ease),opacity var(--dur-fast);transform-origin:center}.hamburger.is-open .hamburger__line:first-child{transform:translateY(7px) rotate(45deg)}.hamburger.is-open .hamburger__line:nth-child(2){opacity:0;transform:scaleX(0)}.hamburger.is-open .hamburger__line:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.header-cta{display:inline-flex;align-items:center;gap:var(--sp-2);height:40px;padding-inline:var(--sp-4);background:var(--color-brand);color:#fff;border-radius:0;font-size:var(--text-sm);font-weight:var(--font-weight-semi);transition:background var(--dur-fast),transform var(--dur-fast) var(--ease-spring);white-space:nowrap}@media not (min-width:640px){.header-cta{display:none}}.header-cta:hover{background:var(--color-brand-dark)}.header-cta:active{transform:scale(.97)}.menu-overlay{position:fixed;inset:0;z-index:290;background:#00000080;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}}@layer utilities{.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;clip:rect(0,0,0,0);border:0}.truncate,.visually-hidden{overflow:hidden;white-space:nowrap}.truncate{text-overflow:ellipsis}}.page-enter-active,.page-leave-active{transition:opacity var(--dur-base) var(--ease),transform var(--dur-base) var(--ease)}.page-enter-from{opacity:0;transform:translateY(8px)}.page-leave-to{opacity:0;transform:translateY(-4px)}@keyframes fade-in{0%{opacity:0;translate:0 6px}}@keyframes fade-out{to{opacity:0;translate:0 -4px}}::view-transition-old(root){animation:var(--dur-base) var(--ease) both fade-out}::view-transition-new(root){animation:var(--dur-slow) var(--ease-spring) both fade-in}
