/* Advertising performance report */
.agency-report { max-width: 1380px; margin: 0 auto; color: #113a53; --report-muted: #466780; }
.agency-report * { box-sizing: border-box; }
.agency-hero { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 12px 0 28px; }
.agency-eyebrow { color: #315b75; font-size: 11px; font-weight: 700; letter-spacing: .12em; line-height: 1.6; margin-bottom: 10px; }
.agency-hero h2 { font-size: clamp(28px, 3vw, 44px); font-weight: 600; letter-spacing: -.035em; line-height: 1.16; }
.agency-hero h2 span { color: #315b75; font-weight: 400; }
.agency-period { font-size: 13px; color: var(--report-muted); margin-top: 16px; }
.agency-button { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 10px 17px; border: 1px solid #155d84; border-radius: 8px; background: #155d84; color: #ffffff; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; text-decoration: none; white-space: nowrap; }
.agency-button.secondary { background: #f8fcff; color: #17425b; border-color: #8bafc5; }
.agency-button:hover { filter: brightness(.94); }
.agency-report :is(a, button, input, select, summary, [tabindex]):focus-visible { outline: 3px solid #166eaa; outline-offset: 3px; }
.agency-jump-links { display: flex; flex-wrap: wrap; gap: 8px 24px; padding: 18px 0; border-top: 1px solid #84b3cd; border-bottom: 1px solid #84b3cd; }
.agency-jump-links a { font-size: 12px; font-weight: 600; text-decoration: none; color: #17425b; padding: 3px 0; }
.agency-jump-links a:hover { text-decoration: underline; text-underline-offset: 5px; }
.agency-section { margin-top: 38px; scroll-margin-top: 24px; min-width: 0; }
.agency-section-heading { display: flex; gap: 15px; align-items: baseline; margin-bottom: 20px; }
.agency-section-heading > span { color: #315b75; font-size: 13px; font-weight: 600; }
.agency-section-heading h3 { font-size: 25px; line-height: 1.3; letter-spacing: -.025em; font-weight: 600; }
.agency-section-heading p { font-size: 13px; line-height: 1.7; color: var(--report-muted); margin-top: 5px; }
.agency-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.agency-kpis article { background: #ffffff; border: 1px solid #c9dfec; border-radius: 12px; padding: 24px; min-width: 0; }
.agency-kpis article > p { font-size: 10px; letter-spacing: .08em; font-weight: 700; color: var(--report-muted); }
.agency-kpis strong { display: block; font-size: clamp(25px, 2.5vw, 36px); line-height: 1.3; letter-spacing: -.025em; font-weight: 600; margin: 9px 0; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.agency-kpis article > span { color: var(--report-muted); font-size: 12px; }
.agency-caveat { color: var(--report-muted); font-size: 12px; line-height: 1.75; margin: 13px 0 0; }
.agency-overview-grid { display: grid; grid-template-columns: 1fr; margin-top: 24px; }
.agency-panel { background: #ffffff; border: 1px solid #c9dfec; border-radius: 14px; padding: 28px; min-width: 0; }
.agency-panel h4 { font-family: inherit; font-size: 21px; line-height: 1.45; font-weight: 600; letter-spacing: -.015em; }
.agency-goals { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 40px; margin-top: 24px; }
.agency-goal { min-width: 0; }
.agency-goal > div:first-child { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 6px; font-size: 13px; }
.agency-goal > div:first-child > span { color: var(--report-muted); font-size: 12px; }
.agency-mini-bar { height: 5px; width: 100%; background: #e0ecf3; border-radius: 3px; margin: 12px 0; overflow: hidden; }
.agency-mini-bar i { display: block; height: 100%; background: #2180af; border-radius: inherit; }
.agency-goal > p { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 4px 12px; font-size: 12px; }
.agency-goal > p > strong { font-weight: 500; }
.agency-goal > p > span { color: var(--report-muted); }
.agency-analysis-note { font-size: 12px; line-height: 1.8; max-width: 980px; margin: -4px 0 20px; color: var(--report-muted); }
.agency-case { background: #ffffff; border: 1px solid #c9dfec; border-radius: 14px; overflow: hidden; margin-bottom: 22px; }
.agency-case-header { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 24px 28px 20px; border-bottom: 1px solid #dce9f1; }
.agency-case-header .agency-eyebrow { margin-bottom: 7px; font-size: 10px; }
.agency-case-header h4 { font-family: inherit; font-size: 20px; line-height: 1.45; font-weight: 600; letter-spacing: -.015em; }
.agency-case-index { color: #5082a0; font-size: 25px; font-weight: 400; }
.agency-case-body { display: block; }
.agency-evidence { min-width: 0; padding: 26px 28px; }
.agency-field-label { font-size: 10px; letter-spacing: .09em; font-weight: 700; color: #315b75; margin-bottom: 9px; }
.agency-finding { font-size: 15px; line-height: 1.8; font-weight: 500; }
.agency-creative-metrics { margin-top: 23px; }
.agency-creative-row { display: grid; grid-template-columns: minmax(110px, 1.25fr) minmax(70px, .65fr) minmax(100px, 1fr); gap: 12px; padding: 14px 0; border-bottom: 1px solid #dce9f1; }
.agency-creative-row > div:not(:first-child) { text-align: right; }
.agency-creative-row strong { display: block; font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; }
.agency-creative-row span { display: block; color: var(--report-muted); font-size: 10px; margin-top: 5px; line-height: 1.5; }
.agency-creative-row .agency-mini-bar { margin: 9px 0 0; height: 4px; }
.agency-source { margin-top: 15px; font-size: 11px; color: var(--report-muted); }
.agency-source summary { cursor: pointer; color: #155d84; padding: 5px 0; }
.agency-source p { margin-top: 10px; line-height: 1.8; overflow-wrap: anywhere; }
.agency-sales-scroll { overflow: auto; }
.agency-sales-table { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 640px; }
.agency-sales-table :is(th, td) { padding: 15px 16px; border-bottom: 1px solid #dce9f1; text-align: right; font-variant-numeric: tabular-nums; }
.agency-sales-table thead th { font-size: 11px; color: var(--report-muted); background: #f3f8fb; white-space: nowrap; }
.agency-sales-table th:first-child { text-align: left; width: 55%; }
.agency-sales-table tbody th { font-weight: 500; font-size: 12px; }
.agency-sales-table tbody th :is(span, small) { display: block; color: var(--report-muted); font-size: 10px; font-weight: 400; margin-top: 5px; }
.agency-sales-table tbody td { white-space: nowrap; }
.agency-method { margin-top: 22px; background: #eef7fc; border: 1px solid #bcd5e5; border-radius: 10px; font-size: 12px; }
.agency-method > summary { cursor: pointer; padding: 17px 20px; font-weight: 600; }
.agency-method > div { padding: 0 20px 18px; }
.agency-method p { color: var(--report-muted); font-size: 12px; line-height: 1.85; margin-top: 9px; }
.agency-filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; }
.agency-filters label { display: flex; flex-direction: column; gap: 6px; min-width: 0; color: #315b75; font-size: 11px; }
.agency-filters label:first-child { flex: 1 1 220px; }
.agency-filters :is(input, select) { background: #f8fcff; color: #17425b; border: 1px solid #8bafc5; border-radius: 7px; min-height: 40px; padding: 9px 12px; font: inherit; font-size: 12px; width: 100%; }
.agency-table-meta { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 6px; font-size: 11px; color: var(--report-muted); margin: 20px 0 12px; }
.agency-data-scroll { overflow: auto; max-height: 600px; border: 1px solid #d2e3ee; border-radius: 8px; }
.agency-data-table { width: 100%; min-width: 2050px; border-collapse: separate; border-spacing: 0; font-size: 12px; }
.agency-data-table :is(th, td) { padding: 14px 16px; text-align: right; border-bottom: 1px solid #dce9f1; vertical-align: top; font-variant-numeric: tabular-nums; }
.agency-data-table thead th { position: sticky; top: 0; background: #e7f2f8; color: #315b75; z-index: 2; font-size: 11px; white-space: nowrap; }
.agency-data-table :is(th, td):first-child { text-align: left; min-width: 270px; max-width: 320px; background: #ffffff; position: sticky; left: 0; border-right: 1px solid #d2e3ee; z-index: 1; overflow-wrap: anywhere; }
.agency-data-table thead th:first-child { z-index: 3; background: #e7f2f8; }
.agency-data-table tbody tr:hover :is(td, th) { background: #f1f8fc; }
.agency-data-table td { white-space: nowrap; }
.agency-data-table td:last-child { min-width: 240px; max-width: 290px; text-align: left; white-space: normal; }
.agency-data-table strong { font-weight: 600; }
.agency-data-table span { display: block; font-size: 10px; color: var(--report-muted); line-height: 1.65; margin-top: 5px; white-space: normal; }
.agency-data-table summary { margin-top: 7px; font-size: 10px; color: #155d84; font-weight: 400; cursor: pointer; }
.agency-data-table details p { color: var(--report-muted); font-size: 10px; line-height: 1.7; font-weight: 400; margin-top: 7px; }
.agency-empty h3 { font-size: 23px; margin-bottom: 12px; }
.agency-empty p { font-size: 14px; color: var(--report-muted); }
@media (max-width: 1180px) {
    .agency-overview-grid, .agency-case-body { grid-template-columns: 1fr; }
    .agency-hero { align-items: flex-start; }
}
@media (max-width: 700px) {
    .agency-hero { flex-direction: column; gap: 20px; }
    .agency-hero h2 { font-size: 31px; }
    .agency-kpis { grid-template-columns: 1fr; gap: 10px; }
    .agency-kpis article { padding: 20px; }
    .agency-kpis strong { font-size: 31px; }
    .agency-goals { grid-template-columns: 1fr; }
    .agency-panel, .agency-evidence, .agency-case-header { padding: 22px 18px; }
    .agency-jump-links { gap: 10px 20px; }
    .agency-section { margin-top: 30px; }
    .agency-section-heading { gap: 10px; }
    .agency-section-heading h3 { font-size: 22px; }
    .agency-creative-row { grid-template-columns: minmax(80px, 1fr) 55px minmax(92px, 1fr); gap: 9px; }
    .agency-creative-row strong { font-size: 12px; }
    .agency-creative-row span { font-size: 10px; }
    .agency-filters label { flex: 1 1 125px; }
    .agency-data-table :is(th, td):first-child { position: static; }
    .agency-data-table thead th:first-child { position: sticky; }
    .agency-data-scroll { max-height: 510px; }
}