/* Chrome 109 compatibility patch for Tailwind v4 nested output.
   Load after common.css. Keep this file minimal to avoid overriding the full site stylesheet. */

/* Tailwind v4 emits nested container media rules that Chrome 109 does not parse reliably. */
.container {
  width: 100%;
}

@media screen and (min-width: 41.14rem) {
  .container {
    max-width: 41.14rem;
  }
}

@media screen and (min-width: 54.86rem) {
  .container {
    max-width: 54.86rem;
  }
}

@media screen and (min-width: 70.86rem) {
  .container {
    max-width: 70.86rem;
  }
}

@media screen and (min-width: 85.71rem) {
  .container {
    max-width: 85.71rem;
  }
}

@media screen and (min-width: 100rem) {
  .container {
    max-width: 100rem;
  }
}

/* sm variants used by the static pages. */
@media screen and (min-width: 41.14rem) {
  .sm\:left-7 { left: calc(var(--spacing) * 7); }
  .sm\:mt-5 { margin-top: calc(var(--spacing) * 5); }
  .sm\:mt-7 { margin-top: calc(var(--spacing) * 7); }
  .sm\:mt-9 { margin-top: calc(var(--spacing) * 9); }
  .sm\:mt-13 { margin-top: calc(var(--spacing) * 13); }
  .sm\:min-h-70 { min-height: calc(var(--spacing) * 70); }
  .sm\:gap-3 { gap: calc(var(--spacing) * 3); }
  .sm\:gap-5 { gap: calc(var(--spacing) * 5); }
  .sm\:gap-7 { gap: calc(var(--spacing) * 7); }
  .sm\:gap-10 { gap: calc(var(--spacing) * 10); }
  .sm\:p-3 { padding: calc(var(--spacing) * 3); }
  .sm\:p-5 { padding: calc(var(--spacing) * 5); }
  .sm\:p-7 { padding: calc(var(--spacing) * 7); }
  .sm\:px-4 { padding-left: calc(var(--spacing) * 4); padding-right: calc(var(--spacing) * 4); }
  .sm\:px-7 { padding-left: calc(var(--spacing) * 7); padding-right: calc(var(--spacing) * 7); }
  .sm\:py-7 { padding-top: calc(var(--spacing) * 7); padding-bottom: calc(var(--spacing) * 7); }
  .sm\:py-13 { padding-top: calc(var(--spacing) * 13); padding-bottom: calc(var(--spacing) * 13); }
  .sm\:py-14 { padding-top: calc(var(--spacing) * 14); padding-bottom: calc(var(--spacing) * 14); }
  .sm\:pt-7 { padding-top: calc(var(--spacing) * 7); }
  .sm\:text-\[12px\] { font-size: 12px; }
  .sm\:text-\[16px\] { font-size: 16px; }
  .sm\:text-\[17px\] { font-size: 17px; }
  .sm\:text-\[32px\] { font-size: 32px; }
  .sm\:text-\[34px\] { font-size: 34px; }
  .sm\:text-\[36px\] { font-size: 36px; }
  .sm\:text-\[38px\] { font-size: 38px; }
  .sm\:text-\[38px\]\/13 { font-size: 38px; line-height: calc(var(--spacing) * 13); }
  .sm\:text-\[42px\] { font-size: 42px; }
}

