
.gs-grid{--cols:4;--gap:24px;display:flex;flex-wrap:wrap;justify-content:center;gap:var(--gap)}
.gs-grid > *{flex:0 1 calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols));min-width:0}
@media (max-width:1100px){.gs-grid > *{flex-basis:calc((100% - 2 * var(--gap)) / 3)}}
@media (max-width:760px){.gs-grid > *{flex-basis:calc((100% - var(--gap)) / 2)}}
@media (max-width:460px){.gs-grid > *{flex-basis:100%}}
/* even — ровные ряды: карточки одной высоты, неполный последний ряд
   центрируется базовым justify-content. Правило существует и потому, что
   класс без единого правила в CSS означает потерянный при порте стиль, и
   общий свод справедливо на это краснеет. */
.gs-grid.even{align-items:stretch}
.gs-grid.even > *{flex-grow:0}
.gs-grid.rail{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;scroll-snap-type:x mandatory}
.gs-grid.rail > *{scroll-snap-align:start;flex:0 0 260px}
[hidden]{display:none!important}

.gs-tscroll{overflow-x:auto;max-width:100%;min-width:0}
table.gs-t{width:100%;border-collapse:collapse;min-width:560px}
table.gs-t td.num{text-align:right;font-variant-numeric:tabular-nums}
@media (max-width:640px){
 table.gs-t{min-width:0}
 table.gs-t thead{position:absolute;left:-9999px}
 table.gs-t tr{display:block;margin-bottom:12px}
 table.gs-t td{display:flex;justify-content:space-between;gap:12px}
 table.gs-t td::before{content:attr(data-label);font-weight:600}
}

.gs-crumbs ol{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.gs-pager{display:flex;gap:8px;flex-wrap:wrap}
.gs-filters{display:flex;gap:8px;flex-wrap:wrap}
.gs-chip[aria-pressed="true"]{font-weight:600}
.gs-field{display:flex;flex-direction:column;gap:6px}
.gs-zoom{border:0;padding:0;max-width:96vw;max-height:96vh}
.gs-zoom img{display:block;max-width:96vw;max-height:96vh;height:auto}
.gs-gal{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}
.gs-gal > *{flex:0 1 calc((100% - 32px) / 3);min-width:0}
@media (max-width:700px){.gs-gal > *{flex-basis:100%}}
.gs-shot-link{position:relative;display:block}
.gs-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;min-width:0}
.gs-card{display:flex;flex-direction:column;min-width:0}


@font-face{font-family:"Anton";src:url(/assets/fonts/anton-latin.d0fa07ff.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Rubik";src:url(/assets/fonts/rubik-latin.691cd1d9.woff2) format("woff2");font-weight:400 700;font-style:normal;font-display:swap}

:root{
 --ink:#141217;
 --inkSoft:#4A454F;
 --inkFaint:#5E5865;
 --paper:#FFFFFF;
 --paper2:#F4F4F7;
 --paper3:#E7E7ED;
 --band:#141217;
 --bandSoft:#C9C6CE;
 --bandFaint:#9C97A3;
 --brand:#FB7922;
 --brandDeep:#A34400;
 --blue:#024697;
 --blueSoft:#BBD3F2;
 --line:#E2E2E9;
 --lineSoft:#F0F0F4;
 --dsp:"Anton",Impact,"Haettenschweiler","Arial Narrow",sans-serif;
 --txt:"Rubik",system-ui,"Segoe UI",sans-serif;
 --wrap:1320px;
 --gut:clamp(16px,3vw,40px);
 --r:8px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16.5px/1.6 var(--txt)}
img{max-width:100%;height:auto;display:block}
a{color:var(--brandDeep)}
a:hover{color:var(--ink)}
h1,h2,h3,h4{margin:0;line-height:1.05;font-weight:400}
h1,h2{font-family:var(--dsp);text-transform:uppercase;letter-spacing:.005em}
h3,h4{font-family:var(--txt);font-weight:700;line-height:1.25;letter-spacing:-.01em}
h1{font-size:clamp(36px,5.4vw,74px)}
h2{font-size:clamp(28px,3.8vw,52px)}
h3{font-size:clamp(17px,1.4vw,20px)}
p{margin:0 0 1em}
[hidden]{display:none!important}
.gs-wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--gut);padding-right:var(--gut)}
.gs-kicker{font:700 11px/1 var(--txt);letter-spacing:.2em;text-transform:uppercase;color:var(--brandDeep);margin:0 0 12px}
.gs-lede{font-size:clamp(16px,1.15vw,18.5px);color:var(--inkSoft)}
.gs-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.gs-skip{position:absolute;left:-9999px}
.gs-skip:focus{left:8px;top:8px;background:var(--paper);padding:8px 14px;z-index:20}

