.hero {
    position: relative; flex: 1; isolation: isolate; overflow: hidden;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: 72px 24px 96px; text-align: center;
}
/* Луч проектора - главный "киношный" акцент страницы */
.hero__beam {
    position: absolute; z-index: -1; left: 50%; top: -12%;
    width: min(1100px, 160vw); height: 120%;
    transform: translateX(-50%);
    background:
        radial-gradient(ellipse 34% 26% at 50% 4%, rgba(255, 196, 150, .30), transparent 70%),
        conic-gradient(from 180deg at 50% 0%, transparent 150deg, rgba(255, 170, 120, .14) 166deg,
                       rgba(255, 210, 170, .22) 180deg, rgba(255, 170, 120, .14) 194deg, transparent 210deg);
    filter: blur(6px);
    opacity: 0;
    animation: beamOn 1.6s .1s var(--ease) forwards;
}
.hero__grain {
    position: absolute; inset: 0; z-index: -1; opacity: .06; pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
@keyframes beamOn {
    0% { opacity: 0; } 30% { opacity: .55; } 38% { opacity: .2; } 52% { opacity: .85; } 100% { opacity: 1; }
}
.hero__title {
    font-family: var(--font-display); font-weight: 800;
    font-size: clamp(30px, 5.4vw, 60px); line-height: 1.08; letter-spacing: -0.03em;
    max-width: 17ch; text-wrap: balance; margin-bottom: 20px;
    opacity: 0; transform: translateY(14px);
    animation: heroIn .8s .35s var(--ease) forwards;
}
.hero__lead {
    font-size: clamp(16px, 1.6vw, 18px); color: var(--text-2);
    max-width: 46ch; text-wrap: pretty; margin-bottom: 36px;
    opacity: 0; animation: heroIn .8s .5s var(--ease) forwards;
}
.hero__search {
    width: 100%; max-width: 620px;
    opacity: 0; animation: heroIn .8s .62s var(--ease) forwards;
}
.hero__search .search { padding: 6px; border-radius: 16px; box-shadow: 0 20px 60px rgba(0,0,0,.45); }
.hero__search .search__input { font-size: 17px; padding: 12px 14px; }
.hero__search .btn { --h: 48px; border-radius: 11px; }
.hero__hints {
    display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 18px;
    color: var(--text-3); font-size: 14px; align-items: center;
    opacity: 0; animation: heroIn .8s .75s var(--ease) forwards;
}
.chip {
    border: 1px solid var(--line); background: rgba(255,232,214,.04); color: var(--text-2);
    border-radius: 999px; padding: 6px 14px; font: 600 13px var(--font); cursor: pointer;
    transition: background .2s, color .2s, border-color .2s;
}
.chip:hover { background: rgba(255,232,214,.10); color: var(--text); border-color: var(--line-2); }
@keyframes heroIn { to { opacity: 1; transform: none; } }
@media (max-width: 640px) {
    .hero { padding: 48px 16px 64px; justify-content: flex-start; }
    .hero__lead { margin-bottom: 28px; }
    .hero__search .search__btn-label { display: none; }
    .hero__search .btn { width: 48px; padding: 0; }
}

/* Фон главной (настройки «Оформление») */
.hero--bg .hero__bgimg { position: absolute; inset: 0; z-index: -3; background-size: cover; background-position: center; }
.hero--bg .hero__bgdim {
    position: absolute; inset: 0; z-index: -2;
    background: linear-gradient(180deg, rgba(15, 12, 10, var(--dim, .55)) 0%, rgba(15, 12, 10, calc(var(--dim, .55) + .15)) 70%, var(--bg) 100%);
}
.hero--bg .hero__grain { z-index: -1; }
.hero--bg .hero__title, .hero--bg .hero__lead { text-shadow: 0 2px 24px rgba(0, 0, 0, .55); }