/* Mailcore homepage — warm infrastructure identity.
   Scoped to the marketing homepage so product, admin and webmail stay untouched. */

body.site-home--cf {
  --cf-ink: #151414;
  --cf-ink-deep: #0d0d0d;
  --cf-panel: #1d1b1a;
  --cf-panel-raised: #24211f;
  --cf-cream: #fffbf5;
  --cf-cream-soft: #f0e3de;
  --cf-muted: #b9aaa4;
  --cf-orange: #ff5e1f;
  --cf-orange-deep: #e9480d;
  --cf-orange-soft: #faad3f;
  --cf-line: rgba(255, 251, 245, .14);
  --cf-line-strong: rgba(255, 251, 245, .24);

  --brand: var(--cf-orange);
  --brand-hover: var(--cf-orange-deep);
  --brand-tint: rgba(255, 94, 31, .15);
  --brand-emphasis-ring: #c93b08;
  --brand-emphasis-bg: var(--cf-orange);
  --brand-emphasis-grad-start: var(--cf-orange-soft);
  --brand-emphasis-grad-end: var(--cf-orange);
  --on-brand: #1a110d;

  --surface-canvas: var(--cf-ink);
  --surface-elevated: #211e1d;
  --surface-recessed: #111010;
  --surface-base: var(--cf-panel);
  --surface-tint: #2a2624;
  --surface-overlay: #191716;
  --surface-control: #272321;
  --surface-fill: #37312e;
  --surface-fill-hover: #403936;
  --surface-interact: #544a45;
  --surface-contrast: var(--cf-cream);

  --line: var(--cf-line);
  --hairline: rgba(255, 251, 245, .09);
  --focus-ring-color: var(--cf-cream);

  --text-body: var(--cf-cream-soft);
  --text-default: #f4e9e4;
  --text-strong: var(--cf-cream);
  --text-subtle: var(--cf-muted);
  --text-subtle-strong: #d5c6c0;
  --text-placeholder: #8f817b;
  --text-inactive: #665c58;
  --text-inverse: #1a1513;
  --text-link: #ffb28a;
  --text-info: #ffb28a;
  --text-success: #7ce2bc;
  --text-warning: #ffd19a;
  --text-brand: #ff8b4b;

  --success: #42d39d;
  --warning: #faad3f;
  --success-tint: rgba(66, 211, 157, .11);
  --warning-tint: rgba(250, 173, 63, .12);
  --banner-info: rgba(255, 94, 31, .11);

  --header-height: 72px;
  color-scheme: dark;
  min-width: 320px;
  overflow-x: clip;
  background: var(--cf-ink);
  color: var(--cf-cream-soft);
  font-family: Inter, "Segoe UI", Arial, sans-serif;
}

.site-home--cf main {
  overflow: clip;
}

.site-home--cf :where(a, button, summary):focus-visible {
  outline: 2px solid var(--cf-cream);
  outline-offset: 3px;
}

.site-home--cf .container {
  width: calc(100% - 40px);
  max-width: 1280px;
}

/* Header */
.site-home--cf .dashboard-topbar {
  position: sticky;
  inset-block-start: 0;
  z-index: 80;
  height: var(--header-height);
  border-block-end: 1px solid rgba(255, 251, 245, .08);
  background: rgba(21, 20, 20, .9);
  box-shadow: none;
  backdrop-filter: blur(18px) saturate(130%);
}

.site-home--cf .dashboard-topbar__inner {
  height: 100%;
  gap: 18px;
}

/* Шапка главной тёмная, поэтому здесь переопределяются только размер и цвета.
   Геометрия — из общего .mailcore-logo: раньше эта копия равняла знак по
   центру и держала его в 29 фиксированных пикселях, из-за чего логотип на
   главной и логотип в панели были разными знаками одного бренда. */
.site-home--cf .mailcore-logo {
  color: var(--cf-cream);
}

.site-home--cf .mailcore-logo > span,
.site-home--cf .mailcore-logo > span > span {
  color: inherit;
}

.site-home--cf .mailcore-logo__dot {
  color: #faad3f !important;
}

.site-home--cf .mailcore-logo__tld {
  color: #a99c97 !important;
}

.site-home--cf .dashboard-topbar__nav-link {
  min-height: 40px;
  padding-inline: 13px;
  border-radius: 999px;
  color: #cdbfba;
  font-size: 14px;
  font-weight: 500;
}

.site-home--cf .dashboard-topbar__nav-link:hover,
.site-home--cf .dashboard-topbar__nav-link[aria-current] {
  background: rgba(255, 251, 245, .08);
  color: var(--cf-cream);
}

.site-home--cf .site-header__actions {
  gap: 8px;
}

.site-home--cf .btn {
  border: 1px solid var(--cf-line-strong);
  border-radius: 999px;
  color: var(--cf-cream);
  background: transparent;
  box-shadow: none;
  font-weight: 550;
  transition: color 180ms ease, background-color 180ms ease, border-color 180ms ease,
              box-shadow 180ms ease, transform 120ms ease;
}

.site-home--cf .btn:hover {
  border-color: rgba(255, 251, 245, .42);
  color: var(--cf-cream);
  background: rgba(255, 251, 245, .08);
}

.site-home--cf .btn:active {
  transform: translateY(1px);
}

.site-home--cf .btn--primary,
.site-home--cf .dashboard-topbar__connect {
  border-color: var(--cf-cream) !important;
  color: #1d1714 !important;
  background: var(--cf-cream) !important;
  box-shadow: none !important;
}

.site-home--cf .btn--primary:hover,
.site-home--cf .dashboard-topbar__connect:hover {
  border-color: #fff !important;
  background: #fff !important;
  box-shadow: 0 8px 30px rgba(255, 251, 245, .12) !important;
}

.site-home--cf .dashboard-topbar__login {
  color: var(--cf-cream);
  background: transparent;
}

