/* Alpha v22: final responsive rules. The v21 composition and assets are retained. */
html[lang="uk"],html[lang="uk"] .page,html[lang="uk"] .case-page,
html[lang="uk"] button,html[lang="uk"] .email-dialog,
html[lang="uk"] .remote-badge-ua{font-family:'Barlow Condensed','Arial Narrow',sans-serif}
html[lang="uk"] .intro-title{font-weight:900;line-height:.92;font-size:clamp(60px,4.6vw,95px);letter-spacing:-.015em}
html[lang="uk"] .intro-description,html[lang="uk"] .project-description{font-weight:500}
html[lang="uk"] .site-title,html[lang="uk"] .section-heading h2,
html[lang="uk"] .case-hero h1,html[lang="uk"] .email-dialog h2{font-weight:900}
html[lang="uk"] .project-headline{font-weight:900}
html[lang="uk"] .personal-main .remote-badge-ua{padding:14px;font-size:clamp(13px,1.05vw,20px);line-height:1;aspect-ratio:1;height:auto;box-sizing:border-box}
/* The old end spacer existed solely to force an anchor's scroll position. */
.closing-section{margin-bottom:0}
.site-footer{margin-top:clamp(20px,2vw,32px)}
.toast{max-width:calc(100vw - 28px);white-space:normal;text-align:center}
.inquru-peek-window{position:absolute;z-index:2;left:0;top:0;width:100%;height:132%;overflow:hidden;pointer-events:none}
.inquru-peek-canvas{position:absolute;top:0;left:0;width:100%;height:var(--scene-height,100%)}
.project-inquru .inquru-leg-window{display:none!important}
.image-card__caption{min-height:72px;width:100%;flex:1}
.image-card__label{min-width:0;overflow-wrap:anywhere}
.image-card[hidden]{display:none!important}
.email-dialog[open]{overflow-y:auto;overscroll-behavior:contain}
body:has(.email-dialog[open]){overflow:hidden}
.case-info,.process-card,.closing-about__content,.closing-contact__content{min-width:0}
.case-info strong,.process-card h3{overflow-wrap:break-word}
@media(min-width:1101px){
 .project-inquru .inquru-stage{left:0!important}
 .project-inquru .inquru-peek-window{border-radius:calc(var(--radius) - 3px) calc(var(--radius) - 3px) 0 0}
}
@media(min-width:1551px){
 html[lang="uk"] .personal-main .remote-badge-ua{top:46%;right:4%;width:clamp(110px,7vw,140px);font-size:15px;padding:13px}
 html[lang="uk"] .personal-main .star-doodle{display:none}
}
@media(min-width:1101px) and (max-width:1550px){
 html[lang="uk"] .intro-title{font-size:clamp(49px,4.5vw,70px)}
 html[lang="uk"] .personal-main .remote-badge-ua{font-size:13px}
 .tag-row{max-width:calc(100% - 28px)}
 .tag-row span{font-size:clamp(12px,1vw,17px);padding-inline:7px}
 .project-wake .wake-description,.project-fylto .fylto-description{bottom:22%}
}
@media(min-width:681px) and (max-width:1100px){
 html[lang="uk"] .intro-title{font-size:clamp(65px,8.5vw,93px)}
 html[lang="uk"] .personal-main .remote-badge-ua{font-size:17px;padding:19px}
 .project-wake .wake-description,.project-fylto .fylto-description{bottom:23%}
 .tag-row{max-width:calc(100% - 28px)}
 .project-inquru .inquru-main-character{max-height:91%;object-fit:contain;object-position:right center;top:5%}
}

