:root{--deep:#34205d;--yellow:#f5dc55;--cream:#f7f1d8;--soft:#b9a7d0;--line:rgba(245,220,85,.34);--sans:'DM Sans',Arial,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--deep);color:var(--cream);font-family:var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:2px solid var(--yellow);outline-offset:5px}
.skip-link{position:absolute;top:-4rem;left:1rem;z-index:10;padding:.75rem 1rem;background:var(--yellow);color:var(--deep)}
.skip-link:focus{top:1rem}
.story{height:400vh;position:relative}
.frame{height:100vh;height:100svh;position:sticky;top:0;overflow:hidden;background:var(--deep)}
.frame-inner{height:100%;padding:34px 4vw 26px;display:flex;flex-direction:column}
.layout{flex:1;display:grid;grid-template-columns:61% 39%;align-items:center;min-height:0;gap:0}
.name{display:flex;flex-direction:column;margin:0;font-size:clamp(67px,7vw,124px);font-weight:800;line-height:1.04;letter-spacing:-.075em}
.name span{display:block;width:max-content;max-width:100%;color:var(--soft);transition:color .42s ease}
.name span.active{color:var(--yellow)}
.copy-area{position:relative;width:100%;max-width:430px;min-height:430px;margin-left:auto}
.copy{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .35s ease,visibility .35s ease}
.copy.active{opacity:1;visibility:visible;pointer-events:auto}
.copy h2{margin:0 0 20px;color:var(--yellow);font-size:clamp(32px,3vw,51px);line-height:1.08;letter-spacing:-.06em;font-weight:800}
.copy p{max-width:380px;margin:0;color:var(--cream);font-size:clamp(15px,1.2vw,18px);line-height:1.6}
.copy[data-copy="0"]>h2,.copy[data-copy="0"]>p{transform:translateY(clamp(90px,18vh,170px));transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.frame.intro-revealed .copy[data-copy="0"]>h2,.frame.intro-revealed .copy[data-copy="0"]>p{transform:translateY(0)}
.intro-we{display:inline-block}
.frame.intro-revealed .intro-we{font-family:Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.08em}
.club-postcard{align-self:flex-start;width:min(79%,330px);margin:28px 0 0 12px;padding:8px;background:var(--cream);color:var(--deep);box-shadow:12px 16px 30px rgba(14,6,31,.32);opacity:0;transform:translateY(24px) rotate(-8deg);transition:opacity .55s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.frame.intro-revealed .club-postcard{opacity:1;transform:translateY(0) rotate(-4deg)}
.club-postcard img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.company-group{margin-top:25px}
.group-label{padding-bottom:8px;border-bottom:1px solid var(--line);margin-bottom:11px;color:var(--yellow);font-size:10px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.company-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:22px;row-gap:5px}
.company-logo{height:46px;display:flex;align-items:center;justify-content:flex-start;min-width:0}
.company-logo img{display:block;width:100%;max-width:145px;height:32px;max-height:32px;object-fit:contain;object-position:left center;filter:brightness(0) invert(91%)}
.company-logo .selco-logo{width:33px;height:40px;max-height:40px}
.company-logo span,.logos span{display:none;color:var(--cream);font-size:13px;font-weight:700;line-height:1.2}
.company-logo img[hidden],.logos img[hidden]{display:none}
.company-logo img[hidden]+span,.logos img[hidden]+span{display:block}
.logos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px;row-gap:7px;max-width:410px;margin-top:25px}
.logos>div{height:46px;display:flex;align-items:center;justify-content:flex-start;min-width:0}
.logos img{display:block;width:100%;max-width:165px;height:34px;max-height:34px;object-fit:contain;object-position:left center;filter:brightness(0) invert(91%)}
.logos .dalberg-logo{max-width:150px}
footer{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:space-between;border-top:1px solid var(--line);padding:36px 4vw 28px;background:var(--deep);color:var(--yellow)}
footer>span,footer>div{font-size:11px;font-weight:800;letter-spacing:.1em}
footer h2{margin:auto 0 20px;font-size:clamp(75px,13vw,220px);line-height:1;letter-spacing:-.075em}
footer>a{width:max-content;padding-bottom:10px;border-bottom:1px solid var(--yellow);font-size:clamp(20px,3vw,46px);font-weight:600;letter-spacing:-.04em}
footer>div{display:flex;justify-content:space-between;gap:18px;border-top:1px solid var(--line);padding-top:18px;margin-top:70px}
footer a:hover{color:var(--cream)}
.tools-invite[hidden]{display:none}
.tools-invite{position:fixed;right:4vw;bottom:24px;z-index:20;width:min(370px,calc(100vw - 36px));padding:26px 28px 24px;background:var(--yellow);color:var(--deep);box-shadow:0 18px 50px rgba(17,7,34,.3)}
.tools-invite h2{max-width:290px;margin:0 24px 10px 0;font-size:clamp(29px,3vw,40px);line-height:1.1;letter-spacing:-.06em}
.tools-invite p{margin:0 0 24px;font-size:14px;line-height:1.5}
.tools-invite>a{display:inline-flex;align-items:center;gap:18px;border-bottom:1px solid currentColor;padding-bottom:5px;font-size:14px;font-weight:800}
.tools-invite>a:hover{opacity:.7}
.tools-invite-close{position:absolute;right:17px;top:12px;border:0;background:none;color:var(--deep);font:400 27px/1 var(--sans);cursor:pointer}
.tools-invite-close:focus-visible,.tools-invite>a:focus-visible{outline:2px solid var(--deep);outline-offset:4px}
@media(max-width:900px){.frame-inner{padding:24px 5vw 20px}.layout{grid-template-columns:57% 43%}.name{font-size:clamp(55px,7.4vw,85px)}.copy-area{min-height:420px}.copy h2{font-size:clamp(30px,3.4vw,40px)}}
@media(max-width:650px){.frame-inner{padding:17px 6vw}.layout{display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:5vh}.name{font-size:clamp(46px,10.5vw,68px);line-height:1}.copy-area{min-height:350px;max-width:none;margin:0}.copy{justify-content:flex-start}.copy h2{font-size:32px;margin-bottom:12px}.copy p{font-size:14px;line-height:1.5}.club-postcard{width:min(65%,240px);margin:17px 0 0 10px;padding:6px}.copy[data-copy="1"]{overflow-y:auto}.company-group{margin-top:15px}.group-label{font-size:9px;padding-bottom:5px;margin-bottom:5px}.company-logo{height:34px}.company-logo img{height:26px;max-height:26px}.company-logo .selco-logo{width:27px;height:33px;max-height:33px}.logos{margin-top:15px;row-gap:2px}.logos>div{height:36px}.logos img{height:27px;max-height:27px}footer{padding:20px 6vw}footer h2{font-size:clamp(67px,16vw,120px)}footer>a{font-size:23px}footer>div{font-size:9px;flex-wrap:wrap;margin-top:50px}}
@media(max-width:390px){.layout{gap:3vh}.name{font-size:46px}.copy-area{min-height:335px}.copy h2{font-size:29px}.company-logo{height:31px}.logos>div{height:33px}}
@media(max-width:650px){.tools-invite{right:18px;bottom:18px;padding:22px 24px}.tools-invite h2{font-size:30px}}
@media(max-width:650px){.copy[data-copy="0"]>h2,.copy[data-copy="0"]>p{transform:none}}
@media(max-height:690px) and (min-width:651px){.copy-area{min-height:390px}.name{font-size:clamp(55px,6.5vw,95px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
