/* Shared lower-page art direction: blue route, warm gold, open editorial sections. */
.wrap{max-width:2200px;width:100%;padding-left:4%;padding-right:4%}
.intro{display:grid;grid-template-columns:1.2fr 1fr;gap:20px 8%;text-align:left;padding-top:72px;padding-bottom:72px}
.intro .eyebrow{grid-column:1/-1;margin:0}.intro h2{font-size:clamp(28px,3vw,58px);margin:0;max-width:1000px}.intro>p:last-child{margin:0;align-self:end;font-size:clamp(15px,1.1vw,21px);max-width:650px}
.meeting-story{position:relative;background:#deecfb;--reveal:0;--intro-opacity:1;--caption-opacity:0}
.meeting-stage{position:relative;height:100svh;min-height:660px;overflow:hidden;background:linear-gradient(115deg,#edf4fd,#cce3f9)}
.meeting-enhanced:not(.meeting-reduced){height:380vh}
.meeting-enhanced:not(.meeting-reduced) .meeting-stage{position:sticky;top:0}
.meeting-intro{position:absolute;z-index:2;left:4%;top:20%;width:38%;opacity:var(--intro-opacity);pointer-events:none}
.meeting-intro h2{font-family:var(--font-heading);font-size:clamp(30px,3.1vw,64px);line-height:1.2;letter-spacing:-.035em}.meeting-intro em{color:#326bd1;font-style:normal}.meeting-intro p:not(.eyebrow){font-size:clamp(16px,1.2vw,23px);max-width:490px;color:#4b6384;line-height:1.6}.meeting-hint{display:block;margin-top:30px;font-size:13px;color:#426296}
.meeting-frame{position:absolute;inset:0;width:100%;height:100%;transform:translate(calc((1 - var(--reveal))*23%),calc((1 - var(--reveal))*-1%)) scale(calc(.55 + var(--reveal)*.45));transform-origin:center;will-change:transform;pointer-events:none}
.meeting-frame video{width:100%;height:100%;object-fit:contain;display:block;background:#cce3f9}
.meeting-caption{position:absolute;left:4%;top:5%;opacity:var(--caption-opacity);color:#182d4b;pointer-events:none;padding:20px 24px;background:#f3f7fdeb;max-width:580px;border-left:3px solid #dfb84d}
.meeting-chapter{font-size:11px;font-weight:600;letter-spacing:2px}.meeting-caption p{font-family:var(--font-heading);font-size:clamp(19px,2.2vw,38px);line-height:1.3;margin:12px 0 0;letter-spacing:-.035em}.meeting-endcard .meeting-caption{opacity:0}
.meeting-controls{position:absolute;z-index:3;left:4%;right:4%;bottom:24px;display:flex;align-items:center;gap:24px;padding:14px 20px;background:#f3f7fdf2;border-top:1px solid #afc9eb;color:#254c82}
.meeting-controls label{font-size:12px;font-weight:600;white-space:nowrap}.meeting-controls input{flex:1;min-width:70px;accent-color:#326bd1;min-height:44px}.meeting-skip{font-size:12px;min-height:44px;display:flex;align-items:center}.meeting-controls .film-link{position:static;margin:0;padding:6px 16px 6px 8px;background:transparent;box-shadow:none;width:auto;font-size:12px;min-height:44px;flex:none}.meeting-controls .film-link small{color:#526781;font-size:10px}.meeting-controls .opora-film-mark{width:32px;height:32px}.meeting-reduced .meeting-stage{height:700px;min-height:0}.meeting-reduced .meeting-controls input,.meeting-reduced .meeting-controls label{display:none}
.first-steps{padding-top:80px;padding-bottom:80px;grid-template-columns:.8fr 1.2fr;gap:7%;align-items:center}.first-steps h2{font-family:var(--font-heading);font-size:clamp(30px,3.3vw,62px);letter-spacing:-.035em}.first-steps-heading>p{font-size:clamp(15px,1vw,20px);max-width:600px}.first-steps video{width:100%;max-height:none;aspect-ratio:16/9;border-radius:0}.first-steps-media{border-top:3px solid #326bd1;padding-top:18px}.first-steps-next{min-height:44px;display:inline-flex;align-items:center;font-size:15px}.first-steps-meta{color:#526782}.first-steps-heading{border:0}.first-steps-transcript summary{min-height:44px;display:flex;align-items:center}
.possibilities{padding-bottom:80px}.section-head h2{font-family:var(--font-heading);font-size:clamp(28px,2.8vw,52px);letter-spacing:-.035em}.paths{gap:0;border-top:1px solid #b8cce7}.path{background:transparent;min-height:370px;padding:30px 5%;border:0;border-right:1px solid #b8cce7;position:relative}.path:last-child{border-right:0}.path-top{height:150px;align-items:flex-start;margin-bottom:20px}.path-top>span{padding-top:12px;max-width:40%}.path-top .path-scene{position:absolute;right:2%;top:12px;width:57%;height:170px}.path-scene canvas{width:100%;height:100%}.path h3{font-size:clamp(24px,1.8vw,37px);letter-spacing:-.035em}.path p{max-width:440px;font-size:16px}.path a{font-size:15px;min-height:52px}.also{border-top:1px solid #c5d5e9;padding-top:20px}.also span{background:none;border:0;padding:8px 16px}.also span+span:before{content:'';display:inline-block;width:11px;height:11px;margin-right:12px;background:url('assets/opora-spark.svg') center/contain no-repeat}
.join{background:#dce9fb;color:#182d4b;border-top:1px solid #bfd2ee;border-bottom:1px solid #bfd2ee}.join-inner{grid-template-columns:1.05fr 1fr;gap:7%;padding-top:80px;padding-bottom:80px;align-items:center}.join h2{font-size:clamp(30px,3.4vw,64px);max-width:1000px;letter-spacing:-.035em}.join h2 em{color:#326bd1}.join-heading>p:not(.eyebrow){color:#4e6483;font-size:clamp(16px,1.15vw,22px)}.join-emblem{position:relative;width:100%;height:310px;max-width:680px}.join-emblem canvas{width:100%;height:100%;display:block}.join-emblem>p{position:absolute;bottom:0;left:0;right:0;text-align:center;font-size:12px;color:#4c6486;letter-spacing:1px;pointer-events:none}.join-logo-fallback{position:absolute;width:48%;height:75%;object-fit:contain;left:26%;top:0}.join-emblem[data-ready] .join-logo-fallback{display:none}
.join-panel{background:#f3f7fd;border:1px solid #c1d3ee;border-radius:24px;padding:32px 7%;box-shadow:0 20px 50px #326bd10a}.role-tabs{gap:6px;padding-bottom:20px}.role-tabs button{font-size:clamp(12px,.95vw,18px);min-height:48px;padding:12px 18px;border-radius:999px}.role-tabs button[aria-selected=true]{background:#326bd1;color:white}.panel-kicker{font-size:11px;margin-top:30px}.join-panel h3{font-family:var(--font-heading);font-size:clamp(24px,2vw,39px);line-height:1.35;min-height:106px;letter-spacing:-.035em}.join-panel p:not(.panel-kicker){font-size:clamp(15px,1vw,19px);max-width:600px;line-height:1.6;min-height:72px}.join-panel ul{font-size:clamp(14px,1vw,18px);margin:28px 0}.join-panel li{display:flex;align-items:center;min-height:40px;line-height:1.5}.join-panel li:before{width:16px;height:20px;flex:none;background:transparent url('assets/opora-spark.svg') center/contain no-repeat;transform:none;border-radius:0;margin-right:14px}.join-panel .button{background:#326bd1;min-height:62px;font-size:16px;padding:16px 25px}.join-panel .button:hover{background:#2357af}
.how{padding-top:80px;padding-bottom:80px;gap:8%}.how h2,.download h2,.faq h2{font-size:clamp(30px,3vw,56px);letter-spacing:-.035em}.how li h3{font-size:20px}.how li p{font-size:16px}.how li>span{color:#326bd1}.download{max-width:2024px;background:#e2edfb}.faq summary{font-size:18px;min-height:60px}.faq details p{font-size:16px;max-width:1000px}.closing{background:#dce9fb}.closing h2{font-size:clamp(30px,3.2vw,62px)}.closing .wrap>span{width:70px;height:70px;margin:auto auto 24px;background:url('assets/opora-spark.svg') center/contain no-repeat;font-size:0}.footer-top p,.footer-bottom,.footer-note{font-size:13px}
@media(min-width:2200px){.meeting-intro{left:max(4%,calc((100% - 2024px)/2));width:35%}}
@media(max-width:1000px){.join-inner{gap:4%}.join h2{font-size:34px}.join-panel{padding:24px}.role-tabs button{padding:10px 12px}.meeting-intro{width:42%}.meeting-intro h2{font-size:33px}.meeting-controls{gap:12px}.meeting-skip{max-width:90px}.path p{font-size:14px}.join-emblem{height:260px}}
@media(max-width:700px){.wrap{padding-left:6%;padding-right:6%}.intro{grid-template-columns:1fr;gap:18px;padding-top:45px;padding-bottom:45px}.intro h2{font-size:29px}.meeting-enhanced:not(.meeting-reduced){height:340vh}.meeting-stage{height:100svh;min-height:660px}.meeting-intro{left:6%;top:6%;width:88%}.meeting-intro h2{font-size:31px;margin:14px 0}.meeting-intro p:not(.eyebrow){font-size:15px;max-width:400px}.meeting-intro .eyebrow{font-size:9px}.meeting-hint{font-size:12px;margin-top:16px}.meeting-frame{transform:translate(0,calc((1 - var(--reveal))*16%)) scale(calc(.88 + var(--reveal)*.12))}.meeting-frame video{object-fit:contain}.meeting-caption{left:6%;right:6%;top:5%;padding:15px 18px}.meeting-caption p{font-size:22px}.meeting-controls{left:4%;right:4%;bottom:18px;padding:10px 12px;display:grid;grid-template-columns:1fr 1fr;gap:2px 12px}.meeting-controls input{grid-column:2;grid-row:1}.meeting-controls .film-link{padding:5px 0;font-size:11px;grid-column:1;grid-row:2;white-space:normal}.meeting-controls .film-link small{display:none}.meeting-skip{grid-column:2;grid-row:2;font-size:11px;max-width:none;justify-content:end}.meeting-controls .opora-film-mark{display:none}.meeting-reduced .meeting-stage{height:720px}.first-steps{grid-template-columns:1fr;padding-top:45px;padding-bottom:45px;gap:25px}.first-steps h2{font-size:31px}.first-steps-heading>p{font-size:15px}.first-steps-next{font-size:14px}.paths{grid-template-columns:1fr}.path{border-right:0;border-bottom:1px solid #b8cce7;padding:28px 0;min-height:330px}.path-top{height:120px}.path-top .path-scene{height:160px;width:48%}.path h3{font-size:26px}.path p{font-size:15px;max-width:90%}.path a{font-size:14px}.also{font-size:12px;gap:0}.join-inner{grid-template-columns:1fr;padding-top:45px;padding-bottom:45px;gap:20px}.join h2{font-size:31px}.join-emblem{height:240px;margin-top:10px}.join-heading>p:not(.eyebrow){font-size:15px}.join-panel{padding:20px}.join-panel h3{font-size:25px;min-height:92px}.join-panel p:not(.panel-kicker){font-size:15px;min-height:78px}.join-panel ul{font-size:14px;margin:20px 0}.role-tabs{gap:0}.role-tabs button{font-size:12px;padding:10px 12px}.join-panel .button{font-size:14px}.how{padding-top:45px;padding-bottom:45px}.how li h3{font-size:17px}.how li p,.faq details p{font-size:14px}.faq summary{font-size:15px}.footer-note{font-size:11px}.section-head h2{font-size:29px}}
@media(prefers-reduced-motion:reduce){.meeting-story{height:auto!important}.meeting-stage{position:relative!important}.meeting-frame{will-change:auto}}
.download.wrap{width:calc(100% - 8%);margin-left:auto;margin-right:auto}
@media(min-width:701px){.meeting-caption{top:0;left:4%;right:4%;max-width:none;display:flex;gap:24px;align-items:center;background:none;border:0;padding:9px 0}.meeting-caption p{font-size:18px;margin:0}.meeting-chapter{font-size:10px}}

/* Six directions: Ukrainian Fixel Display, licensed under SIL OFL. */
.experience .direction-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.experience .direction,.experience .direction:first-child{padding:22px 30px 30px;border-right:1px solid #bfd1eb;border-bottom:1px solid #bfd1eb;overflow:hidden;min-width:0}
.experience .direction:nth-child(3n){border-right:0}
.experience .direction h3{font-family:var(--font-heading);font-weight:600;font-size:clamp(27px,2.5vw,45px);letter-spacing:-.035em;line-height:1.15;display:inline-block;color:#234f93;background:linear-gradient(110deg,#1d3658 15%,#235dba 37%,#537ac2 46%,#315b9e 56%,#1d3658 70%);background-size:220% 100%;background-position:0% 50%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;transition:background-position .8s ease}
.experience .direction:hover h3,.experience .direction:focus-visible h3{background-position:100% 50%}
.experience .direction p{font-size:15px;max-width:380px;min-height:48px}.experience .direction .icon-scene{height:205px;max-width:290px}
.experience .direction:before{content:'';position:absolute;left:30px;right:30px;bottom:0;height:3px;background:#d7ad42;transform:scaleX(0);transform-origin:left;transition:transform .4s ease}.experience .direction:hover:before,.experience .direction:focus-visible:before{transform:scaleX(1)}
.experience .route-choices a,.experience .route-choices button{font-family:var(--font-heading);font-size:16px;font-weight:600;color:#244c84;min-height:46px;display:flex;align-items:center;border:0;border-bottom:1px solid #c3d3ea;background:none;text-align:left;padding:8px 0;pointer-events:auto}
.experience .route-choices a:hover,.experience .route-choices button:hover{color:#2868d1;border-bottom-color:#d3aa40}
.experience .scene-wrap{bottom:35px}.experience .scene-caption{bottom:20px}
@media(max-width:1000px){.experience .direction-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.experience .direction:nth-child(3n){border-right:1px solid #bfd1eb}.experience .direction:nth-child(2n){border-right:0}}
@media(max-width:600px){.experience .direction-grid{grid-template-columns:1fr}.experience .direction,.experience .direction:first-child,.experience .direction:nth-child(3n){padding:18px 20px 26px;border-right:0}.experience .direction h3{font-size:32px}.experience .direction .icon-scene{height:200px}.experience .scene-wrap{bottom:32px}.experience .scene-caption{bottom:10px}.experience .route-choices a,.experience .route-choices button{font-size:14px}}
@media(prefers-reduced-motion:reduce){.experience .direction h3,.experience .direction:before{transition:none}.experience .direction h3{background:none;-webkit-text-fill-color:currentColor}}

.experience .route-choices a{gap:10px}.experience .route-choices a:before{content:'';background:url('assets/opora-spark.svg') center/contain no-repeat;width:12px;height:12px;flex:none}

/* Actionable road stops and consistent bright-blue UI surfaces. */
:root{--action-blue:#2868d1;--action-hover:#245fc7;--surface-blue:#dce9fb;--surface-paper:#f3f7fd}
.button.dark,.button.primary,.experience .primary,.join-panel .button,.store-link{background:var(--action-blue);color:#fff}
.button.dark:hover,.button.primary:hover,.experience .primary:hover,.join-panel .button:hover,.store-link:hover{background:var(--action-hover)}
.phone{border-color:var(--action-blue);background:var(--surface-paper)}.phone-island{background:var(--action-blue)}
.film-stage,.first-steps-media video{background:var(--surface-blue)}.film-controls{background:var(--surface-paper)}
dialog::backdrop{background:#c2d9f2d9}.store-link{border-color:var(--action-blue)}
.experience .station-label{opacity:1;pointer-events:auto;z-index:1;display:flex;gap:12px;align-items:center;min-height:66px;padding:12px 16px;background:var(--action-blue);color:white;border:2px solid #fff;border-radius:16px;box-shadow:0 0 0 5px #75a8ef33,0 10px 26px #2868d133;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .2s,box-shadow .2s}
.experience .station-label[hidden]{display:none!important}
.experience .station-label .station-number{font-size:12px;color:#ffe18a;font-weight:600;align-self:flex-start;padding-top:3px}
.experience .station-label .station-copy{display:flex;flex-direction:column;gap:2px;color:white}
.experience .station-label strong{font:600 19px/1.15 var(--font-heading)}.experience .station-label small{font:600 11px/1.4 var(--font-body);color:white}
.experience .station-label img{flex:none;margin-left:5px;transition:transform .25s}
.experience .station-label:hover,.experience .station-label:focus-visible{background:var(--action-hover);box-shadow:0 0 0 6px #ffd14980,0 14px 32px #2868d13d}
.experience .station-label:focus-visible{outline:3px solid #b77a00;outline-offset:5px}
.experience .station-label:hover img,.experience .station-label:focus-visible img{transform:rotate(20deg) scale(1.15)}
@media(max-width:600px){.experience .station-label{gap:9px;min-height:60px;padding:10px 12px;border-radius:13px}.experience .station-label strong{font-size:17px}.experience .station-label small{font-size:10px}.experience .station-label img{width:17px;height:17px;margin-left:0}}
@media(prefers-reduced-motion:reduce){.experience .station-label,.experience .station-label img{transition:none}}

/* Shared rounded controls and brand marks, including alternate role states. */
:root{--control-radius:999px;--panel-radius:24px;--brand-gold:#ffd028}
.role-tabs{flex-wrap:wrap;gap:8px}.role-tabs button{border-radius:var(--control-radius);transition:background .2s,color .2s,box-shadow .2s}
.role-tabs button[aria-selected=true]{background:var(--action-blue);color:#fff}
.role-tabs button:not([aria-selected=true]):hover{background:#e0ecfc;color:var(--action-blue)}
.role-tabs button:focus-visible{outline:3px solid #ba870d;outline-offset:3px}
.join-panel,dialog{border-radius:var(--panel-radius)}
.opora-action-mark .opora-ribbon{stroke:var(--action-blue)}
.opora-action-mark .opora-spark{fill:var(--brand-gold)}
.button .opora-action-mark .opora-ribbon,.round-arrow .opora-action-mark .opora-ribbon{stroke:#fff}
.opora-film-mark{color:var(--action-blue)}
.path a{color:var(--action-blue);border-radius:16px;padding:10px 12px;margin-left:-12px;margin-right:-12px;transition:background .2s}
.path a:hover,.path a:focus-visible{background:#e1ecfc}
.path a:focus-visible,.also a:focus-visible{outline:3px solid #ba870d;outline-offset:4px}
.also{display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding-top:24px}
.also .also-title{font-weight:600;padding:0 8px 0 0;color:#182d4b}
.also a{display:inline-flex;align-items:center;justify-content:space-between;gap:16px;min-height:48px;padding:10px 18px;border:1px solid #b9cfed;border-radius:var(--control-radius);color:var(--action-blue);background:#edf4fe;font-weight:600;font-size:14px;text-decoration:none;transition:background .2s,border-color .2s,box-shadow .2s}
.also a img{flex:none;transition:transform .2s}.also a:hover,.also a:focus-visible{background:#dfecff;border-color:var(--action-blue);box-shadow:0 4px 12px #2868d114}.also a:hover img{transform:rotate(20deg)}
.also .also-note{flex-basis:100%;color:#526781;font-size:12px;margin-top:2px}
@media(max-width:700px){.role-tabs{gap:4px}.role-tabs button{padding:10px 12px;min-height:44px}.also .also-title{flex-basis:100%;padding:0;margin-bottom:2px}.also{gap:10px}.also a{font-size:13px;padding:10px 14px;gap:10px}.also .also-note{line-height:1.5}}
@media(prefers-reduced-motion:reduce){.role-tabs button,.path a,.also a,.also a img{transition:none}.also a:hover img{transform:none}}

/* Handwritten notes occupy measured empty space, never a white cover over the road. */
.experience .support-message{position:absolute;top:0;left:0;width:350px;z-index:2;pointer-events:none;background:none;padding:0;will-change:transform}
.experience .support-message[hidden]{display:none}
.experience #note-svg{display:block;width:100%;height:auto;overflow:visible}
.experience #note-pencil{filter:drop-shadow(2px 3px 2px #a5792130)}
.experience .note-accessible{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
body.no-webgl .support-message{display:none}
@media(prefers-reduced-motion:reduce){.experience .support-message{will-change:auto}}
/* Reserve a writing margin between the mobile introduction and the moving scene. */
@media(max-width:600px){.experience .scene-wrap{top:520px}}

/* More physical scroll space keeps handwriting readable on trackpads and touchscreens. */
.experience .journey{height:850vh}
@media(max-width:600px){.experience .journey{height:850vh}}
body.reduced .experience .journey,body.no-webgl .experience .journey,body:not([data-ready="true"]) .experience .journey{height:auto;min-height:100svh}

/* Optional depth follows the main journey without repeating its full card sequence. */
.onboarding-guide{margin:32px auto;border-top:1px solid #bfd1eb;border-bottom:1px solid #bfd1eb}
.onboarding-guide>summary,.support-paths>summary{cursor:pointer;min-height:56px;padding:20px 0;color:var(--action-blue);font-weight:600}
.onboarding-guide>summary span{font-size:13px;font-weight:400;margin-left:16px;color:#526781}
.onboarding-guide .first-steps{padding-top:24px;padding-bottom:32px}
.support-paths{margin:24px 0;border-bottom:1px solid #bfd1eb}
.support-paths .paths{padding-bottom:24px}
.onboarding-guide>summary:focus-visible,.support-paths>summary:focus-visible{outline:3px solid #ba870d;outline-offset:4px}

/* Size the mobile stage from available browser space, not a tall desktop minimum. */
@media(max-width:700px){
 .experience .stage{height:100svh;min-height:0;max-height:none;display:grid;grid-template-rows:auto 132px minmax(0,1fr);padding:80px 0 12px;box-sizing:border-box}
 .experience .copy{position:relative;grid-row:1;top:auto;left:auto;width:auto;margin:0 6%;align-self:start}
 .experience #chapter-copy{height:var(--chapter-copy-height,auto)}
 .experience .support-message{position:relative;grid-row:2;align-self:center;justify-self:center;top:auto;left:auto;transform:none!important}
 .experience .copy h1{font-size:clamp(26px,7.1vw,34px);line-height:1.14}
 .experience .copy .eyebrow{font-size:9px;margin:0 0 12px}
 .experience .description{font-size:14px;line-height:1.45;margin:12px 0 0;min-height:0;max-width:340px}
 .experience .actions{margin-top:14px}
 .experience .primary{font-size:13px;min-height:44px;padding-top:7px;padding-bottom:7px}
 .experience .scene-wrap{position:relative;grid-row:3;top:auto;bottom:auto;left:auto;right:auto;width:100%;height:100%;min-height:0;mask-image:none;-webkit-mask-image:none}
 .experience .scroll-note,.experience .scene-caption{display:none}
 body.reduced .experience .journey,body.no-webgl .experience .journey{min-height:100svh}
 .experience .interaction-hint{display:none}
 .experience .direction-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .experience .direction,.experience .direction:first-child{display:flex;flex-direction:column;min-height:0}
 .experience .direction-link{margin-top:auto}
 .experience .direction,.experience .direction:first-child,.experience .direction:nth-child(3n){padding:16px 12px 22px;border-right:0}
 .experience .direction:nth-child(odd){border-right:1px solid #bfd1eb}
 .experience .direction .icon-scene{float:none;height:130px;width:100%;margin:0 auto}
 .experience .direction-index{margin-top:8px}
 .experience .direction h3{display:block}
 .experience .direction p{max-width:100%}
 .experience .direction h3{font-size:clamp(18px,5.4vw,23px);line-height:1.15}
 .experience .direction p{font-size:13px;min-height:60px}
 .experience .direction-link{font-size:11px;gap:6px}
 .onboarding-guide>summary span{display:block;margin:6px 0 0 20px}
 .possibilities{padding-top:36px;padding-bottom:36px}
 .possibilities .small-note{display:none}
 .possibilities .section-head h2{font-size:27px}
 .possibilities .also{margin-top:20px}
 .meeting-stage{height:100svh;min-height:0}
 .meeting-intro{top:6%;left:6%;width:88%}
 .meeting-intro h2{font-size:clamp(26px,7.3vw,36px);margin:12px 0}
 .meeting-intro p:not(.eyebrow){font-size:14px;line-height:1.5}
 .meeting-hint{margin-top:16px}
 .meeting-frame{inset:0;width:100%;height:100%;border-radius:calc((1 - var(--reveal))*24px);overflow:hidden;background:#cce3f9;transform:translateY(calc((1 - var(--reveal))*28%)) scale(calc(.88 + var(--reveal)*.12))}
 .meeting-frame video{position:absolute;top:50%;left:0;width:100%;height:auto;transform:translateY(-50%);object-fit:contain;background:transparent;mask-image:linear-gradient(to bottom,transparent,#000 2%,#000 98%,transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 2%,#000 98%,transparent)}
 .meeting-caption{top:9%;left:7%;right:7%;max-width:none;background:none;border:0;padding:0}
 .meeting-caption p{font-family:var(--font-heading);font-size:clamp(25px,7.2vw,36px);line-height:1.25;margin-top:14px;letter-spacing:-.035em}
 .meeting-reduced .meeting-stage{height:100svh;min-height:560px}
}
@media(max-width:700px) and (max-height:670px){
 .experience .stage{padding-top:76px;grid-template-rows:auto 112px minmax(0,1fr)}
 .experience .copy h1{font-size:26px}
 .experience .copy .eyebrow{margin-bottom:8px;font-size:8px}
 .experience .description{font-size:12px;margin-top:8px}
 .experience .actions{margin-top:10px}
 .meeting-intro p:not(.eyebrow){display:none}
}

/* The header reservation follows native scroll instead of remaining as a blank band. */
@media(max-width:700px){
 .experience .stage{padding-top:var(--header-inset,80px)}
}
/* Fixel carries navigation and utility headings; Manrope stays readable for body copy. */
:root{--opora-ink:#243d60;--opora-link:#2864cb}
button,input,select,textarea{font:inherit}
.experience header nav,.experience .header-action,#menu-toggle,.role-tabs button,
.onboarding-guide>summary,.support-paths>summary,.faq summary,.also a,
.experience .guide-strip a,.first-steps-next,.path a{font-family:var(--font-heading);font-weight:600}
.path h3,.first-steps-transcript summary{font-family:var(--font-heading);font-weight:600}
.onboarding-guide>summary,.support-paths>summary{position:relative;list-style:none;padding:22px 48px 22px 0;font-size:clamp(17px,1.5vw,23px);letter-spacing:-.02em;line-height:1.4}
.onboarding-guide>summary::-webkit-details-marker,.support-paths>summary::-webkit-details-marker{display:none}
.onboarding-guide>summary:after,.support-paths>summary:after{content:'';position:absolute;right:0;top:50%;width:32px;height:32px;margin-top:-16px;background:#e0ebfc url('assets/opora-spark.svg') center/15px no-repeat;border:1px solid #c1d4ef;border-radius:50%;transition:transform .25s,background-color .25s}
.onboarding-guide[open]>summary:after,.support-paths[open]>summary:after{transform:rotate(45deg);background-color:#cbdffd}
.onboarding-guide>summary span{font-family:var(--font-body);letter-spacing:0}
.menu-symbol{width:26px;height:26px;flex:none;overflow:visible}
.menu-stroke{fill:none;stroke:#326bd1;stroke-width:2.3;stroke-linecap:round;transform-origin:center;transition:transform .22s}
.menu-star{fill:#dfb546;transition:opacity .2s}
#menu-toggle[aria-expanded=true] .menu-stroke-a{transform:translateY(4px) rotate(32deg)}
#menu-toggle[aria-expanded=true] .menu-stroke-b{transform:translateY(-5px) rotate(-32deg)}
#menu-toggle[aria-expanded=true] .menu-star{opacity:0}
@media(max-width:800px){
 .experience header{gap:8px}
 .experience .brand img{width:116px;object-fit:contain}
 #menu-toggle{display:flex;align-items:center;gap:8px;padding:6px 12px;border:1px solid #c7d8ee;border-radius:999px;background:#e8f0fc;color:var(--opora-link);font-size:14px;min-height:44px}
 .experience .header-action{border:0;padding:8px 4px;min-height:44px;display:flex;align-items:center;color:var(--opora-link)}
 .experience header nav{top:66px;left:-1%;right:-1%;padding:22px 22px 16px;border:1px solid #c3d6f0;border-radius:24px;background:linear-gradient(135deg,#f6f9ff 20%,#e3edfc);box-shadow:0 18px 44px #326bd120;gap:0;counter-reset:menu-item;max-height:calc(100svh - 84px);overflow-y:auto;isolation:isolate}
 .experience header nav:before{content:'ТВОЯ OPORA ПОРУЧ';font-family:var(--font-body);color:#637b9b;font-size:9px;letter-spacing:2px;margin:0 0 16px;padding-left:2px}
 .experience header nav a{position:relative;gap:14px;min-height:62px;font-size:23px;line-height:1.2;letter-spacing:-.035em;border:0;border-top:1px solid #cbdaf0;color:#2864cb;padding:12px 28px 12px 0;transition:color .2s,background-color .2s}
 .experience header nav a:before{counter-increment:menu-item;content:'0' counter(menu-item);font-family:var(--font-body);font-size:10px;font-weight:600;letter-spacing:0;color:#7288a8}
 .experience header nav a:after{content:'';position:absolute;right:0;width:15px;height:15px;background:url('assets/opora-spark.svg') center/contain no-repeat;transition:transform .2s}
 .experience header nav a:hover,.experience header nav a:focus-visible{color:#174eab;background:#dbe8fa;border-color:#cbdaf0}
 .experience header nav a:hover:after{transform:rotate(25deg) scale(1.15)}
 .onboarding-guide>summary span{margin-left:0}
}
@media(prefers-reduced-motion:reduce){.menu-stroke,.menu-star,.experience header nav a,.experience header nav a:after,.onboarding-guide>summary:after,.support-paths>summary:after{transition:none}}

/* Partnership and support are visible invitations, never hidden tabs. */
.join-inner{grid-template-columns:.85fr 1.15fr;gap:5%}
.join-actions{display:grid;grid-template-columns:1fr 1fr;gap:18px;min-width:0}
.join-invitation{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;text-align:left;min-width:0;min-height:360px;padding:30px 26px 24px;border-radius:28px;border:1px solid transparent;cursor:pointer;transition:transform .24s,box-shadow .24s}
.join-partner{background:#2864cf;color:#fff;box-shadow:0 14px 36px #326bd122}
.join-support{background:#f7d568;color:#264b85;border-color:#edc34c}
.invitation-kicker{font-family:var(--font-body);font-size:9px;font-weight:600;letter-spacing:1.4px;line-height:1.7;max-width:240px}
.join-invitation strong{position:relative;z-index:1;font-family:var(--font-heading);font-weight:600;font-size:clamp(28px,2.8vw,48px);line-height:1.05;letter-spacing:-.035em;margin:28px 0 18px}
.invitation-copy{position:relative;z-index:1;font:400 15px/1.6 var(--font-body);max-width:300px}
.invitation-action{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:30px;font:600 15px/1.3 var(--font-heading)}
.invitation-action img{flex:none}.join-support .invitation-action img{filter:brightness(.65) saturate(1.4)}
.invitation-art{position:absolute;z-index:0;width:140px;height:140px;right:-22px;top:28px;opacity:.13;transform:rotate(-12deg);pointer-events:none}
.join-invitation:hover{transform:translateY(-4px);box-shadow:0 20px 42px #326bd12b}
.join-invitation:focus-visible{outline:3px solid #326bd1;outline-offset:5px}
.join-person{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:64px;padding:12px 4px;color:#47658b;text-decoration:none;font:400 14px/1.5 var(--font-body)}
.join-person strong{font:600 16px/1.3 var(--font-heading);color:#2864cf;display:flex;align-items:center;gap:12px}
@media(max-width:1100px){.join-inner{grid-template-columns:1fr}.join-heading{max-width:850px}.join-emblem{height:220px}.join-actions{gap:16px}.join-invitation{min-height:310px}.join-invitation strong{font-size:38px}}
@media(max-width:700px){.join-actions{grid-template-columns:1fr;gap:16px}.join-invitation{min-height:278px;padding:26px;border-radius:26px}.join-invitation strong{font-size:38px;margin-top:22px}.invitation-copy{font-size:14px;max-width:290px}.invitation-action{padding-top:24px;font-size:16px}.invitation-art{right:10px;top:42px;width:130px;height:130px}.join-person{flex-direction:column;align-items:flex-start;gap:8px;padding:12px 6px}.join-heading h2{font-size:29px}.join-emblem{height:180px}}
@media(prefers-reduced-motion:reduce){.join-invitation{transition:none}.join-invitation:hover{transform:none}}

/* Keep interface labels in the shared reading family. */
.experience .route-choices a,.experience .route-choices button,
.experience .guide-strip a,.first-steps-next,.path a,
.first-steps-transcript summary,.invitation-action,.join-person strong{font-family:var(--font-body);font-weight:600}
button,.experience .primary,.experience .header-action{font-weight:600}

/* Only shown when scroll playback is unavailable or motion is reduced. */
.meeting-recovery{position:absolute;z-index:4;left:50%;bottom:calc(84px + env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:10px;min-height:48px;max-width:90%;padding:14px 24px;border:1px solid #fff;border-radius:999px;background:var(--action-blue,#326bd1);color:#fff;font:inherit;font-size:16px;font-weight:600;white-space:nowrap;cursor:pointer;box-shadow:0 8px 24px #326bd120}
.meeting-recovery[hidden]{display:none}
.meeting-recovery:focus-visible{outline:3px solid #b5811e;outline-offset:4px}