.site-home--cf .dashboard-menu__panel {
  border-color: var(--cf-line);
  background: rgba(21, 20, 20, .98);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
}

.site-home--cf .dashboard-menu__panel a {
  border-radius: 12px;
  color: var(--cf-cream-soft);
}

.site-home--cf .dashboard-menu__panel a:hover,
.site-home--cf .dashboard-menu__panel a:focus-visible {
  background: rgba(255, 94, 31, .13);
  color: var(--cf-cream);
}

/* Hero */
.site-home--cf .hero {
  position: relative;
  padding: 8px 8px 0;
  border: 0;
  background: var(--cf-ink);
}

.site-home--cf .hero__surface {
  position: relative;
  isolation: isolate;
  display: grid;
  align-content: space-between;
  width: min(100%, 1480px);
  min-height: min(780px, calc(100svh - var(--header-height) - 16px));
  margin-inline: auto;
  padding: clamp(72px, 9vw, 126px) clamp(24px, 7vw, 108px) 28px;
  overflow: hidden;
  border-radius: 18px;
  background:
    radial-gradient(circle at 50% 112%, rgba(255, 239, 220, .96) 0, rgba(255, 197, 146, .44) 17%, transparent 42%),
    linear-gradient(148deg, #ff692d 0%, var(--cf-orange) 46%, #f45116 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12);
}

.site-home--cf .hero__surface::before {
  position: absolute;
  z-index: -2;
  inset: 0;
  background-image: radial-gradient(circle, rgba(82, 27, 7, .27) 1px, transparent 1.2px);
  background-size: 10px 10px;
  content: "";
  opacity: .44;
  mask-image: linear-gradient(to bottom, #000 0, rgba(0, 0, 0, .4) 63%, transparent 98%);
}

.site-home--cf .hero__surface::after {
  position: absolute;
  z-index: -1;
  inset: auto 7% -39% 7%;
  height: 58%;
  border-radius: 50%;
  background: rgba(255, 248, 236, .72);
  filter: blur(82px);
  content: "";
  opacity: .64;
}

.site-home--cf .hero__copy {
  position: relative;
  z-index: 2;
  display: grid;
  justify-items: center;
  max-width: 1040px;
  margin-inline: auto;
  text-align: center;
}

.site-home--cf .hero__eyebrow {
  min-height: 32px;
  margin-block-end: 24px;
  padding-inline: 14px;
  border: 1px solid rgba(32, 17, 11, .2);
  border-radius: 999px;
  color: #2f190f;
  background: rgba(255, 251, 245, .42);
  font-size: 13px;
  font-weight: 650;
  letter-spacing: .01em;
  backdrop-filter: blur(8px);
}

.site-home--cf .hero__eyebrow .status__dot {
  background: #23130d;
  box-shadow: 0 0 0 3px rgba(255, 251, 245, .27);
}

.site-home--cf .hero .type-h1 {
  max-width: 13ch;
  margin: 0;
  color: #fff;
  font-size: clamp(3.25rem, 6.1vw, 5.75rem);
  font-weight: 500;
  line-height: .98;
  letter-spacing: -.052em;
  text-wrap: balance;
}

.site-home--cf .hero .lead {
  max-width: 690px;
  margin-block-start: 28px;
  color: rgba(38, 19, 12, .88);
  font-size: clamp(1.08rem, 1.45vw, 1.25rem);
  font-weight: 500;
  line-height: 1.45;
  text-wrap: balance;
}

.site-home--cf .hero .mono {
  color: #27130c;
  background: rgba(255, 251, 245, .25);
}

.site-home--cf .hero__actions {
  justify-content: center;
  margin-block-start: 30px;
}

.site-home--cf .hero .btn {
  min-height: 54px;
  padding-inline: 25px;
  border-color: rgba(31, 16, 10, .42);
  color: #24140e;
  background: rgba(255, 251, 245, .12);
  font-size: 16px;
}

.site-home--cf .hero .btn:hover {
  border-color: #24140e;
  background: rgba(255, 251, 245, .25);
}

.site-home--cf .hero .btn--primary {
  border-color: var(--cf-cream) !important;
  color: #1d1714 !important;
  background: var(--cf-cream) !important;
}

.site-home--cf .hero-microcopy {
  margin-block-start: 18px;
  color: #2a150d;
  font-weight: 550;
}

.site-home--cf .hero-microcopy .icon {
  color: #2b160e;
}

.site-home--cf .hero__trace {
  position: absolute;
  z-index: 0;
  inset: auto 4% 2% 4%;
  width: 92%;
  height: auto;
  color: rgba(58, 26, 13, .22);
  pointer-events: none;
}

.site-home--cf .hero__trace path,
.site-home--cf .hero__trace circle,
.site-home--cf .hero__trace rect {
  vector-effect: non-scaling-stroke;
}

.site-home--cf .hero__chips {
  position: relative;
  z-index: 3;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  width: min(100%, 920px);
  margin: clamp(48px, 8vw, 96px) auto 0;
  border: 1px solid rgba(255, 251, 245, .16);
  border-radius: 15px;
  color: var(--cf-cream);
  background: rgba(21, 20, 20, .91);
  box-shadow: 0 20px 54px rgba(91, 25, 5, .22);
  backdrop-filter: blur(14px);
}

.site-home--cf .hero__chips li {
  min-height: 76px;
  padding: 15px 22px;
}

.site-home--cf .hero__chips li + li {
  border-color: rgba(255, 251, 245, .13);
}

.site-home--cf .hero-stat__label {
  color: #aa9e99;
  font-size: 12px;
}

.site-home--cf .hero__chips strong {
  color: var(--cf-cream);
  font-size: 15px;
  font-weight: 600;
}

/* Mailflow */
.site-home--cf .mailflow-section {
  padding-block: clamp(108px, 12vw, 180px);
  border: 0;
  background: var(--cf-ink);
}

.site-home--cf .mailflow-section__head {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr);
  gap: 48px;
  align-items: end;
  margin-block-end: 56px;
}

.site-home--cf .mailflow-section__head .type-h2 {
  max-width: 12ch;
  margin-block-start: 18px;
  color: var(--cf-cream);
  font-size: clamp(2.8rem, 5.3vw, 5.4rem);
  font-weight: 500;
  line-height: .96;
  letter-spacing: -.052em;
  text-wrap: balance;
}

.site-home--cf .mailflow-section__head .lead {
  max-width: 520px;
  color: var(--cf-muted);
  font-size: 18px;
  line-height: 1.55;
}

.site-home--cf .mailflow-kicker {
  color: var(--cf-orange);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.site-home--cf .mailflow {
  --flow-x: 0px;
  --flow-y: 0px;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--cf-line);
  border-radius: 18px;
  background: var(--cf-ink-deep);
  box-shadow: 0 40px 100px rgba(0, 0, 0, .28);
}

.site-home--cf .mailflow::before {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(rgba(255, 251, 245, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 251, 245, .035) 1px, transparent 1px);
  background-position: var(--flow-x) var(--flow-y);
  background-size: 32px 32px;
  content: "";
  mask-image: radial-gradient(circle at center, #000 22%, transparent 86%);
  pointer-events: none;
  transition: background-position 250ms ease-out;
}

.site-home--cf .mailflow__toolbar {
  position: relative;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 82px;
  padding: 16px 20px 16px 24px;
  border-block-end: 1px solid var(--cf-line);
  background: rgba(18, 17, 17, .88);
}

.site-home--cf .mailflow__identity {
  display: grid;
  gap: 4px;
}

.site-home--cf .mailflow__identity span {
  color: #8f817c;
  font: 600 10px/1.2 "JetBrains Mono", monospace;
  letter-spacing: .12em;
}

.site-home--cf .mailflow__identity strong {
  color: var(--cf-cream);
  font-size: 15px;
  font-weight: 550;
}

.site-home--cf .mailflow__controls {
  display: inline-flex;
  gap: 3px;
  padding: 4px;
  border: 1px solid var(--cf-line);
  border-radius: 999px;
  background: rgba(255, 251, 245, .035);
}

.site-home--cf .mailflow__tab {
  min-height: 38px;
  padding: 8px 15px;
  border: 0;
  border-radius: 999px;
  color: #a99c97;
  background: transparent;
  font: 550 13px/1 Inter, sans-serif;
  cursor: pointer;
  transition: color 180ms ease, background-color 180ms ease;
}

.site-home--cf .mailflow__tab:hover {
  color: var(--cf-cream);
}

.site-home--cf .mailflow__tab[aria-pressed="true"] {
  color: #21140f;
  background: var(--cf-orange-soft);
}

.site-home--cf .mailflow__stage {
  position: relative;
  min-height: 520px;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 56%, rgba(255, 94, 31, .13), transparent 34%),
    linear-gradient(180deg, transparent, rgba(255, 94, 31, .025));
}

.site-home--cf .mailflow__stage::before,
.site-home--cf .mailflow__stage::after {
  position: absolute;
  color: #8f817c;
  font: 600 9px/1 "JetBrains Mono", monospace;
  letter-spacing: .14em;
  content: "UZ/TAS-IX · MAIL ROUTE";
}

.site-home--cf .mailflow__stage::before {
  inset: 22px auto auto 24px;
}

.site-home--cf .mailflow__stage::after {
  inset: auto 24px 20px auto;
  content: "MX · AUTH · FILTER · INBOX";
}

.site-home--cf .mailflow__svg {
  position: absolute;
  inset: 32px 28px 18px;
  width: calc(100% - 56px);
  height: calc(100% - 50px);
  overflow: visible;
  transform: translate3d(var(--flow-x), var(--flow-y), 0);
  transition: transform 250ms ease-out;
}

.site-home--cf .mailflow-svg__coordinate {
  fill: none;
  stroke: rgba(255, 251, 245, .08);
  stroke-width: 1;
  stroke-dasharray: 3 8;
}

.site-home--cf .mailflow-svg__base {
  fill: none;
  stroke: rgba(255, 251, 245, .12);
  stroke-width: 8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.site-home--cf .mailflow-svg__route {
  fill: none;
  stroke: url(#mailflow-gradient);
  stroke-width: 7;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: url(#mailflow-glow);
}

.site-home--cf .mailflow-svg__branch {
  fill: none;
  stroke: rgba(250, 173, 63, .42);
  stroke-width: 2;
  stroke-dasharray: 5 8;
}

.site-home--cf .mailflow-svg__branch-node {
  fill: #171515;
  stroke: rgba(250, 173, 63, .54);
  stroke-width: 2;
}

.site-home--cf .mailflow-svg__branch-label {
  fill: #a99c97;
  font: 500 13px/1 Inter, sans-serif;
}

.site-home--cf .mailflow-svg__node-ring {
  fill: #141313;
  stroke: rgba(255, 251, 245, .22);
  stroke-width: 2;
}

.site-home--cf .mailflow-svg__node-core {
  fill: #282321;
  stroke: rgba(255, 251, 245, .11);
  stroke-width: 1;
}

.site-home--cf .mailflow-svg__node-icon {
  fill: none;
  stroke: var(--cf-cream);
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.site-home--cf .mailflow-svg__node-title {
  fill: var(--cf-cream);
  font: 600 20px/1 Inter, sans-serif;
  letter-spacing: -.01em;
}

.site-home--cf .mailflow-svg__node-subtitle {
  fill: #928580;
  font: 500 15px/1 "JetBrains Mono", monospace;
}

.site-home--cf .mailflow-svg__check {
  fill: #101513;
  stroke: var(--success);
  stroke-width: 2;
}

.site-home--cf .mailflow-svg__check-mark {
  fill: none;
  stroke: var(--success);
  stroke-width: 2.3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.site-home--cf .mailflow-svg__packet {
  opacity: 0;
  filter: drop-shadow(0 0 11px rgba(255, 251, 245, .55));
}

.site-home--cf .mailflow-svg__packet rect {
  fill: var(--cf-cream);
  stroke: #3a2117;
  stroke-width: 1.5;
}

.site-home--cf .mailflow-svg__packet path {
  fill: none;
  stroke: #3a2117;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.site-home--cf .mailflow.is-running .mailflow-svg__route {
  stroke-dasharray: 1800;
  animation: mailflow-draw 3.9s cubic-bezier(.22, .7, .18, 1) both;
}

.site-home--cf .mailflow.is-running .mailflow-svg__packet {
  animation: mailflow-packet-visible 4.1s linear both;
}

.site-home--cf .mailflow.is-running .mailflow-svg__node {
  animation: mailflow-node-on 520ms cubic-bezier(.2, .8, .2, 1) both;
}

.site-home--cf .mailflow.is-running .mailflow-svg__node--2 { animation-delay: .7s; }
.site-home--cf .mailflow.is-running .mailflow-svg__node--3 { animation-delay: 1.45s; }
.site-home--cf .mailflow.is-running .mailflow-svg__node--4 { animation-delay: 2.2s; }
.site-home--cf .mailflow.is-running .mailflow-svg__node--5 { animation-delay: 3.05s; }

.site-home--cf .mailflow__mobile {
  display: none;
}

.site-home--cf .mailflow__status {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-block-start: 1px solid var(--cf-line);
  background: rgba(18, 17, 17, .9);
}

.site-home--cf .mailflow__status > div {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 10px;
  min-height: 66px;
  padding-inline: 22px;
}

.site-home--cf .mailflow__status > div + div {
  border-inline-start: 1px solid var(--cf-line);
}

.site-home--cf .mailflow__status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--success);
  box-shadow: 0 0 0 4px rgba(66, 211, 157, .11);
}

.site-home--cf .mailflow__status span:nth-child(2) {
  color: #a99c97;
  font-size: 12px;
}

.site-home--cf .mailflow__status strong {
  color: #7ce2bc;
  font: 650 11px/1 "JetBrains Mono", monospace;
  letter-spacing: .05em;
}

.site-home--cf .mailflow figcaption {
  position: relative;
  z-index: 2;
  padding: 16px 22px;
  border-block-start: 1px solid rgba(255, 251, 245, .07);
  color: #8f817c;
  background: #111010;
  font-size: 12px;
  line-height: 1.5;
}

@keyframes mailflow-draw {
  from { stroke-dashoffset: 1800; }
  to { stroke-dashoffset: 0; }
}

@keyframes mailflow-packet-visible {
  0%, 4% { opacity: 0; }
  10%, 92% { opacity: 1; }
  100% { opacity: 0; }
}

@keyframes mailflow-node-on {
  0% { opacity: .42; filter: brightness(.72); }
  58% { opacity: 1; filter: brightness(1.22); }
  100% { opacity: 1; filter: brightness(1); }
}

/* Marketing sections */
.site-home--cf .section:not(.hero):not(.mailflow-section) {
  padding-block: clamp(92px, 10vw, 148px);
  border-color: var(--cf-line);
  background: var(--cf-ink);
}

.site-home--cf .section-head {
  max-width: 920px;
  margin-block-end: clamp(40px, 5vw, 64px);
}

.site-home--cf .section-head .eyebrow,
.site-home--cf .cta-band .eyebrow {
  width: fit-content;
  min-height: 30px;
  padding-inline: 12px;
  border: 1px solid rgba(255, 94, 31, .35);
  border-radius: 999px;
  color: #ff9a62;
  background: rgba(255, 94, 31, .1);
  font-size: 12px;
  font-weight: 650;
}

.site-home--cf .section .type-h2,
.site-home--cf .cta-band .type-h2 {
  max-width: 17ch;
  margin-block-start: 18px;
  color: var(--cf-cream);
  font-size: clamp(2.35rem, 4.4vw, 4.65rem);
  font-weight: 500;
  line-height: 1.01;
  letter-spacing: -.048em;
  text-wrap: balance;
}

.site-home--cf .section-head .lead,
.site-home--cf .cta-band .lead {
  max-width: 710px;
  margin-block-start: 20px;
  color: var(--cf-muted);
  font-size: 18px;
  line-height: 1.55;
}

.site-home--cf .section-head > .btn {
  margin-block-start: 24px;
}

.site-home--cf .card,
.site-home--cf .pricing-console,
.site-home--cf .steps,
.site-home--cf .faq,
.site-home--cf .cta-band {
  border: 1px solid var(--cf-line);
  border-radius: 16px;
  background: var(--cf-panel);
  box-shadow: none;
}

.site-home--cf .card__header {
  border-color: var(--cf-line);
  background: rgba(255, 251, 245, .025);
}

.site-home--cf .card__title,
.site-home--cf .launch-row__copy strong,
.site-home--cf .pricing-console__facts dd,
.site-home--cf .pricing-console__formula strong {
  color: var(--cf-cream);
}

.site-home--cf .text-subtle,
.site-home--cf .launch-row__copy span,
.site-home--cf .pricing-console__facts dt,
.site-home--cf .pricing-console__note {
  color: var(--cf-muted);
}

.site-home--cf .badge--success,
.site-home--cf .badge--secondary {
  border: 1px solid rgba(255, 251, 245, .1);
  color: #d9ccc7;
  background: rgba(255, 251, 245, .07);
}

.site-home--cf .badge--success {
  border-color: rgba(66, 211, 157, .2);
  color: #86e8c3;
  background: rgba(66, 211, 157, .09);
}

.site-home--cf .launch-row + .launch-row,
.site-home--cf .pricing-console__facts > div,
.site-home--cf .pricing-console__action {
  border-color: var(--cf-line);
}

.site-home--cf .pricing-console {
  overflow: hidden;
  color: #25201d;
  background: var(--cf-cream);
}

.site-home--cf .pricing-console__main {
  background: var(--cf-cream);
}

.site-home--cf .pricing-console__heading .type-h3,
.site-home--cf .pricing-console__heading .text-subtle,
.site-home--cf .pricing-console__facts dd,
.site-home--cf .pricing-console__formula strong,
.site-home--cf .pricing-console__action > strong {
  color: #1d1917;
}

.site-home--cf .pricing-console__heading .text-subtle,
.site-home--cf .pricing-console__facts dt,
.site-home--cf .pricing-console__price span,
.site-home--cf .pricing-console__note,
.site-home--cf .pricing-console__action > .text-subtle {
  color: #6e625d;
}

.site-home--cf .pricing-console__facts,
.site-home--cf .pricing-console__formula {
  border: 1px solid rgba(21, 20, 20, .12);
  background: rgba(21, 20, 20, .045);
  box-shadow: none;
}

.site-home--cf .pricing-console__facts > div,
.site-home--cf .pricing-console__action {
  border-color: rgba(21, 20, 20, .12);
}

.site-home--cf .pricing-console__action {
  background: #f0e3de;
}

.site-home--cf .pricing-console .btn--primary {
  border-color: var(--cf-orange) !important;
  color: #24140e !important;
  background: var(--cf-orange) !important;
}

.site-home--cf .pricing-console .btn--primary:hover {
  border-color: var(--cf-orange-deep) !important;
  background: #ff7139 !important;
}

.site-home--cf .readiness-grid {
  gap: 18px;
}

.site-home--cf .launch-gate--positive {
  border-color: rgba(66, 211, 157, .16);
  color: #8ce9c6;
  background: rgba(66, 211, 157, .08);
}

.site-home--cf #features .grid {
  gap: 18px;
}

.site-home--cf #features .card {
  min-height: 350px;
  border-radius: 16px;
  transition: border-color 180ms ease, background-color 180ms ease;
}

.site-home--cf #features .card:hover {
  border-color: rgba(255, 94, 31, .5);
  background: #211d1b;
}

.site-home--cf #features .card__body {
  align-content: start;
  height: 100%;
  padding: 34px;
}

