/* ============================================================
   Windows-pro.store — основной файл стилей
   Подключается в includes/header.php

   Типографика сайта:
   - основной текст: PFBeauSansPro-Thin, 14px/1.3, #333
   - заголовки: Inter, 600, шкала 26/22/18/16
   - ссылки: #2B8ABA
   ============================================================ */

:root {
  --blue: #007dd4;
  --blue-dark: #0063a8;
  --link: #2B8ABA;
  --ink: #333;
  --gray: #6b6b6b;
  --bg: #fff;
  --card: #fff;
  --radius: 10px;
  --shadow: 0 2px 10px rgba(0,0,0,.08);
}

@font-face {
  font-family: 'PFBeauSansPro-Thin';
  src: url('/views/winprostore/css/fonts/PFBeauSansPro-Thin.ttf');
}
@font-face {
  font-family: 'Inter';
  src: url('/views/winprostore/css/fonts/Inter.ttf');
}

/* ---------- База ---------- */

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: 'PFBeauSansPro-Thin', Arial, sans-serif;
  font-size: 14px;
  line-height: 1.3;
  color: var(--ink);
  background: var(--bg);
}
img { max-width: 100%; display: block; border: none; }
ul { list-style: none; }
input { outline: none; }
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
.container { max-width: 1200px; margin: 0 auto; padding: 0 16px; }

h1, h2, h3, h4 {
  font-family: 'Inter', Arial, sans-serif;
  font-weight: 600;
  color: var(--ink);
  margin: 0 0 12px 0;
}
h1 { font-size: 26px; line-height: 1.2; }
h2 { font-size: 22px; line-height: 1.2; }
h3 { font-size: 18px; }
h4 { font-size: 16px; }

p { margin: 0 0 10px 0; }

/* ---------- Топ-полоса, шапка, меню ---------- */

