/* ==========================================================================
   ifs.css — IFS Practice page
   Figma: IiXADCvnTkuTba3XXaw2PW node 2321:5667 ("IFS - 1512px x 4466px").
   Extends yardos.css + osrs.css. Reuses .ox-osrs-section, .ox-osrs-stroke,
   .ox-osrs-cards, .ox-osrs-card, .ox-osrs-problem, .ox-yardos-form, etc.
   Light header handled below via .page-template-page-ifs-php (mirrors osrs).
   ========================================================================== */

/* ──────────────────────────────────────────────────────────────────────────
   1. HERO — two-column: text left, partner logo card right
   Figma 2321:5702 — frame width 1153, gap 24, lockup 563 + logo card 566.
   ────────────────────────────────────────────────────────────────────────── */
.ox-ifs-hero {
  background: #FAF4E5;
  padding: 0 178px;
  box-sizing: border-box;
  display: flow-root;
}
.ox-ifs-hero__inner {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 24px;
  padding: 96px 0 64px;
}
.ox-ifs-hero__lockup {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  flex: 0 0 563px;
  max-width: 563px;
}

/* Hero eyebrow — Figma 940:110267: solid orange square with 4px #894615 ring */
.ox-ifs-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 4px;
}
.ox-ifs-hero__eyebrow-dot {
  box-sizing: border-box;
  display: inline-block;
  width: 16px;
  height: 16px;
  background: #FF6600;
  border: 4px solid #FDAD73;
  flex-shrink: 0;
}
.ox-ifs-hero__eyebrow-label {
  font-family: 'Figtree', sans-serif;
  font-weight: 300;
  font-size: 16px;
  line-height: 1;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #13252A;
}

/* Right-side partner logo card — Figma 2321:5704: 566×269, p 60px */
.ox-ifs-hero__media {
  flex: 1 1 566px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 60px;
  box-sizing: border-box;
  min-height: 269px;
}
.ox-ifs-hero__logo {
  display: block;
  width: 100%;
  max-width: 319px;
  height: auto;
  object-fit: contain;
}


/* ──────────────────────────────────────────────────────────────────────────
   2. RESULTS — 3-up stat deck
   Figma 2321:5678 — gap 59px between stats, stat-single 345.6×219.
   Stat number: Tenez 77/1.05, letter-spacing -2, color #CC5200.
   Stat description: Figtree Light 24/1.6, color #13252A.
   ────────────────────────────────────────────────────────────────────────── */
.ox-ifs-stats {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.ox-ifs-stats__header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}
.ox-ifs-stats__deck {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  gap: 59px;
  width: 100%;
}
.ox-ifs-stat {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  flex: 1 1 0;
  min-width: 0;
  padding-bottom: 16px;
}
.ox-ifs-stat__num {
  font-family: 'Tenez', serif;
  font-weight: 400;
  font-size: 77px;
  line-height: 1.05;
  letter-spacing: -0.026em; /* -2/77 */
  color: #CC5200;
  margin: 0;
  width: 100%;
}
.ox-ifs-stat__desc {
  font-family: 'Figtree', sans-serif;
  font-weight: 300;
  font-size: 24px;
  line-height: 1.6;
  color: #13252A;
  margin: 0;
  width: 100%;
}


/* ──────────────────────────────────────────────────────────────────────────
   3. CAPABILITIES — platform-box cards
   Figma 2321:5687–5692 — top row 3 cols / 291h, bottom row 2 cols / 228h.
   Bigger H3 (Tenez 32/1.05) and larger body (Figtree Light 18/1.6) than the
   default .ox-osrs-card values.
   ────────────────────────────────────────────────────────────────────────── */
.ox-ifs-cards .ox-ifs-card {
  padding: 24px 16px 24px 24px;
  gap: 12px;
}
.ox-ifs-cards.ox-osrs-cards--3 .ox-ifs-card { min-height: 291px; }
.ox-ifs-cards.ox-osrs-cards--2 .ox-ifs-card { min-height: 228px; flex: 1 1 50%; }

.ox-ifs-card__title {
  font-family: 'Tenez', serif;
  font-weight: 400;
  font-size: 32px;
  line-height: 1.05;
  letter-spacing: 0;
  color: #13252A;
  margin: 0;
}
.ox-ifs-card .ox-osrs-card__inner { gap: 18px; }
.ox-ifs-card__body {
  font-family: 'Figtree', sans-serif;
  font-weight: 300;
  font-size: 18px;
  line-height: 1.6;
  color: #13252A;
  margin: 0;
}


/* ──────────────────────────────────────────────────────────────────────────
   4. FORM — dark section
   Figma 2321:5697 — show eyebrow + H2 + intro above the form.
   ────────────────────────────────────────────────────────────────────────── */
.ox-ifs-form__header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}
.ox-ifs-form__header .ox-yardos-form__h2,
.ox-ifs-form__header .ox-yardos-form__intro {
  max-width: 1154px;
}


/* ──────────────────────────────────────────────────────────────────────────
   RESPONSIVE
   ────────────────────────────────────────────────────────────────────────── */
@media (max-width: 1100px) {
  .ox-ifs-hero          { padding: 0 48px; }
  .ox-ifs-hero__inner   { flex-direction: column; align-items: flex-start; gap: 32px; padding: 64px 0 32px; }
  .ox-ifs-hero__lockup  { flex: none; max-width: 100%; }
  .ox-ifs-hero__media   { flex: none; width: 100%; padding: 32px; min-height: auto; }
  .ox-ifs-stats__deck   { gap: 32px; }
  .ox-ifs-stat__num     { font-size: 60px; }
  .ox-ifs-stat__desc    { font-size: 20px; }
}
@media (max-width: 768px) {
  .ox-ifs-hero          { padding: 0 24px; }
  .ox-ifs-stats__deck   { flex-direction: column; gap: 24px; }
  .ox-ifs-stat__num     { font-size: 48px; }
  .ox-ifs-card__title   { font-size: 26px; }
  .ox-ifs-cards.ox-osrs-cards--2 .ox-ifs-card,
  .ox-ifs-cards.ox-osrs-cards--3 .ox-ifs-card { min-height: auto; }
}


/* ──────────────────────────────────────────────────────────────────────────
   LIGHT HEADER OVERRIDE — mirrors page-osrs.php pattern
   ────────────────────────────────────────────────────────────────────────── */
.page-template-page-ifs-php body { background: #FAF4E5; }
.page-template-page-ifs-php .ox-header {
  background: #FAF4E5;
  border-top-color: #FAF4E5;
}
.page-template-page-ifs-php .ox-nav__link {
  background: #FAEDDA;
  color: #13252A;
}
.page-template-page-ifs-php .ox-nav__link:hover { background: #F5E0C0; }
.page-template-page-ifs-php .ox-header__divider { background: #D4C9B8; }
.page-template-page-ifs-php .ox-header__logo    { background: #FAF4E5; }
.page-template-page-ifs-php .ox-logo__text      { color: #13252A; }
.page-template-page-ifs-php .ox-nav__list       { background: #FAF4E5; }
.page-template-page-ifs-php .ox-nav__dropdown   { background: #FAF4E5; }
.page-template-page-ifs-php .ox-nav__dropdown a { color: #13252A; }
.page-template-page-ifs-php .ox-nav__dropdown a:hover { background: #F0E8D5; }
.page-template-page-ifs-php .ox-logo .ox-logo__svg path,
.page-template-page-ifs-php .ox-logo .ox-logo__svg circle { fill: #13252A; }
.page-template-page-ifs-php .ox-nav__chevron path { stroke: #FF6600; }