:root { --bg:#f6efe3; --card:#fffaf1; --ink:#241a12; --muted:#6d5c4b; --line:#e0d3bf; --accent:#8f2f1f; --on:#fff8ef; --serif:"Times New Roman","Noto Serif",Times,serif; --sans:-apple-system,system-ui,"Segoe UI",Roboto,sans-serif; }
@media (prefers-color-scheme: dark) { :root { --bg:#1d1610; --card:#2a2118; --ink:#f4eadb; --muted:#b8a68f; --line:#43362a; --accent:#e0805f; --on:#1d1610; } }
* { box-sizing:border-box; }
html,body { margin:0; background:var(--bg); color:var(--ink); }
body { font:19px/1.55 var(--serif); }
a { color:var(--accent); }
h1,h2 { font-weight:400; margin:0; line-height:1.1; }
.wrap { max-width:1040px; margin:0 auto; padding:0 16px; }
.hero { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:48px; align-items:center; padding:64px 0 56px; }
.eyebrow { font:14px var(--sans); color:var(--muted); margin:0 0 14px; }
h1 { font-size:clamp(48px,8vw,84px); }
.lede { font-size:23px; line-height:1.4; margin:22px 0 28px; }
.soon { display:inline-block; font:500 15px var(--sans); padding:13px 18px; border-radius:12px; background:var(--accent); color:var(--on); }
.art { width:100%; max-height:640px; object-fit:contain; display:block; border-radius:10px; }
section { padding:48px 0; border-top:1px solid var(--line); }
section h2 { font-size:34px; margin-bottom:18px; }
.three { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.three h3 { font:500 16px var(--sans); margin:0 0 6px; }
.three p { margin:0; }
.names { display:flex; flex-wrap:wrap; gap:8px 22px; font-size:24px; margin:0; padding:0; list-style:none; }
.more { color:var(--muted); margin:18px 0 0; }
.prices { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-bottom:14px; }
.price { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:22px; }
.price h3 { font:500 16px var(--sans); margin:0 0 4px; }
.price strong { display:block; font-weight:400; font-size:42px; line-height:1.15; }
.price p { margin:8px 0 0; font-size:17px; color:var(--muted); }
.note { font:14px/1.5 var(--sans); color:var(--muted); }
footer { padding:28px 0 40px; border-top:1px solid var(--line); font:14px/1.6 var(--sans); color:var(--muted); }
.doc { max-width:680px; padding:48px 0 64px; }
.doc h1 { font-size:44px; margin-bottom:8px; }
.doc h2 { font-size:25px; margin:30px 0 8px; }
@media (max-width:760px) { .hero { grid-template-columns:minmax(0,1fr); padding:36px 0 40px; gap:28px; } .three,.prices { grid-template-columns:minmax(0,1fr); } .lede { font-size:21px; } }