.site-home--cf #features .tile {
  width: 52px;
  height: 52px;
  margin-block-end: auto;
  border-radius: 13px;
  color: #23130d;
  background: var(--cf-orange);
  box-shadow: 0 12px 35px rgba(255, 94, 31, .18);
}

.site-home--cf #features .card__title {
  margin-block-start: 78px;
  color: var(--cf-cream);
  font-size: 22px;
  font-weight: 550;
  line-height: 1.12;
  letter-spacing: -.025em;
}

.site-home--cf #features .text-base {
  color: var(--cf-muted);
  line-height: 1.62;
}

.site-home--cf .steps {
  border: 1px solid var(--cf-line);
  background: var(--cf-panel);
}

.site-home--cf .step + .step {
  border-color: var(--cf-line);
}

.site-home--cf .step::before {
  border-color: var(--cf-orange);
  color: #24140e;
  background: var(--cf-orange);
}

.site-home--cf .step__title {
  color: var(--cf-cream);
}

.site-home--cf .step__desc,
.site-home--cf .banner__body {
  color: var(--cf-muted);
}

.site-home--cf .banner--info {
  border: 1px solid rgba(255, 94, 31, .22);
  color: #ffad81;
  background: rgba(255, 94, 31, .08);
}

.site-home--cf .banner__title {
  color: var(--cf-cream);
}

