@layer reset, tokens, base, blocks, pages;

@layer tokens {
  :root {
    --ty-teal: #0d7c8d;
    --ty-teal-deep: #0a4f5a;
    --ty-teal-ink: #083f48;
    --ty-sun: #f6c840;
    --ty-sun-soft: #fdf3cf;
    --ty-ink: #13262b;
    --ty-mute: #5b6b6f;
    --ty-sand: #f4eee9;
    --ty-mist: #eef5f6;
    --ty-line: #dfe7e8;
    --ty-white: #fff;
    --ty-shell: 1240px;
    --ty-read: 780px;
    --ty-mid: 1080px;
    --ty-r: 14px;
    --ty-r-sm: 8px;
    --ty-head: "Geologica", "Segoe UI", system-ui, sans-serif;
    --ty-body: "Wix Madefor Text", "Segoe UI", system-ui, sans-serif;
  }
}

@layer reset {
  *, *::before, *::after { box-sizing: border-box; }
  html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
  body, h1, h2, h3, h4, p, ul, ol, figure, blockquote { margin: 0; }
  ul, ol { padding: 0; }
  img { max-inline-size: 100%; block-size: auto; display: block; }
  table { border-collapse: collapse; }
}

@layer base {
  body { font-family: var(--ty-body); font-size: 17px; line-height: 1.65; color: var(--ty-ink); background: var(--ty-white); overflow-x: hidden; }
  h1, h2, h3, h4 { font-family: var(--ty-head); line-height: 1.18; letter-spacing: -.01em; color: var(--ty-ink); }
  h1 { font-size: clamp(1.9rem, 3.4vw, 2.75rem); font-weight: 800; }
  h2 { font-size: clamp(1.5rem, 2.5vw, 2.05rem); font-weight: 700; }
  h3 { font-size: 1.18rem; font-weight: 700; }
  a { color: var(--ty-teal); text-underline-offset: 3px; }
  a:hover { color: var(--ty-teal-deep); }
  :focus-visible { outline: 3px solid var(--ty-sun); outline-offset: 2px; }
  .zixibij0 { inline-size: min(100% - 32px, var(--ty-shell)); margin-inline: auto; }
  .zabi8 { inline-size: min(100% - 32px, var(--ty-read)); }
  .xigox4 { inline-size: min(100% - 32px, var(--ty-mid)); }
  .punejeh5 { position: absolute; inset-inline-start: -999px; }
  .punejeh5:focus { inset-inline-start: 16px; inset-block-start: 8px; z-index: 99; background: var(--ty-white); padding: 8px 14px; }
  .vitebav7 { font-family: var(--ty-head); font-size: .78rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--ty-teal); margin-block-end: 8px; }
  .pimazow9 { inline-size: 26px; block-size: 26px; flex: none; color: var(--ty-teal); }
  .kowa1 { inline-size: 16px; block-size: 16px; }
  .zatelox6 { display: inline-block; background: var(--ty-teal); color: var(--ty-white); font-family: var(--ty-head); font-weight: 600; padding: 10px 22px; border-radius: 999px; text-decoration: none; }
  .zatelox6:hover { background: var(--ty-teal-deep); color: var(--ty-white); }
  .sixoga8 { display: block; cursor: pointer; transition: transform .15s ease, filter .15s ease; }
  .sixoga8 img { inline-size: 100%; }
  .sixoga8:hover { transform: translateY(-1px); filter: brightness(1.04); }
}

