/* A contained visual refinement of the business support journey. */
#support-view {
  --support-border: #e9e3dc;
  --support-shadow: 0 3px 8px #35251c05, 0 14px 36px #35251c08;
}
#support-view .hero {
  background: radial-gradient(ellipse at 88% 24%, #f7dfb447 0, transparent 48%),
    radial-gradient(ellipse at 3% 0%, #fbe9dc80 0, transparent 48%),
    linear-gradient(120deg, #fffaf2, #fffcf7 54%, #fff8ef);
  border-bottom: 1px solid #f0e8de;
}
#support-view .hero-inner {
  grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr);
  gap: 36px;
  min-height: 692px;
  padding-top: 72px;
  padding-bottom: 62px;
}
#support-view .eyebrow { color: #922634; line-height: 1.65; letter-spacing: .045em; }
#support-view h1 { font-size: clamp(40px, 4vw, 52px); letter-spacing: -1.8px; line-height: 1.08; margin-bottom: 24px; }
#support-view .intro { max-width: 51ch; font-size: 16px; line-height: 1.75; color: #535b66; margin-bottom: 28px; }
#support-view .find-btn { min-height: 50px; padding: 14px 25px; box-shadow: 0 4px 9px #8a122115, 0 10px 24px #8a122110; }
#support-view .find-btn:hover { box-shadow: 0 7px 18px #8a122125; }
#support-view .catalogue-entry { border-color: #dfd5cb; background: #ffffffc9; padding: 9px 14px; color: #654c48; }
#support-view .explore-map { margin-top: 22px; color: #982030; line-height: 1.6; }
#support-view .counter { display: none; }
#support-view .hero-visual { padding-top: 0; }
#support-view .card-pile { width: 440px; height: 436px; margin-left: 0; }
#support-view .pile-card {
  width: 222px; height: 324px; left: 76px; top: 46px;
  border: 1px solid #e8e0d8; border-radius: 20px;
  padding: 29px 19px 21px;
  background: linear-gradient(160deg, #fff 67%, #fcfaf6);
  box-shadow: 0 3px 7px #37251b0c, 0 19px 37px #37251b18;
}
#support-view .pile-card::before { height: 7px; }
#support-view .pile-card::after { bottom: 25px; right: 18px; width: 7px; height: 7px; }
#support-view .pile-card h3 { font-size: 16px; line-height: 1.4; letter-spacing: -.2px; margin-bottom: 12px; }
#support-view .pile-card p { color: #626976; font-size: 12px; line-height: 1.65; }
#support-view .pile-card .pile-type { font-size: 10px; margin-bottom: 14px; }
#support-view .pile-pill { font-size: 10px; padding: 5px 10px; }
#support-view .pile-card:hover { border-color: #d7c9bd; box-shadow: 0 5px 10px #37251b10, 0 24px 44px #37251b25; }
#support-view .shuffle { margin-left: 18px; margin-top: 7px; border-color: #e0d7ce; padding: 11px 22px; box-shadow: 0 3px 8px #37251b07; color: #514c48; }
#support-view .finder { background: #f8f7f4; padding-top: 48px; padding-bottom: 48px; }
#support-view .panel { border-color: var(--support-border); border-radius: 22px; box-shadow: var(--support-shadow); }
#support-view .search-panel { padding: 32px; }
#support-view .search-panel h2 { font-size: 20px; letter-spacing: -.4px; }
#support-view .search-panel > p { color: #666d77; margin-bottom: 18px; line-height: 1.7; }
#support-view .search-field { border-radius: 14px; border-color: #e3ded8; background: #faf9f7; }
#support-view .search-field:focus-within { border-color: #b94751; box-shadow: 0 0 0 3px #c51f2b10; }
#support-view .search-field input::placeholder { color: #747b85; }
#support-view .search-submit { border-radius: 14px; }
#support-view .search-examples { color: #6d737c; line-height: 1.7; gap: 12px; margin-top: 17px; }
#support-view .search-examples button { color: #8e4148; border-bottom-color: #d5aaa6; }
#support-view .divider { margin: 32px 0; color: #73716f; }
#support-view .divider::before, #support-view .divider::after { background: #e5dfd7; }
#support-view .divider span { border-color: var(--support-border); }
#support-view .wizard { padding: 28px; }
#support-view .wizard h2 { font-size: 19px; letter-spacing: -.3px; }
#support-view .wizard-subtitle, #support-view .step-label, #support-view .selection-hint { color: #727781; }
#support-view .wizard-question { margin-top: 10px; margin-bottom: 19px; }
#support-view .option-card { border-color: #e6e1db; border-radius: 17px; background: #fff; box-shadow: 0 2px 5px #35251c03; }
#support-view .option-card p { color: #666e78; }
#support-view .option-card:hover { border-color: #ce969b; background: #fffaf8; box-shadow: 0 5px 14px #7a23310a; }
#support-view .option-card[aria-pressed="true"] { background: #fff7e8; border-color: #b8525c; box-shadow: 0 0 0 1px #b8525c; }
#support-view .wizard-back, #support-view .wizard-actions .skip-step { color: #656c75; }
#support-view .results-section { margin-top: 36px; }
#support-view .result-grid { gap: 20px; }
#support-view .result-card {
  border-color: var(--support-border); border-radius: 20px; padding: 24px 22px;
  box-shadow: 0 2px 6px #35251c04, 0 9px 20px #35251c04;
}
#support-view .result-card h3 { font-size: 15px; font-weight: 650; line-height: 1.45; letter-spacing: -.15px; }
#support-view .result-card p { color: #626b76; line-height: 1.75; }
#support-view .result-card:hover { transform: translateY(-2px); border-color: #cda0a2; box-shadow: 0 4px 10px #35251c07, 0 15px 28px #35251c0b; }
#support-view .tag { border-radius: 7px; padding: 4px 9px; font-weight: 600; }
#support-view .meta-pill { background: #f5f3ef; color: #646c75; border-radius: 6px; padding: 3px 7px; }
#support-view .featured-card { border: 1px solid #e4c985; border-radius: 20px; padding: 23px 22px; background: linear-gradient(125deg, #fffbf1, #fff2ce); box-shadow: 0 4px 12px #8d601209; transition: transform .2s, box-shadow .2s; }
#support-view .featured-card h3 { font-size: 15px; font-weight: 650; }
#support-view .featured-card p { color: #686f66; }
#support-view .featured-card:hover { box-shadow: 0 8px 22px #8d601214; }
#support-view .empty-start, #support-view .no-results { border-color: var(--support-border); border-radius: 20px; box-shadow: 0 3px 12px #35251c03; color: #69717b; }
#support-view .result-count, #support-view .result-help { color: #666f79; }
#support-view .select-wrap { border-color: #e0dbd4; }
#support-view .contact-panel { border-radius: 20px; background: linear-gradient(110deg, #fff8e9, #fff4db); border-color: #e9d5ac; }
#support-view .information { border-color: var(--support-border); border-radius: 17px; color: #6e7680; padding: 17px 20px; }
#support-view .information svg { color: #7f8790; }
/* Optional factual strip directly below the hero; labels are translated in markup. */
#support-view .support-key-figures { background: #fff; border-bottom: 1px solid var(--support-border); }
#support-view .support-key-figures .content-width { display: grid; grid-template-columns: repeat(4, 1fr); padding: 26px 0; }
#support-view .support-key-figures .content-width > div { padding: 0 28px; border-left: 1px solid #e9e4dd; }
#support-view .support-key-figures .content-width > div:first-child { border-left: 0; padding-left: 0; }
#support-view .support-key-figures strong { display: block; color: #9d2331; font-size: 27px; font-weight: 750; line-height: 1.2; letter-spacing: -.7px; }
#support-view .support-key-figures span { display: block; color: #646b75; font-size: 12px; margin-top: 6px; }
@media (max-width: 1180px) {
  #support-view .hero-inner { gap: 18px; padding-top: 64px; }
  #support-view .card-pile { transform: scale(.93); }
}
@media (max-width: 900px) {
  #support-view .hero-inner { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 10px; padding-top: 52px; padding-bottom: 48px; min-height: 640px; }
  #support-view h1 { font-size: 42px; }
  #support-view .intro { font-size: 15px; }
  #support-view .card-pile { width: 370px; transform: scale(.78); margin-left: -16px; }
  #support-view .shuffle { margin-left: 0; margin-top: -30px; }
  #support-view .result-grid { gap: 16px; }
}
@media (max-width: 680px) {
  #support-view .hero-inner { display: flex; gap: 18px; min-height: 0; padding-top: 38px; padding-bottom: 28px; }
  #support-view h1 { font-size: 38px; letter-spacing: -1.3px; }
  #support-view .intro { font-size: 15px; line-height: 1.72; max-width: 51ch; margin-bottom: 24px; }
  #support-view .hero-visual { height: 342px; padding-top: 0; }
  #support-view .card-pile { width: 420px; height: 320px; margin-left: -15px; margin-top: -7px; transform: scale(.75); }
  #support-view .pile-card { top: 0; }
  #support-view .shuffle { margin-top: -6px; padding: 9px 18px; }
  #support-view .counter { margin-top: 22px; }
  #support-view .finder { padding-top: 28px; padding-bottom: 32px; }
  #support-view .search-panel, #support-view .wizard { padding: 22px; border-radius: 20px; }
  #support-view .search-panel h2 { font-size: 18px; }
  #support-view .wizard h2 { font-size: 17px; }
  #support-view .result-card { padding: 22px; }
  #support-view .search-examples { gap: 8px; }
  #support-view .support-key-figures .content-width { grid-template-columns: repeat(2, 1fr); gap: 20px 0; padding: 21px 0; }
  #support-view .support-key-figures .content-width > div { padding: 0 12px; }
  #support-view .support-key-figures .content-width > div:nth-child(odd) { border-left: 0; padding-left: 0; }
  #support-view .support-key-figures strong { font-size: 22px; letter-spacing: -.4px; }
  #support-view .support-key-figures span { font-size: 10px; line-height: 1.5; }
}
@media (prefers-reduced-motion: reduce) {
  #support-view .result-card:hover, #support-view .featured-card:hover { transform: none; }
}
@media print {
  #support-view .hero { background: white; }
  #support-view .hero-inner { display: block; min-height: 0; padding: 20px 0; }
  #support-view h1 { font-size: 28px; }
  #support-view .intro { font-size: 13px; }
  #support-view .finder { background: white; padding: 0; }
  #support-view .result-card { box-shadow: none; }
}