:root{
  --bg: oklch(95% 0.013 80);
  --bg-warm: oklch(93% 0.018 78);
  --card: oklch(91% 0.020 78);
  --ink: oklch(18% 0.008 70);
  --ink-soft: oklch(38% 0.012 75);
  --ink-mute: oklch(56% 0.015 75);
  --line: oklch(86% 0.018 78);
  --rose: oklch(67% 0.075 78);
  --rose-deep: oklch(58% 0.075 72);
  --rose-soft: oklch(90% 0.035 80);
  --gold: oklch(67% 0.075 78);
  --gold-grad: oklch(67% 0.075 78);
  --serif: "DM Serif Display", "Times New Roman", serif;
  --sans: "Inter", system-ui, sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:var(--bg);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;font-weight:400;}
.container{max-width:820px;margin:0 auto;padding:0 32px;}

nav.top{position:sticky;top:0;z-index:50;background:color-mix(in oklab,var(--bg) 92%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);}
nav.top .inner{max-width:1240px;margin:0 auto;padding:18px 32px;display:flex;align-items:center;justify-content:space-between;}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;}
.brand-logo{display:block;height:46px;width:auto;}
@media(max-width:600px){.brand-logo{height:38px;}}
.back-link{font-size:.88rem;color:var(--ink-soft);text-decoration:none;display:inline-flex;align-items:center;gap:8px;transition:color .2s;}
.back-link:hover{color:var(--rose-deep);}
.back-link .arr{transition:transform .2s;}
.back-link:hover .arr{transform:translateX(-3px);}

header.page-head{padding:80px 0 56px;border-bottom:1px solid var(--line);}
.eyebrow{font-family:var(--sans);font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--rose-deep);font-weight:500;display:inline-flex;align-items:center;gap:10px;}
.eyebrow::before{content:"";width:24px;height:1px;background:var(--rose);}
header.page-head h1{font-family:var(--serif);font-weight:400;letter-spacing:-.01em;font-size:clamp(2.4rem,4.5vw,3.6rem);line-height:1.05;margin-top:20px;}
header.page-head h1 em{color:var(--rose-deep);font-style:italic;}
header.page-head .meta{margin-top:24px;font-size:.92rem;color:var(--ink-mute);display:flex;gap:24px;flex-wrap:wrap;}

main.content{padding:56px 0 96px;}
main.content .intro{font-family:var(--serif);font-size:1.3rem;line-height:1.5;color:var(--ink-soft);font-style:italic;font-weight:400;padding:24px 28px;background:var(--bg-warm);border-left:3px solid var(--rose);border-radius:6px;margin-bottom:48px;}
main.content h2{font-family:var(--serif);font-weight:400;font-size:1.8rem;margin-top:48px;margin-bottom:16px;letter-spacing:-.005em;display:flex;align-items:baseline;gap:16px;}
main.content h2 .num{font-family:var(--serif);font-style:italic;color:var(--rose);font-size:1.1rem;letter-spacing:.1em;}
main.content h3{font-family:var(--sans);font-weight:600;font-size:1rem;margin-top:24px;margin-bottom:10px;letter-spacing:.01em;}
main.content p{color:var(--ink-soft);margin-bottom:14px;}
main.content ul{list-style:none;margin-bottom:14px;}
main.content ul li{color:var(--ink-soft);padding-left:22px;position:relative;margin-bottom:8px;}
main.content ul li::before{content:"";position:absolute;left:0;top:11px;width:10px;height:1px;background:var(--rose);}
main.content a{color:var(--rose-deep);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;}
main.content a:hover{color:var(--ink);}
main.content strong{color:var(--ink);font-weight:500;}

footer{background:oklch(18% 0.015 40);color:color-mix(in oklab,var(--bg) 80%,transparent);padding:48px 0 32px;}
footer .container{max-width:1240px;}
footer a{color:color-mix(in oklab,var(--bg) 80%,transparent);text-decoration:none;}
footer a:hover{color:var(--rose);}
.foot-base{display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;font-size:.82rem;color:color-mix(in oklab,var(--bg) 55%,transparent);}

@media(max-width:640px){
  header.page-head{padding:56px 0 40px;}
  main.content{padding:40px 0 72px;}
  main.content .intro{font-size:1.1rem;padding:20px 22px;}
  main.content h2{font-size:1.45rem;gap:12px;}
  main.content h2 .num{font-size:.95rem;}
}
