.app-shell { min-height: 100vh; display: flex; flex-direction: column; }
#site-header { border-bottom: 1px solid #08191a; background: #0d2021; }
.container { width: min(calc(100% - 3rem), var(--trust-container)); margin-inline: auto; }
.header-inner { min-height: 82px; display: flex; align-items: center; gap: var(--trust-space-8); }
.brand { display: inline-flex; align-items: center; gap: .65rem; color: #fff; font-size: 1rem; font-weight: 700; line-height: 1.1; text-decoration: none; white-space: nowrap; }
.brand small { display: block; align-self: center; padding-left: .65rem; border-left: 1px solid rgb(255 255 255 / 40%); color: rgb(255 255 255 / 85%); font-size: .75rem; font-weight: 500; }
.brand-logo { display: block; width: 150px; height: 66px; object-fit: contain; }
.brand-logo-fallback { width: 40px; height: 40px; }
.primary-navigation { display: flex; align-items: center; justify-content: flex-end; gap: clamp(1rem, 2vw, 2rem); margin-left: auto; }
.primary-navigation a { color: rgb(255 255 255 / 82%); font-size: .925rem; font-weight: 550; text-decoration: none; }
.primary-navigation a:hover, .primary-navigation a[aria-current="page"] { color: #fff; }
.menu-toggle { display: none; }
#site-header .menu-toggle { border-color: rgb(255 255 255 / 45%); background: transparent; color: #fff; }
#main-content { flex: 1; }
#site-footer { margin-top: auto; border-top: 1px solid var(--trust-border); background: var(--trust-surface); }
.footer-inner { min-height: 76px; display: flex; justify-content: space-between; align-items: center; gap: 1rem; color: var(--trust-text-muted); font-size: .875rem; }
.state-container { min-height: 55vh; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding-block: var(--trust-space-12); }
@media (max-width: 768px) {
  .container { width: min(calc(100% - 2rem), var(--trust-container)); }
  .header-inner { min-height: 72px; flex-wrap: wrap; gap: 0; }
  .menu-toggle { display: inline-flex; margin-left: auto; padding: .5rem .75rem; border: 1px solid var(--trust-border); border-radius: var(--trust-radius-sm); background: #fff; color: var(--trust-text); }
  .primary-navigation { display: none; flex: 0 0 100%; align-items: stretch; gap: 0; padding: .25rem 0 .75rem; }
  .primary-navigation.is-open { display: flex; flex-direction: column; }
  .primary-navigation a { padding: .65rem .25rem; }
  .footer-inner { align-items: flex-start; flex-direction: column; justify-content: center; padding-block: 1rem; gap: .25rem; }
}
.hero { padding-block: clamp(4rem, 10vw, 8rem) clamp(3rem, 7vw, 5rem); }
.hero h1 { margin-bottom: 1.25rem; }
.eyebrow { margin-bottom: .75rem; color: var(--trust-primary); font-size: .8rem; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; }
.hero-headline { max-width: 850px; margin-bottom: 1rem; font-size: clamp(1.35rem, 3vw, 2rem); line-height: 1.4; }
.hero-description { max-width: 680px; color: var(--trust-text-muted); font-size: 1.1rem; }
.pillar-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; padding-bottom: var(--trust-space-12); }
.page-section { padding-block: var(--trust-space-12); }
.page-section > h2 { margin-bottom: .75rem; }
.section-intro { max-width: 720px; color: var(--trust-text-muted); }
.card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-block: 2rem; }
.controls-toolbar { display: grid; grid-template-columns: minmax(220px, 1fr) auto; gap: 1rem; align-items: end; margin-block: 2rem; }
.search-label { grid-column: 1 / -1; margin-bottom: -.75rem; font-weight: 650; }
.search-input { width: 100%; min-height: 48px; padding: .65rem .8rem; border: 1px solid var(--trust-border); border-radius: var(--trust-radius-sm); color: var(--trust-text); }
.filter-group { display: flex; flex-wrap: wrap; gap: .5rem; }
.filter-button { min-height: 44px; padding: .55rem .85rem; border: 1px solid var(--trust-border); border-radius: 999px; background: #fff; color: var(--trust-text-muted); cursor: pointer; }
.filter-button[aria-pressed="true"] { border-color: var(--trust-primary); background: #eaf5ef; color: var(--trust-primary); }
.empty-message { padding: 2rem; border: 1px dashed var(--trust-border); border-radius: var(--trust-radius-md); color: var(--trust-text-muted); text-align: center; }
.breadcrumbs { margin-bottom: 2rem; color: var(--trust-text-muted); font-size: .9rem; }
.breadcrumbs a { text-decoration: none; }
.review-date { margin-top: .75rem; color: var(--trust-text-muted); font-size: .9rem; }
.detail-summary { margin-top: 2rem; font-size: 1.25rem; }
.detail-description { max-width: 850px; color: var(--trust-text-muted); }
.control-item-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; padding: 0; list-style: none; }
@media (max-width: 768px) {
  .pillar-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .controls-toolbar { grid-template-columns: 1fr; }
  .search-label { grid-column: auto; margin: 0; }
  .control-item-list { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .pillar-grid, .card-grid { grid-template-columns: 1fr; }
  .hero { padding-top: 3.5rem; }
}
