@font-face{font-family:Allura;src:url('assets/Allura-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:block}
:root{--bg:#090a0c;--text:#f4f4f4;--red:#cb1010;--line:rgba(255,255,255,.14);--line-soft:rgba(255,255,255,.08);--shadow:0 24px 120px #0008}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text)}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button{border:0;background:none;color:inherit}
.ambient{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 25% 34%,#25272c75,transparent 54%),radial-gradient(ellipse at 96% 90%,#651c2026,transparent 40%),linear-gradient(125deg,#101114,#07080a 70%)}
.glow,.grain{display:none}
.experience{position:relative;min-height:100svh}
.hero{position:relative;min-height:100svh;padding:0 8vw;display:flex;align-items:center}
.brand-block{position:relative;width:100%;margin-top:-3rem}
#brandTrigger{width:max-content;max-width:100%;border-radius:8px;cursor:pointer;touch-action:manipulation}
:focus-visible{outline:2px solid #e5d5d5;outline-offset:7px}
.wordmark{
  margin:0;
  position:relative;
  font-size:clamp(4.8rem,10vw,9.8rem);
  line-height:.86;
  font-weight:850;
  letter-spacing:-.08em;
  user-select:none;
  display:flex;
  align-items:flex-end;
  flex-wrap:wrap;
  gap:.02em;
  cursor:default;
}
.letter{display:inline-block;opacity:0;transform:translateY(10px);animation:zonixArrival .85s cubic-bezier(.22,1,.36,1) both}
.letter.z{animation-delay:.08s}.letter.o{animation-delay:.16s}.letter.n{animation-delay:.24s}.letter.i{animation-delay:.32s}.letter.x{animation-delay:.48s}
@keyframes zonixArrival{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.x{color:var(--red)}
.systems{
  display:block;
  width:100%;
  margin-top:.45rem;
  margin-left:.13rem;
  font-size:.12em;
  letter-spacing:.36em;
  font-weight:650;
  color:rgba(255,255,255,.64);
  opacity:0;
  transform:translateY(12px);
  animation:systemsIn .8s cubic-bezier(.2,.8,.2,1) 1.22s forwards;
}
@keyframes systemsIn{to{opacity:1;transform:translateY(0)}}


.slogan{position:absolute;top:100%;left:0;margin:1.6rem 0 0;color:#ede9e7;font-family:Allura,'Segoe Script',cursive;font-size:clamp(2rem,3.2vw,3rem);font-weight:400;line-height:1.25}
.slogan span{display:block;white-space:nowrap;clip-path:inset(0 100% 0 0);animation:handwrite 1.45s cubic-bezier(.35,.05,.35,1) forwards}
@keyframes handwrite{to{clip-path:inset(0 0 0 0)}}
.slogan::after{content:'';display:block;width:64px;height:1px;margin-top:3px;background:linear-gradient(90deg,#cb101099,transparent);transform-origin:left;animation:stroke .7s ease 1s both}
@keyframes stroke{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.tagline{position:absolute;top:calc(100% + 7rem);left:0;max-width:100%}
.tagline-line{margin:0;color:#bfc1c7;font-size:clamp(1rem,1.22vw,1.2rem);line-height:1.6;white-space:nowrap;animation:mottoIn .6s ease both}
@keyframes mottoIn{from{opacity:0}to{opacity:1}}
.bubble-cloud{position:absolute;right:3vw;bottom:6vh;display:flex;flex-wrap:nowrap;gap:8px;max-width:94vw;padding:12px 8px;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#ffffff30 transparent;animation:navIn .7s ease both}
@keyframes navIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.bubble{position:relative;flex:0 0 auto;min-height:44px;padding:0 13px;border-radius:999px;border:1px solid #ffffff26;color:#e0e2e6;font-size:.75rem;letter-spacing:.035em;font-weight:550;cursor:pointer;white-space:nowrap;background:radial-gradient(ellipse at 35% 0%,#ffffff21,transparent 62%),linear-gradient(160deg,#ffffff0e,#ffffff03 55%,#ffffff0c);box-shadow:inset 0 1px 1px #ffffff38,inset 0 -2px 3px #ffffff0b,0 5px 14px #0005;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:border-color .25s,background-color .25s,box-shadow .25s}
.bubble::before{content:'';position:absolute;top:3px;left:22%;right:22%;height:1px;background:linear-gradient(90deg,transparent,#ffffff66,transparent);pointer-events:none}
.bubble:hover,.bubble.active{background-color:#ffffff0c;border-color:#ffffff55;box-shadow:inset 0 1px 2px #ffffff44,0 6px 18px #0006}
.bubble.accent{border-color:#a44b4b75}
.bubble span{position:relative}
.panel-shell{position:fixed;inset:0;display:none;place-items:center;z-index:30;padding:3vw}
.panel-shell.open{display:grid}
.panel-backdrop{position:absolute;inset:0;background:rgba(3,3,4,.56);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.glass-panel{
  position:relative;
  width:min(1120px,92vw);
  max-height:min(86vh,780px);
  overflow:auto;
  border-radius:36px;
  border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(circle at 20% 18%, rgba(255,255,255,.10), transparent 28%),
    linear-gradient(155deg, rgba(255,255,255,.13), rgba(255,255,255,.06));
  box-shadow:var(--shadow), inset 0 1px 1px rgba(255,255,255,.12);
  backdrop-filter:blur(22px) saturate(120%);
  -webkit-backdrop-filter:blur(22px) saturate(120%);
  padding:clamp(1.6rem,3vw,3rem);
  transform-origin:var(--origin-x, 85%) var(--origin-y, 50%);
  animation:panelIn .55s cubic-bezier(.2,.8,.2,1);
}
@keyframes panelIn{from{opacity:0;transform:scale(.72)}to{opacity:1;transform:scale(1)}}
.panel-close{position:absolute;right:1.2rem;top:1rem;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);font-size:1.55rem;cursor:pointer}
.panel-head{padding-right:3rem}
.panel-index{font-size:.72rem;letter-spacing:.22em;color:rgba(255,255,255,.6)}
.glass-panel h2{margin:.85rem 0 0;font-size:clamp(2.6rem,5vw,5.7rem);line-height:.94;letter-spacing:-.06em}
.panel-body{margin-top:1.8rem;color:rgba(255,255,255,.82);font-size:1.04rem;line-height:1.7}
.panel-body .lead{font-size:clamp(1.18rem,1.8vw,1.55rem);color:#fff;line-height:1.5;max-width:820px;margin:0 0 1.2rem}
.list-grid,.stats-grid,.process-list{display:grid;gap:1rem}
.list-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:1.4rem}
.list-grid>div,.process-list>div,.stats-grid>div{padding:1rem 1rem 1.1rem;border:1px solid var(--line-soft);border-radius:22px;background:rgba(255,255,255,.03)}
.list-grid h3,.process-list strong{margin:0 0 .5rem;font-size:1rem;color:#fff;letter-spacing:.01em}
.list-grid p,.process-list p{margin:0;color:rgba(255,255,255,.68);font-size:.96rem}
.pill-row{display:flex;flex-wrap:wrap;gap:.8rem;margin:1.3rem 0 1.4rem}
.pill-row span{padding:.85rem 1rem;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.05);font-size:.72rem;letter-spacing:.16em;font-weight:700;color:#fff}
.accent-line{font-size:clamp(1.7rem,3vw,3rem);line-height:1.1;letter-spacing:-.05em;color:var(--red);margin:.6rem 0 1rem;font-family:Georgia,"Times New Roman",serif;font-style:italic}
.flow-row{display:flex;flex-wrap:wrap;gap:.85rem;align-items:center;margin-top:1.6rem}
.flow-row span{padding:.85rem 1rem;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid var(--line)}
.flow-row i{display:inline-block;width:44px;height:1px;background:linear-gradient(90deg, rgba(255,255,255,.28), rgba(203,16,16,.6))}
.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr));margin:1.6rem 0}
.stats-grid strong{display:block;font-size:clamp(1.8rem,3vw,3rem);margin-bottom:.5rem;color:#fff;letter-spacing:-.04em}
.stats-grid span{color:rgba(255,255,255,.66);font-size:.9rem;line-height:1.45}
.team-list{display:grid;gap:.9rem;margin-top:1.2rem}
.team-list>div{display:flex;justify-content:space-between;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line-soft)}
.team-list strong{font-size:1.08rem}.team-list span{color:rgba(255,255,255,.66)}
.process-list{margin-top:1rem}
.process-list>div{display:grid;grid-template-columns:48px 160px 1fr;align-items:start;gap:1rem}
.process-list b{font-size:.72rem;color:rgba(255,255,255,.55);letter-spacing:.18em;padding-top:.15rem}
.contact-form{display:grid;gap:1rem;margin-top:1.2rem}
.contact-form label{display:grid;gap:.55rem;font-size:.9rem;color:#fff}
.contact-form input,.contact-form textarea{border:1px solid var(--line);background:rgba(255,255,255,.03);color:#fff;border-radius:18px;padding:1rem 1rem 1.05rem;outline:none}
.contact-form input:focus,.contact-form textarea:focus{border-color:rgba(203,16,16,.45)}
.contact-form button{margin-top:.35rem;border-radius:999px;padding:1rem 1.3rem;background:linear-gradient(180deg, rgba(203,16,16,.96), rgba(173,12,12,.96));border:1px solid rgba(255,255,255,.1);color:#fff;font-weight:700;cursor:pointer;box-shadow:0 14px 40px rgba(203,16,16,.22)}
.contact-meta{display:flex;gap:1.2rem;flex-wrap:wrap;margin-top:1.3rem;color:rgba(255,255,255,.7)}


@media(max-width:980px){.hero{padding:0 6vw}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.hero{padding:22svh 6vw 220px;display:block}.brand-block{margin:0}.wordmark{font-size:clamp(4.2rem,22vw,6.8rem)}.systems{margin-top:.7rem;font-size:.14em;letter-spacing:.24em}.slogan{font-size:2rem;margin-top:1.5rem}.tagline{top:calc(100% + 6rem)}.tagline-line{font-size:1rem;white-space:normal}.bubble-cloud{position:relative;right:auto;bottom:auto;margin:13rem -3vw 0 auto;width:max-content;max-width:94vw}.glass-panel{width:94vw;max-height:88svh;border-radius:28px;padding:1.25rem}.panel-close{right:.8rem;top:.8rem}.glass-panel h2{font-size:clamp(2.3rem,10vw,3.8rem)}.list-grid,.stats-grid{grid-template-columns:1fr}.process-list>div{grid-template-columns:38px 1fr}.process-list p{grid-column:2}.team-list>div{display:grid}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.letter,.systems{opacity:1;filter:none;transform:none}.slogan span{clip-path:none}}

/* Quiet right-edge navigation and compact, non-modal glass cloud. */
*{scrollbar-width:thin;scrollbar-color:rgba(208,216,230,.18) transparent}
*::-webkit-scrollbar{width:5px;height:5px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:rgba(208,216,230,.18);border-radius:99px}
*::-webkit-scrollbar-thumb:hover{background:rgba(208,216,230,.32)}
*::-webkit-scrollbar-corner{background:transparent}
.bubble-cloud{position:fixed;right:24px;top:50%;bottom:auto;transform:translateY(-50%);display:flex;flex-direction:column;gap:6px;width:44px;max-width:none;margin:0;padding:0;overflow:visible;z-index:40;animation:railIn .6s ease both}
@keyframes railIn{from{opacity:0}to{opacity:1}}
.bubble{display:grid;place-items:center;width:44px;height:44px;min-height:44px;padding:0;border-color:transparent;background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;color:#afb4bf}
.bubble::before{display:none}
.bubble svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
.bubble.accent{border-color:transparent;color:#c28d8d}
.bubble span{position:absolute;right:calc(100% + 10px);top:50%;transform:translate(5px,-50%);display:grid;place-items:center;width:170px;min-height:42px;padding:10px 14px;opacity:0;visibility:hidden;border:1px solid #ffffff20;border-radius:22px;background:linear-gradient(140deg,#303238e8,#17191ee8);box-shadow:inset 0 1px 0 #ffffff1c,0 6px 24px #0004;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:#e6e8ed;transition:opacity .2s,transform .2s,visibility .2s;pointer-events:none}
.bubble:hover,.bubble:focus-visible,.bubble.active,.bubble.peek{border-color:#ffffff24;background-color:#ffffff06;box-shadow:inset 0 1px 0 #ffffff15;color:#f0f1f4}
.bubble:hover span,.bubble:focus-visible span,.bubble.peek span{opacity:1;visibility:visible;transform:translate(0,-50%)}
.bubble:focus-visible{outline:1px solid #ffffff70;outline-offset:2px}
.panel-shell{inset:auto;right:94px;top:10svh;width:min(370px,36vw);padding:0;z-index:35;pointer-events:none}
.panel-shell.open{display:block}
.panel-backdrop{display:none}
.glass-panel{pointer-events:auto;width:100%;max-height:min(64svh,510px);padding:24px;border-radius:32px 38px 30px 36px;background:radial-gradient(ellipse at 20% 0%,#ffffff15,transparent 60%),linear-gradient(140deg,#22262bba,#15171bb5);border:1px solid #ffffff24;box-shadow:0 16px 50px #0004,inset 0 1px 1px #ffffff20;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);animation:cloudIn .25s ease;overscroll-behavior:contain;scrollbar-gutter:stable}
@keyframes cloudIn{from{opacity:0;transform:translateX(6px)}to{opacity:1;transform:none}}
.panel-close{width:32px;height:32px;right:14px;top:14px;font-size:1.3rem}
.panel-index{font-size:.65rem;letter-spacing:.13em}
.glass-panel h2{font-size:2rem;line-height:1.05;letter-spacing:-.045em;margin-top:12px}
.panel-body{margin-top:20px;font-size:1rem;line-height:1.6;overflow-wrap:anywhere}
.panel-body .lead{font-size:1.1rem}
.list-grid,.stats-grid{grid-template-columns:1fr;gap:10px}
.process-list>div{grid-template-columns:26px 1fr;gap:8px}
.process-list p{grid-column:2}
.team-list>div{display:grid;gap:4px}
.accent-line{font-size:1.65rem}
.pill-row{gap:6px}.pill-row span{padding:8px 10px;font-size:.7rem}
.contact-form input,.contact-form textarea{width:100%;min-width:0;padding:12px}
@media(max-width:760px){
 .hero{padding-right:76px;padding-top:18svh;padding-bottom:200px}
 .wordmark{font-size:clamp(3.5rem,18vw,6.8rem)}
 .slogan{font-size:clamp(1.6rem,6vw,2rem)}
 .tagline{top:calc(100% + 6rem)}
 .bubble-cloud{right:10px;top:50%;width:44px;gap:2px;margin:0}
 .panel-shell{right:66px;top:auto;bottom:16px;width:min(340px,calc(100vw - 82px))}
 .glass-panel{max-height:38svh;padding:20px;border-radius:26px}
 .glass-panel h2{font-size:1.7rem}
}
@media(max-height:450px){.bubble-cloud{gap:0;top:8px;transform:none}.bubble{height:36px;min-height:36px}.panel-shell{top:12px;bottom:auto}.glass-panel{max-height:calc(100svh - 24px)}}
/* A single frosted sidebar, inspired by the supplied reference. */
.bubble-cloud{right:20px;width:64px;padding:18px 9px;gap:10px;border:1px solid #ffffff21;border-radius:24px;background:linear-gradient(165deg,#ffffff16,#ffffff05 55%,#ffffff0c);box-shadow:inset 1px 1px 0 #ffffff20,0 12px 40px #0003;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.bubble{border-radius:16px;transition:transform .22s ease,background-color .22s ease,box-shadow .22s ease,border-color .22s ease;transform-origin:center;touch-action:manipulation}
.bubble:hover,.bubble:focus-visible,.bubble.peek{transform:translateX(-3px) scale(1.12);background:linear-gradient(145deg,#ffffff22,#ffffff0b);border-color:#ffffff35;box-shadow:inset 0 1px 1px #ffffff30,0 5px 18px #0003}
.bubble.active{background:linear-gradient(145deg,#ffffff1f,#ffffff09);border-color:#ffffff35;box-shadow:inset 0 1px 1px #ffffff30}
.bubble.active::after{content:'';position:absolute;right:4px;width:3px;height:3px;border-radius:50%;background:#d57d7d}
.bubble span{right:calc(100% + 18px)}
.bubble.active span{opacity:0;visibility:hidden}
.panel-shell{width:350px;top:auto;bottom:auto}
.panel-shell::after{content:'';position:absolute;right:-6px;top:var(--cloud-anchor,50%);width:12px;height:12px;transform:translateY(-50%) rotate(45deg);border-top:1px solid #ffffff24;border-right:1px solid #ffffff24;background:#25282ddd;border-radius:0 4px 0 0;pointer-events:none}
.glass-panel{max-height:min(54svh,440px);transform-origin:right var(--cloud-anchor,50%)}
@keyframes cloudIn{from{opacity:0;transform:translateX(10px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:760px){.bubble-cloud{right:10px;width:56px;padding:12px 5px;gap:4px;border-radius:20px}.glass-panel{max-height:42svh;padding:18px}}
@media(max-height:450px){.bubble-cloud{top:50%;transform:translateY(-50%);padding:5px;gap:0}.bubble{height:36px;min-height:36px}.glass-panel{max-height:calc(100svh - 24px)}}
@media(prefers-reduced-motion:reduce){.bubble:hover,.bubble:focus-visible,.bubble.peek{transform:none}}
/* More readable handwriting: brighter ink, fuller strokes and breathing room. */
.slogan{font-size:clamp(2.4rem,3.6vw,3.4rem);color:#faf8f5;letter-spacing:.018em;line-height:1.35;-webkit-text-stroke:.25px currentColor}
.slogan span{padding:0 .12em .08em 0;animation-duration:1.2s}
@media(max-width:760px){.slogan{font-size:clamp(1.8rem,6.4vw,2.3rem);letter-spacing:.01em;-webkit-text-stroke:.2px currentColor}}
/* Wider content cloud; scrolling stays inside its rounded shell. */
.glass-panel{display:flex;flex-direction:column;overflow:hidden;scrollbar-gutter:auto;max-height:min(64svh,520px);padding-right:32px}
.panel-head{flex-shrink:0}
.panel-body{min-height:0;overflow:auto;scrollbar-width:none;padding-right:8px;overscroll-behavior:contain}
.panel-body::-webkit-scrollbar{display:none}
.panel-scroll{position:absolute;right:9px;top:50%;transform:translateY(-50%);margin:0;width:14px;height:80px;writing-mode:vertical-lr;direction:ltr;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer;opacity:.65}
.panel-scroll:hover,.panel-scroll:focus-visible{opacity:1}
.panel-scroll::-webkit-slider-runnable-track{width:3px;background:#ffffff0b;border-radius:99px}
.panel-scroll::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:3px;height:22px;border:0;border-radius:99px;background:#d9e0eb55}
.panel-scroll::-moz-range-track{width:3px;background:#ffffff0b;border-radius:99px}
.panel-scroll::-moz-range-thumb{width:3px;height:22px;border:0;border-radius:99px;background:#d9e0eb55}
.panel-body:focus-visible{outline:1px solid #ffffff40;outline-offset:2px}
@media(min-width:1000px){.list-grid,.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.glass-panel{max-height:48svh;padding-right:28px}.panel-scroll{height:64px;right:7px}}
@media(max-height:450px){.glass-panel{max-height:calc(100svh - 24px)}}
/* Keep hover labels out of the open content panel. */
.bubble-cloud.panel-open .bubble span,
.bubble-cloud.panel-open .bubble:hover span,
.bubble-cloud.panel-open .bubble:focus-visible span,
.bubble-cloud.panel-open .bubble.peek span{opacity:0;visibility:hidden;transition:none;pointer-events:none}
/* A clear gap after the handwritten line, then a character-by-character motto. */
.tagline{top:calc(100% + 9rem)}
.tagline-line{animation:none}
.tagline-line.typing::after{content:'';display:inline-block;width:1px;height:1em;margin-left:3px;vertical-align:-.12em;background:#d6d9e0}
.bubble-cloud.ready{animation:sidebarEnter .55s cubic-bezier(.2,.8,.2,1) both}
@keyframes sidebarEnter{from{opacity:0;translate:22px 0}to{opacity:1;translate:0 0}}
@media(max-width:760px){.tagline{top:calc(100% + 8rem)}}
/* Smaller handwriting and a closer supporting line. */
.slogan{font-size:clamp(2.1rem,3.1vw,2.9rem)}
.tagline{top:calc(100% + 8rem)}
@media(max-width:760px){.slogan{font-size:clamp(1.65rem,5.8vw,2.05rem)}.tagline{top:calc(100% + 7rem)}}
@media(prefers-reduced-motion:reduce){.ambient::after{display:none}}

@media(prefers-reduced-motion:reduce){.letter{clip-path:none;opacity:1;transform:none}.systems{opacity:1;transform:none}}

/* Refined wordmark proportions; retain the signature red X. */
.wordmark{font-family:"Segoe UI",Arial,Helvetica,sans-serif;font-weight:800;letter-spacing:-.065em}

/* Same outer dimensions for every section; only the content scrolls. */
.glass-panel{height:min(64svh,520px);max-height:min(64svh,520px)}
.panel-body{flex:1 1 auto}
.panel-body h3{font-size:1rem;color:#f4f4f4;margin:1.2rem 0 .4rem}
@media(max-width:760px){.glass-panel{height:48svh;max-height:48svh}}
@media(max-height:450px){.glass-panel{height:calc(100svh - 24px);max-height:calc(100svh - 24px)}}
/* A one-minute, local-clock sunrise or moonrise. */
.time-sky{position:absolute;inset:0;--sun-x:54%;--sun-y:85%;--day-light:0}
.daylight-wash{position:absolute;inset:0;background:radial-gradient(ellipse at 70% 12%,#fff9e7 0%,#dadbd9 34%,#a9b6bf 70%,#899baa 100%);opacity:0;transition:opacity 60s linear}
.sky-ready.daytime .daylight-wash{opacity:var(--day-light)}
.sun-disc,.moon-disc{position:absolute;left:54%;top:95%;width:clamp(38px,5vw,72px);aspect-ratio:1;border-radius:50%;opacity:0;transform:translate(-50%,-50%);transition:left 60s ease-in-out,top 60s ease-in-out,opacity 60s linear}
.sun-disc{background:radial-gradient(circle at 40% 35%,#fffdf1,#ffdfa0);box-shadow:0 0 45px 12px #ffdda14d,0 0 110px 40px #ffe5b31c}
.sky-ready.daytime .sun-disc{left:var(--sun-x);top:var(--sun-y);opacity:.88}
.moon-disc{background:#dde2e7;box-shadow:inset -14px -3px 0 1px #10141d,0 0 40px #d9e7ff12;width:clamp(30px,4vw,54px)}
.sky-ready.nighttime .moon-disc{left:var(--sun-x);top:var(--sun-y);opacity:.65}
.star-field{position:absolute;inset:0;opacity:0;transition:opacity 60s linear}
.sky-ready.nighttime .star-field{opacity:.55}
.star-field i{position:absolute;width:2px;height:2px;border-radius:50%;background:#dce5f1;animation:starTwinkle var(--twinkle) ease-in-out infinite alternate}
@keyframes starTwinkle{from{opacity:.15}to{opacity:.65}}
.wordmark .letter:not(.x),.systems,.slogan,.tagline-line{transition:color 60s linear}
.sky-ready.daytime .wordmark .letter:not(.x){color:#f4f4f5}
.sky-ready.daytime .systems{color:#c9cbd0}
.sky-ready.daytime .slogan{color:#faf8f5}
.sky-ready.daytime .tagline-line{color:#d6d9df}
.sky-ready.daytime .bubble-cloud{background:linear-gradient(165deg,#252b34ba,#151b24ad);transition:background 60s linear}
/* Preserve panel legibility against the brighter daytime sky. */
.daytime .glass-panel{background:linear-gradient(140deg,#262b32f5,#161b23f2)}
.silver-trail{position:fixed;inset:0;pointer-events:none;z-index:20;opacity:0;transition:opacity .45s ease}
.silver-trail.visible{opacity:.55}
.silver-trail i{position:absolute;left:var(--cursor-x,-40px);top:var(--cursor-y,-40px);width:3px;height:3px;border-radius:50%;background:#e1e6ef;box-shadow:0 0 5px #ffffff30;transition:left var(--lag) ease-out,top var(--lag) ease-out;transform:translate(-50%,-50%)}
.silver-trail i:nth-child(2){width:2px;height:2px;opacity:.7}.silver-trail i:nth-child(3){width:2px;height:2px;opacity:.45}.silver-trail i:nth-child(4){width:1px;height:1px;opacity:.3}
.daytime .silver-trail i{background:#465366;box-shadow:none}
@media(prefers-reduced-motion:reduce){.star-field i{animation:none;opacity:.35}.silver-trail{display:none}}
/* Enter from beyond the left edge, already at the clock's target elevation. */
.sun-disc,.moon-disc{left:-12%;top:var(--sun-y);transition:left 60s ease-in-out,opacity 60s ease-in-out}
.sky-ready.daytime .sun-disc,.sky-ready.nighttime .moon-disc{left:var(--sun-x);top:var(--sun-y)}
.moon-disc{background:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NCA2NCI+PGRlZnM+PG1hc2sgaWQ9ImNyZXNjZW50Ij48cmVjdCB3aWR0aD0iNjQiIGhlaWdodD0iNjQiIGZpbGw9ImJsYWNrIi8+PGNpcmNsZSBjeD0iMzIiIGN5PSIzMiIgcj0iMjciIGZpbGw9IndoaXRlIi8+PGNpcmNsZSBjeD0iMjYiIGN5PSIyOCIgcj0iMjciIGZpbGw9ImJsYWNrIi8+PC9tYXNrPjwvZGVmcz48Y2lyY2xlIGN4PSIzMiIgY3k9IjMyIiByPSIyNyIgZmlsbD0iI2VlZjNmYSIgbWFzaz0idXJsKCNjcmVzY2VudCkiLz48L3N2Zz4NCg==') center/contain no-repeat;box-shadow:none;border-radius:0;filter:drop-shadow(0 0 10px #c9dcff30);width:clamp(38px,5vw,64px)}
.sky-ready.nighttime .moon-disc{opacity:.85}
.daylight-wash{background:linear-gradient(170deg,#a8cbe7 0%,#c0d6e5 42%,#a0b6c9 100%);transition:opacity 60s ease-in-out}
.noon-wash,.moonlight-wash{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity 60s ease-in-out}
.noon-wash{background:radial-gradient(ellipse at 70% 8%,#fff8e2,#e0e5e7 48%,#b8cad7)}
.sky-ready.daytime .noon-wash{opacity:var(--day-warmth)}
.moonlight-wash{background:radial-gradient(ellipse at 70% 18%,#8199bd45 0%,#536a8d25 45%,#2d405716 100%)}
.sky-ready.nighttime .moonlight-wash{opacity:1}
/* Reduced-motion visitors receive the final scene immediately. */
@media(prefers-reduced-motion:reduce){.sun-disc,.moon-disc,.daylight-wash,.noon-wash,.moonlight-wash{transition:none}}
/* Broad, simple illumination plus static dithering avoids dark gradient bands. */
.ambient{overflow:hidden;background:#0b0d11}
.daylight-wash{background:linear-gradient(180deg,#abc8df 0%,#b9cbd8 100%)}
.noon-wash{background:linear-gradient(180deg,#e9e9e0 0%,#c5d1da 100%)}
.moonlight-wash{background:linear-gradient(180deg,rgba(115,140,180,.14) 0%,rgba(70,91,126,.025) 100%)}
.time-sky::after{content:'';position:absolute;inset:0;pointer-events:none;background-image:url('assets/sky-grain.png');background-repeat:repeat;opacity:.032;mix-blend-mode:soft-light}
/* Team hierarchy: founder emphasis, compact single-row supporting roles. */
.team-list{gap:0}
.team-list>div{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:12px 0}
.team-list>div strong{font-size:.875rem;font-weight:500;color:#d5d8df;white-space:nowrap}
.team-list>div span{font-size:.8125rem;color:#b9bec8;text-align:right}
.team-list>.team-founder{display:grid;gap:5px;padding:18px 0 22px;margin-bottom:6px}
.team-list>.team-founder strong{font-size:1.35rem;font-weight:700;color:#fff}
.team-list>.team-founder span{font-size:1rem;color:#e2e5eb;text-align:left}
@media(min-width:761px){.team-list>div:not(.team-founder) span{white-space:nowrap}}
@media(max-width:760px){.team-list>div:not(.team-founder){flex-wrap:wrap;gap:4px 10px}.team-list>div:not(.team-founder) span{text-align:left}}
/* Short, slow entrances from the nearest edge, never across the page. */
.sun-disc{left:-40px}
.moon-disc{left:calc(100% + 40px)}
.sun-disc,.moon-disc{transition:left 90s cubic-bezier(.25,.1,.25,1),opacity 90s ease-in-out}
.sky-ready.daytime .sun-disc{left:clamp(48px,6vw,110px)}
.sky-ready.nighttime .moon-disc{left:calc(100% - clamp(96px,8vw,144px))}
.daylight-wash,.noon-wash,.moonlight-wash,.star-field{transition:opacity 120s ease-in-out}
.wordmark .letter:not(.x),.systems,.slogan,.tagline-line{transition:color 120s ease-in-out}
@media(prefers-reduced-motion:reduce){.sun-disc,.moon-disc,.daylight-wash,.noon-wash,.moonlight-wash,.star-field{transition:none}}
.contact-note,.contact-status{font-size:.8125rem;line-height:1.5;color:#c2c7d0;margin:0}
.contact-status:empty{display:none}
.contact-form button:disabled{opacity:.6;cursor:default}
.whatsapp-continue{display:block;text-align:center;padding:12px;border:1px solid #ffffff35;border-radius:999px;color:#f1f4f8;background:#ffffff08}
.whatsapp-direct{display:flex;align-items:center;gap:22px;padding:18px;border:1px solid #ffffff18;border-radius:22px;background:#ffffff04;margin:18px 0 24px}
.qr-window{position:relative;display:block;flex:0 0 170px;width:170px;height:170px;overflow:hidden;background:#fff;border-radius:8px}
.qr-window img{position:absolute;max-width:none;width:216.470588%;height:auto;left:-58.235294%;top:-185.294118%}
.whatsapp-direct h3{margin:0 0 8px;font-size:1.05rem}
.whatsapp-direct p{font-size:.875rem;line-height:1.55;margin:0 0 12px;color:#c7ccd4}
.direct-chat-link{font-size:.875rem;color:#e4f5eb;text-decoration:underline;text-underline-offset:4px}
@media(max-width:760px){.whatsapp-direct{flex-direction:column;align-items:flex-start;padding:14px;gap:14px}.qr-window{flex-basis:170px;align-self:center}}
/* Give the crescent breathing room above the sidebar, starting fully offscreen. */
.moon-disc{left:calc(100% + 100px);top:clamp(44px,calc(var(--sun-y) - 64px),18svh)}
.sky-ready.nighttime .moon-disc{top:clamp(44px,calc(var(--sun-y) - 64px),18svh)}

/* Quiet crescent entrance, confined to the upper-right corner. */
.moon-disc{left:calc(100% + 34px);top:clamp(48px,9svh,90px);transition:left 120s linear,opacity 24s ease-out}
.sky-ready.nighttime .moon-disc{left:calc(100% - clamp(58px,5vw,88px));top:clamp(48px,9svh,90px);opacity:.8}
.moonlight-wash{background:linear-gradient(155deg,rgba(115,140,180,.025),rgba(115,140,180,.12) 60%,rgba(70,91,126,.025));transition:opacity 120s linear}
@media(prefers-reduced-motion:reduce){.moon-disc,.moonlight-wash{transition:none}}

/* Daytime sun stays in the upper-left corner. */
.sun-disc{left:-40px;top:clamp(48px,9svh,90px);transition:left 120s linear,opacity 24s ease-out}
.sky-ready.daytime .sun-disc{left:clamp(58px,5vw,88px);top:clamp(48px,9svh,90px)}
@media(prefers-reduced-motion:reduce){.sun-disc{transition:none}}

/* Keep daylight atmospheric while preserving white-text contrast throughout arrival. */
.daylight-wash{background:linear-gradient(155deg,#293b4b 0%,#1c2935 45%,#12191f 100%)}
.noon-wash{background:linear-gradient(155deg,#3b4145 0%,#273039 45%,#171e25 100%)}