.topbar { background: #fff; border-bottom: 1px solid #e3e6ea; font-size: 12px; color: var(--gray); }
.topbar .container { display: flex; flex-wrap: wrap; gap: 8px 24px; padding: 8px 16px; }
.topbar a { color: var(--gray); }
.topbar .topbar-right { margin-left: auto; }

.header { background: #fff; padding: 16px 0; }
.header .container { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.header__logo img { width: 240px; }
.header__slogan { font-size: 14px; color: var(--gray); }
.header__slogan strong { color: var(--ink); }

.nav { background: var(--blue); position: sticky; top: 0; z-index: 10; box-shadow: var(--shadow); }
.nav ul { display: flex; flex-wrap: wrap; }
.nav a {
  display: block;
  padding: 12px 18px;
  color: #fff;
  font-family: 'PFBeauSansPro-Thin', Arial, sans-serif;
  font-size: 14px;
  text-transform: uppercase;
}
.nav a:hover { background: var(--blue-dark); text-decoration: none; }

/* ---------- Хлебные крошки ---------- */

.breadcrumbs { padding: 14px 0 0; font-size: 14px; color: #555; }
.breadcrumbs a { color: #555; }
.breadcrumbs a:hover { color: var(--ink); text-decoration: none; }
.breadcrumbs span[aria-current] { color: var(--ink); font-weight: 600; }

/* ---------- Каркас: каталог слева + товар справа ---------- */

.product-layout { display: grid; grid-template-columns: 310px 1fr; gap: 24px; align-items: start; padding: 16px 0 0; }

/* ---------- Боковой каталог ---------- */

.sidebar { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 14px; font-size: 14px; }
.sidebar__group-wrap { margin-top: 8px; }
.sidebar__group-wrap:first-child { margin-top: 0; }
.sidebar__group {
  display: block;
  padding: 10px 12px;
  background: #ececec;
  border-radius: 6px;
  color: var(--ink);
  font-family: 'PFBeauSansPro-Thin', Arial, sans-serif;
  font-size: 16px;
  font-weight: bold;
  cursor: pointer;
}
.sidebar__group::-webkit-details-marker { display: none; }
.sidebar__group:hover { background: #dfe4ea; text-decoration: none; }
.sidebar__group::after {
  display: inline;
  content: '\25BE';
  color: var(--gray);
  font-size: 12px;
}
.sidebar__group-wrap[open] .sidebar__group::after {
  content: '\25B4';
  color: var(--gray);
  font-size: 12px;
}
.sidebar ul { margin: 4px 0 12px; }
.sidebar li { margin: 5px 0; padding-left: 12px; }
.sidebar li a {
  display: block;
  padding: 6.5px 0 6.5px 8px;
  color: #333e48;
}
.sidebar li a:hover {
  color: #3b71fe;
  background-color: #EBF1FF;
  font-weight: 600;
  border-radius: 1rem;
  text-decoration: none;
}
.sidebar li.is-current { font-weight: 600; }
.sidebar__extra {
  display: block;
  padding: 10px 12px;
  border: 1px solid #3b71fe;
  border-radius: 6px;
  margin-top: 12px;
  text-align: center;
}

/* ---------- Страница товара ---------- */

.product { padding: 0 0 8px; }
.product__box { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 24px; display: grid; grid-template-columns: minmax(200px, 280px) 1fr 220px; gap: 28px; }
.product__img img { width: auto;
  max-width: 100%;
  height: auto; }
.product h1 { margin-bottom: 16px; }
.specs { font-size: 14px; }
.specs li { display: flex; justify-content: space-between; gap: 16px; padding: 7px 0; border-bottom: 1px solid #eef1f4; }
.specs dt { color: var(--gray); }
.specs dd { text-align: right; font-weight: 500; }
.product__delivery { margin-top: 16px; background: #eef6fd; border-radius: 8px; padding: 12px 14px; font-size: 14px; }
.product__delivery strong { color: var(--blue-dark); }

/* ---------- Панель покупки ---------- */

.buy { border-left: 1px solid #eef1f4; padding-left: 28px; display: flex; flex-direction: column; gap: 12px; }
.stock { color: #00b851; font-weight: 600; font-size: 14px; }
.price { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.price__new { font-family: 'Inter', Arial, sans-serif; font-size: 32px; font-weight: 600; color: var(--blue-dark); }
.price__old { font-size: 15px; color: var(--gray); text-decoration: line-through; }
.consent { font-size: 13px; display: flex; gap: 8px; align-items: flex-start; color: var(--gray); }
.consent input { margin-top: 2px; }
.buy__btn {
  display: block;
  text-align: center;
  padding: 14px 0;
  background: #0aabe1;
  color: #fff;
  border: none;
  border-radius: 3px;
  font-family: 'PFBeauSansPro-Thin', Arial, sans-serif;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: .3s ease;
}
.buy__btn:hover { background: #FFC450; color: #fff; text-decoration: none; }
.buy__note { font-size: 12px; color: var(--gray); }

/* ---------- Описание ---------- */

.desc { padding: 16px 0 24px; }
.desc__box { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 24px; text-align: justify; }
.desc ul { margin: 0 0 10px 20px; list-style: disc; }
.desc li { margin: 0 0 6px 0; }
.desc code { background: #eef6fd; padding: 2px 6px; border-radius: 4px; font-size: 13px; }

/* ---------- Нам доверяют ---------- */

.trust { padding: 0 0 32px; }
.trust__box { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 20px 24px; display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.trust__title { font-family: 'Inter', Arial, sans-serif; font-size: 17px; font-weight: 600; }
.trust__box img { max-height: 60px; }
.trust__text { font-size: 13px; color: var(--gray); }

/* ---------- Футер ---------- */

.footer {
  overflow: hidden;
  border-top: 1px solid #CCD3CB;
  border-bottom: 40px solid #39424D;
  background-color: #616871;
  color: rgba(255, 255, 255, 0.7);
  padding: 32px 0;
  font-size: 13px;
}
.footer a { color: rgba(255, 255, 255, 0.7); }
.footer a:hover { color: rgba(255, 255, 255, 1); text-decoration: none; }
.footer__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 24px; }
.footer__grid p { margin: 10px 0; }
.footer li { margin: 6px 0; }
.footer__copy { margin-top: 20px; color: rgba(255, 255, 255, 0.7); }

/* ---------- Cookie-баннер ---------- */

.cookiebar { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 30; background: #fff; border-radius: var(--radius); box-shadow: 0 4px 20px rgba(0,0,0,.18); padding: 14px 18px; display: flex; gap: 16px; align-items: center; flex-wrap: wrap; max-width: 900px; margin: 0 auto; font-size: 13px; color: var(--ink); }
.cookiebar__text { flex: 1 1 320px; }
.cookiebar__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.cookiebar__actions button {
  padding: 9px 18px;
  border: none;
  border-radius: 3px;
  background: #0aabe1;
  color: #fff;
  font-family: 'PFBeauSansPro-Thin', Arial, sans-serif;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: .3s ease;
}
.cookiebar__actions button:hover { background: #FFC450; }
.cookiebar__secondary { background: #ececec !important; color: var(--ink) !important; }

/* ---------- Главная: hero, слайдер, преимущества, каталог ---------- */

.hero { padding: 28px 0 12px; text-align: center; }
.hero__tags { color: var(--gray); font-size: 14px; }

.slider { position: relative; max-width: 1200px; margin: 20px auto 0; border-radius: 10px; overflow: hidden; }
.slider__img { display: none; width: 100%; }
.slider__img.is-active { display: block; }
.slider__dots { position: absolute; bottom: 12px; left: 50%; transform: translateX(-50%); display: flex; gap: 8px; }
.slider__dots button { width: 12px; height: 12px; border-radius: 50%; border: none; background: rgba(255,255,255,.55); cursor: pointer; padding: 0; }
.slider__dots button.is-active { background: #fff; }

.benefits { padding: 28px 0; }
.benefits__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.benefit { background: #fff; border-radius: 10px; box-shadow: 0 2px 10px rgba(0,0,0,.08); padding: 18px; font-size: 14px; }
.benefit h3 { color: var(--ink); }

.catalog { padding: 12px 0 32px; }
.catalog h2 { margin-bottom: 4px; }
.catalog__rule { border: none; border-top: 2px solid var(--blue); width: 60px; margin-bottom: 20px; }
.catalog__intro { margin-bottom: 20px; max-width: 800px; }

/* ---------- Карточки товаров — стиль оригинала windows-pro.store ---------- */

.cards {
  display: flex;
  flex-wrap: wrap;
}

.product-index {
  width: 270px;
  height: 360px;
  margin: 10px;
  text-align: center;
  color: #606060;
  font-family: 'PFBeauSansPro-Thin', Arial, sans-serif;
  font-size: 13px;
  line-height: 1.3;
  position: relative;
  vertical-align: top;
  background-color: rgba(255, 255, 255, 0.33);
  border: 1px solid #EAEDF2;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 15px;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  transition: box-shadow 0.3s ease 0s;
}
.product-index:hover {
  border-color: #dfdfdf;
  box-shadow: 0 3px 15px rgba(0,0,0,.2);
  transition: all .2s ease-in-out;
}
.product-index .img-item {
  display: block;
  height: 170px;
  margin-top: 20px;
  overflow: hidden;
  opacity: 0.85;
  position: relative;
  transition: opacity 0.1s ease 0s;
}
.product-index .img-item:hover { opacity: 1; }
.product-index .img-item img {
  height: 160px;
  width: auto;
  max-width: 100%;
  margin: 0 auto;
}
.product-index h2 {
  font: 20px 'Inter', Arial, sans-serif;
  font-weight: normal;
  color: #666;
  margin: 10px 0 2px 0;
}
.product-index h2 a { color: #333; text-decoration: none; }
.product-index h2 a:hover { text-decoration: none; }
.product-index p {
  text-transform: uppercase;
  font-family: 'PFBeauSansPro-Thin', Arial, sans-serif;
  font-size: 14px;
  margin: 0 0 20px 0;
}
.product-index p span {
  font-family: 'Inter', Arial, sans-serif;
  font-size: 22px;
  color: #333;
  font-weight: 600;
}
.product-index p span.span2 {
  font-size: 12px;
  margin: 0 40px 0 0;
}

/* ---------- АДАПТИВ ---------- */

@media (max-width: 760px) {
  .product__box { grid-template-columns: 1fr; }
  .buy { border-left: none; padding-left: 0; border-top: 1px solid #eef1f4; padding-top: 20px; }
}

@media (max-width: 900px) {
  .product-layout { grid-template-columns: 1fr; gap: 16px; }
  .sidebar__group-wrap ul { margin-bottom: 4px; }
.sidebar__group::after { display: inline; content: '\25BE'; color: var(--gray); font-size: 12px; }
.sidebar__group-wrap[open] .sidebar__group::after { content: '\25B4'; color: var(--gray); font-size: 12px; }
  .sidebar__extra { display: inline-block; width: auto; padding: 8px 14px; margin: 8px 8px 0 0; }
}

/* 2026 redesign — stage 1: global foundation and responsive navigation */
:root { --blue:#2563eb; --blue-dark:#1d4ed8; --link:#1d4ed8; --ink:#111827; --gray:#667085; --bg:#f8fafc; --card:#fff; --radius:16px; --shadow:0 8px 28px rgba(15,23,42,.055); }
body { font-family:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif; font-size:16px; line-height:1.6; background:var(--bg); }
.container { max-width:1240px; padding-inline:clamp(16px,3vw,32px); }
h1,h2,h3,h4 { letter-spacing:-.025em; line-height:1.25; }
h1 { font-size:clamp(28px,3vw,42px); } h2 { font-size:clamp(23px,2.3vw,32px); }
a,button { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid #60a5fa; outline-offset:3px; }
.skip-link { position:fixed; top:-100px; left:12px; z-index:999; padding:12px 16px; background:#fff; color:#111827; border-radius:8px; }
.skip-link:focus { top:12px; }
.site-header { position:relative; z-index:50; background:#fff; border-bottom:1px solid #e5eaf1; }
.site-header__utility { background:#f1f5f9; font-size:12px; color:#475467; }
.site-header__utility .container { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-block:7px; }
.site-header__utility a { color:#334155; }
.site-header__main { display:flex; align-items:center; gap:clamp(16px,2vw,28px); min-height:90px; }
.site-brand { flex:none; display:flex; align-items:center; } .site-brand img { width:clamp(150px,16vw,200px); height:auto; }
.site-header__tagline { font-size:12px; line-height:1.35; color:#667085; max-width:145px; }
.site-nav { margin-left:auto; } .site-nav ul { display:flex; align-items:center; flex-wrap:wrap; gap:2px; }
.site-nav a { display:block; padding:12px 10px; color:#344054; font-size:13px; font-weight:600; border-radius:9px; line-height:1.4; }
.site-nav a:hover,.site-nav a:focus-visible { color:#1d4ed8; background:#eff6ff; text-decoration:none; }
.site-menu-toggle { display:none; border:1px solid #dbe2eb; border-radius:10px; width:44px; height:44px; background:#fff; cursor:pointer; align-items:center; justify-content:center; flex-direction:column; gap:5px; margin-left:auto; }
.site-menu-toggle span { width:20px; height:2px; border-radius:2px; background:#111827; }
@media(max-width:1100px) and (min-width:901px) { .site-header__tagline { display:none; } .site-nav a { padding-inline:8px; font-size:12px; } }
@media(max-width:900px) {
 .site-header__main { min-height:72px; flex-wrap:wrap; } .site-header__tagline { display:none; } .site-menu-toggle { display:flex; }
 .site-nav { display:none; order:3; flex-basis:100%; margin:0; padding:0 0 14px; } .site-nav.is-open { display:block; }
 .site-nav ul { display:flex; flex-direction:column; align-items:stretch; gap:3px; } .site-nav a { font-size:15px; padding:13px 14px; min-height:44px; }
}
@media(max-width:480px) { .site-header__utility .container { font-size:11px; } .site-header__utility .container span { display:none; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation-duration:.01ms!important; transition-duration:.01ms!important; } }

/* Stage 2: modern homepage, isolated store-* components */
.store-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(20px,4vw,60px);align-items:center;padding-block:clamp(36px,6vw,80px)}
.store-hero__copy{max-width:650px}.store-eyebrow{display:inline-block;font-size:12px;font-weight:750;letter-spacing:.09em;text-transform:uppercase;color:#2563eb;margin-bottom:16px}.store-hero h1{font-size:clamp(34px,4.8vw,64px);letter-spacing:-.055em;line-height:1.08;margin-bottom:22px}.store-hero__copy>p:not(.store-hero__note){font-size:clamp(16px,1.6vw,19px);color:#526174;line-height:1.65;max-width:530px}.store-hero__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.store-button{display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:48px;padding:12px 20px;border-radius:12px;background:#2563eb;color:white;font-weight:700;text-decoration:none}.store-button:hover{background:#1d4ed8;color:#fff;text-decoration:none}.store-button--light{background:#fff;color:#1e40af;border:1px solid #dce4ef}.store-button--light:hover{background:#eff6ff;color:#1e40af}.store-hero__note{font-size:13px;color:#64748b;margin-top:20px}.store-hero__art{min-height:340px;aspect-ratio:1.3;position:relative;overflow:hidden;border-radius:28px;background:linear-gradient(140deg,#dbeafe,#eff6ff 58%,#f8fafc);display:grid;place-items:center}.store-hero__shape{position:absolute;display:block;border-radius:26px;transform:rotate(-15deg);box-shadow:0 24px 55px #1e40af20}.store-hero__shape--one{width:46%;height:54%;background:linear-gradient(140deg,#2563eb,#60a5fa);left:16%;top:16%}.store-hero__shape--two{width:43%;height:49%;background:linear-gradient(140deg,#0f172a,#334155);right:12%;bottom:12%;transform:rotate(12deg)}.store-hero__art-label{position:relative;z-index:1;background:#ffffffed;padding:22px 30px;border:1px solid #e2e8f0;border-radius:18px;font-size:clamp(24px,3vw,38px);font-weight:800;line-height:1.15;letter-spacing:-.04em;color:#0f172a;box-shadow:0 16px 45px #0f172a20}.store-hero__art-label strong{color:#2563eb}.store-benefits{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding-bottom:clamp(34px,5vw,60px)}.store-benefits>div{display:flex;flex-direction:column;gap:4px;padding:20px;border:1px solid #e2e8f0;border-radius:16px;background:#fff}.store-benefits strong{font-size:15px;color:#0f172a}.store-benefits span{font-size:13px;color:#64748b}.store-section{padding-block:22px 45px;scroll-margin-top:24px}.store-section__head{display:flex;justify-content:space-between;align-items:end;margin-bottom:22px}.store-section__head .store-eyebrow{margin-bottom:6px}.store-section__head h2{font-size:clamp(25px,3vw,36px);letter-spacing:-.045em;margin-bottom:6px}.store-section__head p{color:#64748b}.store-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.store-card{min-width:0;display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid #e2e8f0;border-radius:18px;transition:transform .2s,box-shadow .2s,border-color .2s}.store-card:hover{transform:translateY(-3px);border-color:#bfdbfe;box-shadow:0 14px 35px #0f172a12}.store-card__media{display:grid;place-items:center;min-height:190px;aspect-ratio:1.45;background:#f8fafc;padding:22px}.store-card__media img{max-height:150px;width:auto;object-fit:contain}.store-card__body{display:flex;flex:1;flex-direction:column;padding:18px}.store-card h3{font-size:16px;line-height:1.4;min-height:45px;margin-bottom:8px}.store-card h3 a{color:#0f172a}.store-card__caption{font-size:12px;color:#64748b;margin-bottom:20px}.store-card__bottom{margin-top:auto;display:flex;flex-direction:column;align-items:stretch;gap:14px}.store-card__prices{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px}.store-card__price{font-size:23px;font-weight:800;letter-spacing:-.04em;color:#0f172a}.store-card__prices del{font-size:13px;color:#94a3b8}.store-card__action{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:44px;padding:10px 14px;background:#eff6ff;color:#1d4ed8;border-radius:10px;font-weight:700;font-size:14px}.store-card__action:hover{background:#2563eb;color:#fff;text-decoration:none}@media(max-width:1050px){.store-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:760px){.store-hero{grid-template-columns:1fr;padding-block:32px}.store-hero__art{min-height:240px;aspect-ratio:1.6}.store-benefits{grid-template-columns:1fr}.store-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.store-card__media{min-height:145px;padding:14px}.store-card__media img{max-height:120px}.store-card__body{padding:13px}.store-card h3{font-size:14px}.store-card__price{font-size:20px}}@media(max-width:420px){.store-hero__actions{flex-direction:column}.store-button{width:100%}.store-grid{grid-template-columns:1fr}.store-card__media{aspect-ratio:1.8}.store-card h3{min-height:0}.store-card__bottom{flex-direction:row;align-items:center}.store-card__action{min-width:120px}}@media(prefers-reduced-motion:reduce){.store-card{transition:none}.store-card:hover{transform:none}}


/* Stage 3: responsive category listing, isolated from legacy product styles */
.catalog.container { padding-block:clamp(20px,4vw,48px) 72px; }
.catalog > h1 { margin:0 0 14px; font-size:clamp(30px,4vw,48px); font-weight:750; color:var(--ink); }
.catalog__intro { max-width:760px; margin:0 0 clamp(26px,4vw,42px); color:#596579; font-size:clamp(15px,1.5vw,17px); line-height:1.7; }
.category-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; align-items:stretch; }
.category-card { min-width:0; display:flex; flex-direction:column; overflow:hidden; background:#fff; border:1px solid #e6ebf2; border-radius:18px; transition:box-shadow .2s ease,border-color .2s ease,transform .2s ease; }
.category-card:hover { border-color:#cbd8ec; box-shadow:0 12px 30px rgba(15,23,42,.07); transform:translateY(-2px); }
.category-card__media { display:flex; justify-content:center; align-items:center; min-height:205px; padding:24px; background:#f8fafc; }
.category-card__media img { display:block; width:100%; height:170px; object-fit:contain; }
.category-card__body { flex:1; display:flex; flex-direction:column; padding:22px; gap:10px; }
.category-card__eyebrow { color:#64748b; font-size:12px; font-weight:600; }
.category-card h2 { font-size:clamp(17px,1.5vw,20px); line-height:1.4; margin:0; font-weight:700; }
.category-card h2 a { color:#152238; text-decoration:none; }
.category-card h2 a:hover { color:var(--blue); }
.category-card__bottom { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:end; gap:14px; margin-top:auto; padding-top:14px; }
.category-card__price { display:flex; flex-direction:column; gap:2px; color:#0f172a; font-size:22px; font-weight:750; line-height:1.25; white-space:nowrap; }
.category-card__old { color:#94a3b8; text-decoration:line-through; font-size:13px; font-weight:400; }
.category-card__action { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:10px 16px; border-radius:10px; background:#2563eb; color:#fff; font-size:14px; font-weight:650; text-decoration:none; }
.category-card__action:hover { background:#1d4ed8; color:#fff; text-decoration:none; }
@media(max-width:950px) { .category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:580px) { .category-grid { grid-template-columns:1fr; gap:14px; } .category-card__media { min-height:175px; } .category-card__media img { height:145px; } .category-card__body { padding:18px; } }
@media(prefers-reduced-motion:reduce) { .category-card { transition:none; } .category-card:hover { transform:none; } }

/* 2026 redesign — stage 4: product details */
.product-main { min-width:0; }
.product__box { display:grid; grid-template-columns:minmax(180px,.8fr) minmax(240px,1.3fr); gap:clamp(20px,3vw,40px); padding:clamp(20px,3vw,36px); border:1px solid #e8edf4; box-shadow:0 8px 30px rgba(15,23,42,.035); }
.product__img { display:grid; place-items:center; align-self:start; min-height:260px; padding:24px; background:#f8fafc; border:1px solid #edf1f6; border-radius:14px; }
.product__img img { display:block; width:100%; max-width:280px; height:auto; object-fit:contain; }
.product__info { min-width:0; }
.product h1 { font-size:clamp(27px,3vw,40px); color:#101828; margin:0 0 22px; }
.specs { margin:0; display:grid; grid-template-columns:minmax(115px,42%) minmax(0,1fr); font-size:14px; }
.specs dt,.specs dd { margin:0; padding:11px 0; border-bottom:1px solid #edf1f5; overflow-wrap:anywhere; }
.specs dt { color:#667085; padding-right:12px; }
.specs dd { font-weight:600; color:#1d2939; text-align:left; }
.product__delivery { margin-top:22px; padding:18px; background:#eff6ff; border:1px solid #dbeafe; border-radius:12px; line-height:1.65; }
.buy { grid-column:1/-1; border:1px solid #e3eaf4; border-radius:14px; background:#fff; padding:22px; display:grid; grid-template-columns:minmax(180px,1fr) minmax(220px,1.1fr); gap:12px 24px; align-items:center; }
.buy .stock { grid-column:2; align-self:end; }
.buy .price { grid-column:2; }
.buy .price1 {   grid-column: 1;
  grid-row: 1 / span 7;   /* перекрывает все строки правой колонки */
  align-self: center;      /* центрирование по вертикали */
  float: none;             /* на случай, если блок где-то ловил float */
  margin: 0; }
.price__new { font-family:inherit; color:#111827; font-size:clamp(30px,3vw,38px); font-weight:750; }
.buy .consent { grid-column:2; font-size:13px; line-height:1.5; }
.consent input { width:17px; height:17px; flex:none; accent-color:#2563eb; }
.buy__btn { grid-column:2; display:block; padding:15px 20px; border-radius:10px; background:#2563eb; color:#fff; font:700 16px/1.4 inherit; text-align:center; transition:background .15s ease; }
.buy__btn:hover { background:#1d4ed8; color:#fff; }
.buy__note { grid-column:2; margin:4px 0 0; font-size:12px; }
.desc__box,.trust__box { border:1px solid #e8edf4; box-shadow:0 8px 30px rgba(15,23,42,.035); border-radius:16px; padding:clamp(20px,3vw,32px); }
.desc__box { text-align:left; line-height:1.75; }
.desc__box h2 { margin-top:0; }
.trust__box { background:#fff; }
@media(max-width:1100px) { .product__box { grid-template-columns:minmax(150px,.75fr) minmax(0,1.25fr); } }
@media(max-width:700px) { .product__box { grid-template-columns:minmax(0,1fr); padding:18px; } .product__img { min-height:210px; } .product__img img { max-width:220px; } .buy { grid-column:1; display:flex; flex-direction:column; align-items:stretch; padding:18px; } .buy .price { margin-bottom:4px; } .buy__btn { min-height:48px; } .specs { grid-template-columns:minmax(100px,40%) minmax(0,1fr); } }
@media(prefers-reduced-motion:reduce) { .buy__btn { transition:none; } }

/* Stage 5: shared footer and readable information pages */
.site-footer{margin-top:clamp(48px,7vw,96px);background:#0f172a;color:#cbd5e1;padding:clamp(38px,5vw,64px) 0 24px}
.site-footer__top{display:grid;grid-template-columns:minmax(220px,1.6fr) repeat(3,minmax(130px,1fr));gap:clamp(22px,3vw,48px)}
.site-footer__logo{display:inline-block;color:#fff;font-size:clamp(19px,2vw,24px);font-weight:800;letter-spacing:-.04em;text-decoration:none}
.site-footer__brand p{max-width:270px;line-height:1.65;margin:14px 0}.site-footer__email{color:#93c5fd;overflow-wrap:anywhere}
.site-footer__column h2{font-size:14px;font-weight:750;color:#fff;margin:0 0 16px}.site-footer__column ul{padding:0;margin:0;list-style:none;display:grid;gap:12px}.site-footer a{color:#cbd5e1;text-decoration:none}.site-footer a:hover{color:#fff;text-decoration:underline}.site-footer a:focus-visible{outline:2px solid #93c5fd;outline-offset:4px;border-radius:2px}.site-footer__logo,.site-footer .site-footer__email{color:#fff}.site-footer__bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;border-top:1px solid #334155;margin-top:44px;padding-top:22px;color:#94a3b8;font-size:12px;line-height:1.6}
.info-page{padding-bottom:clamp(20px,4vw,48px)}.info-page__section{padding-top:clamp(16px,3vw,30px)}.info-page .desc__box{max-width:920px;margin-inline:auto;padding:clamp(20px,4vw,48px);overflow-wrap:anywhere}.info-page h1{font-size:clamp(28px,3.7vw,44px);letter-spacing:-.04em;line-height:1.15;margin:0 0 24px}.info-page h2{font-size:clamp(20px,2.2vw,27px);line-height:1.3;margin:32px 0 14px}.info-page h3{font-size:18px;margin:24px 0 10px}.info-page p,.info-page li,.info-page dd{line-height:1.75}.info-page p,.info-page ul,.info-page ol{margin-block:0 16px}.info-page li+li{margin-top:7px}.info-page a{overflow-wrap:anywhere;text-underline-offset:3px}.info-page :is(a,button):focus-visible{outline:2px solid #2563eb;outline-offset:3px}
@media(max-width:900px){.site-footer__top{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:520px){.site-footer__top{grid-template-columns:1fr;gap:30px}.site-footer__bottom{flex-direction:column}.info-page .desc__box{padding:20px}}

/* Stage 6: accessible shared controls */
.back-to-top{position:fixed;right:16px;bottom:16px;z-index:40;min-height:44px;padding:10px 16px;border:1px solid #1d4ed8;border-radius:10px;background:#2563eb;color:#fff;font:600 14px/1.4 inherit;cursor:pointer;box-shadow:0 6px 20px #0f172a24}
.back-to-top[hidden]{display:none!important}.back-to-top:hover{background:#1d4ed8}
@media(max-width:520px){.back-to-top{right:12px;bottom:12px}}

/* Полезные инструкции */
.informs-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.inform-card{display:flex;flex-direction:column;overflow:hidden;background:var(--card);border:1px solid #e8edf4;border-radius:var(--radius);box-shadow:var(--shadow)}
.inform-card__image{display:block;max-height:220px;overflow:hidden;background:#f5f7fb}
.inform-card__image img{display:block;width:100%;height:220px;object-fit:cover}
.inform-card__body{padding:20px}
.inform-card__body h2{margin:0 0 10px;font-size:1.25rem}
.inform-card__body p{color:#596579;line-height:1.65}
.inform-card__link{font-weight:700}
.inform-article{max-width:920px;margin:0 auto}
.inform-article h1{margin-top:18px}
.inform-article .desc__box{line-height:1.8}
.inform-article .desc__box h2,.inform-article .desc__box h3{margin-top:1.4em}
.inform-article .desc__box h2:first-child,.inform-article .desc__box h3:first-child{margin-top:0}
.inform-article ol,.inform-article ul{padding-left:1.5rem}
.inform-article li{margin:.5rem 0}
.inform-note{padding:16px 18px;border-left:4px solid #4a78c2;background:#f2f6fc;border-radius:6px}
.inform-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.inform-gallery figure{margin:0;min-width:0}
.inform-gallery img{display:block;width:100%;height:auto;border:1px solid #e8edf4;border-radius:8px}
.inform-gallery figcaption{padding:5px 2px;color:#596579;font-size:.9rem}
.inform-inline-figure{margin:18px auto 22px;max-width:760px}
.inform-inline-figure img{display:block;width:100%;height:auto;border:1px solid #e8edf4;border-radius:8px}
.inform-inline-figure figcaption{padding:6px 2px;color:#596579;font-size:.9rem;text-align:center}
.inform-related{margin:24px 0 36px;padding:22px;background:var(--card);border:1px solid #e8edf4;border-radius:var(--radius)}
.inform-related h2{margin-top:0}
.inform-related ul{columns:2;padding-left:1.25rem}
@media(max-width:700px){.informs-grid{grid-template-columns:1fr}.inform-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.inform-related ul{columns:1}}

/* Главная: точечный Canvas и блок фактов */
.store-hero__art{isolation:isolate;background:radial-gradient(ellipse at 50% 48%,#dbeafe 0,#eff6ff 58%,#f8fafc 100%)}
.store-hero__canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1}
.store-hero__canvas-fallback{position:relative;z-index:2;font-size:clamp(34px,5vw,60px);font-weight:800;letter-spacing:-.06em;color:#2563eb}
.store-hero__art.is-canvas-ready .store-hero__canvas-fallback{display:none}
.dkhero-facts{position:relative;z-index:2;margin:0 auto clamp(36px,5vw,64px);padding:0 0 4px}
.dkhero-facts__inner{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:center;min-height:118px;padding:18px 14px;background:#fff;border:1px solid #e9eef5;border-radius:20px;box-shadow:0 14px 40px #0f172a0a}
.dkhero-facts__item{min-width:0;padding:4px 12px;text-align:center}
.dkhero-facts__item+.dkhero-facts__item{border-left:1px solid #e8edf3}
.dkhero-facts__value{display:flex;align-items:center;justify-content:center;gap:7px;min-height:38px;color:#101828;font-size:clamp(21px,2.35vw,31px);font-weight:800;line-height:1.15;letter-spacing:-.045em}
.dkhero-facts__label{margin-top:5px;color:#687386;font-size:12px;line-height:1.35}
@media(max-width:760px){.dkhero-facts__inner{grid-template-columns:repeat(2,minmax(0,1fr));padding:10px}.dkhero-facts__item{padding:13px 8px}.dkhero-facts__item+.dkhero-facts__item{border-left:0}.dkhero-facts__item:nth-child(even){border-left:1px solid #e8edf3}.dkhero-facts__item:nth-child(n+3){border-top:1px solid #e8edf3}.dkhero-facts__item:nth-child(5){grid-column:1/-1;border-left:0}.dkhero-facts__value{font-size:clamp(20px,6vw,28px)}}
@media(prefers-reduced-motion:reduce){.store-hero__canvas{animation:none}}

/* Главная: компоновка hero по мотивам Digi-Keys, в фирменной палитре Windows-pro */
.store-hero.container{position:relative;isolation:isolate;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);column-gap:clamp(24px,4vw,60px);row-gap:0;padding-block:clamp(38px,4.3vw,56px) 14px;margin-bottom:clamp(24px,3vw,36px)}
.store-hero.container::before{content:"";position:absolute;z-index:-1;top:0;bottom:0;left:50%;width:100vw;transform:translateX(-50%);background:#f1f2f4}
.store-hero .store-eyebrow{display:none}
.store-hero h1{max-width:640px;margin-bottom:20px;font-size:clamp(38px,4.25vw,56px);line-height:1.06;letter-spacing:-.055em}
.store-hero__copy>p:not(.store-hero__note){max-width:560px;color:#666b73;font-size:clamp(17px,1.7vw,20px);line-height:1.6}
.store-hero__actions{gap:12px;margin-top:28px}
.store-hero .store-button{min-height:50px;padding:13px 22px;border-radius:12px;background:#171717;color:#fff}
.store-hero .store-button:hover{background:#303030}
.store-hero .store-button--light{background:#fff;color:#161616;border:1px solid #e4e5e8}
.store-hero .store-button--light:hover{background:#f9fafb;color:#161616}
.store-hero__note{max-width:600px;color:#717680;font-size:13px;line-height:1.55}
.store-hero__art{min-height:clamp(320px,30vw,380px);aspect-ratio:auto;overflow:visible;border-radius:0;background:transparent!important}
.store-hero__canvas{position:absolute;z-index:0;inset:0;width:100%;height:100%;overflow:hidden;pointer-events:none}
.store-hero__copy,.store-hero__art,.store-hero .dkhero-facts{position:relative;z-index:1}
.store-hero.is-canvas-ready .store-hero__canvas-fallback{display:none}
.dkhero-facts{grid-column:1/-1;width:100%;margin:clamp(20px,3vw,30px) 0 0;padding:0}
.dkhero-facts__inner{min-height:112px;border-radius:20px;padding:14px 14px;box-shadow:0 10px 28px #17202a0a}
.dkhero-facts__value{font-size:clamp(19px,2.1vw,29px);letter-spacing:-.04em}
.dkhero-facts__label{font-size:12px}
@media(max-width:760px){.store-hero.container{grid-template-columns:1fr;row-gap:8px;padding-block:40px 18px;margin-bottom:34px}.store-hero h1{font-size:clamp(36px,9vw,48px)}.store-hero__art{min-height:260px;aspect-ratio:auto}.dkhero-facts{margin-top:20px}.dkhero-facts__inner{min-height:0}}
@media(max-width:420px){.store-hero.container{padding-top:34px}.store-hero__art{min-height:220px}.store-hero__actions{flex-direction:row}.store-hero .store-button{width:auto;flex:1;padding-inline:12px;font-size:14px}.dkhero-facts__value{font-size:clamp(19px,6vw,25px)}}

/* Product card button prototype 2: lightweight text link */
.store-card__action{position:relative;display:inline-flex;align-self:flex-start;justify-content:flex-start;align-items:center;gap:9px;width:auto;min-height:40px;padding:8px 0;border:0;border-radius:0;background:transparent;color:#2563eb;font-size:14px;font-weight:700;text-decoration:none;transition:gap .18s,color .18s}.store-card__action:hover{gap:14px;background:transparent;color:#1d4ed8;text-decoration:none;box-shadow:none}.store-card__action span{font-size:18px;line-height:1}
/* Keep product card surfaces calm; no glint outside the detail button */
.store-card::before,.category-card::before{display:none!important}
.store-card:hover,.category-card:hover{transform:translateY(-3px) scale(1);box-shadow:0 14px 35px #0f172a12!important}
.store-card:hover::before,.category-card:hover::before{display:none!important}
/* Button effect 5/5: soft capsule appears behind the link */
.store-card__action{position:relative;isolation:isolate;align-self:flex-start;display:inline-flex;justify-content:flex-start;align-items:center;gap:9px;width:auto;min-height:42px;margin-left:-12px;padding:8px 12px;border:1px solid transparent;border-radius:12px;background:transparent;color:#2563eb;text-decoration:none;text-shadow:none;transition:background-color .2s,color .2s,border-color .2s,box-shadow .2s}
.store-card__action:hover,.store-card__action:focus-visible{gap:9px;background:#eaf3ff;border-color:#bfdbfe;color:#1d4ed8;text-decoration:none;text-shadow:none;box-shadow:0 3px 10px rgba(37,99,235,.10)}
.store-card__action::before{display:none!important}
.store-card__action span{transition:none;transform:none}
.store-card__action:hover span,.store-card__action:focus-visible span{transform:none}
@media(prefers-reduced-motion:reduce){.store-card__action{transition:none}}
/* Keep product card surfaces calm; no glint outside the detail link */
.store-card::before,.category-card::before{display:none!important}
.store-card:hover,.category-card:hover{transform:translateY(-3px) scale(1);box-shadow:0 14px 35px #0f172a12!important}
.store-card:hover::before,.category-card:hover::before{display:none!important}
/* Put the purchase link before the price on product cards */
.store-card__bottom{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:10px}
.store-card__action{order:1;align-self:center;flex:0 0 auto;margin:0;padding:7px 8px;white-space:nowrap}
.store-card__prices{order:0;flex:0 1 auto;min-width:0;gap:6px}
.category-card__bottom{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:10px}
.category-card__action{order:1;flex:0 0 auto;min-width:0;padding:8px 10px;white-space:nowrap}
.category-card__price{order:0;flex:0 1 auto;min-width:0;font-size:clamp(17px,1.8vw,22px)}
@media(max-width:580px){.category-card__bottom{gap:14px}.category-card__action{padding-inline:12px}.category-card__price{font-size:20px}}
@media(max-width:420px){.store-card__action{min-width:0}.store-card__bottom{gap:8px}.store-card__price{font-size:19px}.store-card__prices del{font-size:12px}}

/* Explicit visual order: price first, buy link second */
.store-card__bottom>.store-card__prices{order:0!important}
.store-card__bottom>.store-card__action{order:1!important;margin-left:0!important}
.category-card__bottom>.category-card__price{order:0!important}
.category-card__bottom>.category-card__action{order:1!important}

/* Cart icon for buy links */
.store-card__action .card-cart-icon,.category-card__action .card-cart-icon{display:block;flex:0 0 auto;width:18px;height:18px;stroke:currentColor;transition:transform .18s ease}
.store-card__action:hover .card-cart-icon,.category-card__action:hover .card-cart-icon{transform:translateY(-1px)}
@media(prefers-reduced-motion:reduce){.store-card__action .card-cart-icon,.category-card__action .card-cart-icon{transition:none}}

/* Keep compact price and cart action aligned on narrow cards */
.store-card__prices{flex-wrap:nowrap;gap:4px}
.store-card__price{font-size:clamp(18px,1.7vw,22px)}
.store-card__prices del{font-size:11px;white-space:nowrap}
.store-card__action{gap:6px;padding-inline:5px;font-size:13px}
.store-card__action .card-cart-icon{width:16px;height:16px}
.category-card__action{gap:6px;padding-inline:8px;font-size:13px}
.category-card__action .card-cart-icon{width:16px;height:16px}

/* Slightly smaller buy label; keep the cart icon unchanged */
.store-card__action,.category-card__action{font-size:12px}

/* Remove the hover capsule and motion from the home product buy link */
.store-card__action,.store-card__action:hover,.store-card__action:focus-visible{background:transparent;border-color:transparent;box-shadow:none;text-shadow:none;transition:none}
.store-card__action:hover,.store-card__action:focus-visible{color:#1d4ed8}
.store-card__action .card-cart-icon,.store-card__action:hover .card-cart-icon,.store-card__action:focus-visible .card-cart-icon{transform:none;transition:none}

/* Give product imagery a little more vertical room */
.store-card__media{min-height:208px}
@media(max-width:760px){.store-card__media{min-height:163px}}
@media(max-width:420px){.store-card__media{min-height:183px;aspect-ratio:1.7}}

/* Compact product details below the taller image area */
.store-card__body{padding:16px}
.store-card h3{min-height:40px;margin-bottom:6px}
.store-card__caption{margin-bottom:12px}
.store-card__bottom{gap:10px}
@media(max-width:760px){.store-card__body{padding:12px}.store-card h3{min-height:38px}.store-card__caption{margin-bottom:10px}}

/* Reduce the details area to roughly two-thirds of its previous height */
.store-card__body{flex:0 0 auto;padding:10px 14px}
.store-card h3{min-height:0;margin-bottom:4px}
.store-card__caption{margin-bottom:4px}
.store-card__bottom{margin-top:4px;gap:6px}
@media(max-width:760px){.store-card__body{padding:9px 11px}.store-card__bottom{margin-top:4px}}


/* Match the category purchase action to the homepage button */
.category-card__action{position:relative;isolation:isolate;display:inline-flex;justify-content:flex-start;align-items:center;gap:6px;min-height:42px;margin:0;padding:7px 8px;border:1px solid transparent;border-radius:12px;background:transparent;color:#2563eb;font-size:12px;font-weight:700;text-decoration:none;text-shadow:none;transition:none}
.category-card__action:hover,.category-card__action:focus-visible{background:transparent;border-color:transparent;color:#1d4ed8;text-decoration:none;text-shadow:none;box-shadow:none}
.category-card__action .card-cart-icon,.category-card__action:hover .card-cart-icon,.category-card__action:focus-visible .card-cart-icon{transform:none;transition:none}