/* ------------------------------------------------- ЧЁРНАЯ РАМА: шапка */
.gs-head{background:var(--band);color:var(--paper);position:relative;z-index:5}
.gs-headrow{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding:14px 0}
.gs-headrow>span{font:500 11px/1.4 var(--txt);letter-spacing:.14em;text-transform:uppercase;color:var(--bandFaint)}
.gs-headrow>span:last-child{text-align:right}
.gs-headrow a{color:var(--brand);text-decoration:none}
.gs-headrow a:hover{color:var(--paper)}
.gs-word{font-family:var(--dsp);font-size:clamp(20px,2.1vw,30px);letter-spacing:.03em;text-transform:uppercase;
 color:var(--paper);text-decoration:none;white-space:nowrap;display:block;text-align:center;line-height:1}
.gs-word i{font-style:normal;color:var(--brand)}
.gs-navrow{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(10px,1.6vw,24px);
 padding:0 0 12px;border-top:1px solid rgba(255,255,255,.12);padding-top:11px}
.gs-navrow a{font:500 12px/1 var(--txt);letter-spacing:.12em;text-transform:uppercase;
 color:var(--paper);text-decoration:none;padding:6px 0;border-bottom:2px solid transparent}
.gs-navrow a:hover{border-bottom-color:var(--brand)}
.gs-navrow a[aria-current]{border-bottom-color:var(--brand)}
.gs-burger{display:none}
@media (max-width:1000px){
 .gs-headrow{grid-template-columns:1fr;gap:4px;text-align:center;padding:12px 0 8px}
 .gs-headrow>span:last-child{text-align:center}
 .gs-navrow{display:none}
 .gs-burger{display:block;border-top:1px solid rgba(255,255,255,.12)}
 .gs-burger>summary{list-style:none;cursor:pointer;font:700 11.5px/1 var(--txt);letter-spacing:.2em;
  text-transform:uppercase;padding:13px var(--gut);display:flex;justify-content:space-between;align-items:center;color:var(--paper)}
 .gs-burger>summary::-webkit-details-marker{display:none}
 .gs-burger>summary::after{content:"+";font-size:18px;color:var(--brand)}
 .gs-burger[open]>summary::after{content:"\u2013"}
 .gs-burger nav{display:flex;flex-direction:column;padding:0 var(--gut) 12px}
 .gs-burger nav a{padding:10px 0;border-bottom:1px solid rgba(255,255,255,.12);text-decoration:none;
  font:500 13px/1 var(--txt);letter-spacing:.1em;text-transform:uppercase;color:var(--paper)}
}

/* --------------------------------------------------------------- крошки */
.gs-crumbs{background:var(--paper2);border-bottom:1px solid var(--line)}
.gs-crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:9px 0;
 font:500 11.5px/1.4 var(--txt);letter-spacing:.08em;text-transform:uppercase;color:var(--inkFaint)}
.gs-crumbs li+li::before{content:"/";margin-right:8px;color:var(--bandFaint)}
.gs-crumbs a{color:var(--inkSoft);text-decoration:none}
.gs-crumbs a:hover{color:var(--brandDeep)}

/* ---------------------------------------------------------------- герой */
/* Полоса образца: КРИЧАЩИЙ ЦВЕТ фоном, товары группой справа. Фотографии
   витрины у этого сайта нет вовсе, поэтому «текстура» здесь — сама заливка
   плюс группа пакшотов, а не чужой кадр. */
.gs-hero{background:var(--brand);color:var(--ink);overflow:hidden}
.gs-hero .gs-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
 gap:clamp(20px,3vw,48px);align-items:center;padding-top:clamp(22px,3vw,44px);padding-bottom:clamp(22px,3vw,44px)}
.gs-hero .gs-kicker{color:var(--ink);opacity:.72}
.gs-hero h1{max-width:11ch}
.gs-hero p{margin:14px 0 0;font-size:clamp(15px,1.1vw,18px);max-width:44ch}
.gs-hero-cta{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 16px}
.gs-hero-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px 16px;max-width:38rem}
.gs-hero-facts b{display:block;font:400 clamp(22px,2.1vw,34px)/1 var(--dsp);color:var(--ink)}
.gs-hero-facts span{display:block;font:500 10px/1.35 var(--txt);letter-spacing:.12em;
 text-transform:uppercase;color:rgba(20,18,23,.72);margin-top:4px}
