@import url('./site-v40.css');

/* The approved blue treatment, with the existing v40 content and layout. */
#symfon-offer-aligned {
  --so-ink: #172b4d;
  --so-petrol: #102448;
  --so-accent: #1d62ff;
  --so-mint: #dce8ff;
  --so-muted: #526078;
  --so-line: #dce4ee;
  --so-wash: #f4f7ff;
  --so-blue-hover: #164cce;
}
#symfon-offer-aligned .so-brand img { filter: hue-rotate(40deg) saturate(2); }
#symfon-offer-aligned .so-nav-links { color: var(--so-muted); }
#symfon-offer-aligned a:focus-visible,
#symfon-offer-aligned button:focus-visible { outline-color: var(--so-accent); }
#symfon-offer-aligned .so-action:hover { background: var(--so-blue-hover); }
#symfon-offer-aligned .so-hero { background: #fff; color: var(--so-ink); border-top: 1px solid var(--so-line); }
#symfon-offer-aligned .so-hero .so-eyebrow,
#symfon-offer-aligned h1 em { color: var(--so-accent); }
#symfon-offer-aligned .so-lead { color: var(--so-muted); }
#symfon-offer-aligned .so-hero-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: min(100%, 540px);
  margin-inline: auto;
  align-items: stretch;
  gap: 14px;
}
#symfon-offer-aligned .so-hero-actions .so-action {
  width: 100%;
  min-height: 52px;
  line-height: 1.4;
}
#symfon-offer-aligned .so-hero .so-action { background: var(--so-accent); color: #fff; }
#symfon-offer-aligned .so-hero .so-action:hover { background: var(--so-blue-hover); }
#symfon-offer-aligned .so-hero .so-action-secondary { background: #fff; color: var(--so-accent); border-color: var(--so-accent); }
#symfon-offer-aligned .so-hero .so-action-secondary:hover { background: var(--so-wash); color: var(--so-blue-hover); }
#symfon-offer-aligned .so-transformation { border-color: var(--so-line); }
#symfon-offer-aligned .so-transformation article { background: #fff; }
#symfon-offer-aligned .so-transformation article+article { background: var(--so-wash); border-color: var(--so-line); }
#symfon-offer-aligned .so-transformation .so-eyebrow { color: var(--so-accent); }
#symfon-offer-aligned .so-transformation p:not(.so-eyebrow),
#symfon-offer-aligned .so-hero-foot,
#symfon-offer-aligned .so-proof-label { color: var(--so-muted); }
#symfon-offer-aligned .so-hero-foot strong { color: var(--so-ink); }
#symfon-offer-aligned .so-system { border-color: var(--so-line); }
#symfon-offer-aligned .so-system-intro>p:not(.so-eyebrow),
#symfon-offer-aligned .so-owner span,
#symfon-offer-aligned .so-step li,
#symfon-offer-aligned .so-scope-note,
#symfon-offer-aligned .so-platform p,
#symfon-offer-aligned .so-platform .so-platform-name,
#symfon-offer-aligned .so-value-grid p,
#symfon-offer-aligned .so-value-note { color: var(--so-muted); }
#symfon-offer-aligned .so-owner,
#symfon-offer-aligned .so-step { border-color: var(--so-line); }
#symfon-offer-aligned .so-system-list article>span,
#symfon-offer-aligned .so-step li::before,
#symfon-offer-aligned .so-resources { color: var(--so-accent); }
#symfon-offer-aligned .so-delivery,
#symfon-offer-aligned .so-value { background: var(--so-wash); }
#symfon-offer-aligned .so-step-number { background: var(--so-mint); }
#symfon-offer-aligned .so-step-footer { color: var(--so-ink); }
#symfon-offer-aligned .so-value-grid article { border-color: var(--so-accent); }
#symfon-offer-aligned .so-contact .so-eyebrow { color: #b8cfff; }
#symfon-offer-aligned .so-contact-copy>p:last-child { color: #d5e1f7; }
#symfon-offer-aligned .so-contact-card { background: #1b335c; border-color: #415a82; }
#symfon-offer-aligned .so-contact-card .so-owner span,
#symfon-offer-aligned .so-contact-data { color: #d5e1f7; }
#symfon-offer-aligned .so-contact .so-action { background: #fff; color: var(--so-accent); }
#symfon-offer-aligned .so-contact .so-action:hover { background: var(--so-mint); }
#symfon-offer-aligned .so-footer { background: #0b1933; color: #c3d1e8; }
#symfon-offer-aligned .so-wordmark span { color: #83adff; }
#symfon-offer-aligned .so-footer-company strong { color: #e2eaff; }
#symfon-offer-aligned .so-skip { color: var(--so-ink); border-color: var(--so-accent); }
#symfon-offer-aligned .so-nav-toggle { color: var(--so-ink); border-color: var(--so-line); }
#symfon-offer-aligned .so-resources a { border-color: #bbcdf1; }
@media (max-width:850px) {
  #symfon-offer-aligned .so-nav-links.is-open { border-color: var(--so-line); box-shadow: 0 10px 20px #10244812; }
}
@media (max-width:620px) {
  #symfon-offer-aligned .so-transformation article+article { border-top-color: var(--so-line); }
  #symfon-offer-aligned .so-hero-actions { grid-template-columns: 1fr; width: min(100%, 340px); }
  #symfon-offer-aligned .so-hero-actions .so-action { max-width: none; }
}