
:root{--gold:#d4af37;--ink:#0b0e1a;--paper:#f7f3ea}
*{box-sizing:border-box} body{margin:0;font-family:system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;background:var(--ink);color:#f2ede0;line-height:1.6}
a{color:var(--gold)} .wrap{max-width:1100px;margin:0 auto;padding:0 24px}
header{padding:28px 0;border-bottom:1px solid #2a2f45;position:sticky;top:0;background:rgba(11,14,26,.95);z-index:5}
nav{display:flex;gap:22px;flex-wrap:wrap;align-items:center} nav a{text-decoration:none;font-weight:600;color:#f2ede0} nav a:hover{color:var(--gold)} .brand{font-size:1.4rem;font-weight:800;letter-spacing:.04em;color:var(--gold);margin-right:auto;text-decoration:none}
.hero{padding:90px 0 70px;background:radial-gradient(1000px 500px at 20% 0%,#1d2440,transparent),radial-gradient(800px 400px at 90% 20%,#3a2f10,transparent)}
.hero h1{font-size:clamp(3rem,8vw,6.5rem);line-height:.95;margin:0 0 20px;letter-spacing:-.02em}
.hero h1 span{color:var(--gold)} .hero p.lede{font-size:clamp(1.2rem,2.5vw,1.7rem);max-width:760px;color:#cfc8b4}
.btn{display:inline-block;background:var(--gold);color:#111;padding:14px 28px;border-radius:999px;font-weight:700;text-decoration:none;margin:8px 12px 0 0}
.btn.ghost{background:transparent;border:2px solid var(--gold);color:var(--gold)}
section{padding:56px 0} h2{font-size:clamp(1.9rem,4vw,3rem);margin:0 0 12px} h2 span{color:var(--gold)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin-top:28px}
.card{background:#141829;border:1px solid #2a2f45;border-radius:18px;padding:28px} .card h3{margin:0 0 8px;font-size:1.35rem;color:var(--gold)} .card p{margin:0;color:#cfc8b4}
.notice{background:#221d0c;border:1px solid var(--gold);border-radius:14px;padding:18px 22px;margin:28px 0}
footer{border-top:1px solid #2a2f45;padding:36px 0;color:#9a937e;font-size:.95rem}
.small{color:#9a937e} .big-stat{font-size:clamp(2.6rem,6vw,4.5rem);font-weight:800;color:var(--gold);line-height:1}

.sub{font-size:1.1rem;color:#cfc8b4;max-width:820px}
.pill{display:inline-block;border:1px solid var(--gold);border-radius:999px;padding:4px 14px;font-size:.85rem;color:var(--gold);margin:0 8px 8px 0}

/* v2 — interesting, intuitive */
body{background:linear-gradient(180deg,#0b0e1a 0%,#10142a 55%,#0b0e1a 100%)}
.card{transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;cursor:default}
.card:hover{transform:translateY(-4px);border-color:var(--gold);box-shadow:0 12px 32px rgba(212,175,55,.14)}
.card a{font-weight:700}
.hero h1{background:linear-gradient(90deg,#f2ede0 30%,var(--gold) 70%);-webkit-background-clip:text;background-clip:text;color:transparent}
header nav a{padding:6px 10px;border-radius:999px} header nav a:hover{background:#1a2038}
input.filter{width:100%;padding:14px 18px;border-radius:999px;border:1px solid #2a2f45;background:#141829;color:#f2ede0;font-size:1rem;margin:18px 0 4px}
input.filter:focus{outline:2px solid var(--gold)}
.loop{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}
.loop-step{flex:1;min-width:140px;text-align:center;padding:20px 12px;border:1px solid #2a2f45;border-radius:16px;background:#141829;cursor:pointer;font-weight:800;font-size:1.2rem}
.loop-step.active{border-color:var(--gold);background:#221d0c;box-shadow:0 0 0 2px rgba(212,175,55,.35)}
.loop-step small{display:block;font-weight:400;color:#cfc8b4;font-size:.9rem;margin-top:6px}
#loop-detail{background:#141829;border-left:4px solid var(--gold);padding:16px 20px;border-radius:0 14px 14px 0;margin:12px 0 28px;min-height:56px}
.tour{display:flex;gap:12px;flex-wrap:wrap;counter-reset:t}
.tour a{flex:1;min-width:180px;background:#141829;border:1px solid #2a2f45;border-radius:16px;padding:20px;text-decoration:none;color:#f2ede0}
.tour a:hover,.tour a.active{border-color:var(--gold)}
.tour b{color:var(--gold);font-size:1.4rem}

label{display:block;margin:14px 0 4px;font-weight:700} input[type=text],input[type=email],input[type=number],textarea,select{width:100%;padding:12px 14px;border-radius:12px;border:1px solid #2a2f45;background:#141829;color:#f2ede0;font-size:1rem}
textarea{min-height:110px} .out{background:#141829;border:1px solid var(--gold);border-radius:14px;padding:20px;margin-top:20px;white-space:pre-wrap}
