/* Homepage upgrade preview — preserve the studio palette and project artwork. */
.studio-upgrade { --page-gutter: clamp(22px, 5vw, 88px); }
.studio-upgrade .header { padding-inline: var(--page-gutter); }
.studio-upgrade .studio-opening { min-height: 840px; height: min(980px, 100svh); }
.studio-upgrade .opening-world { inset: 0; }
.studio-upgrade .opening-shade { background: linear-gradient(90deg,#0b1115f2 0%,#0b1115c9 34%,#0b11154d 70%),linear-gradient(0deg,#0b1115 0%,transparent 55%); }
.studio-upgrade .opening-copy { max-width: 950px; padding: 180px var(--page-gutter) 200px; }
.studio-upgrade .opening-copy .eyebrow { display: flex; align-items: center; gap: 12px; font-size: 10px; letter-spacing: .14em; }
.studio-dot { flex: 0 0 6px; height: 6px; border-radius: 50%; background: #b4d7c5; box-shadow: 0 0 18px #b4d7c580; }
.studio-upgrade .opening-copy h1 { max-width: 780px; font-size: clamp(56px,6.1vw,102px); line-height: 1.1; letter-spacing: -.065em; margin: 35px 0; }
.studio-upgrade .opening-lead { max-width: 445px; font-size: 16px; line-height: 1.85; color: #c3cecf; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 30px; margin-top: 34px; pointer-events: auto; }
.hero-primary { display: inline-flex; align-items: center; justify-content: space-between; gap: 55px; min-height: 56px; padding: 16px 23px; background: #b4d7c5; color: #14251e; font-size: 14px; transition: background .2s; }
.hero-primary:hover { background: #d9eddf; }
.hero-primary b { font-size: 20px; font-weight: 400; }
.hero-actions .opening-link { margin: 0; padding: 16px 0; min-height: 56px; gap: 32px; }
.hero-feature { position: absolute; z-index: 3; bottom: 106px; right: var(--page-gutter); width: clamp(250px,25vw,365px); border: 1px solid #e8eee32e; background: #101c22eb; backdrop-filter: blur(12px); }
.hero-feature-image { display: block; position: relative; overflow: hidden; }
.hero-feature-image img { width: 100%; height: auto; aspect-ratio: 1.95; object-fit: cover; transition: transform .4s; }
.hero-feature-image:hover img { transform: scale(1.04); }
.feature-play { position: absolute; right: 15px; bottom: 15px; display: grid; place-items: center; width: 36px; height: 36px; background: #b4d7c5; color: #14251e; border-radius: 50%; font-size: 20px; }
.hero-feature-copy { padding: 20px; }
.hero-feature-copy p { color: #b4d7c5; font: 9px/1.5 monospace; letter-spacing: .12em; margin: 0 0 10px; }
.hero-feature-copy>a { display: flex; justify-content: space-between; gap: 12px; font-size: 20px; font-weight: 700; letter-spacing: -.025em; }
.hero-feature-copy>span { display: block; margin-top: 8px; font-size: 11px; line-height: 1.6; color: #a9b8ba; }
.studio-upgrade .opening-base { left: var(--page-gutter); right: var(--page-gutter); bottom: 29px; padding-top: 22px; border-top: 1px solid #e8eee32e; }
.studio-upgrade .projects-arrival { padding: 85px var(--page-gutter) 45px; }
.studio-upgrade .arrival-heading { margin: 25px 0 40px; grid-template-columns: 1fr .55fr; gap: 7%; align-items: end; }
.studio-upgrade .arrival-heading h2 { max-width: 800px; font-size: clamp(38px,4.7vw,76px); }
.studio-upgrade .arrival-heading>p { font-size: 14px; line-height: 1.8; }
.studio-upgrade .world-portals { grid-template-columns: 1.2fr 1fr; gap: 22px; }
.studio-upgrade .world-portal { height: clamp(530px,48vw,740px); border-color: #a7b8b330; }
.studio-upgrade .ingye-portal { margin-top: 72px; height: clamp(458px,calc(48vw - 72px),668px); }
.studio-upgrade .portal-index { font-size: 10px; padding-bottom: 16px; border-bottom: 1px solid #ffffff26; }
.studio-upgrade .portal-copy { inset: auto 30px 30px; }
.studio-upgrade .portal-copy h2 { font-size: clamp(52px,5.8vw,90px); margin-block: 16px 30px; }
.studio-upgrade .ingye-portal .portal-copy h2 { font-size: clamp(42px,4.5vw,70px); line-height: 1.1; }
.studio-upgrade .world-link { min-height: 56px; font-size: 14px; }
.studio-upgrade .purpose-section { padding: 80px var(--page-gutter) 45px; }
.studio-upgrade .purpose-editorial { padding: 70px 0 65px; grid-template-columns: 1.1fr .85fr; gap: 10%; }
.studio-upgrade .purpose-editorial h2 { font-size: clamp(40px,4.5vw,72px); }
.studio-upgrade .approach-section { padding: 100px var(--page-gutter); gap: 9%; }
.studio-upgrade .approach-title { align-self: start; position: sticky; top: 125px; }
.studio-upgrade .approach-rows article { padding-block: 36px; }
.studio-upgrade .ingye-concept { padding: 80px var(--page-gutter); }
.studio-upgrade .ingye-concept .project-editorial { gap: 7%; }
.studio-upgrade .films { padding: 95px var(--page-gutter); }
.studio-upgrade .films>.promo { max-width: none; display: grid; grid-template-columns: 1.7fr 1fr; column-gap: 40px; align-items: start; }
.studio-upgrade .films>.promo button { grid-row: 1/3; }
.studio-upgrade .films>.promo>p { grid-column: 2; margin-top: 0; align-self: end; }
.studio-upgrade .films>.promo>h3 { grid-column: 2; font-size: clamp(22px,2.4vw,36px); line-height: 1.35; margin-top: 14px; }
.studio-upgrade .video-library { margin-top: 70px; }
.studio-upgrade .studio-note { padding-inline: var(--page-gutter); }
.studio-upgrade .contact { padding: 85px var(--page-gutter); }
.studio-upgrade .contact h2 { max-width: 1000px; font-size: clamp(38px,5vw,76px); }
.studio-upgrade .email { padding-block: 25px; }
.studio-upgrade footer { padding-inline: var(--page-gutter); }
.studio-upgrade [data-en] { overflow-wrap: anywhere; }
@media(min-width:901px) { .studio-upgrade .header nav { gap: clamp(18px,2vw,35px); } }
@media(max-width:1100px) {
  .studio-upgrade .opening-copy { max-width: 750px; padding-top: 155px; }
  .studio-upgrade .opening-copy h1 { font-size: 65px; }
  .hero-feature { width: 245px; bottom: 95px; }
  .studio-upgrade .opening-lead { max-width: 390px; }
}
@media(max-width:900px) {
  .studio-upgrade .studio-opening { height: auto; min-height: 0; padding-bottom: 100px; }
  .studio-upgrade .opening-copy { padding: 130px var(--page-gutter) 30px; max-width: 740px; }
  .studio-upgrade .opening-copy h1 { font-size: clamp(44px,7.7vw,64px); max-width: 690px; }
  .studio-upgrade .opening-lead { max-width: 510px; }
  .studio-upgrade .opening-world { inset: 0; opacity: .8; }
  .studio-upgrade .opening-shade { background: linear-gradient(90deg,#0b1115ee,#0b111580),linear-gradient(0deg,#0b1115,transparent 80%); }
  .hero-feature { position: relative; bottom: auto; right: auto; margin: 20px var(--page-gutter) 0; width: auto; display: grid; grid-template-columns: 1fr 1fr; align-items: center; max-width: 550px; }
  .hero-feature-image img { aspect-ratio: 1.6; }
  .studio-upgrade .arrival-heading,.studio-upgrade .purpose-editorial { grid-template-columns: 1fr; gap: 25px; }
  .studio-upgrade .world-portals { grid-template-columns: 1fr 1fr; gap: 16px; }
  .studio-upgrade .world-portal,.studio-upgrade .ingye-portal { height: 510px; margin: 0; }
  .studio-upgrade .portal-copy { left: 22px; right: 22px; }
  .studio-upgrade .portal-copy h2 { font-size: 49px; }
  .studio-upgrade .ingye-portal .portal-copy h2 { font-size: 40px; }
  .studio-upgrade .purpose-editorial>div { margin: 0; }
  .studio-upgrade .approach-section { padding-block: 65px; }
  .studio-upgrade .approach-title { position: static; }
  .studio-upgrade .films>.promo { display: block; }
  .studio-upgrade .films>.promo>p { margin-top: 20px; }
}
@media(max-width:600px) {
  .studio-upgrade .opening-copy { padding-top: 120px; }
  .studio-upgrade .opening-copy h1 { font-size: clamp(39px,10.6vw,57px); line-height: 1.16; margin-block: 26px; }
  .studio-upgrade .opening-copy .eyebrow { font-size: 8px; max-width: none; letter-spacing: .06em; }
  .studio-upgrade .opening-lead { font-size: 14px; line-height: 1.9; }
  .hero-actions { margin-top: 25px; gap: 25px; }
  .hero-primary { gap: 40px; min-height: 52px; }
  .hero-feature { grid-template-columns: .9fr 1.1fr; margin-top: 8px; }
  .hero-feature-image { height: 100%; }
  .hero-feature-image img { height: 100%; min-height: 124px; object-fit: cover; }
  .hero-feature-copy { padding: 16px; }
  .hero-feature-copy>a { font-size: 17px; }
  .hero-feature-copy>span { font-size: 10px; }
  .hero-feature-copy p { font-size: 8px; }
  .feature-play { width: 28px; height: 28px; right: 10px; bottom: 10px; font-size: 17px; }
  .studio-upgrade .projects-arrival,.studio-upgrade .films,.studio-upgrade .ingye-concept { padding-block: 60px; }
  .studio-upgrade .world-portals { grid-template-columns: 1fr; gap: 24px; }
  .studio-upgrade .world-portal,.studio-upgrade .ingye-portal { height: 495px; }
  .studio-upgrade .portal-copy h2 { font-size: 62px; }
  .studio-upgrade .ingye-portal .portal-copy h2 { font-size: 48px; }
  .studio-upgrade .portal-index { font-size: 9px; }
  .studio-upgrade .purpose-section { padding-block: 55px 35px; }
  .studio-upgrade .purpose-editorial { padding-block: 40px 25px; }
  .studio-upgrade .purpose-editorial h2 { font-size: 37px; }
  .studio-upgrade .contact { padding-block: 60px; }
  .studio-upgrade .email { font-size: clamp(18px,5vw,26px); }
}
@media(prefers-reduced-motion:reduce) { .hero-feature-image:hover img { transform: none; } }
@media(pointer:coarse),(max-width:600px) {
  .hero-feature-copy > a, .arrival-foot a, .film a, .archive-links a, footer nav a { min-height: 44px; display: inline-flex; align-items: center; }
  footer nav { row-gap: 0; }
}