/* Группа пакшотов: три кадра «веером», как товарная группа у образца. */
.gs-hero-group{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.gs-hero-group img{background:var(--paper);border-radius:var(--r);aspect-ratio:1/1;object-fit:contain;padding:6px}
.gs-hero-group>*:nth-child(2){transform:translateY(-14px)}
@media (max-width:900px){
 .gs-hero .gs-wrap{grid-template-columns:1fr}
 .gs-hero-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
 .gs-hero-group>*:nth-child(2){transform:none}
}

.gs-btn{display:inline-flex;align-items:center;gap:8px;text-decoration:none;border-radius:999px;
 font:700 12.5px/1 var(--txt);letter-spacing:.12em;text-transform:uppercase;padding:14px 22px;border:2px solid var(--ink)}
.gs-btn.solid{background:var(--ink);color:var(--paper)}
.gs-btn.solid:hover{background:var(--paper);color:var(--ink)}
.gs-btn.ghost{background:transparent;color:var(--ink)}
.gs-btn.ghost:hover{background:var(--ink);color:var(--paper)}

/* --------------------------------------------------------------- секции */
.gs-sec{padding:clamp(34px,4.4vw,72px) 0}
.gs-sec.tint{background:var(--paper2)}
.gs-sec.deep{background:var(--paper3)}
.gs-sec.dark{background:var(--band);color:var(--paper)}
.gs-sec.pop{background:var(--blue);color:var(--paper)}
.gs-sec.dark h1,.gs-sec.dark h2,.gs-sec.dark h3,
.gs-sec.pop h1,.gs-sec.pop h2,.gs-sec.pop h3{color:var(--paper)}
.gs-sec.dark p,.gs-sec.dark li{color:var(--bandSoft)}
.gs-sec.pop p,.gs-sec.pop li{color:var(--blueSoft)}
.gs-sec.dark .gs-kicker{color:var(--brand)}
.gs-sec.pop .gs-kicker{color:var(--blueSoft)}
.gs-sec.dark a,.gs-sec.pop a{color:var(--paper)}
/* БЕЛАЯ КАРТОЧКА ВНУТРИ ЦВЕТНОЙ СЕКЦИИ. Правила выше красят весь текст секции
   в белый, и на белой плитке он давал контраст 1:1 — то есть надпись
   пропадала совсем. Поймано браузерным аудитом, по CSS этого не видно. */
.gs-sec.dark .gs-tile,.gs-sec.pop .gs-tile,
.gs-sec.dark .gs-card,.gs-sec.pop .gs-card,
.gs-sec.dark .gs-nav2 a,.gs-sec.pop .gs-nav2 a{color:var(--ink)}
.gs-sec.dark .gs-tile h3,.gs-sec.pop .gs-tile h3,
.gs-sec.dark .gs-card-title,.gs-sec.pop .gs-card-title,
.gs-sec.dark .gs-nav2 b,.gs-sec.pop .gs-nav2 b{color:var(--ink)}
.gs-sec.dark .gs-tile p,.gs-sec.pop .gs-tile p,
.gs-sec.dark .gs-spec,.gs-sec.pop .gs-spec{color:var(--inkSoft)}
.gs-sec.dark .gs-tile .gs-more,.gs-sec.pop .gs-tile .gs-more,
.gs-sec.dark .gs-nav2 span,.gs-sec.pop .gs-nav2 span{color:var(--brandDeep)}
.gs-sechead{margin:0 0 clamp(20px,2.4vw,34px)}
.gs-sechead.row{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap}
.gs-sechead.mid{text-align:center}
.gs-sechead.mid p{margin-left:auto;margin-right:auto;max-width:60ch}
.gs-sechead p{margin:10px 0 0;color:var(--inkSoft);font-size:clamp(15px,1.1vw,17.5px);max-width:70ch}
.gs-sec.dark .gs-sechead p{color:var(--bandSoft)}
.gs-sec.pop .gs-sechead p{color:var(--blueSoft)}
/* nowrap только там, где есть место: на 320px анкор «All Got Too Silly Goose
   t-shirts» выносил страницу за экран на 3px. */
.gs-more{font:700 11.5px/1.3 var(--txt);letter-spacing:.14em;text-transform:uppercase;
 color:var(--brandDeep);text-decoration:none;border-bottom:2px solid var(--brand);padding-bottom:3px;
 white-space:nowrap;max-width:100%;overflow-wrap:break-word}
@media (max-width:560px){.gs-more{white-space:normal}}
.gs-more:hover{color:var(--ink)}
.gs-note{margin:16px 0 0;font-size:13px;color:var(--inkFaint)}
.gs-sec.dark .gs-note,.gs-sec.pop .gs-note{color:var(--bandFaint)}

/* ----------------------------------------------------------- сетка карточек */
/* Флекс, а не grid: неполный последний ряд обязан центрироваться (§5). */
.gs-grid{--gap:clamp(12px,1.5vw,22px);--n:var(--cols,4);
 display:flex;flex-wrap:wrap;justify-content:center;gap:var(--gap)}
.gs-grid>*{flex:0 1 calc((100% - (var(--n) - 1) * var(--gap)) / var(--n));min-width:0}
@media (max-width:1180px){.gs-grid{--n:3}}
@media (max-width:820px){.gs-grid{--n:2}}
/* На телефоне товары идут ПО ДВА в ряд — приём мобильной раскладки образца
   09. Одна карточка в ряд превращает департамент из 24 позиций в простыню на
   двадцать экранов. В одну колонку сетка сваливается только на 359px и уже. */
@media (max-width:359px){.gs-grid{--n:1}}

/* Карточка образца: БЕЛАЯ с мягкой тенью на сером поле, угловой ярлык. */
.gs-card{background:var(--paper);border-radius:var(--r);overflow:hidden;
 box-shadow:0 1px 2px rgba(20,18,23,.06),0 6px 18px rgba(20,18,23,.06);
 display:flex;flex-direction:column;position:relative}
.gs-shot{position:relative;aspect-ratio:1/1;background:var(--paper);flex:0 0 auto;overflow:hidden}
.gs-shot img{width:100%;height:100%;object-fit:contain}
/* Угловой ярлык образца — под ЧЕСТНЫЙ факт: какая это версия шутки. */
.gs-flag{position:absolute;top:10px;left:10px;background:var(--ink);color:var(--paper);
 font:700 9.5px/1 var(--txt);letter-spacing:.12em;text-transform:uppercase;padding:6px 9px;border-radius:4px}
.gs-flag.jail{background:var(--blue)}
.gs-flag.pun{background:var(--brandDeep)}
.gs-flag.meme{background:var(--ink)}
.gs-flag.plain{background:var(--inkSoft)}
.gs-card-body{padding:14px 15px 16px;display:flex;flex-direction:column;gap:7px;flex:1 1 auto}
.gs-sil{font:700 10px/1 var(--txt);letter-spacing:.14em;text-transform:uppercase;color:var(--inkFaint)}
.gs-card-title{font-size:15px;font-weight:700;line-height:1.3;margin:0}
.gs-spec{margin:0;font-size:13px;color:var(--inkSoft);line-height:1.45}
.gs-maker{margin:0;font-size:12px;color:var(--inkFaint)}
.gs-stars{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--inkSoft)}
.gs-stars b{color:var(--ink)}
.gs-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:6px}
.gs-price{font:400 clamp(19px,1.7vw,24px)/1 var(--dsp);color:var(--ink)}
.gs-swatches{display:flex;gap:5px}
.gs-swatches i{width:11px;height:11px;border-radius:50%;display:block;border:1px solid var(--line)}
.gs-act{margin-top:10px}
/* Кнопка образца — во всю ширину карточки. */
.gs-buy{display:flex;align-items:center;justify-content:center;width:100%;cursor:pointer;
 background:var(--ink);color:var(--paper);border:0;border-radius:999px;padding:12px 14px;text-decoration:none}
