/* HOLOLY Suite home: the HOLOLY products, one half each */
.sh{margin:0;min-height:100vh;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial;background:#08192f;color:#fff}
.sh [hidden]{display:none!important}
.sh-top{position:fixed;z-index:5;left:0;right:0;top:0;height:84px;display:flex;align-items:center;gap:16px;padding:0 48px;box-sizing:border-box;background:linear-gradient(180deg,rgba(8,25,47,.85),rgba(8,25,47,0))}
.sh-logo{height:34px;width:auto}
.sh-tag{font-size:13px;font-weight:800;letter-spacing:.14em;color:#3fd3d8;padding-left:16px;border-left:1px solid rgba(255,255,255,.25)}
.sh-grow{flex:1 1 auto}
.sh-user{display:flex;align-items:center;gap:10px}
.sh-user b{display:block;font-size:13.5px}.sh-user small{display:block;font-size:12px;color:#a9bdd1}
.sh-av{width:36px;height:36px;border-radius:50%;background:#193966;display:grid;place-items:center;font-weight:800;font-size:13px}
.sh-btn{height:38px;padding:0 18px;border-radius:10px;border:0;background:#00b5bb;color:#08192f;font:inherit;font-size:14px;font-weight:700;cursor:pointer;display:grid;place-items:center;text-decoration:none}
.sh-btn.ghost{margin-left:6px;background:transparent;color:#fff;border:1px solid rgba(255,255,255,.3)}
.sh-btn:hover{filter:brightness(1.08)}

.sh-split{display:flex;min-height:100vh}
.sh-half{position:relative;flex:1 1 50%;display:flex;flex-direction:column;justify-content:flex-end;gap:28px;padding:120px 56px 56px;overflow:hidden;transition:flex-basis .35s ease}
.sh-half.vms{background:radial-gradient(circle at 30% 28%,#11707c 0%,#0b3a52 45%,#08192f 100%)}
.sh-half.cms{background:radial-gradient(circle at 70% 28%,#7a4f12 0%,#3b2a1c 45%,#0d1726 100%)}
.sh-half.vms::after{content:"";position:absolute;right:0;top:12%;bottom:12%;width:2px;background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.3),rgba(255,255,255,0))}
@media (min-width:901px){.sh-split:hover .sh-half{flex-basis:44%}.sh-split .sh-half:hover{flex-basis:56%}}
.sh-art{position:relative;flex:1 1 auto;min-height:180px;display:flex;align-items:flex-start;gap:16px}
.sh-ic{display:grid;place-items:center;border-radius:36px}
.sh-ic svg{width:50%;height:50%}
.sh-ic.big{width:140px;height:140px}.sh-ic.small{width:92px;height:92px;margin-top:48px;border-radius:26px}
.vms .sh-ic{background:rgba(0,181,187,.18);color:#3fd3d8}
.cms .sh-ic{background:rgba(242,169,59,.18);color:#f2a93b}
.sh-wall{position:absolute;right:0;top:10px;width:min(52%,380px);aspect-ratio:3/2;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;opacity:.85}
.sh-wall i{border-radius:8px;background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.04))}
.sh-wall b{position:absolute;left:41%;top:12%;width:12%;height:34%;border:2px solid #3fd3d8;border-radius:4px;animation:shBox 4s ease-in-out infinite}
.sh-wall em{position:absolute;left:-2px;top:-20px;white-space:nowrap;font-style:normal;font-size:10.5px;font-weight:700;background:#3fd3d8;color:#08192f;padding:1px 5px;border-radius:4px}
@keyframes shBox{50%{transform:translateX(10px)}}
.sh-map{position:absolute;right:0;top:10px;width:min(52%,380px);aspect-ratio:330/190;border-radius:14px;background:rgba(255,255,255,.05)}
.sh-map .rt{stroke-dasharray:420;stroke-dashoffset:420;animation:shRoute 5s ease-out infinite}
@keyframes shRoute{60%,100%{stroke-dashoffset:0}}
.sh-copy{position:relative;display:flex;flex-direction:column;gap:16px;max-width:560px}
.sh-kick{font-size:13px;font-weight:800;letter-spacing:.14em}
.vms .sh-kick{color:#3fd3d8}.cms .sh-kick,.cms h2 span{color:#f2a93b}
.sh-copy h2{margin:0;font-size:clamp(38px,4.2vw,58px);line-height:1.02;font-weight:800}
.sh-copy p{margin:0;font-size:16.5px;line-height:1.55;color:rgba(255,255,255,.82)}
.sh-copy ul{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:8px 20px;font-size:14.5px}
.sh-copy li::before{content:"✓";font-weight:800;margin-right:8px}
.vms li::before{color:#3fd3d8}.cms li::before{color:#f2a93b}
.sh-open{align-self:flex-start;height:54px;padding:0 28px;border-radius:14px;display:grid;place-items:center;font-weight:800;font-size:16px;text-decoration:none;color:#08192f;transition:transform .15s}
.vms .sh-open{background:#00b5bb}.cms .sh-open{background:#f2a93b}
.sh-open:hover{transform:translateY(-2px)}
.sh-open:focus-visible{outline:3px solid #fff;outline-offset:3px}
.sh-open.off{background:rgba(255,255,255,.14)!important;color:rgba(255,255,255,.7);cursor:not-allowed;transform:none}
.sh-half.locked .sh-art,.sh-half.locked h2{opacity:.55}
.sh-host{font-size:12.5px;color:rgba(255,255,255,.55)}

.sh-modal{position:fixed;inset:0;z-index:10;background:rgba(4,12,24,.6);backdrop-filter:blur(4px);display:grid;place-items:center;padding:16px}
.sh-card{position:relative;width:min(420px,100%);background:#fff;color:#0b1b2b;border-radius:18px;padding:30px;box-sizing:border-box;display:flex;flex-direction:column;gap:14px;box-shadow:0 30px 80px rgba(0,0,0,.45)}
.sh-card-logo{width:170px;height:auto;margin-bottom:6px}
.sh-card h3{margin:0;font-size:24px;color:#193966}
.sh-card p{margin:-6px 0 4px;font-size:14.5px;color:#5d7387}
.sh-card label{display:flex;flex-direction:column;gap:6px;font-size:13.5px;font-weight:700;color:#33495c}
.sh-card input{height:48px;border:1px solid #c9dbe3;border-radius:10px;padding:0 14px;font:inherit;font-size:15px;color:#10253b;box-sizing:border-box}
.sh-card input:focus{outline:none;border-color:#00718a;box-shadow:0 0 0 3px rgba(0,113,138,.15)}
.sh-err:empty{display:none}
.sh-err{padding:10px 12px;border-radius:9px;background:#fde8ec;border:1px solid #f3b8c4;color:#8f1730;font-size:13px}
.sh-submit{height:50px;border:0;border-radius:10px;background:#193966;color:#fff;font:inherit;font-size:16px;font-weight:800;cursor:pointer}
.sh-x{position:absolute;right:12px;top:10px;width:36px;height:36px;border:0;border-radius:9px;background:transparent;font-size:24px;color:#5d7387;cursor:pointer}
.sh-x:hover{background:#f3f7f9}

@media (max-width:900px){
  .sh-top{padding:0 16px;height:68px}.sh-user span:not(.sh-av){display:none}
  .sh-split{flex-direction:column}
  .sh-half{padding:96px 20px 40px;min-height:auto}.sh-half.cms{padding-top:40px}
  .sh-half.vms::after{display:none}
  .sh-wall,.sh-map{display:none}.sh-art{min-height:0}.sh-ic.big{width:84px;height:84px;border-radius:24px}.sh-ic.small{width:60px;height:60px;margin-top:24px;border-radius:18px}
  .sh-copy ul{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.sh-wall b,.sh-map .rt{animation:none}.sh-map .rt{stroke-dashoffset:0}.sh-half{transition:none}}
@media (max-width:520px){.sh-logo{height:24px}.sh-tag{padding-left:10px;font-size:11px}.sh-btn{padding:0 12px}}
