@font-face{font-family:Outfit;src:url('/assets/Outfit-Variable.woff2') format('woff2');font-weight:100 900;font-display:swap}
:root{--ink:#20372f;--muted:#4f665d;--accent:#caf5a4;--paper:#f6f8f3;--rule:#dce5da}
*{box-sizing:border-box}
html{scrollbar-width:none;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.55 Outfit,system-ui,sans-serif}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #59834d;outline-offset:4px}
.wrap{width:min(1240px,calc(100% - 8vw));margin-inline:auto}
.header{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:24px 0}
.brand img{width:min(210px,37vw);height:auto;display:block}
nav,.actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px 24px}
nav a{font-size:15px;font-weight:550;padding:8px 0}
nav a:hover,.footer a:hover,.text-link:hover{text-decoration:underline;text-underline-offset:5px}
.skip{position:absolute;top:0;left:1rem;translate:0 -150%;padding:10px;background:white;z-index:5}.skip:focus{translate:0}
.hero{display:grid;grid-template-columns:1.08fr 1fr;align-items:center;min-height:min(720px,80svh);gap:24px;padding:38px 0 66px}
h1,h2,h3,p{margin:0}
h1,h2{line-height:1.02;letter-spacing:-.055em;font-weight:530;text-wrap:balance}
h1{font-size:clamp(48px,6.6vw,101px)}
h2{font-size:clamp(37px,5vw,68px)}
h3{font-size:clamp(21px,2.2vw,29px);line-height:1.11;font-weight:550;letter-spacing:-.025em}
.eyebrow{font-size:13px;text-transform:uppercase;letter-spacing:.13em;font-weight:600;margin-bottom:19px;color:var(--muted)}
.lead{max-width:45ch;font-size:clamp(18px,2vw,23px);margin-top:24px;color:var(--muted)}
.actions{margin-top:28px}
.button,.text-link{display:inline-flex;align-items:center;gap:12px}
.button{padding:12px 19px;border-radius:100px;border:1px solid #82978b;min-height:48px;font-weight:600}
.button.primary{background:var(--ink);color:white;border-color:var(--ink)}
.button:hover{box-shadow:0 5px 18px #20372f22}.button:active{scale:.97}
.button svg,.text-link svg,.project svg{width:19px;height:19px;flex:none}
.hero-art{aspect-ratio:1.12;position:relative;isolation:isolate;border-radius:40% 48% 39% 43%;background:radial-gradient(ellipse at 56% 46%,#e7ffbc,#c3e3bc 52%,transparent 73%);display:grid;place-items:center}
.halo{position:absolute;width:92%;height:38%;border:1px solid #527c5e45;border-radius:50%;rotate:-21deg}
.hero-orb{width:62%;aspect-ratio:1;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 34% 29%,#fffdf6 1%,#e4f7d8a0 37%,#77a98a91 69%,#f3ffeadd 95%);box-shadow:inset -7px -5px 27px #fff9,0 26px 45px #37684540;animation:float 8s ease-in-out infinite}
.hero-orb img{width:53%;height:auto;filter:drop-shadow(0 5px 13px #3a694233)}
@keyframes float{50%{translate:0 -9px}}
.glass-chip{position:absolute;padding:9px 14px;border:1px solid #fff;border-radius:15px;background:#f9fff0bd;box-shadow:0 9px 24px #37684520;font-size:clamp(12px,1.5vw,16px);font-weight:580}
.glass-chip span{margin-left:9px;color:#417254}.chip-one{right:2%;top:20%}.chip-two{left:1%;bottom:21%}.chip-three{right:9%;bottom:11%}
.section{padding-block:clamp(58px,8vw,115px)}
.solutions{background:#eaf0e7}
.service-grid,.projects{display:grid;gap:16px;margin-top:30px}
.service-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.service-grid article{padding:clamp(19px,3vw,32px);border-radius:25px;background:linear-gradient(140deg,#fffffff1,#ffffff70);border:1px solid white;box-shadow:0 12px 30px #20372f09}
.service-grid p,.project p,.fine,.health p,.example p,.faq p{margin-top:10px;color:var(--muted)}
.examples{margin-top:34px;border:1px solid #a5b7a4;border-radius:28px;padding:clamp(18px,4vw,40px)}
.example-select{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:26px}
.example-select button,.demo button{cursor:pointer;border:1px solid #8ca592;border-radius:50px;background:#fff8;padding:9px 14px}
.example-select button[aria-pressed=true],.demo button{background:var(--accent);border-color:transparent}
.example{display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:25px}
.example + .example{margin-top:20px}
.example[hidden]{display:none}
.demo{min-height:110px;display:grid;justify-items:start;align-content:center;gap:10px;background:#f8fff5;border:1px solid white;border-radius:19px;padding:17px}
.demo-dot{width:9px;height:9px;border-radius:50%;background:#9daea2}.demo:has(output:not(:empty)) .demo-dot{background:#387d4b}
output:empty{display:none}
.projects{grid-template-columns:repeat(2,minmax(0,1fr))}
.project{border-radius:24px;overflow:hidden;background:#fff;border:1px solid var(--rule);transition:translate .25s ease,box-shadow .25s ease}
.project:hover{translate:0 -4px;box-shadow:0 16px 30px #20372f1a}
.project img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:top}
.project div{position:relative;padding:19px 44px 21px 20px}.project svg{position:absolute;right:18px;top:22px}
.health{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:20px;padding:clamp(22px,4vw,45px);border-radius:26px;background:#dff1d8}
.health h2{font-size:clamp(27px,3.5vw,47px)}
.pricing article{border-color:var(--rule)}.pricing strong{display:block;font-size:clamp(29px,4vw,49px);font-weight:550;margin-top:12px;letter-spacing:-.05em}
.faq{display:grid;grid-template-columns:1fr 1.2fr;gap:25px;border-top:1px solid var(--rule)}
.faq details{padding:13px 0;border-bottom:1px solid var(--rule)}.faq summary{cursor:pointer;font-weight:550}
.contact{background:#dfeadc}.contact p{margin-top:16px;max-width:50ch}
.footer{padding:25px 0;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;color:var(--muted);font-size:15px}
@media(max-width:760px){.hero{grid-template-columns:1fr;gap:16px;padding:38px 0 50px}.hero-art{width:min(100%,455px);justify-self:center}.service-grid,.faq,.example{grid-template-columns:1fr}.header{flex-wrap:wrap;padding-block:16px}.header nav{gap:4px 17px}.header nav a{min-height:44px}.projects{gap:11px}}
@media(max-width:480px){.projects{grid-template-columns:1fr}.wrap{width:calc(100% - 32px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-orb{animation:none}.project{transition:none}}

/* Test2's animated scene behind Test3's existing content. */
:root { --ink:#211d4e; --muted:#464568; --accent:#dce4ff; --paper:#f7f7ff; --rule:#d9dbef; }
body { background:color-mix(in srgb,#ededf8,white calc(var(--paper,0) * 100%)); }
.header.top { display:grid; padding:0; grid-template-columns:1fr auto 1fr; }
.header .brand { color:white; }
.header nav a { font-size:15px; padding:7px 0; }
.chapter { padding-inline:0; }
.hero.wrap { display:grid; grid-template-columns:1fr; align-items:start; min-height:135svh; padding:clamp(160px,31svh,320px) 0 0; }
.hero .hero-copy { max-width:47%; }
.hero h1,.hero .lead,.hero .eyebrow,.hero .text-link { color:white; }
.hero h1 { font-size:clamp(40px,5.5vw,88px); }
.hero .lead { font-size:clamp(17px,1.7vw,23px); }
.button.primary { background:#161253; border-color:#161253; }
.solutions,.contact { background:transparent; }
.work { align-content:center; }
.work .projects { width: min(64%,850px); margin-left:auto; }
.work > :is(h2,.eyebrow) { margin-left:36%; }
.supporting { display:block; padding-top:88px; }
.supporting .health { margin-top:0; }
.contact .wrap { padding-right:29%; }
.footer { position:relative; z-index:2; margin-bottom:20px; }
.service-grid article,.examples,.project,.health,.footer {
  border:1px solid #ffffffdf; border-radius:26px;
  background:linear-gradient(145deg,#ffffffed,#edf0ff8f);
  box-shadow:inset 0 1px 3px white,0 18px 45px -25px #33337666;
  backdrop-filter:blur(16px) saturate(125%);
}
.footer { padding:23px; }
.demo { background:#f6f7ff; }
.demo-dot { background:#8996bd; }
.example-select button,.demo button { border-color:#9da6c9; }
.chapter :is(h2,h3,p) { position:relative; }
@media(max-width:840px){
  .header.top { grid-template-columns:1fr auto; }
  .hero.wrap { padding-top:56svh; min-height:140svh; }
  .hero .hero-copy { max-width:100%; }
  .orb-stage { top:34%; width:min(58vw,32svh); }
  .work .projects { width:100%; }
  .work > :is(h2,.eyebrow) { margin-left:0; }
  .contact .wrap { padding-right:0; }
}
@media(max-width:650px){
  .header.top { grid-template-columns:1fr; }
  .header nav { grid-column:1; grid-row:2; width:100%; }
  .header nav a { min-height:44px; display:grid; place-items:center; font-size:clamp(12px,3.4vw,15px); }
  .hero.wrap { padding-top:51svh; min-height:145svh; }
  .hero h1 { font-size:clamp(35px,9vw,62px); }
  .hero .lead { margin-top:12px; }
  .hero .actions { margin-top:16px; }
  .chapter:not(.hero) { padding-top:110px; }
}
@media(prefers-reduced-motion:reduce){
  .hero.wrap { min-height:100svh; padding-bottom:32px; }
  .chapter:not(.hero) { background:#ededf8; }
}
