/* ============================================================
   page-baton.css — section-to-section background baton component

   Geometry is emitted by apps/view/module/page_baton.php.
   Pages choose a named pattern and tone; raw SVG paths stay out of page views.
   ============================================================ */

.c-page-baton-host,
[data-page-baton-host] {
  position: relative;
  overflow: visible;
  isolation: isolate;
}

.c-page-baton {
  --page-baton-surface-primary: #e5edf0;
  --page-baton-surface-secondary: var(--page-baton-surface-primary);
  --page-baton-paper: #fffdf8;
  --page-baton-paper-wide: #fcfaf4;
  --page-baton-paper-confluence: #fffaf6;
  --page-baton-line-navy: rgba(68, 93, 126, 0.52);
  --page-baton-line-gold: rgba(173, 129, 57, 0.62);
  --page-baton-line-cutout-primary: rgba(255, 253, 248, 0.98);
  --page-baton-line-cutout-secondary: rgba(255, 253, 248, 0.76);

  position: absolute;
  inset: 0 0 auto;
  z-index: -1;
  height: 0;
  overflow: visible;
  pointer-events: none;
}

.c-page-baton svg {
  position: absolute;
  top: clamp(-214px, -14vw, -176px);
  left: 0;
  display: block;
  width: 100%;
  height: clamp(350px, 29vw, 430px);
  overflow: visible;
}

.c-page-baton--bank-right-return-compact svg,
.c-page-baton--bank-right-return svg {
  top: clamp(-196px, -13vw, -164px);
  height: clamp(330px, 27vw, 405px);
}

.c-page-baton--bank-both-cross svg {
  top: clamp(-220px, -14.5vw, -184px);
}

.c-page-baton--center-confluence svg {
  top: clamp(-202px, -13.5vw, -170px);
  height: clamp(350px, 28vw, 420px);
}

.c-page-baton--tone-blue { --page-baton-surface-primary: #e5edf0; }
.c-page-baton--tone-blue-alt { --page-baton-surface-primary: #e7edf5; }
.c-page-baton--tone-gold { --page-baton-surface-primary: #f1e7d2; }
.c-page-baton--tone-green { --page-baton-surface-primary: #e4efeb; }
.c-page-baton--tone-coral { --page-baton-surface-primary: #f5e5e1; }

.c-page-baton--secondary-blue { --page-baton-surface-secondary: #e5edf0; }
.c-page-baton--secondary-blue-alt { --page-baton-surface-secondary: #e7edf5; }
.c-page-baton--secondary-gold { --page-baton-surface-secondary: #f1e7d2; }
.c-page-baton--secondary-green { --page-baton-surface-secondary: #e4efeb; }
.c-page-baton--secondary-coral { --page-baton-surface-secondary: #f5e5e1; }

.c-page-baton__surface,
.c-page-baton__negative {
  stroke: none;
}

.c-page-baton__surface.is-primary { fill: var(--page-baton-surface-primary); }
.c-page-baton__surface.is-secondary { fill: var(--page-baton-surface-secondary); }
.c-page-baton__negative.is-standard { fill: var(--page-baton-paper); }
.c-page-baton__negative.is-wide { fill: var(--page-baton-paper-wide); }
.c-page-baton__negative.is-confluence { fill: var(--page-baton-paper-confluence); }

.c-page-baton__line {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.c-page-baton__line.is-cutout-primary {
  stroke: var(--page-baton-line-cutout-primary);
  stroke-width: 2.45;
}

.c-page-baton__line.is-cutout-secondary {
  stroke: var(--page-baton-line-cutout-secondary);
  stroke-width: 1.35;
}

.c-page-baton__line.is-navy {
  stroke: var(--page-baton-line-navy);
  stroke-width: 1.35;
}

.c-page-baton__line.is-gold {
  stroke: var(--page-baton-line-gold);
  stroke-width: 1.1;
}

.c-page-baton__joint { fill: #c89b43; }
.c-page-baton__joint-ring {
  fill: none;
  stroke: rgba(200, 155, 67, 0.34);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.c-page-baton--parts-surface .c-page-baton__line,
.c-page-baton--parts-surface .c-page-baton__joint,
.c-page-baton--parts-surface .c-page-baton__joint-ring,
.c-page-baton--parts-line .c-page-baton__surface,
.c-page-baton--parts-line .c-page-baton__negative {
  display: none;
}

@media (max-width: 760px) {
  .c-page-baton {
    display: none;
  }
}

@media print {
  .c-page-baton {
    display: none !important;
  }
}
