/* about page extras */
.tale{max-width:980px;margin:56px auto 0}
.tale-big{font-family:var(--display);text-transform:uppercase;font-size:clamp(30px,3.4vw,48px);line-height:1.05;text-align:center;margin:0 auto 72px;max-width:860px}
.tale-big.end{margin:72px auto 0;color:var(--red)}
.tl{margin-top:0}
.ev p{max-width:380px}
.ev strong{color:var(--red)}
.why-s svg{display:block;width:100%}
.mate .av{background:var(--red);overflow:hidden;align-items:center}
.mate:nth-child(even) .av{background:var(--deep)}
.mate .av img{width:86%;height:auto}
.crew{min-height:760px}
.hl-wrap{margin-top:40px}
.num svg{color:#ffd0b3}
@media (max-width: 810px){
  .tale-big{margin-bottom:48px}
  .tale-big.end{margin-top:48px}
}

/* "Busy lives, happy dogs": bigger cards in a scattered collage with layered scroll parallax,
   the brand wordmark drifting in big rows behind */
.crew{min-height:clamp(980px,82vw,1180px);isolation:isolate}
.crew > .head{position:relative;z-index:2}
.crew-bg{position:absolute;z-index:0;top:0;bottom:0;left:calc(50% - 50vw);right:calc(50% - 50vw);overflow:hidden;pointer-events:none;
  display:flex;flex-direction:column;justify-content:center;gap:clamp(8px,2vw,28px)}
.cb-row{white-space:nowrap;font-family:var(--display);text-transform:uppercase;line-height:.9;font-size:clamp(84px,13vw,210px);
  translate:var(--dx,0px) 0;will-change:translate}
.cb-row > span{display:inline-block;margin-left:-30vw}
.cb-row.r1,.cb-row.r3{color:#f6d6c0}
.cb-row.r2{color:transparent;-webkit-text-stroke:2px rgba(242,107,29,.55)}
.cb-paw .pawi{width:.62em;height:.62em;vertical-align:.04em;fill:currentColor;margin:0 .12em}
.cb-row.r2 .cb-paw .pawi{fill:rgba(242,107,29,.28)}
.cb-stk{position:absolute;width:clamp(84px,9vw,130px);height:auto;translate:0 var(--py,0px);will-change:translate}
.cb-stk.k1{left:38%;top:6%;rotate:-12deg}
.cb-stk.k2{right:30%;bottom:5%;rotate:10deg}
.cb-stk.k3{left:30%;bottom:12%;rotate:6deg;width:clamp(70px,7vw,110px)}
.mates{position:static}
.mate{width:clamp(250px,23vw,330px);padding:12px 12px 20px;border-radius:28px;translate:0 var(--py,0px);will-change:translate;
  box-shadow:0 22px 50px rgba(17,17,17,.16)}
.mate .av{border-radius:20px}
.mate b{font-size:clamp(22px,1.9vw,28px)}
.mate small{font-size:17px}
.m1{left:1%;top:5%}
.m2{right:2%;top:1%}
.m3{left:5%;bottom:3%}
.m4{right:0;bottom:7%}
@media (max-width: 1024px){
  .crew{min-height:0;gap:28px;padding:20px 0 40px}
  .crew-bg{justify-content:space-around}
  .cb-row{font-size:clamp(70px,19vw,150px)}
  .cb-stk.k1{left:auto;right:4%;top:2%}
  .cb-stk.k2{right:auto;left:3%;bottom:30%}
  .cb-stk.k3{left:auto;right:6%;bottom:2%}
  .mates{display:block;width:100%;max-width:640px;margin:0 auto;position:relative;z-index:2}
  .mate{display:block;width:min(74%,400px);transform:rotate(var(--r,0deg))}
  .mate + .mate{margin-top:6px}
  .m2,.m4{margin-left:auto}
  .m3{margin-left:4%}
}
@media (prefers-reduced-motion: reduce){.cb-row,.cb-stk,.mate{translate:none}}

/* collage v2: stronger wordmark so the branding reads behind the cards */
.cb-row.r1,.cb-row.r3,.cb-row.r5{color:#f3c6a6}
.cb-row.r2,.cb-row.r4{-webkit-text-stroke:2.5px rgba(242,107,29,.75)}
.cb-row.r2 .cb-paw .pawi,.cb-row.r4 .cb-paw .pawi{fill:rgba(242,107,29,.45)}
.cb-row.r4,.cb-row.r5{display:none}
.cb-stk{z-index:1}
@media (max-width: 1024px){
  .cb-row.r4,.cb-row.r5{display:block}
  .cb-row{font-size:clamp(72px,21vw,150px)}
  .mate{width:min(64%,360px)}
  .mate + .mate{margin-top:26px}
  .m1{margin-left:2%}
  .m2,.m4{margin-right:2%}
  .m3{margin-left:6%}
  .cb-stk{width:clamp(70px,20vw,110px)}
  .cb-stk.k1{right:6%;top:30%}
  .cb-stk.k2{left:4%;bottom:48%}
  .cb-stk.k3{right:8%;bottom:6%}
}
