/* Interior pages on the homepage design. Loaded after homepage-preview.css. */
.ip-page { overflow-x: clip; background: var(--cream); color: var(--navy); }
.ip-page .mk-hero { padding: 96px 0 40px; background: transparent; }
.ip-page .mk-hero-shell.is-solo { grid-template-columns: 1fr; }
.ip-page .mk-hero h1 {
  max-width: 18ch;
  margin-top: 18px;
  font-size: clamp(2.35rem, 4.8vw, 4.15rem);
  text-wrap: balance;
}
.ip-page .mk-hero p.sub { max-width: 58ch; color: #2c3b55; }
.ip-page .ip-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.ip-page a.pill { text-decoration: none; }
.ip-page a.pill:hover { text-decoration: underline; text-underline-offset: 3px; }

.ip-page .section,
.ip-page .section-sm { position: relative; }
.ip-page .mk-hero + .section,
.ip-page .mk-hero + section.section,
.ip-page .mk-hero + section.section-sm { padding-top: 40px; }
.ip-page .section-head h2,
.ip-page .section-head.is-sans h2 {
  font: 400 clamp(2rem, 3.4vw, 3rem)/1.12 var(--font-display);
  letter-spacing: -0.01em;
  color: var(--navy);
  text-wrap: balance;
}
.ip-page .section-head p { color: #2c3b55; }

.ip-page .callout:not(.is-navy) {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 20px;
  box-shadow: var(--shadow-card);
}
.ip-page .link-card {
  border-radius: 20px;
  border-color: var(--line);
  box-shadow: var(--shadow-card);
}
.ip-page .link-card h3,
.ip-page .link-card h4 { color: var(--navy); text-wrap: balance; }
.ip-page .link-card p,
.ip-page .link-card .meta { color: #2c3b55; }
.ip-page .link-card:focus-visible { outline: 3px solid #8a4b04; outline-offset: 3px; }

.ip-page .prose {
  font-size: 1.0625rem;
  line-height: 1.7;
  color: #2c3b55;
  max-width: 68ch;
}
.ip-page .prose h2 {
  font: 400 clamp(1.55rem, 2.4vw, 2rem)/1.2 var(--font-display);
  letter-spacing: -0.01em;
  color: var(--navy);
  margin-top: 1.6em;
  text-wrap: balance;
  scroll-margin-top: 96px;
}
.ip-page .prose h3 { font: 600 1.15rem/1.35 var(--font-sans); color: var(--navy); }
.ip-page .prose p,
.ip-page .prose li { color: #2c3b55; }
.ip-page .prose a { color: var(--navy); text-underline-offset: 3px; }
.ip-page .prose strong { color: var(--navy); }
.ip-page .prose .lead { font-size: 1.15rem; color: #2c3b55; }

.ip-page .table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 20px;
  box-shadow: var(--shadow-card);
}
.ip-page .cmp { min-width: 640px; }
.ip-page .cmp .is-positive { color: #135f3f; font-weight: 600; }
.ip-page .cmp .is-negative { color: #8f1d1d; }
.ip-page .cmp .cell-note { color: #2c3b55; }

.ip-page .faq {
  background: transparent;
  color: var(--navy);
}
.ip-page .faq h2,
.ip-page .faq summary { color: var(--navy); }
.ip-page .faq-eyebrow { color: #4b5b78; }
.ip-page .faq details {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 2px 18px;
  margin-bottom: 10px;
}
.ip-page .faq details p,
.ip-page .faq-more,
.ip-page .faq-more a { color: #2c3b55; }
.ip-page .faq summary { min-height: 48px; }

.ip-page .arch {
  background: transparent;
  color: var(--navy);
  text-align: left;
  padding: 56px 0 72px;
}
.ip-page .arch::before { content: none; }
.ip-page .arch h2,
.ip-page .arch p,
.ip-page .arch li,
.ip-page .arch .check-list li { color: var(--navy); }
.ip-page .arch .lifecycle li span,
.ip-page .arch p { color: #2c3b55; }
.ip-page .arch .check-list li i { color: #135f3f; }
.ip-page .arch .lifecycle {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 8px 22px;
}
.ip-page .grad-text {
  background: none;
  -webkit-text-fill-color: currentColor;
  color: var(--navy);
  font-style: italic;
}

.ip-page .booking-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 24px;
  box-shadow: var(--shadow-card);
}
.ip-page .field label { color: var(--navy); }
.ip-page .field input,
.ip-page .field select,
.ip-page .field textarea,
.ip-page .status-subscribe-form input[type="email"] {
  font-size: 1rem;
  color: var(--navy);
  background: #fff;
}
.ip-page .help,
.ip-page .price-note,
.ip-page .cmp-caption { color: #2c3b55; }

.ip-page .incident-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 20px;
  box-shadow: var(--shadow-card);
}
.ip-page .status-flash.is-ok { background: #dff4ea; color: #135f3f; }
.ip-page .status-flash.is-err { background: #fbe3e3; color: #8f1d1d; }

.ip-page .chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ip-page .chip {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--navy);
  text-decoration: none;
  font-weight: 600;
}
.ip-page .chip:hover { border-color: rgba(19, 41, 75, 0.4); }

.ip-page a:focus-visible,
.ip-page button:focus-visible,
.ip-page input:focus-visible,
.ip-page select:focus-visible,
.ip-page textarea:focus-visible,
.ip-page summary:focus-visible {
  outline: 3px solid #8a4b04;
  outline-offset: 3px;
}

@media (max-width: 720px) {
  .ip-page .mk-hero { padding: 88px 0 24px; }
  .ip-page .mk-hero-shell { padding: 32px 20px; border-radius: 22px; }
  .ip-page .mk-hero h1 { max-width: none; font-size: clamp(2.1rem, 9vw, 2.75rem); }
  .ip-page .btn { white-space: normal; height: auto; min-height: 48px; padding: 12px 18px; text-align: center; }
  .ip-page .faq-grid,
  .ip-page .card-grid.is-2,
  .ip-page .card-grid.is-3,
  .ip-page .grid-2,
  .ip-page .grid-3 { grid-template-columns: 1fr; }
  .ip-page .arch .lifecycle { padding: 8px 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .ip-page .link-card { transition: none; }
}

/* Nested cards inside a navy panel. The white-card rule above was painting
   these white while the navy parent kept their text white. */
.ip-page .callout.is-navy a:not(.btn) { color: #fffdf9; }
.ip-page .callout.is-navy a.btn-white,
.ip-page .callout.is-navy a.btn-white:hover,
.ip-page .callout.is-navy a.btn-white:focus-visible { color: #13294b; background: #fffdf9; }
.ip-page .callout.is-navy .callout:not(.is-navy) {
  background: #fff;
  color: #13294b;
  border: 1px solid rgba(19,41,75,.14);
  box-shadow: none;
}
.ip-page .callout.is-navy .callout:not(.is-navy) h2,
.ip-page .callout.is-navy .callout:not(.is-navy) h3,
.ip-page .callout.is-navy .callout:not(.is-navy) h4,
.ip-page .callout.is-navy .callout:not(.is-navy) a {
  color: #13294b;
  background: transparent;
}
.ip-page .callout.is-navy .callout:not(.is-navy) p,
.ip-page .callout.is-navy .callout:not(.is-navy) li { color: #2c3b55; }
.ip-page .container.medium { margin-left: auto; margin-right: auto; }
