/* Cardly readability v3 - public landing + Inertia app; appended AFTER bundled CSS.
   Deliberately preserves h1/h2/h3 headline sizes, logo dimensions and card artwork. */
:root { --cardly-readable-body: 15px; --cardly-readable-muted: #657062; }
/* Marketing base text. Do not enlarge the phone mockup beyond its fixed design. */
.site-header .nav nav, .site-header .nav-actions,
.site-header .login-link, .footer-links { font-size: 14px !important; line-height: 1.6 !important; }
.site-header .btn, .btn, .btn-dark, .btn-outline, .btn-cream,
.hero-buttons .btn, .marketing-plans .btn, .brands-inner .btn, .cta-section .btn {
  font-size: 14px !important; line-height: 1.4 !important;
}
.landing-copy > p, .section-header > p, .brands-inner > div:last-child > p,
.center-heading p, .feature-grid p, .steps-grid p,
.faq-section > div:first-child > p, .faq-list p,
.site-footer p { font-size: 15px !important; line-height: 1.85 !important; }
.watch-link, .hero-assurances, .landing-hero-caption,
.landing-hero-caption > span, .landing-hero-caption > strong,
.principles-inner > span, .principles-inner > div, .principles-inner small,
.brand-bullets strong, .brand-bullets small, .marketing-plans p,
.marketing-plans ul, .marketing-price small, .plan-bottom-note,
.plan-footnote, .faq-list summary, .footer-bottom,
.footer-bottom > span:last-child, .marketing-plans li::before {
  font-size: 13px !important; line-height: 1.65 !important;
}
.kicker, .landing-copy .kicker, .brands-inner .kicker,
.center-heading .kicker, .cta-section .kicker,
.plan-number, .popular-label, .feature-no, .brand-art-caption,
.visual-label, .visual-bottom {
  font-size: 12px !important; line-height: 1.5 !important;
  letter-spacing: .09em !important;
}
/* Tiny typography INSIDE the decorative phone/card illustration: reasonable without breaking it. */
.demo-person p, .demo-verified, .demo-actions small, .demo-save,
.demo-company strong, .demo-company small, .demo-footer,
.demo-footer small, .demo-footer strong, .demo-cover > strong small,
.demo-lang, .float-badge, .float-badge small,
.mini-business-card > small, .mini-business-card > div:not(.brand-avatars) {
  font-size: 10px !important; line-height: 1.4 !important;
}
.demo-actions { gap: 2px !important; }
.demo-company { align-items: flex-start !important; }
/* Inertia dashboard and administration - common Tailwind utility typography. */
body :is(.text-xs, .text-\[9px\], .text-\[10px\], .text-\[11px\], .text-\[12px\],
.text-\[0\.6rem\], .text-\[0\.65rem\], .text-\[0\.7rem\], .text-\[0\.75rem\]) {
  font-size: 13px !important; line-height: 1.55 !important;
}
body :is(.text-sm, .text-\[13px\], .text-\[14px\], .text-\[0\.8rem\],
.text-\[0\.85rem\], .text-\[0\.875rem\]) {
  font-size: 15px !important; line-height: 1.6 !important;
}
/* Avoid changing heading scale, pictograms, fixed-size badges/icons and decorative marks. */
body :is(button, input, select, textarea) { font-size: max(14px, 1em); }
body :is(p, li) { line-height: 1.7; }
/* Ensure mobile copy stays comfortably readable: bundled CSS previously shrank it again. */
@media (max-width: 850px) {
 .landing-copy > p, .feature-grid p, .steps-grid p, .marketing-plans p,
 .brands-inner > div:last-child > p, .faq-list p { font-size: 15px !important; }
 .site-header .nav-actions { font-size: 13px !important; }
 .marketing-plans ul, .faq-list summary { font-size: 14px !important; }
}
@media (max-width: 600px) {
 .landing-copy > p, .feature-grid p, .steps-grid p, .marketing-plans p,
 .brands-inner > div:last-child > p, .faq-list p { font-size: 15px !important; }
 .hero-assurances { font-size: 12px !important; flex-wrap: wrap !important; }
 .landing-copy .kicker { font-size: 11px !important; }
 .footer-links { font-size: 13px !important; }
}