.gs-buy:hover{background:var(--brandDeep)}
.gs-buy img.buy-label{height:calc(1em * 0.708);width:auto;display:block}

/* ------------------------------------------------------- врезка товара */
.gs-inset{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;align-items:center;
 background:var(--paper2);border-radius:var(--r);padding:14px;margin:22px 0}
.gs-inset.row{grid-template-columns:120px minmax(0,1.2fr) minmax(0,1fr) auto auto;gap:18px}
.gs-inset .gs-shot{border-radius:var(--r)}
.gs-inset h3{font-size:15px;margin:0 0 4px}
.gs-inset p{margin:0;font-size:13.5px;color:var(--inkSoft)}
.gs-inset .gs-price{font-size:22px}
@media (max-width:760px){.gs-inset,.gs-inset.row{grid-template-columns:90px minmax(0,1fr)}
 .gs-inset.row>*:nth-child(n+3){grid-column:2}}

/* ------------------------------------------------ плитки навигации (образец) */
.gs-nav2{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(10px,1.4vw,18px)}
.gs-nav2.five{--n:5}
.gs-nav2.four{--n:4}
.gs-nav2>*{flex:0 1 calc((100% - (var(--n,4) - 1) * clamp(10px,1.4vw,18px)) / var(--n,4));min-width:0}
@media (max-width:1100px){.gs-nav2,.gs-nav2.five,.gs-nav2.four{--n:3}}
@media (max-width:820px){.gs-nav2,.gs-nav2.five,.gs-nav2.four{--n:2}}
@media (max-width:430px){.gs-nav2,.gs-nav2.five,.gs-nav2.four{--n:1}}
.gs-nav2 a{display:block;background:var(--paper);border-radius:var(--r);overflow:hidden;
 text-decoration:none;color:inherit;box-shadow:0 1px 2px rgba(20,18,23,.06),0 6px 18px rgba(20,18,23,.06)}
