*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--green: #10b981;--green-dark: #065f46;--green-mid: #34d399;--bg: #020c07;--bg-panel: #041009;--border: rgba(255,255,255,.07);--border-g: rgba(16,185,129,.2);--dim: rgba(255,255,255,.4);--mid: rgba(255,255,255,.65)}html,body{height:100%;background:var(--bg);color:#fff;font-family:Outfit,sans-serif;overflow:hidden}.logo{position:fixed;top:1.5rem;left:50%;transform:translate(-50%);z-index:200;display:flex;align-items:center;gap:.6rem;text-decoration:none;color:#fff;font-weight:700;font-size:1.1rem;letter-spacing:-.01em;white-space:nowrap;padding:.45rem 1rem .45rem .7rem;border-radius:100px;background:#020c07b3;border:1px solid var(--border);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:logoIn .7s ease both .1s}.logo img{display:block;border-radius:4px}.chooser{display:flex;height:100vh;width:100vw;position:relative;animation:fadeIn .5s ease both .05s}.panel{flex:1;position:relative;display:flex;flex-direction:column;justify-content:flex-end;padding:3rem;text-decoration:none;color:#fff;overflow:hidden;transition:flex .5s cubic-bezier(.4,0,.2,1);cursor:pointer}.chooser:has(.panel:hover) .panel{flex:.72}.chooser:has(.panel:hover) .panel:hover{flex:1.28}.panel-bg{position:absolute;inset:0;background-size:cover;background-position:center top;opacity:.12;filter:grayscale(.5) brightness(.5);transition:opacity .7s ease,filter .7s ease,transform .9s ease;z-index:0}.panel:hover .panel-bg{opacity:.22;filter:grayscale(0) brightness(.55);transform:scale(1.04)}.panel-grad{position:absolute;inset:0;background:linear-gradient(to top,rgba(2,12,7,1) 0%,rgba(2,12,7,.88) 38%,rgba(2,12,7,.4) 65%,transparent 100%);z-index:1}.panel-bloom{position:absolute;bottom:-10%;left:50%;transform:translate(-50%);width:70%;height:50%;background:radial-gradient(ellipse,rgba(16,185,129,.13) 0%,transparent 70%);opacity:0;transition:opacity .55s ease;z-index:1}.panel:hover .panel-bloom{opacity:1}.panel:after{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--green),transparent);opacity:0;transition:opacity .4s ease;z-index:5}.panel:hover:after{opacity:1}.panel-content{position:relative;z-index:2;max-width:380px}.eyebrow{display:flex;align-items:center;gap:.5rem;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--green);margin-bottom:1.75rem}.eyebrow-dot{width:6px;height:6px;border-radius:50%;background:var(--green);flex-shrink:0;animation:dotpulse 2.8s ease-in-out infinite}.icon-wrap{width:64px;height:64px;border-radius:16px;border:1px solid var(--border-g);background:#10b9810f;display:flex;align-items:center;justify-content:center;color:var(--green);margin-bottom:1.5rem;transition:background .35s ease,border-color .35s ease,transform .35s ease,box-shadow .35s ease}.panel.left:hover .icon-wrap{transform:translateY(-5px) rotate(5deg)}.panel.right:hover .icon-wrap{transform:translateY(-5px) rotate(-5deg)}.panel:hover .icon-wrap{background:var(--green);color:#fff;border-color:var(--green);box-shadow:0 8px 32px #10b9814d}.heading{font-size:clamp(1.9rem,3.2vw,2.8rem);font-weight:800;line-height:1.1;letter-spacing:-.02em;color:#fff;margin-bottom:1.1rem;white-space:pre-line}.body-text{font-size:1rem;font-weight:400;line-height:1.6;color:var(--mid);margin-bottom:.6rem;transition:color .3s ease}.panel:hover .body-text{color:#ffffffd1}.sub-note{font-size:.75rem;font-weight:500;color:var(--dim);margin-bottom:2rem;letter-spacing:.01em}.cta{display:inline-flex;align-items:center;gap:.65rem;font-size:.95rem;font-weight:700;color:var(--green);transition:gap .3s ease,color .3s ease}.panel:hover .cta{gap:1rem;color:var(--green-mid)}.cta-icon{width:34px;height:34px;border-radius:50%;border:1.5px solid rgba(16,185,129,.35);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .3s ease,border-color .3s ease,transform .3s ease}.panel:hover .cta-icon{background:var(--green);border-color:var(--green);transform:rotate(-45deg)}.divider{position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%);width:1px;background:linear-gradient(to bottom,transparent 5%,var(--border) 25%,var(--border) 75%,transparent 95%);z-index:10;pointer-events:none}.divider-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:11;width:52px;height:52px;border-radius:50%;background:var(--bg);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 6px var(--bg),0 0 24px #10b9811f}.divider-center img{display:block}.hint{position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);z-index:50;font-size:.65rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:#fff3;animation:hintIn 1s ease both 1.2s;pointer-events:none;white-space:nowrap}@keyframes logoIn{0%{opacity:0;transform:translate(-50%) translateY(-8px)}to{opacity:1;transform:translate(-50%) translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes hintIn{0%{opacity:0;transform:translate(-50%) translateY(6px)}to{opacity:1;transform:translate(-50%) translateY(0)}}@keyframes dotpulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.6)}}@media(max-width:800px){html,body{overflow-y:auto}.chooser{flex-direction:column;height:auto;min-height:100dvh}.chooser:has(.panel:hover) .panel,.chooser:has(.panel:hover) .panel:hover{flex:1}.panel{padding:3rem 1.75rem 2.5rem;min-height:50dvh}.divider,.divider-center{display:none}.panel:after{display:none}.hint{display:none}.logo{font-size:1rem}}
