/* Signal: taken from the real storefront. A charcoal sign band with the Korean name in sign blue, then a bright,
   gridded page. One typeface (IBM Plex Sans KR) carries both languages. */
:root {
  --bg: #FFFFFF; --surface: #FFFFFF; --surface-2: #EEF3F6;
  --ink: #1D232B; --muted: #4F5A66; --line: #D5DDE3; --line-strong: #98A5B1;
  --brand: #0E6CA3; --brand-hover: #0B5884; --brand-ink: #FFFFFF;
  --accent: #1A8FCF; --accent-text: #0E6CA3;
  --font-head: "IBM Plex Sans KR", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "IBM Plex Sans KR", system-ui, -apple-system, "Segoe UI", sans-serif;
  --head-weight: 700; --radius: 0; --radius-sm: 2px; --mark-radius: 2px;
  --header-bg: #FFFFFF; --foot-bg: #262B31; --foot-ink: #E8EDF1;
  --cta-bg: #EEF3F6; --cta-ink: #1D232B; --cta-btn: #0E6CA3; --cta-btn-ink: #FFFFFF;
}
.brand-mark { background: #262B31; color: #3FB0F0; }
.brand-name { font-weight: 700; }
h1 { letter-spacing: -.025em; font-size: clamp(2rem, 1.2rem + 3vw, 3.4rem); }

/* The sign band: the storefront sign, scaled up. */
.sign-band { background: #262B31; color: #fff; border-bottom: 6px solid #1A8FCF; }
.sign-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 28px; padding: clamp(26px, 3.5vw, 48px) 0 clamp(22px, 3vw, 40px); }
.sign-ko { margin: 0; font: 700 clamp(2.4rem, 1.2rem + 5.6vw, 5.6rem)/1.05 var(--font-head); color: #3FB0F0; letter-spacing: -.03em; word-break: keep-all; }
.sign-en { margin: 0; font: 600 clamp(1.15rem, .9rem + 1.2vw, 1.9rem)/1.2 var(--font-head); color: #FFFFFF; }

.hero-band .hero-grid { padding-top: clamp(32px, 4vw, 64px); }
.hero-band .eyebrow { color: var(--brand); }
.btn-primary { border-radius: 2px; }
.section-head h2 { letter-spacing: -.02em; }
.svc-grid { border-color: #D5DDE3; }
.svc-tile a { border-color: #D5DDE3; }
.svc-tile .icon { color: #1A8FCF; }
.why { background: #EEF3F6; }
.why-grid li { border-top: 4px solid #1A8FCF; }
.steps li::before { border-radius: 2px; background: #262B31; border-color: #262B31; color: #3FB0F0; }
.detail-img { border-radius: 0; }
.real-photo { border-radius: 0; }
.cta-band { border-top: 1px solid var(--line); }
.cta-band .btn-ghost { color: var(--ink); border-color: var(--line-strong); }
.chooser { background: #262B31; --chooser-ink: #3FB0F0; --chooser-muted: #C6D0D8; border-top: 8px solid #1A8FCF; }
.chooser .chooser-name { font-size: clamp(2.6rem, 1.6rem + 4vw, 4.4rem); letter-spacing: -.03em; }
.chooser .chooser-name-en { color: #fff; font-weight: 600; }
.chooser .brand-mark { background: #1A8FCF; color: #fff; }
.chooser .choose { background: #FFFFFF; border-color: #FFFFFF; border-radius: 2px; }
.chooser .choose:hover, .chooser .choose:focus-visible { box-shadow: inset 0 -5px 0 #1A8FCF; }
.foot-legal { border-top-color: rgba(255, 255, 255, .16); }

/* Hero photo: the real reception wall (CPA lettering + framed certificate), shown whole. */
.hero-band .hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); }
.hero-band .hero-img { aspect-ratio: 2 / 1; object-fit: cover; object-position: 50% 50%; border: 0; }
@media (max-width: 960px) { .hero-band .hero-grid { grid-template-columns: 1fr; } }
.process-grid.no-photo { grid-template-columns: 1fr; }
.process-grid.no-photo .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
@media (max-width: 860px) { .process-grid.no-photo .steps { grid-template-columns: 1fr; } }