@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/variable/pretendardvariable.css");
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&display=swap");

:root{
  --mineral:#F7F8FA; --white:#FFFFFF; --graphite:#12161C; --navy:#202A35;
  --steel:#626C78; --steel-light:#8B949F; --line:#DCE1E6;
  --spring:#2F7D59; --spring-dark:#256448; --spring-soft:#EAF4EF;
  --summer:#2459A9; --summer-dark:#194783; --summer-soft:#E9F0FA;
  --autumn:#BD4949; --autumn-dark:#963939; --autumn-soft:#FAECEC;
  --font:"Pretendard Variable",Pretendard,Inter,-apple-system,BlinkMacSystemFont,sans-serif;
  --mono:"IBM Plex Mono","SFMono-Regular",Consolas,monospace;
  --ease:cubic-bezier(.2,.8,.2,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;color:var(--graphite);background:var(--mineral);font-family:var(--font);line-height:1.68;letter-spacing:-.018em;word-break:keep-all;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.proof-shell{width:min(calc(100% - 64px),1160px);margin-inline:auto}
.skip-link{position:fixed;z-index:200;left:16px;top:-60px;padding:10px 14px;color:var(--white);background:var(--graphite);border-radius:6px;transition:top 120ms var(--ease)}
.skip-link:focus{top:16px}
a:focus-visible,button:focus-visible{outline:3px solid rgba(36,89,169,.32);outline-offset:4px}

/* Header base styles; site-nav.css supplies the menu treatment. */
.header{position:sticky;z-index:30;top:0;border-bottom:1px solid var(--line);background:rgba(247,248,250,.92);backdrop-filter:blur(12px)}
.nav{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{min-height:44px;display:inline-flex;align-items:center;gap:12px;font-size:17px;font-weight:720;letter-spacing:-.03em;margin-right:auto}
.mark{width:34px;height:34px;position:relative;flex:0 0 34px;border-radius:5px;background:linear-gradient(135deg,var(--spring) 0 33%,var(--summer) 33% 66%,var(--autumn) 66% 100%)}
.nav-links{display:none;align-items:center;gap:26px;color:var(--steel);font-size:14px;font-weight:560}
.nav-links a{min-height:44px;display:inline-flex;align-items:center}
.nav-links a:hover{color:var(--graphite)}
.nav-links .nav-cta{min-height:44px;height:44px;padding:0 18px;border-radius:6px;color:var(--white);background:var(--summer);display:inline-flex}
.nav-links .nav-cta:hover{background:var(--summer-dark)}
@media(min-width:980px){.nav-links{display:flex}}
.nav-cta-mobile{min-height:44px;height:44px;padding:0 16px;border-radius:6px;color:var(--white);background:var(--summer);font-size:13px;font-weight:650;display:inline-flex;align-items:center}
@media(min-width:980px){.nav-cta-mobile{display:none}}

.proof-eyebrow{margin:0;color:var(--summer);font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.08em;line-height:1.4;text-transform:uppercase}

/* Detail hero */
.proof-detail-hero{padding:75px 0 66px;border-bottom:1px solid var(--line);background:var(--mineral)}
.proof-back{display:inline-flex;margin-bottom:52px;color:var(--summer);font-family:var(--mono);font-size:10px;letter-spacing:.04em}
.proof-detail-hero h1{max-width:900px;margin:18px 0 0;font-size:clamp(32px,4.6vw,54px);font-weight:720;line-height:1.22;letter-spacing:-.045em}

/* Detail layout */
.proof-detail{padding:64px 0 116px;background:var(--white)}
.proof-detail__layout{display:grid;grid-template-columns:220px minmax(0,760px);gap:72px;align-items:start;justify-content:center}
.proof-detail__aside{position:sticky;top:108px;padding-top:4px;color:var(--steel);font-size:12px;line-height:1.7}
.proof-detail__aside-label{margin-bottom:10px;color:var(--steel-light);font-family:var(--mono);font-size:9px;letter-spacing:.08em}
.proof-detail__aside p{margin:0 0 28px}
.proof-detail__tag-group{padding:15px 0;border-top:1px solid var(--line)}
.proof-detail__tag-group>span{display:block;margin-bottom:9px;color:var(--steel-light);font-family:var(--mono);font-size:8px;letter-spacing:.08em}
.proof-detail__tag-group>div{display:flex;flex-wrap:wrap;gap:5px}
.proof-chip{display:inline-flex;padding:4px 6px;border:1px solid var(--line);border-radius:3px;color:var(--summer);font-family:var(--mono);font-size:8px;line-height:1.35;letter-spacing:.03em}

/* Narrative — shared class names with proof-library.html's inline story-* styles (duplicated by design, see plan) */
.story-index{margin:0 0 10px;color:var(--summer);font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.story-lead{margin:20px 0 0;padding:18px 20px;border-left:3px solid var(--summer);color:var(--graphite);background:var(--summer-soft);font-size:16px;font-weight:650;line-height:1.7}
.story-sections{margin-top:32px;display:grid;gap:28px}
.story-section{display:grid;grid-template-columns:150px minmax(0,1fr);gap:28px;padding-top:22px;border-top:1px solid var(--line)}
.story-section h3{margin:0;color:var(--steel);font-family:var(--mono);font-size:10px;line-height:1.5;letter-spacing:.05em;text-transform:uppercase}
.story-section p{margin:0;color:var(--steel);font-size:14.5px;line-height:1.86}
.story-proof{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.story-proof li{padding:10px 12px;color:var(--graphite);background:var(--mineral);border:1px solid var(--line);font-size:13px;font-weight:650;line-height:1.55}

.proof-detail-footer{border-top:1px solid var(--line);background:var(--mineral)}
.proof-detail-footer__inner{min-height:90px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:var(--steel-light);font-family:var(--mono);font-size:9px;letter-spacing:.05em}
.proof-detail-footer__inner a{color:var(--summer)}

@media(max-width:780px){
  .proof-shell{width:min(calc(100% - 36px),1160px)}
  .proof-detail-hero{padding:55px 0 48px}
  .proof-back{margin-bottom:38px}
  .proof-detail-hero h1{font-size:clamp(30px,9vw,44px)}
  .proof-detail{padding:52px 0 76px}
  .proof-detail__layout{display:flex;flex-direction:column;gap:36px}
  .proof-detail__aside{position:static;width:100%;padding:0 0 24px;border-bottom:1px solid var(--line)}
  .story-lead{padding:15px 16px;font-size:14.5px}
  .story-section{grid-template-columns:1fr;gap:9px}
  .proof-detail-footer__inner{min-height:78px;display:block;padding:20px 0;font-size:8px;line-height:2}
  .proof-detail-footer__inner a{display:block}
}
