/* Presentation page only (not part of the skin) */
* { box-sizing: border-box; }
body {
  margin: 0; min-height: 100vh; color: #f3e9d8; font-family: "Inter", system-ui, sans-serif;
  background-color: #120c07;
  background-image:
    radial-gradient(900px 520px at 50% 30%, rgb(234 168 60 / 0.16), transparent 70%),
    radial-gradient(600px 400px at 85% 100%, rgb(181 104 15 / 0.12), transparent 70%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='41.57' viewBox='0 0 24 41.57'><path d='M12 0l12 6.93v13.86L12 27.71 0 20.79V6.93zM0 34.64l12 6.93 12-6.93' fill='none' stroke='%23eaa83c' stroke-opacity='.05' stroke-width='.8'/></svg>");
  -webkit-font-smoothing: antialiased;
}
.hero { max-width: 1100px; margin: 0 auto; padding: clamp(36px, 6vw, 72px) 24px 30px; display: grid; grid-template-columns: auto 1fr; gap: 10px 48px; align-items: end; }
.kicker { grid-column: 1 / -1; margin: 0; font: 600 11px/1 "Inter", sans-serif; letter-spacing: 0.26em; text-transform: uppercase; color: #d9a24e; }
h1 { margin: 0; font: 400 clamp(60px, 9.5vw, 116px)/0.88 "Fraunces", serif; letter-spacing: -0.02em; color: #f6efe2; }
h1 em { font-style: italic; color: #eaa83c; }
.rationale { margin: 0; padding: 0 0 0 22px; list-style: none; border-left: 2px solid rgb(234 168 60 / 0.35); display: grid; gap: 7px; font-size: 14.5px; line-height: 1.5; color: #e2d3bb; max-width: 60ch; }
.stage { max-width: 1100px; margin: 0 auto; padding: 0 24px; }
.stage .hj-player { filter: drop-shadow(0 40px 50px rgb(0 0 0 / 0.6)); }
.foot { max-width: 1100px; margin: 0 auto; padding: 30px 24px 48px; font-size: 11.5px; line-height: 1.8; color: #a58f6e; letter-spacing: 0.04em; }
@media (max-width: 760px) { .hero { grid-template-columns: 1fr; } .rationale { padding-left: 14px; } }
