﻿/* Resources R3K - exact Legal hero font rhythm + Market Hours width.
   Scope: Resources pages only.
   Width rule: match Market Hours width.
   Hero typography rule: mirror Legal hero by NOT creating a Resources-specific font family or h1 font weight.
*/

.resources-page .resources-frame,
.resources-page .resources-wide-frame,
.resources-page .resources-hero > .container,
.resources-page main .container {
  width: min(1180px, calc(100% - 48px)) !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  min-width: 0 !important;
}

.resources-page main {
  overflow-x: hidden;
}

.resources-page .resources-main {
  background:
    radial-gradient(circle at 18% 0%, rgba(216,173,78,.045), transparent 30%),
    linear-gradient(90deg, rgba(216,173,78,.018), transparent 54%);
}

/* HERO: copied from locked Legal rhythm, while keeping Market Hours width. */
.resources-page .resources-hero {
  padding: clamp(1.05rem, 1.9vw, 1.85rem) 0 clamp(.9rem, 1.6vw, 1.45rem) !important;
  border-bottom: 1px solid rgba(220,181,70,.14) !important;
}

.resources-page .resources-breadcrumb {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: .48rem !important;
  margin: 0 0 .74rem !important;
  color: rgba(241,231,204,.72) !important;
  font-size: .78rem !important;
  line-height: 1.45 !important;
  letter-spacing: .01em !important;
  text-transform: none !important;
}

.resources-page .resources-breadcrumb a,
.resources-page .resources-breadcrumb span {
  display: inline !important;
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
  text-transform: inherit !important;
  text-decoration: none !important;
}

.resources-page .resources-breadcrumb a {
  color: #f2d45d !important;
}

.resources-page .resources-breadcrumb a:hover {
  text-decoration: underline !important;
}

.resources-page .resources-hero .eyebrow {
  display: block !important;
  margin: 0 0 .46rem !important;
  color: #f2d45d !important;
  font-size: .72rem !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  letter-spacing: .2em !important;
  text-transform: uppercase !important;
}

/* Critical: no font-family and no font-weight here.
   Legal h1 does not declare font-weight in its locked inline CSS; it inherits the site h1 weight.
   Resources should do the same. */
.resources-page .resources-hero h1 {
  max-width: 900px !important;
  margin: 0 !important;
  color: #f8f1dc !important;
  font-size: clamp(1.85rem, 2.55vw, 2.9rem) !important;
  line-height: 1.07 !important;
  letter-spacing: -.043em !important;
}

.resources-page .resources-hero .lede,
.resources-page .resources-hero .lead {
  max-width: 860px !important;
  margin: .58rem 0 0 !important;
  color: rgba(244,238,222,.78) !important;
  font-size: clamp(.94rem, 1.02vw, 1.04rem) !important;
  line-height: 1.58 !important;
}

.resources-page .resources-cta-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .72rem !important;
  margin-top: 1rem !important;
  align-items: center !important;
}

/* BODY SECTIONS: calm Resources directory layout using Legal-style rhythm. */
.resources-page .resources-note-section,
.resources-page .resources-section,
.resources-page .resources-table-section {
  padding: clamp(.95rem, 1.65vw, 1.35rem) 0 !important;
}

.resources-page .resources-section + .resources-section .resources-frame,
.resources-page .resources-section + .resources-section .resources-wide-frame,
.resources-page .resources-faq-section .resources-frame,
.resources-page .resources-faq-section .resources-wide-frame {
  border-top: 1px solid rgba(220,181,70,.14) !important;
  padding-top: clamp(.95rem, 1.65vw, 1.35rem) !important;
}

.resources-page .resources-section h2,
.resources-page .resources-table-heading h2,
.resources-page .resources-faq-section h2,
.resources-page .resources-answer-card h2 {
  max-width: 860px !important;
  margin: 0 0 .55rem !important;
  color: #f8f1dc !important;
  font-size: clamp(1.2rem, 1.55vw, 1.55rem) !important;
  line-height: 1.18 !important;
  letter-spacing: -.02em !important;
}