@layer blocks {
  /* анонс-полоса */
  .gepukac6 { background: var(--ty-ink); color: var(--ty-white); text-align: center; font-size: .82rem; font-weight: 600; padding: 8px 16px; letter-spacing: .02em; }

  /* шапка */
  .foja5 { position: sticky; inset-block-start: 0; z-index: 30; background: var(--ty-white); border-block-end: 1px solid var(--ty-line); }
  .wubun9 { display: flex; align-items: center; gap: 28px; min-block-size: 76px; }
  .xeniced0 img { inline-size: 112px; }
  .beva4 ul { list-style: none; display: flex; gap: 30px; }
  .beva4 a { color: var(--ty-ink); text-decoration: none; font-family: var(--ty-head); font-weight: 600; font-size: .98rem; padding-block: 6px; border-block-end: 2px solid transparent; }
  .beva4 a:hover, .beva4 a[aria-current] { color: var(--ty-teal); border-block-end-color: var(--ty-teal); }
  .ruca5 { margin-inline-start: auto; inline-size: 230px; }
  .ziqutag8, .lonis5 { display: none; }

  /* хиро-карточка */
  .lumo0 { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 48px; padding-block: 36px 56px; align-items: start; }
  .haxuha4 { display: flex; align-items: center; gap: 6px; font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ty-mute); margin-block-end: 10px; }
  .haxuha4 .pimazow9 { color: var(--ty-sun); fill: var(--ty-sun); }
  .kacovuc3 { margin-block: 16px 18px; color: #2f4246; }
  .fofem0 { list-style: none; display: grid; gap: 10px; margin-block-end: 18px; }
  .fofem0 li { display: flex; gap: 12px; align-items: flex-start; font-weight: 600; }
  .mepukaf8 li { font-weight: 400; }
  .mepukaf8 .pimazow9 { inline-size: 20px; block-size: 20px; margin-block-start: 3px; }
  .xajome4 { font-family: var(--ty-head); font-size: 2rem; font-weight: 800; margin-block: 6px 12px; }
  .xajome4 span { font-size: 1rem; font-weight: 600; color: var(--ty-mute); }
  .xajome4 .loqa1 { font-size: inherit; font-weight: inherit; color: var(--ty-ink); }
  .xajome4 s, .cubito1 s { font-size: 1rem; color: var(--ty-mute); font-weight: 500; }
  .miluv5 { font-weight: 700; font-size: .9rem; margin-block-end: 8px; }
  .zuhexe8 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-block-end: 18px; }
  .rucufaz7 { display: flex; flex-direction: column; gap: 2px; border: 1.5px solid var(--ty-line); border-radius: var(--ty-r-sm); padding: 10px 12px; text-decoration: none; color: var(--ty-ink); font-size: .9rem; }
  .rucufaz7 b { font-family: var(--ty-head); }
  .rucufaz7 span { color: var(--ty-mute); }
  .rucufaz7:hover, .rucufaz7[aria-current] { border-color: var(--ty-teal); background: var(--ty-mist); color: var(--ty-ink); }
  .foci0 { max-inline-size: 440px; margin-block: 6px 16px; }
  .xihoc6 { font-size: .85rem; color: var(--ty-mute); margin-block: -6px 14px; }
  .cuqib1 { border-block-end: 1px solid var(--ty-line); }
  .cuqib1:first-of-type { border-block-start: 1px solid var(--ty-line); }
  .cuqib1 summary { cursor: pointer; list-style: none; font-family: var(--ty-head); font-weight: 600; padding-block: 14px; display: flex; justify-content: space-between; }
  .cuqib1 summary::after { content: "+"; font-size: 1.3rem; line-height: 1; color: var(--ty-teal); }
  .cuqib1[open] summary::after { content: "\2212"; }
  .cuqib1 p, .cuqib1 table { padding-block-end: 14px; color: #34474b; }
  .getem2 { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-block-start: 22px; text-align: center; font-size: .82rem; }
  .getem2 li { display: flex; flex-direction: column; align-items: center; gap: 4px; }
  .getem2 b { font-family: var(--ty-head); font-size: .88rem; }
  .getem2 span { color: var(--ty-mute); }

  /* галерея */
  .laje8 { position: relative; }
  .cigig9 { position: absolute; opacity: 0; pointer-events: none; }
  .gezijom5 { background: var(--ty-mist); border-radius: var(--ty-r); overflow: hidden; aspect-ratio: 1; }
  .jokefor9 { display: none; inline-size: 100%; block-size: 100%; object-fit: contain; }
  .wugiqod5 { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 10px; margin-block-start: 12px; }
  .pepaha1 { cursor: pointer; border: 2px solid transparent; border-radius: var(--ty-r-sm); overflow: hidden; background: var(--ty-mist); }
  .pepaha1:hover { border-color: var(--ty-line); }
  .cigig9:nth-of-type(1):checked ~ .gezijom5 .japikav6, .cigig9:nth-of-type(2):checked ~ .gezijom5 .sewelo2,
  .cigig9:nth-of-type(3):checked ~ .gezijom5 .putaqog1, .cigig9:nth-of-type(4):checked ~ .gezijom5 .neci1,
  .cigig9:nth-of-type(5):checked ~ .gezijom5 .rijil7, .cigig9:nth-of-type(6):checked ~ .gezijom5 .pelosot9,
  .cigig9:nth-of-type(7):checked ~ .gezijom5 .humofo8 { display: block; }
  .cigig9:nth-of-type(1):checked ~ .wugiqod5 .surutup0, .cigig9:nth-of-type(2):checked ~ .wugiqod5 .komuw6,
  .cigig9:nth-of-type(3):checked ~ .wugiqod5 .rusuwo5, .cigig9:nth-of-type(4):checked ~ .wugiqod5 .jimiro1,
  .cigig9:nth-of-type(5):checked ~ .wugiqod5 .kifu7, .cigig9:nth-of-type(6):checked ~ .wugiqod5 .fiwa7,
  .cigig9:nth-of-type(7):checked ~ .wugiqod5 .saketex9 { border-color: var(--ty-teal); }

  /* бирюзовая полоса */
  .haqo2 { background: var(--ty-teal); color: var(--ty-white); padding-block: 44px; }
  .haqo2 h2 { color: var(--ty-white); text-align: center; max-inline-size: 720px; margin-inline: auto; margin-block-end: 28px; }
  .pocuf0 { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
  .pocuf0 li { display: flex; gap: 14px; align-items: flex-start; }
  .pocuf0 .pimazow9 { color: var(--ty-sun); inline-size: 34px; block-size: 34px; }
  .pocuf0 b { display: block; font-family: var(--ty-head); font-size: 1.05rem; }
  .pocuf0 span { opacity: .9; font-size: .95rem; }
  .pesexa3 { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
  .pesexa3 li { background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .35); padding: 8px 16px; border-radius: 999px; font-weight: 600; }

  .gavaxeh1 img { inline-size: 100%; aspect-ratio: 5 / 1; object-fit: cover; }

  /* ряды фото/текст */
  .dutade2 { display: grid; gap: 22px; padding-block: 56px; }
  .cagotol6 { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border: 1px solid var(--ty-line); border-radius: var(--ty-r); overflow: hidden; align-items: center; }
  .huqemaw3 .degog1 { order: 2; }
  .degog1 { block-size: 100%; }
  .degog1 img { inline-size: 100%; block-size: 100%; object-fit: cover; min-block-size: 280px; }
  .xukum6 .degog1 img { aspect-ratio: 1; min-block-size: 0; object-fit: contain; background: var(--ty-mist); }
  .xelukej5 { padding: 40px clamp(22px, 4vw, 56px); }
  .xelukej5 h3 { margin-block: 10px 12px; color: var(--ty-teal-deep); }
  .xelukej5 p { color: #3b4d51; }

  /* top picks */
  .zexifad3 { background: var(--ty-sand); padding-block: 60px; }
  .zexifad3 h2 + p { margin-block: 8px 22px; color: var(--ty-mute); }
  .zuqazug4 { list-style: none; display: grid; gap: 14px; margin-block-end: 34px; }
  .qadaha5 { font-family: var(--ty-head); font-size: .74rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
  .zuqazug4 a { font-weight: 600; }
  .qowuqo2 { color: var(--ty-mute); }
  .famuhoq9 { font-size: .85rem; font-weight: 500; color: var(--ty-mute); text-decoration: none; }
  .here3 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
  .kewexe6 { background: var(--ty-white); border: 1px solid var(--ty-line); padding: 22px; scroll-margin-block-start: 100px; }
  .tefawij3 { font-family: var(--ty-head); font-size: .75rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--ty-teal); }
  .naviz6 { font-size: 1.2rem; margin-block: 4px 14px; }
  .naviz6 a { color: var(--ty-ink); text-decoration: none; }
  .suqomok5 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: center; }
  .cubito1 { font-family: var(--ty-head); font-weight: 800; font-size: 1.5rem; margin-block-end: 10px; }
  .jihodi4 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-block: 16px; }
  .jihodi4 > div { border: 1px solid var(--ty-line); padding: 12px 14px; }
  .jihodi4 h4 { font-family: var(--ty-head); font-size: .95rem; margin-block-end: 6px; }
  .jihodi4 ul { padding-inline-start: 18px; font-size: .9rem; color: #3b4d51; }
  .jihodi4 li::marker { color: var(--ty-teal); }
  .teqef9 { border-block-start: 1px solid var(--ty-line); }
  .teqef9 summary { cursor: pointer; padding-block: 10px; font-family: var(--ty-head); font-weight: 600; font-size: .95rem; }
  .teqef9 p, .teqef9 table { padding-block-end: 12px; font-size: .93rem; }
  .cafuza2 { text-align: center; margin-block-start: 26px; font-weight: 600; }
  .tojosam9 { inline-size: 100%; font-size: .92rem; }
  .tojosam9 th, .tojosam9 td { text-align: start; padding: 7px 8px; border-block-end: 1px solid var(--ty-line); vertical-align: top; }
  .tojosam9 th { font-weight: 600; inline-size: 42%; color: var(--ty-mute); }

  /* about */
  .nenudax3 { display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; align-items: center; padding-block: 64px; }
  .nusaz9 { display: grid; grid-template-columns: 1.3fr 1fr; gap: 14px; align-items: center; }
  .nusaz9 img { border-radius: var(--ty-r); inline-size: 100%; object-fit: cover; aspect-ratio: 3 / 4; box-shadow: 0 18px 40px rgba(8, 63, 72, .15); }
  .nusaz9 img + img { aspect-ratio: 1; object-fit: contain; background: var(--ty-mist); }
  .jaqunaj8 p { margin-block: 12px; color: #3b4d51; }
  .jaqunaj8 .zatelox6 { margin-block-start: 8px; }

  /* отзывы */
  .mavagoc8 { padding-block: 24px 56px; }
  .mavagoc8 h2 { margin-block-end: 22px; }
  .jiwizuc1 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  .rocur8 { background: #f3f4f4; padding: 22px; display: flex; flex-direction: column; gap: 10px; }
  .rocur8 h3 { font-size: 1.02rem; }
  .rocur8 p { font-size: .93rem; color: #34474b; }
  .gobodo3 { color: #e3a008; letter-spacing: 2px; }
  .zibu6 { font-size: .82rem !important; color: var(--ty-mute) !important; margin-block-start: auto; }

  /* заметки */
  .tegal1 { padding-block: 24px 56px; }
  .tegal1 h2 { margin-block-end: 22px; }
  .sizehut7 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
  .localoz6 { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-block: 26px 56px; }
  .zoxotu8 img { aspect-ratio: 2 / 1; object-fit: cover; inline-size: 100%; }
  .zoxotu8 h3 { margin-block: 14px 8px; }
  .zoxotu8 h3 a { color: var(--ty-ink); text-decoration: none; }
  .zoxotu8 p { color: var(--ty-mute); font-size: .93rem; }
  .cosu1 { text-align: center; margin-block-start: 26px; }

  /* редакционный SEO */
  .resuda4 { padding-block: 56px; border-block-start: 1px solid var(--ty-line); }
  .resuda4 h2 { margin-block-end: 18px; }
  .resuda4 h3 { margin-block: 26px 8px; font-size: 1.15rem; }
  .resuda4 p { margin-block-end: 12px; color: #2f4246; }
  .vureru8 { background: var(--ty-mist); border-inline-start: 4px solid var(--ty-teal); padding: 18px 22px; margin-block: 8px 10px; }
  .vureru8 h3 { margin-block: 0 8px; }
  .vureru8 ul { padding-inline-start: 20px; display: grid; gap: 6px; }

  /* FAQ */
  .rofiti6 { background: var(--ty-sand); padding-block: 56px; }
  .rofiti6 h2 { margin-block-end: 18px; }
  .fokika3 { background: var(--ty-white); border-radius: var(--ty-r-sm); margin-block-end: 10px; padding-inline: 20px; }
  .fokika3 summary { cursor: pointer; font-family: var(--ty-head); font-weight: 600; padding-block: 16px; list-style: none; display: flex; justify-content: space-between; gap: 12px; }
  .fokika3 summary::after { content: "+"; color: var(--ty-teal); font-size: 1.3rem; line-height: 1; }
  .fokika3[open] summary::after { content: "\2212"; }
  .fokika3 p { padding-block-end: 16px; color: #34474b; }

  /* жёлтая полоса */
  .diwuj8 { background: var(--ty-sun); padding-block: 30px; }
  .diwuj8 ul { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; text-align: center; }
  .diwuj8 li { display: flex; flex-direction: column; align-items: center; gap: 4px; font-size: .86rem; }
  .diwuj8 .pimazow9 { color: var(--ty-ink); }
  .diwuj8 b { font-family: var(--ty-head); font-size: .95rem; }

  /* подвал */
  .torizo9 { background: var(--ty-teal-deep); color: #d9eef1; padding-block: 44px 28px; }
  .torizo9 a { color: #e6f6f8; text-decoration: none; }
  .torizo9 a:hover { color: var(--ty-sun); }
  .gopohe9 { text-align: center; padding-block-end: 34px; border-block-end: 1px solid rgba(255, 255, 255, .16); }
  .dujiloq7 { inline-size: 40px; block-size: 40px; color: var(--ty-white); margin-inline: auto; }
  .dapumir2 { font-family: var(--ty-head); font-weight: 700; font-size: 1.2rem; color: var(--ty-white); margin-block: 10px 4px; }
  .dapumir2 a { color: var(--ty-sun); }
  .refoka3 { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1.2fr; gap: 32px; padding-block: 34px; }
  .xiboxo6 { font-size: 1rem; color: var(--ty-white); margin-block-end: 14px; }
  .torizo9 ul { list-style: none; display: grid; gap: 8px; font-size: .92rem; }
  .torizo9 address { font-style: normal; font-size: .92rem; line-height: 1.7; }
  .gujaq6 { font-size: .85rem; opacity: .8; margin-block-start: 14px; }
  .juxabox7 { display: flex; align-items: center; justify-content: space-between; gap: 20px; border-block-start: 1px solid rgba(255, 255, 255, .16); padding-block-start: 22px; font-size: .85rem; }
  .juxabox7 img { inline-size: 92px; }

  /* карточки */
  .nidevi8 { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 22px; padding-block: 8px 48px; }
  .tega6 { display: flex; flex-direction: column; border: 1px solid var(--ty-line); border-radius: var(--ty-r); padding: 16px; background: var(--ty-white); }
  .riluvoz2 { background: var(--ty-mist); border-radius: var(--ty-r-sm); overflow: hidden; }
  .riluvoz2 img { aspect-ratio: 1; object-fit: contain; inline-size: 100%; }
  .ladigu7 { font-family: var(--ty-head); font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--ty-teal); margin-block-start: 14px; }
  .java9 { font-size: 1.05rem; margin-block: 4px 6px; }
  .java9 a { color: var(--ty-ink); text-decoration: none; }
  .letalor5 { font-size: .9rem; color: var(--ty-mute); margin-block-end: 10px; }
  .dajoqa8 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin-block: auto 12px; }
  .nudis2 { font-family: var(--ty-head); font-size: 1.3rem; font-weight: 800; }
  .vetabu5 { font-size: .82rem; color: var(--ty-mute); }
  .vetabu5 b { color: #e3a008; font-weight: 400; }

  .tojoqez6 { padding-block: 14px 0; font-size: .85rem; }
  .tojoqez6 ol { list-style: none; display: flex; flex-wrap: wrap; gap: 4px 8px; color: var(--ty-mute); }
  .tojoqez6 li + li::before { content: "/"; margin-inline-end: 8px; color: var(--ty-line); }
  .tojoqez6 a { color: var(--ty-mute); }

  .lofe4 { display: none; }

  /* видео + до/после */
  .hava0 { background: var(--ty-mist); padding-block: 56px; }
  .sequ7 { color: var(--ty-mute); margin-block: 8px 24px; max-inline-size: 760px; }
  .zisi3 { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 24px; align-items: start; }
  .wekazo7 video { inline-size: 100%; block-size: auto; aspect-ratio: 16 / 9; background: var(--ty-ink); border-radius: var(--ty-r); display: block; }
  .wekazo7 figcaption, .jaloqev5 figcaption { font-size: .85rem; color: var(--ty-mute); margin-block-start: 8px; }
  .zosus2 { display: grid; gap: 18px; }
  .reru0 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .watis3 { position: relative; border-radius: var(--ty-r-sm); overflow: hidden; }
  .watis3 img { aspect-ratio: 4 / 3; object-fit: cover; inline-size: 100%; }
  .watis3 span { position: absolute; inset-inline-start: 8px; inset-block-end: 8px; background: var(--ty-white); color: var(--ty-ink); font-family: var(--ty-head); font-weight: 700; font-size: .75rem; padding: 4px 10px; border-radius: 999px; }
  .watis3 + .watis3 span { background: var(--ty-teal); color: var(--ty-white); }
  .hevad6 figcaption { font-size: .88rem; margin-block-start: 6px; color: #34474b; }
  .jaloqev5 { margin-block-start: 28px; }
  .jaloqev5 img { inline-size: 100%; border-radius: var(--ty-r); }

  /* мини-сравнение комплектов на PDP */
  .neti9 { margin-block-end: 6px; }
  .disugup3 { font-size: .86rem; margin-block: 0 8px; }
  .disugup3 th, .disugup3 td { padding: 7px 8px; }
  .vicen6 th, .vicen6 td { background: var(--ty-sun-soft); }

  /* CTA в конце гайда */
  .xovo6 { display: grid; grid-template-columns: 180px 1fr; gap: 22px; align-items: center; background: var(--ty-sand); border-radius: var(--ty-r); padding: 22px; margin-block: 34px 10px; }
  .xovo6 img { background: var(--ty-white); border-radius: var(--ty-r-sm); }
  .rera4 { font-family: var(--ty-head); font-weight: 700; font-size: 1.15rem; margin-block-end: 4px !important; }
  .rera4 a { color: var(--ty-ink); text-decoration: none; }
  .faqitog4 { font-family: var(--ty-head); font-weight: 800; font-size: 1.3rem; color: var(--ty-ink) !important; margin-block: 4px 10px !important; }
}

@layer pages {
  .lori5 { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; padding-block: 26px 36px; }
  .wofe1 p:not(.vitebav7) { margin-block-start: 12px; color: #34474b; }
  .mafa4 img { border-radius: var(--ty-r); aspect-ratio: 2 / 1; object-fit: cover; inline-size: 100%; }
  .sexudaq2 { padding-block: 36px 8px; }
  .sexudaq2 h2 { margin-block-end: 18px; }

  .venuli7 h1 { margin-block: 4px 8px; }
  .kofuv7 { font-size: .85rem; color: var(--ty-mute); margin-block-end: 18px; }
  .huxisa4 img { inline-size: 100%; aspect-ratio: 2 / 1; object-fit: cover; }
  .tiwawan5 { font-size: 1.08rem; margin-block: 20px; }
  .venuli7 h2 { margin-block: 34px 12px; font-size: clamp(1.35rem, 2.2vw, 1.7rem); scroll-margin-block-start: 100px; }
  .venuli7 p { margin-block-end: 12px; color: #2f4246; }
  .venuli7 .sepaxe7 { padding-inline-start: 22px; display: grid; gap: 6px; margin-block-end: 14px; }
  .qocuzo0 { max-inline-size: 360px; margin-block: 4px 10px; }
  .foxido6 { padding-block: 24px 64px; }
  .foxido6 h1 { margin-block-end: 10px; }
  .xigox4.venuli7 { padding-block: 22px 60px; }
  .zukupo2 { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 46px; padding-block: 24px 40px; max-inline-size: 1080px; }
  .xoloh0 { position: sticky; inset-block-start: 100px; align-self: start; background: #f3f4f4; padding: 16px; font-size: .86rem; }
  .xoloh0 p { font-family: var(--ty-head); font-weight: 700; margin-block-end: 8px; }
  .xoloh0 ol { padding-inline-start: 18px; display: grid; gap: 6px; }
  .xoloh0 a { color: var(--ty-ink); text-decoration: none; }
  .hibasi3 { display: grid; grid-template-columns: 120px 1fr; gap: 18px; align-items: center; border: 1px solid var(--ty-line); border-inline-start: 4px solid var(--ty-sun); padding: 16px; margin-block: 22px; }
  .hibasi3 img { background: var(--ty-mist); }
  .doboru6 { font-family: var(--ty-head); font-weight: 700; margin-block-end: 2px !important; }
  .hibasi3 p { font-size: .9rem; margin-block-end: 8px; }
  .caje3 { max-inline-size: 300px; }

  .mokoja4 { inline-size: 100%; font-size: .92rem; margin-block: 8px 20px; }
  .mokoja4 th, .mokoja4 td { border: 1px solid var(--ty-line); padding: 10px; text-align: start; }
  .mokoja4 thead th { background: var(--ty-teal); color: var(--ty-white); font-family: var(--ty-head); font-weight: 600; }
  .mokoja4 tbody th { font-family: var(--ty-head); }

  .faqajil7 { text-align: center; padding-block: 80px; }
  .faqajil7 p { margin-block: 12px 22px; color: var(--ty-mute); }
  .bucewed1 { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
}

@media (max-width: 1080px) {
  .beva4 ul { gap: 18px; }
  .ruca5 { inline-size: 200px; }
  .refoka3 { grid-template-columns: 1fr 1fr; }
  .here3 { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
  .wubun9 { flex-wrap: wrap; gap: 12px; min-block-size: 64px; padding-block: 8px; }
  .xeniced0 img { inline-size: 92px; }
  .lonis5 { display: flex; flex-direction: column; gap: 5px; cursor: pointer; padding: 10px; margin-inline-start: auto; order: 3; }
  .lonis5 span { inline-size: 24px; block-size: 2.5px; background: var(--ty-ink); border-radius: 2px; }
  .ruca5 { order: 2; inline-size: 180px; margin-inline-start: auto; }
  .beva4 { order: 4; flex-basis: 100%; display: none; }
  .ziqutag8:checked ~ .beva4 { display: block; }
  .beva4 ul { flex-direction: column; gap: 0; padding-block: 6px 12px; }
  .beva4 a { display: block; padding-block: 10px; border-block-end: 1px solid var(--ty-line); }
  .lumo0, .nenudax3, .lori5 { grid-template-columns: 1fr; gap: 26px; }
  .cagotol6, .huqemaw3 { grid-template-columns: 1fr; }
  .huqemaw3 .degog1 { order: 0; }
  .pocuf0, .jiwizuc1, .sizehut7 { grid-template-columns: 1fr; }
  .diwuj8 ul { grid-template-columns: 1fr 1fr; }
  .zukupo2 { grid-template-columns: 1fr; gap: 16px; }
  .zisi3 { grid-template-columns: 1fr; }
  .xoloh0 { position: static; }
  .mokoja4 thead { display: none; }
  .mokoja4, .mokoja4 tbody, .mokoja4 tr, .mokoja4 th, .mokoja4 td { display: block; inline-size: 100%; }
  .mokoja4 tr { border: 1px solid var(--ty-line); margin-block-end: 12px; }
  .mokoja4 th, .mokoja4 td { border: 0; border-block-end: 1px solid var(--ty-line); }
  .mokoja4 td::before { content: attr(data-h) ": "; font-weight: 600; color: var(--ty-mute); }
  .lofe4 { display: flex; position: fixed; inset-inline: 0; inset-block-end: 0; z-index: 40; background: var(--ty-white); border-block-start: 1px solid var(--ty-line); padding: 8px 16px; gap: 14px; align-items: center; box-shadow: 0 -6px 20px rgba(8, 63, 72, .1); }
  .sojakuz9 { font-family: var(--ty-head); font-weight: 800; font-size: 1.2rem; }
  .doke0 { flex: 1; max-inline-size: 300px; margin-inline-start: auto; }
  .torizo9 { padding-block-end: 90px; }
}

@media (max-width: 560px) {
  body { font-size: 16px; }
  .gepukac6 { font-size: .74rem; }
  .ruca5 { inline-size: 165px; }
  .zuhexe8 { grid-template-columns: 1fr; }
  .getem2 { grid-template-columns: 1fr 1fr 1fr; gap: 8px; font-size: .75rem; }
  .suqomok5, .jihodi4, .localoz6, .refoka3 { grid-template-columns: 1fr; }
  .hibasi3, .xovo6 { grid-template-columns: 1fr; }
  .xovo6 img { max-inline-size: 160px; }
  .hibasi3 img { max-inline-size: 140px; }
  .juxabox7 { flex-direction: column; text-align: center; }
  .gavaxeh1 img { aspect-ratio: 3 / 1; }
}