/*
 * AII polish layer, loaded after each template's own styles.
 * The bundled templates were English Start Bootstrap themes: Latin display fonts, uppercase and
 * condensed headings, and 2013-era buttons. This layer gives every template Korean typography and
 * a calmer, current surface without changing the markup the editor and renderer rely on.
 * Versioned file name: template assets are cached immutably.
 */
:root {
  --aii-font-ko: "Pretendard", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", "Noto Sans CJK KR",
    "Malgun Gothic", "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  --aii-font-ko-serif: "Noto Serif KR", "Nanum Myeongjo", "AppleMyungjo", "Batang", serif;
  --aii-ink: #191f28;
  --aii-ink-soft: #4e5968;
  --aii-ink-faint: #8b95a1;
  --aii-line: #e5e8eb;
  --aii-surface: #ffffff;
  --aii-radius-lg: 20px;
  --aii-radius-md: 14px;
  --aii-shadow: 0 10px 30px rgba(25, 31, 40, 0.08);
}

/* The theme accent is set on the page body (public site) or the preview host (editor), so the
   derived variables are declared there too; declared only on :root they would resolve too early. */
:root,
body,
.aii-source-template {
  --aii-accent: var(--aii-theme-accent, #3182f6);
  --aii-accent-soft: var(--aii-theme-accent-soft, #e8f3ff);
  --aii-on-accent: var(--aii-theme-on-accent, #fff);
  /* Small accent-colored labels on light surfaces: bright accents (amber, coral) are too faint. */
  --aii-accent-text: var(--aii-accent);
}

@supports (color: color-mix(in srgb, red 50%, blue)) {
  :root,
  body,
  .aii-source-template {
    --aii-accent-text: color-mix(in srgb, var(--aii-accent) 58%, #191f28);
  }
}

body {
  font-family: var(--aii-font-ko) !important;
  line-height: 1.65;
  letter-spacing: -0.01em;
  word-break: keep-all;
  overflow-wrap: anywhere;
  -webkit-font-smoothing: antialiased;
}

/* Text elements take the Korean stack. Icons in these templates are <i> elements (Font Awesome,
   Bootstrap Icons, Simple Line Icons) and are deliberately left out, so they keep their fonts. */
p, li, a, span:not([class*="fa-"]):not([class^="icon-"]), small, strong, em, blockquote, label, button, input, textarea, select,
h1, h2, h3, h4, h5, h6, .btn, .nav-link, .navbar-brand, .lead {
  font-family: var(--aii-font-ko) !important;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.3 !important;
  text-transform: none !important;
  word-break: keep-all;
}

h1 {
  font-size: clamp(2rem, 8.5vw, 3.25rem);
}

h2 {
  font-size: clamp(1.5rem, 6.4vw, 2.25rem);
}

p, li {
  color: inherit;
}

.text-uppercase {
  text-transform: none !important;
  letter-spacing: -0.01em !important;
}

.lead {
  font-weight: 400 !important;
  line-height: 1.7;
}

.btn {
  border-radius: var(--aii-radius-md) !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  text-transform: none !important;
  padding: 0.8rem 1.35rem !important;
  box-shadow: none !important;
}

.btn-sm {
  padding: 0.55rem 1rem !important;
}

.card {
  overflow: hidden;
  border: 0 !important;
  border-radius: var(--aii-radius-lg) !important;
  box-shadow: var(--aii-shadow);
}

.card-img-top {
  border-radius: 0 !important;
}

img {
  border-radius: 0;
}

img.rounded, .img-fluid.rounded {
  border-radius: var(--aii-radius-lg) !important;
}

hr {
  border-color: var(--aii-line);
  opacity: 1;
}

.navbar-toggler {
  border-radius: 12px !important;
}

footer small, footer p {
  letter-spacing: 0;
}

/* Hangul has no true italic; browsers slant it synthetically, which reads as a rendering error. */
.fst-italic,
.font-italic,
em {
  font-style: normal !important;
}