/* Shared reading rhythm, loaded after the legacy page styles on these two pages
   only. Keep typography and spacing decisions here, not in breakpoint overrides.
   The theme's root is 62.5%: 1.6rem is 16px at the default browser text size. */
.mp-home,
.hejbit-body {
    --reading-body: clamp(1.6rem, 1.5rem + 0.25vw, 1.8rem);
    --reading-lead: clamp(1.8rem, 1.7rem + 0.25vw, 2rem);
    --reading-hero: clamp(3.6rem, 2.8rem + 2vw, 5.6rem);
    --reading-heading: clamp(2.8rem, 2.3rem + 1.3vw, 4.2rem);
    --reading-subheading: clamp(2rem, 1.8rem + 0.6vw, 2.6rem);
    --reading-gutter: clamp(2rem, 1rem + 2vw, 4rem);
    --reading-section: clamp(6.4rem, 4.8rem + 4vw, 10.4rem);
    --reading-gap: clamp(2.4rem, 1.6rem + 2vw, 3.2rem);
    --reading-heading-gap: clamp(3.2rem, 2.4rem + 2vw, 4.8rem);
    /* Existing component tokens inherit the same bounded scale. */
    --font-size-base: var(--reading-body);
    --font-size-md: var(--reading-body);
    --font-size-lg: var(--reading-lead);
    --font-size-sm: 1.5rem;
    --font-size-xs: 1.4rem;
    --font-size-h2: var(--reading-heading);
    --font-size-h3: var(--reading-subheading);
    --font-size-h4: var(--reading-subheading);
}

/* Homepage */
.mp-home .hero-section-new .home-hero-content {
    max-width: 1200px;
    padding: var(--reading-section) var(--reading-gutter);
}
.mp-home .hero-title-new {
    font-size: var(--reading-hero);
    line-height: 1.2;
    margin: 0 0 24px;
    max-width: 24ch;
}
.mp-home .hero-tagline {
    font-size: var(--reading-subheading);
    line-height: 1.4;
    margin: 0 0 48px;
}
.mp-home .hero-description {
    font-size: var(--reading-lead);
    line-height: 1.6;
    width: 100%;
    max-width: 65ch;
    margin: 0;
}
.mp-home .discovery-buttons {
    width: 100%;
    flex-direction: row;
    gap: 16px;
    margin: 32px 0 0;
}
.mp-home .discovery-button {
    font-size: 1.6rem;
    line-height: 1.4;
    padding: 14px 24px;
    margin: 0;
    min-width: 0;
    width: auto;
    max-width: 100%;
    white-space: normal;
}
.mp-home section.mp-section {
    padding: var(--reading-section) var(--reading-gutter);
}
.mp-home section.mp-section h2 {
    font-size: var(--reading-heading);
    line-height: 1.2;
    margin: 0 auto var(--reading-heading-gap);
    width: 100%;
    max-width: 1200px;
}
.mp-home .mp-section .three-columns {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
    gap: var(--reading-gap);
}
.mp-home .mp-section .three-columns > div { padding-bottom: 0; }
.mp-home .mp-section .mp-card-title {
    font-size: var(--reading-subheading);
    line-height: 1.3;
    height: auto;
    margin: 0;
    padding: 24px 24px 16px;
}
.mp-home .mp-section .mp-card-content-text {
    font-size: var(--reading-body);
    line-height: 1.6;
    padding: 0 24px 32px;
    margin: 0;
}
.mp-home .swarm-content,
.mp-home .testimonials-section { min-height: 0; }
.mp-home .swarm-content-inner { padding: 48px var(--reading-gutter); }
.mp-home .swarm-logo-wrapper { margin: 0 0 32px; }
.mp-home .swarm-description {
    font-size: var(--reading-body);
    line-height: 1.65;
    max-width: 65ch;
    margin: 0 auto 32px;
}
.mp-home .testimonials-content { padding: 0; }
.mp-home .testimonials-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
    gap: var(--reading-gap);
}
.mp-home .home-testimonial-card { padding: var(--reading-gap); }
.mp-home .testimonial-quote { font-size: var(--reading-body); line-height: 1.65; }
.mp-home .home-testimonial-info .testimonial-title { font-size: 1.4rem; line-height: 1.5; }
.mp-home .home-testimonial-info .testimonial-name { font-size: 2rem; line-height: 1.3; }

