/* /meeting-booking-page (Elementor 5629) - values read off live 2026-09-28 at 1440/375.
   Content box is the house 1340 (.z-container); live runs 1365 - owner rule, do not widen. */
.mtgp { font-family: 'Poppins', sans-serif; color: #000; }
.mtgp-main { padding: 80px 0; }
.mtgp-row { display: flex; gap: 50px; }
.mtgp-cal, .mtgp-copy { flex: 0 0 calc((100% - 50px) / 2); min-width: 0; display: flex; flex-direction: column; }

/* calendar: HubSpot sizes the iframe (756 tall on live); the 8px under it is live's inline-iframe line box */
/* Reserve the loaded calendar's height before HubSpot injects it (measured 390-1440: 756 iframe + 8 padding = 764, 763 at <=544).
   Without it the container is ~0 tall, so the note's -74px margin below pulls "This calendar
   is for Business inquiries..." up over the heading until the calendar loads. min-height is a
   floor only - it never caps the calendar. */
.mtgp-embed .meetings-iframe-container { padding-bottom: 8px; min-height: 764px; }
.mtgp-embed iframe { display: block; }
.mtgp-note { position: relative; z-index: 9; margin-top: 0;  /* owner 2026-10-06: WP pulled it -74px over the calendar; HubSpot dropdowns open into that strip and ended up under the note */ font-size: 15px; line-height: 24px; color: #868686; }
.mtgp .mtgp-note p { margin: 0 0 24px; font-size: 15px; line-height: 24px; }
.mtgp .mtgp-note a { color: #046bd2; }
/* The pulled-up note overlaps HubSpot's Back/Confirm row on the details step: let clicks
   fall through to the calendar (link stays clickable); on phones drop the overlap entirely. */
.mtgp-note { pointer-events: none; }
.mtgp-note a { pointer-events: auto; }

.mtgp .mtgp-copy h1 { margin: 0; font-size: 40px; line-height: 56px; font-weight: 600; letter-spacing: normal; color: #141414; }
.mtgp-sub { margin-top: 24px; font-size: 16px; line-height: 26.4px; color: rgba(20, 20, 20, .7); }
.mtgp .mtgp-sub p { margin: 0 0 25.6px; font-size: 16px; line-height: 26.4px; }

.mtgp-list li { display: flex; align-items: center; font-size: 16px; line-height: 26.4px; }
.mtgp-list li:not(:last-child) { padding-bottom: 6px; }
.mtgp-list li:not(:first-child) { margin-top: 6px; }
.mtgp-ic { display: flex; flex: 0 0 auto; width: 17.5px; padding-right: 5px; }
.mtgp-ic svg { width: 10px; height: 10px; fill: #0161ff; }
.mtgp-tx { color: #494949; }
.mtgp-tx .bold { font-weight: 600; color: #000; }

.mtgp-div { padding: 32px 0; }
.mtgp-div span { display: block; border-top: 1px solid #ebebeb; }

.mtgp-trust { margin-top: 20px; display: flex; flex-direction: column; gap: 20px; }
.mtgp .mtgp-trust h2 { margin: -8px 0 0; font-size: 16px; line-height: 20.8px; font-weight: 500; letter-spacing: normal; color: #0161ff; }
.mtgp-car { overflow: hidden; }
.mtgp-car-track { display: flex; gap: 35px; }
.mtgp-slide { flex: 0 0 calc((100% - 70px) / 3); display: flex; justify-content: center; align-items: flex-start; }
.mtgp .mtgp-slide img { width: auto; max-width: 100%; height: auto; }

/* live: #primary margin-bottom -33px pulls the footer up over the capterra pixel row */
.mtgp-px { line-height: 26.4px; margin-bottom: -33px; }
.mtgp .mtgp-px img { display: inline; }

@media (max-width: 1024px) {
    .mtgp-row { flex-direction: column; }
    .mtgp-cal, .mtgp-copy { flex: none; width: 100%; }
}
@media (max-width: 767px) {
    .mtgp-main { padding: 50px 0; }
    .mtgp-note { margin-top: 0; }
    .mtgp .mtgp-row { padding: 0 20px; }
    .mtgp .mtgp-copy h1 { font-size: 25px; line-height: 35px; }
}
@media (max-width: 544px) {   /* Astra's mobile body type, which the list inherits on live */
    .mtgp-embed .meetings-iframe-container { padding-bottom: 7px; min-height: 763px; }
    .mtgp-list li { font-size: 14.592px; line-height: 24.0768px; }
    .mtgp-px { line-height: 24.0781px; }
}