/* Bounded theme overrides. Load after site.css, finishing.css and icons-3d.css. */
:root {
  --sky: #6a9bd6;
  --lemon: #ffb52f;
  --coral: #ef5f73;
  --slate: #294966;
  --ink: #263e53;
  --muted: #536778;
  --ivory: #fffdf8;
  --line: #d7e2eb;
  --soft-sky: #edf4fc;
  --soft-lemon: #fff4df;
  --soft-coral: #fff0f2;
  --shadow: 0 18px 48px rgb(41 73 102 / .09);
  --header-height: 90px;
  --twinkle-blue-ink: #345f91;
  --twinkle-coral-ink: #a5374b;
}

body, button, input, textarea, select,
:is(h1, h2, h3, h4, h5, h6, .brand, .eyebrow, .section-tag) {
  font-family: Paperlogy, 'Noto Sans KR', system-ui, sans-serif;
}
body { background: var(--ivory); }
::selection { background: #dbe9fb; color: var(--ink); }
:focus-visible { outline-color: var(--twinkle-blue-ink); }

.header {
  background: rgb(255 255 255 / .96);
  border-bottom-color: var(--line);
  box-shadow: 0 5px 24px rgb(41 73 102 / .035);
}
.header::after {
  background: linear-gradient(90deg, var(--sky) 0% 58%, var(--lemon) 76%, var(--coral));
}
/* Transparent horizontal lockup with original symbol and Paperlogy lettering. */
.brand img:not(.icon3d) {
  display: block;
  height: auto;
  width: 264px;
  max-height: 60px;
  max-width: none;
  flex: 0 0 auto;
  object-fit: contain;
  object-position: center;
  border-radius: 0;
  background: transparent;
  clip-path: none;
  transform: none;
}
.desktop-nav { gap: clamp(12px, 1.4vw, 22px); }
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.brand-wordmark { font-family: Paperlogy, sans-serif; font-size: 24px; font-weight: 800; color: #345f91; white-space: nowrap; }
.brand-wordmark small { display: block; margin-top: 5px; font-size: 11px; font-weight: 500; color: var(--muted); }
.desktop-nav a:hover, .desktop-nav summary:hover,
.desktop-nav [aria-current=page] { color: var(--twinkle-blue-ink); }
.desktop-nav details > :is(div, ul), .notice-popup {
  background: #fff;
  border-color: var(--line);
  box-shadow: var(--shadow);
}
.dropdown-heading { color: var(--twinkle-blue-ink); }
#mobile-nav a:hover, #mobile-nav [aria-current=page] {
  background: var(--soft-sky);
  color: var(--twinkle-blue-ink);
}

.hero, .page-hero {
  background:
    radial-gradient(ellipse at 90% 18%, rgb(106 155 214 / .19), transparent 52%),
    radial-gradient(ellipse at 4% 85%, rgb(255 181 47 / .09), transparent 44%),
    linear-gradient(125deg, #f1f6fd, var(--ivory) 58%, #fff5f4);
  border-bottom: 1px solid rgb(106 155 214 / .15);
}
.hero h1, .page-hero h1 { color: var(--ink); font-weight: 700; }
.hero h1 em, em { color: var(--twinkle-blue-ink); }
.hero-copy, .page-hero .wrap, .section-head > div { min-width: 0; }
.eyebrow, .section-tag, .card-tag,
.photo-caption span, .map-address > span {
  color: var(--twinkle-blue-ink);
  font-variant-caps: all-small-caps;
  letter-spacing: .11em;
}
.eyebrow::before, .section-tag::before {
  background: var(--coral);
  box-shadow: 0 0 0 4px rgb(239 95 115 / .08);
}
.hero-image, .page-visual .hero-image {
  border: 1px solid rgb(106 155 214 / .18);
  box-shadow: 0 24px 56px rgb(41 73 102 / .12);
}
.photo-caption {
  background: rgb(255 253 248 / .98);
  border-color: var(--line);
  box-shadow: 0 12px 32px rgb(41 73 102 / .08);
}
.hero-orbit {
  background: linear-gradient(145deg, #fff4df, #ffd58a);
  border-color: #fff;
  box-shadow: 0 10px 30px rgb(255 181 47 / .17);
}
.hero-note { color: var(--muted); }
.hero-note svg { color: #8a6015; }
.hero-bottom { border-color: var(--line); }

.btn {
  background: var(--twinkle-blue-ink);
  border-color: var(--twinkle-blue-ink);
  box-shadow: 0 5px 16px rgb(52 95 145 / .1);
}
.btn:hover { background: #294d78; box-shadow: 0 10px 24px rgb(52 95 145 / .18); }
.btn-secondary {
  color: var(--twinkle-blue-ink);
  background: rgb(255 255 255 / .7);
  border-color: #a5bdd7;
  box-shadow: none;
}
.btn-secondary:hover { color: #294d78; background: #fff; }
.text-link { color: var(--twinkle-blue-ink); border-color: #a5bdd7; }

.menu-flow {
  background: linear-gradient(100deg, #edf4fc, #f8faff 64%, #fff7e9);
  border-block: 1px solid rgb(106 155 214 / .12);
}
.marquee-shell { background: transparent; }
.menu-chip { background: #fff; border-color: var(--line); }
.menu-chip:hover { background: var(--soft-sky); }
.menu-chip span { color: #805c1e; }
.menu-chip svg { color: var(--twinkle-blue-ink); }
.flow-toggle { color: var(--ink); border-color: #a5bdd7; }

:is(.program-card, .voucher-card, .feature, .blog-card, .location-panel, .contact-card) {
  border-color: var(--line);
  box-shadow: 0 7px 26px rgb(41 73 102 / .045);
}
:is(.program-card, .blog-card, .feature) { background: #fff; }
.program-card:nth-child(3n+2), .feature:nth-child(3n+2) { border-color: #eadcc4; }
.program-card:nth-child(3n), .feature:nth-child(3n) { border-color: #efd8de; }
.program-tab, button[data-program] { background: #fff; border-color: var(--line); }
.program-tab > span { color: var(--twinkle-blue-ink); }
.program-tab.is-active, button[data-program].is-active,
.program-tab[aria-selected=true], button[data-program][aria-selected=true] {
  background: var(--twinkle-blue-ink);
  border-color: var(--twinkle-blue-ink);
  color: #fff;
}
.program-tab[aria-selected=true] > span { color: #fff0d5; }
.program-spotlight { background: var(--soft-sky); border-color: #cfdeef; }
.voucher-card { background: var(--soft-sky); border-color: #cfdeef; }
.voucher-card:nth-child(3n+2) { background: var(--soft-lemon); border-color: #eadcc4; }
.voucher-card:nth-child(3n) { background: var(--soft-coral); border-color: #efd8de; }
.card-action { color: var(--twinkle-blue-ink); }
.program-card:hover .card-action svg, .voucher-card:hover .card-action svg {
  background: var(--soft-sky);
}
.philosophy { background: linear-gradient(120deg, #fff7e9, var(--ivory) 55%, #f3f7fd); }
.story-stamp { background: #fff4df; border-color: var(--ivory); }
.story-stamp svg { color: #805c1e; }
.process-section { background: #edf4fc; }
.suitable-section { background: #faf8f2; }
.location-section { background: #f2f6fc; }
.step { border-top-color: var(--sky); }
.step:nth-child(3n+2) { border-top-color: var(--lemon); }
.step:nth-child(3n) { border-top-color: var(--coral); }
.step > span, .step::before { color: var(--twinkle-blue-ink); }
.faq summary::after { color: var(--twinkle-coral-ink); }
.cta-panel {
  background: linear-gradient(115deg, #eaf2fc, #fffdf8 60%, #fff0f2);
  border-color: #cfdeef;
  box-shadow: var(--shadow);
}
.source-note { background: #f1f5fa; }
.prepare-panel { background: var(--soft-sky); }
.contact-mini, .contact-grid > .kakao-card { background: var(--soft-lemon); border-color: #eadcc4; }
.filter-button.is-active, .filter-button[aria-pressed=true] {
  background: var(--twinkle-blue-ink);
  border-color: var(--twinkle-blue-ink);
}
.footer { background: linear-gradient(120deg, #edf3fa, #faf8f2); border-color: var(--line); }
.quick-toolbar, .mobile-bar { background: rgb(255 255 255 / .98); border-color: var(--line); }
.tool-link:hover { background: var(--soft-sky); }
.tool-link[href*='kakao']:hover { background: var(--soft-lemon); }

/* Keep the existing observer and marquee animation; only soften card reveals. */
.reveal.reveal-pending {
  transform: translateY(16px);
  transition: opacity .65s ease var(--reveal-delay, 0ms),
    transform .65s cubic-bezier(.2, .7, .2, 1) var(--reveal-delay, 0ms);
}
:is(.program-grid, .voucher-grid, .feature-grid, .blog-grid) > .reveal:nth-child(3n+2) {
  --reveal-delay: 70ms;
}
:is(.program-grid, .voucher-grid, .feature-grid, .blog-grid) > .reveal:nth-child(3n) {
  --reveal-delay: 140ms;
}
.reveal.reveal-pending.is-visible,
.program-grid .reveal-pending.is-visible, .voucher-grid .reveal-pending.is-visible { transform: none; }
.program-grid .reveal-pending, .voucher-grid .reveal-pending { transform: translateY(16px); }
.program-grid .reveal-pending.is-visible, .voucher-grid .reveal-pending.is-visible { transform: none; }

/* Reserve a side lane for the fixed toolbar at desktop and tablet widths. */
@media (min-width: 761px) {
  .wrap { width: calc(100% - 192px); }
  .quick-toolbar { right: 14px; bottom: 24px; max-height: calc(100dvh - 120px); overflow-y: auto; }
  .back-top:not(.quick-toolbar .back-top) { right: 104px; }
}
@media (min-width: 761px) and (max-width: 1100px) {
  :root { --header-height: 78px; }
  .wrap { width: calc(100% - 160px); }
  .quick-toolbar { right: 10px; }
  .hero h1 { font-size: clamp(32px, 4vw, 43px); }
}
@media (max-width: 760px) {
  :root { --header-height: 80px; }
  html { scroll-padding-bottom: calc(112px + env(safe-area-inset-bottom, 0px)); }
  body { padding-bottom: calc(112px + env(safe-area-inset-bottom, 0px)); }
  .header > .wrap, .header .header-inner { min-height: 80px; gap: 12px; }
  .brand { gap: 6px; }
  .brand img:not(.icon3d) { width: 232px; max-width: calc(100vw - 110px); height: auto; }
  .brand-wordmark { font-size: 20px; }
  .brand-wordmark small { font-size: 10px; }
  .hero { padding-top: 38px; }
  .hero h1, .page-hero h1 {
    font-size: clamp(29px, 7.3vw, 44px);
    line-height: 1.42;
    letter-spacing: -.035em;
    white-space: normal;
    word-break: keep-all;
    overflow-wrap: anywhere;
    text-wrap: pretty;
  }
  .hero h1 br, .page-hero h1 br { display: none; }
  .lead { font-size: 15px; }
  .photo-caption { max-width: calc(100% - 12px); padding: 16px 20px; }
  .photo-caption strong { overflow-wrap: anywhere; }
  .quick-toolbar { display: flex; right: 9px; bottom: calc(90px + env(safe-area-inset-bottom, 0px)); }
  .back-top:not(.quick-toolbar .back-top) {
    right: 12px;
    bottom: calc(112px + env(safe-area-inset-bottom, 0px));
  }
  .mobile-bar { padding: 8px 8px calc(8px + env(safe-area-inset-bottom, 0px)); }
  .mobile-bar > a { min-height: 54px; flex-wrap: wrap; overflow-wrap: anywhere; }
  .mobile-bar > a:first-child { background: var(--twinkle-blue-ink); color: #fff; }
  .mobile-bar > a:nth-child(2) { background: var(--soft-lemon); color: var(--ink); }
  #mobile-nav.is-open { max-height: calc(100dvh - 192px - env(safe-area-inset-bottom, 0px)); }
  .eyebrow, .section-tag { letter-spacing: .07em; }
}
@media (prefers-reduced-motion: reduce) {
  .reveal.reveal-pending,
  .program-grid .reveal-pending, .voucher-grid .reveal-pending {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .marquee-track { animation: none; transform: none; will-change: auto; }
  .marquee-shell { overflow-x: auto; }
  .hero-orbit { animation: none; }
}
@media (prefers-contrast: more) {
  :root { --muted: #354c61; --line: #71869a; }
  .header, .photo-caption, .quick-toolbar, .mobile-bar { background: #fff; }
  .program-card, .voucher-card, .feature, .blog-card, .cta-panel { border-color: #71869a; }
  .btn-secondary, .text-link { border-color: var(--twinkle-blue-ink); }
}
@media print {
  body { padding-bottom: 0; }
  .wrap { width: 100%; }
  .quick-toolbar, .mobile-bar, .back-top { display: none; }
}