/* HiddenHelp product polish v3
   Goal: make the working live model feel more finished without replacing working logic.
   Scope: design-system polish + core journey/dashboard styling. No JS dependency. */

:root{
  --hh-v3-ink:#17121c;
  --hh-v3-muted:#665b70;
  --hh-v3-soft:#8e8296;
  --hh-v3-purple:#eaa7ff;
  --hh-v3-purple-deep:#9b74b6;
  --hh-v3-purple-soft:#faeefe;
  --hh-v3-purple-line:#efcffb;
  --hh-v3-blue:#9fd7ff;
  --hh-v3-blue-strong:#40a9ff;
  --hh-v3-blue-soft:#edf8ff;
  --hh-v3-mint:#e8fff5;
  --hh-v3-mint-strong:#bdf3d7;
  --hh-v3-peach:#fff1e8;
  --hh-v3-yellow:#fff8d8;
  --hh-v3-card:#fff;
  --hh-v3-panel:rgba(255,255,255,.96);
  --hh-v3-line:rgba(126,87,139,.17);
  --hh-v3-shadow:0 18px 46px rgba(126,87,139,.10);
  --hh-v3-shadow-small:0 8px 22px rgba(126,87,139,.075);
  --hh-v3-radius-xl:34px;
  --hh-v3-radius-lg:26px;
  --hh-v3-radius-md:20px;
  --hh-v3-gap:clamp(12px,2vw,18px);
}

/* More finished page rhythm */
body{background:
  radial-gradient(circle at 7% 4%,rgba(234,167,255,.18),transparent 31%),
  radial-gradient(circle at 95% 8%,rgba(159,215,255,.18),transparent 28%),
  linear-gradient(180deg,#fffaff 0%,#f8fbff 46%,#fff8fd 100%)!important;
}
.site{max-width:1180px!important;}
main{display:block!important;}
section{scroll-margin-top:22px!important;}

/* Core HiddenHelp experience blocks added by this pass */
.hh-core-journey,
.hh-dashboard-overview,
.hh-bill-flow-card,
.hh-page-polish-strip{
  background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(250,238,254,.78))!important;
  border:2px solid var(--hh-v3-purple-line)!important;
  border-radius:var(--hh-v3-radius-xl)!important;
  box-shadow:var(--hh-v3-shadow)!important;
  padding:clamp(17px,3vw,30px)!important;
  margin:clamp(14px,2.2vw,22px) 0!important;
  overflow:hidden!important;
  position:relative!important;
}
.hh-core-journey::before,
.hh-dashboard-overview::before,
.hh-bill-flow-card::before{
  content:"";position:absolute;inset:0 0 auto 0;height:7px;background:linear-gradient(90deg,var(--hh-v3-purple),var(--hh-v3-blue),var(--hh-v3-mint-strong));
}
.hh-core-journey h2,
.hh-dashboard-overview h2,
.hh-bill-flow-card h2{font-size:clamp(1.35rem,3vw,2.2rem)!important;margin:0 0 8px!important;color:var(--hh-v3-ink)!important;}
.hh-core-journey p,
.hh-dashboard-overview p,
.hh-bill-flow-card p{max-width:72ch!important;margin:0!important;color:var(--hh-v3-muted)!important;}
.hh-journey-steps,
.hh-dashboard-cards,
.hh-bill-flow-grid{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:var(--hh-v3-gap)!important;
  margin-top:clamp(14px,2vw,20px)!important;
}
.hh-journey-step,
.hh-dashboard-mini,
.hh-bill-flow-mini{
  background:rgba(255,255,255,.94)!important;
  border:2px solid rgba(126,87,139,.13)!important;
  border-radius:var(--hh-v3-radius-lg)!important;
  padding:clamp(15px,2vw,20px)!important;
  box-shadow:var(--hh-v3-shadow-small)!important;
  min-width:0!important;
}
.hh-journey-step span,
.hh-dashboard-mini span,
.hh-bill-flow-mini span{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  min-width:34px!important;height:34px!important;padding:0 10px!important;margin-bottom:9px!important;
  border-radius:999px!important;background:var(--hh-v3-purple-soft)!important;color:var(--hh-v3-purple-deep)!important;
  font-weight:950!important;font-size:.86rem!important;
}
.hh-journey-step strong,
.hh-dashboard-mini strong,
.hh-bill-flow-mini strong{display:block!important;font-size:1.08rem!important;line-height:1.16!important;color:var(--hh-v3-ink)!important;letter-spacing:-.025em!important;margin-bottom:5px!important;}
.hh-journey-step small,
.hh-dashboard-mini small,
.hh-bill-flow-mini small{display:block!important;color:var(--hh-v3-soft)!important;font-weight:760!important;line-height:1.38!important;}
.hh-core-cta-row{display:flex!important;flex-wrap:wrap!important;gap:10px!important;margin-top:16px!important;}
.hh-core-cta-row a,.hh-core-cta-row button{flex:1 1 210px!important;}

