.utility-hero { padding: 12px 0 46px; }
.utility-hero-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(460px, 1.1fr); gap: 28px; align-items: center; padding: 30px; border: 1px solid var(--site-page-line, var(--stp-line)); border-radius: 7px; background: var(--site-page-surface, var(--stp-surface)); box-shadow: var(--site-shadow-card); }
.utility-hero-grid > div { min-width: 0; }
.utility-hero-grid h1 { margin: 14px 0 18px; color: var(--site-page-text, var(--stp-text)); font-size: 54px; font-weight: 900; line-height: 1.03; }
.utility-hero-grid p { margin: 0; color: var(--site-page-muted, var(--stp-muted)); font-size: 18px; line-height: 1.6; }
.utility-hero-grid > img { width: 100%; height: 420px; object-fit: cover; border: 1px solid var(--site-page-line, var(--stp-line)); border-radius: 6px; }

.utility-gallery-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.utility-gallery-grid figure { overflow: hidden; margin: 0; border: 1px solid var(--site-page-line, var(--stp-line)); border-radius: 7px; background: var(--site-page-surface, var(--stp-surface)); box-shadow: var(--site-shadow-card); }
.utility-gallery-grid a { display: block; overflow: hidden; }
.utility-gallery-grid img { width: 100%; height: 380px; object-fit: cover; transition: transform 180ms ease; }
.utility-gallery-grid a:hover img, .utility-gallery-grid a:focus-visible img { transform: scale(1.02); }
.utility-gallery-grid figcaption { padding: 14px 16px; color: var(--site-page-text, var(--stp-text)); font-size: 16px; font-weight: 800; }

.utility-search-section { min-height: 680px; padding: 42px 0 76px; }
.utility-search-shell { padding: 38px; border: 1px solid var(--site-page-line, var(--stp-line)); border-radius: 7px; background: var(--site-page-surface, var(--stp-surface)); box-shadow: var(--site-shadow-card); }
.utility-search-copy { max-width: 820px; }
.utility-search-copy h1 { margin: 14px 0 16px; color: var(--site-page-text, var(--stp-text)); font-size: 54px; font-weight: 900; line-height: 1.04; }
.utility-search-copy p { margin: 0; color: var(--site-page-muted, var(--stp-muted)); font-size: 18px; line-height: 1.6; }
.utility-search-form { margin-top: 28px; }
.utility-search-form > label { display: block; margin-bottom: 8px; color: var(--site-page-text, var(--stp-text)); font-weight: 850; }
.utility-search-form > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
.utility-search-form input { min-width: 0; min-height: 56px; padding: 0 16px; border: 1px solid var(--site-page-line, var(--stp-line)); border-radius: 6px; background: var(--site-page-surface-strong, var(--stp-surface-strong)); color: var(--site-page-text, var(--stp-text)); font-size: 17px; }
.utility-search-form button { min-width: 148px; min-height: 56px; padding: 0 22px; border: 1px solid var(--stp-brick); border-radius: 6px; background: var(--stp-brick); color: #fff; font-weight: 900; cursor: pointer; }
.utility-search-form button:hover, .utility-search-form button:focus-visible { background: var(--stp-brick-strong, #c8200d); }
.utility-search-status { margin: 22px 0 12px; color: var(--site-page-muted, var(--stp-muted)); font-size: 15px; }
.utility-search-results { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.utility-search-result { display: grid; gap: 8px; min-width: 0; padding: 20px; border: 1px solid var(--site-page-line, var(--stp-line)); border-radius: 7px; background: var(--site-page-soft, var(--stp-soft)); text-decoration: none; }
.utility-search-result h2 { margin: 0; color: var(--site-page-text, var(--stp-text)); font-size: 21px; line-height: 1.18; }
.utility-search-result p { margin: 0; color: var(--site-page-muted, var(--stp-muted)); font-size: 14px; line-height: 1.5; }
.utility-search-result:hover, .utility-search-result:focus-visible { border-color: var(--stp-brick); }
.utility-search-empty { padding: 20px; border: 1px dashed var(--site-page-line, var(--stp-line)); border-radius: 7px; color: var(--site-page-muted, var(--stp-muted)); }

.not-found-section { min-height: 680px; display: grid; align-items: center; padding: 64px 0; }
.not-found-grid { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 28px; align-items: center; }
.not-found-grid > div { padding: 44px; border: 1px solid var(--site-page-line, var(--stp-line)); border-radius: 7px; background: var(--site-page-surface, var(--stp-surface)); box-shadow: var(--site-shadow-card); }
.not-found-code { display: block; color: var(--stp-brick); font-size: 88px; font-weight: 950; line-height: .9; }
.not-found-grid h1 { margin: 16px 0; color: var(--site-page-text, var(--stp-text)); font-size: 52px; font-weight: 900; line-height: 1.04; }
.not-found-grid p { margin: 0; color: var(--site-page-muted, var(--stp-muted)); font-size: 18px; line-height: 1.6; }
.not-found-grid aside { display: grid; gap: 7px; padding: 24px; border: 1px solid var(--site-page-line, var(--stp-line)); border-radius: 7px; background: var(--site-page-surface, var(--stp-surface)); }
.not-found-grid aside strong { margin-bottom: 5px; color: var(--site-page-text, var(--stp-text)); font-size: 20px; }
.not-found-grid aside a { padding: 12px; border-radius: 5px; color: var(--site-page-text, var(--stp-text)); font-weight: 800; text-decoration: none; }
.not-found-grid aside a:hover, .not-found-grid aside a:focus-visible { background: var(--site-page-soft, var(--stp-soft)); color: var(--stp-brick); }

.site-page.stp-theme-dark .utility-hero-grid,
.site-page.stp-theme-dark .utility-gallery-grid figure,
.site-page.stp-theme-dark .utility-search-shell,
.site-page.stp-theme-dark .not-found-grid > div,
.site-page.stp-theme-dark .not-found-grid aside { background: rgba(20, 27, 34, .94); }

@media (max-width: 900px) {
  .utility-hero-grid,
  .not-found-grid { grid-template-columns: minmax(0, 1fr); }
  .utility-hero-grid > img { height: 330px; }
}

@media (max-width: 700px) {
  .utility-hero-grid,
  .utility-search-shell,
  .not-found-grid > div { padding: 22px; }
  .utility-hero-grid h1,
  .utility-search-copy h1,
  .not-found-grid h1 { font-size: 32px; }
  .utility-gallery-grid,
  .utility-search-results { grid-template-columns: minmax(0, 1fr); }
  .utility-gallery-grid img { height: 260px; }
  .utility-search-form > div { grid-template-columns: minmax(0, 1fr); }
  .utility-search-form button { width: 100%; }
  .not-found-code { font-size: 68px; }
}

