/* ==========================================================================
   PARKAR x TUMARA: home hero (loaded on index.html only)
   Video banner sized to the space under the header. Headline and actions sit
   in that frame, so a short window does not push the buttons below the fold.
   ========================================================================== */
.hero--tumara{display:flex;min-height:calc(100svh - var(--nav-h) - 1px);color:var(--on-dark)}
.hero--tumara .banner__media::after{content:"";background:rgba(0,0,0,.22)}
.hero__inner{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;width:100%;max-width:var(--wrap);margin:0 auto;padding:clamp(36px,5vw,64px) var(--gutter)}
/* Card, top right */
.hero__card{align-self:flex-end;width:240px;background:var(--white-color);color:var(--main-color)}
.hero__card img{display:block;width:100%;height:auto;aspect-ratio:5 / 3;object-fit:cover}
.hero__card-body{padding:14px 15px 16px}
.hero__card small{display:block;font-size:13px;line-height:1.3;color:var(--grey-color);letter-spacing:0}
.hero__card-title{margin:10px 0 12px;font-family:var(--fh);font-size:26px;font-weight:500;line-height:1.08;color:var(--main-color)}
.hero__card .hero__card-link{display:inline-flex;align-items:center;gap:8px;padding-bottom:3px;border-bottom:1px solid currentColor;color:var(--main-color);font-size:13px;font-weight:500;text-decoration:none;transition:gap .25s}
.hero__card .hero__card-link:hover{gap:12px}
/* Headline block, bottom left */
.hero__content{margin-top:0;padding-top:0;text-align:left;transform:translateY(clamp(104px,15vh,180px))}
.hero--tumara .eyebrow{margin-bottom:18px;font-size:12px;color:var(--on-dark)}
.hero--tumara h1{max-width:12.5em;font-size:clamp(40px,3.7vw,68px);line-height:1}
.hero__row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:28px 40px;margin-top:clamp(22px,2.6vw,36px)}
.hero--tumara .sub{margin:0;max-width:34ch;font-size:15.5px;line-height:1.5;color:var(--on-dark-muted)}
.hero__cta{display:flex;flex-wrap:wrap;gap:10px}
.hero--tumara .btn{padding:13px 18px;font-size:15px}
.hero--tumara .btn--primary{background:var(--brand-aqua,#28DFE2);color:var(--brand-blue-tonal,#113344);border-color:transparent}
.hero--tumara .btn--primary:hover{background:#5FE8EA;color:var(--brand-blue-tonal,#113344);border-color:transparent}
.hero--tumara .btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.hero--tumara .btn--ghost:hover{background:var(--brand-aqua,#28DFE2);color:var(--brand-blue-tonal,#113344);border-color:transparent}
/* Logo marquee, bottom edge: label on the left, logos fill the rest */
.hero__logos{display:flex;align-items:center;gap:clamp(20px,3vw,40px);min-width:0;margin-top:clamp(34px,5vw,64px)}
.hero__logos-label{flex:none;margin:0;font-size:14px;font-weight:600;line-height:1.2;letter-spacing:.01em;white-space:nowrap;color:var(--on-dark)}
.hero__logos .marquee{flex:1 1 0;min-width:0;--gap:clamp(36px,4.5vw,64px);--speed:42s}
.hero__logos .marquee__item{flex-direction:row;align-items:center;gap:10px;min-width:0}
.hero__logos .marquee__item img{height:24px;max-width:132px;filter:brightness(0) invert(1);opacity:.85}
.hero__logos .marquee__item span{font-size:15px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--on-dark);opacity:.85}
/* Tablet */
@media (max-width:900px){
.hero--tumara h1{max-width:14em}
}
/* Mobile */
@media (max-width:640px){
.hero__card{display:grid;grid-template-columns:104px minmax(0,1fr);align-self:stretch;width:100%}
.hero__card img{height:100%;aspect-ratio:auto}
.hero__card-body{padding:12px 14px}
.hero__card-title{margin:6px 0 8px;font-size:22px}
.hero__cta{width:100%}
.hero__cta .btn{flex:1 1 100%}
.hero__logos{flex-direction:column;align-items:flex-start;gap:14px}
.hero__logos .marquee{width:100%;flex:none}
.hero__logos .marquee__item img{height:22px;max-width:116px}
.hero__logos .marquee__item span{font-size:14px}
}
/* Reduced motion: a still, wrapped row of logos */
@media (prefers-reduced-motion:reduce){
.hero__logos{align-items:flex-start;flex-direction:column}
.hero__logos .marquee{width:100%}
.hero__logos .marquee__group{justify-content:flex-start;gap:16px var(--gap)}
}