/* Divi 5 agency support skin — v2.2.0
 * Only applies to Support Bridge portal + article screens.
 * Brand tokens are defined in style.css as --lcm-support-*.
 * PRIMARY: search + active categories; SECONDARY: hero/headings;
 * ACCENT: Support Request CTA; SURFACE: portal background;
 * TEXT: body copy; HERO-END: second gradient color.
 */
.lcs-portal,
.lcs-article-page {
  --agency-support-primary: var(--lcm-support-primary, #73bf44);
  --agency-support-secondary: var(--lcm-support-secondary, #2c3e50);
  --agency-support-accent: var(--lcm-support-accent, #de6448);
  --agency-support-surface: var(--lcm-support-surface, #f4f4f4);
  --agency-support-text: var(--lcm-support-text, #303133);
  --agency-support-hero-end: var(--lcm-support-hero-end, #182737);
  --lcs-primary: var(--agency-support-primary);
  --lcs-secondary: var(--agency-support-secondary);
  --lcs-accent: var(--agency-support-accent);
  --lcs-surface: var(--agency-support-surface);
  --lcs-text: var(--agency-support-text);
  --lcs-border: #e1e7ed;
  --lcs-radius: 15px;
}
.lcs-portal {
  max-width: 1220px;
  margin: 0 auto 50px;
  border: 1px solid var(--lcs-border);
  border-radius: 18px;
  box-shadow: 0 12px 36px rgba(15, 31, 45, .08);
  background: var(--lcs-surface);
}
.lcs-portal .lcs-portal-hero {
  min-height: 335px;
  background: linear-gradient(115deg, var(--lcs-secondary), var(--agency-support-hero-end));
  border-bottom: 5px solid var(--lcs-primary);
}
.lcs-portal .lcs-portal-top { justify-content: flex-start; }
.lcs-portal .lcs-portal-logo {
  max-width: min(290px, 70vw);
  width: auto;
  max-height: 80px;
  height: auto;
  padding: 9px 14px;
  background: #fff;
  border-radius: 9px;
  object-fit: contain;
}
.lcs-portal .lcs-hero-inner { max-width: 850px; margin-top: 43px; }
.lcs-portal .lcs-portal-hero h1 { letter-spacing: -.03em; line-height: 1.12; text-wrap: balance; }
.lcs-portal .lcs-search { max-width: 790px; margin-inline: auto; }
.lcs-portal .lcs-search button { color: #132017 !important; background: var(--lcs-primary); }
.lcs-portal .lcs-portal-content { background: var(--lcs-surface); }
.lcs-portal .lcs-portal-head h2 { letter-spacing: -.025em; }
.lcs-portal .lcs-support-cta,
.lcs-article-page .lcs-support-cta {
  color: #ffffff !important;
  background: var(--lcs-accent);
  border-radius: 9px;
}
/* Category tiles reproduce the support hub's category-first browsing structure.
 * No changes to Bridge markup or synced content are needed. */
.lcs-portal .lcs-categories {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: 12px;
  margin: 32px 0 30px;
}
.lcs-portal .lcs-categories a {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  min-height: 66px;
  padding: 16px 18px;
  border: 1px solid var(--lcs-border);
  border-radius: 12px;
  background: #fff;
  color: var(--lcs-secondary) !important;
  font-size: 14px;
  font-weight: 740;
  box-shadow: 0 3px 9px rgba(15,31,45,.03);
  transition: box-shadow .17s, border-color .17s, background-color .17s;
}
.lcs-portal .lcs-categories a:hover,
.lcs-portal .lcs-categories a.active {
  color: #132017 !important;
  border-color: var(--lcs-primary);
  background: var(--lcs-primary);
}
.lcs-portal .lcs-doc-card { border-top: 4px solid var(--lcs-primary); border-radius: 13px; }
.lcs-portal .lcs-doc-card .lcs-card-mark { background: color-mix(in srgb, var(--lcs-primary) 12%, white); color: var(--lcs-primary); }
.lcs-portal .lcs-doc-card h3 { letter-spacing: -.01em; }
.lcs-portal .lcs-pagination a[aria-current='page'] { background: var(--lcs-primary); color: #132017 !important; }
.lcs-article-page { max-width: 1200px; margin-inline: auto; }
.lcs-article-page .lcs-article-layout { border-top: 5px solid var(--lcs-primary); }
.lcs-article-page .lcs-article-header h1 { letter-spacing: -.028em; }
.lcs-portal :is(a, button, input):focus-visible,
.lcs-article-page :is(a, button, input):focus-visible { outline: 3px solid var(--lcs-accent); outline-offset: 3px; }
/* Quicklink strip: optional shortcode [agency_support_links] above portal */
.agency-support-quicklinks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0 auto 26px; max-width: 1220px; }
.agency-support-quicklinks a { display:flex; align-items:center; justify-content:center; min-height:70px; border:1px solid var(--lcs-border, #dbe2e8); border-radius:12px; background:#fff; font-weight:700; color: var(--lcm-support-secondary, #2c3e50) !important; text-decoration:none !important; padding:15px 18px; text-align:center; box-shadow: 0 5px 16px rgba(15,31,45,.06); }
.agency-support-quicklinks a:hover { border-color: var(--lcm-support-primary, #73bf44); }
@media (max-width: 800px) { .lcs-portal .lcs-categories, .agency-support-quicklinks { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 580px) {
 .lcs-portal .lcs-categories, .agency-support-quicklinks { grid-template-columns: 1fr; }
 .lcs-portal .lcs-categories a { min-height: 52px; }
 .lcs-portal .lcs-portal-hero { min-height: auto; }
 .lcs-portal .lcs-portal-content { padding-inline: 18px; }
}
@media (prefers-reduced-motion: reduce) { .lcs-portal .lcs-categories a { transition: none; } }