/* Industries page. Uses the Contract Vehicles components (contracts.css, contracts.js); these rules add
   the industry photographs, the icon list in the hero panel and the solution groups in each detail. */
.ind-card { padding-top: 0; overflow: hidden; }
.ind-photo { position: relative; margin: 0 -22px; aspect-ratio: 16 / 7; overflow: hidden; background: #041627; }
.ind-photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.ind-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, #041627 0%, #04162733 45%, transparent 75%); }
.ind-card:hover .ind-photo img, .ind-card:focus-within .ind-photo img { transform: scale(1.04); }
.ind-card-top { position: relative; z-index: 1; align-items: center; margin-top: -26px; }
.ind-icon { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 12px; border: 1px solid #56c8f1a6; background: linear-gradient(160deg, #0b3a5e, #05192b); box-shadow: 0 8px 18px #0007, 0 0 16px #1f9bff33; }
.ind-icon img { width: 26px; height: 26px; }
.ind-card .cv-agency { margin-top: 14px; }

/* Hero panel: one link per industry */
.ind-wall { list-style: none; padding: 0; margin: 20px 0 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.ind-wall a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; min-height: 92px; padding: 10px 6px; border-radius: 6px; border: 1px solid #3f86b4; background: linear-gradient(160deg, #0b3a5e, #05192b); color: #dcefff; font-size: 11px; font-weight: 700; line-height: 1.3; text-align: center; transition: transform .25s, box-shadow .25s, border-color .25s; }
.ind-wall a:hover, .ind-wall a:focus-visible { transform: translateY(-3px); border-color: #7fdcff; box-shadow: 0 0 16px #48c2ff80; color: #fff; }
.ind-wall img { width: 28px; height: 28px; }

/* Detail: solution groups as a two-column grid */
.cv-detail .ind-photo-small { flex: 0 0 auto; width: 150px; height: 96px; margin: 0; aspect-ratio: auto; border-radius: 8px; border: 1px solid #3f86b4; }
.cv-detail .ind-photo-small::after { display: none; }
.ind-solutions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ind-solution { padding: 16px 18px; border: 1px solid #24577c; border-radius: 8px; background: #06213a99; }
.ind-solution h5 { margin: 0 0 8px; font: 700 15px/1.3 Exo, Arial, sans-serif; color: #f2f9ff; }
.ind-solution .check-list { margin: 0; }
.cv-detail-side .check-list { margin: 0; }
.ind-cta-heading { font-family: Exo, Arial, sans-serif; font-size: 17px !important; font-weight: 700; line-height: 1.4 !important; color: #f2f9ff !important; margin-top: 22px !important; }
.ind-detail-contact { width: 100%; margin-top: 18px; }
.ind-help-card { grid-column: span 1; grid-template-columns: minmax(0, 1fr); align-content: start; }
.ind-help-card .cv-card-actions { grid-column: 1; flex-direction: column; align-items: stretch; }

@media (prefers-reduced-motion: reduce) { .ind-photo img { transition: none; } .ind-card:hover .ind-photo img { transform: none; } }
@media (max-width: 1100px) {
  .ind-wall { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .ind-photo { margin: 0 -18px; }
  .ind-solutions { grid-template-columns: minmax(0, 1fr); }
  .ind-wall { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cv-detail .ind-photo-small { width: 96px; height: 64px; }
}
.ind-card { scroll-margin-top: 110px; }
/* The industry a visitor linked to (for example from the Home page) is highlighted. */
.ind-card.is-linked { border-color: #8ae6ff; box-shadow: 0 0 0 2px #8ae6ff66, 0 0 30px #1f9bff55; }
.ind-card:focus { outline: none; }
.ind-card:focus-visible { outline: 2px solid #8ae6ff; outline-offset: 3px; }

/* Larger industry details window: wider and taller, with bigger text than the contract details. */
body[data-page="industries"] .cv-dialog { width: min(1360px, calc(100% - 48px)); max-height: calc(100dvh - 32px); }
body[data-page="industries"] .cv-dialog-bar { padding: 14px 22px 14px 36px; }
body[data-page="industries"] .cv-dialog-bar .micro-label { font-size: 12px; }
body[data-page="industries"] .cv-dialog-body { padding: 8px 36px 36px; }
body[data-page="industries"] .cv-dialog .cv-detail-header { gap: 26px; }
body[data-page="industries"] .cv-dialog .ind-photo-small { width: 220px; height: 140px; }
body[data-page="industries"] .cv-dialog .cv-detail .cv-agency { font-size: 13px; }
body[data-page="industries"] .cv-dialog .cv-detail h3 { font-size: 38px; }
body[data-page="industries"] .cv-dialog .cv-detail .cv-full-name { font-size: 17px; margin-top: 6px; }
body[data-page="industries"] .cv-dialog .cv-detail-body { gap: 52px; margin-top: 30px; }
body[data-page="industries"] .cv-dialog .cv-detail h4 { font-size: 13px; margin: 28px 0 12px; }
body[data-page="industries"] .cv-dialog .cv-detail h4:first-child { margin-top: 0; }
body[data-page="industries"] .cv-dialog .cv-detail p { font-size: 16.5px; line-height: 1.75; }
body[data-page="industries"] .cv-dialog .ind-solutions { gap: 18px; }
body[data-page="industries"] .cv-dialog .ind-solution { padding: 20px 22px; }
body[data-page="industries"] .cv-dialog .ind-solution h5 { font-size: 18px; margin-bottom: 10px; }
body[data-page="industries"] .cv-dialog .cv-detail .check-list li { font-size: 15.5px; }
body[data-page="industries"] .cv-dialog .cv-detail-side { padding: 28px; }
body[data-page="industries"] .cv-dialog .cv-links li { font-size: 15px; }
body[data-page="industries"] .cv-dialog .ind-cta-heading { font-size: 20px !important; }
body[data-page="industries"] .cv-dialog .ind-detail-contact { min-height: 50px; font-size: 12px; }
@media (max-width: 760px) {
  body[data-page="industries"] .cv-dialog { width: calc(100% - 16px); max-height: calc(100dvh - 16px); }
  body[data-page="industries"] .cv-dialog-bar { padding-left: 18px; }
  body[data-page="industries"] .cv-dialog-body { padding: 0 18px 24px; }
  body[data-page="industries"] .cv-dialog .ind-photo-small { width: 100%; height: 150px; }
  body[data-page="industries"] .cv-dialog .cv-detail h3 { font-size: 30px; }
  body[data-page="industries"] .cv-dialog .cv-detail .cv-full-name { font-size: 15px; }
  body[data-page="industries"] .cv-dialog .cv-detail p { font-size: 15.5px; }
  body[data-page="industries"] .cv-dialog .cv-detail-side { padding: 22px; }
}
