body{margin:0;color:#e8eef7;isolation:isolate;min-height:100dvh}
.site-background{z-index:-1}
main{width:min(1080px,100%);margin:auto;padding:clamp(36px,7vw,88px) 24px 28px}
header{max-width:680px;margin-bottom:42px}
.eyebrow{color:#78d7eb;font-size:12px;letter-spacing:.17em}
h1{font-size:clamp(48px,7vw,80px);line-height:1.05;margin:16px 0 20px;font-weight:normal;letter-spacing:-.025em}
.intro{font-size:20px;line-height:1.6;color:#a6b6c9}
.experiments{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.experiment{display:block;overflow:hidden;text-decoration:none;color:inherit;background:#081321b8;border:1px solid #6fe7ff30;border-radius:18px;transition:border-color .2s,background .2s}
.experiment:hover{border-color:#6fe7ff90;background:#102236e8}
.experiment:focus-visible{outline:3px solid #6fe7ff;outline-offset:5px}
.preview{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-bottom:1px solid #6fe7ff25}
.card-copy{padding:26px}h2{font-size:30px;font-weight:normal;margin:14px 0}h2 span{float:right;color:#78d7eb;font-size:24px}
.card-copy>p:not(.eyebrow){color:#a6b6c9;line-height:1.7;font-size:16px;min-height:82px}
.open{display:block;color:#8ee6f6;margin-top:24px;font-size:14px}
@media(max-width:640px){.experiments{grid-template-columns:1fr}.card-copy>p:not(.eyebrow){min-height:0}main{padding-inline:20px}h1{font-size:clamp(36px,10vw,48px)}}
@media(prefers-reduced-motion:reduce){.experiment{transition:none}}