@font-face { font-family: 'Fraunces'; src: url(/media/Fraunces-0.woff2) format('woff2'); font-weight: 500 700; font-display: swap; }
@font-face { font-family: 'Inter'; src: url(/media/Inter-0.woff2) format('woff2'); font-weight: 400 700; font-display: swap; }
:root { --bg: #FFF7F4; --ink: #2A1A22; --soft: #7D6570; --line: rgba(60, 20, 40, .1); --accent: #EE4A80; --grad: linear-gradient(135deg, #FF9A5C 0%, #FF5C8A 52%, #D9307A 100%); }
@media (prefers-color-scheme: dark) { :root { --bg: #140D12; --ink: #F7EAF0; --soft: #B79FAB; --line: rgba(255, 255, 255, .1); } }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: radial-gradient(70% 40% at 50% 0, rgba(255, 150, 120, .22), transparent 70%), var(--bg); color: var(--ink); font: 400 17px/1.65 'Inter', system-ui, sans-serif; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
main { max-width: 720px; margin: 0 auto; padding: 28px 16px 64px; }
.top { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); text-decoration: none; font: 700 22px 'Fraunces', serif; margin-bottom: 32px; }
.top img { width: 34px; height: 34px; border-radius: 9px; }
h1, h2 { font-family: 'Fraunces', Georgia, serif; font-weight: 700; letter-spacing: -.01em; }
h1 { font-size: clamp(34px, 7vw, 52px); line-height: 1.05; margin: 0 0 12px; }
h2 { font-size: 23px; margin: 34px 0 6px; }
p, li { color: var(--soft); }
b, strong { color: var(--ink); font-weight: 600; }
a { color: var(--accent); overflow-wrap: anywhere; }
ul { padding-left: 22px; }
li { margin: 8px 0; }
.meta { color: var(--accent); font-size: 15px; }
footer { margin-top: 44px; padding-top: 20px; border-top: 1px solid var(--line); font-size: 14px; color: var(--soft); }
footer a { color: var(--soft); margin-right: 18px; }
/* landing */
.hero { text-align: center; padding: 20px 0 10px; }
.hero img.icon { width: 120px; height: 120px; border-radius: 28px; box-shadow: 0 18px 40px rgba(217, 48, 122, .3); }
.hero h1 { margin-top: 22px; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; font-size: clamp(44px, 10vw, 68px); }
.hero p.lead { font-size: 19px; max-width: 520px; margin: 0 auto 22px; }
.badge { display: inline-flex; align-items: center; gap: 8px; padding: 14px 26px; border-radius: 16px; background: var(--grad); color: #fff; font-weight: 600; text-decoration: none; box-shadow: 0 10px 26px rgba(238, 74, 128, .35); }
.badge.soon { opacity: .9; }
.shots { display: flex; gap: 14px; justify-content: center; margin: 36px -16px 10px; padding: 0 16px; overflow-x: auto; }
.shots img { width: min(31%, 220px); min-width: 170px; border-radius: 22px; box-shadow: 0 16px 36px rgba(90, 10, 50, .2); }
.feats { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; margin-top: 30px; }
.feats div { background: color-mix(in srgb, var(--bg) 70%, #fff); border: 1px solid var(--line); border-radius: 18px; padding: 16px; }
.feats b { display: block; font-size: 16px; }
.feats span { font-size: 15px; color: var(--soft); }