/* ==========================================================================
   IBEX Innovations — additions to the CorteX design system
   Loaded after cortex.css. Uses the same tokens (plum, gold, cream, Cormorant
   Garamond + DM Sans). Nothing here overrides a CorteX component.
   ========================================================================== */

/* ── Header: IBEX logo + contact button ─────────────────────────────────── */
.nav-logo-img--ibex { height: 54px; }
.nav-wordmark { font-family: 'Cormorant Garamond', serif; font-weight: 700; font-size: 1.7rem; color: var(--plum-deep); letter-spacing: .01em; }
.nav-links a.nav-cta {
  background: var(--gold); color: var(--plum-deep);
  padding: 8px 18px; border-radius: 3px; border-bottom: 0;
  font-weight: 700; letter-spacing: .04em; font-size: 12.5px;
  transition: background .2s, color .2s;
}
.nav-links a.nav-cta:hover { background: #B39540; color: var(--white); }
/* On the contact page the button turns plum so it reads as the current page, and stays plum on hover */
.nav-links a.nav-cta.active, .nav-links a.nav-cta.active:hover { background: var(--plum-deep); color: var(--cream); }

/* ── Footer runs to the bottom edge of the page ────────────────────────────
   Cortex reserved space for the fixed regulatory bar as cream padding on <body>,
   which left a cream strip under the footer. Here the footer carries that space
   instead, so the plum continues behind the bar, and short pages push the footer
   to the bottom of the window. */
html { background: var(--plum-deep); }          /* overscroll / rubber-banding shows plum, not cream */
body { padding-bottom: 0 !important; display: flex; flex-direction: column; background: var(--cream); }
body > header, body > main { flex-shrink: 0; }
body > main { flex: 1 0 auto; }
body > footer {
  margin-top: auto; flex-shrink: 0;
  padding-bottom: 2.5rem;
}
/* Pages with the fixed regulatory bar: footer padding clears it (height is measured by cortex.js) */
body:has(.disclaimer-bar) > footer { padding-bottom: calc(2.5rem + var(--disclaimer-h, 56px)); }

/* ── Inner-page hero: the CorteX hero without the photograph ───────────── */
.page-hero--plain { min-height: 0; padding-top: 3.75rem; padding-bottom: 3.5rem; }
.page-hero--plain::before, .page-hero--plain::after { display: none; }
.page-hero--plain h1 { max-width: 26ch; margin-bottom: .9rem; }
.page-hero--plain .hero-sub { font-size: 17px; font-weight: 300; }

/* ── Mission / purpose / vision ─────────────────────────────────────────── */
.mpv {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem;
}
.mpv-card {
  background: var(--white); border: 1px solid var(--line);
  border-top: 4px solid var(--gold); border-radius: 6px;
  padding: 1.75rem 1.6rem; box-shadow: var(--shadow-sm);
}
.mpv-card h3 {
  font-family: 'Cormorant Garamond', serif; font-size: 1.65rem;
  font-weight: 700; color: var(--gold-dk); line-height: 1.15; margin-bottom: .6rem;
}
.mpv-card p { color: var(--text-soft); font-size: 15.5px; line-height: 1.65; }
.mpv-card--plum { background: var(--plum); border-color: var(--plum); border-top-color: var(--gold); }
.mpv-card--plum h3 { color: var(--gold); }
.mpv-card--plum p  { color: var(--cream); }

/* ── Home: what IBEX does (three columns, CorteX .col-3 grid) ───────────── */
.ibex-points .col-3-head { font-size: 1.55rem; }
.ibex-points p { color: var(--text-soft); font-size: 15.5px; line-height: 1.7; }

/* ── Clinical opinion ───────────────────────────────────────────────────── */
.opinion-lead {
  border-left: 4px solid var(--gold); padding: .25rem 0 .25rem 1.75rem;
  margin: 2rem 0 2.5rem; max-width: 62rem;
}
.opinion-lead blockquote p {
  font-family: 'Cormorant Garamond', serif; font-weight: 600;
  font-size: clamp(1.5rem, 2.4vw, 2.1rem); line-height: 1.3; color: var(--plum);
}
.opinion-lead cite, .opinion-card cite {
  display: block; font-style: normal; margin-top: 1rem;
  font-size: 13.5px; line-height: 1.5; color: var(--text-soft);
}
.opinion-lead cite strong, .opinion-card cite strong {
  display: block; color: var(--plum-deep); font-size: 15px; font-weight: 700;
}
.opinion-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.25rem; }
.opinion-card {
  background: var(--cream); border: 1px solid var(--line); border-radius: 6px;
  padding: 1.6rem 1.6rem 1.4rem; display: flex; flex-direction: column;
}
.opinion-card blockquote p { font-size: 15.5px; line-height: 1.7; color: var(--text-mid); }
.opinion-card cite { margin-top: auto; padding-top: 1rem; }
.opinion-card--report { background: var(--plum-deep); border-color: var(--plum-deep); }
.opinion-card--report blockquote p { color: var(--cream); }
.opinion-card--report cite { color: rgba(250,250,245,.78); }
.opinion-card--report cite strong { color: var(--gold); }

