/* External public pages: shared frame and page shell. Page content retains its own CSS. */
body.external-home {
  --external-shell: 1500px;
  --external-gutter: clamp(24px, 7vw, 112px);
  --external-ink: #24211e;
  --external-paper: #fffdf9;
  --external-warm: #f3eee7;
  --external-accent: #c8544c;
  background: var(--external-paper);
  color: var(--external-ink);
  font-family: Pretendard, "Noto Sans KR", sans-serif;
}

/* Keep the HOME Header and Footer on one visual grid across all routes. */
.external-home .ext-header,
.external-home .ext-footer { padding-inline: clamp(24px, 5vw, 96px); }
.external-home .footer-top,
.external-home .footer-bottom { max-width: 1440px; }

/* Dropdown visibility follows the shared script's expanded state, including Escape. */
.external-home .nav-group:not(.open) .nav-group-menu { display: none; }

/* A wide page shell can contain narrower reading columns within each section. */
.external-home :is(.corporation-shell, .location-shell, .people-shell, .person-shell, .services-shell, .contact-shell) {
  width: min(calc(100% - 2 * var(--external-gutter)), var(--external-shell));
  margin-inline: auto;
}

@media (max-width: 640px) {
  body.external-home { --external-gutter: 24px; }
  .external-home .ext-header,
  .external-home .mobile-overlay,
  .external-home .ext-footer { padding-inline: 24px; }
}


/* Keep the four external footer links on one mobile row. */
@media (max-width:640px) {
  body.external-home .ext-footer .footer-top nav {
    display:flex!important; flex-direction:row!important; flex-wrap:nowrap!important;
    justify-content:space-between!important; align-items:center; gap:8px!important;
    width:100%!important; font-size:clamp(12px,3.3vw,14px)!important;
  }
  body.external-home .ext-footer .footer-top nav a { white-space:nowrap; padding:9px 0!important; }
}

/* Reduce the mobile footer's empty space around its logo and menu. */
@media (max-width:640px) {
  body.external-home .ext-footer { padding-top:0!important; }
  body.external-home .ext-footer .footer-top {
    display:flex!important; flex-direction:column!important; align-items:flex-start!important;
    padding-top:24px!important; padding-bottom:24px!important; gap:12px!important;
  }
  body.external-home .ext-footer .ext-footer-brand { margin:0!important; }
  body.external-home .ext-footer .footer-top nav { margin-top:0!important; margin-bottom:0!important; }
}

/* Shared wood-image subpage HERO; HOME and consultation imagery are independent. */
body.external-home #main-content :is(.about-hero, .corporation-hero, .location-hero, .people-hero, .svc-hero, .igt-hero, .inh-hero, .sd-hero, .ti-hero, .contact-hero) {
  box-sizing: border-box; min-height: 320px !important; height: auto !important;
  display: flex !important; flex-direction: column; justify-content: center;
  padding: 40px 0 !important; margin: 0 !important;
  background: #463C34 url('/assets/subpage-hero-desktop.webp') center / cover no-repeat !important;
  color: #F8F7F5 !important; text-align: left !important;
}
body.external-home #main-content :is(.about-hero, .corporation-hero, .location-hero, .people-hero, .svc-hero, .igt-hero, .inh-hero, .sd-hero, .ti-hero, .contact-hero) * { color: #F8F7F5 !important; }
body.external-home #main-content :is(.about-hero, .corporation-hero, .location-hero, .people-hero, .svc-hero, .igt-hero, .inh-hero, .sd-hero, .ti-hero, .contact-hero) > :is(div, h1, p) {
  box-sizing: border-box; width: min(1200px, calc(100% - 96px)) !important;
  margin-inline: auto !important; min-height: 0 !important; padding: 0 !important;
}
body.external-home #main-content :is(.about-hero, .corporation-hero, .location-hero, .people-hero, .svc-hero, .igt-hero, .inh-hero, .sd-hero, .ti-hero, .contact-hero) h1 {
  margin-top: 0 !important; margin-bottom: 0 !important;
  font-family: 'Noto Serif KR', serif !important; font-size: 52px !important;
  font-weight: 500 !important; line-height: 1.35 !important; letter-spacing: -.055em !important;
  text-align: left !important; overflow-wrap: break-word;
  white-space: normal !important;
}
body.external-home #main-content :is(.about-hero, .corporation-hero, .location-hero, .people-hero, .svc-hero, .igt-hero, .inh-hero, .sd-hero, .ti-hero, .contact-hero) :is(.corporation-hero-intro, .corporation-poem) {
  margin-left: 0 !important; padding-top: 0 !important; align-self: center !important;
}
body.external-home #main-content :is(.about-hero, .corporation-hero, .location-hero, .people-hero, .svc-hero, .igt-hero, .inh-hero, .sd-hero, .ti-hero, .contact-hero) .corporation-shell { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) !important; gap: 40px; }
@media (max-width: 980px) {
  body.external-home #main-content :is(.about-hero, .corporation-hero, .location-hero, .people-hero, .svc-hero, .igt-hero, .inh-hero, .sd-hero, .ti-hero, .contact-hero) > :is(div, h1, p) { width: calc(100% - 48px) !important; }
}
@media (max-width: 640px) {
  body.external-home #main-content :is(.about-hero, .corporation-hero, .location-hero, .people-hero, .svc-hero, .igt-hero, .inh-hero, .sd-hero, .ti-hero, .contact-hero) {
    min-height: 230px !important; padding: 32px 0 !important;
    background-image: url('/assets/subpage-hero-mobile.webp') !important;
    background-size: 110% auto !important;
    background-position: right center !important;
  }
  body.external-home #main-content :is(.about-hero, .corporation-hero, .location-hero, .people-hero, .svc-hero, .igt-hero, .inh-hero, .sd-hero, .ti-hero, .contact-hero) > :is(div, h1, p) { width: calc(100% - 40px) !important; }
  body.external-home #main-content :is(.about-hero, .corporation-hero, .location-hero, .people-hero, .svc-hero, .igt-hero, .inh-hero, .sd-hero, .ti-hero, .contact-hero) h1 { font-size: 32px !important; line-height: 1.4 !important; }
  body.external-home #main-content :is(.about-hero, .corporation-hero, .location-hero, .people-hero, .svc-hero, .igt-hero, .inh-hero, .sd-hero, .ti-hero, .contact-hero) :is(.corporation-hero-intro, .corporation-poem) { align-self: flex-start !important; }
}

body.external-home #main-content :is(.about-hero, .corporation-hero, .location-hero, .people-hero, .svc-hero, .igt-hero, .inh-hero, .sd-hero, .ti-hero, .contact-hero) h1 span { white-space: normal !important; }

/* Shared external footer: warm white background and readable brown information. */
body.external-home footer.ext-footer { background:#f8f7f5!important; color:#463c34!important; }
body.external-home .ext-footer a,
body.external-home .ext-footer strong { color:#463c34!important; }
body.external-home .ext-footer p,
body.external-home .ext-footer .footer-company p span { color:#655e56!important; }
body.external-home .ext-footer .footer-top,
body.external-home .ext-footer .privacy-policy-link { border-color:#d8d1c8!important; }
body.external-home .ext-footer-brand img { filter:none!important; }