/* md variants. These fix the desktop header/mobile header switch in Chrome 109. */
@media screen and (min-width: 54.86rem) {
  .md\:absolute { position: absolute; }
  .md\:right-0 { right: 0; }
  .md\:bottom-0 { bottom: 0; }
  .md\:left-0 { left: 0; }
  .md\:left-8 { left: calc(var(--spacing) * 8); }
  .md\:col-span-2 { grid-column: span 2 / span 2; }
  .md\:mx-0 { margin-left: 0; margin-right: 0; }
  .md\:mt-6 { margin-top: calc(var(--spacing) * 6); }
  .md\:mt-8 { margin-top: calc(var(--spacing) * 8); }
  .md\:mt-10 { margin-top: calc(var(--spacing) * 10); }
  .md\:mt-12 { margin-top: calc(var(--spacing) * 12); }
  .md\:mt-14 { margin-top: calc(var(--spacing) * 14); }
  .md\:mb-3 { margin-bottom: calc(var(--spacing) * 3); }
  .md\:block { display: block; }
  .md\:flex { display: flex; }
  .md\:hidden { display: none; }
  .md\:h-7 { height: calc(var(--spacing) * 7); }
  .md\:h-9 { height: calc(var(--spacing) * 9); }
  .md\:h-13 { height: calc(var(--spacing) * 13); }
  .md\:h-\[35vw\] { height: 35vw; }
  .md\:h-full { height: 100%; }
  .md\:max-h-full { max-height: 100%; }
  .md\:max-h-screen { max-height: 100vh; }
  .md\:min-h-80 { min-height: calc(var(--spacing) * 80); }
  .md\:min-h-92 { min-height: calc(var(--spacing) * 92); }
  .md\:w-7 { width: calc(var(--spacing) * 7); }
  .md\:w-9 { width: calc(var(--spacing) * 9); }
  .md\:w-60 { width: calc(var(--spacing) * 60); }
  .md\:w-\[48\%\] { width: 48%; }
  .md\:w-\[50\%\] { width: 50%; }
  .md\:w-\[300px\] { width: 300px; }
  .md\:w-auto { width: auto; }
  .md\:max-w-\[60\%\] { width: 60%; max-width: 60%; }
  .md\:flex-1 { flex: 1; }
  .md\:basis-\[180px\] { flex-basis: 180px; }
  .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .md\:flex-row { flex-direction: row; }
  .md\:items-center { align-items: center; }
  .md\:items-start { align-items: flex-start; }
  .md\:gap-4 { gap: calc(var(--spacing) * 4); }
  .md\:gap-6 { gap: calc(var(--spacing) * 6); }
  .md\:gap-8 { gap: calc(var(--spacing) * 8); }
  .md\:gap-10 { gap: calc(var(--spacing) * 10); }
  .md\:gap-12 { gap: calc(var(--spacing) * 12); }
  .md\:gap-x-8 { column-gap: calc(var(--spacing) * 8); }
  .md\:bg-\[url\(\.\.\/images\/index-answer\.png\)\] { background-image: url(../images/index-answer.png); }
  .md\:p-4 { padding: calc(var(--spacing) * 4); }
  .md\:p-5 { padding: calc(var(--spacing) * 5); }
  .md\:p-6 { padding: calc(var(--spacing) * 6); }
  .md\:p-8 { padding: calc(var(--spacing) * 8); }
  .md\:px-6 { padding-left: calc(var(--spacing) * 6); padding-right: calc(var(--spacing) * 6); }
  .md\:px-8 { padding-left: calc(var(--spacing) * 8); padding-right: calc(var(--spacing) * 8); }
  .md\:py-8 { padding-top: calc(var(--spacing) * 8); padding-bottom: calc(var(--spacing) * 8); }
  .md\:py-13 { padding-top: calc(var(--spacing) * 13); padding-bottom: calc(var(--spacing) * 13); }
  .md\:py-14 { padding-top: calc(var(--spacing) * 14); padding-bottom: calc(var(--spacing) * 14); }
  .md\:py-16 { padding-top: calc(var(--spacing) * 16); padding-bottom: calc(var(--spacing) * 16); }
  .md\:pt-8 { padding-top: calc(var(--spacing) * 8); }
  .md\:pr-12 { padding-right: calc(var(--spacing) * 12); }
  .md\:pl-12 { padding-left: calc(var(--spacing) * 12); }
  .md\:text-left { text-align: left; }
  .md\:text-\[13px\] { font-size: 13px; }
  .md\:text-\[17px\] { font-size: 17px; }
  .md\:text-\[18px\] { font-size: 18px; }
  .md\:text-\[26px\] { font-size: 26px; }
  .md\:text-\[32px\] { font-size: 32px; }
  .md\:text-\[36px\] { font-size: 36px; }
  .md\:text-\[40px\] { font-size: 40px; }
  .md\:text-\[42px\] { font-size: 42px; }
  .md\:text-\[42px\]\/14 { font-size: 42px; line-height: calc(var(--spacing) * 14); }
  .md\:text-\[44px\] { font-size: 44px; }
}