/* ── Team ───────────────────────────────────────────────────────────────── */
.team-group { margin-top: 2.5rem; }
.team-group:first-of-type { margin-top: 1.5rem; }
.team-group > h3 {
  font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
  color: var(--mauve-dk); padding-bottom: .6rem; margin-bottom: 1.5rem;
  border-bottom: 1px solid var(--line);
}
.team-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.25rem; }
.person {
  background: var(--white); border: 1px solid var(--line); border-radius: 6px;
  padding: 1.5rem; display: grid; grid-template-columns: 84px 1fr; gap: 1.1rem;
  align-items: start; box-shadow: var(--shadow-sm);
}
.person--lead { border-top: 4px solid var(--gold); }
.avatar {
  position: relative; width: 84px; height: 84px; border-radius: 50%;
  background: var(--plum); color: var(--gold-lt); overflow: hidden;
  display: grid; place-items: center; flex-shrink: 0;
  font-family: 'Cormorant Garamond', serif; font-weight: 700; font-size: 1.7rem;
}
.avatar img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center top;
}
.person h4 { font-size: 16.5px; font-weight: 700; color: var(--plum-deep); line-height: 1.3; }
.person .role {
  font-size: 12.5px; font-weight: 600; color: var(--gold-dk);
  margin: .15rem 0 .6rem; line-height: 1.4;
}
.person p { font-size: 13.5px; line-height: 1.6; color: var(--text-soft); }

/* ── Partners ───────────────────────────────────────────────────────────── */
.partner-chips { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.75rem; }
.partner-chips li {
  list-style: none; border: 1px solid var(--line); background: var(--white);
  border-radius: 50px; padding: 6px 16px; font-size: 13.5px;
  font-weight: 500; color: var(--plum-deep);
}
.prose { max-width: 70ch; }
.prose p { font-size: 16px; line-height: 1.8; color: var(--text-soft); margin-bottom: 1rem; }
.prose p:last-child { margin-bottom: 0; }

/* ── IP + accreditation ─────────────────────────────────────────────────── */
.ip-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; }
.ip-grid h3 {
  font-family: 'Cormorant Garamond', serif; font-size: 1.7rem; font-weight: 700;
  color: var(--cream); margin-bottom: .9rem;
}
.ip-grid p { color: rgba(250,250,245,.82); font-size: 15px; line-height: 1.75; margin-bottom: 1rem; }
.ip-grid h4 { color: var(--gold); font-size: 13px; font-weight: 700; margin: 1.5rem 0 .4rem; }
.patent-list { list-style: none; columns: 2; column-gap: 2rem; margin-bottom: 1rem; }
.patent-list li { font-size: 14px; color: var(--cream); padding: .25rem 0; font-variant-numeric: tabular-nums; }
.cert-links { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.25rem; }
.cert-links a {
  display: inline-block; padding: 8px 18px; border-radius: 3px;
  border: 1px solid rgba(201,168,76,.6); color: var(--gold-lt);
  text-decoration: none; font-size: 13px; font-weight: 600;
  transition: background .2s, color .2s;
}
.cert-links a:hover { background: var(--gold); color: var(--plum-deep); }

/* ── News ───────────────────────────────────────────────────────────────── */
.news-feature {
  display: grid; grid-template-columns: 1.1fr 1fr; gap: 0;
  background: var(--plum-deep); border-radius: 8px; overflow: hidden;
  box-shadow: var(--shadow-md); margin-bottom: 3rem;
}
.news-feature .news-thumb { background: var(--plum); min-height: 280px; }
.news-feature .news-body { padding: 2.5rem 2.5rem 2.25rem; display: flex; flex-direction: column; justify-content: center; }
.news-feature .news-date { color: var(--gold); }
.news-feature h2 {
  font-family: 'Cormorant Garamond', serif; font-size: clamp(1.8rem, 2.8vw, 2.5rem);
  line-height: 1.12; font-weight: 700; color: var(--cream); margin: .4rem 0 .9rem;
}
.news-feature p { color: rgba(250,250,245,.82); font-size: 16px; line-height: 1.65; margin-bottom: 1.5rem; }
.news-feature .btn { align-self: flex-start; margin-top: 0; }

