/* 04.10: медійний перший екран, швидкий вибір мови, адаптована анімація Claude. */
:root{--navy:#09294b;--hero-accent:#ffd12f}
html{scroll-padding-top:106px}
.site-header{min-height:96px;padding:8px max(24px,calc((100vw - 1240px)/2));gap:24px;background:#fff;border-bottom:1px solid #e4e7e9}
.brand{position:relative;flex:none;width:198px;height:78px;overflow:hidden;animation:nk-brand-focus 1.2s ease both}
.brand img{position:absolute;left:-44px;top:-53px;width:284px;height:auto;max-width:none;border-radius:0;object-fit:initial;background:none}
.brand>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.brand::after{content:'';position:absolute;inset:-12px -30px;pointer-events:none;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.72) 49%,transparent 58%);transform:translateX(-110%);animation:nk-brand-light 1.8s ease .25s both}
.site-nav{gap:4px;font-size:13px;font-weight:700;letter-spacing:.015em;margin-left:auto}
.site-nav a{padding:11px 12px;border-radius:2px}
.site-nav a:hover{background:#eef5fb;color:#075b9f}
.site-nav .nav-action{background:#0061b4;border:1px solid #0061b4;color:#fff!important}
.site-nav .nav-action:hover{background:#06477e}
.header-controls{display:flex;align-items:center;gap:10px;flex:none}
.lang-switch{display:grid;place-items:center;min-width:44px;min-height:44px;margin:0;border-radius:2px;border-color:#d6d9dc;color:#09294b;background:#fff;font-size:12px}
.site-nav a::after{background:#0061b4;height:1px}
.nav-toggle{border-radius:2px;border-color:#b9c1c7}
/* Багатопрофільна платформа: типографіка й чотири напрями. */
.hero{display:grid;grid-template-columns:minmax(0,1.24fr) minmax(0,.86fr);gap:70px;align-items:center;position:relative;min-height:810px;padding:168px max(32px,calc((100vw - 1240px)/2)) 160px;background:#f8f9fa;overflow:hidden;color:#09294b}
.hero-content{position:relative;z-index:2;display:block;width:auto;min-width:0;margin:0;padding:0}
.hero .kicker{margin:0 0 26px;color:#0061b4;font-size:11px;letter-spacing:.15em;font-weight:800;animation:nk-caption-arrive .8s ease .08s both}
.hero .kicker::before{width:28px;height:2px;border-radius:0;background:#0061b4}
.hero h1{max-width:730px;margin:0 0 28px;color:#09294b;font-family:var(--font);font-weight:800;font-size:clamp(58px,6.1vw,88px);line-height:1.03;letter-spacing:-.055em;text-wrap:balance;animation:nk-caption-arrive 1s ease .18s both}
.hero-word{display:inline-block;color:#0061b4;position:relative;z-index:0}
.hero-word::after{content:'';position:absolute;z-index:-1;left:0;right:0;bottom:0;height:12px;background:#ffd12f;transform-origin:left;animation:nk-rule-arrive 1.1s ease .5s both}
.hero-copy{max-width:530px;margin:0 0 32px;color:#455669;font-size:17px;line-height:1.7;animation:nk-caption-arrive 1s ease .3s both}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;animation:nk-caption-arrive 1s ease .42s both}
.hero .button{min-height:50px;padding:12px 22px;border-width:1px;border-radius:2px;font-size:13px;font-weight:700}
.hero .button-primary{background:#0061b4;color:#fff;border-color:#0061b4}
.hero .button-primary:hover{background:#004982;border-color:#004982;transform:translateY(-2px)}
.hero .button-ghost{background:transparent;color:#09294b;border-color:#849bae}
.hero .button-ghost:hover{background:#edf2f6;border-color:#09294b}
.hero-directions{position:relative;align-self:stretch;display:flex;align-items:center;min-height:400px;min-width:0;padding:40px 34px 74px;background:#0061b4;color:#fff;border-bottom:8px solid #ffd12f}
.hero-directions ol{width:100%;margin:0;padding:0;list-style:none}
.hero-directions li{display:flex;align-items:baseline;gap:22px;border-bottom:1px solid #63a0d4;padding:14px 0;font-size:clamp(32px,3.5vw,50px);font-weight:800;line-height:1.1;letter-spacing:-.045em;animation:nk-caption-arrive 1s ease both}
.hero-directions li:nth-child(2){animation-delay:.12s}.hero-directions li:nth-child(3){animation-delay:.24s}.hero-directions li:nth-child(4){animation-delay:.36s}
.direction-number{font-size:10px;font-weight:600;letter-spacing:.04em;color:#d2e8fa}
.music-hint{position:absolute;right:12px;bottom:13px;width:44px;height:78px;fill:none;stroke:#ffd12f;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.music-hint path{stroke-dasharray:1;animation:nk-music-draw 2.3s ease .3s both}
.music-hint circle{fill:#ffd12f;stroke:none}
@keyframes nk-music-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
.hero-routes{position:absolute;z-index:3;left:max(32px,calc((100vw - 1240px)/2));right:max(32px,calc((100vw - 1240px)/2));bottom:42px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid #bfcbd5;border-bottom:1px solid #bfcbd5;background:transparent}
.hero-routes a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:19px 18px;color:#09294b;min-width:0;font-size:12px;font-weight:700;border-right:1px solid #bfcbd5;transition:background .2s ease}
.hero-routes a:last-child{border-right:0}.hero-routes a:hover{background:#e8eff5}
.hero-routes a>span:last-child{color:#0061b4;font-size:18px;transition:transform .2s ease}
.hero-routes a:hover>span:last-child{transform:translate(3px,-3px)}
/* Вміст ніколи не приховується в очікуванні JS. */
#hero-title,.hero-copy,.hero-actions,.audience-bar,[data-reveal]{opacity:1;transform:none;transition:none}
[data-reveal].is-visible{animation:nk-caption-arrive .65s ease both}
.kicker{color:var(--blue-deep)}
.contact .yellow{color:var(--blue-deep)}
.legal,.footer-grid p{color:#bfc4cb}
.audience-grid a,.audience-grid a:first-child{padding:24px 28px;min-width:0}
.audience-grid strong{overflow-wrap:break-word}
@keyframes nk-brand-focus{from{transform:translateY(4px)}to{transform:none}}
@keyframes nk-brand-light{from{transform:translateX(-110%)}to{transform:translateX(110%)}}
@keyframes nk-caption-arrive{from{transform:translateY(15px)}to{transform:none}}
@keyframes nk-camera-arrive{from{transform:scale(1.055) translateX(1%)}to{transform:scale(1)}}
@keyframes nk-rule-arrive{from{transform:scaleX(.1)}to{transform:scaleX(1)}}
@keyframes nk-frame-focus{from{transform:translate(8px,8px)}to{transform:none}}
@media(max-width:1100px){
 .site-header{padding-inline:24px}.site-nav{position:fixed;inset:96px 0 auto;display:none;padding:16px 24px 24px;margin:0;background:#fff;box-shadow:0 14px 24px rgba(12,35,54,.12);color:#0c2336}.site-nav.open{display:grid}.site-nav a{padding:13px 12px}.nav-toggle{display:block}
 .hero{gap:36px;padding-inline:32px}.hero h1{font-size:clamp(54px,6.8vw,72px)}.hero-directions{padding-inline:24px}.hero-directions li{font-size:clamp(28px,3.5vw,40px);gap:14px}
}
@media(max-width:760px){
 .site-header{min-height:86px;padding:4px 16px;gap:10px}.brand{width:198px;height:78px}.header-controls{gap:8px}.lang-switch{min-width:38px;min-height:40px;padding:8px;font-size:11px}.nav-toggle{width:38px;height:40px}.site-nav{inset:86px 0 auto}
 .hero{display:flex;flex-direction:column;align-items:stretch;gap:28px;min-height:0;padding:126px 20px 30px}.hero-content{width:100%;padding:0}
 .hero .kicker{font-size:10px;letter-spacing:.09em;margin-bottom:20px}.hero h1{max-width:590px;font-size:clamp(46px,12.3vw,70px);line-height:1.04;margin-bottom:24px}.hero-word::after{height:7px}
 .hero-copy{font-size:15px;line-height:1.6;margin-bottom:26px}.hero-actions{gap:10px}.hero .button{padding:11px 15px;font-size:12px;min-height:46px}
 .hero-directions{min-height:0;padding:20px 24px 46px;border-bottom-width:6px}.hero-directions li{padding:9px 0;font-size:32px;gap:18px}.music-hint{width:30px;height:54px;bottom:4px}
 .hero-routes{position:relative;left:auto;right:auto;bottom:auto;margin:0;grid-template-columns:repeat(2,minmax(0,1fr))}.hero-routes a{padding:14px 12px;font-size:10px}.hero-routes a:nth-child(2){border-right:0}.hero-routes a:nth-child(-n+2){border-bottom:1px solid #bfcbd5}
}
@media(max-width:350px){.brand{width:174px}.brand img{left:-40px;top:-46px;width:252px}.header-controls{gap:5px}.site-header{padding-inline:12px}}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 #hero-title,.hero-copy,.hero-actions,.audience-bar,[data-reveal]{opacity:1!important;transform:none!important}
}

/* Погоджена картка документального проєкту, 04.10.2026 */
.project-documentary .project-window{background:#082746;place-items:start;align-items:center;border-bottom:4px solid #ffd52a}
.project-documentary .project-window span{color:#fff;font-size:48px;line-height:.96;letter-spacing:-.055em;text-align:left}
.project-documentary .project-window span::after{content:"";display:block;width:54px;height:3px;background:#ffd52a;margin-top:20px}
.project-documentary>div:last-child p:not(.tag){color:var(--muted);font-size:15px}

/* Контрастне обрамлення УВФ; вихідне зображення незмінене. */
.funder-credit{padding-block:44px;background:#f2f5f8}
.funder-credit-grid{gap:40px}
.funder-logo-panel{flex:none;width:300px;padding:24px;background:#fff;border:1px solid #d5e0e9;box-shadow:0 8px 26px rgba(9,41,75,.07)}
.funder-credit-grid .funder-logo-panel img{display:block;width:100%;height:auto;max-width:100%;object-fit:contain;opacity:1;filter:none;transform:none;border-radius:0}
.funder-credit-grid>p{color:#2d4357;font-size:15px;line-height:1.65}
@media(max-width:760px){.funder-credit-grid{gap:24px}.funder-logo-panel{width:min(280px,100%);padding:20px}.funder-credit{padding-block:32px}}

/* 04.10 — медійна композиція з наявним візуальним активом НК. */
.hero-editorial{display:block;min-height:0;padding:138px 0 0;background:#081522;color:#fff}
.hero-editorial .hero-content{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);column-gap:80px;row-gap:24px;align-items:start;width:min(1240px,calc(100% - 64px));padding:0;margin:0 auto}
.hero-editorial .kicker{grid-column:1/-1;color:#ffd12f;margin:0;font-size:11px;letter-spacing:.15em}
.hero-editorial .kicker::before{background:#ffd12f}
.hero-editorial h1{grid-column:1;grid-row:2/4;max-width:740px;font-size:clamp(62px,6.1vw,88px);line-height:1.01;letter-spacing:-.055em;color:#fff;margin:0}
.hero-editorial .hero-word{color:#ffd12f}.hero-editorial .hero-word::after{display:none}
.hero-editorial .hero-copy{grid-column:2;grid-row:2;font-size:16px;color:#c7d3df;line-height:1.65;margin:5px 0 0;max-width:none}
.hero-editorial .hero-actions{grid-column:2;grid-row:3;gap:10px}
.hero-editorial .button-primary{background:#ffd12f;border-color:#ffd12f;color:#081522}.hero-editorial .button-primary:hover{background:#ffe17a;border-color:#ffe17a}
.hero-editorial .button-ghost{color:#fff;border-color:#708a9e}.hero-editorial .button-ghost:hover{background:#102b42;border-color:#bacbd8}
.hero-visual{width:min(1240px,calc(100% - 64px));margin:36px auto 0;padding:0}
.hero-picture{overflow:hidden;background:#0e2b42;border-top:2px solid #ffd12f}
.hero-picture img{display:block;width:100%;height:auto;max-width:none;animation:nk-panorama-arrive 2.8s ease both}
@keyframes nk-panorama-arrive{from{transform:scale(1.025)}to{transform:scale(1)}}
.hero-visual>figcaption{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:58px;color:#b7c8d6;font-size:11px;border-bottom:1px solid #344c60}
.hero-scope{display:flex;align-items:center;gap:20px;color:#fff;font-size:12px;font-weight:600}
.hero-scope .music-hint{position:static;flex:none;width:24px;height:44px;margin-left:4px}
.hero-editorial .hero-routes{position:static;width:min(1240px,calc(100% - 64px));margin:0 auto;display:flex;justify-content:space-between;border:0;background:transparent}
.hero-editorial .hero-routes a{flex:1;color:#d3e0ea;padding:20px 18px;border:0;font-size:11px}.hero-editorial .hero-routes a:first-child{padding-left:0}.hero-editorial .hero-routes a:last-child{padding-right:0}.hero-editorial .hero-routes a:hover{background:#10263b}.hero-editorial .hero-routes a>span:last-child{color:#ffd12f}
.projects-editorial{background:#081522;padding-block:88px;color:#fff}
.projects-editorial .eyebrow{color:#ffd12f}.projects-editorial .eyebrow::before{background:#ffd12f}.projects-editorial h2{font-size:44px;letter-spacing:-.04em;line-height:1.1;color:#fff}.projects-editorial .section-heading>p{color:#9fb3c4}
.project-feature{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:0;margin-top:42px;background:#10283d;border-top:1px solid #426079;overflow:hidden}
.project-feature-image{position:relative;min-height:560px;align-self:stretch;margin:0;overflow:hidden;background:#173d57}
.project-feature-image img{display:block;width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:100% center}
.project-feature-image figcaption{position:absolute;left:20px;bottom:20px;margin:0;padding:7px 10px;background:#081522e8;color:#d8e4ed;font-size:10px}
.project-feature-copy{padding:42px 40px}
.project-feature-copy .tag{font-size:10px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:#ffd12f;margin:0 0 26px}
.project-feature h3{font-size:64px;line-height:1.02;letter-spacing:-.05em;color:#fff;margin:0 0 12px}
.project-working-title,.project-translation{font-size:12px;line-height:1.5;color:#9fb6c9;margin:0 0 8px}
.project-story{font-size:17px;line-height:1.7;color:#dae4eb;margin:28px 0 30px}
.project-link{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 0;border-top:1px solid #48677e;color:#ffd12f;font-size:13px;font-weight:700}.project-link:hover{color:#fff}.project-link>span{font-size:24px}
.project-pending{margin-top:32px;border-top:1px solid #344c60}.project-pending article{display:grid;grid-template-columns:1fr 120px 1.5fr;gap:26px;align-items:center;padding:20px 0;border-bottom:1px solid #344c60}.project-pending h3{color:#b5c8d6;font-size:20px;margin:0}.project-pending p{margin:0;color:#90a9bc;font-size:12px;line-height:1.6}.project-pending .tag{color:#ffd12f;font-size:10px;font-weight:700;text-transform:uppercase}
.projects-editorial .projects-more{color:#90a9bc;font-size:12px;font-weight:500;margin-top:22px}
@media(max-width:1100px){.hero-editorial .hero-content{column-gap:40px;grid-template-columns:1.5fr 1fr}.hero-editorial h1{font-size:68px}.hero-editorial .hero-copy{font-size:15px}.project-feature-copy{padding:32px}.project-feature h3{font-size:56px}.project-story{font-size:16px}}
@media(max-width:760px){
 .hero-editorial{padding:122px 0 0}.hero-editorial .hero-content{display:block;width:calc(100% - 40px)}.hero-editorial .kicker{font-size:10px;margin-bottom:24px}.hero-editorial h1{font-size:clamp(48px,12.5vw,72px);margin-bottom:24px}.hero-editorial .hero-copy{font-size:15px;margin:0 0 26px}.hero-editorial .hero-actions{display:flex;flex-wrap:wrap;gap:10px}
 .hero-visual{width:100%;margin-top:32px}.hero-picture{border-top-width:2px}.hero-picture img{height:250px;object-fit:cover;object-position:54% center}.hero-visual>figcaption{margin-inline:20px;align-items:flex-start;flex-direction:column;gap:10px;padding:14px 0;min-height:0;font-size:10px}.hero-scope{gap:14px;font-size:11px}.hero-scope .music-hint{width:20px;height:35px;margin:0}
 .hero-editorial .hero-routes{width:calc(100% - 40px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.hero-editorial .hero-routes a{padding:16px 10px;font-size:10px}.hero-editorial .hero-routes a:nth-child(2n+1){padding-left:0}.hero-editorial .hero-routes a:nth-child(2n){padding-right:0}
 .projects-editorial{padding-block:64px}.projects-editorial h2{font-size:34px}.project-feature{display:flex;flex-direction:column;margin-top:32px}.project-feature-image{min-height:300px}.project-feature-image img{object-position:100% center}.project-feature-copy{padding:28px 24px}.project-feature-copy .tag{font-size:9px;margin-bottom:22px}.project-feature h3{font-size:48px}.project-story{font-size:16px;margin:22px 0 24px}.project-pending article{grid-template-columns:1fr auto;gap:12px;padding:20px 0}.project-pending article>p:last-child{grid-column:1/-1}.project-pending h3{font-size:18px}
}