/* September 2026: a quieter, more spacious presentation. */
:root { --bg:#101010; --panel:#171717; --amber:#FFD60A; }
.wrap { max-width:1260px; padding-inline:clamp(24px,5vw,72px); }
.top .wrap { min-height:96px; gap:32px; }
.brand { gap:14px; font-size:19px; }
.brand .logo { width:64px; height:64px; }
.nav { gap:20px; font-size:12px; }
section { padding-bottom:clamp(80px,10vw,140px); }
.page:not(#page-overview)>section:first-child { padding-top:40px; }
.sec-head { padding-block:40px 48px; margin-bottom:40px; }
.sec-head::before { display:none; }
.sec-head h2 { max-width:24ch; font-size:clamp(2.3rem,4.5vw,3.8rem); }
.sec-head .lead { margin-top:24px; max-width:64ch; line-height:1.8; }
.eyebrow { margin-bottom:20px; }
.hero .wrap { gap:70px; align-items:center; }
.hero-still { margin-top:20px; }
.hero-still img { display:block; width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:20px; }
.hero-still p { color:var(--muted); margin-top:18px; font-size:14px; }
.hero-emblem { opacity:.05; }
.provenance { padding:24px; margin-block:24px 52px; background:none; border-left:0; }
.tiers,.editions,.cards,.prod-points,.pfeats { gap:28px; }
.tier { padding:28px; gap:20px; border-color:#303030; }
.tier .pic { margin:-28px -28px 8px; }
.tier ul { gap:14px; padding-bottom:20px; }
.tier .btn { margin-top:auto; }
.tier h3 { font-size:1.8rem; }
.tier .made { display:none; }
.pfeat { padding:24px; gap:24px; }
.pfeats { grid-template-columns:1fr; }
.pfeat img { max-height:360px; }
.prod-points>div,.edition,.ctl>div { padding:28px; }
.plan-note { margin-top:48px; padding:32px 0; border-top:1px solid var(--line); display:grid; gap:16px; max-width:850px; }
.plan-note p { color:var(--muted); line-height:1.8; }
.ent-sum { grid-template-columns:1fr; }
.pairing-map { display:grid; grid-template-columns:1fr .65fr 1fr; align-items:center; gap:28px; padding:32px 0; }
.pairing-map article { background:var(--panel); border:1px solid var(--line); border-radius:20px; padding:32px; display:grid; gap:18px; }
.pairing-map article p { color:var(--muted); }
.pairing-map ul { padding-left:20px; font-size:14px; line-height:2; }
.pairing-map article:first-child { border-top:3px solid #42d392; }
.pairing-map article:last-child { border-top:3px solid var(--amber); }
.pairing-arrow { display:grid; gap:16px; text-align:center; color:var(--muted); font-size:12px; }
.pairing-arrow b { font-size:40px; color:var(--amber); }
.works-logo { width:72px; height:72px; vertical-align:middle; margin-right:16px; }
.text-link { display:inline-block; color:var(--amber); margin-top:16px; }
.example-trigger { cursor:zoom-in; display:block; width:100%; padding:0; border:0; background:none; color:inherit; border-radius:inherit; }
.example-trigger:focus-visible,a:focus-visible,button:focus-visible { outline:2px solid var(--amber); outline-offset:4px; }
dialog { color:var(--text); background:#111; border:1px solid #3a3a3a; border-radius:20px; padding:28px; max-width:min(1120px,95vw); width:95vw; max-height:92dvh; }
dialog::backdrop { background:#000c; backdrop-filter:blur(8px); }
.modal-bar { display:flex; gap:20px; align-items:center; flex-wrap:wrap; padding-bottom:22px; }
.modal-bar h2 { font-size:21px; margin-right:auto; }
.modal-bar button { border:1px solid #555; background:#222; color:white; border-radius:8px; padding:10px 18px; cursor:pointer; }
.modal-bar a { font-size:13px; color:var(--amber); }
#example-content img { display:block; max-height:74dvh; max-width:100%; width:auto; margin:auto; object-fit:contain; }
#example-content iframe { display:block; width:100%; height:74dvh; border:0; background:#fff; }
.report-controls { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:16px; margin:0 0 20px; position:sticky; top:0; background:#111; padding:8px; }
.report-controls button { padding:9px 14px; background:#222; color:#fff; border:1px solid #555; border-radius:8px; cursor:pointer; }
.report-controls button:disabled { opacity:.35; cursor:default; }
#example-content img.report-page { max-height:60dvh; width:auto; max-width:100%; }
#example-content img.report-page.enlarged { max-height:none; width:100%; max-width:1024px; }
#contact-dialog { width:min(720px,95vw); }
#contact-form { display:grid; gap:22px; margin-top:28px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
#contact-form label { display:grid; gap:9px; font-size:14px; }
#contact-form input:not([type=checkbox]),#contact-form select,#contact-form textarea { box-sizing:border-box; width:100%; min-width:0; background:#191919; color:#eee; border:1px solid #454545; border-radius:8px; padding:12px; font:inherit; }
#contact-form label.consent { display:flex; align-items:flex-start; gap:10px; }
.contact-trap { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
@media(max-width:1120px) { .top .wrap { flex-wrap:wrap; row-gap:0; padding-block:10px; }.nav{order:3;width:100%;overflow-x:auto;margin:0;padding-block:12px;gap:24px}.top .login{margin-left:auto} }
@media(max-width:760px) { .pairing-map{grid-template-columns:1fr}.pairing-arrow b{transform:rotate(90deg)}.pairing-arrow{gap:6px}.form-grid{grid-template-columns:1fr}.top .wrap{min-height:80px}.brand .logo{width:52px;height:52px}.hero .wrap{gap:32px}.hero-still img{aspect-ratio:16/9}.sec-head{padding-block:24px}.tiers{gap:40px} }
