/* Waei refresh layer — presentation improvements without rewriting clinical copy */
:root{--waei-focus:#0b83c6;--waei-shadow:0 12px 32px rgba(14,42,68,.08);--waei-radius:22px}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{height:auto}
a,button,input,select,textarea{ -webkit-tap-highlight-color:transparent }
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--waei-focus)!important;outline-offset:3px!important}
button,a{touch-action:manipulation}
::selection{background:#cceeff;color:#0e2a44}
.waei-home-link{position:fixed;z-index:1000;inset-block-start:14px;inset-inline-start:14px;display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border:1px solid rgba(255,255,255,.45);border-radius:999px;background:rgba(14,42,68,.94);color:#fff!important;text-decoration:none!important;font:700 14px/1.4 Taj,system-ui,sans-serif;box-shadow:0 8px 24px rgba(14,42,68,.16);backdrop-filter:blur(12px)}
.waei-home-link:hover{transform:translateY(-1px);background:#145189}
.waei-search{margin:18px 0 24px;padding:16px;border:1px solid #d5e5f1;border-radius:20px;background:linear-gradient(135deg,#f4faff,#fff);box-shadow:0 8px 24px rgba(14,42,68,.05);font-family:inherit}
.waei-search label{display:block;font-weight:800;color:#0e2a44;margin-bottom:8px}
.waei-search .waei-search-row{display:flex;gap:10px;align-items:center}
.waei-search input{width:100%;min-width:0;border:1px solid #b9d3e7;border-radius:14px;padding:12px 14px;background:#fff;color:#123040;font:inherit}
.waei-search input:focus{border-color:#1888c8;box-shadow:0 0 0 3px rgba(24,136,200,.13);outline:none}
.waei-search .waei-search-count{font-size:13px;color:#5a7085;margin-top:8px}
.waei-search button{flex:0 0 auto;border:0;border-radius:12px;padding:12px 15px;background:#0f3a57;color:#fff;font:700 14px/1.4 inherit;cursor:pointer}
.waei-search button:hover{background:#155783}
.waei-no-results{padding:18px;text-align:center;color:#5a7085;border:1px dashed #b9d3e7;border-radius:16px;background:#fff}
@media(max-width:700px){.waei-home-link{inset-block-start:10px;inset-inline-start:10px;padding:8px 12px;font-size:13px}.waei-search{padding:12px}.waei-search .waei-search-row{align-items:stretch}.waei-search button{padding-inline:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
@media print{.waei-home-link,.waei-search{display:none!important}}
[hidden]{display:none!important}
@media(max-width:860px){nav .links{display:flex!important;overflow-x:auto;white-space:nowrap;max-width:100%;gap:14px;margin-inline-start:auto;padding:2px 0;scrollbar-width:none}nav .links::-webkit-scrollbar{display:none}nav .wrap{gap:12px;overflow:hidden}nav .wrap>img{flex:0 0 auto}}


/* Video poster fallback: avoids a broken/blank Google Drive iframe on mobile browsers. */
.video-poster{overflow:hidden;position:relative;background:#0e2a44}
.video-poster-link{position:relative;display:block;width:100%;height:100%;min-height:220px;overflow:hidden;border-radius:inherit;color:#fff;text-decoration:none}
.video-poster-link img{display:block;width:100%;height:100%;min-height:220px;max-height:620px;object-fit:cover;filter:brightness(.76);transition:filter .2s ease,transform .25s ease}
.video-poster-link:hover img{filter:brightness(.88);transform:scale(1.015)}
.video-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:76px;height:76px;border-radius:50%;background:#84e0fc;color:#0e2a44;border:3px solid rgba(255,255,255,.92);box-shadow:0 8px 26px rgba(0,0,0,.2);font-size:28px;padding-inline-start:4px}
.video-poster-caption{position:absolute;inset-inline:14px;bottom:14px;text-align:center;padding:12px 16px;border-radius:14px;background:rgba(14,42,68,.86);color:#fff;font-weight:800;font-size:clamp(15px,2.5vw,20px)}
@media(max-width:600px){.video-poster-link,.video-poster-link img{min-height:210px}.video-play{width:62px;height:62px;font-size:23px}}


/* Mobile polish v2: keep the mascot fully visible and prevent speech-bubble overlap. */
@media (max-width: 860px) {
  html { scroll-padding-top: 76px; }
  nav { position: sticky; top: 0; }
  nav .wrap { min-height: 60px; height: 60px; padding-inline: 14px; gap: 12px; }
  nav .wrap > img { height: 34px; width: auto; }
  nav .links { flex: 1 1 auto; min-width: 0; gap: 16px; font-size: 14px; padding: 5px 2px; }
  .hero { padding-top: 34px; }
  .hero .wrap { gap: 18px; }
  .hero .tx { padding-bottom: 0; }
  .hero h1 { font-size: clamp(34px, 8.4vw, 46px); line-height: 1.28; }
  .hero p { font-size: clamp(17px, 4.2vw, 20px); line-height: 1.8; margin: 14px 0 22px; }
  .btns { gap: 10px; }
  .btn { justify-content: center; min-height: 48px; padding: 12px 18px; font-size: 15px; }
  .hero .char { width: 100%; padding-top: 0; margin-top: 6px; }
  .hero .bubble { position: relative; inset: auto; transform: none; order: 0; width: fit-content; max-width: min(290px, 90%); margin: 0 auto 10px; padding: 9px 15px; white-space: normal; font-size: 14px; line-height: 1.55; border-radius: 17px 17px 17px 5px; }
  .stage { width: 100%; display: flex; justify-content: center; }
  .stage img { width: auto; height: clamp(280px, 78vw, 350px); max-width: 100%; object-fit: contain; }
  .stage .halo { inset: 14% 15% 3%; }
  .ctrl { justify-content: center; flex-wrap: wrap; gap: 12px; margin: 2px 0 22px; }
  .pbtn { min-height: 44px; }
  .quote-strip { padding: 12px 16px; line-height: 1.65; }
  section { padding: 54px 0; }
  .wrap { padding-inline: 18px; }
  .card { padding: 22px; }
  .fig { border-radius: 18px; }
  .demo .shot { height: clamp(210px, 65vw, 300px); }
  .demo .shot img { height: 100%; object-fit: cover; }
  .tabs { gap: 8px; }
  .tabs button { min-height: 42px; padding: 8px 14px; font-size: 14px; }
  .video-poster-link, .video-poster-link img { min-height: 190px; }
  footer .wrap { gap: 16px; }
  footer img.l { height: 54px; }
  footer .w { height: 72px; }
}
@media (max-width: 420px) {
  nav .wrap { padding-inline: 10px; gap: 9px; }
  nav .wrap > img { height: 30px; }
  nav .links { gap: 13px; font-size: 13px; }
  .hero { padding-top: 28px; }
  .hero .wrap { padding-inline: 17px; }
  .hero h1 { font-size: clamp(31px, 8.2vw, 36px); }
  .hero .tag { font-size: 12px; padding: 4px 12px; }
  .btns { flex-direction: column; align-items: stretch; }
  .btn { width: 100%; }
  .stage img { height: min(78vw, 315px); }
  .hero .bubble { max-width: 260px; }
  .swatches { gap: 10px; }
  .sw div { font-size: 13px; }
}


/* Mobile v3: prevent sticky navigation from covering the hero title and keep the speech bubble in normal flow. */
@media (max-width: 700px) {
  html { scroll-padding-top: 16px; }
  nav { position: relative !important; top: auto !important; }
  nav .wrap { overflow: visible; min-height: 58px; height: auto; padding-block: 10px; }
  nav .links { max-width: calc(100vw - 95px); }
  .hero { padding-top: 30px; overflow: visible; }
  .hero .wrap { display: flex; flex-direction: column; align-items: stretch; gap: 18px; }
  .hero .tx { width: 100%; padding: 0; }
  .hero h1 { font-size: clamp(30px, 8vw, 38px); line-height: 1.35; overflow-wrap: anywhere; }
  .hero p { max-width: none; margin: 14px 0 22px; line-height: 1.8; }
  .hero .char { display: flex !important; position: relative; width: 100%; flex-direction: column; align-items: center; gap: 10px; margin: 0; padding: 0; }
  .hero .bubble { position: relative !important; inset: auto !important; top: auto !important; right: auto !important; left: auto !important; transform: none !important; order: 0; display: block; width: fit-content; max-width: min(340px, 100%); margin: 0 auto 2px; padding: 12px 18px; white-space: normal; overflow-wrap: anywhere; text-align: center; font-size: 15px; line-height: 1.65; border-radius: 18px 18px 18px 5px; z-index: 1; }
  .stage { width: 100%; min-height: 0; display: flex; justify-content: center; align-items: center; }
  .stage img { display: block; width: auto; height: clamp(260px, 74vw, 330px); max-width: 100%; object-fit: contain; }
  .stage .halo { inset: 14% 15% 3%; }
  .ctrl { margin: 4px 0 20px; justify-content: center; flex-wrap: wrap; }
  .btns { display: flex; flex-direction: column; align-items: stretch; }
  .btn { width: 100%; min-height: 48px; }
  .video .frame { aspect-ratio: 4 / 3; }
}
@media (max-width: 380px) {
  nav .wrap { padding-inline: 8px; gap: 8px; }
  nav .wrap > img { height: 28px; }
  nav .links { gap: 11px; font-size: 12px; max-width: calc(100vw - 82px); }
  .hero .wrap { padding-inline: 15px; }
  .hero h1 { font-size: 30px; }
  .hero .bubble { max-width: 100%; font-size: 14px; }
  .stage img { height: 260px; }
}