/* HiddenHelp v14-inspired safe visual consistency layer
   Base: current live responsive refinement v2.
   Purpose: borrow the calmer look of the newer design without importing its broken structure.
   Safe scope: CSS only. No HTML structure, JS, filters, saved data or navigation changes. */

:root{
  --hh-safe-ink:#17121c;
  --hh-safe-muted:#6f6576;
  --hh-safe-soft:#9f93a6;
  --hh-safe-purple:#eaa7ff;
  --hh-safe-purple-2:#faeefe;
  --hh-safe-purple-3:#f1ccff;
  --hh-safe-blue:#40a9ff;
  --hh-safe-blue-2:#edf8ff;
  --hh-safe-mint:#e8fff5;
  --hh-safe-mint-line:#c8f4df;
  --hh-safe-yellow:#fff8d8;
  --hh-safe-peach:#fff1e8;
  --hh-safe-panel:rgba(255,255,255,.94);
  --hh-safe-line:rgba(126,87,139,.18);
  --hh-safe-shadow:0 18px 46px rgba(126,87,139,.11);
  --hh-safe-shadow-soft:0 9px 22px rgba(126,87,139,.075);
  --hh-safe-radius-lg:30px;
  --hh-safe-radius-md:22px;
  --hh-safe-radius-sm:17px;
}

