/* HADAFIN Phase 25a — Homepage Figma-level polish (Round 2)
   Selective glass · brand SVGs · Tabler icon unity · Phase 24a type rhythm
   Scope: homepage (.home-mp--premium) only. No rainbow. Performance-aware blur. */

.home-mp--premium {
  --hp-glass-bg: rgba(255, 255, 255, 0.72);
  --hp-glass-border: rgba(255, 255, 255, 0.45);
  --hp-glass-border-dark: rgba(255, 255, 255, 0.18);
  --hp-glass-shadow: 0 12px 40px rgba(11, 31, 58, 0.14);
}

/* —— 1. Glass morphism — ONLY hero AI bubble, search, featured cards —— */
.home-mp--premium .home-mp-ai-bubble.hp-glass,
.home-mp--premium .hp-search.hp-glass,
.home-mp--premium .home-mp-card--featured.hp-glass {
  background: var(--hp-glass-bg);
  border: 1px solid var(--hp-glass-border);
  box-shadow: var(--hp-glass-shadow);
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .home-mp--premium .home-mp-ai-bubble.hp-glass {
    background: rgba(255, 255, 255, 0.78);
    -webkit-backdrop-filter: blur(14px) saturate(1.15);
    backdrop-filter: blur(14px) saturate(1.15);
    border-color: rgba(255, 255, 255, 0.55);
  }
  .home-mp--premium .hp-search.hp-glass {
    background: rgba(255, 255, 255, 0.82);
    -webkit-backdrop-filter: blur(12px) saturate(1.1);
    backdrop-filter: blur(12px) saturate(1.1);
    border-color: rgba(226, 232, 240, 0.75);
  }
  .home-mp--premium .home-mp-card--featured.hp-glass {
    background: rgba(255, 255, 255, 0.88);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(226, 232, 240, 0.85);
  }
}

/* Soft glass edge on featured card body only (thumb stays opaque) */
.home-mp--premium .home-mp-card--featured.hp-glass .body {
  background: rgba(255, 255, 255, 0.92);
  border-top: 1px solid rgba(226, 232, 240, 0.7);
}

@media (prefers-reduced-transparency: reduce) {
  .home-mp--premium .home-mp-ai-bubble.hp-glass,
  .home-mp--premium .hp-search.hp-glass,
  .home-mp--premium .home-mp-card--featured.hp-glass {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    background: #fff !important;
  }
}