.site-home--cf .list-check > li::before {
  color: var(--cf-orange-soft);
}

.site-home--cf .faq-list {
  border-block-start: 1px solid var(--cf-line);
}

.site-home--cf .faq {
  border-width: 0 0 1px;
  border-radius: 0;
  background: transparent;
}

.site-home--cf .faq__q {
  min-height: 84px;
  color: var(--cf-cream);
  font-size: 19px;
  font-weight: 520;
}

.site-home--cf .faq__q:hover {
  color: #ff9b65;
  background: transparent;
}

.site-home--cf .faq__a {
  color: var(--cf-muted);
}

.site-home--cf .faq__a a {
  color: #ffad81;
}

.site-home--cf .home-blog__grid {
  gap: 18px;
}

.site-home--cf .home-blog-card {
  overflow: hidden;
  border: 1px solid var(--cf-line);
  border-radius: 16px;
  color: var(--cf-cream);
  background: var(--cf-panel);
  box-shadow: none;
  transition: border-color 180ms ease, background-color 180ms ease;
}

.site-home--cf .home-blog-card:hover {
  border-color: rgba(255, 94, 31, .45);
  background: #211d1b;
  box-shadow: none;
  transform: none;
}

.site-home--cf .home-blog-card img {
  filter: grayscale(1) sepia(.75) saturate(2.8) hue-rotate(332deg) brightness(.92) contrast(1.05);
}

