:root{color-scheme:dark;font-family:system-ui,sans-serif;color:#f5f3ff;background:#0b0b11}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;background:radial-gradient(ellipse at 51% 0%,#201735 0%,transparent 58%),#0b0b11}
header,footer{background:#0b0b12;border-color:#252133;border-style:solid;border-width:0 0 1px}
.top,footer{padding:1.1rem clamp(1.2rem,2.8vw,3rem);display:flex;align-items:center;justify-content:space-between;gap:1rem}
.wordmark,.right,.languages{display:flex;align-items:center;gap:.85rem}
.wordmark strong{display:block;font:700 1.25rem Georgia,serif;letter-spacing:.17em}
.wordmark small{display:block;margin-top:.22rem;color:#b5a0ff;text-transform:uppercase;letter-spacing:.105em;font-size:.6rem;font-weight:700}
.badge{border:1px solid #285142;border-radius:2rem;color:#6ee7b7;padding:.46rem .7rem;font: .73rem ui-monospace,monospace}
.languages{gap:.18rem;border:1px solid #563199;border-radius:.85rem;padding:.16rem}
button{font:inherit;color:#a7a1b2;background:none;border:0;padding:.32rem .55rem;border-radius:.65rem;cursor:pointer;font-weight:700}
button[aria-pressed=true]{background:#753ce3;color:#fff}
main{width:min(100%,105rem);margin:auto;display:grid;grid-template-columns:1.42fr 1fr;gap:clamp(1.7rem,4vw,4rem);align-items:center;padding:clamp(2rem,5vw,5.5rem) clamp(1.2rem,5vw,4.8rem)}
.brand{display:flex;align-items:center;gap:clamp(1rem,2vw,2rem);padding:clamp(1.2rem,2vw,2rem);background:linear-gradient(150deg,#171523,#0d0c14);border:1px solid #452974;border-radius:1.75rem}
.brand img{width:clamp(64px,7vw,108px);height:auto;filter:drop-shadow(0 0 19px #7c3aed70)}
.label,.eyebrow,.topics{color:#b9a4ff;text-transform:uppercase;letter-spacing:.085em}
.label{display:inline-block;margin:0;padding:.25rem .6rem;border:1px solid #563199;border-radius:.4rem;background:#281a46;font:.68rem ui-monospace,monospace}
h1{font:700 clamp(1.65rem,4.2vw,3.65rem)/1 Georgia,serif;letter-spacing:.15em;margin:.45rem 0;color:#eee4ff}
.motto{margin:.55rem 0;font-weight:750;text-transform:uppercase;letter-spacing:.12em;font-size:clamp(.67rem,1.15vw,1rem)}
.topics{margin:.4rem 0 0;font-size:clamp(.65rem,.9vw,.82rem)}
.intro{color:#b5b0c0;line-height:1.6;margin:1.65rem 0;font-size:clamp(.92rem,1.17vw,1.1rem)}
.cards{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
.cards article{background:#13121c;border:1px solid #2e293b;border-radius:1.1rem;padding:1rem 1.12rem}
.cards h2{display:flex;align-items:center;gap:.5rem;font-size:.85rem;margin:0}
.cards h2 span:first-child{color:#b394ff;font-size:1.05rem}
.cards article:nth-child(2) h2 span:first-child{color:#6ee7b7}
.cards article:nth-child(3) h2 span:first-child{color:#67e8f9}
.cards article:nth-child(4) h2 span:first-child{color:#facc15}
.cards p,.access-foot{font-size:.78rem;line-height:1.55;color:#b5b0c0;margin:.4rem 0 0}
.access{border:1px solid #6335a8;border-radius:1.75rem;padding:clamp(1.25rem,3vw,2.3rem);background:#181523;box-shadow:0 1.5rem 4rem #29144d60}
.access-bar{display:grid;grid-template-columns:1fr 1fr;gap:.3rem;background:#0b0b12;border:1px solid #312b40;border-radius:1.1rem;padding:.25rem;text-align:center;font-size:.8rem;font-weight:750}
.access-bar span{padding:.75rem .35rem;color:#b5b0c0}
.access-bar span:first-child{border-radius:.85rem;background:#753ce3;color:#fff}
.eyebrow{font: .71rem ui-monospace,monospace;margin:1.6rem 0 .5rem}
.access h2{margin:0;font-size:clamp(1.05rem,1.6vw,1.4rem);line-height:1.22}
dl{display:grid;gap:1rem;margin:1.3rem 0}
dt{font-size:.82rem;color:#b5b0c0;margin-bottom:.35rem}
dd{margin:0;border:1px solid #312b40;border-radius:.8rem;background:#0c0c13;padding:.8rem .9rem;font-size:.82rem}
.cta{display:block;border-radius:.85rem;background:linear-gradient(110deg,#723ae2,#8b37e1);color:#fff;padding:.85rem .7rem;text-align:center;font-weight:800;font-size:.87rem;text-decoration:none}
.cta:hover{filter:brightness(1.13)}
:focus-visible{outline:3px solid #ddd6fe;outline-offset:4px}
.access-foot{border-top:1px solid #30273e;padding-top:.95rem;margin-top:1.05rem}
footer{border-width:1px 0 0;font-size:.75rem;color:#b5b0c0}
footer span:last-child{color:#b9a4ff}
@media(max-width:900px){main{grid-template-columns:1fr}.access{width:min(100%,38rem)}}
@media(max-width:530px){.badge{display:none}.top,footer{padding-inline:1rem}.wordmark small{font-size:.49rem}.cards{grid-template-columns:1fr}.brand{gap:.7rem}}

.switch-email{color:#cbb4ff;text-underline-offset:.2em} dd{background:none;border:0;padding:0;color:#d2c9e0}