/* —— 2. Typography rhythm (Phase 24a spacing tokens) —— */
.home-mp--premium .home-mp-brand-mark {
  margin: 0 0 var(--hf-space-3, 12px) !important;
}
.home-mp--premium .home-mp-hero--split h1 {
  margin: 0 0 var(--hf-space-3, 12px) !important;
}
.home-mp--premium .home-mp-hero--split .tagline {
  margin: 0 0 var(--hf-space-5, 24px) !important;
}
.home-mp--premium .home-mp-cta-row {
  gap: var(--hf-space-3, 12px) !important;
}
.home-mp--premium .home-mp-section {
  padding-top: var(--hf-space-6, 32px) !important;
  padding-bottom: var(--hf-space-4, 16px) !important;
}
.home-mp--premium .home-mp-section-head {
  margin-bottom: var(--hf-space-4, 16px) !important;
  gap: var(--hf-space-3, 12px);
}
.home-mp--premium .home-mp-section-head h2,
.home-mp--premium .home-mp-section > h2 {
  margin: 0 0 var(--hf-space-2, 8px) !important;
  letter-spacing: -0.022em;
}
.home-mp--premium .hp-kicker {
  margin: 0 0 var(--hf-space-2, 8px) !important;
}
.home-mp--premium .hp-split-panel h2 {
  margin: 0 0 var(--hf-space-3, 12px) !important;
}
.home-mp--premium .hp-lead {
  margin: 0 0 var(--hf-space-5, 24px) !important;
  line-height: var(--hf-line-height-body, 1.5);
  color: var(--hp-muted, #5b6578);
}
.home-mp--premium .home-mp-why-item h3 {
  margin: var(--hf-space-3, 12px) 0 var(--hf-space-2, 8px) !important;
}
.home-mp--premium .home-mp-why-item p {
  margin: 0;
  line-height: var(--hf-line-height-body, 1.5);
}
.home-mp--premium .hp-muted {
  margin: calc(var(--hf-space-2, 8px) * -1) 0 var(--hf-space-3, 12px) !important;
}
.home-mp--premium .home-mp-card .body .title {
  margin-bottom: var(--hf-space-1, 4px);
  line-height: 1.35;
}
.home-mp--premium .home-mp-card .body .meta {
  line-height: var(--hf-line-height-caption, 1.4);
}

/* —— 3. Brand SVG illustrations —— */
.home-mp--premium .home-mp-hero--split {
  position: relative;
  overflow: hidden;
  /* Phase 29g — cap vertical hero length (SVG must not expand the box) */
  min-height: min(48vh, 420px) !important;
  max-height: 460px;
  height: auto;
}
.hp-hero-illust {
  position: absolute;
  right: 4%;
  bottom: 8%;
  width: min(220px, 38vw);
  max-height: 160px;
  height: auto;
  pointer-events: none;
  z-index: 1;
  opacity: 0.92;
  overflow: hidden;
}
@media (max-width: 900px) {
  .hp-hero-illust {
    display: none;
  }
}

.hp-empty-illust {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-width: 200px;
  max-width: 240px;
  text-decoration: none;
  color: inherit;
  border-radius: var(--hf-radius-lg, 16px);
  border: 1px solid var(--hp-line, #e8edf5);
  background: linear-gradient(165deg, #f8fafc 0%, #fff 55%, #f0fdfa 100%);
  overflow: hidden;
  box-shadow: var(--hf-shadow-sm, 0 1px 2px rgba(15, 23, 42, 0.06));
  transition: transform 0.22s ease, box-shadow 0.22s ease;
}
.hp-empty-illust:hover {
  transform: translateY(-3px);
  box-shadow: var(--hf-shadow-md, 0 8px 24px rgba(15, 23, 42, 0.12));
}
.hp-empty-illust__art {
  display: block;
  width: 100%;
  height: 132px;
  background: linear-gradient(145deg, #0b1f3a 0%, #134e4a 55%, #0d9488 100%);
}
.hp-empty-illust__art svg {
  width: 100%;
  height: 100%;
  display: block;
}
.hp-empty-illust__body {
  padding: var(--hf-space-3, 12px) var(--hf-space-4, 16px) var(--hf-space-4, 16px);
}
.hp-empty-illust__body .title {
  font-weight: 700;
  font-size: 0.88rem;
  letter-spacing: -0.015em;
  color: var(--hp-ink, #0c1222);
  margin-bottom: var(--hf-space-1, 4px);
}
.hp-empty-illust__body .meta {
  font-size: 0.75rem;
  color: var(--hp-muted, #5b6578);
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

/* Icon unity — single size/weight for topcat + why icons */
.home-mp--premium .home-mp-topcat i.ti,
.home-mp--premium .home-mp-why-ico i.ti,
.home-mp--premium .hp-biz > i.ti,
.home-mp--premium .home-mp-metric-ico i.ti {
  font-size: 1.25rem;
  line-height: 1;
  color: #0d9488;
}
.home-mp--premium .home-mp-metric-ico i.ti {
  color: #0b1f3a;
}

/* Phase 29g+ — nav cards band at bottom; contrast polish */
.hp-nav-cards-band {
  padding-top: 2rem !important;
  padding-bottom: 0.5rem !important;
  border-top: 1px solid #e2e8f0;
  margin-top: 0.75rem;
}
.hp-nav-cards-stack {
  display: grid;
  gap: 1rem;
}
.home-mp--premium .home-mp-ai-msg {
  color: #334155 !important; /* stronger than #3d4659 on white bubble */
}
.home-mp--premium .home-mp-ai-ask {
  background: #0b1f3a;
  color: #fff;
  font-weight: 700;
}
.home-mp--premium .hp-search-go {
  background: #0b1f3a;
  color: #fff;
  font-weight: 800;
}
.home-mp--premium .hp-search-ai {
  background: #0d9488;
  color: #fff;
  font-weight: 800;
}
.home-mp--premium .hp-chip {
  color: #0f172a;
  border-color: #cbd5e1;
  background: #fff;
}
.home-mp--premium .hp-suggest-label {
  color: #475569;
  font-weight: 700;
}