.gs-nav2 a:hover{transform:translateY(-2px)}
.gs-nav2 img{aspect-ratio:1/1;object-fit:contain;width:100%;background:var(--paper);padding:8px}
.gs-nav2 b{display:block;padding:12px 14px 3px;font:400 clamp(16px,1.5vw,21px)/1.05 var(--dsp);text-transform:uppercase}
.gs-nav2 span{display:block;padding:0 14px 14px;font:500 11px/1.4 var(--txt);letter-spacing:.1em;
 text-transform:uppercase;color:var(--brandDeep)}
.gs-nav2 a:hover b{color:var(--brandDeep)}
/* Плитка версии шутки — цветная плашка вместо кадра. */
.gs-nav2 .gs-vtile{padding:18px 16px 16px;display:block;height:100%}
.gs-nav2 .gs-vtile em{display:block;font-style:normal;font:400 clamp(30px,3vw,44px)/1 var(--dsp);color:var(--brandDeep)}

/* --------------------------------------------------------------- фильтры */
/* Несколько ОСЕЙ сразу: версия, цвет, размер, кому. Карточка показывается,
   только если подошла по КАЖДОЙ включённой оси. */
/* display:block ЯВНО: базовый CSS библиотеки делает класс -filters флексом,
   и четыре оси вставали в две строки по две вместо четырёх строк по одной.
   Замерено в браузере, а не угадано: у «Size» и «Cut for» совпадал top. */
.gs-filters{display:block;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
 padding:14px 16px;margin:0 0 clamp(18px,2vw,26px)}
.gs-fgroup{display:flex;width:100%;flex-wrap:wrap;align-items:center;gap:7px;padding:6px 0}
.gs-fgroup+.gs-fgroup{border-top:1px solid var(--lineSoft)}
.gs-fgroup>b{font:700 10.5px/1 var(--txt);letter-spacing:.14em;text-transform:uppercase;
 color:var(--inkFaint);min-width:5.5rem}
.gs-filters button{font:600 12px/1 var(--txt);letter-spacing:.04em;
 background:var(--paper2);border:1px solid var(--line);border-radius:999px;padding:8px 13px;cursor:pointer;color:var(--ink)}
