@layer reset, base, parts, pages;
@layer reset {
  *, *::before, *::after { box-sizing: border-box; }
  body, h1, h2, h3, p, ul, ol, dl, dd, figure, blockquote { margin: 0; }
  ul[role="list"], .bare { list-style: none; padding: 0; }
  img { display: block; max-inline-size: 100%; block-size: auto; }
  button { font: inherit; color: inherit; }
}
@layer base {
  :root {
    --yd-pink: #ff3764;
    --yd-violet: #6a07d2;
    --yd-violet-deep: #40028a;
    --yd-ink: #1b1029;
    --yd-mute: #5d566b;
    --yd-line: #e3dfea;
    --yd-fog: #f4f2f7;
    --yd-ground: #dedbe3;
    --yd-ok: #1b8a4b;
    --yd-shell: 1240px;
    --yd-pad: clamp(16px, 3vw, 32px);
    --yd-r: 6px;
  }
  html { -webkit-text-size-adjust: 100%; }
  body { font-family: "Work Sans", system-ui, sans-serif; color: var(--yd-ink); background: #fff; line-height: 1.55; font-size: 16px; overflow-x: hidden; }
  h1, h2, h3 { font-family: "Lexend", "Work Sans", sans-serif; line-height: 1.2; font-weight: 600; }
  a { color: var(--yd-violet); text-underline-offset: 3px; }
  .shell { max-inline-size: var(--yd-shell); margin-inline: auto; padding-inline: var(--yd-pad); }
  .vh { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@layer parts {
  /* шапка — как у corporate.mattel: белая полоса, лого слева, разделы справа, тонкая линия снизу */
  .rig { position: sticky; inset-block-start: 0; z-index: 20; background: #fff; border-block-end: 1px solid var(--yd-line); }
  .rig__in { display: flex; align-items: center; gap: 20px; min-block-size: 76px; }
  .rig__logo img { inline-size: 92px; }
  .rig__lines { margin-inline-start: auto; }
  .rig__lines ul { display: flex; gap: 4px 22px; align-items: center; flex-wrap: wrap; }
  .rig__lines a, .rig__more summary { font-weight: 600; font-size: 15px; color: var(--yd-ink); text-decoration: none; cursor: pointer; padding-block: 8px; display: inline-block; }
  .rig__lines a:hover, .rig__lines a[aria-current] { color: var(--yd-violet); }
  .rig__more { position: relative; }
  .rig__more summary { list-style: none; }
  .rig__more summary::after { content: ""; display: inline-block; inline-size: 7px; block-size: 7px; border-inline-end: 2px solid var(--yd-pink); border-block-end: 2px solid var(--yd-pink); transform: rotate(45deg); margin-inline-start: 8px; translate: 0 -3px; }
  .rig__more ul { position: absolute; inset-inline-end: 0; inset-block-start: 100%; background: #fff; border: 1px solid var(--yd-line); padding: 8px 16px; display: block; min-inline-size: 240px; }
  .rig__more li a { display: block; padding-block: 7px; }
  .rig__cta { line-height: 0; }
  .rig__burger { display: none; margin-inline-start: auto; background: none; border: 1px solid var(--yd-line); border-radius: var(--yd-r); padding: 9px 12px; cursor: pointer; font-weight: 600; }
  .rig__burger i { display: block; inline-size: 20px; block-size: 2px; background: var(--yd-ink); margin-block: 4px; }
  .snap { background: none; border: 0; padding: 0; cursor: pointer; line-height: 0; inline-size: min(330px, 100%); transition: translate .15s; }
  .snap img { inline-size: 100%; }
  .snap:hover { translate: 0 -2px; }
  .snap:focus-visible { outline: 3px solid var(--yd-pink); outline-offset: 3px; border-radius: 40px; }
  .rig__cta .snap { inline-size: 200px; }
  .trail { font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--yd-mute); padding-block: 18px 6px; display: flex; flex-wrap: wrap; gap: 4px 10px; }
  .trail a { color: var(--yd-mute); text-decoration: none; display: inline-block; padding-block: 4px; }
  .trail a:hover { color: var(--yd-violet); }
  .trail b { font-weight: 400; color: var(--yd-ink); padding-block: 4px; }
  .stars { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; color: var(--yd-mute); }
  .stars i { --v: 0%; display: inline-block; inline-size: 82px; block-size: 15px; background: linear-gradient(90deg, var(--yd-pink) var(--v), #d9d4e0 var(--v));
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 82 15'%3E%3Cpath d='M7.5 0l2.2 4.9 5.3.5-4 3.6 1.2 5.2-4.7-2.8-4.7 2.8 1.2-5.2-4-3.6 5.3-.5zM24.3 0l2.2 4.9 5.3.5-4 3.6 1.2 5.2-4.7-2.8-4.7 2.8 1.2-5.2-4-3.6 5.3-.5zM41 0l2.2 4.9 5.3.5-4 3.6 1.2 5.2L41 11.4l-4.7 2.8 1.2-5.2-4-3.6 5.3-.5zM57.8 0l2.2 4.9 5.3.5-4 3.6 1.2 5.2-4.7-2.8-4.7 2.8 1.2-5.2-4-3.6 5.3-.5zM74.5 0l2.2 4.9 5.3.5-4 3.6 1.2 5.2-4.7-2.8-4.7 2.8 1.2-5.2-4-3.6 5.3-.5z'/%3E%3C/svg%3E") no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 82 15'%3E%3Cpath d='M7.5 0l2.2 4.9 5.3.5-4 3.6 1.2 5.2-4.7-2.8-4.7 2.8 1.2-5.2-4-3.6 5.3-.5zM24.3 0l2.2 4.9 5.3.5-4 3.6 1.2 5.2-4.7-2.8-4.7 2.8 1.2-5.2-4-3.6 5.3-.5zM41 0l2.2 4.9 5.3.5-4 3.6 1.2 5.2L41 11.4l-4.7 2.8 1.2-5.2-4-3.6 5.3-.5zM57.8 0l2.2 4.9 5.3.5-4 3.6 1.2 5.2-4.7-2.8-4.7 2.8 1.2-5.2-4-3.6 5.3-.5zM74.5 0l2.2 4.9 5.3.5-4 3.6 1.2 5.2-4.7-2.8-4.7 2.8 1.2-5.2-4-3.6 5.3-.5z'/%3E%3C/svg%3E") no-repeat; }
  /* карточка товара — сетка с рамками как у shop.mattel, бренд-строка над названием как у popmarket */
  .crates { display: grid; grid-template-columns: repeat(auto-fill, minmax(232px, 1fr)); border-block-start: 1px solid var(--yd-line); border-inline-start: 1px solid var(--yd-line); }
  .crate { display: flex; flex-direction: column; gap: 8px; padding: 18px 16px 18px; border-inline-end: 1px solid var(--yd-line); border-block-end: 1px solid var(--yd-line); background: #fff; }
  .crate[hidden] { display: none; }
  .crate__pic { display: block; aspect-ratio: 1; }
  .crate__pic img { inline-size: 100%; block-size: 100%; object-fit: contain; }
  .crate__line { font-size: 12px; color: var(--yd-mute); text-align: center; }
  .crate__name { font-family: "Work Sans", sans-serif; font-size: 15px; font-weight: 700; text-align: center; line-height: 1.35; }
  .crate__name a { color: var(--yd-ink); text-decoration: none; }
  .crate__name a:hover { color: var(--yd-violet); }
  .crate .stars { justify-content: center; }
  .crate__cost { text-align: center; font-weight: 700; font-size: 17px; }
  .crate__cost small { display: block; font-weight: 500; font-size: 12px; color: var(--yd-mute); }
  .crate .snap { inline-size: 100%; margin-block-start: auto; }
  .note { border: 1px solid var(--yd-line); padding: 22px; display: flex; flex-direction: column; gap: 10px; background: #fff; }
  .note__t { font-weight: 700; }
  .note blockquote p { color: var(--yd-ink); font-size: 15px; }
  .note figcaption { font-size: 13px; color: var(--yd-mute); margin-block-start: auto; }
  .notes { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; }
  .asks details { border-block-end: 1px solid var(--yd-line); }
  .asks summary { cursor: pointer; padding-block: 16px; font-weight: 600; list-style: none; display: flex; justify-content: space-between; gap: 16px; }
  .asks summary::after { content: "+"; color: var(--yd-pink); font-size: 22px; line-height: 1; }
  .asks details[open] summary::after { content: "–"; }
  .asks details p { padding-block-end: 16px; color: var(--yd-mute); max-inline-size: 75ch; }
  .btn-line { display: inline-block; border: 1.5px solid var(--yd-pink); color: var(--yd-pink); border-radius: 30px; padding: 7px 26px; font-weight: 700; text-decoration: none; font-size: 15px; background: #fff; }
  .btn-line:hover { background: var(--yd-pink); color: #fff; }
  /* подвал — серый блок corporate.mattel: бейдж-лого + колонки ссылок; абзац «о нас» как у poggers */
  .ground { background: var(--yd-ground); margin-block-start: 72px; padding-block: 48px 28px; font-size: 14px; }
  .ground__top { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; padding-block-end: 28px; }
  .ground__badge { display: flex; align-items: center; gap: 16px; }
  .ground__badge span { flex: none; display: block; background: var(--yd-pink); padding: 10px 16px; }
  .ground__badge span img { inline-size: 84px; }
  .ground__badge p { max-inline-size: 46ch; color: var(--yd-ink); }
  .ground__cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; }
  .ground h2 { font-family: "Work Sans", sans-serif; font-size: 14px; font-weight: 700; margin-block-end: 10px; }
  .ground li a { color: var(--yd-ink); text-decoration: none; display: inline-block; padding-block: 4px; }
  .ground li a:hover { color: var(--yd-violet); text-decoration: underline; }
  .ground address { font-style: normal; line-height: 1.7; }
  .ground__fine { border-block-start: 1px solid #c8c3cf; margin-block-start: 28px; padding-block-start: 16px; color: var(--yd-mute); font-size: 12.5px; }
  .dock { display: none; }
}
@layer pages {
  /* главная: розовая плита с лого (corporate.mattel) */
  .signboard { background: var(--yd-pink); margin-block-start: 40px; display: grid; place-items: center; padding-block: 22px; }
  .signboard img { inline-size: clamp(140px, 18vw, 200px); }
  .opening { padding-block: 40px 24px; display: grid; gap: 18px; max-inline-size: 980px; }
  .opening h1 { font-family: "Work Sans", sans-serif; font-weight: 300; font-size: clamp(30px, 4.4vw, 54px); letter-spacing: -.01em; }
  .opening p { font-size: clamp(17px, 1.6vw, 21px); color: var(--yd-ink); max-inline-size: 70ch; }
  .opening__go { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; }
  .opening__go small { color: var(--yd-mute); font-size: 14px; }
  /* плитки линий — ряд брендовых плиток poggers */
  .bays { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 14px; }
  .bay { border: 1px solid var(--yd-line); border-radius: var(--yd-r); text-decoration: none; color: var(--yd-ink); display: flex; flex-direction: column; overflow: hidden; background: #fff; }
  .bay img { aspect-ratio: 1; object-fit: contain; inline-size: 100%; padding: 12px; background: var(--yd-fog); }
  .bay b { font-size: 14px; padding: 10px 12px 2px; }
  .bay span { font-size: 12.5px; color: var(--yd-mute); padding: 0 12px 12px; }
  .bay:hover { border-color: var(--yd-violet); }
  .sec { padding-block: 56px 0; }
  .sec > h2, .sec__h { font-size: clamp(22px, 2.4vw, 30px); margin-block-end: 22px; }
  /* зигзаг-блоки corporate.mattel */
  .slab { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 5vw, 72px); align-items: center; padding-block: 56px 0; }
  .slab img { inline-size: 100%; aspect-ratio: 1; object-fit: cover; }
  .slab h2 { font-size: clamp(22px, 2.4vw, 30px); margin-block-end: 14px; }
  .slab p { color: var(--yd-mute); max-inline-size: 56ch; }
  .slab--flip img { order: 2; }
  .lore { padding-block: 56px 0; }
  .lore h2 { font-size: clamp(24px, 2.6vw, 32px); margin-block-end: 18px; }
  .lore__cols { columns: 2 380px; column-gap: 48px; }
  .lore h3 { font-size: 18px; margin-block: 0 8px; break-after: avoid; }
  .lore p { margin-block-end: 18px; color: var(--yd-ink); }
  .connect { display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; padding-block: 48px 0; }
  .connect h2 { font-size: 18px; margin-block-end: 6px; }
  .connect p { color: var(--yd-mute); max-inline-size: 60ch; }
  /* раздел: H1 слева, фильтры-колонка слева (popmarket/poggers) */
  .bayhead { display: grid; gap: 10px; padding-block: 8px 24px; }
  .bayhead h1 { font-size: clamp(26px, 3.2vw, 38px); }
  .bayhead p { color: var(--yd-mute); max-inline-size: 75ch; }
  .bayband { background: var(--yd-fog); display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin-block-end: 28px; }
  .bayband img { aspect-ratio: 1; object-fit: contain; inline-size: 100%; padding: 14px; mix-blend-mode: multiply; }
  .layout { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 28px; align-items: start; }
  .sieve { display: grid; gap: 22px; font-size: 14px; position: sticky; inset-block-start: 96px; }
  .sieve h2 { font-family: "Work Sans", sans-serif; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; margin-block-end: 8px; padding-block-end: 8px; border-block-end: 1px solid var(--yd-line); }
  .sieve label { display: flex; gap: 8px; align-items: center; padding-block: 5px; cursor: pointer; }
  .sieve label em { font-style: normal; color: var(--yd-mute); margin-inline-start: auto; }
  .sieve select { inline-size: 100%; padding: 9px; border: 1px solid var(--yd-line); border-radius: var(--yd-r); background: #fff; font: inherit; }
  .count { font-size: 14px; color: var(--yd-mute); margin-block-end: 12px; }
  .lines-other { display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 14px; }
  .lines-other a { display: inline-block; padding-block: 6px; }
  /* карточка товара: галерея + инфо + правая колонка «more to explore» (shop.mattel), таблица деталей (popmarket) */
  .unit { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) 170px; gap: 36px; padding-block: 12px 0; align-items: start; }
  .gal__main { border: 1px solid var(--yd-line); aspect-ratio: 1; display: grid; place-items: center; background: #fff; }
  .gal__main img { max-block-size: 100%; object-fit: contain; }
  .gal__row { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin-block-start: 10px; }
  .gal__row button { border: 1px solid var(--yd-line); background: #fff; padding: 4px; cursor: pointer; aspect-ratio: 1; }
  .gal__row button.pick-on { border-color: var(--yd-violet); }
  .gal__row img { inline-size: 100%; block-size: 100%; object-fit: contain; }
  .info { display: grid; gap: 14px; }
  .info__line a { font-size: 14px; color: var(--yd-ink); }
  .info h1 { font-family: "Work Sans", sans-serif; font-weight: 700; font-size: clamp(22px, 2.3vw, 28px); }
  .info__cost { font-size: 26px; font-weight: 700; }
  .info__stock { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--yd-ok); }
  .info__stock::before { content: ""; inline-size: 9px; block-size: 9px; border-radius: 50%; background: currentColor; }
  .info__stock--late { color: #a35a00; }
  .info__lede { color: var(--yd-ink); }
  .info select { padding: 10px; border: 1px solid var(--yd-line); border-radius: var(--yd-r); font: inherit; background: #fff; inline-size: 100%; max-inline-size: 420px; }
  .info label { display: grid; gap: 6px; font-weight: 600; font-size: 14px; }
  .fold { border: 1px solid var(--yd-line); border-radius: var(--yd-r); background: var(--yd-fog); }
  .fold summary { padding: 13px 16px; font-weight: 600; cursor: pointer; list-style: none; display: flex; justify-content: space-between; }
  .fold summary::after { content: ""; inline-size: 8px; block-size: 8px; border-inline-end: 2px solid var(--yd-ink); border-block-end: 2px solid var(--yd-ink); transform: rotate(45deg); }
  .fold[open] summary::after { transform: rotate(-135deg); }
  .fold ul { padding: 0 16px 14px 34px; display: grid; gap: 6px; }
  .fold dl { padding: 0 16px 14px; display: grid; gap: 0; }
  .fold dl div { display: grid; grid-template-columns: 130px 1fr; gap: 12px; padding-block: 9px; border-block-end: 1px solid var(--yd-line); font-size: 14px; }
  .fold dt { font-weight: 600; }
  .explore { border-inline-start: 1px solid var(--yd-line); padding-inline-start: 18px; display: grid; gap: 14px; }
  .explore h2 { font-family: "Work Sans", sans-serif; font-size: 13px; font-weight: 700; text-align: center; }
  .explore a { display: grid; gap: 6px; border: 1px solid var(--yd-line); border-radius: var(--yd-r); padding: 8px; text-decoration: none; color: var(--yd-ink); font-size: 12.5px; font-weight: 600; text-align: center; }
  .explore img { aspect-ratio: 1; object-fit: contain; }
  .prose { max-inline-size: 780px; padding-block-end: 12px; }
  .prose h1 { font-size: clamp(26px, 3vw, 36px); margin-block: 6px 18px; }
  .prose h2 { font-size: 21px; margin-block: 28px 10px; }
  .prose p, .prose li { margin-block-end: 12px; }
  .prose ol { padding-inline-start: 22px; }
  .yardpage { display: grid; grid-template-columns: minmax(0, 1fr) 250px; gap: 48px; align-items: start; }
  .yardpage__side { border-inline-start: 3px solid var(--yd-pink); padding: 6px 0 6px 20px; font-size: 14px; display: grid; gap: 12px; }
  .yardpage__side h2 { font-size: 15px; }
  .yardpage__side ol { padding-inline-start: 18px; display: grid; gap: 4px; }
  .yardpage__side a { display: inline-block; padding-block: 4px; color: var(--yd-ink); }
  .yardpage__side a[aria-current] { color: var(--yd-violet); font-weight: 700; }
  .yardpage__side dt { font-weight: 700; }
  .card-contact { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-block: 18px; }
  .card-contact p { border: 1px solid var(--yd-line); padding: 16px; }
  .lead-set { display: grid; grid-template-columns: 150px 1fr; gap: 18px; align-items: center; border: 1px solid var(--yd-line); padding: 16px; margin-block: 18px 6px; }
  .lead-set img { aspect-ratio: 1; object-fit: contain; }
  .lead-set .snap { inline-size: 260px; max-inline-size: 100%; margin-block-start: 8px; }
}
@media (max-width: 1100px) {
  .rig__lines, .rig__cta { display: none; }
  .rig__burger { display: block; }
  .rig.menu-open .rig__lines { display: block; position: absolute; inset-inline: 0; inset-block-start: 100%; background: #fff; border-block-end: 1px solid var(--yd-line); padding: 8px var(--yd-pad) 16px; }
  .rig.menu-open .rig__lines ul { flex-direction: column; align-items: stretch; gap: 0; }
  .rig.menu-open .rig__more ul { position: static; border: 0; padding: 0 0 0 14px; }
  .dock { display: flex; position: fixed; inset-inline: 0; inset-block-end: 0; z-index: 30; background: var(--yd-ink); color: #fff; align-items: center; gap: 12px;
          padding: 8px var(--yd-pad) calc(8px + env(safe-area-inset-bottom)); }
  .dock p { font-size: 13px; line-height: 1.3; flex: 1; min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .dock b { display: block; }
  .dock .snap { inline-size: 176px; flex: none; }
  body { padding-block-end: 76px; }
  .unit { grid-template-columns: 1fr 1fr; }
  .explore { grid-column: 1 / -1; border: 0; padding: 0; grid-template-columns: repeat(3, 1fr); }
  .explore h2 { grid-column: 1 / -1; text-align: start; }
}
@media (max-width: 760px) {
  .slab, .unit, .yardpage { grid-template-columns: 1fr; }
  .slab--flip img { order: 0; }
  .layout { grid-template-columns: 1fr; }
  .sieve { position: static; grid-template-columns: 1fr 1fr; gap: 12px; }
  .sieve__themes { grid-column: 1 / -1; }
  .crates { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .crate { padding: 12px 10px; }
  .crate__name { font-size: 13.5px; }
  .bayband img { padding: 4px; }
  .sieve__lines, .crate__line { display: none; }
  .ground__cols { grid-template-columns: 1fr 1fr; }
  .lead-set { grid-template-columns: 92px minmax(0, 1fr); }
  .lead-set .snap { inline-size: 100%; }
  .fold dl div { grid-template-columns: 1fr 1.4fr; }
}

  /* шапка: лого + штамп, все линии строкой с переносом (без бургера) */
  .rig__in { flex-wrap: wrap; gap: 4px 20px; padding-block: 10px 6px; }
  .rig__cta { margin-inline-start: auto; }
  .rig__lines { order: 3; flex-basis: 100%; margin-inline-start: 0; border-block-start: 1px solid var(--yd-line); padding-block-start: 2px; }
  .rig__lines ul { gap: 0 16px; }
  .rig__lines a { font-size: 14.5px; }
  .hp-proof, .hp-mts, .hp-trust { list-style: none; margin: 0; padding: 0; }

  /* главная: первый экран */
  .hp-open { background: linear-gradient(180deg, #fff 0, var(--yd-fog) 100%); border-block-end: 1px solid var(--yd-line); }
  .hp-open__in { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 40px; align-items: center; padding-block: 34px 40px; }
  .hp-open__plate { display: inline-block; background: var(--yd-pink); padding: 10px 18px; margin-block-end: 18px; }
  .hp-open__plate img { inline-size: 120px; }
  .hp-open__copy h1 { font-family: "Work Sans", sans-serif; font-weight: 300; font-size: clamp(28px, 3.6vw, 46px); letter-spacing: -.01em; margin-block-end: 14px; }
  .hp-open__copy > p { font-size: clamp(16px, 1.4vw, 19px); max-inline-size: 60ch; }
  .hp-open__go { display: flex; flex-wrap: wrap; gap: 12px; margin-block: 22px 24px; }
  .hp-btn { display: inline-flex; align-items: center; min-block-size: 48px; padding: 10px 24px; border-radius: 30px; background: var(--yd-violet); color: #fff; font-weight: 700; text-decoration: none; border: 2px solid var(--yd-violet); }
  .hp-btn:hover { background: var(--yd-violet-deep); border-color: var(--yd-violet-deep); }
  .hp-btn--line { background: #fff; color: var(--yd-pink); border-color: var(--yd-pink); }
  .hp-btn--line:hover { background: var(--yd-pink); color: #fff; border-color: var(--yd-pink); }
  .hp-proof { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
  .hp-proof li { background: #fff; border: 1px solid var(--yd-line); border-block-start: 3px solid var(--yd-pink); padding: 10px 12px; }
  .hp-proof b { display: block; font-family: Lexend, sans-serif; font-size: 22px; line-height: 1.15; }
  .hp-proof span { display: block; font-size: 12.5px; color: var(--yd-mute); line-height: 1.3; }
  .hp-pick { background: #fff; border: 1px solid var(--yd-line); padding: 18px; box-shadow: 0 18px 40px rgba(27, 16, 41, .10); }
  .hp-pick__k { font-family: Lexend, sans-serif; font-weight: 600; font-size: 16px; margin-block-end: 10px; }
  .hp-pick__opts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-block-end: 14px; }
  .hp-pick__opt { display: flex; flex-direction: column; gap: 2px; text-align: start; cursor: pointer; background: var(--yd-fog); border: 2px solid var(--yd-line); padding: 8px 9px; font: inherit; color: var(--yd-ink); }
  .hp-pick__opt b { font-size: 13.5px; line-height: 1.2; }
  .hp-pick__opt small { font-size: 12px; color: var(--yd-mute); }
  .hp-pick__opt:hover { border-color: var(--yd-pink); }
  .hp-pick__opt.is-on { border-color: var(--yd-violet); background: #fff; }
  .hp-pick__body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: center; margin-block-end: 14px; }
  .hp-pick__shot { display: block; background: var(--yd-fog); }
  .hp-pick__img { inline-size: 100%; aspect-ratio: 1; object-fit: contain; padding: 10px; mix-blend-mode: multiply; }
  .hp-pick__name { font-family: Lexend, sans-serif; font-weight: 600; font-size: 18px; line-height: 1.25; margin-block-end: 6px; }
  .hp-pick__name a { color: var(--yd-ink); text-decoration: none; }
  .hp-pick__rate { font-size: 14px; color: var(--yd-mute); margin-block-end: 8px; }
  .hp-pick__rate b { color: var(--yd-ink); }
  .hp-pick__facts { display: grid; gap: 4px; margin-block-end: 10px; }
  .hp-pick__facts div { display: flex; justify-content: space-between; border-block-end: 1px dashed var(--yd-line); padding-block-end: 4px; font-size: 14px; }
  .hp-pick__facts dt { color: var(--yd-mute); }
  .hp-pick__facts dd { font-weight: 600; }
  .hp-pick__cost { font-family: Lexend, sans-serif; font-weight: 700; font-size: 26px; }
  .hp-late { display: none; font-size: 13px; color: var(--yd-mute); }
  .hp-late--on { display: block; }
  .hp-pick .snap { inline-size: 100%; max-inline-size: 360px; margin-inline: auto; display: block; }
  .hp-sub { color: var(--yd-mute); max-inline-size: 75ch; margin-block: -6px 18px; }

  /* плитки линий живыми кадрами */
  .hp-bays { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); }
  .hp-bay img { aspect-ratio: 4 / 3; object-fit: cover; padding: 0; background: var(--yd-fog); }

  /* таблица */
  .hp-tb { inline-size: 100%; border-collapse: collapse; border: 1px solid var(--yd-line); font-size: 14.5px; }
  .hp-tb th, .hp-tb td { padding: 10px 12px; text-align: start; border-block-end: 1px solid var(--yd-line); vertical-align: middle; }
  .hp-tb thead th { background: var(--yd-fog); font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--yd-mute); }
  .hp-tb__set { display: flex; align-items: center; gap: 10px; color: var(--yd-ink); text-decoration: none; font-weight: 600; }
  .hp-tb__set img { inline-size: 56px; block-size: 56px; object-fit: contain; background: var(--yd-fog); flex: none; mix-blend-mode: multiply; }
  .hp-tb small { color: var(--yd-mute); display: block; font-size: 12px; }
  .hp-tb__buy { inline-size: 200px; }
  .hp-tb__buy .snap { inline-size: 190px; }

  /* подбор «кто строит» */
  .hp-mts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
  .hp-mt { display: flex; flex-direction: column; border: 1px solid var(--yd-line); border-block-start: 4px solid var(--yd-pink); padding: 14px; background: #fff; }
  .hp-mt:nth-child(even) { border-block-start-color: var(--yd-violet); }
  .hp-mt__who { font-family: Lexend, sans-serif; font-weight: 600; font-size: 16px; line-height: 1.25; margin-block-end: 6px; }
  .hp-mt__txt { font-size: 14px; color: var(--yd-mute); margin-block-end: 12px; flex: 1 1 auto; }
  .hp-mt__go { display: flex; align-items: center; gap: 10px; background: var(--yd-fog); padding: 8px; text-decoration: none; color: var(--yd-ink); }
  .hp-mt__go img { inline-size: 54px; block-size: 54px; object-fit: contain; flex: none; mix-blend-mode: multiply; }
  .hp-mt__go b { display: block; font-size: 13.5px; line-height: 1.25; }
  .hp-mt__go small { font-size: 12px; color: var(--yd-mute); }

  /* доверие */
  .hp-trust { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
  .hp-trust li { border: 1px solid var(--yd-line); padding: 16px; background: var(--yd-fog); }
  .hp-trust b { display: block; font-family: Lexend, sans-serif; font-size: 16px; margin-block-end: 6px; }
  .hp-trust span { font-size: 14px; color: var(--yd-mute); }

@media (max-width: 1100px) {
  .rig__lines, .rig__cta { display: block; }
  .rig__burger { display: none; }
  .hp-open__in { grid-template-columns: 1fr; }
  .hp-mts, .hp-trust { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .hp-tb, .hp-tb tbody, .hp-tb tr { display: block; border: 0; }
  .hp-tb thead { display: none; }
  .hp-tb tbody tr { border: 1px solid var(--yd-line); margin-block-end: 12px; background: #fff; }
  .hp-tb th[scope=row] { display: block; background: var(--yd-fog); }
  .hp-tb td { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 7px 12px; text-align: end; }
  .hp-tb td::before { content: attr(data-label); font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--yd-mute); text-align: start; }
  .hp-tb td.hp-tb__buy { display: block; inline-size: auto; border-block-end: 0; }
  .hp-tb td.hp-tb__buy::before { content: none; }
  .hp-tb__buy .snap { inline-size: 100%; max-inline-size: 300px; margin-inline: auto; display: block; }
}
@media (max-width: 760px) {
  .rig { position: static; }
  .rig__logo img { inline-size: 70px; }
  .rig__cta .snap { inline-size: 176px; }
  .rig__lines ul { gap: 6px; padding-block: 8px 4px; }
  .rig__lines a { font-size: 13px; padding: 5px 10px; border: 1px solid var(--yd-line); border-radius: 30px; }
  .hp-proof { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hp-open__plate { display: none; }
  .hp-pick { padding: 14px; }
  .hp-pick__opts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hp-pick__body { grid-template-columns: 1fr; }
  .hp-pick__shot { max-inline-size: 300px; inline-size: 100%; margin-inline: auto; }
  .hp-bays { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .hp-mts, .hp-trust { grid-template-columns: 1fr; }
}
