
:root{
 --cyan:#0DC0DE; --cyan-mid:#5BCFE8; --cyan-pale:#C6E6F4; --pink:#EC3592; --pink-deep:#B51F70;
 --purple:#A05AA3; --peach:#F8C8B4; --ink:#2B2457; --soft:#6C6490; --cream:#FFF7F2; --line:#EADFF2;
 --paw:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'><g fill='%23ffffff' opacity='.22'><ellipse cx='40' cy='52' rx='15' ry='12'/><circle cx='24' cy='32' r='7'/><circle cx='40' cy='26' r='7'/><circle cx='56' cy='32' r='7'/><circle cx='64' cy='46' r='6'/><ellipse cx='94' cy='100' rx='11' ry='9'/><circle cx='82' cy='86' r='5'/><circle cx='94' cy='81' r='5'/><circle cx='106' cy='86' r='5'/></g></svg>");
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#fff;color:var(--ink);font:400 17px/1.62 "Nunito Sans",Segoe UI,Arial,sans-serif;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--pink-deep)}
h1,h2,h3,.pill,.shelf-row__h{font-family:"Baloo 2",Segoe UI,Arial,sans-serif;font-weight:800;line-height:1.14;margin:0 0 .5em}
h1{font-size:clamp(28px,4.4vw,46px)}
h2{font-size:clamp(23px,3vw,33px)}
h3{font-size:19px}
p{margin:0 0 1em}
.skip{position:absolute;left:-999px;top:0;background:var(--pink);color:#fff;padding:10px 16px;z-index:60}
.skip:focus{left:8px;top:8px}
main{display:block}
section{padding:0}

/* шапка */
.collar{position:sticky;top:0;z-index:40;background:#fff;border-bottom:4px solid var(--cyan-pale)}
.collar__in{max-width:1220px;margin:0 auto;padding:10px 18px;display:flex;align-items:center;gap:18px}
.collar__tag img{width:132px;height:auto}
.collar__nav{margin-left:auto}
.collar__nav ul{display:flex;gap:20px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.collar__nav a{color:var(--ink);text-decoration:none;font-weight:700;font-size:15px;padding:6px 0;border-bottom:3px solid transparent}
.collar__nav a:hover,.collar__nav a.lit{border-bottom-color:var(--pink);color:var(--pink-deep)}
.gate,.gate__grip{display:none}
.stamp{display:inline-block;border:0;background:none;cursor:pointer}
.stamp img{width:100%;height:auto}
.stamp--head{width:186px;flex:0 0 auto}
.stamp--hero{width:300px;margin:18px 0 0}
.stamp--card{width:100%;max-width:320px;margin-top:auto;padding-top:14px}
.stamp--pdp{width:100%;max-width:360px;margin:6px 0 18px}
.stamp--bar{width:172px}

/* хиро */
.yard{background:linear-gradient(104deg,var(--cream) 0 52%,var(--cyan-pale) 52% 100%)}
.yard__in{max-width:1220px;margin:0 auto;padding:40px 18px 48px;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.yard__over{font-family:"Baloo 2";font-weight:600;color:var(--cyan);margin:0 0 6px;font-size:19px}
.yard__lede{font-size:19px;color:var(--soft)}
.yard__pts{list-style:none;margin:0;padding:0}
.yard__pts li{position:relative;padding:4px 0 4px 30px;font-weight:600}
.yard__pts li:before{content:"";position:absolute;left:0;top:11px;width:14px;height:14px;border-radius:50%;background:var(--pink)}
.yard__poster img{border-radius:22px;box-shadow:0 16px 36px rgba(43,36,87,.18);width:100%}

/* полоса пользы */
.band-paw{background:var(--cyan) var(--paw);color:#fff}
.band-paw__in{max-width:1220px;margin:0 auto;padding:46px 18px 52px}
.band-paw h2{text-align:center;color:#fff;margin-bottom:28px}
.band-paw__cols{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.paw-col{background:rgba(255,255,255,.93);color:var(--ink);border-radius:18px;padding:20px 20px 14px}
.paw-col h3{color:var(--pink-deep)}
.paw-col p{font-size:15.5px;margin:0}

/* ленты разделов */
.shelves{max-width:1220px;margin:0 auto;padding:52px 18px 10px}
.shelves h2{text-align:center;margin-bottom:26px}
.shelf-row{display:block;text-decoration:none;color:inherit;margin-bottom:22px;border-radius:20px;overflow:hidden;border:3px solid var(--cyan-pale);background:#fff}
.shelf-row img{width:100%}
.shelf-row__body{display:block;padding:16px 22px 20px}
.shelf-row__h{display:block;font-size:24px;color:var(--ink)}
.shelf-row__sub{display:block;color:var(--soft);font-size:16px;margin:4px 0 8px}
.shelf-row__go{color:var(--pink-deep);font-weight:800}
.shelf-row:hover{border-color:var(--pink)}

/* сетки товаров */
.favs,.group,.woof,.asks,.hops{max-width:1220px;margin:0 auto;padding:46px 18px}
.favs__banner img{border-radius:20px;width:100%}
.favs h2{margin-top:26px;text-align:center}
.favs__sub{text-align:center;color:var(--soft);max-width:620px;margin:0 auto 26px}
.litter{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.litter--4{grid-template-columns:repeat(4,1fr)}
.pup{display:flex;flex-direction:column;background:#fff;border:2px solid var(--line);border-radius:20px;padding:14px}
.pup:hover{border-color:var(--cyan)}
.pup__shot{display:block;background:#fff;border-radius:14px;overflow:hidden}
.pup__shot img{aspect-ratio:1/1;object-fit:contain;width:100%}
.pup h3{margin:12px 0 6px;font-size:17.5px}
.pup h3 a{color:var(--ink);text-decoration:none}
.pup h3 a:hover{color:var(--pink-deep)}
.pup--gone .pup__shot img{filter:saturate(.45)}
.stars{color:#F6A700;letter-spacing:1px}
.pup__stars{font-size:13.5px;color:var(--soft);margin:0 0 8px;display:flex;gap:7px;align-items:center}
.tag{margin:0 0 10px;font-size:16px;display:flex;gap:9px;align-items:baseline;flex-wrap:wrap}
.tag b{font-family:"Baloo 2";font-size:25px;color:var(--pink-deep)}
.tag s{color:var(--soft)}
.tag__note{font-size:13px;color:var(--soft)}
.tag--big b{font-size:34px}
.tag--gone{color:var(--soft);font-size:14.5px;font-weight:700;flex-wrap:nowrap;align-items:center}
.tag--gone .dot{width:10px;height:10px;border-radius:50%;background:#B9B3CC;display:inline-block;flex:0 0 10px}
.more{text-align:center;margin-top:30px}
.pill{display:inline-block;background:var(--cyan);color:#fff;text-decoration:none;padding:13px 30px;border-radius:999px;font-size:18px;box-shadow:0 5px 0 #0A9DB6}
.pill:hover{background:#0BB0CC}
.pill--pink{background:var(--pink);box-shadow:0 5px 0 var(--pink-deep)}
.pill--pink:hover{background:#D82E86}

/* ленты с текстом поверх */
.belt{position:relative;margin:40px 0}
.belt>img{display:block;width:100%;min-height:150px;object-fit:cover}
.belt__over{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;text-align:left;padding:16px 7%;
 background:linear-gradient(90deg,rgba(43,36,87,.86) 0,rgba(43,36,87,.78) 44%,rgba(43,36,87,.2) 78%)}
.belt__over h2,.belt__over p{color:#fff;text-shadow:0 2px 10px rgba(43,36,87,.85);max-width:540px}
.belt__over p{margin-bottom:14px}
.belt__over .stamp img{width:300px;height:auto;min-height:0;object-fit:contain}

/* отзывы */
.woof h2{text-align:center}
.woof__sub{text-align:center;color:var(--soft);margin-bottom:26px}
.woof__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.woof__card{margin:0;background:var(--cream);border-radius:18px;padding:18px 20px;border:2px solid var(--line)}
.woof__card blockquote{margin:8px 0 10px;font-size:15.5px}
.woof__card figcaption{font-family:"Baloo 2";font-size:18px}
.woof__by{font-size:13.5px;color:var(--soft);margin:0}

/* проза и FAQ */
.reading{background:var(--cream)}
.reading__in{max-width:1000px;margin:0 auto;padding:48px 18px}
.reading--tight .reading__in{padding:30px 18px}
.reading h2{color:var(--pink-deep);margin-top:26px}
.reading h2:first-child{margin-top:0}
.reading--note{background:var(--cyan-pale);background-image:var(--paw);background-size:150px}
.reading--note .reading__in{max-width:900px;padding:34px 18px;background:#fff;border-radius:22px;
 border:2px solid #fff;box-shadow:0 10px 30px rgba(43,36,87,.08);margin:34px auto}
.reading--note h2{color:var(--purple)}
.reading--note p{margin:10px 0 0}

/* лента «каждый сет в одно касание» — только кадры, подписи в alt */
.pawstrip{max-width:1220px;margin:0 auto;padding:10px 18px 46px;text-align:center}
.pawstrip h2{color:var(--pink-deep)}
.pawprints{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px;margin-top:18px}
.pawprint{display:block;border-radius:14px;overflow:hidden;border:2px solid var(--line);background:#fff;
 transition:transform .15s,border-color .15s}
.pawprint:hover,.pawprint:focus-visible{transform:translateY(-3px);border-color:var(--pink)}

.asks details{border:2px solid var(--line);border-radius:16px;padding:12px 18px;margin-bottom:12px;background:#fff}
.asks summary{font-family:"Baloo 2";font-weight:600;font-size:19px;cursor:pointer}
.asks details[open] summary{color:var(--pink-deep)}
.asks p{margin:10px 0 2px}

/* хлебные крошки */
.trail{max-width:1220px;margin:0 auto;padding:14px 18px 0}
.trail ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0;font-size:14px;color:var(--soft)}
.trail li+li:before{content:"›";margin-right:8px;color:var(--cyan)}

/* вводный блок страниц */
.lead{max-width:1220px;margin:0 auto;padding:26px 18px 10px;display:grid;grid-template-columns:260px 1fr;gap:30px;align-items:center}
.lead__tile img{border-radius:18px}
.lead--lost{grid-template-columns:1fr}
.lede{font-size:19px;color:var(--soft)}
.group h2{margin-bottom:6px}
.group__sub{color:var(--soft);margin-bottom:20px}

/* шапка полки */
.shelf-head__belt{width:100%}
.shelf-head__words{max-width:1220px;margin:0 auto;padding:26px 18px 6px;display:flex;gap:26px;align-items:center}
.shelf-head__tile{width:190px;border-radius:16px;flex:0 0 auto}
.hops__row{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.hop{display:block;text-decoration:none;color:var(--ink);border:2px solid var(--line);border-radius:16px;overflow:hidden;background:#fff}
.hop img{width:100%}
.hop span{display:block;padding:10px 14px;font-weight:800;font-family:"Baloo 2"}
.hop:hover{border-color:var(--cyan)}

/* карточка товара */
.pdp{max-width:1220px;margin:0 auto;padding:18px 18px 10px;display:grid;grid-template-columns:1.05fr 1fr;gap:40px}
.shots__big img{width:100%;aspect-ratio:1/1;object-fit:contain;border:2px solid var(--line);border-radius:20px;background:#fff}
.shots__row{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:10px}
.shots__t{padding:0;border:2px solid var(--line);border-radius:10px;background:#fff;cursor:pointer;overflow:hidden}
.shots__t img{width:100%;aspect-ratio:1/1;object-fit:contain}
.shots__t:hover,.shots__t:focus{border-color:var(--pink)}
.pdp__shelf a{font-weight:800;text-decoration:none;font-size:14px;text-transform:none}
.pdp__stars{display:flex;gap:9px;align-items:center;font-size:14px;color:var(--soft);margin:0 0 12px}
.pdp__lede{font-size:18.5px}
.pdp__bul{margin:18px 0 0;padding-left:20px}
.pdp__bul li{margin-bottom:10px;font-size:15.5px}
.kick{font-family:"Baloo 2";font-weight:800;color:var(--pink-deep)}
.swap{background:var(--cream);border-left:5px solid var(--cyan);padding:12px 16px;border-radius:0 12px 12px 0;font-size:15.5px}
.folds{max-width:1220px;margin:0 auto;padding:16px 18px 10px}
.folds details{border-bottom:2px solid var(--line);padding:14px 2px}
.folds summary{font-family:"Baloo 2";font-weight:600;font-size:21px;cursor:pointer}
.folds details[open] summary{color:var(--pink-deep)}
.woof--pdp .woof__grid{grid-template-columns:repeat(2,1fr)}

/* нижняя полоса на телефоне */
.barbar{display:none}

/* гайды и служебные */
.note,.desk{max-width:840px;margin:0 auto;padding:16px 18px 40px}
.note h2,.desk h2{color:var(--pink-deep);margin-top:34px}
.pickbox{display:flex;gap:20px;align-items:center;background:var(--cyan-pale);border-radius:20px;padding:18px;margin:26px 0}
.pickbox img{width:180px;border-radius:14px;background:#fff}
.pickbox__k{font-weight:800;color:var(--pink-deep);font-size:13.5px;margin:0 0 4px}
.pickbox h3{margin:0 0 8px}
.pickbox h3 a{color:var(--ink);text-decoration:none}
.desk__back{margin-top:36px}

/* футер */
.porch{background:var(--ink);color:#EFEAFB;margin-top:50px}
.porch__in{max-width:1220px;margin:0 auto;padding:46px 18px 10px;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:30px}
.porch img{background:#fff;border-radius:14px;padding:8px;width:160px}
.porch h2{font-size:18px;color:var(--cyan-mid)}
.porch ul{list-style:none;margin:0;padding:0}
.porch li{margin-bottom:8px}
.porch a{color:#EFEAFB;text-decoration:none;font-size:15px}
.porch a:hover{color:var(--cyan-mid)}
.porch p{font-size:15px;color:#C7BFE4}
.porch__post{font-size:14px;line-height:1.7}
.porch__line{max-width:1220px;margin:0 auto;padding:18px;border-top:1px solid rgba(255,255,255,.14);font-size:13.5px}

@media(max-width:1000px){
 .yard__in{grid-template-columns:1fr;gap:26px}
 .band-paw__cols{grid-template-columns:repeat(2,1fr)}
 .litter,.litter--4{grid-template-columns:repeat(2,1fr)}
 .woof__grid,.woof--pdp .woof__grid{grid-template-columns:repeat(2,1fr)}
 .pdp{grid-template-columns:1fr;gap:24px}
 .porch__in{grid-template-columns:1fr 1fr}
 .hops__row{grid-template-columns:repeat(2,1fr)}
 .lead{grid-template-columns:1fr}
 .lead__tile img{max-width:240px}
}
@media(max-width:760px){
 body{font-size:16px}
 body.page--pdp{padding-bottom:82px}
 .collar__in{flex-wrap:wrap;gap:10px;padding:8px 14px}
 .collar__tag img{width:104px}
 .gate__grip{display:block;margin-left:auto;padding:10px 8px;cursor:pointer}
 .gate__grip span{display:block;width:26px;height:3px;background:var(--ink);border-radius:2px;margin:5px 0}
 .collar__nav{display:none;width:100%;margin:0;order:5}
 .gate:checked~.collar__nav{display:block}
 .collar__nav ul{flex-direction:column;gap:0}
 .collar__nav li{border-top:1px solid var(--line)}
 .collar__nav a{display:block;padding:11px 2px}
 .stamp--head{width:170px;margin-left:auto}
 .yard{background:var(--cream)}
 .yard__in{padding:24px 16px 32px}
 .band-paw__cols{grid-template-columns:1fr}
 .shelf-head__words{flex-direction:column;align-items:flex-start;gap:14px}
 .shelf-head__tile{width:150px}
 .shots__row{grid-template-columns:repeat(4,1fr)}
 .woof__grid,.woof--pdp .woof__grid{grid-template-columns:1fr}
 .porch__in{grid-template-columns:1fr;gap:22px}
 .belt>img{height:230px}
 .belt__over{padding:16px 20px;background:rgba(43,36,87,.74)}
 .belt__over h2{font-size:22px}
 .belt__over p{font-size:14.5px}
 .belt__over .stamp img{width:100%;max-width:300px}
 .page--pdp .barbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:50;background:#fff;
   border-top:3px solid var(--cyan-pale);padding:9px 14px;align-items:center;gap:12px}
 .barbar__t{font-size:13px;color:var(--soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .stamp--card,.stamp--pdp{max-width:none}
}
@media(max-width:380px){
 .litter,.litter--4{grid-template-columns:1fr}
 .hops__row{grid-template-columns:1fr}
}
