/* Ever After by Kyrosity: shared tokens and components */
:root{
  --ink:#0e0c0a; --ink-2:#17140f; --ivory:#f4ede2; --ivory-2:#d9cfc0; --muted:#9a8f82;
  --gold:#c9a46a; --gold-2:#e2c58f; --line:rgba(244,237,226,.14); --line-2:rgba(244,237,226,.28);
  --paper:#f3ecdf; --paper-ink:#1d1914; --paper-muted:#665b4e; --paper-line:rgba(29,25,20,.16); --bronze:#765620;
  --serif:'Cormorant Garamond',Georgia,serif; --sans:'Manrope',system-ui,sans-serif;
  --max:1180px; --ease:cubic-bezier(.23,1,.32,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:clip;-webkit-text-size-adjust:100%}
body{background:var(--ink);color:var(--ivory);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.04;letter-spacing:-.01em;text-wrap:balance}
h1{font-size:clamp(42px,7vw,104px)}
h2{font-size:clamp(34px,4.6vw,66px)}
h3{font-size:clamp(23px,2.2vw,30px)}
p{text-wrap:pretty}
.wrap{width:min(var(--max),calc(100% - 44px));margin-inline:auto}
.kicker{font-size:14px;font-weight:600;color:var(--gold);margin-bottom:14px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
:focus-visible{outline:2px solid var(--gold-2);outline-offset:3px;border-radius:4px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 30px;border-radius:999px;border:1px solid transparent;font-weight:600;font-size:16px;cursor:pointer;transition:transform .16s ease-out,background .25s,color .25s,border-color .25s;white-space:nowrap}
.btn.pressed{transform:scale(.97)}
.btn-gold{background:var(--gold);color:var(--ink)}
.btn-gold:hover{background:var(--gold-2)}
.btn-ghost{border-color:var(--line-2);color:var(--ivory);background:transparent}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold-2)}
.btn-ink{background:var(--paper-ink);color:var(--paper)}
.btn-ink:hover{background:#000}
.btn-line{border-color:var(--paper-line);color:var(--paper-ink);background:transparent}
.btn-line:hover{border-color:var(--paper-ink)}
.btn-sm{min-height:44px;padding:0 20px;font-size:15px}
.btn[disabled]{opacity:.5;cursor:not-allowed}

/* top bar */
.bar{position:fixed;inset:0 0 auto 0;z-index:50;padding:18px 0;transition:background .3s,padding .3s;text-shadow:0 1px 14px rgba(0,0,0,.45)}
.bar.solid{background:rgba(14,12,10,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);padding:10px 0;text-shadow:none}
.bar .wrap{display:flex;justify-content:space-between;align-items:center;gap:20px}
.logo{font-family:var(--serif);font-size:25px;line-height:1.1;letter-spacing:.01em;display:inline-block;padding:4px 0}
.logo small{display:block;font-family:var(--sans);font-size:11px;letter-spacing:.06em;color:var(--ivory-2)}
.bar nav{display:flex;align-items:center;gap:26px;font-size:14px;font-weight:500}
.bar nav a:not(.btn){opacity:.85;padding:12px 0}
.bar nav a:not(.btn):hover{opacity:1}
@media(max-width:860px){.bar nav a:not(.btn){display:none}}
@media(max-width:560px){.bar nav .btn{display:none}}

/* forms */
.field{display:grid;gap:7px}
.field label{font-size:14px;font-weight:600;color:var(--ivory-2)}
.field .hint{font-size:13px;color:var(--muted)}
.input{width:100%;min-height:54px;padding:0 16px;border-radius:10px;border:1px solid var(--line-2);background:rgba(244,237,226,.05);color:var(--ivory);font-size:16px}
.input::placeholder{color:#7d7368}
.input:focus{outline:2px solid var(--gold-2);outline-offset:1px;border-color:transparent}
.input[aria-invalid="true"]{border-color:#e39a86}
.err{font-size:14px;color:#f0b3a2;min-height:0}

/* footer */
.foot{border-top:1px solid var(--line);padding:30px 0;font-size:14px;color:var(--muted)}
.foot .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;align-items:center}
.foot a{display:inline-block;padding:12px 6px}
.foot a:hover{color:var(--ivory)}

/* simple document pages (privacy, terms) */
.doc{padding:140px 0 100px}
.doc .wrap{max-width:720px}
.doc h1{font-size:clamp(38px,6vw,64px);margin-bottom:10px}
.doc h2{font-size:28px;margin:44px 0 10px}
.doc p,.doc li{color:var(--ivory-2);margin-top:12px}
.doc ul{padding-left:20px}
.doc a{color:var(--gold-2);text-decoration:underline}

@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}