.news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.news-card {
  background: var(--white); border: 1px solid var(--line); border-radius: 6px;
  overflow: hidden; display: flex; flex-direction: column; box-shadow: var(--shadow-sm);
  transition: box-shadow .2s ease, transform .2s ease;
}
.news-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.news-thumb {
  aspect-ratio: 16 / 9; background: var(--line-soft); overflow: hidden;
  display: block; position: relative;
}
.news-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.news-thumb--contain img { object-fit: contain; padding: 1.25rem; background: var(--white); }
.news-feature .news-thumb img { position: absolute; inset: 0; }
.news-feature .news-thumb--contain img { background: var(--cream); }
.news-card .news-body { padding: 1.3rem 1.4rem 1.5rem; display: flex; flex-direction: column; flex: 1; }
.news-date {
  font-size: 11px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--mauve-dk);
}
.news-card h3 { font-size: 17px; line-height: 1.35; font-weight: 700; color: var(--plum-deep); margin: .4rem 0 .6rem; }
.news-card h3 a { color: inherit; text-decoration: none; }
.news-card h3 a:hover { color: var(--plum); text-decoration: underline; text-decoration-color: var(--gold); text-underline-offset: 3px; }
.news-card p { font-size: 14px; line-height: 1.6; color: var(--text-soft); margin-bottom: 1rem; }
.news-more {
  margin-top: auto; font-size: 13px; font-weight: 700; color: var(--gold-dk);
  text-decoration: none; border-bottom: 2px solid var(--gold); align-self: flex-start;
}
.news-more:hover { color: var(--plum-deep); }
.news-pager { margin-top: 2.5rem; display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.news-pager p { font-size: 13.5px; color: var(--text-soft); }

/* ── Contact ────────────────────────────────────────────────────────────── */
.contact-grid { display: grid; grid-template-columns: 1fr 1.25fr; gap: 3.5rem; align-items: start; }
.contact-details h2, .contact-formwrap h2 {
  font-family: 'Cormorant Garamond', serif; font-size: 2rem; font-weight: 700;
  color: var(--plum-deep); margin-bottom: 1.5rem; line-height: 1.15;
}
.detail-list { list-style: none; border-top: 1px solid var(--line); }
.detail-list li { padding: 1.1rem 0; border-bottom: 1px solid var(--line); }
.detail-list .d-label {
  display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--mauve-dk); margin-bottom: .3rem;
}
.detail-list .d-value { font-size: 17px; line-height: 1.55; color: var(--plum-deep); font-weight: 500; font-style: normal; }
.detail-list a { color: var(--plum-deep); text-decoration-color: var(--gold); text-underline-offset: 3px; }
.detail-list a:hover { color: var(--plum); }
.contact-formwrap {
  background: var(--white); border: 1px solid var(--line); border-radius: 8px;
  padding: 2.25rem 2.25rem 2rem; box-shadow: var(--shadow-md);
}
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.form-note a { color: var(--gold-dk); }
.contact-formwrap .form-status[data-state="ok"] { color: var(--gold-dk); }

/* ── Footer extras ──────────────────────────────────────────────────────── */
.footer-reg { color: rgba(250,250,245,.6); font-size: 12px; line-height: 1.6; margin-top: .6rem; }
.footer-col { display: flex; flex-direction: column; gap: .7rem; align-items: flex-start; }
.footer-social { display: flex; gap: 1.1rem; flex-wrap: wrap; }
.footer-tel { color: var(--cream); }

/* ── Responsive ─────────────────────────────────────────────────────────── */
@media (max-width: 1000px) {
  .news-grid { grid-template-columns: repeat(2, 1fr); }
  .news-feature { grid-template-columns: 1fr; }
  .news-feature .news-thumb { min-height: 0; aspect-ratio: 16 / 9; }
  .contact-grid { grid-template-columns: 1fr; gap: 2.5rem; }
  .ip-grid { grid-template-columns: 1fr; gap: 2.5rem; }
}
@media (max-width: 800px) {
  .mpv, .opinion-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .team-grid, .news-grid { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; gap: 0; }
  .contact-formwrap { padding: 1.5rem 1.25rem; }
  .news-feature .news-body { padding: 1.75rem 1.4rem; }
  .patent-list { columns: 1; }
}