.gs-filters button:hover{border-color:var(--ink)}
.gs-filters button[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.gs-empty{margin:18px 0 0;font-size:14.5px;color:var(--inkSoft)}

/* --------------------------------------------------------------- таблицы */
.gs-tw{overflow-x:auto;background:var(--paper);border-radius:var(--r);border:1px solid var(--line)}
.gs-t{border-collapse:collapse;width:100%;min-width:560px;font-size:14.5px}
.gs-t caption{caption-side:top;text-align:left;padding:13px 16px;font-size:13px;color:var(--inkFaint);border-bottom:1px solid var(--line)}
.gs-t th{text-align:left;font:700 10.5px/1.3 var(--txt);letter-spacing:.13em;text-transform:uppercase;
 color:var(--inkFaint);padding:12px 16px;border-bottom:1px solid var(--line)}
.gs-t td{padding:12px 16px;border-bottom:1px solid var(--lineSoft);vertical-align:top}
.gs-t tr:last-child td{border-bottom:0}
.gs-t td.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.gs-t tbody tr:nth-child(2n){background:var(--paper2)}

/* --------------------------------------------------------------- колонки */
.gs-cols{columns:2;column-gap:clamp(26px,3vw,52px)}
.gs-cols>*{break-inside:avoid}
.gs-cols h3{margin:18px 0 8px}
.gs-cols>*:first-child{margin-top:0}
@media (max-width:880px){.gs-cols{columns:1}}
.gs-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,3vw,46px);align-items:start}
.gs-split.wide-left{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
@media (max-width:1000px){.gs-split,.gs-split.wide-left{grid-template-columns:1fr}}
.gs-numbers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,2vw,28px)}
.gs-num b{display:block;font:400 clamp(30px,3.2vw,48px)/1 var(--dsp);color:var(--brandDeep)}
.gs-sec.dark .gs-num b,.gs-sec.pop .gs-num b{color:var(--brand)}
.gs-num span{display:block;margin-top:6px;font:700 10px/1.4 var(--txt);letter-spacing:.15em;
 text-transform:uppercase;color:var(--inkFaint)}
