/* footer contacts (Figma 1636:13118): label left / email right rows, phones side by side, no cards */
@media (max-width:1199px){
  .frameFoot::before{display:none!important}
  .ft-contact p:not(.ft-addr){flex-direction:row!important;align-items:center!important;justify-content:space-between;gap:16px!important;padding:0!important;height:40px}
  .ft-contact p:nth-child(1){margin-top:40px!important}
  .ft-contact p:nth-child(2){margin-top:16px!important}
  .ft-contact .k{width:72px;flex:0 0 auto;font:400 16px/1.5 var(--rubik)}
  .ft-contact a,.ft-phones a{display:flex;align-items:center;height:40px;line-height:1.5!important;white-space:nowrap}
  .ft-phones{margin-top:16px!important;padding:0!important;border-radius:0;background:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;box-shadow:none!important;
    flex-direction:row!important;align-items:center!important;gap:16px!important}
  .ft-phones a{flex:1 1 0;min-width:0}
}
@media (min-width:600px) and (max-width:1199px){
  .frameFoot{column-gap:48px!important}
  .ft-phones{margin-top:40px!important;align-self:start;flex-direction:column!important;align-items:flex-end!important}
  .ft-phones a{flex:0 0 40px}
  .ft-contact p:not(.ft-addr){justify-content:flex-start}
  .ft-contact .k{width:100px}
}
/* footer per Figma 1636:13118: runline 24px/64 gap from the left gutter, nav row 40px */
@media (max-width:1199px){
  .ft-track{gap:0!important;margin-left:var(--gx)}
  .ft-logo,.ft-logo-svg{width:32px!important;height:32px!important}
  .ft-talk{height:auto!important;width:auto!important;flex-direction:row-reverse!important;justify-content:space-between!important;align-items:center!important;padding:16px 16px 16px 20px!important}
  .ft-talk span{align-self:auto!important}
  .ft-talk svg{width:20px;height:20px}
  .ft-track span{padding-right:64px}
  .ft-nav nav{height:40px;align-items:center}
  .ft-addr span:last-child{margin-top:24px!important}
}
@media (min-width:900px) and (max-width:1199px){
  .ft-track{margin-left:0}.ft-track span{padding-right:0}
  .ft-talk{width:153px!important;height:153px!important;flex-direction:column!important;align-items:flex-end!important;padding:12px!important}
  .ft-talk span{align-self:stretch!important}
  .ft-talk svg{width:32px;height:32px}
}
/* footer v2 (Figma 1636:13118 update): 24px rhythm, no contact labels, 12px address */
@media (max-width:1199px){
  .ft-big p,.ft-ind,.ft-socs,.ft-nav nav,.ft-addr span:first-child,.ft-contact p:nth-child(1){margin-top:24px!important}
  .ft-contact .k{display:none!important}
  .ft-contact p:not(.ft-addr){justify-content:flex-start!important}
  .ft-addr span{font:400 12px/1.5 var(--rubik)!important}
  .ft-addr span:last-child{margin-top:8px!important}
  .ft-big p{font:500 24px/1.2 var(--rubik)!important;letter-spacing:.36px!important;text-transform:uppercase}
}
@media (min-width:600px) and (max-width:1199px){
  .ft-phones{margin-top:24px!important;padding-top:0!important;gap:16px!important}
}
/* footer v3 (Figma 1636:13118): 20px runline, centred emails, phones pushed to the edges */
@media (max-width:1199px){
  .ft-track span{font:500 20px/1.2 var(--rubik)!important;letter-spacing:.3px!important}
}
@media (max-width:599px){
  .ft-contact p:not(.ft-addr){justify-content:center!important}
  .ft-contact p:nth-child(2){margin-top:24px!important}
  .ft-phones{margin-top:24px!important;justify-content:space-between!important}
  .ft-phones a{flex:0 0 auto!important;min-width:0}
  .frameFoot{padding-bottom:16px!important}
  .ft-addr span{text-align:center}
}
/* cases, mobile/tablet (Figma 776:2796): dark section, 3 image cards, yellow CTA */
.p8-mcards{display:none}
@media (max-width:1199px){
  .page8{background:#131313!important;color:#fff}
  .page8 .frame8{gap:24px!important}
  .p8-eyebrow{color:#ffe01b!important}
  .p8-head h2{color:#fff!important}
  .p8-wrap{display:none!important}
  .p8-mcards{order:2;display:grid;grid-template-columns:1fr;gap:20px}
  .p8-mcard{position:relative;display:flex;flex-direction:column;justify-content:flex-end;aspect-ratio:1;border-radius:8px;overflow:hidden;background:#000;color:#fff;text-decoration:none;clip-path:inset(0 round 8px)}
  .p8-mcard img{position:absolute;inset:0 0 auto 0;width:100%;height:auto;aspect-ratio:343/255;object-fit:cover;display:block;
    -webkit-mask:linear-gradient(#000 78%,transparent);mask:linear-gradient(#000 78%,transparent);transition:transform .6s var(--ease)}
  .p8-mcard:hover img{transform:scale(1.04)}
  .p8-mover{position:relative;min-height:58.3%;padding:16px;display:flex;align-items:flex-end;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.95))}
  .p8-mover h3{margin:0;font:500 20px/1.5 var(--rubik);color:#fff}
  .p8-all{order:3;margin-top:16px;background:#ffe01b!important;color:#131313!important;font:500 16px/1.5 var(--mono)!important;padding:16px!important}
  .page8{box-shadow:0 -30px 80px -20px rgba(0,0,0,.7);background:transparent!important;transition:box-shadow .6s var(--ease)}
  .page8::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;background:#131313;transition:opacity .6s var(--ease)}
  .page8.clear::before{opacity:0}
  .page8.clear{box-shadow:none}
  /* FAQ no longer rides over the cases: plain flow, the green gradient runs under both */
  .page8{position:relative!important;top:auto!important}
  .pageFaq{margin-top:0!important;border-radius:0!important;box-shadow:none!important}
  .pageFaq::before{display:none!important}
  /* cases no longer ride over How we build either: one continuous gradient zone */
  .page7{padding-bottom:0!important}
  .page8{margin-top:0!important;border-radius:0!important;box-shadow:none!important}
  .page8::before{display:none!important}
}
@media (min-width:600px) and (max-width:1199px){
  .p8-mcards{grid-template-columns:repeat(3,1fr)}
}
@media (min-width:600px) and (max-width:899px){
  .p8-mover h3{font-size:16px}
  .p8-mover{padding:12px}
}
@media (min-width:1200px){.p4-tags-track{display:contents}.p4-tags .dup{display:none}}
@media (prefers-reduced-motion:reduce){.p4-tags-track{animation:none}}