.resources-page .resources-section h3,
.resources-page .resources-answer-card h3 {
  margin: .86rem 0 .35rem !important;
  color: rgba(255,245,210,.95) !important;
  font-size: .98rem !important;
  line-height: 1.35 !important;
}

.resources-page .section-lede,
.resources-page .resources-note,
.resources-page .resources-answer-card,
.resources-page .resources-answer-card p,
.resources-page .resources-faq-stack details p,
.resources-page .resources-table-heading p {
  max-width: 76ch !important;
  color: rgba(244,238,222,.76) !important;
  font-size: .94rem !important;
  line-height: 1.62 !important;
}

.resources-page .resources-answer-card,
.resources-page .resources-note {
  max-width: 100% !important;
  padding: .78rem .92rem !important;
  border: 1px solid rgba(220,181,70,.16) !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.025) !important;
}

.resources-page .resources-note.compact {
  margin: .75rem 0 1rem !important;
}

.resources-page .resources-card-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: .9rem !important;
  margin-top: .8rem !important;
}

.resources-page .resource-card {
  display: flex !important;
  flex-direction: column !important;
  min-height: 150px !important;
  padding: .95rem !important;
  border: 1px solid rgba(220,181,70,.14) !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.025) !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

.resources-page .resource-card:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(242,212,93,.36) !important;
}

.resources-page .resource-card .badge,
.resources-page .resource-card .pill {
  align-self: flex-start !important;
  margin-bottom: .48rem !important;
  white-space: nowrap !important;
}

.resources-page .resource-card h3 {
  margin: 0 0 .35rem !important;
  color: #f2d45d !important;
  font-size: .98rem !important;
  line-height: 1.35 !important;
}

.resources-page .resource-card p {
  margin: 0 !important;
  color: rgba(244,238,222,.76) !important;
  font-size: .94rem !important;
  line-height: 1.62 !important;
}

/* TABLE: readable, but not a separate typography system. */
.resources-country-page .resources-table-heading {
  max-width: 900px !important;
}

.resources-country-page .resources-table-card {
  width: 100% !important;
  max-width: 100% !important;
  border: 1px solid rgba(220,181,70,.16) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.025) !important;
  overflow: hidden !important;
}

.resources-country-page .resources-table-scroll {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
}

.resources-country-page .resources-country-table {
  width: 100% !important;
  min-width: 980px !important;
  border-collapse: collapse !important;
  color: rgba(244,238,222,.75) !important;
  font-size: .94rem !important;
  line-height: 1.5 !important;
}

.resources-country-page .resources-country-table th,
.resources-country-page .resources-country-table td {
  padding: .6rem .68rem !important;
  border-bottom: 1px solid rgba(255,255,255,.075) !important;
  vertical-align: top !important;
  text-align: left !important;
}

.resources-country-page .resources-country-table thead th {
  color: #f2d45d !important;
  background: rgba(216,173,78,.08) !important;
  font-size: .72rem !important;
  letter-spacing: .13em !important;
  text-transform: uppercase !important;
  line-height: 1.35 !important;
}

.resources-country-page .resources-country-table tbody tr:nth-child(even) {
  background: rgba(255,255,255,.016) !important;
}

.resources-country-page .resources-country-table tbody tr:hover {
  background: rgba(216,173,78,.04) !important;
}

