/* 공통 스타일 (네비게이션 · 푸터 · 콘텐츠 페이지) — 성적 계산기 사이트 */
:root{
  --ink:#2a2724; --ink-soft:#585249;
  --line:#e2ddd0; --line-strong:#cdc6b5;
  --paper:#fffdf8; --paper-edge:#f6f2e9; --card:#ffffff;
  --accent:#356195; --accent-soft:#e9f0f8;
  --good:#27764f; --warn:#b54a23;
  --shadow:0 10px 40px rgba(60,50,30,.12), 0 2px 8px rgba(60,50,30,.06);
  --bg1:#f0ead9; --bg2:#ece5d2; --bg3:#e8e1cf;
  --margin-line:#e7b0a0;
}
[data-theme="dark"]{
  --ink:#ece8de; --ink-soft:#a59e90;
  --line:#3b3934; --line-strong:#524f47;
  --paper:#24231f; --paper-edge:#2b2a25; --card:#2e2c27;
  --accent:#7fb0e6; --accent-soft:#2b3644;
  --good:#5fcc94; --warn:#e8916a;
  --shadow:0 12px 44px rgba(0,0,0,.5), 0 2px 10px rgba(0,0,0,.3);
  --bg1:#1c1b18; --bg2:#222019; --bg3:#17160f;
  --margin-line:#7a4a42;
}
*{box-sizing:border-box;}

/* ---------- 네비게이션 ---------- */
.site-nav{
  position:sticky;top:0;z-index:30;
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:12px 22px;background:color-mix(in srgb, var(--paper) 88%, transparent);
  backdrop-filter:saturate(1.2) blur(8px);
  border-bottom:1px solid var(--line);
  transition:background-color .35s,border-color .35s;
}
.site-nav .brand{
  font-family:'Gowun Batang',serif;font-weight:700;font-size:18px;
  color:var(--ink);text-decoration:none;white-space:nowrap;
}
.site-nav .nav-links{display:flex;gap:4px;flex-wrap:wrap;margin-left:6px;}
.site-nav .nav-links a{
  color:var(--ink-soft);text-decoration:none;font-size:14px;
  padding:7px 12px;border-radius:8px;transition:background-color .15s,color .15s;
}
.site-nav .nav-links a:hover{background:var(--accent-soft);color:var(--accent);}
.site-nav .nav-links a.active{color:var(--accent);font-weight:700;}
.site-nav .spacer{flex:1 1 auto;}

.theme-toggle{
  width:40px;height:40px;border-radius:50%;flex:none;
  border:1.5px solid var(--line-strong);background:var(--card);color:var(--ink);
  font-size:18px;cursor:pointer;line-height:1;
  display:flex;align-items:center;justify-content:center;
  transition:transform .25s, background-color .35s, border-color .2s, box-shadow .2s;
}
.theme-toggle:hover{transform:rotate(22deg) scale(1.1);box-shadow:0 4px 14px rgba(0,0,0,.12);}

/* ---------- 콘텐츠 페이지 본문 ---------- */
.page-body{
  font-family:'Noto Sans KR',sans-serif;color:var(--ink);margin:0;
  font-size:16px;line-height:1.75;min-height:100vh;
  background:
    radial-gradient(circle at 20% 10%, var(--bg1) 0%, transparent 40%),
    radial-gradient(circle at 90% 80%, var(--bg2) 0%, transparent 45%),
    var(--bg3);
  -webkit-font-smoothing:antialiased;
  transition:background-color .35s ease, color .35s ease;
}
.content-sheet{
  max-width:780px;margin:34px auto;background:var(--paper);
  border-radius:8px;box-shadow:var(--shadow);
  padding:48px 52px 56px;position:relative;
  animation:sheetIn .6s cubic-bezier(.22,1,.36,1) both;
  transition:background-color .35s;
}
@keyframes sheetIn{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:none;}}
.content-sheet h1{
  font-family:'Gowun Batang',serif;font-size:30px;margin:0 0 6px;letter-spacing:1px;
  border-bottom:2px solid var(--ink);padding-bottom:16px;
}
.content-sheet .updated{color:var(--ink-soft);font-size:13px;margin:14px 0 26px;}
.content-sheet .lead{font-size:17px;color:var(--ink);margin:0 0 24px;}
.content-sheet h2{
  font-family:'Gowun Batang',serif;font-size:21px;margin:34px 0 12px;
  display:flex;align-items:center;gap:9px;padding-bottom:8px;border-bottom:1px solid var(--line);
}
.content-sheet h2::before{content:"";width:12px;height:12px;background:var(--accent);border-radius:3px;transform:rotate(45deg);flex:none;}
.content-sheet h3{font-size:16.5px;margin:22px 0 8px;}
.content-sheet p{margin:0 0 14px;}
.content-sheet ul,.content-sheet ol{margin:0 0 16px;padding-left:22px;}
.content-sheet li{margin:6px 0;}
.content-sheet a{color:var(--accent);text-decoration:underline;text-underline-offset:2px;}
.content-sheet strong{color:var(--ink);font-weight:700;}
.content-sheet .note{
  background:var(--accent-soft);border:1px solid var(--line);border-radius:10px;
  padding:14px 18px;margin:18px 0;font-size:14.5px;color:var(--ink);
}
.content-sheet .cta{
  display:inline-block;margin-top:10px;background:var(--ink);color:var(--paper);
  text-decoration:none;padding:12px 26px;border-radius:8px;font-size:15px;
  transition:opacity .15s;
}
.content-sheet .cta:hover{opacity:.88;}
.faq dt{font-weight:700;margin-top:16px;}
.faq dd{margin:4px 0 0;color:var(--ink-soft);}

/* ---------- 광고 영역 ---------- */
.ad-slot{
  max-width:780px;margin:18px auto;padding:10px;text-align:center;
  min-height:90px;
}
.ad-slot .ad-label{font-size:11px;color:var(--ink-soft);letter-spacing:1px;text-transform:uppercase;margin-bottom:6px;}

/* ---------- 푸터 ---------- */
.site-footer{
  border-top:1px solid var(--line);margin-top:40px;
  padding:30px 22px 50px;text-align:center;color:var(--ink-soft);
  transition:border-color .35s;
}
.site-footer .nav-links{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-bottom:14px;}
.site-footer .nav-links a{color:var(--ink-soft);text-decoration:none;font-size:13px;padding:4px 10px;border-radius:6px;}
.site-footer .nav-links a:hover{color:var(--accent);background:var(--accent-soft);}
.site-footer p{margin:6px 0;font-size:13px;}
.site-footer .disclaimer{font-size:12px;opacity:.85;}

@media(prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important;}}
@media(max-width:680px){
  .content-sheet{padding:32px 22px 40px;margin:18px auto;}
  .content-sheet h1{font-size:24px;}
  .page-body{font-size:15px;}
  .site-nav{padding:10px 14px;gap:10px;}
  .site-nav .nav-links a{padding:6px 9px;font-size:13px;}
}
