/** Mire számíthatsz? — page-specific layout using the shared Tailwind tokens.
 * The shared stylesheet and approved homepage are intentionally immutable.
 */
.ms-hero { padding: 65px 0 90px; }
.ms-intro-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 85px; }
.ms-hero-photo { height: 585px; overflow: hidden; border-radius: 260px 260px 4px 4px; background: var(--color-wash); }
.ms-hero-photo picture,.ms-hero-photo img { display: block; width: 100%; height: 100%; }
.ms-hero-photo img { object-fit: cover; object-position: 50% 58%; }
.ms-intro-copy .site-heading { font-size: clamp(2.7rem,4vw,3.8rem); margin-bottom: 24px; }
.ms-intro-copy p:not(.section-label),.expect-page .step-body p,.ms-package-copy,.ms-attention p:not(.section-label) { font-size: var(--text-reading); line-height: 1.9; }
.ms-intro-copy p:not(.section-label) { color: var(--color-muted); }
.ms-intro-copy p + p,.ms-attention p + p { margin-top: 20px; }
.expect-page .process { border-block: 1px solid var(--color-line); }
.expect-page .process-heading h2 { font-size: clamp(2.8rem,4vw,4rem); }
.ms-package { padding-top: 90px; }
.ms-package-inner { display: grid; grid-template-columns: .9fr 1.1fr; gap: 70px; padding: 64px; border-radius: 4px 100px 4px 4px; background: var(--color-wash); }
.ms-package h2 { font-size: clamp(2.6rem,3.7vw,3.6rem); margin: 20px 0 24px; }
.ms-package-tag { font-size: 12px; color: var(--color-sage); letter-spacing: .04em; }
.ms-price { font-family: var(--font-display); font-size: 5.5rem; line-height: 1; color: var(--color-forest); }
.ms-price span { font-size: 2.2rem; }
.ms-package-copy { padding-top: 8px; }
.ms-package-copy ul { list-style: none; margin: 20px 0 25px; padding: 0; }
.ms-package-copy li { position: relative; padding: 13px 0 13px 27px; border-bottom: 1px solid var(--color-line); }
.ms-package-copy li::before { content: '✓'; position: absolute; left: 0; color: var(--color-sage); }
.ms-package-copy .actions { margin-top: 26px; gap: 12px; }
.ms-package-copy .button { padding-inline: 20px; }
.ms-package-copy .ms-fine { font-size: 12px; margin-top: 22px; color: var(--color-muted); }
.ms-fine a { text-decoration: underline; text-underline-offset: 3px; }
.ms-attention { padding-top: 125px; }
.ms-attention-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 85px; align-items: start; }
.ms-attention h2 { font-size: clamp(2.8rem,4vw,4rem); }
.ms-attention-grid { align-items: center; }
.ms-attention-copy h2 { margin-bottom: 25px; }
.ms-attention-copy p:not(.section-label) { color: var(--color-muted); }
@media(max-width:1100px) {
 .ms-intro-grid,.ms-attention-grid { gap: 45px; }
 .ms-hero-photo { height: 570px; }
 .ms-package-inner { padding: 42px; gap: 40px; }
}
@media(max-width:850px) {
 .ms-intro-grid,.ms-attention-grid,.ms-package-inner { grid-template-columns: 1fr; }
 .ms-intro-grid { gap: 40px; }
 .ms-hero-photo { width: 100%; max-width: 560px; margin-inline: auto; height: auto; aspect-ratio: 1 / 1; }
 .ms-intro-copy { max-width: 620px; }
 .ms-attention-grid { gap: 28px; }

}
@media(max-width:640px) {
 .ms-hero { padding: 45px 0 60px; }
 .ms-hero-photo { border-radius: 180px 180px 4px 4px; }
 .ms-intro-copy .site-heading { font-size: 2.9rem; }
 .ms-package { padding-top: 60px; }
 .ms-package-inner { padding: 32px 24px; gap: 28px; border-top-right-radius: 70px; }
 .ms-package-copy .actions { flex-direction: column; align-items: stretch; }
 .ms-package h2 { font-size: 2.8rem; }
 .ms-price { font-size: 4.6rem; }
 .ms-attention { padding-top: 85px; }
}

/* Approved session photo: preserve Barbara’s face and both hands on all screens. */
.ms-attention-photo { overflow: hidden; aspect-ratio: 3 / 4; border-radius: 4px 110px 4px 4px; background: var(--color-wash); }
.ms-attention-photo picture,.ms-attention-photo img { display: block; width: 100%; height: 100%; }
.ms-attention-photo img { object-fit: cover; object-position: 50% 50%; }
@media(max-width:850px) {
 .ms-attention-photo { width: 100%; max-width: 540px; margin-inline: auto; }
}
@media(max-width:640px) {
 .ms-attention-grid { gap: 35px; }
 .ms-attention-photo { border-top-right-radius: 80px; }
}

/* Booking details now belong to the roadmap's left column. */
.ms-process-booking { margin-top: 42px; max-width: 400px; }
.ms-process-booking h3 { font-family: var(--font-display); font-size: 2rem; line-height: 1.2; font-weight: 400; }
.ms-process-booking .ms-price { margin-top: 24px; }
.ms-process-booking .actions { margin-top: 28px; }
.ms-process-booking .ms-fine { margin-top: 18px; }
@media(max-width:640px) {
 .ms-process-booking { margin-top: 30px; }
}

/* Highlighted note retains its approved typography. */
.expect-page .important-note p { font-size: 14px; line-height: 1.9; }