/* ── Legal text (privacy notice) ────────────────────────────────────────── */
.legal-content { max-width: 800px; margin: 0 auto; font-size: 15px; line-height: 1.75; color: var(--text-soft); }
.legal-content h2 {
  font-family: 'Cormorant Garamond', serif; font-size: 1.8rem; font-weight: 700;
  color: var(--plum-deep); margin: 2.5rem 0 1rem; line-height: 1.2;
  border-bottom: 1px solid var(--line-soft); padding-bottom: .5rem;
}
.legal-content h2:first-child { margin-top: 0; }
.legal-content p, .legal-content ul { margin-bottom: 1.1rem; }
.legal-content ul { padding-left: 1.4rem; }
.legal-content li { margin-bottom: .45rem; }
.legal-content strong { color: var(--plum-deep); font-weight: 600; }
.legal-content a { color: var(--gold-dk); }
.legal-content dl { margin-bottom: 1.1rem; }
.legal-content dt { color: var(--plum-deep); font-weight: 600; margin-top: .9rem; }
.legal-content dd { margin: .15rem 0 0; }
.contact-box {
  background: var(--white); border: 1px solid var(--line); border-left: 4px solid var(--gold);
  border-radius: 6px; padding: 1.4rem 1.5rem; margin: 1.5rem 0;
}
.contact-box p { margin-bottom: .4rem; }
.contact-box p:last-child { margin-bottom: 0; }

/* Dates keep their small label size inside cards (beats the p rules above) */
.news-card .news-date, .news-feature .news-date {
  font-size: 11px; line-height: 1.4; margin-bottom: 0; color: var(--mauve-dk);
}
.news-feature .news-date { color: var(--gold); }

/* ── News: template card + article ──────────────────────────────────────── */
.news-thumb--placeholder {
  display: grid; place-items: center; text-decoration: none;
  background: repeating-linear-gradient(135deg, var(--line-soft) 0 14px, rgba(174,141,162,.22) 14px 15px);
}
.news-thumb--placeholder span, .article-figure-img span {
  font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--mauve-dk); background: var(--cream); padding: 6px 14px; border-radius: 50px;
  border: 1px solid var(--line);
}
.news-grid { grid-template-columns: repeat(3, 1fr); }
.news-grid > .news-card:only-child { grid-column: 1; }
@media (max-width: 1000px) { .news-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .news-grid { grid-template-columns: 1fr; } }

.page-hero--article h1 { max-width: 24ch; }
.page-hero--article .hero-inner { max-width: 860px; }
.article-kicker { font-size: 13px; font-weight: 600; margin-bottom: 1rem; color: var(--gold-lt); }
.article-kicker a { color: var(--gold-lt); }
.article-kicker span { margin: 0 .35rem; opacity: .6; }

.template-flag {
  background: #FBF3DC; border: 1px solid var(--gold); border-left-width: 4px;
  border-radius: 4px; padding: .8rem 1.1rem; font-size: 13.5px; color: var(--plum-deep);
  margin-bottom: 1.75rem;
}
.article-meta {
  display: flex; flex-wrap: wrap; gap: .5rem; font-size: 13px; font-weight: 600;
  color: var(--mauve-dk); margin-bottom: 1.75rem;
}
.article-figure { margin-bottom: 2.25rem; }
.article-figure-img {
  aspect-ratio: 16 / 9; border-radius: 6px; border: 1px solid var(--line); display: grid; place-items: center;
  background: repeating-linear-gradient(135deg, var(--line-soft) 0 14px, rgba(174,141,162,.22) 14px 15px);
}
.article-figure img { width: 100%; height: auto; border-radius: 6px; display: block; }
.article-figure figcaption { font-size: 12.5px; color: var(--text-soft); margin-top: .6rem; }

