:root { --bg:#faf2e4; --ink:#2d2926; --muted:#6f675f; --card:#fffdf8; --line:#ded8ca; --accent:#a8452a; --accent-dark:#7e3220; --accent-tint:#f3e2ce; }
    * { box-sizing:border-box; }
    body { margin:0; min-height:100vh; background:var(--bg); color:var(--ink); font-family:Inter,system-ui,sans-serif; }
    main { width:min(980px,calc(100% - 32px)); margin:0 auto; padding:64px 0 80px; }
    .brand { display:inline-flex; align-items:center; gap:10px; font-weight:700; letter-spacing:-.02em; text-decoration:none; color:inherit; }
    .brand-mark { width:30px; height:30px; border:2px solid currentColor; border-radius:9px; display:grid; place-items:center; font-family:Fraunces,serif; }
    .eyebrow { margin:56px 0 12px; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); }
    h1 { max-width:680px; margin:0; font:600 clamp(40px,6vw,68px)/.98 Fraunces,Georgia,serif; letter-spacing:-.045em; }
    .intro { max-width:650px; margin:20px 0 38px; color:var(--muted); font-size:17px; line-height:1.65; }
    .account { display:none; margin:0 0 18px; padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:rgba(255,253,248,.7); color:var(--muted); font-size:13px; }
    .account strong { color:var(--ink); font-weight:600; }
    .status { display:none; margin:0 0 20px; padding:14px 16px; border:1px solid var(--line); border-radius:12px; background:rgba(255,253,248,.7); color:var(--muted); }
    .plans { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
    .plan { position:relative; display:flex; flex-direction:column; background:var(--card); border:1px solid var(--line); border-radius:20px; padding:28px; box-shadow:0 12px 40px rgba(45,41,38,.06); }
    .plan.featured { border-color:var(--accent); }
    .badge { position:absolute; top:28px; right:28px; display:inline-block; padding:6px 9px; border-radius:999px; background:var(--accent-tint); color:var(--accent-dark); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
    h2 { margin:0 0 8px; font-size:20px; }
    .price { margin:18px 0 6px; font-size:42px; font-weight:700; letter-spacing:-.04em; }
    .price span { font-size:15px; font-weight:500; color:var(--muted); letter-spacing:0; }
    .billing { min-height:22px; margin-bottom:24px; color:var(--muted); font-size:13px; }
    .continue { width:100%; margin-top:auto; padding:13px 18px; border:0; border-radius:10px; background:var(--accent); color:white; font:600 14px Inter,sans-serif; cursor:pointer; transition:background .2s ease, box-shadow .2s ease, transform .2s ease; }
    .continue:not(:disabled):hover { background:var(--accent-dark); box-shadow:0 8px 18px rgba(126,50,32,.25); transform:translateY(-1px); }
    .continue:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
    .continue:disabled { cursor:not-allowed; opacity:.55; }
    .note { margin:30px 0 0; color:var(--muted); font-size:13px; line-height:1.6; }
    .error { display:none; padding:18px; border:1px solid #d9b8b8; border-radius:14px; background:#fff7f7; color:#7d3030; line-height:1.5; }
    .back { display:inline-block; margin-top:28px; color:var(--ink); font-size:14px; font-weight:600; text-decoration:none; }
    @media (max-width:700px) { main{padding-top:36px}.plans{grid-template-columns:1fr}h1{font-size:48px} }


.promo { display:grid; gap:8px; max-width:720px; margin:0 0 28px; padding:18px 20px; border:1px solid var(--accent); border-radius:14px; background:var(--accent-tint); line-height:1.6; }
.promo strong { color:var(--accent-dark); }
.promo code { display:inline-block; padding:2px 6px; border-radius:5px; background:rgba(255,255,255,.72); font-weight:700; letter-spacing:.04em; }
