/* ===== 2026-09-30 landing ticker (dark strip) ===== */
.wh-ticker{background:#14161c;border-top:1px solid #1f232c;border-bottom:1px solid #1f232c;padding:14px 0}
.wh-ticker__row{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.wh-ticker__row::-webkit-scrollbar{display:none}
.wh-ticker__item{flex:1 0 220px;display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:12px;background:#1b1e26;color:#e8eaf0;text-decoration:none;transition:background .15s,transform .15s}
.wh-ticker__item:hover{background:#23272f;color:#fff;transform:translateY(-1px)}
.wh-ticker__icon{width:34px;height:34px;flex:0 0 34px}
.wh-ticker__body{min-width:0}
.wh-ticker__name{font-size:13px;color:#aab0bd;white-space:nowrap}
.wh-ticker__sym{color:#6c7382;font-size:11px;margin-left:2px}
.wh-ticker__price{font-size:17px;font-weight:600;letter-spacing:.2px;white-space:nowrap}
.wh-ticker__unit{font-size:10px;color:#6c7382;margin-left:3px;font-weight:500}
.wh-ticker__chg{font-size:13px;font-weight:600;margin-left:8px}
.wh-ticker__chg.is-up{color:#2ebd85}
.wh-ticker__chg.is-down{color:#f6465d}
.wh-ticker__note{margin-top:8px;font-size:11px;color:#6c7382;text-align:right}
@media (max-width:767px){.wh-ticker__item{flex-basis:200px}.wh-ticker__note{text-align:left}}


/* ===== 2026-10-03 cards (sections 03/04): raised edge + hover lift ===== */
.wh-tint{background:linear-gradient(180deg,#f7f9fc 0%,#f2f5fa 100%)}
.wh-tint-2{background:linear-gradient(180deg,#eef2f8 0%,#f7f9fc 100%)}
.wh-tile{position:relative;overflow:hidden;background:#fff;border:1px solid #e3e8f0;border-radius:14px;
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 1px 2px rgba(15,23,42,.06),0 10px 24px -14px rgba(15,23,42,.22);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,background .22s ease}
.wh-tile::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,#1d4ed8,#0ea5e9);opacity:0;transition:opacity .22s ease}
.wh-tile:hover{transform:translateY(-4px) scale(1.015);border-color:#bfd3fb;background:linear-gradient(180deg,#ffffff 0%,#f4f8ff 100%);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 2px 4px rgba(15,23,42,.06),0 26px 44px -20px rgba(29,78,216,.38)}
.wh-tile:hover::before{opacity:1}
.wh-badge{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;margin-bottom:14px;
  color:#1d4ed8;background:linear-gradient(180deg,#eef4ff,#dfe9ff);border:1px solid #cfdcfb;box-shadow:0 1px 0 #fff inset}
@media (prefers-reduced-motion:reduce){.wh-tile,.wh-tile:hover{transition:none;transform:none}}
/* ticker note: align with the last card's right edge */
.wh-ticker__note{padding-right:2px}

/* ===== 2026-10-03 sign-in page ===== */
.wh-auth-bg{background:radial-gradient(700px 360px at 80% -5%,rgba(37,99,235,.16),transparent 70%),radial-gradient(600px 300px at 0% 20%,rgba(14,165,233,.10),transparent 70%),linear-gradient(180deg,#f4f7fc 0%,#eef2f8 100%)}
.wh-auth-card{background:#fff;border:1px solid #e3e8f0;border-radius:18px;overflow:hidden;box-shadow:0 1px 0 #fff inset,0 2px 6px rgba(15,23,42,.05),0 30px 60px -30px rgba(15,23,42,.28)}
.wh-auth-banner{height:150px;background:linear-gradient(180deg,#e8f0ff 0%,#f6f9ff 100%);border-bottom:1px solid #eef2f8}
.wh-auth-banner.is-empty{height:8px;background:linear-gradient(90deg,#1d4ed8,#0ea5e9);border:0}
.wh-input{display:block;width:100%;height:44px;padding:0 14px;font-size:14px;color:#0f172a;background:#fff;border:1px solid #d6dce6;border-radius:10px;transition:border-color .15s,box-shadow .15s}
.wh-input::placeholder{color:#a0a9b8}
.wh-input:hover{border-color:#b9c3d3}
.wh-input:focus{outline:none;border-color:#1d4ed8;box-shadow:0 0 0 4px rgba(29,78,216,.12)}
.wh-btn-primary{display:block;width:100%;height:44px;margin-top:8px;border-radius:10px;font-size:14px;font-weight:600;color:#fff;background:linear-gradient(180deg,#2563eb,#1d4ed8);box-shadow:0 1px 0 rgba(255,255,255,.2) inset,0 8px 18px -8px rgba(29,78,216,.6);transition:transform .15s,box-shadow .15s,filter .15s}
.wh-btn-primary:hover{filter:brightness(1.05);box-shadow:0 1px 0 rgba(255,255,255,.2) inset,0 12px 24px -10px rgba(29,78,216,.7)}
.wh-btn-primary:active{transform:translateY(1px)}
.wh-switch{appearance:none;-webkit-appearance:none;width:34px;height:20px;border-radius:999px;background:#d6dce6;position:relative;cursor:pointer;transition:background .15s}
.wh-switch::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform .15s}
.wh-switch:checked{background:#1d4ed8}
.wh-switch:checked::after{transform:translateX(14px)}
.wh-switch:focus-visible{outline:2px solid #93c5fd;outline-offset:2px}
.wh-auth-error{padding:10px 12px;border-radius:10px;font-size:13px;color:#b42318;background:#fef3f2;border:1px solid #fecdca}
.wh-auth-note{padding:10px 12px;border-radius:10px;font-size:13px;color:#1e3a8a;background:#eff6ff;border:1px solid #dbeafe}

/* ===== 2026-10-03 principle icons: colored badge + gentle motion ===== */
.wh-icon{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;border:1px solid transparent;
  box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 8px 18px -10px currentColor;animation:wh-bob 4.5s ease-in-out infinite;transition:transform .25s ease}
.wh-icon svg{transition:transform .35s ease}
.wh-icon--1{color:#1d4ed8;background:linear-gradient(180deg,#eef4ff,#dbe7ff);border-color:#c9d9fb}
.wh-icon--2{color:#047857;background:linear-gradient(180deg,#ecfdf5,#d1fae5);border-color:#bbf0d6;animation-delay:.6s}
.wh-icon--3{color:#b45309;background:linear-gradient(180deg,#fffbeb,#fdecc8);border-color:#f8dfa6;animation-delay:1.2s}
.wh-icon--4{color:#6d28d9;background:linear-gradient(180deg,#f5f3ff,#e9e2ff);border-color:#ddd2fd;animation-delay:1.8s}
div:hover>.wh-icon{transform:translateY(-3px) scale(1.06)}
div:hover>.wh-icon svg{transform:rotate(-8deg) scale(1.08)}
@keyframes wh-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.wh-float{animation:wh-swim 7s ease-in-out infinite}
@keyframes wh-swim{0%,100%{transform:translate(0,0) rotate(0)}50%{transform:translate(6px,-8px) rotate(-1.5deg)}}
@media (prefers-reduced-motion:reduce){.wh-icon,.wh-float{animation:none}}

/* ===== 2026-10-03 round 4 ===== */
/* logo: mark + wordmark (Poppins 700, close to the original wordmark) */
.wh-logo{display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:#0b0f17}
.wh-logo img{height:24px;width:auto}
.wh-logo span{font-family:Poppins,Inter,sans-serif;font-weight:700;font-size:20px;letter-spacing:-.02em;line-height:1}
.wh-logo--light{color:#fff}
/* buttons: same height everywhere, hover = grow + colour shift */
.wh-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:40px;padding:0 16px;border-radius:8px;font-size:13px;font-weight:500;line-height:1;white-space:nowrap;
  transition:transform .18s ease,background-color .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease;will-change:transform}
.wh-btn:hover{transform:translateY(-1px) scale(1.04)}
.wh-btn:active{transform:scale(.98)}
.wh-btn--primary{color:#fff;background:#1d4ed8;box-shadow:0 6px 14px -8px rgba(29,78,216,.6)}
.wh-btn--primary:hover{background:#2563eb;box-shadow:0 10px 20px -10px rgba(37,99,235,.75)}
.wh-btn--dark{height:36px;padding:0 14px;color:#fff;background:#0f172a}
.wh-btn--dark:hover{background:#1d4ed8}
.wh-btn--ghost{color:#334155;background:#fff;border:1px solid #cbd5e1}
.wh-btn--ghost:hover{color:#1d4ed8;border-color:#93b4f5;background:#f0f6ff}
.wh-btn-primary{transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}
.wh-btn-primary:hover{transform:translateY(-1px) scale(1.02);filter:none;background:linear-gradient(180deg,#3b82f6,#2563eb)}
/* alternating section background */
.wh-alt{background:#f5f7fb}
/* principle icons: no idle bob; hover = grow + solid colour */
.wh-icon{animation:none}
.wh-icon,.wh-icon svg{transition:transform .22s ease,background .22s ease,color .22s ease,border-color .22s ease,box-shadow .22s ease}
div:hover>.wh-icon{transform:scale(1.14)}
div:hover>.wh-icon svg{transform:none}
div:hover>.wh-icon--1{color:#fff;background:#1d4ed8;border-color:#1d4ed8;box-shadow:0 10px 22px -10px rgba(29,78,216,.7)}
div:hover>.wh-icon--2{color:#fff;background:#059669;border-color:#059669;box-shadow:0 10px 22px -10px rgba(5,150,105,.7)}
div:hover>.wh-icon--3{color:#fff;background:#d97706;border-color:#d97706;box-shadow:0 10px 22px -10px rgba(217,119,6,.7)}
div:hover>.wh-icon--4{color:#fff;background:#7c3aed;border-color:#7c3aed;box-shadow:0 10px 22px -10px rgba(124,58,237,.7)}
/* hero slideshow (cross-fade) */
.wh-hero-stage{position:relative;aspect-ratio:3/2}
.wh-slide{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity 1.2s ease;user-select:none;pointer-events:none}
.wh-slide.is-on{opacity:1}
.wh-float--slow{animation-duration:9s;animation-delay:-3s}
/* rolling digits */
.wh-num{display:inline-flex;align-items:flex-end}
.wh-d{display:inline-block;height:1.2em;line-height:1.2em;overflow:hidden;vertical-align:bottom}
.wh-s{display:flex;flex-direction:column;transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.wh-s span{display:block;height:1.2em;line-height:1.2em;text-align:center}
.wh-c{display:inline-block;line-height:1.2em}
.wh-ticker__item.flash-up{animation:wh-flash-up 1.2s ease}
.wh-ticker__item.flash-down{animation:wh-flash-down 1.2s ease}
@keyframes wh-flash-up{0%{box-shadow:inset 0 0 0 1px rgba(46,189,133,.7)}100%{box-shadow:inset 0 0 0 1px transparent}}
@keyframes wh-flash-down{0%{box-shadow:inset 0 0 0 1px rgba(246,70,93,.7)}100%{box-shadow:inset 0 0 0 1px transparent}}
@media (prefers-reduced-motion:reduce){.wh-btn,.wh-slide,.wh-s{transition:none}}
