/* =========================================================
   LIGHT PREMIUM UI — 2026-08-22
   Body light, header/footer dark, high-contrast cards.
   ========================================================= */
:root{
  --bg:#f4f7fb;
  --bg2:#eef3f8;
  --panel:#ffffff;
  --panel2:#f7faff;
  --line:#d8e2ec;
  --line2:#c8d5e2;
  --text:#102235;
  --muted:#60758a;
  --muted2:#8294a7;
  --accent:#ff8a1f;
  --accent2:#ffad54;
  --success:#159861;
  --danger:#d94e57;
  --warn:#b77a12;
  --info:#1976d2;
  --shadow:0 18px 50px rgba(28,50,74,.10);
}
html,body{background:#f4f7fb!important;color:var(--text)!important}
body{
  background:
    radial-gradient(circle at 15% 0%,rgba(35,139,255,.08),transparent 30%),
    radial-gradient(circle at 90% 12%,rgba(255,138,31,.07),transparent 28%),
    linear-gradient(180deg,#f8fbfe 0%,#f2f6fa 55%,#edf3f8 100%)!important;
}
main{background:transparent}
a{color:inherit}

/* HEADER / BRAND */
.topbar{
  background:rgba(255,255,255,.96)!important;
  border-bottom:1px solid #dfe8f0!important;
  box-shadow:0 8px 30px rgba(22,49,73,.06);
  backdrop-filter:blur(16px);
}
.topbar-inner{min-height:92px!important}
.nav-main{color:#34495e!important}
.nav-main>a:not(.btn){color:#34495e!important}
.nav-main>a:not(.btn):hover,.nav-ghost:hover{color:#0f6fdc!important}
.nav-ghost{color:#34495e!important}

.brand-premium{
  min-width:390px!important;
  gap:15px!important;
  padding:8px 0!important;
  transform:none!important;
}
.brand-mark{
  width:60px!important;
  height:60px!important;
  flex:0 0 60px!important;
}
.brand-a{
  font-size:56px!important;
  filter:none!important;
}
.brand-cut{background:#fff!important;width:32px!important;top:31px!important;left:16px!important}
.brand-copy strong{
  font-size:27px!important;
  color:#12263b!important;
  letter-spacing:-.8px!important;
}
.brand-copy strong span{color:#1976e9!important}
.brand-copy small{
  margin-top:7px!important;
  font-size:8.6px!important;
  letter-spacing:1.45px!important;
  color:#6b8196!important;
  font-weight:900!important;
}

/* HERO */
.hero-wrap{
  padding:58px 0 48px!important;
  border-bottom:1px solid #dde7f0!important;
  background:linear-gradient(180deg,#fbfdff 0%,#f2f7fb 100%)!important;
}
.hero-copy h1{color:#102235!important}
.hero-copy h1 span{color:#1976e9!important}
.hero-lead{color:#526b82!important}
.eyebrow,.section-kicker,.console-label{color:#51708d!important}
.live-dot{background:#18a86b!important}

.hero-console{
  background:linear-gradient(145deg,#10283f,#0d1f33)!important;
  border-color:#264965!important;
  box-shadow:0 24px 70px rgba(24,54,83,.18)!important;
  color:#f5f9fc!important;
}
.hero-console a{color:inherit}
.console-top{border-bottom-color:#27435a!important}
.console-feed .feed-row{border-color:#203a50!important}

/* HERO SEARCH — force one clean component */
.hero-search-premium{
  width:100%!important;
  max-width:780px!important;
  margin-top:26px!important;
}
.hero-search-box{
  height:72px!important;
  display:grid!important;
  grid-template-columns:52px minmax(0,1fr) 160px!important;
  align-items:center!important;
  gap:0!important;
  padding:7px!important;
  background:#fff!important;
  border:1.5px solid #cbd9e6!important;
  border-radius:18px!important;
  box-shadow:0 14px 40px rgba(37,72,103,.10)!important;
}
.hero-search-box:focus-within{
  border-color:#388ee8!important;
  box-shadow:0 0 0 4px rgba(56,142,232,.10),0 16px 42px rgba(37,72,103,.12)!important;
}
.hero-search-box .search-icon{
  position:static!important;
  transform:none!important;
  width:auto!important;
  color:#4385c7!important;
  font-size:26px!important;
  text-align:center!important;
}
.hero-search-box input{
  height:56px!important;
  width:100%!important;
  min-width:0!important;
  padding:0 14px!important;
  margin:0!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  color:#102235!important;
  font-size:17px!important;
  font-weight:700!important;
  box-shadow:none!important;
}
.hero-search-box input::placeholder{color:#8a9bad!important;font-weight:600!important}
.hero-search-button{
  height:56px!important;
  border-radius:12px!important;
  background:linear-gradient(135deg,#ffad42,#ff841d)!important;
  color:#17212b!important;
  box-shadow:0 10px 24px rgba(255,132,29,.18)!important;
}
.hero-search-foot{
  padding:12px 4px 0!important;
  color:#60758a!important;
  font-size:12px!important;
}
.hero-search-foot b{
  background:#fff!important;
  color:#24527c!important;
  border-color:#cbd9e6!important;
}
.hero-search-foot em{color:#6b8196!important}

/* GENERAL CARDS / STRIPS / MARKET */
.platform-strip,
.today-drop-card,
.today-empty,
.domain-table,
.lifecycle-grid,
.knowledge-card,
.user-card,
.av2-card,
.av2-provider,
.av2-table,
.av2-stats>div{
  background:#fff!important;
  border-color:#d8e2ec!important;
  box-shadow:0 12px 36px rgba(25,52,78,.06)!important;
}
.platform-strip{color:#21384e!important}
.platform-strip small,
.section-title-row p,
.market p,
.lifecycle-copy p,
.knowledge-card p{color:#667c90!important}
.strip-icon{background:#f1f6fb!important;border-color:#d2dfea!important;color:#ff8a1f!important}

.market,.today-drop-section,.lifecycle-section,.knowledge-section{color:#102235!important}
.status-tabs a,.radar-tabs a{
  background:#fff!important;
  color:#405b72!important;
  border-color:#ccd9e5!important;
}
.status-tabs a.active,.radar-tabs a.active{
  color:#0e5fae!important;
  border-color:#338fe9!important;
  background:#eaf4ff!important;
}
.domain-row,.domain-table-row{border-color:#e3eaf1!important}
.domain-table a,.today-drop-card a{color:#102235!important}
.outline-link,.back-link{color:#156ec7!important}

/* LIGHT BUTTONS / BADGES */
.btn.secondary,.ghost{
  background:#f4f8fc!important;
  color:#23425e!important;
  border-color:#cad8e4!important;
}
.badge{background:#f3f7fb!important;border-color:#cbd9e5!important;color:#34536e!important}

/* SEARCH RESULTS — no overlap, clear white cards */
.search-clean-page{color:#102235!important}
.search-clean-head p{color:#61788e!important}
.search-clean-input{
  background:#fff!important;
  border-color:#cbd9e6!important;
  box-shadow:0 14px 40px rgba(37,72,103,.08)!important;
}
.search-clean-input input{
  color:#102235!important;
  background:transparent!important;
}
.search-clean-icon{color:#388ee8!important}
.search-clean-hints{color:#60758a!important}
.search-clean-hints b{
  background:#fff!important;
  border-color:#cbd9e6!important;
  color:#24527c!important;
}
.search-clean-card{
  background:#fff!important;
  border-color:#d7e2eb!important;
  color:#102235!important;
  box-shadow:0 16px 42px rgba(28,53,77,.08)!important;
}
.search-clean-card.is-backorder{border-color:#f2b16f!important}
.search-clean-top{border-bottom-color:#e3ebf2!important}
.search-clean-top small,.search-clean-body p{color:#657b8f!important}
.search-clean-status{
  background:#f2f7fb!important;
  border-color:#cddbe6!important;
  color:#405a72!important;
}
.status-redemption_period,.status-pending_delete{
  background:#fff5e8!important;
  border-color:#f4c486!important;
  color:#a35c09!important;
}
.status-available{
  background:#eaf8f1!important;
  border-color:#a8dfc6!important;
  color:#147a4d!important;
}
.search-clean-epp a{
  background:#f6f9fc!important;
  border-color:#d1dde8!important;
  color:#49657d!important;
}

/* CUSTOMER / ADMIN PANELS light */
.user-side,.av2-side{
  background:#fff!important;
  border-color:#d7e2eb!important;
  box-shadow:0 12px 36px rgba(25,52,78,.06)!important;
}
.user-side a,.av2-side a{color:#38546d!important}
.user-side a:hover,.av2-side a:hover{background:#edf5fc!important;color:#0f6fdc!important}
.user-side-head,.user-list-row,.av2-row{border-color:#e1e9f0!important}
.user-list-row,.av2-row:not(.av2-th){background:#fff!important}
.user-list-head,.av2-th{background:#f5f8fb!important;color:#617a90!important}
.user-page-head p,.av2-head p{color:#667c90!important}

/* FOOTER */
.site-footer,footer{
  background:#102235!important;
  color:#dce6ef!important;
  border-top-color:#1f3b53!important;
}

/* MOBILE LOGO — centered, larger, fully readable */
@media(max-width:980px){
  .topbar-inner{
    min-height:96px!important;
    justify-content:center!important;
    padding-left:12px!important;
    padding-right:12px!important;
  }
  .brand-premium{
    min-width:0!important;
    width:100%!important;
    max-width:390px!important;
    justify-content:center!important;
    gap:12px!important;
    margin:0 auto!important;
  }
  .brand-mark{
    width:56px!important;
    height:56px!important;
    flex-basis:56px!important;
  }
  .brand-a{font-size:52px!important}
  .brand-copy{min-width:0!important}
  .brand-copy strong{
    font-size:23px!important;
    line-height:1!important;
    letter-spacing:-.65px!important;
  }
  .brand-copy small{
    font-size:7.6px!important;
    letter-spacing:1.15px!important;
    margin-top:6px!important;
  }
  .nav-main{display:none!important}
  .hero-wrap{padding-top:34px!important}
}
@media(max-width:620px){
  .shell{width:min(var(--shell),calc(100% - 24px))!important}
  .brand-premium{max-width:360px!important}
  .brand-mark{width:50px!important;height:50px!important;flex-basis:50px!important}
  .brand-a{font-size:47px!important}
  .brand-copy strong{font-size:21px!important}
  .brand-copy small{font-size:6.8px!important;letter-spacing:.95px!important}

  .hero-search-box{
    height:auto!important;
    display:grid!important;
    grid-template-columns:42px minmax(0,1fr)!important;
    padding:8px!important;
  }
  .hero-search-box input{
    height:54px!important;
    padding:0 8px!important;
    font-size:16px!important;
  }
  .hero-search-button{
    grid-column:1/-1!important;
    width:100%!important;
    height:52px!important;
    margin-top:5px!important;
  }
  .hero-search-foot{
    display:grid!important;
    grid-template-columns:auto auto auto!important;
    gap:7px!important;
  }
  .hero-search-foot>span{grid-column:1/-1!important}
  .hero-search-foot em{grid-column:1/-1!important;margin:0!important}

  .search-clean-input{
    display:grid!important;
    grid-template-columns:42px minmax(0,1fr)!important;
    padding:8px!important;
  }
  .search-clean-input input{height:54px!important}
  .search-clean-input button{
    grid-column:1/-1!important;
    width:100%!important;
    height:52px!important;
    margin-top:5px!important;
  }
}
@media(max-width:390px){
  .brand-premium{gap:9px!important}
  .brand-mark{width:45px!important;height:45px!important;flex-basis:45px!important}
  .brand-a{font-size:42px!important}
  .brand-copy strong{font-size:19px!important}
  .brand-copy small{font-size:6.1px!important;letter-spacing:.75px!important}
}