/* Full-viewport journey: the wireframe fills the first screen, copy floats on top. */
header{position:absolute;top:0;left:0;right:0;z-index:30;background:transparent}
.hero{position:relative;height:100dvh;min-height:100dvh;display:flex;flex-direction:column;justify-content:space-between;padding-top:112px}
.hero-top,.hero-bottom{position:relative;z-index:4}
.hero-layout{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;min-height:0}
.hero-copy{position:absolute;top:clamp(168px,22vh,250px);left:5%;right:5%;bottom:auto;z-index:2;display:grid;grid-template-columns:1.35fr 1fr;grid-template-rows:auto auto;gap:0 60px;padding:28px 0 38px;align-items:center;background:none;pointer-events:none}
.hero-copy a{pointer-events:auto}
.hero h1{grid-row:1/3;font-size:clamp(52px,5.2vw,82px);line-height:1.2;letter-spacing:-3px;margin:0}
.hero h1 br{display:none}
.hero-copy p{align-self:end;font-size:15px;line-height:1.9}
.hero-actions{margin-top:22px;align-self:start;gap:28px}
.visual{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;align-self:stretch}
.label-top{top:auto;bottom:22%;left:5%}
.label-bottom{bottom:78px;right:5%}
.coordinate{right:auto;top:auto;bottom:78px;left:5%;transform:none;font-size:10px}
.hero-bottom{margin-top:0}
@media(min-width:1550px){
  .hero-copy{left:max(5%,calc((100% - 1400px)/2));right:max(5%,calc((100% - 1400px)/2))}
  .label-top,.coordinate{left:max(5%,calc((100% - 1400px)/2))}
  .label-bottom{right:max(5%,calc((100% - 1400px)/2))}
}
@media(max-width:1050px){
  .hero-copy{top:clamp(156px,20vh,210px);grid-template-columns:1.15fr 1fr;gap:0 32px;padding-top:20px}
  .hero h1{font-size:clamp(48px,5.5vw,65px);letter-spacing:-2px}
  .hero h1 br{display:block}
  .hero-copy p{font-size:14px}
  .hero-actions{gap:20px}
  .visual{top:0;left:0;width:100%;height:100%}
  .label-top{top:auto;bottom:24%}
}
@media(max-width:650px){
  .hero{height:100dvh;min-height:100dvh;padding-top:92px}
  .hero-copy{top:112px;left:6%;right:6%;display:block;padding:16px 0 24px;background:none}
  .hero h1{font-size:clamp(35px,8.2vw,49px);line-height:1.2;margin-bottom:15px;letter-spacing:-1.5px}
  .hero h1 br{display:none}
  .hero-copy p{font-size:14px}
  .hero-actions{margin-top:16px;gap:24px}
  .visual{top:0;left:0;width:100%;height:100%;margin-top:0}
  .label-top{top:auto;bottom:28%;left:6%;font-size:9px}
  .label-bottom{bottom:86px;right:6%;font-size:9px}
  .coordinate{display:none}
  .hero-bottom{margin-top:0}
}

.language-toggle{font-size:12px;color:var(--blue);border:1px solid var(--line);padding:8px 12px;white-space:nowrap}
html[lang=en] .hero h1{font-size:clamp(38px,4.2vw,66px);letter-spacing:-2px}html[lang=en] .hero h1 br{display:block}html[lang=en] h3{font-size:22px}html[lang=en] .about-layout h2{font-size:clamp(38px,4.2vw,64px)}
@media(max-width:650px){nav{gap:10px}.language-toggle{padding:7px 9px}html[lang=en] .hero h1{font-size:clamp(32px,8vw,46px);letter-spacing:-1px}html[lang=en] .hero-actions{gap:14px}html[lang=en] .hero-actions a{font-size:12px}html[lang=en] .hero-copy p{font-size:13px}html[lang=en] .label-top{top:auto;bottom:32%}html[lang=en] .section-heading h2,html[lang=en] .contact-layout h2{font-size:36px}html[lang=en] .principles{flex-wrap:wrap}}

.send-progress{height:4px;background:var(--line);overflow:hidden;margin-top:20px;border-radius:4px}
.send-progress[hidden]{display:none}
.send-progress span{display:block;width:35%;height:100%;background:var(--blue);animation:sending-slide 1.2s ease-in-out infinite}
@keyframes sending-slide{from{transform:translateX(-110%)}to{transform:translateX(390%)}}
button:disabled{opacity:.6;cursor:wait;transform:none!important}
.language-toggle[aria-disabled=true]{opacity:.5;cursor:wait}
@media(prefers-reduced-motion:reduce){.send-progress span{width:100%;animation:none}}