/* =========================================================================
   THEME: SNOW (삿포로 겨울 · 기본값)
   눈처럼 맑은 흰 배경 · 얼음빛 블루 포인트 · 온천/사케의 따뜻한 호박색 보조.
   밤눈(night-snow) 무드의 깊은 네이비 히어로. 미니멀의 절제 + 겨울의 결정감.
   ========================================================================= */
@import url('https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;0,6..72,600;1,6..72,400&family=Noto+Serif+KR:wght@400;600;700&display=swap');
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.css');

:root {
  --bg: #f6fafc;            /* snow white, cool tint */
  --bg-2: #e9f1f7;
  --card: #ffffff;
  --card-2: #eef5fa;
  --ink: #15252f;           /* deep slate-navy */
  --ink-soft: #3d586a;
  --ink-faint: #88a2b3;
  --line: #d7e6ef;
  --line-soft: #e6f0f6;
  --accent: #1773b8;        /* ice blue */
  --accent-2: #c47a3c;      /* warm amber — 온천·사케의 온기 */
  --accent-ink: #ffffff;
  --link: #1773b8;
  --link-hover: #c47a3c;

  --hero-bg: linear-gradient(165deg,#0c2233 0%,#123c59 52%,#1b5b80 100%);
  --hero-ink: #f1f8fc;
  --hero-sub: #c6dded;
  --hero-kicker: #7fcdf2;   /* bright ice */
  --hero-rule: #38617f;
  --hero-border: 1px solid #0a1c2b;
  --hero-pad: 104px 22px 88px;

  --badge-show-bg:#1773b8; --badge-show-ink:#fff;
  --badge-dia-bg:#c47a3c;  --badge-dia-ink:#fff;
  --badge-likely-bg:#e3eef5; --badge-likely-ink:#3d586a;

  --font-display: 'Newsreader','Noto Serif KR',Georgia,serif;
  --font-serif: 'Noto Serif KR','Newsreader',Georgia,serif;
  --font-h2: 'Noto Serif KR','Newsreader',serif;
  --font-body: 'Pretendard',-apple-system,system-ui,sans-serif;
  --num-font: 'Newsreader','Noto Serif KR',serif;
  --base-size: 17px;
  --body-leading: 1.82;
  --body-spacing: -0.002em;

  --h1-font: 'Newsreader','Noto Serif KR',serif;
  --h1-size: clamp(40px,6.4vw,80px);
  --h1-weight: 500;
  --h1-spacing: -0.012em;
  --h1-leading: 1.04;
  --ko-display: 'Noto Serif KR',serif;
  --ko-weight: 700;
  --ko-size: clamp(24px,3.8vw,42px);
  --kicker-spacing: .34em;

  --eyebrow-spacing: .3em;
  --arthead-font: 'Noto Serif KR','Newsreader',serif;
  --arthead-bg: #e9f1f7;

  --radius: 14px;
  --radius-card: 16px;
  --radius-img: 6px;
  --frame-radius: 8px;
  --frame-pad: 0px;
  --frame-border: 1px solid #dbe9f1;
  --frame-bg: #fff;
  --card-border: 1px solid #dbe9f1;
  --card-shadow: 0 1px 2px rgba(18,60,89,.05), 0 10px 30px rgba(18,60,89,.06);
  --shadow-lg: 0 24px 56px rgba(12,40,60,.16);
  --btn-radius: 999px;
  --section-rule: 1px solid #e0ecf3;

  --brand-weight: 700;

  --kp-mark: '❄';
  --ff-mark: '✦';
  --dropcap-color: var(--accent);
  --dropcap-size: 3.2em;

  /* callouts (build.py: info→look, tip→note, warn→fact, quote→quote) */
  --look-bg:#e7f1fa; --look-border:#cfe3f3; --look-ink:#1773b8;     /* info */
  --behind-bg:#f4ede4; --behind-border:#e8d8c5; --behind-ink:#a06a35;
  --fact-bg:#fdeee4; --fact-border:#f4d8c2; --fact-ink:#c05f2a;      /* warn */
  --note-bg:#e8f4ee; --note-border:#cfe7da; --note-ink:#2f7d57;      /* tip */
  --ff-bg:#eef5fa; --ff-border:#dbeaf4;
  --keypoints-bg:#fff;
  --conf-bg:#eef5fa; --conf-border:#cfe1ee;
  --topbar-bg: rgba(246,250,252,.86);
  --footer-bg:#0c2233; --footer-ink:#9fbacd; --footer-strong:#eef7fc; --footer-link:#7fcdf2;
  --tag-bg:#e7f1fa; --tag-ink:#1773b8;
  --thumb-overlay: linear-gradient(180deg, transparent 52%, rgba(8,30,46,.42));
}

/* snow: crisp hairlines, airy spacing, frosty hovers */
body.t-snow { letter-spacing: -0.002em; }
body.t-snow .topbar { border-bottom: 1px solid #d7e6ef; }
body.t-snow .topbar .brand b { color: var(--accent); }
body.t-snow .hero { position: relative; }
/* subtle snow speckle on hero */
body.t-snow .hero::after {
  content:''; position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.5;
  background-image:
    radial-gradient(1.5px 1.5px at 12% 22%, rgba(255,255,255,.9), transparent),
    radial-gradient(1.5px 1.5px at 38% 64%, rgba(255,255,255,.7), transparent),
    radial-gradient(2px 2px at 66% 34%, rgba(255,255,255,.8), transparent),
    radial-gradient(1.5px 1.5px at 82% 72%, rgba(255,255,255,.6), transparent),
    radial-gradient(1.5px 1.5px at 52% 14%, rgba(255,255,255,.7), transparent),
    radial-gradient(2px 2px at 26% 84%, rgba(255,255,255,.6), transparent);
}
body.t-snow .hero .wrap { position: relative; z-index: 2; }
body.t-snow .hero h1 .ko { color: #eaf6fd; }
body.t-snow .hero .lede { font-size: 19px; }
body.t-snow .shead { margin-top: 80px; }
body.t-snow .rule { width: 46px; height: 3px; background: linear-gradient(90deg,var(--accent),#7fcdf2); border-radius: 3px; }
body.t-snow .syllabus { gap: 22px; }
body.t-snow .daycard { box-shadow: var(--card-shadow); }
body.t-snow .daycard:hover { box-shadow: var(--shadow-lg); border-color: var(--accent); transform: translateY(-4px); }
body.t-snow .daycard .thumb { aspect-ratio: 16/10; }
body.t-snow .daycard h3 { font-family: var(--font-serif); font-weight: 700; }
body.t-snow .prose h2 { font-weight: 700; }
body.t-snow .prose h2 .en { color: var(--ink-faint); font-style: italic; }
body.t-snow .keypoints { border:1px solid #dbe9f1; background: linear-gradient(180deg,#fff,#f3f9fc); }
body.t-snow .arthead h1 { font-weight: 700; }
body.t-snow figure.art .frame { box-shadow: var(--card-shadow); }
body.t-snow .badge { font-weight: 800; }
body.t-snow .btn.primary { box-shadow: 0 6px 18px rgba(23,115,184,.3); }