html,body{background:linear-gradient(180deg,#fffaff 0%,#f9fbff 48%,#fff8fd 100%)!important;color:var(--hh-safe-ink)!important;}
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(circle at 12% 8%,rgba(234,167,255,.16),transparent 33%),radial-gradient(circle at 88% 14%,rgba(64,169,255,.11),transparent 35%),radial-gradient(circle at 80% 94%,rgba(200,244,223,.16),transparent 32%);} 

/* Keep the brand/nav structure intact but make surrounding rhythm consistent. */
.site,main,.wrap,.container,.page-wrap,.shell,.content-wrap,.hh-page,.page-shell{width:min(1160px,100%)!important;margin-left:auto!important;margin-right:auto!important;}
main,.wrap,.container,.page-wrap,.shell,.content-wrap,.hh-page,.page-shell{padding-left:clamp(14px,3vw,28px)!important;padding-right:clamp(14px,3vw,28px)!important;}

/* Softer v14-style panels, applied broadly but safely. */
.panel,.card,.tool,.step,.results-block,.quick-panel,.faq,.seo-panel,.start-panel,.checker,
.tile,.result-tile,.route-card,.guide-card,.saving-card,.provider-card,.contact-card,.dashboard-card,
.support-card,.tool-card,.glass,.section,.local-card,.activity-card,.hh-info-card,.quick-route,
.support-plan-link-card,.snapshot,.empty-state,.empty-plan,.article-card,.article,.guide,.route,.bill-card,
.support-tile,.result-card,.step-card,.trust-card,.legal-card{
  background:var(--hh-safe-panel)!important;
  border:2px solid var(--hh-safe-purple-2)!important;
  border-radius:var(--hh-safe-radius-lg)!important;
  box-shadow:var(--hh-safe-shadow)!important;
  color:var(--hh-safe-ink)!important;
  overflow:hidden!important;
}

.card,.tile,.result-tile,.route-card,.guide-card,.saving-card,.provider-card,.contact-card,.dashboard-card,
.support-card,.tool-card,.local-card,.activity-card,.hh-info-card,.article-card,.bill-card,.support-tile,
.result-card,.step-card,.quick-route,.support-plan-link-card{
  padding:clamp(16px,2.4vw,24px)!important;
}

/* Colour accents from the newer design, without changing content or logic. */
.purple{background:var(--hh-safe-purple-2)!important;}
.blue{background:var(--hh-safe-blue-2)!important;}
.mint{background:var(--hh-safe-mint)!important;}
.yellow{background:var(--hh-safe-yellow)!important;}
.peach{background:var(--hh-safe-peach)!important;}
.result-card.high,.route-card.high,.support-card.high{background:linear-gradient(180deg,#fff,#f7fffb)!important;border-color:var(--hh-safe-mint-line)!important;}
.result-card.medium,.route-card.medium,.support-card.medium{background:linear-gradient(180deg,#fff,#f7fcff)!important;border-color:#d7f0ff!important;}
.result-card.low,.route-card.low,.support-card.low{background:linear-gradient(180deg,#fff,#fffaf3)!important;border-color:#ffe7c9!important;}

/* Typography: consistent, readable and less likely to overflow. */
h1,h2,h3,h4{color:var(--hh-safe-ink)!important;letter-spacing:-.045em!important;line-height:1.08!important;text-wrap:balance;}
h1{font-size:clamp(2.15rem,7vw,4.6rem)!important;}
h2{font-size:clamp(1.55rem,4.5vw,2.65rem)!important;}
h3{font-size:clamp(1.13rem,2.4vw,1.48rem)!important;}
p,li,label,.lead,.muted,.tiny-copy,.sub,.hint,.help,.small{overflow-wrap:anywhere;}
p,.lead{color:var(--hh-safe-muted)!important;font-weight:680!important;}
.lead{font-size:clamp(1.02rem,2vw,1.22rem)!important;}

/* Buttons: borrow the rounded v14 feel, but explicitly remove glossy shine/streak effects. */
button,.btn,.button,input[type=button],input[type=submit],.small-btn,.links a,.links button,
.actions a,.actions button,.controls a,.controls button,.hero-actions a,.hero-actions button,
.primary-action,.secondary-action,.cta,.cta-button,.guide-actions a,.card-actions a,.tool-actions a,
.support-actions a,.result-actions a,.route-controls button{
  min-height:48px!important;
  border-radius:18px!important;
  font-weight:950!important;
  line-height:1.15!important;
  text-align:center!important;
  box-shadow:var(--hh-safe-shadow-soft)!important;
  text-decoration:none!important;
  transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease!important;
}
button::before,button::after,.btn::before,.btn::after,.button::before,.button::after,
.small-btn::before,.small-btn::after,.links a::before,.links a::after,.actions a::before,.actions a::after,
.hero-actions a::before,.hero-actions a::after,.cta::before,.cta::after,.cta-button::before,.cta-button::after{
  content:none!important;display:none!important;background:none!important;opacity:0!important;
}
button:hover,.btn:hover,.button:hover,.small-btn:hover,.links a:hover,.actions a:hover,.hero-actions a:hover,.cta:hover,.cta-button:hover{transform:translateY(-1px);box-shadow:0 13px 28px rgba(126,87,139,.12)!important;}
button:focus-visible,.btn:focus-visible,.button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(234,167,255,.45)!important;outline-offset:3px!important;}

.btn.primary,.primary,.primary-action,button.primary,input[type=submit],.hero-actions .primary,.actions .primary,.cta.primary,.cta-button.primary{
  background:linear-gradient(135deg,var(--hh-safe-purple),var(--hh-safe-blue))!important;
  color:#fff!important;
  border:0!important;
  -webkit-text-fill-color:#fff!important;
}
.btn.secondary,.button.secondary,.secondary,.secondary-action,button.secondary,.hero-actions .secondary,.actions .secondary,
.links a,.links button,.small-btn{
  background:#fffaff!important;
  color:#8f62a0!important;
  -webkit-text-fill-color:#8f62a0!important;
  border:2px solid var(--hh-safe-purple-2)!important;
}
.btn.mint,.success,.success-action,button.success,.print-btn,.print-button{
  background:#bdf3d7!important;
  color:#28775f!important;
  -webkit-text-fill-color:#28775f!important;
  border:2px solid #96e4ba!important;
}

/* Action tiles: make them look closer to the newer design but keep their actual links/click handlers. */
.hh-click-card,.action-tile,.start-card,.choice,button.card,a.card,.quick-route,.support-plan-link-card{
  border:2px solid var(--hh-safe-purple-3)!important;
  border-radius:var(--hh-safe-radius-md)!important;
  background:#fff!important;
  box-shadow:var(--hh-safe-shadow-soft)!important;
  padding:clamp(15px,2vw,20px)!important;
  text-align:left!important;
}
.hh-click-card:hover,.action-tile:hover,.start-card:hover,.choice:hover,button.card:hover,a.card:hover,.quick-route:hover,.support-plan-link-card:hover{border-color:var(--hh-safe-purple)!important;transform:translateY(-1px);}
.choice.active,.selected,.is-selected,[aria-pressed="true"].choice,[aria-selected="true"]{background:var(--hh-safe-purple-2)!important;border-color:var(--hh-safe-purple)!important;}
.card small,.tile small,.start-card small,.choice small{display:block;color:#aaa0af!important;font-weight:900!important;}
.card strong,.tile strong,.start-card strong,.choice strong{display:block;color:var(--hh-safe-ink)!important;font-size:clamp(1.08rem,2vw,1.22rem)!important;letter-spacing:-.035em!important;}

/* Filters stay smaller than action buttons and visibly usable. */
.filters,.filter-row,.filterbar,.filter-bar,.guide-filters,.hh-filter-row,.badge-row,.chip-row,.chips,.quick-filters,.provider-chips,.category-row{gap:8px!important;row-gap:8px!important;}
.filter-chip,.chip,.tag,.badge,.label,.status,.pill,.category-chip,.guide-filter,.hh-filter-chip,.provider-chip{
  min-height:32px!important;
  padding:7px 11px!important;
  border-radius:999px!important;
  background:var(--hh-safe-purple-2)!important;
  border:1px solid var(--hh-safe-line)!important;
  color:#8e6c9a!important;
  -webkit-text-fill-color:#8e6c9a!important;
  font-size:.86rem!important;
  font-weight:900!important;
  box-shadow:none!important;
}
.chip.blue,.tag.blue,.badge.blue{background:var(--hh-safe-blue-2)!important;color:#2e6d8f!important;-webkit-text-fill-color:#2e6d8f!important;}
.chip.mint,.tag.mint,.badge.mint{background:var(--hh-safe-mint)!important;color:#28775f!important;-webkit-text-fill-color:#28775f!important;}

/* Forms keep the working logic but match the newer soft control look. */
input[type="text"],input[type="search"],input[type="number"],input[type="email"],input[type="tel"],input[type="date"],select,textarea{
  min-height:52px!important;
  border-radius:18px!important;
  border:2px solid var(--hh-safe-purple-3)!important;
  background:#fff!important;
  color:var(--hh-safe-ink)!important;
  font-weight:750!important;
  box-shadow:none!important;
}

/* Laptop consistency: slightly tighter than huge mobile-style slabs, still touch-friendly. */
@media (min-width:760px){
  .hero{gap:clamp(18px,2.5vw,28px)!important;}
  .panel,.tool,.quick-panel,.faq,.seo-panel,.start-panel,.checker,.results-block,.section,.glass{padding:clamp(24px,3vw,34px)!important;border-radius:34px!important;}
  .tiles,.trust,.start-grid,.seo-grid,.input-grid,.choice-grid,.result-grid,.localgrid,.guide-grid,.cards,.routes,
  .dashboard-grid,.support-grid,.savings-grid,.activity-grid,.provider-grid,.deep-grid,.tool-grid,.grid,.bill-grid,
  .quick-grid,.option-grid,.support-plan-grid,.action-grid,.article-grid{gap:clamp(12px,1.8vw,18px)!important;}
}
@media (min-width:900px) and (max-width:1366px){
  .card,.tile,.result-tile,.route-card,.guide-card,.saving-card,.provider-card,.contact-card,.dashboard-card,.support-card,.tool-card,.local-card,.activity-card,.hh-info-card,.article-card,.bill-card,.support-tile,.result-card,.step-card{padding:18px!important;border-radius:24px!important;}
  button,.btn,.button,.small-btn,.links a,.links button,.actions a,.actions button{min-height:46px!important;padding:12px 16px!important;}
}

/* Mobile: closer to v14 spacing, but no cramped overflow. */
@media (max-width:700px){
  main,.wrap,.container,.page-wrap,.shell,.content-wrap,.hh-page,.page-shell{padding-left:11px!important;padding-right:11px!important;}
  .panel,.tool,.quick-panel,.faq,.seo-panel,.start-panel,.checker,.results-block,.section,.glass{padding:18px 14px!important;border-radius:24px!important;}
  .card,.tile,.result-tile,.route-card,.guide-card,.saving-card,.provider-card,.contact-card,.dashboard-card,.support-card,.tool-card,.local-card,.activity-card,.hh-info-card,.article-card,.bill-card,.support-tile,.result-card,.step-card,.start-card,.choice{padding:15px!important;border-radius:20px!important;}
  .actions,.links,.hero-actions,.result-actions,.card-actions,.guide-actions,.panel-actions,.tool-actions,.support-actions,.button-row,.cta-row,.form-actions{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;}
  button,.btn,.button,.small-btn,.links a,.links button,.actions a,.actions button{width:100%!important;min-height:50px!important;}
}

/* Keep accessibility controls inside the viewport. */
.hh-accessibility-bar,.hh-v14-access,.accessibility-float,.floating-accessibility,.hh-access-float,.accessbar-floating,.accessibility-panel{
  max-width:calc(100vw - 18px)!important;
  right:max(8px,env(safe-area-inset-right))!important;
  bottom:max(8px,env(safe-area-inset-bottom))!important;
}

@media print{
  body{background:#fff!important;}
  body::before{display:none!important;}
  .panel,.card,.tile,.result-card,.route-card,.guide-card,.support-card,.bill-card{box-shadow:none!important;border:1px solid #ddd!important;break-inside:avoid!important;}
}