/* lg variants used by content grids and desktop-only blocks. */
@media screen and (min-width: 70.86rem) {
  .lg\:left-9 { left: calc(var(--spacing) * 9); }
  .lg\:order-first { order: -9999; }
  .lg\:order-last { order: 9999; }
  .lg\:col-span-2 { grid-column: span 2 / span 2; }
  .lg\:col-span-3 { grid-column: span 3 / span 3; }
  .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .lg\:grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .lg\:-mt-20 { margin-top: calc(var(--spacing) * -20); }
  .lg\:mt-7 { margin-top: calc(var(--spacing) * 7); }
  .lg\:mt-9 { margin-top: calc(var(--spacing) * 9); }
  .lg\:mt-11 { margin-top: calc(var(--spacing) * 11); }
  .lg\:mt-14 { margin-top: calc(var(--spacing) * 14); }
  .lg\:mt-15 { margin-top: calc(var(--spacing) * 15); }
  .lg\:mb-4 { margin-bottom: calc(var(--spacing) * 4); }
  .lg\:hidden { display: none; }
  .lg\:h-10 { height: calc(var(--spacing) * 10); }
  .lg\:h-14 { height: calc(var(--spacing) * 14); }
  .lg\:min-h-90 { min-height: calc(var(--spacing) * 90); }
  .lg\:w-10 { width: calc(var(--spacing) * 10); }
  .lg\:max-w-\[50\%\] { max-width: 50%; }
  .lg\:gap-x-10 { column-gap: calc(var(--spacing) * 10); }
  .lg\:text-\[44px\] { font-size: 44px; }
  .lg\:text-\[46px\] { font-size: 44px; }
  .lg\:text-\[46px\]\/15 { font-size: 46px; line-height: calc(var(--spacing) * 15); }

}

/* xl variants used by the desktop navigation. */
@media screen and (min-width: 85.71rem) {
  .xl\:gap-x-12 { column-gap: calc(var(--spacing) * 12); }
  .xl\:text-\[48px\] { font-size: 48px; }
  .xl\:text-\[50px\] { font-size: 48px; }
  .xl\:text-\[50px\]\/16 { font-size: 50px; line-height: calc(var(--spacing) * 16); }
}

