/* Responsive refinements with hero-first focus */

@media (min-width:1201px) and (max-height:1300px){
  .hero{min-height:100dvh;padding-bottom:20px}
  .hero .container{min-height:calc(100dvh - var(--header-height) - 18px);gap:clamp(14px,2vw,28px)}
  .hero .hero-content{padding:clamp(18px,2.6vh,30px) 12px 14px 4px}
  .hero-app-bubble-wrap{padding-top:clamp(12px,2vh,22px);gap:10px}
  .hero h1{font-size:clamp(1.94rem,3.8vw,3rem);margin-bottom:10px}
  .subtitle{font-size:clamp(1rem,1.12vw,1.12rem);line-height:1.48;margin-bottom:14px}
  .hero-app-bubble{width:clamp(118px,9.8vw,162px)}
  .hero-app-bubble-label{font-size:clamp(.82rem,.9vw,.94rem);line-height:1.46;max-width:30ch}
  .hero-app-bubble-download{font-size:.72rem;padding:5px 14px}
}

@media (max-width:1200px){
  .hero .container{grid-template-columns:minmax(0,1.02fr) minmax(260px,.98fr);gap:28px}
  .hero h1{font-size:clamp(2rem,4.4vw,3.15rem)}
  .hero-app-bubble{width:clamp(128px,13.2vw,176px)}
  .hero-app-bubble-label{font-size:clamp(.88rem,1.02vw,.98rem)}
}

@media (max-width:1024px){
  .container{padding:0 18px}
  .hero{min-height:90vh}
  .hero .container{grid-template-columns:1fr 320px;gap:22px}
  .hero .hero-content{padding:calc(var(--header-height) + 12px) 4px 22px 2px}
  .hero h1{font-size:clamp(1.9rem,4.2vw,2.7rem);max-width:16ch}
  .subtitle{font-size:clamp(1rem,1.6vw,1.1rem);max-width:50ch}
  .hero-app-bubble-wrap{grid-template-columns:auto minmax(150px,1fr);grid-template-areas:'card label' 'card links';padding-top:calc(var(--header-height) + 6px);margin-top:10px;column-gap:12px;row-gap:8px;max-width:360px}
  .hero-app-bubble{width:152px}
  .hero-app-bubble-label{font-size:.9rem;line-height:1.5;max-width:31ch}
}

@media (max-width:860px){
  .hero{min-height:auto;padding-bottom:32px}
  .hero .container{grid-template-columns:1fr;gap:18px}
  .hero .hero-content{text-align:center;max-width:700px;margin:0 auto;padding:calc(var(--header-height) + 10px) 0 6px}
  .hero h1{font-size:clamp(1.74rem,5.3vw,2.35rem);max-width:22ch;margin-left:auto;margin-right:auto;line-height:1.08}
  .subtitle{font-size:.98rem;max-width:58ch;margin-left:auto;margin-right:auto}
  .hero-app-bubble-wrap{grid-template-columns:auto minmax(160px,1fr);grid-template-areas:'card label' 'card links';justify-self:center;max-width:390px;padding-top:0;padding-bottom:8px;margin-top:6px;column-gap:12px;row-gap:10px}
  .hero-app-bubble{width:148px}
  .hero-app-bubble-label{font-size:.9rem;max-width:31ch}
}

@media (max-width:640px){
  .container{padding:0 16px}
  .hero{gap:20px;min-height:auto;padding-bottom:24px}
  .hero-video{object-position:center 28%}
  .hero .hero-content{padding:calc(var(--header-height) + 8px) 0 2px}
  .hero h1{font-size:clamp(1.56rem,6.7vw,2.08rem);line-height:1.12;max-width:20ch;margin-bottom:10px}
  .subtitle{font-size:.96rem;line-height:1.55;max-width:44ch;margin-bottom:16px}
  .hero .cta{padding:10px 14px;font-size:.88rem;border-radius:9px}
  .hero-app-bubble-wrap{display:flex;flex-direction:column;text-align:center;align-items:center;max-width:330px;gap:10px;margin-top:0}
  .hero-app-bubble-label{font-size:.78rem;max-width:32ch;line-height:1.45}
  .hero-app-bubble{width:140px;border-radius:22px}
  .hero-app-bubble-download{font-size:.72rem;padding:5px 14px}
  .hero-app-bubble-or{font-size:.62rem}
  .hero-app-bubble-more{font-size:.7rem}
}

@media (max-width:480px){
  .container{padding:0 14px}
  .hero{padding-bottom:20px}
  .hero-video{filter:brightness(.52) saturate(1.02)}
  .hero .hero-content{padding:calc(var(--header-height) + 6px) 0 0}
  .hero h1{font-size:clamp(1.32rem,7.5vw,1.7rem);line-height:1.15;max-width:19ch;margin-bottom:10px}
  .subtitle{font-size:.9rem;line-height:1.54;max-width:40ch;margin-bottom:14px}
  .hero .cta{padding:9px 12px;font-size:.84rem;border-radius:8px}
  .hero .cta + .cta{margin-left:8px}
  .hero-app-bubble-wrap{max-width:300px;gap:9px}
  .hero-app-bubble-label{font-size:.75rem;line-height:1.42;max-width:31ch}
  .hero-app-bubble{width:126px;border-radius:20px}
}

@media (max-width:380px){
  .container{padding:0 12px}
  .hero h1{font-size:clamp(1.16rem,7.6vw,1.42rem);line-height:1.15}
  .subtitle{font-size:.85rem;line-height:1.5}
  .hero .cta{padding:8px 11px;font-size:.8rem}
  .hero-app-bubble-wrap{max-width:270px}
  .hero-app-bubble-label{font-size:.72rem;max-width:30ch}
  .hero-app-bubble{width:116px}
  .hero-app-bubble-download{font-size:.68rem;padding:5px 12px}
}