/* Load after atmosphere.css. These opt-in classes override existing control skins only.
   MIT adaptations: BHARGAVPATEL1244/great-catfish-18 (skew reveal),
   cssbuttons-io/massive-mayfly-74 (expanding arrow capsule),
   gharsh11032000/neat-bullfrog-61 (central expanding circle).
   Original notices and license are included with the site's third-party notices. */
:is(button,a).ix-reveal,:is(button,a).ix-expand,:is(button,a).ix-ripple{position:relative;isolation:isolate;overflow:hidden;-webkit-tap-highlight-color:transparent;touch-action:manipulation}

/* 1. A skewed dark cover slides off an ice-blue base. Text remains above the cover. */
:is(button,a).ix-reveal{background:#c4e4ff;color:#f2f7ff;border:1px solid #a4cfff73;border-radius:999px;box-shadow:0 5px 22px #02091b30,inset 0 1px #ffffff15;transition:color .4s,box-shadow .4s,border-color .4s,transform .16s}
:is(button,a).ix-reveal::before{content:'';position:absolute;inset:0 auto 0 -10%;width:120%;height:100%;z-index:-1;background:linear-gradient(115deg,#1a3457,#14253f);transform:skew(30deg);transition:transform .4s cubic-bezier(.3,1,.8,1);pointer-events:none}
:is(button,a).ix-reveal:is(:focus-visible,:active){background:#c4e4ff;color:#0c1c35;border-color:#dfedff;box-shadow:0 6px 28px #82baff26;transform:none}
:is(button,a).ix-reveal:is(:focus-visible,:active)::before{left:-10%;transform:translate3d(100%,0,0) skew(30deg)}

/* 2. The existing arrow keeps its position/name; its circle expands behind the label. */
:is(button,a).ix-expand{display:inline-flex;align-items:center;justify-content:space-between;gap:.55em;max-width:100%;min-height:2.35em;padding:.18em .2em .18em .7em;border:0;border-radius:999px;background:transparent;color:#c7dfff;line-height:1.55;vertical-align:middle;transition:color .45s,box-shadow .45s,transform .16s}
:is(button,a).ix-expand::before{content:'';position:absolute;inset:0 0 0 auto;width:2.35em;z-index:-1;border-radius:999px;background:#29466d;box-shadow:inset 0 0 0 1px #9bc6ff36;transition:width .45s cubic-bezier(.65,0,.076,1),background .45s;pointer-events:none}
:is(button,a).ix-expand>.ix-arrow{display:inline-grid;place-items:center;flex:0 0 2em;min-width:2em;height:2em;position:relative;font:inherit;line-height:1;transition:transform .45s cubic-bezier(.65,0,.076,1)}
:is(button,a).ix-expand:is(:focus-visible,:active){color:#fff;box-shadow:0 4px 18px #699fff13}
:is(button,a).ix-expand:is(:focus-visible,:active)::before{width:100%;background:#24466f}
:is(button,a).ix-expand:is(:focus-visible,:active)>.ix-arrow{transform:translateX(2px)}

/* 3. A central blue circle opens into a subtle full-surface glow. */
:is(button,a).ix-ripple{transition:color .35s,border-color .35s,box-shadow .35s,transform .16s;background-clip:padding-box}
:is(button,a).ix-ripple::before{content:'';position:absolute;left:50%;top:50%;width:22px;height:22px;border-radius:50%;z-index:-1;background:#76b8ff21;opacity:0;transform:translate(-50%,-50%) scale(0);transition:transform .8s cubic-bezier(.23,1,.32,1),opacity .4s;pointer-events:none}
:is(button,a).ix-ripple:is(:focus-visible,:active){border-color:#b1d6ff80;box-shadow:inset 0 0 0 1px #9ac9ff2e;color:#edf6ff}
:is(button,a).ix-ripple:is(:focus-visible,:active)::before{opacity:1;transform:translate(-50%,-50%) scale(32)}
.scenario-tabs>button.ix-ripple[aria-selected="true"]{background:#c6e0ff;border-color:#e3f0ff;color:#101f38;box-shadow:0 3px 18px #78b5ff28}
.scenario-tabs>button.ix-ripple[aria-selected="true"]::before{opacity:.42;transform:translate(-50%,-50%) scale(32)}
.scenario-tabs>button.ix-ripple[aria-selected="true"] .ui-icon{color:#294e7a}

/* Supporting controls keep their existing layout and native semantics. */
summary.ix-summary{border-radius:5px;transition:color .25s,background .25s;touch-action:manipulation}
summary.ix-summary:is(:focus-visible,:active){color:#e9f4ff;background:#91bdff08}
summary.ix-summary:is(:focus-visible,:active) :is(.row-plus,.service-symbol){color:#c5e4ff}
.site-header nav a.ix-nav{transition:color .25s}
.site-header nav a.ix-nav::after{background:#a5d1ff;transition:width .3s}
.site-header nav a.ix-nav:is(:focus-visible,:active){color:#e5f1ff}
.site-header nav a.ix-nav:is(:focus-visible,:active)::after{width:100%}
button.ix-control{border-radius:6px;transition:background .25s,color .25s,box-shadow .25s;touch-action:manipulation}
button.ix-control:is(:focus-visible,:active){background:#91bdff14;color:#e5f1ff;box-shadow:inset 0 0 0 1px #a5cfff40}
:is(.ix-reveal,.ix-expand,.ix-ripple,.ix-summary,.ix-nav,.ix-control):focus-visible{outline:2px solid #b5dcff;outline-offset:4px}
:is(button,a).ix-reveal:active,:is(button,a).ix-expand:active,:is(button,a).ix-ripple:active{transform:scale(.98)}
:is(button,a).ix-reveal:disabled,:is(button,a).ix-expand:disabled,:is(button,a).ix-ripple:disabled{cursor:default;opacity:.55;transform:none}

/* Hover is limited to pointer devices; touch uses the explicit active treatment above. */
@media(hover:hover) and (pointer:fine){
 :is(button,a).ix-reveal:hover{background:#c4e4ff;color:#0c1c35;border-color:#dfedff;box-shadow:0 6px 28px #82baff26;transform:none}
 :is(button,a).ix-reveal:hover::before{left:-10%;transform:translate3d(100%,0,0) skew(30deg)}
 :is(button,a).ix-expand:hover{color:#fff;box-shadow:0 4px 18px #699fff13}
 :is(button,a).ix-expand:hover::before{width:100%;background:#24466f}
 :is(button,a).ix-expand:hover>.ix-arrow{transform:translateX(2px)}
 :is(button,a).ix-ripple:hover{border-color:#b1d6ff80;box-shadow:inset 0 0 0 1px #9ac9ff2e;color:#edf6ff}
 :is(button,a).ix-ripple:hover::before{opacity:1;transform:translate(-50%,-50%) scale(32)}
 .scenario-tabs>button.ix-ripple[aria-selected="true"]:hover{color:#101f38}
 summary.ix-summary:hover{color:#e9f4ff;background:#91bdff08}
 summary.ix-summary:hover :is(.row-plus,.service-symbol){color:#c5e4ff}
 .site-header nav a.ix-nav:hover{color:#e5f1ff}
 .site-header nav a.ix-nav:hover::after{width:100%}
 button.ix-control:hover{background:#91bdff14;color:#e5f1ff;box-shadow:inset 0 0 0 1px #a5cfff40}
 :is(button,a).ix-reveal:hover:active,:is(button,a).ix-expand:hover:active,:is(button,a).ix-ripple:hover:active{transform:scale(.98)}
}

/* A stopped/reduced-motion UI still shows the complete selected, focus and pressed states. */
body[data-motion-paused="true"] :is(.ix-reveal,.ix-expand,.ix-ripple,.ix-summary,.ix-nav,.ix-control),body[data-motion-paused="true"] :is(.ix-reveal,.ix-expand,.ix-ripple,.ix-nav)::before,body[data-motion-paused="true"] .ix-nav::after,body[data-motion-paused="true"] .ix-arrow{transition:none!important;animation:none!important}
@media(prefers-reduced-motion:reduce){
 :is(.ix-reveal,.ix-expand,.ix-ripple,.ix-summary,.ix-nav,.ix-control),:is(.ix-reveal,.ix-expand,.ix-ripple,.ix-nav)::before,.ix-nav::after,.ix-arrow{transition:none!important;animation:none!important}
 :is(button,a).ix-reveal:active,:is(button,a).ix-expand:active,:is(button,a).ix-ripple:active{transform:none!important}
}

/* Light FAQ controls keep sufficient contrast in every interaction state. */
.faq summary.ix-summary:is(:hover,:focus-visible,:active){color:#1b3e69;background:#7ba7e015}
.faq .ix-summary:focus-visible{outline-color:#315d91}