:root {
  --sub-display: 48px;
  --sub-heading: 32px;
  --sub-subheading: 20px;
  --sub-body: 13px;
  --sub-secondary: 11px;
}

.brand-mark {
  width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  overflow: visible !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.brand-mark img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.mobile-menu-toggle {
  display: none;
}

.platform-menu-panel {
  display: contents;
}

body .hero h1,
body .contact-hero h1 {
  font-size: var(--sub-display) !important;
  line-height: 1.1 !important;
  letter-spacing: 0 !important;
}

body .section-head h2,
body .order-flow h2,
body .form-section-heading h2,
body .section-heading h2 {
  font-size: var(--sub-heading) !important;
  line-height: 1.18 !important;
  letter-spacing: 0 !important;
}

body .hero-summary h2,
body .intro-title,
body .plan-title strong,
body .step b,
body .info-item b {
  font-size: var(--sub-subheading);
  line-height: 1.35;
  letter-spacing: 0;
}

body .hero-box > div > p:not(.eyebrow),
body .section-head p,
body .order-flow-head > p,
body .package-copy,
body .form-section-heading p,
body .form-grid label > span {
  font-size: var(--sub-body) !important;
  line-height: 1.65 !important;
  letter-spacing: 0 !important;
}

body .hero-summary p,
body .plan-title small,
body .features li,
body .step span,
body .info-item span,
body .footer-note,
body footer,
body .form-note span,
body .form-grid small,
body .privacy-check,
body .contact-buttons em,
body .qr-card > p {
  font-size: var(--sub-secondary);
  line-height: 1.55;
  letter-spacing: 0;
}

@media (max-width: 760px) {
  :root {
    --sub-display: 34px;
    --sub-heading: 26px;
    --sub-subheading: 15px;
    --sub-body: 13px;
    --sub-secondary: 11px;
  }

  header {
    position: sticky !important;
    top: 0;
    z-index: 60 !important;
  }

  header .nav {
    position: relative;
    height: 60px !important;
    min-height: 60px !important;
    padding: 8px 0 !important;
    flex-wrap: nowrap !important;
    gap: 9px !important;
  }

  header .brand {
    min-width: 0;
    margin-right: auto;
  }

  header .brand-mark {
    width: 34px !important;
    height: 34px !important;
  }

  header .brand strong {
    font-size: 13px !important;
  }

  header .brand small {
    display: none !important;
  }

  .mobile-menu-toggle {
    position: relative;
    display: block;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    padding: 10px;
    border: 1px solid #ded8d2;
    border-radius: 8px;
    background: #fff;
    color: #171717;
    cursor: pointer;
  }

  .mobile-menu-toggle span {
    position: absolute;
    left: 11px;
    top: 19px;
    display: block;
    width: 19px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
    transform-origin: center;
    transition: transform .18s, opacity .18s;
  }

  .mobile-menu-toggle::before {
    content: "";
  }

  .mobile-menu-toggle span:nth-child(1) {
    transform: translateY(-6px);
  }

  .mobile-menu-toggle span:nth-child(3) {
    transform: translateY(6px);
  }

  header.menu-open .mobile-menu-toggle::before {
    content: "\00d7";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    font-size: 28px;
    font-weight: 400;
    line-height: 1;
  }

  header.menu-open .mobile-menu-toggle span {
    opacity: 0;
  }

  .platform-menu-panel,
  .contact-menu-panel {
    position: absolute;
    top: calc(100% + 1px);
    left: 0;
    right: 0;
    z-index: 80;
    display: none;
    gap: 9px;
    padding: 12px;
    border: 1px solid #e5dfd9;
    border-radius: 0 0 10px 10px;
    background: rgba(255,255,255,.99);
    box-shadow: 0 18px 35px rgba(30,22,18,.14);
  }

  header.menu-open .platform-menu-panel,
  header.menu-open .contact-menu-panel {
    display: grid;
  }

  header .platform-menu-panel .tabs,
  .contact-menu-panel {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  header .platform-menu-panel .tabs {
    order: 0 !important;
    display: grid !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 7px !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
  }

  header .platform-menu-panel .tabs a,
  .contact-menu-panel a,
  .contact-menu-panel button {
    display: flex;
    min-height: 42px !important;
    align-items: center;
    justify-content: center;
    padding: 10px 8px !important;
    border: 1px solid #e5dfd9 !important;
    border-radius: 7px !important;
    background: #fff !important;
    color: #4f4944 !important;
    font: inherit;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    text-align: center;
    cursor: pointer;
  }

  header .platform-menu-panel .tabs a.active {
    border-color: #171717 !important;
    background: #171717 !important;
    color: #fff !important;
  }

  header .platform-menu-panel .order-top {
    order: 1 !important;
    display: flex !important;
    width: 100%;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 7px !important;
    background: linear-gradient(135deg,#ff9a2f,#ff6422) !important;
    color: #fff !important;
    box-shadow: 0 8px 18px rgba(255,100,34,.22) !important;
    grid-column: 1 / -1;
  }

  .subpage-contact-header {
    width: 100% !important;
    height: 60px;
    padding: 8px max(16px,calc((100vw - 970px) / 2)) !important;
    border-bottom: 1px solid #e7e2dd;
    background: rgba(255,255,255,.98);
    backdrop-filter: blur(14px);
  }

  .subpage-contact-header > .back {
    display: none;
  }

  .subpage-contact-header .mini-brand {
    margin-right: auto;
    letter-spacing: 0;
  }

  .subpage-contact-header .mini-brand-logo {
    width: 34px;
    height: 34px;
  }

  .contact-menu-panel button {
    grid-column: 1 / -1;
  }

  body .service-nav {
    top: 60px !important;
  }

  body .plan-title strong,
  body .step b,
  body .info-item b {
    font-size: var(--sub-subheading);
  }

  body .contact-hero h1 {
    margin-top: 4px;
  }
}