.article-body { font-size: 17px; line-height: 1.8; color: var(--text-mid); }
.article-body > p, .article-body > ul { margin-bottom: 1.25rem; max-width: 68ch; }
.article-body a { color: var(--gold-dk); }
.article-lede { font-size: 1.25rem; line-height: 1.6; color: var(--plum-deep); font-weight: 500; }
.article-body h2 {
  font-family: 'Cormorant Garamond', serif; font-size: 1.9rem; font-weight: 700;
  color: var(--plum-deep); line-height: 1.15; margin: 2.5rem 0 .8rem;
}
.article-body ul { padding-left: 1.4rem; }
.article-body li { margin-bottom: .4rem; }
.article-pull {
  margin: 2.25rem 0; padding: .25rem 0 .25rem 1.6rem; border-left: 4px solid var(--gold);
}
.article-pull p {
  font-family: 'Cormorant Garamond', serif; font-weight: 600; font-size: 1.7rem;
  line-height: 1.3; color: var(--plum); margin-bottom: .6rem;
}
.article-pull footer { font-size: 13.5px; color: var(--text-soft); }
.article-boiler {
  margin-top: 3rem; padding: 1.5rem 1.6rem; background: var(--cream);
  border: 1px solid var(--line); border-radius: 6px;
}
.article-boiler h3 { font-size: 15px; font-weight: 700; color: var(--plum-deep); margin-bottom: .4rem; }
.article-boiler p { font-size: 14px; line-height: 1.65; color: var(--text-soft); margin: 0; }
.article-nav { margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid var(--line); }
.article-nav a { font-weight: 700; font-size: 14px; color: var(--gold-dk); }

/* ── Home: CorteX / IBEX BH logo flip ───────────────────────────────────── */
.logo-flip {
  perspective: 900px; width: min(260px, 100%); height: 100px;
  margin: .25rem 0 2.25rem;
}
.logo-flip-inner {
  position: relative; width: 100%; height: 100%;
  transform-style: preserve-3d;
  animation: logoFlip 7s ease-in-out infinite;
}
.logo-flip-face {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: contain; object-position: center;
  backface-visibility: hidden; -webkit-backface-visibility: hidden;
}
.logo-flip-back { transform: rotateY(180deg); }
/* CorteX holds, spins to IBEX BH, holds, then spins back */
@keyframes logoFlip {
  0%, 36%   { transform: rotateY(0deg); }
  45%, 85%  { transform: rotateY(180deg); }
  94%, 100% { transform: rotateY(360deg); }
}
@media (prefers-reduced-motion: reduce) {
  .logo-flip-inner { animation: none; }
}

/* ── Home: quote closing the What is CorteX section ─────────────────────── */
.proof-quote--band.proof-quote--mid.proof-quote--long { margin-top: 3rem; }
.proof-quote--band.proof-quote--mid.proof-quote--long .pq-a {
  font-size: clamp(1.45rem, 2.5vw, 2.05rem); line-height: 1.25; margin-top: 0; max-width: 64rem;
}

/* ── About: investors and partners, text left and logos right ───────────── */
.partners-layout {
  display: grid; grid-template-columns: 1.1fr 1fr; gap: 3.5rem; align-items: start;
}
.partners-layout .prose { margin-top: 0 !important; }
.logo-wall {
  list-style: none; display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem;
  margin-top: 0;
}
.logo-wall li {
  background: var(--white); border: 1px solid var(--line); border-radius: 6px;
  height: 74px; padding: .55rem 1rem; display: grid; place-items: center;
  box-shadow: var(--shadow-sm);
}
.logo-wall img { max-width: 88%; max-height: 52px; width: auto; height: auto; object-fit: contain; }
@media (max-width: 900px) {
  .partners-layout { grid-template-columns: 1fr; gap: 2rem; }
}
@media (max-width: 420px) {
  .logo-wall li { height: 68px; padding: .5rem .75rem; }
  .logo-wall img { max-height: 46px; }
}

