.hero{position:relative;min-height:clamp(410px,47vw,560px);display:flex;align-items:flex-end;justify-content:center;overflow:hidden;background:#1c272c} .hero-panorama{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center;z-index:0} .hero-content{position:relative;z-index:2;width:min(1120px,calc(100% - 32px));padding:0 0 clamp(34px,5vw,64px);text-align:center;color:#fff;text-shadow:0 3px 20px rgba(0,0,0,.45)} .hero-content h1{max-width:1000px;margin:0 auto .7rem;font-size:clamp(2rem,4.4vw,4rem);line-height:1.07;font-weight:750;letter-spacing:-.035em;color:#fff} .hero-subtitle{margin:0 auto 1.35rem;font-size:clamp(1rem,1.55vw,1.3rem);font-weight:500;color:rgba(255,255,255,.96)} .hero-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:.65rem} .hero-badge{display:inline-flex;align-items:center;gap:.42rem;padding:.62rem .94rem;border:1px solid rgba(255,255,255,.4);border-radius:999px;background:rgba(13,22,26,.48);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);font-size:.9rem;font-weight:650;color:#fff} @media(max-width:900px){.hero-panorama{object-fit:cover;object-position:center}.hero{min-height:470px}} @media(max-width:600px){.hero{min-height:500px}.hero-content{padding-bottom:28px}.hero-content h1{font-size:2.15rem}.hero-badge{font-size:.76rem;padding:.5rem .68rem}}