.gs-sec.dark .gs-num span,.gs-sec.pop .gs-num span{color:var(--bandFaint)}
@media (max-width:820px){.gs-numbers{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:430px){.gs-numbers{grid-template-columns:1fr}}
.gs-stack li{margin-bottom:.7em}

/* ---------------------------------------------------------------- плитки */
.gs-tiles{--gap:clamp(14px,1.6vw,24px);--n:3;
 display:flex;flex-wrap:wrap;justify-content:center;gap:var(--gap)}
.gs-tiles>*{flex:0 1 calc((100% - (var(--n) - 1) * var(--gap)) / var(--n));min-width:0}
.gs-tiles.four{--n:4}
.gs-tiles.two{--n:2}
@media (max-width:1180px){.gs-tiles.four{--n:3}}
@media (max-width:820px){.gs-tiles,.gs-tiles.four{--n:2}}
@media (max-width:430px){.gs-tiles,.gs-tiles.four,.gs-tiles.two{--n:1}}
.gs-tile{display:block;background:var(--paper);border-radius:var(--r);overflow:hidden;text-decoration:none;color:inherit;
 box-shadow:0 1px 2px rgba(20,18,23,.06),0 6px 18px rgba(20,18,23,.06)}
.gs-tile img{aspect-ratio:16/9;object-fit:contain;background:var(--paper2);width:100%;padding:10px}
.gs-tile-body{padding:15px 16px 18px}
.gs-tile-body h3{margin:0 0 6px}
.gs-tile-body p{margin:0 0 10px;font-size:14px;color:var(--inkSoft)}

/* ---------------------------------------------------------------- статья */
.gs-art{max-width:none}
.gs-meta{font:700 11px/1 var(--txt);letter-spacing:.16em;text-transform:uppercase;color:var(--inkFaint);margin:0 0 14px}
.gs-art-hero{overflow:hidden;border-radius:var(--r);margin:0 0 clamp(20px,2.6vw,32px);background:var(--paper2)}
.gs-art-hero img{width:100%;aspect-ratio:21/9;object-fit:contain;padding:14px}
.gs-artbody{columns:2;column-gap:clamp(28px,3.2vw,54px)}
.gs-artbody>*{break-inside:avoid}
.gs-artbody h2{margin:24px 0 12px;font-size:clamp(22px,2.2vw,30px)}
.gs-artbody h3{margin:18px 0 8px}
.gs-artbody ul,.gs-artbody ol{margin:0 0 1em;padding-left:1.2em}
.gs-artbody li{margin-bottom:.5em}
@media (max-width:880px){.gs-artbody{columns:1}}
.gs-toc{background:var(--paper2);border-left:4px solid var(--brand);padding:18px 22px;border-radius:var(--r)}
.gs-toc.span{column-span:all;margin-bottom:26px}
.gs-toc h2{margin:0 0 10px;font-size:12px;font-family:var(--txt);font-weight:700;letter-spacing:.16em}
.gs-toc ol{margin:0;padding-left:1.2em;font-size:14.5px}
.gs-toc li{margin-bottom:5px}
.gs-artbody>.gs-tw,.gs-artbody>.gs-inset{column-span:all;break-inside:avoid;margin:22px 0}
.gs-quote{margin:18px 0;background:var(--paper2);border-left:4px solid var(--blue);padding:16px 20px;border-radius:var(--r)}
.gs-quote p{margin:0;font-size:15.5px}
.gs-cite p{font-style:italic}
.gs-quote footer{margin-top:9px;font-size:12.5px;color:var(--inkFaint)}
.gs-fig{margin:0}
.gs-fig img{width:100%;border-radius:var(--r);background:var(--paper2)}
.gs-fig figcaption{font:400 13px/1.5 var(--txt);color:var(--inkFaint);padding:9px 2px 0}
/* Кадр рядом с колонкой текста ОГРАНИЧЕН ПО ВЫСОТЕ. Пакшот квадратный, и в
   половине полосы он вырастает до 570px против 110px текста: под абзацами
   висит полполосы пустоты. Поймано глазами на кадре главной. */
.gs-fig.cap img{max-height:min(44vh,400px);width:auto;max-width:100%;margin:0 auto;object-fit:contain}

/* ------------------------------------------------------------------- FAQ */
.gs-faq{border-top:2px solid var(--ink)}
.gs-faq-item{border-bottom:1px solid var(--line)}
.gs-faq-item>summary{list-style:none;cursor:pointer;padding:16px 0;font-family:var(--txt);
 font-weight:600;font-size:clamp(15.5px,1.3vw,17.5px);display:flex;justify-content:space-between;align-items:center;gap:18px}
.gs-faq-item>summary::-webkit-details-marker{display:none}
.gs-faq-item>summary::after{content:"+";font-size:20px;color:var(--brandDeep)}
.gs-faq-item[open]>summary::after{content:"\u2013"}
.gs-faq-item p{margin:0 0 16px;color:var(--inkSoft);max-width:80ch}

/* -------------------------------------------------------------- пагинация */
.gs-pager{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:clamp(22px,2.6vw,34px)}
.gs-pager a,.gs-pager span{min-width:38px;text-align:center;padding:9px 10px;border-radius:999px;
 font:600 13px/1 var(--txt);text-decoration:none;color:var(--ink);border:1px solid var(--line)}
.gs-pager a:hover{border-color:var(--ink)}
.gs-pager [aria-current]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.gs-pager .gap{border:0}

/* --------------------------------------------------- ЧЁРНАЯ РАМА: подвал */
/* Две зоны разного цвета, как у образца: цветная полоса и белый блок с
   колонками. Соцсети, бейджи приложений и аккаунт не переносим. */
.gs-foot{background:var(--paper)}
.gs-footpop{background:var(--blue);color:var(--paper);padding:clamp(22px,2.6vw,34px) 0}
.gs-footpop .gs-wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.gs-footpop b{font:400 clamp(22px,2.4vw,34px)/1 var(--dsp);text-transform:uppercase}
.gs-footpop p{margin:6px 0 0;color:var(--blueSoft);font-size:14.5px;max-width:52ch}
.gs-fgrid{display:grid;grid-template-columns:1.4fr repeat(4,minmax(0,1fr));gap:clamp(18px,2.4vw,40px);
 padding:clamp(30px,3.4vw,52px) 0 clamp(22px,2.4vw,34px)}
.gs-fgrid h4{font-size:16px;margin:0 0 12px}
.gs-fgrid a{display:block;padding:5px 0;font-size:14px;color:var(--inkSoft);text-decoration:none}
.gs-fgrid a:hover{color:var(--brandDeep)}
.gs-fgrid p{font-size:14px;color:var(--inkSoft)}
.gs-fgrid .gs-word{color:var(--ink);text-align:left;font-size:clamp(24px,2.4vw,34px)}
@media (max-width:1000px){.gs-fgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.gs-fgrid{grid-template-columns:1fr}}
.gs-fbottom{border-top:1px solid var(--line);padding:16px 0 26px;display:flex;flex-wrap:wrap;
 justify-content:space-between;gap:10px}
.gs-fbottom p{margin:0;font-size:12.5px;color:var(--inkFaint)}

/* ------------------------------------------------------------------ zoom */
.gs-zoom{border:0;padding:0;background:transparent;max-width:92vw;max-height:92vh}
.gs-zoom::backdrop{background:rgba(20,18,23,.82)}
.gs-zoom img{max-width:92vw;max-height:92vh;width:auto;height:auto;border-radius:var(--r);background:var(--paper)}