.site-home--cf .home-blog-card__body > span {
  color: #ff9b65;
}

.site-home--cf .home-blog-card__body h3 {
  color: var(--cf-cream);
}

.site-home--cf .home-blog-card__body p {
  color: var(--cf-muted);
}

/* A real customer story, carried into the new identity without recolouring
   the customer's own logo. The cover is treated like the editorial art above. */
.site-home--cf #cases .case-card {
  overflow: hidden;
  border: 1px solid var(--cf-line);
  border-radius: 18px;
  color: var(--cf-cream-soft);
  background: var(--cf-panel);
  box-shadow: none;
  transition: border-color 180ms ease, background-color 180ms ease;
}

.site-home--cf #cases .case-card:hover {
  border-color: rgba(255, 94, 31, .48);
  color: var(--cf-cream-soft);
  background: #211d1b;
}

.site-home--cf #cases .case-card:focus-visible {
  outline: 2px solid var(--cf-cream);
  outline-offset: 4px;
  box-shadow: none;
}

.site-home--cf #cases .case-card__media {
  background: #111010;
}

.site-home--cf #cases .case-card__media > img {
  filter: grayscale(.35) sepia(.58) saturate(1.75) hue-rotate(334deg) brightness(.84) contrast(1.08);
}

.site-home--cf #cases .case-card__media::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255, 94, 31, .13), transparent 58%);
  content: "";
  pointer-events: none;
}

