@font-face{font-family:'Chakra Petch';src:url(/fonts/chakra-petch-700.woff2) format('woff2');
font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Jakarta';src:url(/fonts/plus-jakarta-sans-400-800.woff2) format('woff2');
font-weight:400 800;font-style:normal;font-display:swap}
:root{
--fb-magenta:#c90e89; /* доминанта баннера, 6.2% пикселей */
--fb-magenta-d:#ae0d67; /* тот же тон темнее — им можно писать текстом по светлому */
--fb-purple:#6849ae;
--fb-red:#bc0512;
--fb-blue:#0e385e;
--fb-teal:#068578;
--fb-gold:#c2a642;
--fb-ink:#14101a;
--fb-ink-2:#46404f;
--fb-ink-3:#6d6577;
--fb-paper:#fbf8fb;
--fb-panel:#f3eef5;
--fb-line:#e2dce6;
--fb-glow:#ff8fd4; /* маджента для тёмного фона: по чернилам 7.4:1 */
--fb-cut:18px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fb-paper);color:var(--fb-ink);
font-family:Jakarta,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
font-size:17px;line-height:1.65;font-weight:400}
img{max-width:100%;height:auto;display:block}
a{color:var(--fb-magenta-d)}
a:hover{color:var(--fb-ink)}
h1,h2,h3,h4{font-family:'Chakra Petch',Impact,system-ui,sans-serif;font-weight:700;
line-height:1.08;letter-spacing:.01em;margin:0 0 .5em}
h1{font-size:clamp(30px,5.2vw,52px)}
h2{font-size:clamp(24px,3.6vw,36px)}
h3{font-size:clamp(19px,2.2vw,23px)}
h4{font-size:17px}
.fb-wrap{max-width:1180px;margin:0 auto;padding-left:20px;padding-right:20px}
.fb-skip{position:absolute;left:-9999px}
.fb-skip:focus{left:12px;top:12px;z-index:99;background:var(--fb-ink);color:#fff;
padding:10px 16px;border-radius:2px}
:focus-visible{outline:3px solid var(--fb-magenta);outline-offset:2px}
/* ——— шапка ——— */
.fb-top{background:#fff;border-bottom:3px solid var(--fb-ink)}
.fb-top-in{display:flex;align-items:center;gap:18px;flex-wrap:wrap;
padding-top:14px;padding-bottom:14px}
.fb-brand{margin:0;line-height:0;flex:0 0 auto}
.fb-mark{width:186px;height:auto}
.fb-nav{margin-left:auto}
.fb-nav ul{display:flex;flex-wrap:wrap;gap:4px;list-style:none;margin:0;padding:0}
.fb-nav a{display:block;padding:7px 13px;text-decoration:none;color:var(--fb-ink);
font-weight:700;font-size:14.5px;letter-spacing:.02em;
clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%)}
.fb-nav a:hover{background:var(--fb-panel)}
.fb-nav a[aria-current=page]{background:var(--fb-magenta);color:#fff}
/* ——— герой ——— */
.fb-hero{background:var(--fb-ink);color:#fff;overflow:hidden}
.fb-hero-in{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center;
padding-top:46px;padding-bottom:46px}
.fb-hero h1{color:#fff;margin-bottom:14px}
.fb-hero h1 em{font-style:normal;color:var(--fb-glow)}
.fb-hero p{color:#d9d2de;font-size:18.5px;margin:0 0 22px;max-width:34em}
.fb-hero-band{margin:0 0 20px;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.fb-hero-band li{font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
background:rgba(255,255,255,.1);color:#fff;padding:6px 12px;
clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,0 100%)}
/* Герой — не один кадр во всю колонку: у костюмов с капюшоном пропорция 0.38,
и снимок шириной в полколонки вырос бы на полтора экрана. Вместо этого три
расцветки в ряд, привязанные по высоте.
Ограничение по высоте само по себе не спасает: три кадра по 430px в высоту
дают в сумме больше 500px в ширину и на телефоне вылезают за экран, поэтому
рядом с max-height обязателен max-width в треть строки. */
.fb-hero-shot{display:flex;gap:12px;justify-content:center;align-items:flex-end}
.fb-hero-shot img{width:auto;height:auto;max-height:430px;max-width:calc(33.333% - 8px);
clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%)}
/* ——— секции ——— */
.fb-sec{padding-top:52px;padding-bottom:52px}
.fb-sec--panel{background:var(--fb-panel)}
.fb-sec--ink{background:var(--fb-ink);color:#fff}
.fb-sec--ink h2,.fb-sec--ink h3{color:#fff}
.fb-sec--ink p{color:#d9d2de}
.fb-sec--ink a{color:var(--fb-glow)}
.fb-lead{font-size:19px;color:var(--fb-ink-2);max-width:46em;margin:0 0 26px}
.fb-sec--ink .fb-lead{color:#d9d2de}
.fb-eyebrow{font-family:'Chakra Petch',sans-serif;font-weight:700;font-size:13px;
letter-spacing:.16em;text-transform:uppercase;color:var(--fb-magenta-d);margin:0 0 8px}
.fb-sec--ink .fb-eyebrow{color:var(--fb-glow)}
/* ——— карточки товаров ——— */
.fb-grid{display:grid;gap:22px;grid-template-columns:repeat(auto-fill,minmax(248px,1fr));
list-style:none;margin:0;padding:0}
.fb-card{background:#fff;border:2px solid var(--fb-ink);display:flex;flex-direction:column;
clip-path:polygon(0 0,calc(100% - var(--fb-cut)) 0,100% var(--fb-cut),100% 100%,0 100%)}
.fb-card-ph{background:var(--fb-panel);height:268px;display:flex;align-items:center;
justify-content:center;padding:10px}
.fb-card-ph a,.fb-card-ph picture{display:flex;align-items:center;justify-content:center;
height:100%;width:100%}
.fb-card-ph img{max-height:100%;width:auto;object-fit:contain}
.fb-card-body{padding:15px 16px 17px;display:flex;flex-direction:column;flex:1}
.fb-card-h{font-family:'Chakra Petch',sans-serif;font-weight:700;font-size:17.5px;
line-height:1.18;margin:0 0 8px}
.fb-card-h a{color:var(--fb-ink);text-decoration:none}
.fb-card-h a:hover{color:var(--fb-magenta-d);text-decoration:underline}
.fb-card-meta{margin-top:auto;padding-top:12px}
.fb-rate{font-size:14px;color:var(--fb-ink-2);margin:0 0 8px}
.fb-rate b{color:var(--fb-ink)}
.fb-rate--none{color:var(--fb-ink-3)}
.fb-stars{color:var(--fb-gold);letter-spacing:.06em}
.fb-price{font-family:'Chakra Petch',sans-serif;font-weight:700;font-size:26px;
line-height:1;margin:0 0 12px}
.fb-price s{font-family:Jakarta,sans-serif;font-size:15px;font-weight:400;
color:var(--fb-ink-3);margin-left:8px}
.fb-swatch{display:flex;flex-wrap:wrap;gap:4px;margin:0 0 12px;padding:0;list-style:none}
.fb-swatch li{width:15px;height:15px;border:1px solid rgba(0,0,0,.22)}
/* Хвостик «ещё N» — тоже li, поэтому квадрат с него надо снять по имени класса,
иначе цифра сидит в рамке 15×15 и обрезается. */
.fb-swatch li.fb-swatch-more{width:auto;height:auto;border:0;
font-size:12.5px;color:var(--fb-ink-3);align-self:center;padding-left:3px}
.fb-swatch--big{gap:7px;margin:22px 0 0}
.fb-swatch--big li{width:34px;height:34px;
clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%)}
.fb-card-sub{font-size:14px;line-height:1.45;color:var(--fb-ink-2);margin:0 0 10px}
/* ——— кнопки ——— */
.fb-btn{display:inline-block;font-family:'Chakra Petch',sans-serif;font-weight:700;
font-size:15.5px;letter-spacing:.03em;padding:11px 20px;text-decoration:none;cursor:pointer;
border:0;text-align:center;
clip-path:polygon(0 0,calc(100% - 11px) 0,100% 11px,100% 100%,0 100%)}
.fb-btn--buy{background:var(--fb-magenta);color:#fff;width:100%}
.fb-btn--buy:hover{background:var(--fb-magenta-d);color:#fff}
.fb-btn--ghost{background:transparent;color:var(--fb-ink);border:2px solid var(--fb-ink);
clip-path:none}
.fb-btn--ghost:hover{background:var(--fb-ink);color:#fff}
.fb-btn-row{display:flex;gap:9px;align-items:stretch}
.fb-btn-row .fb-btn--buy{flex:1}
.fb-btn-row .fb-btn--ghost{flex:0 0 auto;padding:11px 15px;font-size:14.5px}
.fb-partner{font-size:12.5px;color:var(--fb-ink-3);margin:8px 0 0;line-height:1.45}
/* ——— плитки разделов ——— */
.fb-cats{display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
list-style:none;margin:0;padding:0}
.fb-cat{background:#fff;border:2px solid var(--fb-ink);padding:22px 22px 24px;
clip-path:polygon(0 0,calc(100% - var(--fb-cut)) 0,100% var(--fb-cut),100% 100%,0 100%)}
.fb-cat h3{margin-bottom:6px}
.fb-cat h3 a{color:var(--fb-ink);text-decoration:none}
.fb-cat h3 a:hover{color:var(--fb-magenta-d);text-decoration:underline}
.fb-cat p{margin:0 0 12px;color:var(--fb-ink-2);font-size:15.5px}
.fb-cat-n{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
color:var(--fb-magenta-d)}
/* ——— полоса цифр ——— */
.fb-nums{display:grid;gap:2px;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
list-style:none;margin:0;padding:0;background:rgba(255,255,255,.14)}
.fb-nums li{background:var(--fb-ink);padding:20px 18px}
.fb-nums b{display:block;font-family:'Chakra Petch',sans-serif;font-size:34px;line-height:1;
color:var(--fb-glow);margin-bottom:6px}
.fb-nums span{font-size:14px;color:#d9d2de;line-height:1.4;display:block}
/* ——— стена цветов ——— */
.fb-wall{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));
list-style:none;margin:0;padding:0}
.fb-wall li{background:#fff;border:2px solid var(--fb-ink);
clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}
.fb-wall-ph{background:var(--fb-panel);height:170px;display:flex;align-items:center;
justify-content:center;padding:6px}
.fb-wall-ph img{max-height:100%;width:auto;object-fit:contain}
.fb-wall-n{display:block;font-size:13.5px;font-weight:700;padding:8px 9px 4px;line-height:1.25}
.fb-wall-c{display:block;font-size:12px;color:var(--fb-ink-3);padding:0 9px 9px}
/* ——— таблицы ——— */
.fb-table-w{overflow-x:auto;margin:0 0 22px}
table.fb-table{border-collapse:collapse;width:100%;font-size:15.5px;background:#fff}
.fb-table th,.fb-table td{border:1px solid var(--fb-line);padding:9px 12px;text-align:left}
.fb-table th{background:var(--fb-ink);color:#fff;font-family:'Chakra Petch',sans-serif;
font-weight:700;font-size:14px;letter-spacing:.03em}
.fb-table tbody tr:nth-child(even){background:var(--fb-panel)}
.fb-table caption{caption-side:bottom;text-align:left;font-size:13.5px;color:var(--fb-ink-3);
padding-top:8px}
/* ——— подборщик размера ——— */
.fb-tool{background:#fff;border:2px solid var(--fb-ink);padding:22px;
clip-path:polygon(0 0,calc(100% - var(--fb-cut)) 0,100% var(--fb-cut),100% 100%,0 100%)}
.fb-tool-row{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-end;margin-bottom:18px}
.fb-field{display:flex;flex-direction:column;gap:5px}
.fb-field label{font-size:13px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
color:var(--fb-ink-2)}
.fb-field input,.fb-field select{font:inherit;font-size:16px;padding:9px 11px;
border:2px solid var(--fb-ink);background:#fff;color:var(--fb-ink);min-width:120px}
.fb-out{background:var(--fb-panel);border-left:6px solid var(--fb-magenta);padding:16px 18px}
.fb-out b{font-family:'Chakra Petch',sans-serif;font-size:22px;display:block;margin-bottom:4px}
.fb-out p{margin:0;font-size:15.5px;color:var(--fb-ink-2)}
/* ——— PDP ——— */
.fb-pdp{display:grid;grid-template-columns:minmax(0,44%) minmax(0,56%);gap:34px;
align-items:start;padding-top:36px;padding-bottom:8px}
.fb-pdp-ph{background:var(--fb-panel);border:2px solid var(--fb-ink);padding:14px;
display:flex;align-items:center;justify-content:center;
clip-path:polygon(0 0,calc(100% - var(--fb-cut)) 0,100% var(--fb-cut),100% 100%,0 100%)}
.fb-pdp-ph img{max-height:640px;width:auto;object-fit:contain}
.fb-buy{background:#fff;border:2px solid var(--fb-ink);padding:18px 20px;margin:18px 0 0;
clip-path:polygon(0 0,calc(100% - var(--fb-cut)) 0,100% var(--fb-cut),100% 100%,0 100%)}
.fb-buy .fb-price{font-size:34px;margin-bottom:6px}
.fb-crumb{font-size:13.5px;color:var(--fb-ink-3);padding-top:16px}
.fb-crumb a{color:var(--fb-ink-2)}
.fb-crumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:7px;margin:0;padding:0}
.fb-crumb li+li:before{content:"/";margin-right:7px;color:var(--fb-line)}
.fb-dl{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;margin:0 0 20px;font-size:15.5px}
.fb-dl dt{font-weight:700;color:var(--fb-ink-2)}
.fb-dl dd{margin:0}
.fb-scarce{display:inline-block;font-size:12.5px;font-weight:700;letter-spacing:.05em;
text-transform:uppercase;background:var(--fb-red);color:#fff;padding:4px 10px;margin-bottom:10px;
clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,0 100%)}
.fb-pool{font-size:13px;color:var(--fb-ink-3);margin:6px 0 0;line-height:1.45}
/* ——— проза ——— */
.fb-prose{max-width:44em}
.fb-prose p{margin:0 0 1.05em}
.fb-prose h2{margin-top:1.5em}
.fb-prose h3{margin-top:1.4em}
.fb-prose ul,.fb-prose ol{margin:0 0 1.05em;padding-left:1.3em}
.fb-prose li{margin-bottom:.35em}
.fb-drop:first-letter{float:left;font-family:'Chakra Petch',sans-serif;font-size:3.2em;
line-height:.82;padding:.06em .1em 0 0;color:var(--fb-magenta)}
/* ——— заметки-рельса ——— */
.fb-notes{list-style:none;margin:0 0 22px;padding:0;border-left:4px solid var(--fb-magenta)}
.fb-notes li{padding:10px 0 10px 18px;border-bottom:1px solid var(--fb-line)}
.fb-notes li:last-child{border-bottom:0}
.fb-notes b{display:block;font-family:'Chakra Petch',sans-serif;font-size:16px}
.fb-notes span{font-size:15.5px;color:var(--fb-ink-2)}
/* ——— отзывы ——— */
.fb-revs{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));
list-style:none;margin:0;padding:0}
.fb-rev{background:#fff;border:2px solid var(--fb-ink);padding:16px 18px;
clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%)}
.fb-rev-h{font-family:'Chakra Petch',sans-serif;font-weight:700;font-size:16px;margin:6px 0 6px}
.fb-rev p{margin:0;font-size:15px;color:var(--fb-ink-2)}
.fb-rev-w{font-size:12.5px;color:var(--fb-ink-3);margin:9px 0 0}
/* ——— подвал ——— */
.fb-foot{background:var(--fb-ink);color:#d9d2de;padding:40px 0 34px;margin-top:56px}
.fb-foot-mark{width:158px;height:auto;margin-bottom:18px}
.fb-foot-nav ul{display:flex;flex-wrap:wrap;gap:6px 20px;list-style:none;margin:0 0 18px;padding:0}
.fb-foot-nav a{color:#fff;font-weight:700;font-size:14.5px;text-decoration:none}
.fb-foot-nav a:hover{color:var(--fb-glow);text-decoration:underline}
.fb-foot-note{font-size:14px;max-width:60em;margin:0 0 10px;line-height:1.55}
.fb-copy{font-size:13px;color:#8d8595;margin:16px 0 0}
/* ——— адрес ———
Строки адреса — span'ы, а не
: перенос тут структурный, а не декоративный.
Оговорку «не магазин, не склад» выделяет НАЧЕРТАНИЕ, а не цвет: по чернилам
подвала любой шаг темнее #d9d2de валит контраст, а маджента там 2.9:1. */
.fb-addr{font-style:normal;display:flex;flex-direction:column;gap:1px;
font-size:14px;line-height:1.5;margin:0}
.fb-addr span{display:block}
.fb-addr-n{font-weight:800;margin-bottom:3px}
/* Ярлык адреса: адресов два, и без подписи «US mail» / «Registered office» они
слипаются в одну кашу из шести строк. Ярлык блочный —
рядом не нужен. */
.fb-addr-lbl{margin-top:9px;font-size:11px;font-weight:800;letter-spacing:.09em;
text-transform:uppercase}
.fb-addr-n + .fb-addr-lbl{margin-top:4px}
.fb-addr-mail{margin-top:7px;word-break:break-word}
.fb-addr-note{margin-top:7px;font-weight:700;font-size:13px}
.fb-addr--foot{margin:18px 0 0;padding-top:16px;border-top:1px solid #37303f;color:#c4bccb}
.fb-addr--foot .fb-addr-n{color:#fff}
/* Ярлыки на тёмном осветляем, а не притемняем: белый по чернилам подвала безопасен,
любой шаг в сторону мадженты валит контраст на 11px. */
.fb-addr--foot .fb-addr-lbl{color:#fff}
/* Ссылка в подвале унаследовала бы --fb-magenta-d (#ae0d67) — по чернилам 2.2:1.
На тёмном пишем только --fb-glow, он даёт 7.4:1. */
.fb-addr--foot a{color:var(--fb-glow)}
.fb-sec--panel .fb-addr{border-left:3px solid var(--fb-magenta);padding-left:14px;
color:var(--fb-ink-2)}
.fb-sec--panel .fb-addr-n{color:var(--fb-ink)}
.fb-sec--panel .fb-addr-lbl{color:var(--fb-ink)}
.fb-sec--panel .fb-addr-note{color:var(--fb-ink)}
/* ——— мелкое ——— */
.fb-more{margin:26px 0 0}
.fb-404{padding:70px 0 40px;text-align:center}
@media (max-width:860px){
.fb-hero-in{grid-template-columns:1fr;gap:24px}
.fb-hero-shot{order:-1}
.fb-pdp{grid-template-columns:1fr;gap:22px}
.fb-pdp-ph img{max-height:420px}
}
@media (max-width:640px){
body{font-size:16.5px}
.fb-top-in{gap:10px}
.fb-mark{width:150px}
.fb-nav{margin-left:0;width:100%}
.fb-nav a{padding:6px 10px;font-size:13.5px}
.fb-sec{padding-top:38px;padding-bottom:38px}
.fb-grid{grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:14px}
.fb-card-ph{height:200px}
.fb-card-body{padding:12px 12px 14px}
.fb-card-h{font-size:15.5px}
.fb-price{font-size:22px}
.fb-wall{grid-template-columns:repeat(auto-fill,minmax(102px,1fr));gap:10px}
.fb-wall-ph{height:132px}
.fb-btn-row{flex-wrap:wrap}
.fb-btn-row .fb-btn--ghost{width:100%}
}