/* 밝은 지면과 건축 프레임이 실제 투시도로 확장돼요. */
.iA-intro, .iA-intro * { box-sizing: border-box; }
.iA-intro {
  position: fixed; inset: 0; z-index: 100100; overflow: hidden;
  background: #f3f0e9; color: #202c4f;
  font-family: Pretendard, "Apple SD Gothic Neo", sans-serif;
  -webkit-font-smoothing: antialiased; isolation: isolate;
}
.iA-paper { position: absolute; inset: 0; background: #f3f0e9; }
.iA-scene {
  position: absolute; inset: 0;
  clip-path: inset(50% 7% 50% 55%);
  will-change: clip-path;
}
.iA-picture, .iA-photo { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.iA-photo { object-fit: cover; object-position: center; transform: scale(1.035); }
.iA-shade {
  position: absolute; inset: 0; opacity: 0;
  background: linear-gradient(90deg, rgba(8,21,29,.54), rgba(8,21,29,.06) 70%);
}
.iA-outline {
  position: absolute; top: 17.5%; right: 5.6%; bottom: 17.5%; left: 53.6%;
  border: 1px solid #b8b09c; transform: scaleY(0); transform-origin: center;
  pointer-events: none;
}
.iA-brand {
  position: absolute; top: 6%; left: 6%; display: block;
  width: clamp(220px, 23vw, 330px); height: auto; opacity: 0;
}
.iA-copy { position: absolute; top: 35%; left: 8%; width: 46%; }
.iA-title {
  margin: 0; color: inherit; font-family: "Noto Serif KR", serif;
  font-size: clamp(34px, 4.35vw, 84px); font-weight: 400;
  line-height: 1.52; letter-spacing: -.075em;
}
.iA-line { display: block; white-space: nowrap; opacity: 0; transform: translateY(22px); }
.iA-rule { width: 64px; height: 1px; margin-top: 30px; background: #948267; transform: scaleX(0); transform-origin: left; }
.iA-sub { max-width: 410px; margin: 20px 0 0; font-size: clamp(12px, 1.05vw, 17px); font-weight: 400; line-height: 1.85; word-break: keep-all; opacity: 0; }
.iA-open { position: absolute; left: 8%; bottom: 19%; margin: 0; font-size: 13px; letter-spacing: .11em; opacity: 0; }
.iA-signature { position: absolute; left: 8%; bottom: 7%; margin: 0; font-size: 10px; letter-spacing: .22em; opacity: 0; }
.iA-skip {
  position: absolute; right: 6%; bottom: max(5%, env(safe-area-inset-bottom));
  display: flex; align-items: center; justify-content: center; gap: 14px;
  min-width: 86px; min-height: 46px; padding: 10px 0 10px 14px;
  border: 0; border-radius: 0; background: #f3f0e9; color: #202c4f;
  font: 500 11px/1 Pretendard, sans-serif; letter-spacing: .12em; cursor: pointer;
}
.iA-skip-line { display: block; width: 28px; height: 1px; background: currentColor; }
.iA-skip:focus-visible { outline: 2px solid #202c4f; outline-offset: 5px; }
.iA-skip:hover .iA-skip-line { width: 36px; }
@media (max-width: 767px) {
  .iA-brand { left: 24px; top: max(34px, env(safe-area-inset-top)); width: 250px; max-width: calc(100% - 48px); }
  .iA-copy { left: 24px; right: 24px; top: 20%; width: auto; }
  .iA-title { font-size: clamp(25px, 8.7vw, 51px); line-height: 1.5; letter-spacing: -.065em; }
  .iA-rule { width: 35px; margin-top: 17px; }
  .iA-sub { margin-top: 12px; max-width: 280px; font-size: 12px; line-height: 1.7; }
  .iA-scene { clip-path: inset(65% 8% 35% 8%); }
  .iA-outline { top: 44%; right: 6%; bottom: 12%; left: 6%; }
  .iA-open { left: 24px; bottom: 6%; font-size: 10px; letter-spacing: .04em; }
  .iA-signature { display: none; }
  .iA-skip { right: 20px; bottom: max(3.9%, env(safe-area-inset-bottom)); min-width: 75px; gap: 8px; }
  .iA-shade { background: linear-gradient(180deg, rgba(8,21,29,.55), rgba(8,21,29,.10) 70%); }
}
@media (max-height: 600px) and (min-width: 768px) {
  .iA-copy { top: 29%; }
  .iA-title { font-size: min(4.1vw, 52px); line-height: 1.3; }
  .iA-rule { margin-top: 16px; }
  .iA-sub { margin-top: 12px; }
  .iA-open { bottom: 15%; }
}
@media (prefers-reduced-motion: reduce) {
  .iA-intro { visibility: hidden; pointer-events: none; }
}