.site-home--cf #cases .case-card__relation {
  z-index: 1;
  border-color: rgba(255, 251, 245, .18);
  color: var(--cf-cream);
  background: rgba(21, 20, 20, .76);
  backdrop-filter: blur(10px);
}

.site-home--cf #cases .case-card__body {
  padding: clamp(28px, 4vw, 52px);
}

.site-home--cf #cases .case-card__logo {
  box-sizing: border-box;
  width: 180px;
  max-height: none;
  padding: 9px 13px;
  border-radius: 10px;
  background: #fffaf5;
}

.site-home--cf #cases .case-tag {
  border: 1px solid rgba(255, 94, 31, .2);
  color: #ffad81;
  background: rgba(255, 94, 31, .09);
}

.site-home--cf #cases .case-card h2 {
  color: var(--cf-cream);
  font-weight: 520;
  letter-spacing: -.035em;
}

.site-home--cf #cases .case-card__excerpt,
.site-home--cf #cases .case-card__footer {
  color: var(--cf-muted);
}

.site-home--cf #cases .case-card__proof {
  border: 1px solid rgba(66, 211, 157, .16);
  color: #9eeacf;
  background: rgba(66, 211, 157, .08);
}

.site-home--cf #cases .case-card__footer {
  border-block-start: 1px solid var(--cf-line);
}

.site-home--cf #cases .case-card__footer > span {
  color: #ffad81;
}

.site-home--cf .section--tight:last-of-type {
  padding: 8px 8px 0;
  border: 0;
}

.site-home--cf .cta-band {
  position: relative;
  min-height: 440px;
  align-content: center;
  padding: clamp(40px, 7vw, 96px);
  overflow: hidden;
  border: 0;
  border-radius: 18px;
  color: #27150e;
  background:
    radial-gradient(circle at 90% 120%, rgba(255, 246, 230, .7), transparent 37%),
    var(--cf-orange);
}

.site-home--cf .cta-band::after {
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle, rgba(61, 25, 10, .24) 1px, transparent 1.1px);
  background-size: 11px 11px;
  content: "";
  opacity: .32;
  mask-image: linear-gradient(90deg, transparent, #000);
  pointer-events: none;
}

.site-home--cf .cta-band > * {
  position: relative;
  z-index: 1;
}

.site-home--cf .cta-band .eyebrow {
  border-color: rgba(31, 16, 10, .22);
  color: #2c180f;
  background: rgba(255, 251, 245, .32);
}

.site-home--cf .cta-band .type-h2 {
  max-width: 14ch;
  color: #fff;
}

.site-home--cf .cta-band .lead {
  color: rgba(42, 21, 13, .8);
}

.site-home--cf .cta-band .btn--primary {
  border-color: var(--cf-cream) !important;
  color: #201613 !important;
  background: var(--cf-cream) !important;
}

/* The production lead form is embedded in the orange close as a dark task
   surface. This preserves the campaign block's impact while keeping form work calm. */
.site-home--cf #contact {
  --text-danger: #ffaaa5;
  --danger: #ff6f68;
}

.site-home--cf #contact .contact-band {
  min-height: 0;
  justify-items: stretch;
  gap: clamp(32px, 5vw, 64px);
  text-align: start;
}

.site-home--cf #contact .contact-band__copy {
  align-self: center;
  align-content: start;
  max-width: 610px;
}

.site-home--cf #contact .contact-band .type-h2,
.site-home--cf #contact .contact-band .lead {
  margin-block-start: 0;
}

.site-home--cf #contact .contact-band .lead {
  margin-inline: 0;
  color: #2a150d;
}

.site-home--cf #contact .contact-band__alternative {
  color: #2a150d;
  font-size: 14px;
}

.site-home--cf #contact .contact-band__alternative a {
  color: #26130c;
  font-weight: 650;
  text-decoration-color: rgba(38, 19, 12, .5);
  text-decoration-thickness: 1px;
  text-underline-offset: .25em;
}

.site-home--cf #contact .contact-form {
  width: 100%;
  max-width: 540px;
  justify-self: end;
  padding: clamp(24px, 3vw, 36px);
  border: 1px solid rgba(255, 251, 245, .16);
  border-radius: 16px;
  color: var(--cf-cream-soft);
  background: rgba(13, 13, 13, .95);
  box-shadow: 0 24px 70px rgba(55, 18, 5, .28);
}

.site-home--cf #contact .field {
  min-height: 48px;
  border: 1px solid var(--cf-line);
  border-radius: 12px;
  color: var(--cf-cream);
  background: #24211f;
  box-shadow: none;
}

.site-home--cf #contact .field--area {
  min-height: 120px;
  padding-block: 14px;
}

.site-home--cf #contact .field::placeholder {
  color: #aa9a94;
}

.site-home--cf #contact .field:focus,
.site-home--cf #contact .field:focus-visible {
  border-color: var(--cf-orange);
  box-shadow: 0 0 0 3px rgba(255, 94, 31, .2);
}

