/* Floating glass navigation and reference-inspired hero. */
body{background:#eef0ff}
.site-header{top:12px;margin:12px 20px -100px;z-index:100;background:linear-gradient(110deg,#ffffff80,#f2edff99);border:1px solid #ffffffdb;border-radius:16px;box-shadow:0 8px 30px #676ec31a;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.site-header .navigation{width:100%;max-width:1560px;padding:8px 24px;min-height:82px;gap:20px}
.site-header #main-nav>a.nav-icon-link{padding:12px 17px;border-radius:20px;color:#171b46}
.site-header #main-nav>a.nav-icon-link:hover,.site-header #main-nav>a.nav-icon-link[aria-current]{background:#b8a5ff33;color:#6421ff}
.site-header #main-nav>a.nav-icon-link[aria-current]:after{display:none}
.site-header #main-nav>.button{position:relative;margin-left:20px;padding:16px 26px;display:inline-flex;gap:22px;align-items:center;background:linear-gradient(110deg,#08d6ab,#009cc0);border:1px solid #ffffffaa;font-size:15px;white-space:nowrap}
.site-header #main-nav>.button:before{content:'';position:absolute;left:-20px;top:20%;height:60%;width:1px;background:#a6a6c366}
.site-header #main-nav>.button span{font-size:22px}
.hero{position:relative;isolation:isolate;overflow:hidden;padding-top:130px;padding-bottom:50px;min-height:50px}
.hero:not([data-active-slide]),.hero[data-active-slide="1"]{background:radial-gradient(ellipse at 15% 30%,#d5eaff 0%,transparent 58%),linear-gradient(120deg,#e9f1ff,#eee9ff 62%,#fbf6ff)}
.hero:before{content:'';position:absolute;z-index:-1;width:95%;height:90%;left:-20%;top:20%;border-radius:50%;background:#ffffff30;pointer-events:none}
.hero:after{content:'';position:absolute;z-index:-1;width:72%;height:110%;right:8%;top:-48%;border-radius:50%;background:#ffffff24;pointer-events:none}
.hero .hero-content{padding-right:25px}
.hero .slide:first-child h1{color:#080e2e}
.hero .slide:first-child em{background:linear-gradient(110deg,#7800ff,#343eff 55%,#00a9d5);background-clip:text;-webkit-background-clip:text}
.hero .slide:first-child .eyebrow{color:#654795}
.hero .slide:first-child>p:not(.eyebrow){color:#606781}
.hero .slide .actions{gap:18px}
.hero .slide .actions>.button{background:linear-gradient(110deg,#7800ff,#13abf4);width:auto;min-width:225px;min-height:56px}
.hero .slide .actions>.text-link{display:inline-flex;justify-content:center;align-items:center;gap:24px;min-height:56px;padding:9px 24px;border:1px solid #478ac9;border-radius:999px;color:#006d9b;background:#ffffff18;font-size:15px;font-weight:700;text-decoration:none}
.hero .slide .actions>.text-link:after{content:'→';font-size:23px}
.hero .hero-controls{border-top:0}
.hero-nav-arrow{position:absolute;z-index:4;top:50%;width:38px;height:38px;display:grid;place-items:center;border:0;border-radius:50%;background:#ffffffed;color:#151844;box-shadow:0 5px 18px #46467c20;cursor:pointer}
.hero-nav-arrow svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.hero-nav-arrow[data-slide=prev]{left:16px}.hero-nav-arrow[data-slide=next]{right:64px}
.hero-nav-arrow:hover{background:#e9e3ff}.hero-nav-arrow:focus-visible{outline:3px solid #7951ff;outline-offset:4px}
@media(min-width:1500px){.hero{min-height:900px}}
@media(max-width:1100px){
.site-header{margin:10px 12px -90px;top:10px}
.site-header .navigation{padding:6px 16px;min-height:72px}
.site-header #main-nav>.button{margin-left:0;justify-content:center}
.site-header #main-nav>.button:before{display:none}
.hero{padding-top:115px}
}
@media(max-width:700px){
.site-header{margin-inline:10px;border-radius:14px}
.hero{padding:110px 24px 90px;min-height:0}
.hero .hero-content{padding:20px 0}
.hero .slide .actions>.button,.hero .slide .actions>.text-link{width:100%;min-width:0}
.hero-nav-arrow{top:285px;width:32px;height:32px}
.hero-nav-arrow[data-slide=prev]{left:8px}.hero-nav-arrow[data-slide=next]{right:8px}
}

/* Match the published navigation CTA while retaining its diagonal arrow. */
.site-header #main-nav>.button{
  box-sizing:border-box;width:133px;height:39px;min-height:39px;
  padding:0 9px;gap:7px;justify-content:center;flex-shrink:0;
  font-size:12px;line-height:1.4;
}
.site-header #main-nav>.button span{
  display:inline-flex;align-items:center;justify-content:center;
  width:14px;height:14px;flex:0 0 14px;font-size:16px;line-height:1;
}


/* Temporary manual autoplay control. */
.hero-pause{padding:9px 16px;border:1px solid #ae9cde;border-radius:999px;background:#ffffffdf;color:#55309a;font:600 12px/1.3 Arial,sans-serif;cursor:pointer;white-space:nowrap}.hero-pause:hover{background:#eee7ff}.hero-pause:focus-visible{outline:3px solid #7946ef;outline-offset:3px}.hero-pause[aria-pressed=true]{background:#eee7ff}@media(max-width:600px){.hero .hero-controls{flex-wrap:wrap;gap:12px}.hero-pause{padding:8px 12px}}

/* Keep carousel geometry stable while changing slides. */

.hero .hero-content{display:grid}
.hero .hero-content>.slide{grid-area:1 / 1;align-self:center;width:100%;min-width:0}
.hero .hero-content>.slide[hidden]{display:block!important;visibility:hidden;pointer-events:none}
@media(max-width:700px){
  .hero .hero-image,.hero:not([data-active-slide]) .hero-image,.hero[data-active-slide="1"] .hero-image{height:370px;max-height:370px;object-fit:contain;aspect-ratio:auto}
}




/* Restore the warm CTA on the third hero slide. */
.hero .slide:nth-child(3) .actions > .button {
    background: linear-gradient(110deg, #ff9b32, #f34b10);
}