@media(max-width:680px){
 html[lang="uk"] .intro-title{font-size:clamp(40px,10.8vw,72px);line-height:.9;letter-spacing:-.025em}
 html[lang="uk"] .personal-main .remote-badge-ua{font-size:clamp(11px,3vw,15px);padding:12px}
 .intro-description{line-height:1.12}
 .project-inquru .inquru-peek-canvas{height:100%}
 .project-inquru .inquru-peek-window{height:100%}
 .project-inquru .inquru-description{max-width:53%!important;font-size:clamp(17px,4.55vw,25px)!important;line-height:1.12!important}
 html[lang="uk"] .project-inquru .inquru-description{font-size:clamp(17px,4.55vw,25px)!important}
 .project-inquru .inquru-peek-character{right:0!important}
 .project-wake .wake-description,.project-fylto .fylto-description{bottom:17%}
 .project-wake .wake-headline{bottom:32%}
 .tag-row{max-width:calc(100% - 26px)}
 .image-card__caption{min-height:66px}
 .closing-section h2{font-size:clamp(57px,14.5vw,94px);line-height:.92}
 .closing-contact__content .closing-mail{font-size:clamp(24px,6.5vw,34px);padding-inline:17px}
 .site-footer{margin-top:22px;line-height:1.2}
 .case-header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;padding:16px 0}
 .case-header .site-title{grid-row:1;grid-column:1;font-size:clamp(22px,5.3vw,30px);letter-spacing:-.02em}
 .case-header .lang-switch{grid-row:1;grid-column:2;font-size:15px;margin:0}
 .case-header .lang-switch a{padding:7px 9px}
 .case-header .case-back{grid-row:2;grid-column:1/-1;justify-self:start;margin:0;font-size:17px;padding:8px 12px}
 html[lang="uk"] .case-header .case-back{font-size:17px}
 .case-hero--wake{min-height:0;padding-bottom:clamp(205px,58vw,365px)}
 .case-hero--wake .case-hero-content{padding:22px}
 .case-hero--wake .case-boat{max-height:none;width:92%;height:clamp(200px,56vw,355px);bottom:0;right:0;object-fit:contain}
 .case-hero--wake .case-actions{grid-template-columns:1fr;gap:9px}
 .case-hero--wake .case-action{font-size:20px;padding:11px}
 .case-hero--wake .case-hero-content p{max-width:100%;margin-bottom:0}
 .game-stage{aspect-ratio:2/3}
 .game-idle__eyebrow,.game-idle__bottom{font-size:clamp(13px,3.6vw,19px)}
 .game-stage .game-launch{font-size:clamp(19px,5vw,28px);gap:10px;padding:13px 16px}
 .process-card h3{font-size:clamp(47px,13vw,72px);line-height:.95}
 .process-heading h2{font-size:clamp(57px,15vw,94px);line-height:.9}
 .game-heading h2{font-size:clamp(43px,12vw,80px);line-height:.95}
}
@media(max-width:430px){
 .image-card__caption{grid-template-columns:minmax(0,1fr) 18px;column-gap:5px;row-gap:7px;align-content:start}
 .image-card__num{grid-column:1;grid-row:1}
 .image-card__arrow{grid-column:2;grid-row:1;align-self:center;font-size:22px}
 .image-card__label{grid-column:1/-1;grid-row:2;font-size:clamp(19px,5.1vw,23px);line-height:1.06}
}
@media(min-width:681px) and (max-width:900px){
 .site-header .main-nav{display:none}
 .mobile-nav-toggle{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:43px;height:40px;border:2px solid #111;border-radius:12px;background:transparent}
 .mobile-nav-toggle span{display:block;width:20px;height:2px;background:#111}
 .mobile-nav:not([hidden]){display:flex;flex-direction:column;gap:12px;padding:18px;border:2px solid #111;border-radius:15px;margin-bottom:14px;font-size:23px;font-weight:800}
 .site-header .site-title{margin-right:auto}
}
@media(max-width:360px){
 .site-header .site-title{font-size:19px;letter-spacing:-.7px}
 .site-header .lang-switch{font-size:15px}
 .site-header .lang-switch a{padding:7px 8px}
 .personal-main .intro-cta{left:16px!important}
 html[lang="uk"] .pill{font-size:18px;padding-inline:10px}
 .personal-main .remote-badge,html[lang="uk"] .personal-main .remote-badge-ua{right:1%!important;width:90px!important}
}

/* Short desktop windows may scroll: keep copy and actions in distinct bands. */
@media(min-width:1551px) and (max-height:820px){
 .showcase{height:760px}
 html[lang="uk"] .personal-main .remote-badge-ua{display:none}
}
@media(min-width:1101px) and (max-width:1550px){
 html[lang="uk"] .personal-main .remote-badge-ua{top:46%;width:100px;font-size:12px;padding:10px}
}

@media(min-width:551px) and (max-width:680px){
 .personal-main .remote-badge,html[lang="uk"] .personal-main .remote-badge-ua{top:37%!important;width:110px!important}
 .personal-main .intro-description{max-width:65%}
}
@media(min-width:681px) and (max-width:750px){
 .case-hero--wake{min-height:0;padding-bottom:365px}
 .case-hero--wake .case-boat{height:355px;max-height:none;width:92%;bottom:0;right:0;object-fit:contain}
}
@media(prefers-reduced-motion:reduce){
 html.inquru-ready .project-inquru .inquru-stage *{transition:none!important;animation:none!important}
}