/* FaceCoach hosting — shared design tokens & global components Loaded by: index.html, whitepaper.html, support.html, privacy-policy.html Do not import into admin/ or email-verified/. */ @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;700;800&display=swap'); :root{ --teal:#0e7a6a; --teal-dark:#0b5046; --teal-soft:#e6f2ef; --ink:#1d2a27; --muted:#5d6b67; --line:#e2e8e5; --bg:#f5f8f7; --surface:#ffffff; --warn-bg:#FFF4E6; --warn-border:#D97706; --warn-text:#92400E; } body{ font-family:'Noto Sans KR',-apple-system,BlinkMacSystemFont, 'Apple SD Gothic Neo','Segoe UI','Malgun Gothic',sans-serif; } /* Top navigation — shared across 4 pages */ .top-nav{ display:flex;flex-wrap:wrap;gap:14px 24px;justify-content:center;align-items:center; max-width:1000px;margin:0 auto 18px;padding:10px 8px; } .top-nav-links{ display:flex;flex-wrap:wrap;gap:12px 18px; font-size:13px;font-weight:700;letter-spacing:.02em; } .top-nav-links a{color:var(--muted);text-decoration:none;} .top-nav-links a:hover{color:var(--teal);} .top-nav-links a[aria-current="page"]{color:var(--teal-dark);} /* Nav download CTA (text-only buttons matching home main box style) */ .top-nav-cta{ display:flex;gap:0.5rem;align-items:center;margin-left:auto; } .nav-dl-btn{ display:inline-block;background:var(--teal);color:#fff; text-decoration:none;font-size:0.85rem;font-weight:700; padding:0.4rem 0.9rem;border-radius:6px; transition:background .15s;white-space:nowrap; } .nav-dl-btn:hover{background:var(--teal-dark);} /* Language-aware visibility — driven by */ .nav-dl-btn[data-lang]{display:none;} html[lang="ko"] .nav-dl-btn[data-lang="ko"], html[lang="en"] .nav-dl-btn[data-lang="en"], html[lang="ja"] .nav-dl-btn[data-lang="ja"]{display:inline-block;} /* Brand icon (app icon) — shared across 4 pages */ .brand-icon{ width:32px;height:32px;border-radius:7px; vertical-align:middle;margin-right:10px; object-fit:cover;flex:0 0 auto; } @media (max-width:768px){ .top-nav{gap:12px 18px;} .top-nav-cta{width:100%;justify-content:center;margin-left:0;margin-top:4px;} } @media (max-width:520px){ .top-nav-links{font-size:12.5px;gap:10px 14px;} .nav-dl-btn{font-size:0.8rem;padding:0.35rem 0.75rem;} .brand-icon{width:28px;height:28px;border-radius:6px;} }