.component-nav,
.component-footer {
  border-color: var(--color-separator);
  border-style: solid;
  border-width: 0 0 1px;
}

#site-nav:empty,
[data-site-nav]:empty { min-height: 73px; }

.component-nav__inner,
.component-footer__inner {
  width: min(100% - 40px, 1120px);
  min-height: 72px;
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
}

.component-nav__brand {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  color: var(--color-foreground);
  font-weight: 700;
  text-decoration: none;
}

.component-nav__links,
.component-footer__links,
.component-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
}

.component-nav__links a,
.component-footer__links a {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  padding-inline: var(--space-3);
  border-radius: var(--radius-card);
  color: var(--color-foreground);
  text-decoration: none;
}

.component-button {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-2) var(--space-4);
  border: 1px solid var(--color-separator);
  border-radius: var(--radius-card);
  background: var(--color-surface-raised);
  color: var(--color-foreground);
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}

[data-theme="dark"] .component-button--primary { color: #1C1C1E; }

.component-button--primary {
  border-color: var(--color-accent);
  background: var(--color-accent);
  color: #fff;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .component-button--primary { color: #1C1C1E; }
}

.component-hero,
.component-trust,
.component-module,
.component-features,
.component-faq {
  width: min(100% - 40px, 1120px);
  margin-inline: auto;
}

.component-hero {
  padding-block: clamp(48px, 9vw, 96px);
  text-align: center;
}

.component-hero__title {
  max-width: 18ch;
  margin-inline: auto;
  overflow-wrap: anywhere;
}

.component-eyebrow {
  margin-block-end: var(--space-3);
  color: var(--color-accent);
  font-weight: 600;
}

.component-hero__description,
.component-module__description {
  max-width: 64ch;
  margin: var(--space-4) auto 0;
  color: var(--color-secondary);
  font-size: clamp(16px, 2vw, 20px);
  overflow-wrap: anywhere;
}

.component-hero__image {
  width: min(100%, 960px);
  height: auto;
  margin: var(--space-8) auto 0;
  border-radius: var(--radius-card);
}

.component-actions { justify-content: center; margin-block-start: var(--space-6); }
.component-trust { padding-block: var(--space-5); border-block: 1px solid var(--color-separator); }
.component-trust__label { margin-block-end: var(--space-3); font-size: var(--type-secondary); }
.component-trust__items { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-6); padding: 0; list-style: none; }
.component-trust__items li { overflow-wrap: anywhere; }

.component-module {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: clamp(24px, 6vw, 80px);
  padding-block: clamp(48px, 8vw, 88px);
}
.component-module--reverse .component-module__copy { order: 2; }
.component-module--reverse .component-module__media { order: 1; }
.component-module--text-only { grid-template-columns: minmax(0, 1fr); }
.component-module__title { overflow-wrap: anywhere; }
.component-module__description { margin-inline: 0; font-size: var(--type-body); }
.component-module__points { display: grid; gap: var(--space-3); padding-inline-start: 1.25em; }
.component-module__media { min-width: 0; margin: 0; }
.component-module__media img { width: 100%; height: auto; border-radius: var(--radius-card); }
.component-module__media figcaption { margin-block-start: var(--space-2); color: var(--color-secondary); }

.component-features { padding-block: var(--space-8); }
.component-features__title { margin-block-end: var(--space-5); }
.component-features__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
.component-feature,
.component-price-card { min-width: 0; padding: var(--space-5); border: 1px solid var(--color-separator); border-radius: var(--radius-card); background: var(--color-surface); }
.component-feature__title { margin-block-end: var(--space-2); overflow-wrap: anywhere; }
.component-feature p,
.component-price-card p,
.component-faq__answer { color: var(--color-secondary); overflow-wrap: anywhere; }

.component-price-card { display: grid; align-content: start; gap: var(--space-3); }
.component-price-card__amount { color: var(--color-foreground) !important; font-size: var(--type-title); font-weight: 700; }
.component-price-card__previous { text-decoration: line-through; }
.component-term-toggle { width: fit-content; max-width: 100%; display: flex; flex-wrap: wrap; gap: var(--space-1); padding: var(--space-1); border: 1px solid var(--color-separator); border-radius: var(--radius-card); }
.component-term-toggle__option { min-width: 44px; min-height: 44px; padding: var(--space-2) var(--space-3); border: 0; border-radius: var(--radius-card); background: transparent; color: var(--color-foreground); cursor: pointer; }
.component-term-toggle__option.is-selected { background: var(--color-accent); color: #fff; }
[data-theme="dark"] .component-term-toggle__option.is-selected { color: #1C1C1E; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .component-term-toggle__option.is-selected { color: #1C1C1E; }
}

.component-faq { padding-block: var(--space-8); }
.component-faq__title { margin-block-end: var(--space-4); }
.component-faq__item { border-block-start: 1px solid var(--color-separator); }
.component-faq__question { min-height: 52px; display: flex; align-items: center; padding-block: var(--space-3); font-weight: 600; cursor: pointer; overflow-wrap: anywhere; }
.component-faq__answer { padding: 0 0 var(--space-4); }
.component-footer { border-width: 1px 0 0; }
.component-footer__inner { min-height: 80px; flex-wrap: wrap; padding-block: var(--space-4); color: var(--color-secondary); }
.component-footer__note { max-width: 64ch; }
.component-footer__links { gap: var(--space-1); }
.component-estimate { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-2); }
.component-estimate__mark { color: var(--color-secondary); }
.component-estimate__disclosure { display: inline-block; }
.component-estimate__trigger { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; color: var(--color-accent); cursor: pointer; }
.component-estimate__details { max-width: min(36rem, calc(100vw - 40px)); margin: var(--space-2) 0; padding: var(--space-3) var(--space-5); border: 1px solid var(--color-separator); border-radius: var(--radius-card); background: var(--color-surface-raised); color: var(--color-foreground); overflow-wrap: anywhere; }

@media (max-width: 720px) {
  #site-nav:empty { min-height: 249px; }
  [data-site-nav]:empty { min-height: 129px; }
  .component-nav__inner,
  .component-footer__inner { align-items: stretch; flex-direction: column; padding-block: var(--space-3); }
  .component-nav__links a { flex: 1 1 auto; }
  .component-nav__inner > .component-button { width: 100%; }
  .component-actions { align-items: stretch; flex-direction: column; }
  .component-actions > * { width: 100%; }
  .component-module { grid-template-columns: minmax(0, 1fr); }
  .component-module--reverse .component-module__copy,
  .component-module--reverse .component-module__media { order: initial; }
  .component-features__grid { grid-template-columns: minmax(0, 1fr); }
  .component-term-toggle { width: 100%; }
  .component-term-toggle__option { flex: 1 1 auto; }
}

@media (prefers-reduced-motion: reduce) {
  .component-nav *, .component-footer *, .component-hero *, .component-module *,
  .component-features *, .component-faq *, .component-price-card *, .component-trust * {
    scroll-behavior: auto !important;
    animation: none !important;
    transition: none !important;
  }
}
