/* Images are treated as content, not full-panel decoration. */
.detail-head {
  grid-template-columns: minmax(0, 1fr) minmax(240px, 34%);
  min-height: 190px;
  padding: 24px 26px;
  border: 1px solid #dfe6ee;
  border-left: 4px solid #f49a24;
  background: #fff;
  color: #17263a;
  box-shadow: 0 5px 16px rgba(19, 32, 51, .06);
}
.detail-head::before, .detail-head::after { display: none; }
.detail-head h1 { margin-top: 0; }
.detail-head-category { color: #9b611e; border-color: #efc98f; background: #fff7e9; }
.detail-head-media { width: 100%; height: 140px; margin: 0; overflow: hidden; border-radius: 6px; text-align: initial; }
.detail-head-media img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 48%; }
.detail-context-visual { position: relative; min-height: 150px; margin: 0; overflow: hidden; border-radius: 8px; background: #172b3d; box-shadow: 0 7px 18px rgba(24, 43, 61, .1); }
.detail-context-visual::after { content: ""; position: absolute; inset: 0; pointer-events: none; }
.detail-context-visual::after { background: linear-gradient(90deg, rgba(15, 32, 48, .72), rgba(15, 32, 48, .08) 72%), linear-gradient(0deg, rgba(15, 32, 48, .56), transparent 62%); }
.detail-context-visual img { display: block; width: 100%; height: 150px; object-fit: cover; }
.detail-context-support img { object-position: center 46%; }
.detail-context-visual figcaption { position: absolute; z-index: 1; display: flex; flex-direction: column; color: #fff; }
.detail-context-visual figcaption { left: 22px; bottom: 17px; gap: 5px; }
.detail-context-visual figcaption strong { font-size: 14px; }
.detail-context-visual figcaption span { color: #ffc75c; font: 800 9px "DM Sans", sans-serif; letter-spacing: .14em; }
/* Evidence band: text panel on the left, image on the right, so the photo is never cropped to a sliver. */
.detail-context-evidence { display: block; height: 158px; min-height: 158px; padding: 0; }
.detail-context-evidence img { position: absolute; inset: 0 0 0 auto; width: 42%; height: 100%; object-position: center 40%; -webkit-mask-image: linear-gradient(90deg, transparent, #000 30%); mask-image: linear-gradient(90deg, transparent, #000 30%); }
.detail-context-evidence::after { background: linear-gradient(90deg, #14283a 0%, rgba(20, 40, 58, .96) 30%, rgba(20, 40, 58, .45) 56%, rgba(20, 40, 58, 0) 80%); }
.detail-context-evidence figcaption { left: 26px; right: 42%; top: 50%; bottom: auto; gap: 6px; transform: translateY(-50%); }
.detail-context-evidence figcaption strong { font-size: 18px; }
.detail-context-evidence figcaption p { margin: 3px 0 0; color: #cbd8e4; font-size: 11.5px; line-height: 1.75; }

.appeal-types-hero { min-height: 215px; padding: 26px 30px; border: 1px solid #dfe6ee; border-left: 4px solid #f49a24; background: #fff; color: #17263a; box-shadow: 0 5px 16px rgba(19, 32, 51, .06); }
.appeal-types-hero .hero-grid, .appeal-types-hero .hero-orb { display: none; }
.appeal-types-hero .hero-content { max-width: 62%; }
.appeal-types-hero .hero-eyebrow { color: #955912; }
.appeal-types-hero p { color: #41505f; }
.appeal-types-hero .hero-facts { color: #41505f; }
.appeal-types-hero .hero-facts strong { color: #ff9900; }
.appeal-types-hero .hero-facts i { background: #dfe6ee; }
.appeal-types-visual { width: 34%; height: 158px; margin: 0; overflow: hidden; border-radius: 6px; }
.appeal-types-visual img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }

.module-intro.image-intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(250px, 32%); align-items: stretch; min-height: 166px; overflow: hidden; margin: 14px 0 24px; padding: 0; border: 1px solid #dfe6ee; border-left: 4px solid #f49a24; border-radius: 8px; background: #fff; box-shadow: 0 5px 16px rgba(19, 32, 51, .06); }
.module-intro.image-intro > div:first-child { align-self: center; padding: 22px 27px; }
.module-intro.image-intro .eyebrow { color: #8e5d20; }
.module-intro.image-intro h1 { margin: 8px 0; color: #17263a; }
body[data-page="risk"] .module-intro.image-intro h1,
body[data-page="ip"] .module-intro.image-intro h1,
body[data-page="appeal-qa"] .module-intro.image-intro h1,
body[data-page="policy"] .module-intro.image-intro h1 { margin-top: 0; }
.module-intro.image-intro h1 em { color: #748496; }
.module-intro.image-intro p { max-width: 720px; color: #41505f !important; }
.module-intro.image-intro .module-badge, .module-intro.image-intro .outline-action { display: inline-flex; width: max-content; margin-top: 13px; border-color: #e3e9ef; color: #52677b; background: #f8fafc; }
.module-intro-visual { min-width: 0; height: 100%; min-height: 164px; margin: 0; overflow: hidden; }
.module-intro-visual img { display: block; width: 100%; height: 100%; object-fit: cover; }
.image-intro-risk .module-intro-visual img { object-position: 55% 43%; }
.image-intro-ip .module-intro-visual img { object-position: 58% center; }
.image-intro-qa .module-intro-visual img { object-position: center 48%; }
.image-intro-policy { display: block !important; min-height: auto !important; padding: 22px 27px !important; }
.image-intro-policy > div:first-child { padding: 0 !important; }

.dashboard-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(330px, 38%);
  min-height: 176px;
  overflow: hidden;
  padding: 0;
  border-top-width: 1px;
  border-left: 4px solid #f49a24;
  background: #fff;
  box-shadow: 0 5px 16px rgba(19, 32, 51, .06);
}
.dashboard-intro-copy { align-self: center; padding: 22px 27px; }
.dashboard-intro .eyebrow { color: #8b5e29; }
.dashboard-intro h1 { color: #17263a; }
.dashboard-intro p { color: #41505f !important; }
.dashboard-intro-actions { margin-top: 15px; }
.dashboard-intro-visual { position: relative; height: 100%; min-height: 174px; margin: 0; overflow: hidden; background: #172b3d; }
.dashboard-intro-visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(16, 34, 51, .54), transparent 58%); pointer-events: none; }
.dashboard-intro-visual > img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 62% center; }
.dashboard-intro-visual figcaption { position: absolute; z-index: 1; left: 18px; bottom: 15px; display: flex; align-items: center; gap: 9px; color: #fff; }
.dashboard-intro-visual figcaption > i { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, .38); border-radius: 6px; background: rgba(19, 38, 57, .48); }
.dashboard-intro-visual figcaption strong, .dashboard-intro-visual figcaption small { display: block; }
.dashboard-intro-visual figcaption strong { font-size: 11px; }
.dashboard-intro-visual figcaption small { margin-top: 3px; color: #f4d59c; font-size: 9px; }
.home-tool-entry { grid-template-columns: 104px auto minmax(0, 1fr) auto; padding: 8px 13px 8px 8px; }
.home-tool-thumb { width: 104px; height: 64px; overflow: hidden; border-radius: 5px; background: #eef2f5; }
.home-tool-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.risk-entry .home-tool-thumb img { object-position: 55% 42%; }
.ip-entry .home-tool-thumb img { object-position: 58% center; }
.home-tool-icon { width: 34px; height: 34px; }

body[data-page="cases"] .case-pagination { max-width: 100%; flex-wrap: wrap; }

.services-hero.services-hero-image { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(390px, 39%); min-height: 260px; height: 260px; overflow: hidden; padding: 0; border: 1px solid #d7e0e8; border-left: 4px solid #f49a24; background: #fff; box-shadow: 0 10px 26px rgba(19, 32, 51, .09); }
.services-hero-copy { align-self: center; min-width: 0; padding: 28px 34px; }
.services-hero-image h1 { margin: 0 0 7px; color: #17263a; }
.services-hero-image h1 em { color: #748496; }
.services-hero-image p { max-width: 710px; color: #41505f !important; }
.services-hero-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 13px; }
.services-hero-tags span { display: inline-flex; align-items: center; gap: 6px; min-height: 25px; padding: 3px 8px; border: 1px solid #e1e7ed; border-radius: 5px; color: #50657a; background: #f8fafc; font-size: 9px; font-weight: 700; }
.services-hero-tags i { color: #995709; font-size: 9px; }
.services-hero-actions { display: flex; align-items: center; gap: 18px; margin-top: 15px; }
.services-hero-primary { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 36px; padding: 0 14px; border-radius: 6px; color: #fff; background: #172c42; font-size: 10px; font-weight: 800; text-decoration: none; box-shadow: 0 5px 12px rgba(23,44,66,.18); transition: color .2s ease, background .2s ease, transform .2s ease, box-shadow .2s ease; }
.services-hero-primary:hover { color: #fff; background: #243e58; transform: translateY(-2px); box-shadow: 0 8px 17px rgba(23,44,66,.24); }
.services-hero-link { display: inline-flex; align-items: center; gap: 7px; color: #995809; font-size: 10px; font-weight: 800; text-decoration: none; }
.services-hero-link:hover { color: #9c5500; }
.services-hero-primary:focus-visible, .services-hero-link:focus-visible { outline: 2px solid #f39a22; outline-offset: 3px; }
.services-hero-visual { position: relative; height: 230px; min-height: 0; margin: 14px 14px 14px 0; overflow: hidden; border-radius: 7px; background: #172c42; box-shadow: 0 8px 20px rgba(18,38,57,.18); }
.services-hero-visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(15, 32, 49, .75), transparent 62%); pointer-events: none; }
.services-hero-visual img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 45%; }
.services-hero-visual figcaption { position: absolute; z-index: 1; left: 18px; bottom: 15px; color: #fff; }
.services-hero-visual figcaption strong, .services-hero-visual figcaption span, .services-hero-visual figcaption small { display: block; }
.services-hero-visual figcaption strong { color: #ffc75c; font: 700 30px/1 'DM Sans'; }
.services-hero-visual figcaption span { margin-top: 4px; font-size: 11px; font-weight: 700; }
.services-hero-visual figcaption small { margin-top: 4px; color: #d5dfe7; font-size: 9px; }

@media (max-width: 760px) {
  .detail-head { grid-template-columns: 1fr; min-height: auto; padding: 20px; }
  .detail-head-media { display: block; justify-self: stretch; height: 120px; }
  .detail-context-visual, .detail-context-visual img { min-height: 120px; height: 120px; }
  .detail-context-evidence { display: flex; flex-direction: column; height: auto; min-height: 0; }
  .detail-context-evidence img { position: static; inset: auto; width: 100%; height: 118px; object-position: center 38%; -webkit-mask-image: none; mask-image: none; }
  .detail-context-evidence::after { display: none; }
  .detail-context-evidence figcaption { position: static; left: auto; right: auto; top: auto; bottom: auto; gap: 4px; padding: 13px 15px 15px; background: #14283a; transform: none; }
  .detail-context-evidence figcaption strong { font-size: 15px; }
  .detail-context-evidence figcaption p { font-size: 11px; line-height: 1.7; }
  .detail-context-visual figcaption { left: 16px; bottom: 14px; }
  .module-intro.image-intro { grid-template-columns: 1fr; min-height: auto; margin: 4px 0 20px; }
  .module-intro.image-intro > div:first-child { padding: 19px 17px; }
  .module-intro-visual { min-height: 118px; height: 118px; }
  .image-intro-policy { padding: 19px 17px !important; }
  .appeal-types-hero { display: grid; min-height: auto; padding: 20px; }
  .appeal-types-hero .hero-content, .appeal-types-visual { width: 100%; max-width: none; }
  .appeal-types-visual { height: 118px; margin-top: 18px; }
  .dashboard-intro { display: grid; grid-template-columns: 1fr; min-height: auto; }
  .dashboard-intro-copy { padding: 19px 17px; }
  .dashboard-intro-visual { min-height: 130px; height: 130px; }
  .home-tool-entry { grid-template-columns: 82px minmax(0, 1fr) auto; }
  .home-tool-thumb { width: 82px; height: 58px; }
  .home-tool-icon { display: none; }
  .services-hero.services-hero-image { grid-template-columns: 1fr; height: auto; min-height: auto; padding: 0; }
  .services-hero-copy { padding: 21px 18px 19px; }
  .services-hero-tags { gap: 5px; }
  .services-hero-actions { flex-wrap: wrap; gap: 13px; }
  .services-hero-visual { min-height: 138px; height: 138px; margin: 0 10px 10px; }
}