.site-home--cf #contact .field[aria-invalid="true"] {
  border-color: var(--danger);
  box-shadow: 0 0 0 3px rgba(255, 111, 104, .16);
}

.site-home--cf #contact .label {
  color: var(--cf-cream);
}

.site-home--cf #contact :is(.label__optional, .field-hint, .choice__desc, .contact-form__status) {
  color: var(--cf-muted);
}

.site-home--cf #contact .label__required,
.site-home--cf #contact .contact-form__status[data-state="error"] {
  color: var(--text-danger);
}

.site-home--cf #contact .contact-form__status[data-state="success"] {
  color: var(--text-success);
}

.site-home--cf #contact .choice {
  min-height: 44px;
  color: var(--cf-cream-soft);
}

.site-home--cf #contact .choice__desc a {
  color: #ffad81;
}

.site-home--cf #contact .checkbox {
  border: 1px solid var(--cf-line-strong);
  background: #24211f;
  box-shadow: none;
}

.site-home--cf #contact .checkbox:checked {
  border-color: var(--cf-orange);
  background: var(--cf-orange);
  box-shadow: 0 0 0 1px var(--cf-orange);
}

.site-home--cf #contact .checkbox:focus-visible {
  box-shadow: 0 0 0 3px rgba(255, 94, 31, .24);
}

.site-home--cf #contact .contact-form .btn--primary {
  min-height: 48px;
}

.site-home--cf .contact-form__website {
  position: absolute;
  inset-inline-start: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.site-home--cf .contact-form__status {
  min-height: 1.5em;
  margin: 0;
  font-size: 13px;
}

@media (min-width: 64rem) {
  .site-home--cf #contact .contact-band {
    grid-template-columns: minmax(0, .92fr) minmax(25rem, .8fr);
    align-items: center;
  }
}

@media (max-width: 63.999rem) {
  .site-home--cf #contact .contact-form {
    max-width: none;
    justify-self: stretch;
  }
}

/* Footer */
.site-home--cf .site-footer {
  padding-block: 80px 40px;
  border: 0;
  background: var(--cf-ink-deep);
}

.site-home--cf .site-footer__cols {
  gap: 42px;
}

.site-home--cf .site-footer__title {
  color: var(--cf-cream);
}

.site-home--cf .site-footer__link,
.site-home--cf .footer-blurb,
.site-home--cf .site-footer__legal {
  color: #9f918c;
}

.site-home--cf .site-footer__link:hover {
  color: #ff9b65;
}

.site-home--cf .site-footer__legal {
  border-color: var(--cf-line);
}

/* Deliberate, brief scroll reveal. */
[data-reveal-root] .site-home--cf .reveal {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 520ms cubic-bezier(.2, .72, .2, 1) var(--reveal-delay, 0ms),
              transform 520ms cubic-bezier(.2, .72, .2, 1) var(--reveal-delay, 0ms);
}

[data-reveal-root] .site-home--cf .reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (min-width: 70rem) {
  .site-home--cf .dashboard-topbar__nav {
    display: flex;
  }

  .site-home--cf .dashboard-menu {
    display: none;
  }
}

@media (max-width: 69.999rem) {
  .site-home--cf .dashboard-topbar__logo {
    margin-inline-end: auto;
  }

  .site-home--cf .dashboard-topbar__nav {
    display: none;
  }

  .site-home--cf .dashboard-menu {
    display: block;
  }
}

@media (max-width: 74rem) {
  .site-home--cf .dashboard-topbar__nav-link {
    padding-inline: 10px;
  }

  .site-home--cf .mailflow__stage {
    min-height: 470px;
  }
}

@media (max-width: 63.999rem) {
  body.site-home--cf {
    --header-height: 66px;
  }

  .site-home--cf .hero__surface {
    min-height: 720px;
  }

  .site-home--cf .mailflow-section__head {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .site-home--cf .mailflow-section__head .lead {
    max-width: 680px;
  }

  .site-home--cf #features .card {
    min-height: 310px;
  }
}

