/* Homepage composition. IDs of scanner controls are preserved for app.js. */
.scanner-home { background: radial-gradient(ellipse at 85% 10%, #25203d 0, transparent 38%), #0e1017; }
.report-view #heroSection { display: none !important; }
.report-return { display: flex; justify-content: space-between; gap: 16px; padding: 20px 0; font-size: 14px; }
.report-return a { color: #c3b9ff; min-height: 44px; display: inline-flex; align-items: center; }
.report-view #tabsBar { position: sticky; top: 0; z-index: 50; background: #171b26; border: 1px solid #343a4b; border-radius: 12px; display: flex; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; padding: 8px; gap: 6px; }
.report-view #tabsBar .tab { flex: 0 0 auto; min-height: 44px; border-radius: 8px; }
.report-view #tabsBar .tab.active { background: #3b305f; color: #e4ddff; }
.scanner-home > .container { max-width: 1280px !important; padding: 0 36px !important; margin: 0 auto !important; }
.scanner-home .header-inner {
  justify-content: space-between !important; min-height: 88px !important;
  padding: 20px 0 !important; border-bottom: 1px solid #303040;
}
.scanner-home .header-inner .logo-text {
  display: inline-flex; align-items: center;
  width: auto !important;
  font-size: 25px !important; line-height: 1.2 !important;
  letter-spacing: -.8px !important; text-transform: none !important;
  text-align: left !important; color: #f4f2ff !important;
  background: none !important; -webkit-text-fill-color: currentColor !important;
  background-clip: border-box !important;
}
.scanner-home .header-lang-wrapper {
  position: static !important; transform: none !important; margin: 0 !important;
  width: auto !important; flex-wrap: nowrap;
}
.scanner-home .header-auth-link {
  display: inline-flex; align-items: center; font-size: 13px;
  padding: 10px 16px; border-radius: 10px;
}
#heroSection {
  display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  column-gap: clamp(28px, 5vw, 72px); row-gap: 0;
  max-width: none !important; margin: 0 !important; padding: 64px 0 24px !important;
  text-align: left !important; align-items: start;
}
#heroSection > .hero-subtitle {
  display: block !important; grid-column: 1; grid-row: 1;
  margin: 0 0 20px !important; padding: 0 !important;
  background: none !important; border: none !important; border-radius: 0 !important;
  color: #bcb0ff !important; font-size: 12px !important; font-weight: 700 !important;
  text-transform: uppercase !important; letter-spacing: .1em !important;
  line-height: 1.7 !important; white-space: normal !important;
  max-width: none !important; min-height: 0 !important;
}
#heroSection > .hero-title {
  grid-column: 1; grid-row: 2; margin: 0 0 24px !important; max-width: 16ch !important;
  font-size: clamp(36px, 4.2vw, 57px) !important; font-weight: 750 !important;
  letter-spacing: -.045em !important; line-height: 1.09 !important;
  background: none !important; color: #f6f3ff !important;
  -webkit-text-fill-color: currentColor !important;
  text-align: left !important; text-wrap: balance; min-height: 0 !important;
}
#heroSection > .hero-cta {
  grid-column: 1; grid-row: 3; margin: 0 0 28px !important;
  max-width: 47ch !important; font-size: 17px !important; line-height: 1.7 !important;
  color: #aeb5c8 !important; font-weight: 400 !important; text-align: left !important;
  min-height: 0 !important;
}
#heroSection > .hero-search-section {
  grid-column: 2; grid-row: 1 / span 4; width: 100%; margin: 0 !important;
  padding: 28px !important; border: 1px solid #48415e; border-radius: 20px;
  background: linear-gradient(160deg, #232334, #181c28);
  box-shadow: 0 20px 60px #0003; min-width: 0;
}
#heroSection .hero-search-box {
  display: flex !important; flex-direction: column !important; gap: 14px !important;
  max-width: none !important; margin: 0 !important;
}
#heroSection .hero-search-box > .absolute { display: none; }
#heroSection label[for="urlInput"] {
  position: static; width: auto; height: auto; padding: 0; margin: 0 0 4px;
  overflow: visible; clip: auto; white-space: normal;
  font-size: 18px; font-weight: 650; color: #f4f2ff; line-height: 1.4;
}
#heroSection #urlInput {
  width: 100% !important; min-height: 58px !important; padding: 16px !important;
  border: 1px solid #505167 !important; border-radius: 10px !important;
  background: #10141f !important; color: #f4f2ff !important;
  font-size: 16px !important; box-shadow: none !important;
}
#heroSection .scan-action-row, #heroSection #scanBtn { width: 100%; }
#heroSection #scanBtn {
  min-height: 54px; padding: 14px 20px !important; border-radius: 10px !important;
  background: #7562e8 !important; box-shadow: none !important;
  font-size: 16px !important; transform: none !important;
}
#heroSection #scanBtn:hover { background: #8876f2 !important; }
#heroSection #accountScanPanel {
  display: flex !important; flex-wrap: wrap; justify-content: flex-start;
  gap: 10px; margin: 24px 0 0 !important; padding: 20px 0 0 !important;
  border: 0 !important; border-top: 1px solid #3b3d50 !important;
  border-radius: 0 !important; max-width: none !important; min-height: 0 !important;
  background: none !important; text-align: left !important;
}
#heroSection .login-nudge-icon { display: none; }
#heroSection .login-nudge-text { flex: 1 1 100%; font-size: 12px; line-height: 1.65; color: #adb3c7; }
#heroSection .login-nudge-cta, #heroSection .login-nudge-login {
  padding: 8px 12px !important; min-height: 40px !important; font-size: 12px !important;
  background: transparent !important; color: #c8bfff !important;
  border: 1px solid #535068 !important; border-radius: 8px !important;
  box-shadow: none !important;
}
#heroSection > .home-tools-section {
  grid-column: 1; grid-row: 4; margin: 0 0 30px !important;
  padding: 0 !important; text-align: left !important;
}
#heroSection .home-tools-title, #heroSection .home-tools-subtitle { display: none !important; }
#heroSection .home-tools-list {
  justify-content: flex-start !important; gap: 10px !important;
  min-height: 0 !important; align-items: center !important;
}
#heroSection .home-tools-chip {
  font-size: 12px !important; border-radius: 8px !important;
  padding: 10px 14px !important; background: #171b26 !important;
  border-color: #3a4050 !important; min-height: 0 !important;
}
#heroSection > .hero-desc {
  grid-column: 1 / -1; margin: 48px 0 24px !important; padding-top: 28px !important;
  border-top: 1px solid #303040 !important; max-width: none !important;
  font-size: 15px !important; line-height: 1.75 !important;
  color: #aeb5c8 !important; text-align: left !important; min-height: 0 !important;
}
#heroSection > .hero-features { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
#heroSection .hero-feature { padding: 20px !important; border-radius: 12px !important; background: #171b26 !important; border-color: #303646 !important; box-shadow: none !important; transform: none !important; }
#heroSection .hero-feature > .absolute { display: none; }
#heroSection .hero-feature strong { font-size: 14px; }
#heroSection .hero-feature span.block { font-size: 13px; line-height: 1.65; }
#heroSection .hero-icon {
  display: block; width: 24px; height: 24px; flex: 0 0 24px;
  margin-top: 2px; fill: none; stroke: currentColor; color: #c9cfdd;
  stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round;
}
.scanner-home .hub-body-copy, .scanner-home .audit-guide { grid-column: 1 / -1; width: 100%; max-width: none; }
#heroSection > .audit-guide { margin: 28px 0 0; }
#heroSection .audit-guide-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#heroSection .audit-guide h2 { font-size: 26px; font-weight: 700; }
#heroSection .audit-guide h3 { font-weight: 650; }
@media (max-width: 800px) {
  .scanner-home > .container { padding: 0 20px; }
  #heroSection { grid-template-columns: minmax(0, 1fr); padding-top: 36px !important; }
  #heroSection > .hero-subtitle, #heroSection > .hero-title, #heroSection > .hero-cta,
  #heroSection > .hero-search-section, #heroSection > .home-tools-section { grid-column: 1; grid-row: auto; }
  #heroSection > .hero-title { font-size: clamp(34px, 7vw, 48px) !important; max-width: 22ch; }
  #heroSection > .hero-search-section { padding: 22px !important; margin-bottom: 20px !important; }
  #heroSection > .hero-features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #heroSection > .hero-desc { margin-top: 12px !important; }
  #heroSection .audit-guide-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .report-view #statsGrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .report-view .toolbar { flex-wrap: wrap; gap: 8px; }
  .report-view #main-content .tab-content { padding: 12px 0; }
  .scanner-home > .container { padding: 0 16px; }
  .scanner-home .header-inner { min-height: 76px !important; gap: 10px; flex-wrap: wrap; }
  .scanner-home .header-inner { flex-direction: row !important; flex-wrap: nowrap; }
  .scanner-home .product-brand { gap: 7px; }
  .scanner-home .product-brand img { width: 28px; height: 28px; }
  .scanner-home .header-inner .logo-text { font-size: 20px !important; }
  .scanner-home .header-auth-link { font-size: 11px; padding: 8px; }
  .scanner-home .header-lang-wrapper { gap: 6px !important; }
  .scanner-home .lang-trigger { padding: 8px; }
  #heroSection > .hero-features { grid-template-columns: 1fr; }
}