.resources-country-page .resources-country-table a {
  color: #f2d45d !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

.resources-country-page .resources-country-table a:hover {
  text-decoration: underline !important;
}

.resources-page .resources-faq-stack {
  display: grid !important;
  gap: .7rem !important;
  max-width: 920px !important;
}

.resources-page .resources-faq-stack details {
  border: 1px solid rgba(220,181,70,.16) !important;
  border-radius: 16px !important;
  padding: .85rem 1rem !important;
  background: rgba(255,255,255,.025) !important;
}

.resources-page .resources-faq-stack summary {
  cursor: pointer !important;
  color: #f2d45d !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
}

.resources-page .screen-reader-text {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.resources-page ::selection {
  background: rgba(242,212,93,.24);
  color: #fff7dd;
}

@media (max-width: 980px) {
  .resources-page .resources-frame,
  .resources-page .resources-wide-frame,
  .resources-page .resources-hero > .container,
  .resources-page main .container {
    width: min(1180px, calc(100% - 32px)) !important;
    max-width: 1180px !important;
  }
  .resources-page .resources-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  .resources-page .resources-hero {
    padding-top: .85rem !important;
  }
  .resources-page .resources-hero h1 {
    font-size: clamp(1.68rem, 7.7vw, 2.2rem) !important;
  }
  .resources-page .resources-card-grid {
    grid-template-columns: 1fr !important;
  }
  .resources-country-page .resources-country-table {
    min-width: 860px !important;
  }
}
/* BEGIN Resources R3N - exact legal kicker labels */
/* Exact Legal-style kicker lock for the two labels requested:
   - Resource Directory: Direct answer
   - Country Official Links: Reference table
   Width, hero, tables, cards, FAQ, and other page styling are not changed. */
body.resources-page p.resource-legal-kicker,
body.resources-page .resources-answer-card > p.resource-legal-kicker,
body.resources-page .resources-table-heading > p.resource-legal-kicker {
  display: block !important;
  margin: 0 0 .46rem !important;
  padding: 0 !important;
  color: #f2d45d !important;
  font-family: inherit !important;
  font-size: .72rem !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  letter-spacing: .2em !important;
  text-transform: uppercase !important;
  font-style: normal !important;
  text-decoration: none !important;
  background: transparent !important;
  border: 0 !important;
}
/* END Resources R3N - exact legal kicker labels */
/* BEGIN Resources R3O - direct answer paragraph justification */
/* Keep the Resource Directory direct-answer card visually balanced by letting
   only the explanatory body paragraphs use the full card width. The kicker
   label and heading remain unchanged. */
.resources-index-page .resources-answer-card p:not(.eyebrow):not(.resources-kicker-label) {
  max-width: none !important;
  width: 100% !important;
  text-align: justify !important;
  text-justify: inter-word !important;
  text-align-last: left !important;
  hyphens: auto !important;
}
.resources-index-page .resources-answer-card p:not(.eyebrow):not(.resources-kicker-label) + p:not(.eyebrow):not(.resources-kicker-label) {
  margin-top: .62rem !important;
}
@media (max-width: 760px) {
  .resources-index-page .resources-answer-card p:not(.eyebrow):not(.resources-kicker-label) {
    text-align: left !important;
    hyphens: manual !important;
  }
}
/* END Resources R3O - direct answer paragraph justification */
/* BEGIN Resources R3P2 - Direct Answer Wrap and Template Fix */
/* Keep the direct-answer card elegant on desktop without changing page width or layout. */
.resources-index-page .resources-answer-card p {
  text-align: justify !important;
  text-align-last: left !important;
  text-justify: inter-word !important;
  hyphens: auto !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
}

.resources-index-page .resources-answer-card p + p {
  margin-top: .62rem !important;
}

@media (max-width: 760px) {
  .resources-index-page .resources-answer-card p {
    text-align: left !important;
    text-align-last: auto !important;
    hyphens: none !important;
  }
}
/* END Resources R3P2 - Direct Answer Wrap and Template Fix */

/* === CIQ BACKGROUND R2 START ===
   Resource pages inherit the shared page background while preserving cards and panels.
*/
.resources-page main,
.resource-page main,
.resources-main,
.resource-main {
  background: transparent !important;
}
/* === CIQ BACKGROUND R2 END === */