/* Hover variants emitted with CSS nesting by Tailwind v4. */
@media (hover: hover) {
  .hover\:border-\[\#38b2e2\]:hover { border-color: #38b2e2; }
  .hover\:border-\[\#069ED8\]:hover { border-color: #069ED8; }
  .hover\:border-\[\#D8DFFF\]:hover { border-color: #D8DFFF; }
  .hover\:border-blue-400:hover { border-color: var(--color-blue-400); }
  .hover\:bg-\[\#001A88\]:hover { background-color: #001A88; }
  .hover\:bg-\[\#38b2e2\]:hover { background-color: #38b2e2; }
  .hover\:bg-\[\#069ED8\]:hover { background-color: #069ED8; }
  .hover\:bg-\[\#E6F5FB\]:hover { background-color: #E6F5FB; }
  .hover\:bg-\[\#F4F8FF\]:hover { background-color: #F4F8FF; }
  .hover\:bg-\[\#d1dff7\]:hover { background-color: #d1dff7; }
  .hover\:text-\[\#001A88\]:hover { color: #001A88; }
  .hover\:text-\[\#069ED8\]:hover { color: #069ED8; }
  .hover\:text-\[\#fff\]:hover { color: #fff; }
  .hover\:underline:hover { text-decoration-line: underline; }
}

/* group-hover fallback for dropdown navigation. */
@media (hover: hover) {
  .group:hover .group-hover\:block { display: block; }
  .group:hover .group-hover\:text-\[\#001A88\] { color: #001A88; }
  .group:hover .group-hover\:opacity-100 { opacity: 1; }
  .group:hover .group-hover\:rotate-180 { transform: rotate(180deg); }
}

/* Pseudo-element variants emitted with CSS nesting by Tailwind v4. */
.after\:absolute::after { content: var(--tw-content); position: absolute; }
.after\:top-0::after { content: var(--tw-content); top: 0; }
.after\:top-1\/2::after { content: var(--tw-content); top: 50%; }
.after\:bottom-0::after { content: var(--tw-content); bottom: 0; }
.after\:left-0::after { content: var(--tw-content); left: 0; }
.after\:left-1\/2::after { content: var(--tw-content); left: 50%; }
.after\:z-\[-1\]::after { content: var(--tw-content); z-index: -1; }
.after\:h-20::after { content: var(--tw-content); height: calc(var(--spacing) * 20); }
.after\:h-40::after { content: var(--tw-content); height: calc(var(--spacing) * 40); }
.after\:h-full::after { content: var(--tw-content); height: 100%; }
.after\:w-\[1px\]::after { content: var(--tw-content); width: 1px; }
.after\:w-full::after { content: var(--tw-content); width: 100%; }
.after\:-translate-x-1\/2::after { content: var(--tw-content); transform: translateX(-50%); }
.after\:-translate-y-1\/2::after { content: var(--tw-content); transform: translateY(-50%); }
.after\:bg-gray-300::after { content: var(--tw-content); background-color: var(--color-gray-300); }
.after\:bg-slate-200::after { content: var(--tw-content); background-color: var(--color-slate-200); }
.after\:bg-\[linear-gradient\(180deg\,\#fff_0\%\,transparent_20\%\)\]::after { content: var(--tw-content); background-image: linear-gradient(180deg,#fff 0%,transparent 20%); }

@media screen and (min-width: 54.86rem) {
  .md\:after\:bg-\[linear-gradient\(90deg\,\#fff_0\%\,transparent_30\%\)\]::after {
    content: var(--tw-content);
    background-image: linear-gradient(90deg,#fff 0%,rgba(255,255,255,0) 30%);
  }

  .md\:after\:bg-\[linear-gradient\(270deg\,\#fff_0\%\,transparent_30\%\)\]::after {
    content: var(--tw-content);
    background-image: linear-gradient(270deg,#fff 0%,rgba(255,255,255,0) 30%);
  }
}

/* Fallback only for browsers that do not support individual transform properties. */
@supports not (translate: 0 0) {
  .-translate-x-1\/2 { transform: translateX(-50%); }
  .-translate-x-full { transform: translateX(-100%); }
  .translate-x-1\/2 { transform: translateX(50%); }
  .translate-x-full { transform: translateX(100%); }
}

@supports not (rotate: 180deg) {
  .rotate-180 { transform: rotate(180deg); }
}

/* Chrome 109-safe fallbacks for logical/modern shorthand used by common.css. */
.inset-0 { top: 0; right: 0; bottom: 0; left: 0; }
.rounded-full { border-radius: 9999px; }
.text-nowrap { white-space: nowrap; }
.text-wrap { white-space: normal; }
.bg-black\/40 { background-color: rgba(0, 0, 0, 0.4); }
.bg-black\/50 { background-color: rgba(0, 0, 0, 0.5); }

/* Chrome 109-safe fallback for the top toolbar gradient. */
.bg-gradient-to-r.from-\[\#001A88\].to-\[\#059CD6\] {
  background-color: #001A88;
  background-image: linear-gradient(to right, #001A88 0%, #059CD6 100%);
}

/* Fix hero image hairline artifacts caused by browser zoom and image resampling. */
.banner-swiper .md\:max-w-\[60\%\] img {
  max-width: none;
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  margin: -2px;
  object-fit: cover;
  backface-visibility: hidden;
}

.banner-swiper .after\:left-0::after {
  left: -2px;
}

.banner-swiper .after\:w-full::after {
  width: calc(100% + 4px);
}