@layer base, frame, blocks, pages;
:root{
  --tbl-ink:#423D3C;--tbl-soft:#6E6866;--tbl-mute:#8F8886;--tbl-line:#E3E1E0;--tbl-mist:#F3F4F5;--tbl-fog:#E9ECEE;
  --tbl-rose:#B8796F;--tbl-rose-d:#8B564D;--tbl-sky:#73A3B9;--tbl-sky-d:#4F7F95;--tbl-sage:#739084;--tbl-sand:#D4B796;
  --tbl-paper:#FFFFFF;--tbl-shell:1320px;--tbl-gap:clamp(16px,2.4vw,28px);--tbl-r:4px;
  --tbl-head:"Outfit",system-ui,sans-serif;--tbl-body:"Nunito Sans",system-ui,sans-serif;
}
@layer base{
  *,*::before,*::after{box-sizing:border-box}
  html{-webkit-text-size-adjust:100%}
  body{margin:0;background:var(--tbl-paper);color:var(--tbl-ink);font:400 16px/1.65 var(--tbl-body);overflow-x:hidden}
  img{max-inline-size:100%;block-size:auto;display:block}
  a{color:inherit;text-decoration-color:color-mix(in srgb,currentColor 40%,transparent);text-underline-offset:3px}
  a:hover{color:var(--tbl-rose-d)}
  h1,h2,h3,h4{font-family:var(--tbl-head);font-weight:400;line-height:1.2;margin:0 0 .5em;color:var(--tbl-ink)}
  h1{font-size:clamp(28px,3.4vw,42px)}
  h2{font-size:clamp(24px,2.6vw,34px)}
  h3{font-size:clamp(18px,1.6vw,21px);font-weight:500}
  p{margin:0 0 1em}
  button{font:inherit;color:inherit}
  .wrap{max-inline-size:var(--tbl-shell);margin-inline:auto;padding-inline:var(--tbl-gap)}
  .vh{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  :focus-visible{outline:2px solid var(--tbl-sky-d);outline-offset:3px}
}
@layer frame{
  .notebar{background:var(--tbl-sky);color:#fff;text-align:center;font-size:14px;padding:7px var(--tbl-gap)}
  .chairbar{position:sticky;inset-block-start:0;z-index:30;background:#F7F7F7;border-block-end:1px solid var(--tbl-line)}
  .chairbar__in{display:flex;align-items:center;gap:20px;min-block-size:64px}
  .chairbar__logo img{block-size:26px;inline-size:auto}
  .chairbar__nav{flex:1;display:flex;justify-content:center}
  .chairbar__nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 22px;justify-content:center}
  .chairbar__nav a{text-decoration:none;text-transform:uppercase;font-size:13.5px;font-family:var(--tbl-head);padding:8px 0;display:inline-block}
  .chairbar__nav a[aria-current]{border-block-end:1px solid var(--tbl-ink)}
  .chairbar__buy{flex:none}
  .chairbar__menu{display:none;background:none;border:1px solid var(--tbl-line);padding:8px 10px;cursor:pointer;margin-inline-start:auto}
  .chairbar__menu span{display:block;inline-size:20px;block-size:2px;background:var(--tbl-ink);margin:4px 0}
  .pick{display:inline-block;background:none;border:0;padding:0;line-height:0;cursor:pointer;inline-size:min(300px,100%)}
  .pick img{inline-size:100%}
  .pick:hover{transform:translateY(-1px)}
  .pick--top{inline-size:184px}
  .pick--wide{inline-size:100%}
  .crumbs{font-size:13.5px;color:var(--tbl-mute);padding-block:18px 4px}
  .crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
  .crumbs li+li::before{content:"/";margin-inline-end:6px;color:var(--tbl-line)}
  .crumbs a{display:inline-block;padding:6px 0}
  .tablefoot{display:grid;grid-template-columns:1.5fr 1fr;margin-block-start:72px}
  .tablefoot__main{background:#F4F4F4;padding:56px clamp(20px,4vw,64px) 36px}
  .tablefoot__logo img{block-size:30px;inline-size:auto;margin-block-end:34px}
  .tablefoot__cols{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding-block-end:34px;border-block-end:1px solid var(--tbl-line)}
  .tablefoot__cols h4{font-size:13px;text-transform:uppercase;margin-block-end:12px;color:var(--tbl-soft)}
  .tablefoot__cols ul{list-style:none;margin:0;padding:0}
  .tablefoot__cols a{text-decoration:none;font-size:14.5px;display:inline-block;padding:5px 0}
  .tablefoot__touch{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;padding-block-start:26px;font-size:14.5px}
  .tablefoot__touch strong{font-family:var(--tbl-head);font-weight:400;font-size:22px;display:block;margin-block-end:6px}
  .tablefoot__side{background:var(--tbl-sky);color:#fff;display:flex;flex-direction:column}
  .tablefoot__side img{inline-size:100%;aspect-ratio:16/10;object-fit:cover}
  .tablefoot__side div{padding:28px clamp(20px,3vw,44px) 36px}
  .tablefoot__side h3{color:#fff;font-size:clamp(24px,2.4vw,32px);font-weight:300}
  .tablefoot__side p{font-size:14.5px}
  .tablefoot__bar{grid-column:1/-1;background:var(--tbl-sky-d);color:#fff;font-size:13px;padding:10px var(--tbl-gap);display:flex;flex-wrap:wrap;gap:6px 18px}
  .tablefoot__bar a{color:#fff;text-decoration:none}
  .dock{display:none}
}
@layer blocks{
  /* WeeSprout: полноэкранное фото + белая плашка снизу по центру */
  .opener{position:relative;background:var(--tbl-fog)}
  .opener>img{inline-size:100%;block-size:clamp(420px,52vw,700px);object-fit:cover;object-position:0% 30%}
  .opener__card{position:absolute;inset-inline-start:max(24px,calc((100% - var(--tbl-shell)) / 2 + var(--tbl-gap)));inset-block-end:32px;inline-size:min(560px,calc(100% - 32px));background:#fff;padding:26px 30px 22px;text-align:center}
  .opener__card h1{font-size:clamp(26px,2.8vw,36px);margin-block-end:.35em}
  .opener__card p{color:var(--tbl-soft);margin-block-end:16px}
  .opener__meta{font-size:13.5px;color:var(--tbl-mute);margin-block:10px 0 !important}
  /* Ekobo: строка рейтинга под хиро */
  .ratingline{text-align:center;font-size:14px;padding:10px;border-block-end:1px solid var(--tbl-line)}
  .stars{color:var(--tbl-rose);letter-spacing:1px}
  /* WeeSprout: Our favorites — заголовок с чертой + вкладки-пилюли + сетка */
  .faves{padding-block:64px 24px;text-align:center}
  .faves h2{font-size:22px;text-transform:uppercase;font-weight:400}
  .collect__h{text-align:center;font-size:22px;text-transform:uppercase;font-weight:400}
  .loved__h{font-size:clamp(24px,2.6vw,34px);font-weight:400}
  .promise__h,.bannerclose__h{font-size:clamp(22px,2.2vw,30px);font-weight:400}
  .faves h2::after,.collect__h::after{content:"";display:block;inline-size:34px;block-size:2px;background:var(--tbl-line);margin:14px auto 0}
  .faves__tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 10px;margin-block:26px 34px}
  .faves__tabs label{cursor:pointer;text-transform:uppercase;font-size:13.5px;padding:7px 15px;border-radius:999px;font-family:var(--tbl-head)}
  .faves__tabs input{position:absolute;opacity:0}
  .faves__tabs input:checked+span{background:#EFEFEF}
  .faves__tabs span{padding:7px 15px;border-radius:999px;display:inline-block}
  .bitegrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 18px;text-align:center}
  .bitecard{display:flex;flex-direction:column;gap:6px}
  .bitecard[hidden]{display:none}
  .bitecard__ph{background:#F6F6F6;display:block}
  .bitecard__ph img{inline-size:100%;aspect-ratio:1;object-fit:contain;mix-blend-mode:multiply}
  .bitecard h3{font-family:var(--tbl-head);font-size:16.5px;font-weight:400;margin:10px 0 0;line-height:1.35}
  .bitecard h3 a{text-decoration:none}
  .bitecard__cost{font-size:15px}
  .bitecard__tones{font-size:11.5px;text-transform:uppercase;color:var(--tbl-mute)}
  .bitecard__rate{font-size:13px;color:var(--tbl-mute)}
  .bitecard .pick{margin-block-start:auto;inline-size:100%;padding-block-start:8px}
  /* WeeSprout: Purpose / Trust / Wonder */
  .threeways{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;text-align:center;padding-block:56px;max-inline-size:1000px}
  .threeways svg{inline-size:30px;block-size:30px;stroke:var(--tbl-soft);fill:none;stroke-width:1.3;margin-inline:auto;display:block}
  .threeways h3{text-transform:uppercase;font-size:14px;margin-block:12px 8px}
  .threeways p{font-size:14.5px;color:var(--tbl-soft);margin:0}
  /* Ekobo: Shop collections — плитки с подписью и контурной кнопкой */
  .collect{background:var(--tbl-mist);padding-block:60px}
  .collect__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-block-start:34px}
  .collect__tile{position:relative;display:block;text-decoration:none;color:#fff;overflow:hidden}
  .collect__tile img{inline-size:100%;aspect-ratio:4/4.2;object-fit:cover}
  .collect__tile::after{content:"";position:absolute;inset:0;background:rgba(40,36,35,.28)}
  .collect__tile span{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:12px;font-family:var(--tbl-head);font-size:clamp(17px,1.5vw,21px)}
  .collect__tile em{font-style:normal;font-size:12.5px;text-transform:uppercase;border:1px solid #fff;padding:5px 14px}
  .collect__tile:hover{color:#fff}
  /* Ekobo: история — фото слева, текст справа, строка вкладок */
  .story{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;margin-block:72px 0}
  .story>img{inline-size:100%;block-size:100%;object-fit:cover;min-block-size:380px}
  .story__txt{background:#fff;padding:clamp(24px,4vw,56px)}
  .story__txt h2{font-size:clamp(22px,2vw,28px)}
  .story__tabs{display:flex;flex-wrap:wrap;gap:4px 22px;border-block-end:1px solid var(--tbl-line);margin-block:18px 18px}
  .story__tabs button{background:none;border:0;padding:8px 0;cursor:pointer;font-family:var(--tbl-head);font-size:14px;text-transform:uppercase;color:var(--tbl-mute)}
  .story__tabs button[aria-selected=true]{color:var(--tbl-ink);border-block-end:2px solid var(--tbl-ink)}
  .story__pane[hidden]{display:none}
  /* Moonkie: Our Commitment to Safety — фото + наезжающая карточка */
  .promise{position:relative;display:grid;grid-template-columns:5fr 6fr;align-items:center;margin-block:80px}
  .promise img{inline-size:100%;aspect-ratio:4/3;object-fit:cover}
  .promise__card{background:#F2F0EF;padding:clamp(24px,3.4vw,48px);margin-inline-start:-60px;position:relative}
  .promise__card h2{font-size:clamp(22px,2.2vw,30px)}
  .promise__card ul{padding-inline-start:18px;margin:0 0 1em}
  .promise__card li{margin-block-end:6px}
  /* Bumkins: Loved by Parents — отзывы */
  .loved{padding-block:24px 56px;text-align:center}
  .loved__sub{color:var(--tbl-soft);max-inline-size:640px;margin-inline:auto}
  .loved__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-block-start:28px;text-align:start}
  .note{border:1px solid var(--tbl-sky);padding:22px 22px 18px;display:flex;flex-direction:column;gap:8px}
  .note__t{font-family:var(--tbl-head);font-size:17px;margin:0}
  .note__b{font-size:14.5px;color:var(--tbl-soft);margin:0}
  .note__by{font-size:13px;color:var(--tbl-mute);margin-block-start:auto}
  .note__by a{color:var(--tbl-ink)}
  /* Bumkins: секция с центрированным заголовком и абзацами (SEO) */
  .longread{padding-block:56px;border-block-start:1px solid var(--tbl-line)}
  .longread h2{text-align:center}
  .longread__lede{text-align:center;color:var(--tbl-soft);max-inline-size:760px;margin:0 auto 32px}
  .longread__cols{columns:2 340px;column-gap:48px}
  .longread__cols h3{break-after:avoid;margin-block-start:.6em}
  .longread__cols p{break-inside:avoid-column}
  /* WeeSprout PDP: аккордеоны с тонкими линиями */
  .asks{max-inline-size:900px;margin-inline:auto;padding-block:40px}
  .asks h2{text-align:center}
  .fold{border-block-end:1px solid var(--tbl-line)}
  .fold summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px;padding:16px 0;font-family:var(--tbl-head);font-size:16.5px}
  .fold summary::-webkit-details-marker{display:none}
  .fold summary::after{content:"";inline-size:9px;block-size:9px;border-inline-end:1.5px solid currentColor;border-block-end:1.5px solid currentColor;transform:rotate(45deg);margin-block-start:5px;flex:none}
  .fold[open] summary::after{transform:rotate(-135deg)}
  .fold>div{padding-block-end:16px;color:var(--tbl-soft)}
  /* Ekobo/Moonkie: брендовый баннер-закрытие */
  .bannerclose{position:relative;margin-block-start:40px}
  .bannerclose>img{inline-size:100%;aspect-ratio:2000/880;object-fit:cover}
  .bannerclose__box{position:absolute;inset-block-end:28px;inset-inline-end:28px;background:#fff;padding:20px 24px;max-inline-size:380px}
  .bannerclose__box p{font-size:14.5px;color:var(--tbl-soft)}
}
@layer pages{
  /* WeeSprout: страница коллекции */
  .shelfhead{padding-block:8px 10px}
  .shelfhead p{max-inline-size:780px;color:var(--tbl-soft)}
  .sorter{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;border:1px solid var(--tbl-line);padding:8px 14px;margin-block:18px 26px;font-size:13px;text-transform:uppercase}
  .sorter select{font:inherit;text-transform:none;border:0;background:none;padding:6px 2px;color:var(--tbl-ink)}
  .sorter output{margin-inline-start:auto;text-transform:none;color:var(--tbl-mute)}
  .cattext{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding-block:56px 0}
  .cattext h2{font-size:clamp(21px,2vw,26px)}
  .cattext p{color:var(--tbl-soft)}
  /* WeeSprout PDP */
  .bite{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(20px,4vw,56px);padding-block:10px 40px}
  .bite__stage{background:#F6F6F6}
  .bite__stage img{inline-size:100%;aspect-ratio:1;object-fit:contain;mix-blend-mode:multiply}
  .bite__thumbs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-block-start:10px}
  .bite__thumbs button{border:1px solid var(--tbl-line);background:#F6F6F6;padding:0;cursor:pointer;aspect-ratio:1}
  .bite__thumbs button[aria-pressed=true]{border-color:var(--tbl-ink)}
  .bite__thumbs img{inline-size:100%;aspect-ratio:1;object-fit:cover;mix-blend-mode:multiply}
  .bite__info h1{font-size:clamp(23px,2.3vw,30px);font-weight:400;line-height:1.3}
  .bite__cost{font-size:19px;margin:0}
  .bite__rate{font-size:14px;color:var(--tbl-mute);margin:4px 0 0}
  .bite__perks{list-style:none;padding:14px 0 0;margin:14px 0 0;border-block-start:1px solid var(--tbl-line);font-size:13px;font-style:italic;color:var(--tbl-soft);text-transform:uppercase}
  .bite__perks li{display:flex;gap:8px;align-items:center;padding-block:2px}
  .bite__perks svg{inline-size:14px;block-size:14px;stroke:currentColor;fill:none;stroke-width:1.6}
  .tones{margin-block:18px 6px}
  .tones__lbl{font-size:13px;text-transform:uppercase;margin:0 0 8px}
  .tones__lbl b{font-weight:400;text-transform:none;color:var(--tbl-soft)}
  .tones__row{display:flex;flex-wrap:wrap;gap:8px}
  .tones__row button{inline-size:44px;block-size:44px;border-radius:50%;border:1px solid var(--tbl-line);padding:2px;background:#fff;cursor:pointer;overflow:hidden}
  .tones__row button img{inline-size:100%;block-size:100%;object-fit:cover;border-radius:50%}
  .tones__row button[aria-pressed=true]{border:2px solid var(--tbl-ink)}
  .bite__buy{margin-block:18px 8px}
  .bite__buy .pick{inline-size:min(360px,100%)}
  .bite__small{font-size:13.5px;font-style:italic;color:var(--tbl-mute)}
  .bite__lede{margin-block-start:16px}
  .ourword{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,4vw,56px);align-items:center;padding-block:48px}
  .ourword h2{font-size:15px;text-transform:uppercase}
  .ourword>img{inline-size:100%;aspect-ratio:5/4;object-fit:cover}
  .alsolike{padding-block:30px;text-align:center}
  .alsolike h2{font-size:15px;text-transform:uppercase}
  .alsolike .bitegrid{margin-block-start:24px}
  /* заметки (гайды) */
  .notepage{max-inline-size:820px;margin-inline:auto}
  .notepage h2{margin-block-start:1.4em}
  .notepage table{inline-size:100%;border-collapse:collapse;font-size:14.5px;margin-block:12px 24px}
  .notepage th,.notepage td{border-block-end:1px solid var(--tbl-line);padding:10px 8px;text-align:start;vertical-align:top}
  .notepage th{font-family:var(--tbl-head);font-weight:500}
  .inline-pick{display:grid;grid-template-columns:150px 1fr;gap:18px;align-items:center;border:1px solid var(--tbl-line);padding:16px;margin-block:22px}
  .inline-pick>img{background:#F6F6F6;aspect-ratio:1;object-fit:contain;mix-blend-mode:multiply}
  .inline-pick h3{margin:0 0 4px;font-size:17px}
  .inline-pick p{margin:0 0 8px;font-size:14.5px;color:var(--tbl-soft)}
  .pair{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  .pair .inline-pick{grid-template-columns:110px 1fr}
  /* сервисные */
  .quiet{max-inline-size:860px;margin-inline:auto;padding-block-end:20px}
  .quiet h2{font-size:clamp(20px,1.9vw,25px);margin-block-start:1.3em}
  .quiet dl{display:grid;grid-template-columns:200px 1fr;gap:10px 24px}
  .quiet dt{font-family:var(--tbl-head)}
  .quiet dd{margin:0;color:var(--tbl-soft)}
  .quiet ol li,.quiet ul li{margin-block-end:8px}
  .lost{text-align:center;padding-block:90px}
}
@media (max-width:1080px){
  .chairbar__nav{display:none}
  .chairbar__menu{display:block}
  .chairbar.menu-shown .chairbar__nav{display:block;position:absolute;inset-inline:0;inset-block-start:100%;background:#F7F7F7;border-block-end:1px solid var(--tbl-line);padding:8px var(--tbl-gap) 16px}
  .chairbar.menu-shown .chairbar__nav ul{flex-direction:column;align-items:flex-start;gap:0}
  .chairbar__buy{display:none}
  .dock{display:flex;position:fixed;inset-inline:0;inset-block-end:0;z-index:40;background:var(--tbl-ink);color:#fff;align-items:center;gap:12px;padding:9px 14px calc(9px + env(safe-area-inset-bottom))}
  .dock__t{flex:1;min-inline-size:0;font-size:13px;line-height:1.3}
  .dock__t b{display:block;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .dock .pick{inline-size:176px;flex:none}
  body{padding-block-end:76px}
  .bitegrid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .collect__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  .bitegrid,.loved__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .loved__grid{grid-template-columns:1fr}
  .threeways{grid-template-columns:1fr;gap:26px}
  .story,.promise,.bite,.ourword,.cattext,.tablefoot,.pair{grid-template-columns:1fr}
  .promise__card{margin-inline-start:0;margin-block-start:-40px;margin-inline:14px}
  .opener>img{block-size:330px;object-position:58% 30%}
  .opener__card{position:relative;inset:auto;margin-block-start:-50px;margin-inline:auto;inline-size:calc(100% - 28px);padding:20px 18px}
  .tablefoot__cols{grid-template-columns:1fr 1fr}
  .bannerclose__box{position:relative;inset:auto;max-inline-size:none;margin:-20px 14px 0}
  .quiet dl{grid-template-columns:1fr}
  .inline-pick{grid-template-columns:96px 1fr}
  .bite__thumbs{grid-template-columns:repeat(4,minmax(0,1fr))}
  .notepage table,.notepage tbody,.notepage tr,.notepage td,.notepage th{display:block;inline-size:100%}
  .notepage thead{display:none}
  .notepage tr{border-block-end:1px solid var(--tbl-line);padding-block:8px}
  .notepage td{border:0;padding:3px 0}
  .notepage td[data-k]::before{content:attr(data-k) ": ";font-weight:600}
}