*{box-sizing:border-box}html,body{margin:0;font-family:Arial,Helvetica,sans-serif;color:#0a3761;background:#eef9ff;scroll-behavior:smooth}body{overflow-x:hidden}.hero{height:100vh;min-height:620px;position:relative;overflow:hidden;background:#66c5f4}.scene,.layer{position:absolute!important;inset:-3%;width:106%!important;height:106%!important;margin:0;padding:0;list-style:none}.layer{pointer-events:none}.bg{position:absolute;inset:-2%;background:url('../../images/hero-bg-4k.png') center center/cover no-repeat;filter:saturate(1.06) contrast(1.03);transform:scale(1.01);image-rendering:auto}
.topbar{position:absolute;z-index:30;left:4.7%;right:4.7%;top:24px;display:flex;align-items:center;justify-content:space-between;color:#fff;text-shadow:0 1px 8px rgba(0,39,83,.25)}.mini-logo{font-size:20px;font-weight:800;letter-spacing:-1px}.mini-logo span{color:#00559f}.mini-logo strong{color:#16b7e9}.topbar nav{display:flex;gap:34px}.topbar a{color:#fff;text-decoration:none;font-weight:800;font-size:12px;letter-spacing:1.4px}
.glow{position:absolute;border-radius:50%;filter:blur(20px);opacity:.35;animation:pulse 4s ease-in-out infinite}.glow-left{left:7%;top:9%;width:240px;height:240px;background:radial-gradient(circle,#fff7bc 0,rgba(255,223,95,.35) 40%,transparent 70%)}.glow-right{right:8%;top:18%;width:210px;height:210px;background:radial-gradient(circle,#8be8ff 0,rgba(36,196,255,.32) 45%,transparent 72%)}
.air{position:absolute;height:8px;border-radius:100%;border-top:2px solid rgba(255,255,255,.72);box-shadow:0 -1px 14px rgba(71,223,255,.8),0 2px 22px rgba(255,255,255,.42);opacity:.55;transform:rotate(-8deg);animation:airflow 7s ease-in-out infinite}.air-a{width:42%;left:2%;top:43%}.air-b{width:39%;right:1%;top:39%;transform:rotate(10deg);animation-delay:-3s}
.ion{position:absolute;width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:34px;font-weight:300;background:radial-gradient(circle at 36% 28%,#d8fbff 0 8%,#19c6fa 24%,#087dde 58%,#084bba 100%);box-shadow:0 0 20px rgba(0,216,255,.75),inset 0 0 12px rgba(255,255,255,.6);animation:float 5.4s ease-in-out infinite}.ion-1{left:12%;top:29%}.ion-2{left:24%;top:43%;width:38px;height:38px;font-size:25px;animation-delay:-1.2s}.ion-3{right:14%;top:31%;width:62px;height:62px;animation-delay:-2.5s}.ion-4{right:28%;top:54%;width:36px;height:36px;font-size:24px;animation-delay:-3.6s}
.leaf,.foreground-leaf{position:absolute;display:block;background:linear-gradient(135deg,#b8ef45 0%,#69ba0b 46%,#2d8d05 100%);border-radius:100% 0 100% 0;box-shadow:0 2px 7px rgba(49,104,0,.24);transform:rotate(35deg);animation:leafDrift 6s ease-in-out infinite}.leaf:after,.foreground-leaf:after{content:"";position:absolute;left:50%;top:8%;bottom:8%;width:1px;background:rgba(255,255,255,.45);transform:rotate(-35deg)}.leaf-1{width:62px;height:28px;left:7%;top:24%}.leaf-2{width:48px;height:22px;left:18%;top:51%;animation-delay:-1.5s}.leaf-3{width:45px;height:21px;left:31%;top:34%;animation-delay:-2.7s}.leaf-4{width:59px;height:27px;right:31%;top:27%;animation-delay:-.8s}.leaf-5{width:50px;height:23px;right:16%;top:48%;animation-delay:-3.1s}.leaf-6{width:42px;height:19px;right:7%;top:35%;animation-delay:-4.1s}.foreground-leaf{filter:blur(1.2px);opacity:.92}.fl-1{width:230px;height:95px;left:-2%;bottom:4%;transform:rotate(24deg)}.fl-2{width:205px;height:85px;right:-2%;bottom:7%;transform:rotate(-42deg);animation-delay:-2s}
.cloud{position:absolute;width:38%;height:21%;bottom:-4%;filter:blur(4px);opacity:.35;background:radial-gradient(ellipse at 20% 70%,#fff 0 22%,transparent 23%),radial-gradient(ellipse at 44% 52%,#fff 0 30%,transparent 31%),radial-gradient(ellipse at 70% 67%,#fff 0 28%,transparent 29%)}.cloud-left{left:-7%;animation:cloud 11s ease-in-out infinite}.cloud-right{right:-7%;animation:cloud 13s ease-in-out infinite reverse}
.scroll-hint{position:absolute;z-index:25;bottom:23px;left:50%;transform:translateX(-50%);color:#fff;text-align:center;text-shadow:0 1px 8px rgba(0,44,81,.45)}.scroll-hint span{display:block;width:22px;height:35px;border:1.5px solid rgba(255,255,255,.85);border-radius:13px;margin:auto;position:relative}.scroll-hint span:after{content:"";position:absolute;width:3px;height:7px;border-radius:2px;background:#fff;left:50%;top:7px;transform:translateX(-50%);animation:wheel 1.7s infinite}.scroll-hint small{display:block;margin-top:5px;font-size:7px;letter-spacing:2px;font-weight:700}
.content{padding:90px max(7vw,32px);background:#fff}.content.alt{background:#eff9fe}.content h1,.content h2{font-size:clamp(32px,5vw,66px);line-height:1.05;max-width:900px;margin:10px 0 20px}.content p{font-size:18px;line-height:1.7;max-width:760px;color:#47647c}.eyebrow{font-size:12px!important;letter-spacing:3px;font-weight:800;color:#00a6df!important}
@keyframes float{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(var(--drift-x),var(--drift-y)) scale(var(--pulse))}}@keyframes leafDrift{0%,100%{margin-top:0;margin-left:0;rotate:0deg}50%{margin-top:-14px;margin-left:12px;rotate:8deg}}@keyframes airflow{0%,100%{opacity:.34;filter:blur(.2px)}50%{opacity:.82;filter:blur(0)}}@keyframes cloud{0%,100%{transform:translateX(-10px)}50%{transform:translateX(18px)}}@keyframes pulse{0%,100%{transform:scale(.92);opacity:.28}50%{transform:scale(1.08);opacity:.45}}@keyframes wheel{0%{opacity:0;transform:translate(-50%,0)}40%{opacity:1}100%{opacity:0;transform:translate(-50%,13px)}}
@media (max-width:800px){.hero{min-height:540px}.topbar{left:20px;right:20px}.topbar nav{gap:13px}.topbar a{font-size:9px}.mini-logo{font-size:16px}.bg{background-position:58% center}.ion{transform:scale(.72)}.foreground-leaf{opacity:.68}.fl-1{width:150px;height:62px}.fl-2{width:140px;height:58px}.content{padding:70px 24px}.content p{font-size:16px}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.scene{transform:none!important}}

/* Editable image layers: change each source in index.html or the asset files. */
.bg{background-image:url('../../images/landscape-clean.png')}
.brand{position:absolute;z-index:20;left:50%;top:27%;width:min(42vw,620px);transform:translateX(-50%);text-align:center;color:#06265d;text-shadow:0 1px 10px rgba(255,255,255,.7)}
.brand-logo{width:min(100%,520px);height:auto;display:block;margin:auto}
.brand-caption{margin:4px 0 10px;font-size:clamp(11px,1.1vw,17px);font-weight:600;letter-spacing:.48em;padding-left:.48em}
.brand-rule{width:56px;height:5px;background:#0ab5e7;margin:15px auto 12px}
.brand-tagline{margin:0;font-size:clamp(11px,.95vw,16px);font-weight:600;letter-spacing:.22em;white-space:nowrap}
.brand-tagline span{padding:0 .55em}
.mini-logo{font-size:20px;color:#fff;letter-spacing:-.04em;text-shadow:0 1px 7px #0065ad}
.topbar-brand{display:flex;align-items:center}.corner-logo{display:block;width:150px;max-height:70px;object-fit:contain;object-position:left center}.corner-logo[hidden]{display:none}
@media(max-width:800px){.brand{top:28%;width:min(78vw,470px)}.brand-caption{letter-spacing:.25em;padding-left:.25em}.brand-tagline{font-size:clamp(9px,1.8vw,12px);letter-spacing:.08em}.brand-tagline span{padding:0 .2em}.topbar nav{gap:10px}.mini-logo{font-size:16px}}

/* Two independently animated cloud banks along the bottom of the hero. */
.cloud-bank{position:absolute;display:block;max-width:none;height:auto;pointer-events:none;will-change:transform;transform-origin:center bottom;mask-image:linear-gradient(to right,transparent 0%,#000 28%,#000 72%,transparent 100%);-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 28%,#000 72%,transparent 100%)}
.cloud-bank-back{width:135%;left:-17.5%;bottom:-2%;opacity:.35;filter:blur(6px);animation:cloudDriftBack 17s ease-in-out infinite alternate}
.cloud-bank-front{width:132%;left:-16%;bottom:-9%;opacity:.78;filter:blur(1px);animation:cloudDriftFront 23s ease-in-out infinite alternate}
@keyframes cloudDriftBack{from{transform:translate3d(-1.5%,2%,0) scaleY(.5)}to{transform:translate3d(1.5%,-1%,0) scaleY(.5)}}
@keyframes cloudDriftFront{from{transform:translate3d(1.5%,0,0) scaleY(.5)}to{transform:translate3d(-1.5%,-1%,0) scaleY(.5)}}
@media(max-width:800px){.cloud-bank-back{width:190%;left:-45%;bottom:-1%}.cloud-bank-front{width:185%;left:-42.5%;bottom:-4%}}
@media(prefers-reduced-motion:reduce){.cloud-bank{transform:scaleY(.5)}}

/* The ions have distinct charges; each leaf remains an independently placed image. */
.ion-positive{background:radial-gradient(circle at 36% 28%,#fffbe1 0 8%,#ffe780 25%,#efa72c 62%,#dc7618 100%);box-shadow:0 0 20px rgba(255,203,72,.7),inset 0 0 12px rgba(255,255,255,.7);font-weight:500}
.leaf,.foreground-leaf{height:auto;background:none;border-radius:0;box-shadow:none;object-fit:contain;filter:drop-shadow(0 3px 5px rgba(18,93,28,.25));transform-origin:48% 50%;animation:naturalLeafDrift var(--leaf-speed,7s) ease-in-out infinite}
.leaf:after,.foreground-leaf:after{content:none}
.leaf-1{width:82px;--leaf-angle:-18deg;--leaf-speed:7s}
.leaf-2{width:68px;--leaf-angle:38deg;--leaf-speed:8.5s}
.leaf-3{width:65px;--leaf-angle:-55deg;--leaf-speed:6.5s}
.leaf-4{width:80px;--leaf-angle:24deg;--leaf-speed:8s}
.leaf-5{width:72px;--leaf-angle:-32deg;--leaf-speed:9s}
.leaf-6{width:64px;--leaf-angle:56deg;--leaf-speed:7.5s}
.foreground-leaf{opacity:.9;filter:blur(.8px) drop-shadow(0 6px 9px rgba(18,93,28,.18))}
.fl-1{width:245px;--leaf-angle:24deg;--leaf-speed:9s}
.fl-2{width:225px;--leaf-angle:-48deg;--leaf-speed:10s}
@keyframes naturalLeafDrift{0%,100%{transform:translate3d(0,0,0) rotate(var(--leaf-angle))}50%{transform:translate3d(12px,-14px,0) rotate(calc(var(--leaf-angle) + 9deg))}}
@media(max-width:800px){.leaf{width:clamp(45px,11vw,70px)}.foreground-leaf.fl-1{width:155px}.foreground-leaf.fl-2{width:145px}}

/* Separate support and rotor: the support disappears into the foreground clouds. */
.pinwheel-assembly{--wheel-size:clamp(165px,17vw,360px);--wheel-radius:clamp(82.5px,8.5vw,180px);position:absolute;right:16.5%;top:56%;width:var(--wheel-size);height:51vh;pointer-events:none}
.pinwheel-stick{position:absolute;z-index:1;display:block;width:clamp(135px,15vw,260px);height:calc(100% - var(--wheel-radius));left:50%;top:var(--wheel-radius);transform:translateX(-50%) rotate(4deg);transform-origin:50% 0;object-fit:fill;max-width:none;filter:drop-shadow(2px 3px 3px rgba(38,66,59,.18));mask-image:linear-gradient(to bottom,#000 0%,#000 77%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 77%,transparent 100%)}
.pinwheel-rotor{position:absolute;z-index:2;display:block;width:100%;height:auto;left:0;top:0;transform-origin:50% 50%;filter:drop-shadow(0 12px 12px rgba(22,67,87,.22));animation:windSpin 6.5s linear infinite;will-change:transform}
@keyframes windSpin{0%{transform:rotate(0deg)}15%{transform:rotate(28deg)}40%{transform:rotate(175deg)}60%{transform:rotate(245deg)}85%{transform:rotate(340deg)}100%{transform:rotate(360deg)}}
@media(max-width:800px){.pinwheel-assembly{--wheel-size:max(130px,30vw);--wheel-radius:max(65px,15vw);right:1%;top:52%;height:55vh}.pinwheel-stick{width:135px}}
@media(prefers-reduced-motion:reduce){.pinwheel-rotor{animation:none}}