/* Make the homepage feel like Support Radar without breaking the existing finder */
body:has(#finder) .hero .panel,
body:has(#home) .hero .panel{position:relative!important;}
body:has(#finder) .hero .panel::after,
body:has(#home) .hero .panel::after{
  content:"Support Radar";display:inline-flex;align-items:center;justify-content:center;
  position:absolute;right:18px;top:18px;padding:8px 12px;border-radius:999px;
  background:var(--hh-v3-blue-soft);border:1px solid rgba(64,169,255,.22);color:#386783;font-weight:950;font-size:.78rem;
}
.progress{height:auto!important;background:#fff!important;border-color:var(--hh-v3-purple-line)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.6)!important;}
.bar{background:linear-gradient(90deg,var(--hh-v3-purple),var(--hh-v3-blue-strong))!important;}
.step.active,.results.show{animation:hhFadeIn .18s ease-out both;}
@keyframes hhFadeIn{from{opacity:.65;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){.step.active,.results.show{animation:none!important}}

/* Cards: a more finished, consistent product feel */
.card,.tile,.result-card,.guide-card,.saving-card,.support-card,.dashboard-card,.bill-card,.local-card,.activity-card,.provider-card,.hh-v33-guide-card,.hh-v34-saving-card{
  border-width:2px!important;
  border-color:rgba(126,87,139,.14)!important;
  box-shadow:var(--hh-v3-shadow-small)!important;
}
.card:hover,.tile:hover,.guide-card:hover,.saving-card:hover,.support-card:hover,.local-card:hover,.activity-card:hover,.hh-v33-guide-card:hover,.hh-v34-saving-card:hover{
  transform:translateY(-1px)!important;
  border-color:rgba(155,116,182,.32)!important;
}
.card p,.tile p,.guide-card p,.saving-card p,.support-card p,.dashboard-card p,.bill-card p,.local-card p,.activity-card p{font-weight:720!important;line-height:1.45!important;}
.card strong,.tile strong{line-height:1.12!important;}

/* Better laptop/Chromebook density */
@media (min-width:760px){
  .hh-journey-steps{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
  .hh-dashboard-cards,.hh-bill-flow-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
  .hero{align-items:stretch!important;}
  .tiles{align-content:stretch!important;}
  .tiles > *{height:100%!important;}
  .guide-grid,.savings-grid,.support-grid,.dashboard-grid,.result-grid,.localgrid,.activity-grid,.provider-grid,.bill-grid,.cards,.grid{grid-auto-rows:auto!important;}
}
@media (min-width:900px) and (max-width:1366px){
  h1{font-size:clamp(2.8rem,4.9vw,4.15rem)!important;}
  h2{font-size:clamp(1.6rem,3vw,2.35rem)!important;}
  .hero{grid-template-columns:minmax(0,1.08fr) minmax(300px,.92fr)!important;}
  .panel,.tool,.quick-panel,.faq,.seo-panel,.start-panel,.checker,.results-block{padding:clamp(22px,2.2vw,30px)!important;}
}

/* Mobile polish: less huge, more app-like */
@media (max-width:720px){
  body:has(#finder) .hero .panel::after,
  body:has(#home) .hero .panel::after{position:static!important;margin-top:12px!important;width:max-content!important;max-width:100%!important;}
  .hh-core-journey,.hh-dashboard-overview,.hh-bill-flow-card{border-radius:24px!important;padding:17px 14px!important;}
  .hh-journey-step,.hh-dashboard-mini,.hh-bill-flow-mini{border-radius:20px!important;padding:14px!important;}
  .hh-core-cta-row{display:grid!important;grid-template-columns:1fr!important;}
  .hh-core-cta-row a,.hh-core-cta-row button{width:100%!important;min-width:0!important;}
  .hero{gap:12px!important;}
  .tiles,.trust,.start-grid,.choice-grid,.result-grid,.localgrid,.guide-grid,.savings-grid,.activity-grid,.provider-grid,.bill-grid,.cards,.grid{gap:10px!important;}
  h1{font-size:clamp(2.15rem,10vw,3.05rem)!important;}
}

/* Filters and chips: more consistent and not oversized */
.filters,.filter-row,.filterbar,.filter-bar,.guide-filters,.quick-filters,.provider-chips,.category-row,.chips,.chip-row,.badge-row{
  align-items:center!important;align-content:flex-start!important;
}
.filter-chip,.chip,.tag,.badge,.pill,.status,.label,.guide-filter,.provider-chip,.category-chip{
  white-space:normal!important;text-wrap:balance!important;line-height:1.12!important;
}

/* Bill tracker refinements: form and rows feel calmer */
#tool .monthPanel,#tool .totals,#tool .billList,#tool .bill-row,.billRow,.bill-card{
  border-radius:var(--hh-v3-radius-lg)!important;
}
#tool input,#tool select,#tool textarea{font-size:1rem!important;}
#tool .btn,#tool button{white-space:normal!important;}

/* Support plan dashboard refinements */
body:has(#supportPlanApp) .card,
body:has(#support-plan) .card,
body:has([data-support-plan]) .card{border-color:rgba(126,87,139,.15)!important;}
.empty-state,.empty-plan{background:linear-gradient(135deg,#fff,#f8fbff)!important;}

/* Wide content safety across content pages */
img,svg,video,canvas,iframe{max-width:100%!important;}
table{max-width:100%!important;}
pre,code{white-space:pre-wrap!important;overflow-wrap:anywhere!important;}

/* Print: protect the useful pack feel */
@media print{
  .hh-core-journey,.hh-dashboard-overview,.hh-bill-flow-card{box-shadow:none!important;border:1px solid #ccc!important;break-inside:avoid!important;}
  .hh-core-cta-row,.sharebar,.accessbar,.hh-mobile-menu{display:none!important;}
}


/* HiddenHelp v5 information hierarchy fix
   Fixes compressed labels like SavedSupport routesUseful routes and simplifies the core journey copy. */
.hh-section-kicker{
  display:inline-flex!important;
  align-items:center!important;
  width:max-content!important;
  max-width:100%!important;
  padding:7px 11px!important;
  margin:0 0 10px!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,#faeafe,#eef8ff)!important;
  border:1px solid rgba(155,116,182,.18)!important;
  color:#7d5a94!important;
  font-size:.78rem!important;
  font-weight:950!important;
  letter-spacing:.01em!important;
}
.hh-journey-clean,
.hh-dashboard-clean{
  background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(248,243,255,.88))!important;
}
.hh-journey-clean > p,
.hh-dashboard-clean > p{
  font-size:clamp(1rem,1.6vw,1.12rem)!important;
  line-height:1.58!important;
  color:#62566c!important;
  font-weight:760!important;
}
.hh-clean-cards{
  display:grid!important;
  gap:clamp(12px,2vw,18px)!important;
  align-items:stretch!important;
}
.hh-clean-cards .hh-journey-step,
.hh-clean-cards .hh-dashboard-mini{
  display:flex!important;
  flex-direction:column!important;
  gap:8px!important;
  min-width:0!important;
  min-height:0!important;
}
.hh-clean-cards .hh-journey-step span,
.hh-clean-cards .hh-dashboard-mini span{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  align-self:flex-start!important;
  width:auto!important;
  min-width:38px!important;
  height:34px!important;
  margin:0!important;
  padding:0 12px!important;
  border-radius:999px!important;
  background:#faeafe!important;
  border:1px solid rgba(155,116,182,.16)!important;
  color:#7d5a94!important;
  font-size:.78rem!important;
  line-height:1!important;
  font-weight:950!important;
  white-space:nowrap!important;
}
.hh-clean-cards .hh-journey-step h3,
.hh-clean-cards .hh-dashboard-mini h3{
  display:block!important;
  margin:2px 0 0!important;
  padding:0!important;
  color:#17121c!important;
  font-size:clamp(1.04rem,1.5vw,1.18rem)!important;
  line-height:1.18!important;
  font-weight:950!important;
  letter-spacing:-.02em!important;
}
.hh-clean-cards .hh-journey-step p,
.hh-clean-cards .hh-dashboard-mini p{
  display:block!important;
  margin:0!important;
  padding:0!important;
  max-width:none!important;
  color:#665b70!important;
  font-size:.96rem!important;
  line-height:1.48!important;
  font-weight:720!important;
}
.hh-clean-cards .hh-journey-step strong,
.hh-clean-cards .hh-journey-step small,
.hh-clean-cards .hh-dashboard-mini strong,
.hh-clean-cards .hh-dashboard-mini small{
  display:none!important;
}
.hh-dashboard-clean .hh-dashboard-cards{
  grid-template-columns:1fr!important;
}
@media(min-width:760px){
  .hh-journey-clean .hh-journey-steps{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
  .hh-dashboard-clean .hh-dashboard-cards{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
}
@media(max-width:720px){
  .hh-journey-clean h2,.hh-dashboard-clean h2{font-size:clamp(1.45rem,7vw,2rem)!important;}
  .hh-clean-cards{grid-template-columns:1fr!important;}
}