/* HejBit: content determines section height; spacing is independent of viewport height. */
.hejbit-body > section:not(.hejbit-hero-section) {
    padding: var(--reading-section) var(--reading-gutter);
    min-height: 0;
}
.hejbit-body .hero-content {
    min-height: 0;
    padding: 32px var(--reading-gutter) var(--reading-section);
    max-width: 1200px;
}
.hejbit-body .hejbit-logo { margin: 48px 0 16px; }
.hejbit-body .hero-subtitle {
    font-size: clamp(2.4rem, 1.8rem + 1.5vw, 3.6rem);
    line-height: 1.3;
    margin: 0;
    max-width: 30ch;
    letter-spacing: 0.04em;
}
.hejbit-body .hero-cta-buttons { gap: 16px; margin: 32px 0 0; }
.hejbit-body .hero-sub-content { width: 100%; max-width: 65ch; margin: 48px auto 0; font-size: var(--reading-body); }
.hejbit-body .hejbit-sub-heading { font-size: var(--reading-subheading); line-height: 1.3; margin: 0 0 16px; }
.hejbit-body .hero-below-buttons { font-size: var(--reading-body); line-height: 1.65; margin: 0; }
.hejbit-body section :is(.section-title, .hejbit-work-title, .features-title, .technology-title, .testimonials-title, .team-title, .faq-title, .contact-title) {
    font-size: var(--reading-heading);
    line-height: 1.2;
    margin: 0 auto var(--reading-heading-gap);
}
.hejbit-body .features-section { margin-bottom: 0; }
.hejbit-body .feature-card { padding: var(--reading-gap); gap: 32px; margin-bottom: 24px; }
.hejbit-body .feature-card:last-child { margin-bottom: 0; }
.hejbit-body .feature-content h3 { font-size: var(--reading-subheading); line-height: 1.3; margin: 0 0 16px; }
.hejbit-body .feature-content p,
.hejbit-body .coming-soon-description,
.hejbit-body .testimonial-text,
.hejbit-body .team-description { font-size: var(--reading-body); line-height: 1.65; }
.hejbit-body .coming-soon-description { max-width: 65ch; margin: 0 auto 32px; }
.hejbit-body .license-plans-section { max-width: 1320px; }
.hejbit-body .plans-grid { grid-template-columns: 1fr; gap: var(--reading-gap); }
.hejbit-body .plan-content { padding: var(--reading-gap); }
.hejbit-body .plan-card { min-height: 0; }
.hejbit-body .plan-features { margin-bottom: 24px; }
.hejbit-body .plan-features li,
.hejbit-body .plan-benefits p { font-size: 1.6rem; line-height: 1.6; }
.hejbit-body .plan-card .hejbit-button { font-size: 1.6rem; padding: 12px 16px; margin-top: auto; }
.hejbit-body .testimonial-title { font-size: 1.4rem; line-height: 1.5; }
.hejbit-body .faq-container { max-width: 960px; }
.hejbit-body .faq-question { font-size: var(--reading-body); line-height: 1.5; padding: 24px 0; }
.hejbit-body .faq-answer-inner { font-size: var(--reading-body); line-height: 1.65; }
.hejbit-body .hejbit-team .team-content { margin-bottom: 32px; }
.hejbit-body .hejbit-team .team-title { margin-bottom: 16px; }
.hejbit-body .hejbit-team .team-description { margin: 0 auto; max-width: 65ch; }

/* Two and four pricing columns only when every card has room to breathe. */
@media (min-width: 680px) {
    .hejbit-body .plans-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1320px) {
    .hejbit-body .plans-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}