@media (max-width: 47.999rem) {
  .site-home--cf .container {
    width: calc(100% - 32px);
  }

  .site-home--cf .hero {
    padding: 4px 4px 0;
  }

  .site-home--cf .hero__surface {
    align-content: space-between;
    min-height: 736px;
    padding: 74px 22px 18px;
    border-radius: 14px;
  }

  .site-home--cf .hero__copy {
    justify-items: start;
    text-align: start;
  }

  .site-home--cf .hero__eyebrow {
    margin-block-end: 20px;
  }

  .site-home--cf .hero .type-h1 {
    max-width: 10.8ch;
    font-size: clamp(2.45rem, 11.2vw, 3.4rem);
    line-height: .98;
  }

  .site-home--cf .hero .lead {
    margin-block-start: 22px;
    font-size: 16.5px;
    text-wrap: pretty;
  }

  .site-home--cf .hero__actions {
    display: grid;
    width: 100%;
    gap: 10px;
    margin-block-start: 24px;
  }

  .site-home--cf .hero__actions .btn {
    width: 100%;
  }

  .site-home--cf .hero-microcopy {
    align-items: flex-start;
    margin-block-start: 14px;
    font-size: 12px;
  }

  .site-home--cf .hero__chips {
    grid-template-columns: 1fr 1fr;
    margin-block-start: 34px;
  }

  .site-home--cf .hero__chips li {
    min-height: 62px;
    padding: 11px 13px;
  }

  .site-home--cf .hero__chips li + li {
    border-block-start: 0;
  }

  .site-home--cf .hero__chips li:nth-child(2) {
    border-inline-start: 1px solid rgba(255, 251, 245, .13);
  }

  .site-home--cf .hero__chips li:nth-child(3) {
    grid-column: 1 / -1;
    border-block-start: 1px solid rgba(255, 251, 245, .13);
    border-inline-start: 0;
  }

  .site-home--cf .hero__trace {
    inset: auto -28% 9% -28%;
    width: 156%;
  }

  .site-home--cf .mailflow-section {
    padding-block: 94px 110px;
  }

  .site-home--cf .mailflow-section__head {
    margin-block-end: 34px;
  }

  .site-home--cf .mailflow-section__head .type-h2 {
    font-size: clamp(2.55rem, 12vw, 4rem);
  }

  .site-home--cf .mailflow__toolbar {
    display: grid;
    padding: 18px;
  }

  .site-home--cf .mailflow__controls {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
    border-radius: 12px;
  }

  .site-home--cf .mailflow__tab {
    min-height: 44px;
    min-width: 0;
    padding-inline: 7px;
    border-radius: 9px;
    font-size: 12px;
  }

  .site-home--cf .mailflow__stage {
    min-height: 390px;
  }

  .site-home--cf .mailflow__svg {
    display: none;
  }

  .site-home--cf .mailflow__mobile {
    position: absolute;
    inset: 48px 22px 38px;
    display: grid;
    align-content: space-between;
    gap: 18px;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .site-home--cf .mailflow__mobile::before {
    position: absolute;
    z-index: 0;
    inset: 25px auto 25px 23px;
    width: 3px;
    border-radius: 999px;
    background: linear-gradient(var(--cf-orange), var(--cf-orange-soft), var(--cf-orange));
    box-shadow: 0 0 18px rgba(255, 94, 31, .32);
    content: "";
    transform-origin: top;
  }

  .site-home--cf .mailflow__mobile li {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 54px;
  }

  .site-home--cf .mailflow__mobile-icon {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border: 1px solid rgba(255, 251, 245, .18);
    border-radius: 50%;
    color: var(--cf-cream);
    background: #1d1a19;
    box-shadow: 0 0 0 6px #0d0d0d;
  }

  .site-home--cf .mailflow__mobile-icon .icon {
    width: 21px;
    height: 21px;
  }

  .site-home--cf .mailflow__mobile-copy {
    display: grid;
    gap: 3px;
  }

  .site-home--cf .mailflow__mobile-copy strong {
    color: var(--cf-cream);
    font-size: 14px;
  }

  .site-home--cf .mailflow__mobile-copy span {
    color: #8f817c;
    font: 500 10px/1.35 "JetBrains Mono", monospace;
  }

  .site-home--cf .mailflow__mobile-pass {
    color: #7ce2bc;
    font: 650 9px/1 "JetBrains Mono", monospace;
  }

  .site-home--cf .mailflow.is-running .mailflow__mobile::before {
    animation: mailflow-mobile-line 3.6s ease both;
  }

  .site-home--cf .mailflow.is-running .mailflow__mobile li {
    animation: mailflow-node-on 450ms ease both;
  }

  .site-home--cf .mailflow.is-running .mailflow__mobile li:nth-child(2) { animation-delay: .9s; }
  .site-home--cf .mailflow.is-running .mailflow__mobile li:nth-child(3) { animation-delay: 1.8s; }
  .site-home--cf .mailflow.is-running .mailflow__mobile li:nth-child(4) { animation-delay: 2.7s; }

  .site-home--cf .mailflow__status {
    grid-template-columns: 1fr;
  }

  .site-home--cf .mailflow__status > div {
    min-height: 48px;
  }

  .site-home--cf .mailflow__status > div + div {
    border-block-start: 1px solid var(--cf-line);
    border-inline-start: 0;
  }

  .site-home--cf .section:not(.hero):not(.mailflow-section) {
    padding-block: 88px;
  }

  .site-home--cf .section .type-h2,
  .site-home--cf .cta-band .type-h2 {
    font-size: clamp(2.3rem, 11vw, 3.5rem);
  }

  .site-home--cf #features .card {
    min-height: 0;
  }

  .site-home--cf #features .card__body {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    height: auto;
    padding: 24px;
  }

  .site-home--cf #features .tile {
    width: 46px;
    height: 46px;
    margin: 0;
  }

  .site-home--cf #features .card__title {
    margin: 2px 0 0;
  }

  .site-home--cf #features .text-base {
    grid-column: 2;
  }

  .site-home--cf .faq__q {
    min-height: 72px;
    font-size: 17px;
  }

  .site-home--cf .section--tight:last-of-type {
    padding: 4px 4px 0;
  }

  .site-home--cf .cta-band {
    min-height: 510px;
    padding: 42px 24px;
    border-radius: 14px;
  }

  .site-home--cf .site-footer {
    padding-block-start: 64px;
  }
}

@media (max-width: 32rem) {
  .site-home--cf .dashboard-topbar__inner {
    padding-inline: 12px;
  }

  .site-home--cf .dashboard-topbar__logo > span {
    display: none;
  }

  .site-home--cf .dashboard-topbar__login {
    border-color: transparent;
  }
}

@media (pointer: coarse) {
  .site-home--cf .mailflow__tab {
    min-height: 44px;
  }
}

@keyframes mailflow-mobile-line {
  from { transform: scaleY(0); opacity: .35; }
  to { transform: scaleY(1); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .site-home--cf *,
  .site-home--cf *::before,
  .site-home--cf *::after {
    scroll-behavior: auto !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }

  [data-reveal-root] .site-home--cf .reveal {
    opacity: 1;
    transform: none;
  }

  .site-home--cf .mailflow__svg,
  .site-home--cf .mailflow::before {
    transform: none;
    background-position: 0 0;
  }
}

@media (forced-colors: active) {
  .site-home--cf .hero__surface,
  .site-home--cf .cta-band,
  .site-home--cf .pricing-console {
    border: 2px solid CanvasText;
  }

  .site-home--cf .mailflow-svg__route {
    stroke: CanvasText;
  }
}