@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap');

/* Display the untouched original logo, framed around the artwork. */
.wordmark, .logo:has(> img[src="flyerrun-wordmark.png"]), .logo > span:has(> img[src="flyerrun-wordmark.png"]) {
  background: #fff;
  aspect-ratio: 1045 / 340;
}
.wordmark img, .logo img[src="flyerrun-wordmark.png"] {
  content: url('flyerrun-brand.svg');
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
}
.site-header .wordmark { width: 184px; }

/* One deliberate chevron, independent of font and browser disclosure markers. */
.explore-menu > summary { list-style: none; }
.explore-menu > summary::-webkit-details-marker { display: none; }
.explore-menu > summary::marker { content: ''; }
.explore-menu > summary::after {
  content: '';
  display: block;
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  margin: -4px 1px 0 10px;
  border: solid currentColor;
  border-width: 0 1.8px 1.8px 0;
  transform: rotate(45deg);
  transition: transform .18s ease, margin .18s ease;
}
.explore-menu[open] > summary::after { transform: rotate(225deg); margin-top: 4px; }
.directory-footer { background: #fff; border-top: 1px solid #dee6f1; color: #52637a; }
.directory-footer .wordmark { width: 210px; background: #fff; }
.directory-footer .footer-directory h2 { color: #13294b; }
.directory-footer .footer-directory a, .directory-footer .footer-contact a { color: #52637a; }
.directory-footer a:hover { color: #064fe7; }
.directory-footer .footer-base { border-color: #dee6f1; }
.footer-contact { display: flex; flex-wrap: wrap; gap: 7px 22px; margin-top: 12px; font-size: 14px; }
.footer-contact a { text-decoration: none; white-space: nowrap; }
.directory-footer .footer-intro { align-items: flex-start; gap: 26px; }
.footer-intro-copy { text-align: right; }
.footer-intro-copy .footer-contact { justify-content: flex-end; }
.explore-contact { grid-column: 1 / -1; display: flex; align-items: center; flex-wrap: wrap; gap: 10px 25px; border-top: 1px solid var(--line); padding-top: 20px; }
.explore-contact a { margin: 0; font-size: 14px; }
@media (max-width: 620px) {
  .directory-footer .footer-intro { flex-direction: column; margin-bottom: 30px; }
  .footer-intro-copy { text-align: left; }
  .footer-intro-copy .footer-contact { justify-content: flex-start; }
  .explore-contact { gap: 8px 20px; }
}

/* Shared reading scale. Keep this after the page's component styles. */
:root {
  --fr-font: 'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --fr-ink: #172b4d;
  --fr-text: #52637a;
  --fr-caption: #586b84;
  --fr-title: clamp(36px, 4.2vw, 56px);
  --fr-section-title: clamp(28px, 3vw, 38px);
}

body {
  font-family: var(--fr-font);
  font-size: 16px;
  line-height: 1.6;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
h1, h2, h3, h4 { font-family: var(--fr-font); font-weight: 600; }
button, input, select, textarea { font-family: var(--fr-font); }
button, .btn { font-weight: 600; letter-spacing: 0; }
strong, b { font-weight: 600; }

/* Navigation stays readable without competing with the page title. */
.site-header > nav a,
.site-header .header-signin,
.site-header .nav-actions > .btn,
.explore-menu summary {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0;
}
.site-header .nav-actions > .btn, .site-header .header-signin, .site-header .explore-menu summary { min-height: 44px; }
.explore-panel h2, .footer-directory h2 {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.5;
  text-transform: none;
}
.explore-panel a, .footer-directory a { font-size: 14px; line-height: 1.6; }
.footer-intro p { font-size: 15px; line-height: 1.65; }
.footer-base { font-size: 13px; line-height: 1.6; }
.directory-footer { line-height: 1.6; }

/* One hierarchy across the home, pricing, service and guide pages. */
.fr-hero h1, .fr-pricing-hero h1, .info-hero h1,
.solo-page .solo-hero h1, .guide h1 {
  font-size: var(--fr-title);
  font-weight: 600;
  line-height: 1.12;
  letter-spacing: -.035em;
  text-wrap: balance;
}
.fr-section h2, .fr-band h2, .fr-price-preview h2,
.info-detail h2, .info-related > h2,
.solo-page h2, .guide h2, .guide-tracking-teaser h2 {
  font-size: var(--fr-section-title);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.025em;
  text-wrap: balance;
}
.fr-service h3, .info-cards h2, .solo-benefits h3, .guide-result-cards h3 {
  font-size: 22px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -.015em;
}
.fr-home h3, .solo-page h3, .guide h3 { font-weight: 600; }
.fr-kicker, .eyebrow, .fr-service-tag, .fr-example-label, .fr-funnel-header,
.fr-visual-top, .solo-visual-label, .solo-cta .eyebrow {
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: .07em;
}
.fr-lead, .fr-pricing-hero > p, .info-hero p, .solo-hero p,
.guide-hero p, .guide-tracking-teaser p {
  font-size: 18px;
  line-height: 1.65;
  color: var(--fr-text);
}
.fr-pricing-hero { max-width: 820px; padding-top: 64px; padding-bottom: 48px; }
.fr-pricing-hero h1 { margin: 20px 0; }
.fr-pricing-hero > p { max-width: 660px; margin-left: auto; margin-right: auto; margin-bottom: 24px; }
.fr-section-heading > p, .fr-price-preview p, .fr-price-preview > div > p,
.fr-service > p, .fr-home .story-tab p, .fr-faq details p,
.info-cards p, .info-detail p, .solo-page p,
.guide p, .guide-result-cards p, .guide-faq details p {
  font-size: 16px;
  line-height: 1.65;
}
.fr-section-heading > p, .fr-price-preview > div > p, .fr-service > p,
.fr-faq details p, .info-cards p, .info-detail p, .solo-page p {
  color: var(--fr-text);
}
.fr-service { display: flex; flex-direction: column; padding: 28px; }
.fr-service > p { min-height: 0; margin-bottom: 20px; }
.fr-service ul { margin-top: auto; font-size: 14px; line-height: 1.7; }
.fr-service li + li { margin-top: 8px; }
.fr-service-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 5px 9px; }
.fr-service-price strong {
  font-size: 32px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
}
.fr-service-price span { font-size: 13px; line-height: 1.5; }
.fr-service > a, .fr-actions .btn, .fr-textlink, .fr-cta .btn,
.fr-pricing-hero .btn, .info-hero .btn, .solo-actions, .solo-text-link {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0;
}
.fr-service > a { align-items: center; gap: 12px; min-height: 44px; }
.fr-actions .btn, .fr-cta .btn, .fr-pricing-hero .btn,
.info-hero .btn, .solo-actions .btn { min-height: 48px; }
.fr-small, .fr-caption, .fr-source, .info-detail .info-note,
.solo-hero small, .solo-page .solo-fineprint, .mailing-promise small {
  font-size: 13px;
  line-height: 1.65;
  color: var(--fr-caption);
}
.fr-caption, .fr-source { margin-top: 18px; }
.fr-price-preview h3 { font-size: 20px; line-height: 1.35; letter-spacing: -.01em; }
.fr-price-example { padding: 28px; }
.fr-price-example > p { font-size: 14px; line-height: 1.6; }
.fr-price-row { font-size: 14px; line-height: 1.5; padding: 13px 0; gap: 18px; }
.fr-price-row strong { white-space: nowrap; font-variant-numeric: tabular-nums; }
.fr-price-total { font-size: 15px; line-height: 1.5; align-items: baseline; gap: 16px; }
.fr-price-total strong { font-size: 32px; line-height: 1.2; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.fr-rate-table { font-size: 15px; line-height: 1.5; font-variant-numeric: tabular-nums; }
.fr-rate-table caption { font-size: 14px; line-height: 1.6; }
.fr-rate-table th { font-weight: 600; }
.fr-rate-table th, .fr-rate-table td { padding: 17px 20px; }
.fr-faq summary, .solo-faq summary, .guide-faq summary { font-size: 18px; font-weight: 500; line-height: 1.5; }
.fr-cta h2, .solo-page .solo-cta h2, .guide-cta h2 { font-size: clamp(28px, 2.8vw, 34px); }
.fr-cta p, .solo-page .solo-cta p { font-size: 16px; line-height: 1.6; }

/* Dark sections keep strong contrast and the same reading rhythm. */
.fr-band > div > p { font-size: 16px; line-height: 1.7; color: #c7d6ee; }
.fr-funnel-row > span { font-size: 12px; }
.fr-funnel-row strong { font-size: 16px; line-height: 1.4; }
.fr-funnel-row small { font-size: 14px; line-height: 1.6; color: #c7d6ee; margin-top: 5px; }
.fr-band .fr-funnel-note { font-size: 13px; line-height: 1.65; color: #c7d6ee; }
.response-records strong { font-size: 18px; line-height: 1.4; }
.solo-page .response-records p { font-size: 15px; color: #c7d6ee; }
.response-records small { font-size: 13px; line-height: 1.65; }

/* Illustrations support the story; their captions still need to be read. */
.fr-pill, .fr-character-row small { font-size: 12px; line-height: 1.4; letter-spacing: .02em; }
.fr-character-row strong { font-size: 14px; line-height: 1.4; }
.fr-mail-ticket strong { font-size: 16px; line-height: 1.4; }
.fr-mail-ticket p, .fr-valuebar { font-size: 13px; line-height: 1.6; }
.fr-home .story-tab strong { font-size: 17px; line-height: 1.4; }
.fr-home .story-tab p { font-size: 14px; }
.info-back { font-size: 13px; line-height: 1.5; }
.info-detail dt { font-size: 16px; font-weight: 600; line-height: 1.5; }
.info-detail dd { font-size: 15px; line-height: 1.65; }
.related-card small { font-size: 13px; line-height: 1.5; }
.related-card strong { font-size: 22px; font-weight: 600; line-height: 1.3; letter-spacing: -.015em; }
.related-card span { font-size: 14px; line-height: 1.5; }
.legal-page h1 { font-size: clamp(32px, 3.6vw, 44px); line-height: 1.2; letter-spacing: -.025em; }
.legal-page h2 { font-size: 24px; line-height: 1.35; letter-spacing: -.015em; }
.legal-page p, .legal-page li { font-size: 16px; line-height: 1.7; }
.solo-visual-caption strong { font-size: 18px; line-height: 1.4; }
.solo-visual-caption span, .business-types span { font-size: 13px; line-height: 1.5; }
.solo-steps h3 { font-size: 20px; line-height: 1.35; }
.solo-steps p, .solo-benefits p { font-size: 15px; }
.mailing-promise > div:last-of-type { font-size: 14px; line-height: 1.5; }
.quote-items span { font-size: 14px; line-height: 1.5; }
.guide .story-copy h2 { font-size: clamp(26px, 2.8vw, 34px); line-height: 1.25; }
.guide .story-copy .story-small, .guide-result-cards small,
.guide-example .example-note { font-size: 14px; line-height: 1.65; }
.guide .story-example { font-size: 18px; font-weight: 500; line-height: 1.6; }
.guide button, .guide .story-controls button { font-size: 14px; font-weight: 600; line-height: 1.5; min-height: 44px; }
.guide .story-steps button { font-size: 14px; line-height: 1.5; }
.guide-promise strong { font-size: 22px; font-weight: 600; line-height: 1.35; }
.guide-promise li span { font-size: 15px; line-height: 1.6; }
.guide-promise p { font-size: 14px; }
.guide-example li { font-size: 18px; line-height: 1.5; }

/* Booking: distinguish labels, input values, instructions and estimates. */
.booking-intro h1 { font-size: clamp(32px, 3.6vw, 44px); line-height: 1.15; letter-spacing: -.03em; }
.booking-intro > p { font-size: 16px; line-height: 1.65; }
.booking-header > a, .booking-intro > a { font-size: 14px; line-height: 1.5; }
.booking-steps button { font-size: 13px; line-height: 1.4; min-height: 44px; }
.booking-steps { align-items: start; }
.step-heading small, .estimate-top .eyebrow { font-size: 12px; line-height: 1.5; letter-spacing: .06em; }
.step-heading h2 { font-size: clamp(24px, 2.5vw, 28px); line-height: 1.3; letter-spacing: -.02em; }
.step-heading p { font-size: 16px; line-height: 1.65; }
.booking-fields label, .preset-label, .date-request, .notes-label, .choice-group legend { font-size: 14px; font-weight: 600; line-height: 1.5; }
.booking-fields input, .booking-fields select, .booking-fields textarea,
.preset-label select, .date-request input, .notes-label textarea { font-size: 16px; line-height: 1.4; }
.booking-note, .choice small, .booking-check small, .booking-controls > span,
.draft-note, .pickup-quote-status, .pickup-actions > span, .pickup-estimator > small,
.comparison-note, .estimate-fine, .estimate-warning, .estimate-footer p, .booking-footer {
  font-size: 13px;
  line-height: 1.65;
}
.draft-note, .booking-controls > span { color: var(--fr-caption); }
.choice strong { font-size: 16px; font-weight: 600; line-height: 1.4; }
.choice b { font-size: 12px; line-height: 1.4; letter-spacing: 0; align-self: flex-start; }
.booking-check, .booking-options, .booking-warning, .booking-error,
.comparison-target { font-size: 14px; line-height: 1.65; }
.booking-controls .btn, .quantity-chips button, .pickup-quote-button { font-size: 14px; line-height: 1.4; min-height: 44px; }
.estimate-badge { font-size: 12px; line-height: 1.4; }
.estimate-total { font-size: 40px; font-weight: 600; line-height: 1.15; letter-spacing: -.025em; font-variant-numeric: tabular-nums; }
#estimate-caption, .estimate-included, .estimate-card > a { font-size: 14px; line-height: 1.6; }
.estimate-line { font-size: 14px; line-height: 1.5; }
.estimate-line strong { font-variant-numeric: tabular-nums; }
.review-block h3 { font-size: 18px; line-height: 1.4; }
.review-block p { font-size: 15px; line-height: 1.65; }
.review-block button { font-size: 14px; min-height: 44px; }
.review-estimate p { font-size: 14px; line-height: 1.6; }

@media (max-width: 1050px) {
  .fr-service { padding: 24px; }
  .fr-hero { gap: 36px; }
}
@media (max-width: 760px) {
  :root { --fr-title: clamp(34px, 7.2vw, 44px); --fr-section-title: clamp(28px, 5.4vw, 34px); }
  .fr-hero h1, .fr-pricing-hero h1, .info-hero h1, .solo-page .solo-hero h1, .guide h1 { letter-spacing: -.03em; line-height: 1.15; }
  .fr-lead, .fr-pricing-hero > p, .info-hero p, .solo-hero p { font-size: 17px; }
  .fr-pricing-hero { padding: 44px 20px 36px; }
  .fr-section-heading > p { font-size: 15px; }
  .fr-valuebar { font-size: 13px; }
  .fr-price-example { padding: 24px; }
  .fr-rate-table { font-size: 14px; }
  .fr-rate-table th, .fr-rate-table td { padding: 14px 16px; }
  .fr-faq summary, .solo-faq summary, .guide-faq summary { font-size: 16px; }
  .guide .story-steps button { font-size: 13px; }
  .booking-steps button { font-size: 13px; }
  .booking-controls { flex-wrap: wrap; }
}
@media (max-width: 620px) {
  .site-header .wordmark { width: 124px; }
  .site-header .nav-actions > .btn, .explore-menu summary { font-size: 13px; line-height: 1.4; }
  .site-header .nav-actions > .btn { padding: 12px 10px; }
  .explore-menu summary { padding: 0 10px; }
  .footer-base { gap: 14px; }
  .booking-header > a { font-size: 13px; }
  .fr-visual-top { display: block; }
  .fr-visual-top .fr-pill { display: table; max-width: 100%; margin-top: 12px; white-space: normal; }
}
@media (max-width: 380px) {
  .site-header { padding: 0 10px; gap: 5px; }
  .site-header .wordmark { width: 104px; }
  .site-header .nav-actions > .btn, .explore-menu summary { font-size: 12px; }
  .site-header .nav-actions > .btn { padding: 12px 8px; }
  .explore-menu summary { padding: 0 7px; }
  .fr-character-row { gap: 4px; }
  .fr-character-row strong { font-size: 13px; }
  .fr-price-example { padding: 20px; }
  .fr-price-total strong { font-size: 28px; }
}
@media (max-width: 350px) {
  .site-header .wordmark { width: 96px; }
}