/* IRK Site Fixes 1.0.3 */

/* 1. Resources guides: one column on phones and tablets.
   The grid column was sized to its content (520px), so text ran off the screen. */
@media (max-width: 900px) {
  .ir-w .rs-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 24px; }
  .ir-w .rs-grid > * { min-width: 0; }
  .ir-w .rs-toc { position: static; }
  .ir-w .rs-art table { display: block; max-width: 100%; overflow-x: auto; }
  .ir-w .rs-art img, .ir-w .rs-art iframe, .ir-w .rs-art video { max-width: 100%; height: auto; }
  .ir-w .rs-art { overflow-wrap: anywhere; }
}
.ir-w .ir-hero, .ir-w .rs-hero { overflow: hidden; }

/* 2. Homepage slider: hide the outgoing slide's text so titles never overlap. */
.n2-ss-slider .n2-ss-slide .n2-ss-layers-container { transition: opacity .25s ease; }
.n2-ss-slider .n2-ss-slide:not(.n2-ss-slide-active) .n2-ss-layers-container { opacity: 0 !important; }
@media (prefers-reduced-motion: reduce) {
  .n2-ss-slider .n2-ss-slide .n2-ss-layers-container { transition: none; }
}

/* Slider dots (added by site-fixes.js), shown on phones and small tablets */
.irk-dots { display: none; }
@media (max-width: 1024px) {
  .irk-dots { display: flex; justify-content: center; gap: 4px; padding: 10px 0 2px; }
}
.irk-dots button {
  width: 28px; height: 28px; padding: 0; border: 0; background: transparent; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
}
.irk-dots button::before {
  content: ""; width: 10px; height: 10px; border-radius: 50%;
  background: #c9d3e6; transition: background .2s, transform .2s;
}
.irk-dots button[aria-current="true"]::before { background: #0778D4; transform: scale(1.2); }
.irk-dots button:focus-visible { outline: 3px solid #0778D4; outline-offset: 1px; border-radius: 50%; }

/* 3. Live search suggestions */
.irk-sg {
  position: absolute; z-index: 10000; left: 0; right: 0; top: calc(100% + 6px);
  background: #fff; color: #0f1720; border: 1px solid #d5dbe6; border-radius: 6px;
  box-shadow: 0 10px 30px rgba(16, 33, 63, .14); max-height: 70vh; overflow: auto;
  font-family: Lato, Arial, sans-serif; text-align: left;
}
.irk-sg[hidden] { display: none; }
.irk-sg p { margin: 0; padding: 10px 16px 4px; font-size: 13px; color: #5a6475; }
.irk-sg ul { list-style: none; margin: 0; padding: 4px 0 8px; }
.irk-sg a {
  display: flex; justify-content: space-between; gap: 12px; padding: 10px 16px;
  color: #223A7B !important; text-decoration: none; font-size: 16px; line-height: 1.3;
}
.irk-sg a small { color: #5a6475; font-size: 13px; white-space: nowrap; }
.irk-sg a:hover, .irk-sg a[aria-selected="true"] { background: #eef4fb; color: #0778D4 !important; }
.irk-sg .all { border-top: 1px solid #e6eaf1; font-weight: 700; color: #0778D4 !important; }

/* 4. No search results: suggestions block */
.irk-nr { max-width: 780px; margin: 24px auto 48px; padding: 0 24px; font-family: Lato, Arial, sans-serif; }
.irk-nr h2 { font-family: "IR Brand", Lato, Arial, sans-serif; font-style: italic; color: #223A7B; font-size: 28px; margin: 0 0 12px; }
.irk-nr ul { list-style: none; padding: 0; margin: 0 0 24px; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.irk-nr a { display: block; padding: 14px 16px; border: 1px solid #d5dbe6; border-left: 4px solid #0778D4; color: #223A7B; text-decoration: none; font-weight: 700; }
.irk-nr a:hover { background: #eef4fb; }

/* 5. "Where we work" menu card (added by site-fixes.js) keeps the other cards' styles. */
.hd-cd.irk-where img { object-fit: cover; }

/* 6. Contact page and all Fluent Forms: brand colours and clearer buttons */
.fluentform a { color: #0778D4 !important; text-decoration: underline; }
.fluentform .ff-btn-submit {
  background: #0778D4 !important; border: 0 !important; border-radius: 0 !important;
  font-family: "IR Brand", Lato, Arial, sans-serif !important; font-weight: 700 !important;
  font-size: 19px !important; padding: 14px 28px !important; color: #fff !important;
}
.fluentform .ff-btn-submit:hover { background: #223A7B !important; }
.fluentform .ff-el-input--label label { font-weight: 700; color: #0F1720; }
.fluentform .ff-el-form-control:focus { border-color: #0778D4 !important; box-shadow: 0 0 0 3px rgba(7,120,212,.2) !important; }
.page-id-205 .e-n-tab-title { border-radius: 0 !important; font-weight: 700; }
.page-id-205 .e-n-tab-title[aria-selected="true"] { background: #0778D4 !important; color: #fff !important; }
.page-id-205 .e-n-tab-title:focus-visible { outline: 3px solid #FCDE1E; outline-offset: 2px; }
