/* NARRO typography: Pretendard Variable, SIL Open Font License 1.1.
   https://github.com/orioncactus/pretendard */
:root { --font-ui: "Pretendard Variable", Pretendard, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif; }
body { font-family:var(--font-ui); font-size:17px; font-weight:400; font-stretch:normal; line-height:1.8; letter-spacing:-.015em; font-kerning:normal; -webkit-font-smoothing:antialiased; }
h1,h2,h3,p,li,strong { word-break:keep-all; overflow-wrap:break-word; }
h1,h2,h3 { text-wrap:balance; }
p,li { text-wrap:pretty; }
section { scroll-margin-top:105px; }
.brand-title { font-size:26px; font-weight:750; letter-spacing:-.035em; }
.brand-sub { font-size:11px; letter-spacing:.065em; line-height:1.6; font-weight:550; }
nav { gap:24px; }
nav a { font-size:15px; font-weight:600; letter-spacing:-.02em; white-space:nowrap; }
.hero-grid { grid-template-columns:1.25fr .85fr; gap:40px; }
.hero h1 { font-size:clamp(32px,3.8vw,48px); line-height:1.4; letter-spacing:-.035em; font-weight:750; margin-bottom:26px; }
.headline-line { display:block; }
.hero p { font-size:18px; line-height:1.85; letter-spacing:-.02em; max-width:35em; margin-bottom:0; }
.intro-sentence { display:block; }
.intro-sentence + .intro-sentence { margin-top:.65em; }
.eyebrow { font-size:12px; letter-spacing:.09em; font-weight:600; margin-bottom:20px; }
.hero-note { font-size:15px; line-height:1.8; letter-spacing:-.02em; text-wrap:pretty; word-break:keep-all; }
.btn { font-size:16px; font-weight:650; letter-spacing:-.02em; line-height:1.5; }
.section-head { margin-bottom:36px; }
.section-head h2,.philosophy h2 { font-size:clamp(28px,3vw,36px); line-height:1.45; letter-spacing:-.03em; font-weight:700; margin-bottom:16px; }
.section-head p { max-width:44em; font-size:17px; line-height:1.85; letter-spacing:-.015em; }
.problem-card h3,.preview-card h3 { font-size:23px; line-height:1.5; font-weight:650; letter-spacing:-.025em; margin-bottom:16px; text-wrap:initial; }
.problem-card p,.preview-card p,.mascot-card p { font-size:16px; line-height:1.85; letter-spacing:-.015em; }
.problem-card .num,.mascot-card .label { font-size:12px; font-weight:600; letter-spacing:.07em; }
.preview-card ul { font-size:16px; line-height:1.85; padding-left:20px; }
.preview-card li+li { margin-top:5px; }
.mascot-card h3 { font-size:26px; line-height:1.4; font-weight:700; letter-spacing:-.025em; }
.mascot-keywords { font-size:14px; line-height:1.8; font-weight:600; }
.philosophy p { font-size:17px; line-height:1.9; letter-spacing:-.01em; max-width:35em; }
.philosophy p+p { margin-top:18px; }
.quote-box { text-align:center; }
.quote-box strong { font-size:24px; line-height:1.7; letter-spacing:-.025em; font-weight:550; text-wrap:balance; margin-inline:auto; }
.footer-meta { font-size:14px; line-height:1.8; letter-spacing:0; }
a:focus-visible { outline:3px solid #94722d; outline-offset:5px; }
@media(min-width:981px) { .problem-card h3 { min-height:3em; } }
@media(max-width:980px) {
 .hero-grid { grid-template-columns:1fr; }
 .hero h1 { font-size:clamp(32px,5.5vw,44px); }
 .hero-visual { max-width:560px; width:100%; }
 .mascot-card { grid-template-columns:100px 1fr; text-align:left; }
 .mascot-card img { width:100px; height:100px; }
}
@media(max-width:760px) {
 .header-inner { gap:12px; padding:14px 0; }
 nav { width:100%; gap:8px 18px; }
 nav a { font-size:14px; line-height:1.8; }
 section { scroll-margin-top:170px; padding:60px 0; }
 .hero { padding:48px 0; }
 .hero h1 { font-size:clamp(26px,5.9vw,40px); line-height:1.45; letter-spacing:-.035em; }
 .hero p,.section-head p,.philosophy p { font-size:16px; line-height:1.85; }
 .section-head h2,.philosophy h2 { font-size:28px; line-height:1.45; }
 .hero-note { font-size:14px; }
 .hero-actions { gap:10px; }
 .btn { padding:13px 20px; font-size:15px; }
 .mascot-card { grid-template-columns:72px 1fr; gap:16px; align-items:start; }
 .mascot-card img { width:72px; height:72px; }
 .quote-box strong { font-size:22px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }