:root{color-scheme:light;--lime:#c5fa29;--ink:#10100f}*{box-sizing:border-box}html,body{margin:0;background:#fff;color:var(--ink);font-family:Arial,Helvetica,sans-serif}body{min-height:100svh}.back{position:absolute;top:25px;right:3.5%;color:#55574f;font-size:12px;text-decoration:none;z-index:5}.back:hover{color:#111;text-decoration:underline}.back:focus-visible{outline:2px solid #799727;outline-offset:6px}.about-layout{display:grid;grid-template-columns:43% 57%;min-height:100svh;max-width:1920px;margin:auto;padding:55px 3.5% 40px 1.5%;gap:0}.character{margin:0;position:sticky;top:20px;height:calc(100svh - 40px);align-self:start;display:flex;align-items:center;justify-content:center}.character-frame{position:relative;overflow:hidden;height:min(94svh,1050px);aspect-ratio:400/1118;flex:none}.character-frame img{position:absolute;top:0;left:-25%;display:block;height:100%;width:auto;max-width:none}.copy{align-self:center;padding:20px 0 25px 3%;max-width:960px}h1{font-size:clamp(46px,5.3vw,100px);line-height:.98;letter-spacing:-.065em;font-weight:800;margin:0 0 35px}.lime-dot{color:var(--lime)}p{font-size:clamp(16px,1.35vw,25px);line-height:1.38;letter-spacing:-.025em;margin:0 0 20px}.welcome{font-size:clamp(23px,2.2vw,42px);line-height:1.1;letter-spacing:-.055em;margin:38px 0 0}.welcome strong{font-weight:800}@media(min-width:1700px){.about-layout{padding-top:65px}.copy{padding-right:5%}p{margin-bottom:24px}}@media(max-width:1000px) and (min-width:701px){.about-layout{grid-template-columns:36% 64%;padding-right:4%}.character-frame{height:75svh;max-height:850px}.copy{padding-left:0}h1{font-size:clamp(42px,5.7vw,62px)}p{font-size:16px}}@media(max-width:700px){.back{top:23px;right:6%;font-size:12px}.about-layout{display:flex;flex-direction:column;padding:60px 7% 45px}.character{position:relative;top:auto;height:auto;margin:0 0 35px}.character-frame{height:420px;max-height:57svh}.copy{padding:0;width:100%}h1{font-size:clamp(39px,9.5vw,64px);letter-spacing:-.06em;margin-bottom:28px}p{font-size:16px;line-height:1.5;margin-bottom:20px}.welcome{font-size:27px;line-height:1.16;margin-top:32px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.lime-dot{display:inline-block;width:.16em;height:.16em;margin-left:.035em;border-radius:50%;background:var(--lime);color:transparent;line-height:0;vertical-align:.025em}
@media(max-width:700px){.character{align-self:stretch}}
/* Shared lab navigation. */
header{position:absolute;inset:22px 3.8% auto;display:flex;justify-content:space-between;align-items:flex-start;z-index:50;font-size:clamp(11px,.95vw,18px)}header a{color:inherit;text-decoration:none}header .logo{font-weight:800;font-size:clamp(21px,1.9vw,35px);letter-spacing:-.065em;line-height:.87;display:inline-block}header .logo span{color:var(--lime);font-size:1.4em;line-height:0}header nav{position:absolute;left:40%;top:16%;display:flex;gap:3.8vw;white-space:nowrap}header nav>a{font:inherit}header .header-right{display:flex;align-items:flex-start}.lab-link{display:flex;justify-content:space-between;min-width:6.7vw;border-bottom:1px solid #222;padding:1vw 0 .8vw;gap:2vw;cursor:default}.experiment-nav{position:relative}.experiment-toggle{background:none;padding:0;border:0;color:inherit;font:inherit;display:flex;align-items:center;gap:9px;cursor:pointer}.experiment-toggle>span{font-size:.85em}.experiment-toggle[aria-expanded=true]>span{transform:rotate(180deg)}.experiment-list{position:absolute;top:calc(100% + 20px);left:-18px;min-width:255px;padding:8px;background:#fff;border:1px solid #e6e6df;box-shadow:0 12px 35px #0000000c;border-radius:4px}.experiment-list[hidden]{display:none}.experiment-list a{display:flex;align-items:center;justify-content:space-between;gap:26px;padding:16px 12px;font-size:14px;white-space:nowrap}.experiment-list a:hover,.experiment-list a:focus-visible{background:#f2f5ea}.experiment-list a>span{color:#758b43}.experiment-list a+a{border-top:1px solid #f0f0eb}header a:focus-visible,header button:focus-visible{outline:2px solid #799727;outline-offset:5px}
.copy>p:not(.welcome){font-size:clamp(15px,1.13vw,21px)}
.about-layout{padding-top:100px}.character{top:90px;height:calc(100svh - 110px)}.character-frame{height:min(85svh,960px)}
@media(max-width:1000px) and (min-width:701px){.copy>p:not(.welcome){font-size:15px}.character-frame{height:75svh}}
@media(max-width:700px){header{inset:23px 6% auto;font-size:12px}header .logo{font-size:24px}header nav{left:auto;right:0;top:68px;gap:24px;font-size:12px}.lab-link{padding:9px 0 10px;gap:20px;min-width:75px}.experiment-list{left:auto;right:-8px;top:calc(100% + 14px);min-width:230px}.experiment-list a{font-size:13px}.about-layout{padding-top:145px}.character{top:auto;height:auto}.character-frame{height:420px;max-height:57svh}.copy>p:not(.welcome){font-size:15px}}

/* Dedicated transparent character cutout replaces the cropped reference. */
.character-frame{aspect-ratio:569/1882}.character-frame img{position:static;width:100%;height:100%;max-width:100%;object-fit:contain}

/* Smaller About typography with electric-green highlights. */
.electric{color:var(--lime)}
.copy h1{font-size:clamp(32.2px,3.71vw,70px)}
.copy>p:not(.welcome){font-size:clamp(10.5px,.791vw,14.7px)}
.copy .welcome{font-size:clamp(16.1px,1.54vw,29.4px)}
@media(max-width:1000px) and (min-width:701px){.copy h1{font-size:clamp(29.4px,3.99vw,43.4px)}.copy>p:not(.welcome){font-size:10.5px}}
@media(max-width:700px){.copy h1{font-size:clamp(27.3px,6.65vw,44.8px)}.copy>p:not(.welcome){font-size:10.5px}.copy .welcome{font-size:18.9px}}

/* Slightly larger type, with a tighter rhythm between paragraphs. */
.copy h1{font-size:clamp(35.42px,4.081vw,77px);margin-bottom:28px}
.copy>p:not(.welcome){font-size:clamp(11.55px,.8701vw,16.17px);line-height:1.5;margin-bottom:12px}
.copy .welcome{font-size:clamp(17.71px,1.694vw,32.34px);margin-top:25px}
@media(max-width:1000px) and (min-width:701px){.copy h1{font-size:clamp(32.34px,4.389vw,47.74px)}.copy>p:not(.welcome){font-size:11.55px}}
@media(max-width:700px){.copy h1{font-size:clamp(30.03px,7.315vw,49.28px);margin-bottom:24px}.copy>p:not(.welcome){font-size:11.55px;margin-bottom:12px}.copy .welcome{font-size:20.79px;margin-top:24px}}

/* Social icons sit directly beneath the contact button. */
.contact-links{display:flex;flex-direction:column;align-items:center;width:max-content;max-width:100%}
.social-footer{display:flex;justify-content:center;align-items:center;gap:14px;padding:8px 0 0}.social-footer a{width:40px;height:40px;display:grid;place-items:center;color:#b8bbb3;border-radius:50%;transition:color .2s,background .2s}.social-footer svg{width:21px;height:21px}.social-footer a:hover{color:#7b826e;background:#f5f7f0}.social-footer a:focus-visible,.chat-link:focus-visible{outline:2px solid #799727;outline-offset:4px}.chat-link{display:inline-flex;align-items:center;gap:25px;margin-top:24px;padding:12px 19px;border:1px solid #dde2d4;border-radius:30px;color:var(--ink);font:13px Arial,Helvetica,sans-serif;text-decoration:none;background:white;transition:background .2s,border-color .2s}.chat-link:hover{background:#f5f9eb;border-color:#c5d3a4}.chat-link span{color:#8eab3b}.about-layout{min-height:calc(100svh - 74px)}