/* ── Contact form: spam trap + status states ────────────────────────────── */
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.contact-formwrap .form-status[data-state="error"] { color: #8C2F2F; }
.contact-formwrap .form-status a { color: inherit; }
.contact-formwrap .btn[disabled] { opacity: .6; cursor: progress; }


/* ── Page transition: fade through plum (script: static/js/ibex-nav.js) ── */
html.pt-enter::before, html.pt-leave::after {
  content: ''; position: fixed; inset: 0; z-index: 99999;
  background: var(--plum-deep); pointer-events: none;
}
html.pt-enter::before { animation: ptEnter .22s ease-out both; }   /* plum, then clears */
html.pt-leave::after  { animation: ptLeave .14s ease-in both; }    /* clears, then plum */
@keyframes ptEnter { from { opacity: 1; } to { opacity: 0; } }
@keyframes ptLeave { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  html.pt-enter::before, html.pt-leave::after { display: none; }
}

/* ── Images: width/height attributes reserve space (no layout jump) without fixing the height ── */
:where(img[width][height]) { height: auto; }

/* ══ Mobile menu: bigger tap targets, slide-down ══════════════════════════ */
@media (max-width: 1024px) {
  .nav-toggle-btn { min-height: 44px; padding: 6px 16px; }
  .nav-links { gap: 0; padding: .35rem 1rem 1rem; }
  .nav-links a {
    display: flex; align-items: center; width: 100%; min-height: 48px;
    padding: 0 .85rem; font-size: 15px;
    border-bottom: 0; border-left: 3px solid transparent;    /* current page = gold bar on the left */
    transition: color .2s, background-color .2s, border-color .2s;
  }
  .nav-links a:hover, .nav-links a:focus-visible { background: rgba(174,141,162,.12); }
  .nav-links a.active { border-bottom: 0; border-left-color: var(--gold); background: rgba(201,168,76,.10); }
  .nav-links a.nav-home:not(.active) { border-left-color: transparent; }
  .nav-links a.nav-cta {
    justify-content: center; margin-top: .75rem; min-height: 48px;
    border-left: 0; padding: 0 18px;
  }
  .nav-links a.nav-cta.active { background: var(--plum-deep); }
  .nav-links.is-open { animation: navSlide .22s ease-out both; }
}
@keyframes navSlide { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }

/* ══ Regulatory bar: one line on phones, tap to read it all ═══════════════ */
@media (max-width: 700px) {
  .disclaimer-bar.is-compact { padding: 0; text-align: left; letter-spacing: 0; font-size: 11.5px; }
  .disclaimer-toggle {
    display: flex; align-items: center; gap: .6rem; width: 100%; min-height: 42px;
    padding: .4rem .75rem .4rem .9rem; background: transparent; border: 0; color: inherit;
    font: inherit; text-align: left; cursor: pointer;
  }
  .disclaimer-toggle:focus-visible { outline-offset: -3px; }
  .disclaimer-text { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .disclaimer-chev {
    flex: none; display: grid; place-items: center; width: 26px; height: 26px;
    border: 1px solid rgba(201,168,76,.6); border-radius: 50%; color: var(--gold);
  }
  .disclaimer-chevron { transition: transform .2s ease; }                      /* arrow up: it opens upward */
  .disclaimer-bar.is-expanded .disclaimer-chevron { transform: rotate(180deg); }  /* arrow down: tap to close */
  .disclaimer-bar.is-expanded .disclaimer-text { white-space: normal; overflow: visible; }
  .disclaimer-bar.is-expanded .disclaimer-toggle { align-items: flex-start; }
}

/* ══ Contact form: inline errors and thank-you panel ══════════════════════ */
.field-error {
  display: flex; gap: .45rem; align-items: flex-start;
  margin-top: 6px; font-size: 12.5px; line-height: 1.45; font-weight: 600; color: #8C2F2F;
}
.field-error::before {
  content: '!'; flex: none; display: grid; place-items: center;
  width: 15px; height: 15px; margin-top: 1px; border-radius: 50%;
  background: #8C2F2F; color: #fff; font-size: 10px; font-weight: 800; line-height: 1;
}
.field-error[hidden] { display: none; }
.form-group input[aria-invalid="true"], .form-group textarea[aria-invalid="true"] {
  border-color: #8C2F2F; box-shadow: 0 0 0 2px rgba(140,47,47,.14);
}
.form-consent + .field-error { margin: -1rem 0 1.25rem; }
.form-success { text-align: center; padding: 1.5rem .5rem 1rem; }
.form-success[hidden] { display: none; }
.form-success:focus { outline: none; }
.form-success-icon { color: var(--gold-dk); margin-bottom: 1rem; }
.form-success h2 {
  font-family: 'Cormorant Garamond', serif; font-size: 2rem; font-weight: 700;
  color: var(--plum-deep); line-height: 1.15; margin-bottom: .8rem;
}
.form-success p { color: var(--text-soft); font-size: 15.5px; line-height: 1.65; max-width: 38ch; margin: 0 auto 1.5rem; }
.form-success p a { color: var(--gold-dk); }

/* ══ Back-to-top button ═══════════════════════════════════════════════════ */
.to-top {
  position: fixed; right: 1rem; z-index: 9000;
  bottom: calc(var(--disclaimer-h, 0px) + 1rem);
  width: 46px; height: 46px; display: grid; place-items: center;
  background: var(--plum-deep); color: var(--gold); cursor: pointer;
  border: 1px solid rgba(201,168,76,.55); border-radius: 50%;
  box-shadow: var(--shadow-md);
  opacity: 0; visibility: hidden; transform: translateY(10px);
  transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s, background-color .2s;
}
.to-top.is-visible { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.to-top:hover { background: var(--plum); }
@media print { .to-top { display: none; } }
@media (max-width: 380px) { .disclaimer-bar.is-compact { font-size: 10.5px; } }

/* ══ 404 page ═════════════════════════════════════════════════════════════ */
.nf-grid { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 1rem; margin: 1.5rem 0 .5rem; }
.nf-grid a {
  display: flex; flex-direction: column; gap: .35rem; height: 100%; padding: 1.2rem 1.3rem;
  background: var(--white); border: 1px solid var(--line); border-top: 4px solid var(--gold);
  border-radius: 6px; box-shadow: var(--shadow-sm); text-decoration: none;
  transition: box-shadow .2s ease, transform .2s ease;
}
.nf-grid a:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.nf-grid strong { font-family: 'Cormorant Garamond', serif; font-size: 1.5rem; line-height: 1.1; color: var(--plum-deep); }
.nf-grid span { font-size: 14px; line-height: 1.55; color: var(--text-soft); }

/* ══ Image banner for inner pages (About): same hero treatment as the home page, shorter ══ */
.page-hero--banner { min-height: clamp(300px, 28vw, 400px); padding-top: 3.25rem; padding-bottom: 3.25rem; }
.hero-kicker {
  font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
  color: var(--gold-lt); margin-bottom: .9rem; text-shadow: 0 1px 8px rgba(0,0,0,.35);
}
.page-hero--banner h1 {
  max-width: 22ch; margin-bottom: 0; text-wrap: balance;
  font-size: clamp(2rem, 3.4vw, 3.1rem); line-height: 1.1;
}
/* The hero image stops growing at a 1400px page width: wider screens keep it the same size,
   anchored to the right edge, and the plum fills the extra space on the left. */
.page-hero--banner::before { inset: 0 0 0 auto; width: min(100%, 1400px); }
@media (max-width: 860px) { .page-hero--banner { min-height: 170px; padding: 2.75rem 1.4rem; } }

/* ══ IFU downloads page (bh-ifu) ══════════════════════════════════════════ */
.ifu-group + .ifu-group { margin-top: 3rem; }
.ifu-group > h2 {
  font-family: 'Cormorant Garamond', serif; font-size: clamp(1.7rem, 2.6vw, 2.2rem); font-weight: 700;
  color: var(--plum-deep); line-height: 1.15; padding-bottom: .6rem; margin-bottom: 1.1rem;
  border-bottom: 1px solid var(--line);
}
.ifu-list { list-style: none; display: grid; gap: .85rem; }
.ifu-doc {
  display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
  background: var(--white); border: 1px solid var(--line); border-left: 4px solid var(--gold);
  border-radius: 6px; padding: 1.15rem 1.4rem; box-shadow: var(--shadow-sm);
}
.ifu-doc-main { min-width: 0; }
.ifu-doc h3 { font-size: 17px; font-weight: 700; color: var(--plum-deep); line-height: 1.3; }
.ifu-doc-name { font-size: 13.5px; line-height: 1.5; color: var(--text-soft); margin-top: .2rem; overflow-wrap: anywhere; }
.ifu-doc-meta { font-size: 12.5px; color: var(--mauve-dk); margin-top: .35rem; font-weight: 500; }
.ifu-dl { flex: none; margin-top: 0; }
.ifu-note { margin-top: 2.5rem; font-size: 14.5px; color: var(--text-soft); }
.ifu-note a { color: var(--gold-dk); }
@media (max-width: 640px) {
  .ifu-doc { flex-direction: column; align-items: stretch; gap: .9rem; padding: 1.05rem 1.1rem; }
  .ifu-dl { text-align: center; }
}
/* ══ Home page tweaks ═════════════════════════════════════════════════════ */

/* CorteX logo above the hero text */
.hero-logo { --logo-h: clamp(52px, 6vw, 72px); display: block; width: auto; height: var(--logo-h); margin: 0 0 1.6rem calc(var(--logo-h) * -.14); }

/* Four cards: readable text on the two dark cards (was 1.8:1 and 1.5:1) */
.vb-card--oem .vb-say,
.vb-card--provider .vb-say { color: var(--cream); }                       /* 6.6:1 on brown, 7.9:1 on plum */
.panel:not(.panel--dark) .vb-card--oem .vb-who,
.panel:not(.panel--dark) .vb-card--provider .vb-who {
  color: #F4E8C6; border-color: rgba(244, 232, 198, .6);                  /* 5.7:1 on brown, 6.8:1 on plum */
}

/* Footer: LinkedIn logo sits in the same row as the footer links */
.footer-links a.footer-icon { display: inline-flex; align-items: center; }
.footer-icon svg { display: block; }

/* Footer watermark: moved just below the nav row so the LinkedIn logo is not on top of it */
body > footer.brand-watermark::before { top: 76px; width: 80px; height: 80px; }

/* ══ Four cards: keep their padding and spacing when the grid wraps ═══════
   cortex.css switches the grid to 2 columns (max-width 1080px) and then 1 column
   (max-width 620px) using rules written for plain columns: they strip the cards'
   padding and add divider lines and extra margins. These put the card layout back. */
.vband-grid .vb-card,
.vband-grid .vb-card:nth-child(odd),
.vband-grid .vb-card:nth-child(even) { padding: 1.8rem 1.6rem 1.9rem; }

@media (max-width: 620px) {
  .vband-grid .vb-card + .vb-card { margin-top: 0; border-top-color: transparent; }   /* no gold divider, no extra gap */
  .vband-grid .vb-card.vb-card--patient { border-top-color: rgba(206, 163, 159, .55); }
}

/* ══ Home hero: image stops growing at a 1400px page width ════════════════
   Same treatment as the About banner: on wider screens the photo keeps its size,
   anchored to the right edge, and the plum fills the extra space on the left. */
#hero.page-hero::before { inset: 0 0 0 auto; width: min(100%, 1400px); }

/* ══ About hero: styled after the toolkit's "About IBEX" (Clinical case) slide ══
   Heading and the mission statement. Same height as the home page hero
   (the cortex.css .page-hero rule, which the shorter banner style overrides). */
.page-hero--about {
  min-height: clamp(460px, calc(84vh - var(--header-h)), 660px);
  padding-top: 4rem; padding-bottom: 4rem;
}
.page-hero--about .hero-inner { max-width: 680px; }
.page-hero--about h1 {
  font-family: 'Cormorant Garamond', serif; font-weight: 700; color: #fff;
  font-size: clamp(2.6rem, 4.6vw, 4.2rem); line-height: 1; max-width: none;
  margin: 0 0 1.5rem; text-shadow: 0 2px 14px rgba(0,0,0,.35);
}
.about-hero-quote { margin: 1.25rem 0 0; padding-top: 1.25rem; border-top: 1px solid rgba(201, 168, 76, .45); }
.about-hero-quote figcaption {
  font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-lt);
}
.about-hero-quote blockquote { margin: .5rem 0 0; padding: 0; border: 0; background: none; }
.about-hero-quote blockquote p {
  margin: 0; font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 600;
  font-size: clamp(1.9rem, 3.1vw, 2.75rem); line-height: 1.18; color: var(--gold);
  text-shadow: 0 2px 16px rgba(26, 14, 8, .55);
}
/* The slide's darker wash in place of the plum fade (phones keep the existing overlay) */
@media (min-width: 861px) {
  .page-hero--about::after {
    background: linear-gradient(90deg, rgba(30, 16, 24, .82) 0%, rgba(30, 16, 24, .78) 54%,
                rgba(30, 16, 24, .5) 70%, rgba(30, 16, 24, 0) 88%);
  }
}
/* Between tablet and laptop widths the text column reaches further across the photo */
@media (min-width: 861px) and (max-width: 1180px) {
  .page-hero--about::after {
    background: linear-gradient(90deg, rgba(30, 16, 24, .84) 0%, rgba(30, 16, 24, .8) 68%,
                rgba(30, 16, 24, .55) 84%, rgba(30, 16, 24, .15) 100%);
  }
}
/* Phones and tablets: same height as the home hero there */
@media (max-width: 860px) {
  .page-hero--about { min-height: clamp(380px, 62vh, 480px); padding: 3rem 1.4rem; }
}
/* Company Information section: logos and text under the small title */
#about .about-body { margin-top: 1.25rem; }
.brand-row .brand-mark--bh { border-radius: 0; }   /* square corners (cortex.css rounds them) */