@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700&family=Inter:wght@400;500;600&display=swap');
:root{--bg:#0A0614;--surface:#120A22;--surface-2:#1A1030;--ink:#F0EAFB;--muted:#8E84A3;--accent:#E4508A;--accent-2:#F27BAB;--border:#241639;--on-accent:#FFFFFF;--fh:'Playfair Display', Georgia, serif;--fb:'Inter', system-ui, sans-serif;}
*,*::before,*::after{box-sizing:border-box;} html,body{margin:0;padding:0;}
body{background:var(--bg);color:var(--ink);font-family:var(--fb);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column;}
a{color:var(--accent);text-decoration:none;} a:hover{color:var(--accent-2);text-decoration:underline;text-underline-offset:3px;}
.top{padding:22px clamp(20px,4vw,40px);display:flex;justify-content:space-between;}
.brand{font-family:var(--fh);font-weight:700;color:var(--ink);}
.brand:hover{color:var(--ink);text-decoration:none;}
.top>div{display:flex;gap:22px;} .top>div a{color:var(--muted);font-size:.9rem;}
.top>div a:hover{color:var(--ink);text-decoration:none;}
.hero{background:linear-gradient(135deg,var(--accent) 0%,var(--accent-2) 100%);color:var(--on-accent);padding:clamp(48px,8vw,96px) clamp(24px,6vw,60px);}
.hero__in{max-width:900px;margin:0 auto;animation:rise .8s ease .1s backwards;}
.tag{display:inline-block;font-family:var(--fh);font-size:.78rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--on-accent);padding:6px 14px;border:1px solid color-mix(in srgb,var(--on-accent) 40%,transparent);background:color-mix(in srgb,var(--on-accent) 12%,transparent);border-radius:999px;margin-bottom:22px;}
.hero h1{font-family:var(--fh);font-weight:700;font-size:clamp(2.4rem,5.5vw,4.2rem);line-height:1.02;letter-spacing:-0.03em;margin:0 0 18px;color:var(--on-accent);max-width:20ch;}
.hero p{color:color-mix(in srgb,var(--on-accent) 90%,transparent);font-size:1.12rem;margin:0;max-width:56ch;}
.doc{flex:1;max-width:780px;width:100%;margin:0 auto;padding:clamp(40px,6vw,80px) clamp(20px,4vw,40px);}
.quickref{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:22px;background:var(--surface);border:1px solid var(--border);border-radius:16px;margin-bottom:40px;animation:rise .8s ease .2s backwards;}
.quickref div{display:flex;flex-direction:column;gap:4px;}
.quickref span{font-family:var(--fh);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-weight:600;}
.quickref strong{font-family:var(--fh);font-weight:600;color:var(--ink);font-size:.95rem;}
.quickref a{color:var(--accent);}
article h2{font-family:var(--fh);font-weight:700;font-size:1.24rem;letter-spacing:-0.015em;margin:32px 0 10px;color:var(--ink);}
article h2:first-of-type{margin-top:0;}
article p{margin:0 0 14px;color:var(--ink);}
article p strong{color:var(--ink);font-weight:700;}
.bot{padding:18px clamp(20px,4vw,40px);display:flex;justify-content:space-between;font-size:.84rem;color:var(--muted);border-top:1px solid var(--border);background:var(--surface);}
.bot a{color:var(--muted);} .bot a:hover{color:var(--ink);text-decoration:none;}
@keyframes rise{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
@media (max-width:780px){.quickref{grid-template-columns:1fr 1fr;}}
::selection{background:color-mix(in srgb,var(--accent) 40%,transparent);color:var(--ink);}
