/* Public-site foundations. Icon fonts and embedded payment/lesson interfaces retain their own styles. */
body.mec-site-ui {
  --mec-ui-font: Arial, Helvetica, sans-serif;
  --mec-ui-red: #d71920;
  --mec-ui-red-hover: #b9151c;
  --mec-ui-text: #19222e;
  --mec-ui-muted: #596574;
  --mec-ui-border: #c8d0da;
  --mec-ui-radius: 8px;
  --mec-ui-focus: #2463a7;
  font-family: var(--mec-ui-font);
}
body.mec-site-ui :is(.heading_font, .body_font),
body.mec-site-ui #main :is(h1, h2, h3, h4, h5, h6, p, li, label, blockquote),
body.mec-site-ui #footer :is(h1, h2, h3, h4, h5, h6, p, li, a) {
  font-family: var(--mec-ui-font) !important;
}
body.mec-legacy-ui #main .wpb_wrapper :is(p, li, blockquote) { font-size: 16px; line-height: 1.75; }
body.mec-legacy-ui #main .wpb_wrapper p { margin-bottom: 18px; }
body.mec-legacy-ui #main .wpb_wrapper h1 { font-size: clamp(28px, 3.2vw, 40px) !important; line-height: 1.2 !important; }
body.mec-legacy-ui #main .wpb_wrapper h2 { font-size: 28px; line-height: 1.3; }
body.mec-legacy-ui #main .wpb_wrapper h3 { font-size: 23px; line-height: 1.35; }
body.mec-legacy-ui #main .wpb_wrapper h4 { font-size: 19px; line-height: 1.4; }
body.mec-site-ui #main :is(h1, h2, h3, h4, h5, h6) { overflow-wrap: break-word; }
/* Redux's saved transparent link color must not hide links in editorial copy. */
body.mec-site-ui #main :is(.wpb_text_column, .entry-content, .post-content) a:not([class*="btn"]):not([class*="button"]),
body.mec-site-ui #main .wpcf7 a { color: #b9151c !important; text-decoration: underline !important; text-underline-offset: 3px; }
body.mec-site-ui #main :is(.wpb_text_column, .entry-content, .post-content) a:not([class*="btn"]):not([class*="button"]):hover,
body.mec-site-ui #main .wpcf7 a:hover { color: #88151a !important; }

/* Same branding and navigation dimensions on old and new pages. */
body.mec-site-ui #header { background: #fff; }
body.mec-site-ui #header .header_default.header_4 { padding: 0; }
body.mec-site-ui #header :is(.header_top_phone, .header_top_socials),
body.mec-site-ui #header-mobile .header_mobile { font-family: var(--mec-ui-font); }
body.mec-site-ui #header #mega-menu-wrap-primary #mega-menu-primary a.mega-menu-link { font-family: var(--mec-ui-font) !important; }
@media (min-width: 992px) {
  body.mec-site-ui #header .header_default.header_4 .header_top { height: auto !important; padding: 18px 0 !important; }
  body.mec-site-ui #header .header_default.header_4 .logo-unit { width: 100% !important; height: auto !important; }
  body.mec-site-ui #header .header_default.header_4 .logo-unit img { width: 88px !important; height: 88px !important; max-height: 88px !important; margin: 0 auto !important; object-fit: contain; }
  body.mec-site-ui #header .header_default.header_4 .header_bottom { margin: 0; padding: 0; }
  body.mec-site-ui #header .header_main_menu_wrapper { width: 100% !important; max-width: 100%; height: auto !important; margin: 0 !important; padding: 0 !important; border-top: 1px solid #eed8db; box-shadow: none; }
  body.mec-site-ui #header .header-menu,
  body.mec-site-ui #header #mega-menu-wrap-primary { width: 100% !important; height: auto !important; margin: 0 !important; }
  body.mec-site-ui #header #mega-menu-wrap-primary #mega-menu-primary { display: flex !important; flex-wrap: wrap !important; align-items: center; justify-content: center; width: 100% !important; height: auto !important; }
  body.mec-site-ui #header #mega-menu-primary > li.mega-menu-item { height: auto !important; }
  body.mec-site-ui #header #mega-menu-primary > li.mega-menu-item > a.mega-menu-link { height: 56px !important; padding: 0 12px !important; border-top: 0 !important; border-radius: var(--mec-ui-radius); font-size: 14px !important; line-height: 56px !important; white-space: nowrap; }
  body.mec-site-ui #header #mega-menu-primary > li.mega-menu-item:hover > a.mega-menu-link,
  body.mec-site-ui #header #mega-menu-primary > li.mega-current-menu-item > a.mega-menu-link { background: #fff0f2 !important; color: #b9151c !important; }
  body.mec-site-ui #header #mega-menu-primary > li:hover > a::before,
  body.mec-site-ui #header #mega-menu-primary > li.mega-current-menu-item > a::before { color: #b9151c !important; }
}
@media (max-width: 991px) {
  body.mec-site-ui #header .header_default.header_4 .header_top { height: auto !important; padding: 12px 0 !important; }
  body.mec-site-ui #header .header_default.header_4 :is(.header_top_socials, .header_top_phone) { display: none; }
  body.mec-site-ui #header .header_default.header_4 .logo-unit { display: flex; align-items: center; justify-content: space-between; width: 100% !important; height: 80px !important; margin: 0 !important; }
  body.mec-site-ui #header .header_default.header_4 .logo-unit img { width: 80px !important; height: 80px !important; max-height: 80px !important; object-fit: contain; }
  body.mec-site-ui #header .header_default.header_4 .stm_menu_toggler { position: static !important; margin: 0; }
  body.mec-site-ui #header-mobile .header_mobile { padding: 12px 0; background: #fff; }
  body.mec-site-ui #header-mobile .logo-unit { width: 80px; }
  body.mec-site-ui #header-mobile .logo-unit img { width: 80px !important; height: 80px !important; max-height: 80px !important; object-fit: contain; }
}

/* Preserve primary/secondary intent while sharing the shape, type and interaction states. */
body.mec-site-ui #main :is(.btn-default, .vc_btn3, .mec-btn, .mec-programme-button, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .wpcf7-submit),
body.mec-site-ui #footer .textwidget .btn {
  min-height: 48px;
  border-radius: var(--mec-ui-radius) !important;
  font-family: var(--mec-ui-font) !important;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  text-transform: none;
  letter-spacing: normal;
}
body.mec-site-ui #footer .textwidget .btn { padding: 12px 24px; border-color: var(--mec-ui-red) !important; background-color: var(--mec-ui-red) !important; color: #fff !important; }
body.mec-site-ui #footer .textwidget .btn:hover { border-color: var(--mec-ui-red-hover) !important; background-color: var(--mec-ui-red-hover) !important; }
body.mec-site-ui #main :is(.btn-default, .vc_btn3-color-danger, .wpcf7-submit):not(.vc_btn3-style-outline):not(.vc_btn3-style-outline-custom) { background: var(--mec-ui-red) !important; color: #fff !important; }
body.mec-site-ui #main :is(.btn-default, .vc_btn3-color-danger, .wpcf7-submit):not(.vc_btn3-style-outline):not(.vc_btn3-style-outline-custom):hover { background: var(--mec-ui-red-hover) !important; color: #fff !important; }
body.mec-site-ui #main :is(button, .btn-default, .vc_btn3, .mec-btn, .mec-programme-button, input[type=submit]):disabled { cursor: not-allowed; }
body.mec-site-ui :is(#header, #header-mobile, #main, #footer) :is(a, button, input, select, textarea, summary):focus-visible { outline: 3px solid var(--mec-ui-focus); outline-offset: 3px; }

/* Shared CF7 fields; hidden fields, validation and submit handlers retain their existing behavior. */
body.mec-site-ui #main .wpcf7 { border-color: #dce1e8; border-radius: 12px; }
body.mec-legacy-ui #main .vc_row:has(> .wpb_column > .vc_column-inner > .wpb_wrapper > .wpcf7),
body.mec-legacy-ui #main .vc_column-inner:has(> .wpb_wrapper > .wpcf7) { border-color: #dce1e8 !important; border-radius: 12px; }
body.mec-site-ui #main .wpcf7 label { color: #344054; font-family: var(--mec-ui-font) !important; font-size: 14px; font-weight: 600; line-height: 1.6; }
body.mec-site-ui #main .woocommerce form .form-row label { color: #344054; font-family: var(--mec-ui-font); font-size: 14px; font-weight: 600; line-height: 1.6; }
body.mec-site-ui #main .woocommerce form:is(.login, .register, .checkout_coupon) { border: 1px solid var(--mec-ui-border); border-radius: 12px; }
/* The parent disables Woo's CSS while its password-toggle JavaScript still runs. */
body.mec-site-ui #main .woocommerce form:is(.login, .register, .lost_reset_password) button.button { padding: 12px 24px; border: 1px solid var(--mec-ui-red); background: var(--mec-ui-red) !important; color: #fff !important; }
body.mec-site-ui #main .woocommerce form:is(.login, .register, .lost_reset_password) button.button:is(:hover, :focus-visible) { border-color: var(--mec-ui-red-hover); background: var(--mec-ui-red-hover) !important; }
body.mec-site-ui #main .woocommerce .woocommerce-LostPassword a { color: #b9151c; text-decoration: underline; text-underline-offset: 3px; }
body.mec-site-ui #main .woocommerce .password-input { position: relative; display: block; width: 100%; }
body.mec-site-ui #main .woocommerce .password-input input.input-text { padding-right: 60px !important; }
body.mec-site-ui #main .woocommerce .show-password-input { position: absolute; top: 2px; right: 3px; display: grid; place-items: center; width: 44px; height: 44px; min-height: 44px; margin: 0; padding: 0; border: 0; border-radius: 6px; background: #f3f5f8; color: #344054; cursor: pointer; }
body.mec-site-ui #main .woocommerce .show-password-input::before { width: 22px; height: 22px; content: ''; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23344054' stroke-width='2'%3E%3Cpath d='M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") center / contain no-repeat; }
body.mec-site-ui #main .woocommerce .show-password-input.display-password::after { position: absolute; width: 26px; height: 2px; background: #344054; content: ''; transform: rotate(-45deg); }
body.mec-site-ui #main .wpcf7 input:is([type=text], [type=email], [type=tel], [type=url], [type=number], [type=date], [type=password], [type=search]),
body.mec-site-ui #main .wpcf7 :is(select, textarea),
body.mec-site-ui #main .woocommerce .input-text {
  min-height: 48px;
  padding: 12px 14px !important;
  border: 1px solid var(--mec-ui-border) !important;
  border-radius: var(--mec-ui-radius) !important;
  background: #fff !important;
  color: var(--mec-ui-text);
  font-family: var(--mec-ui-font) !important;
  font-size: 16px !important;
  font-weight: 400;
  line-height: 1.5;
  box-shadow: none;
}
body.mec-site-ui #main .wpcf7 textarea { height: auto; min-height: 120px; }
body.mec-site-ui #main .wpcf7 :is(input, textarea)::placeholder { color: #667085; opacity: 1; }
body.mec-site-ui #main .wpcf7 :is(input, select, textarea):focus { border-color: var(--mec-ui-focus) !important; outline: 3px solid #2463a733; outline-offset: 1px; }
body.mec-site-ui #main .wpcf7 .wpcf7-not-valid { border-color: var(--mec-ui-red) !important; }
body.mec-site-ui #main .wpcf7 .wpcf7-not-valid-tip { color: #b9151c; font-size: 13px; line-height: 1.5; }
body.mec-site-ui #main .wpcf7 p:has(.wpcf7-acceptance) { display: block; margin: 14px 0; color: #475467; font-size: 13px; line-height: 1.75; }
body.mec-site-ui #main .wpcf7 p:has(.wpcf7-acceptance) label { display: block; color: #475467; font-size: 13px; font-weight: 400; line-height: 1.75; }
body.mec-site-ui #main .wpcf7 p:has(.wpcf7-acceptance) :is(.wpcf7-form-control-wrap, .wpcf7-acceptance, .wpcf7-list-item) { display: contents !important; }
body.mec-site-ui #main .wpcf7 input[type=checkbox] { appearance: auto; width: 18px; height: 18px; accent-color: var(--mec-ui-red); }
body.mec-site-ui #main .wpcf7 .wpcf7-acceptance input[type=checkbox] { float: left; margin: 3px 10px 0 0; }
body.mec-site-ui #main .wpcf7 .wpcf7-submit { padding: 12px 24px !important; }
body.mec-site-ui #main .wpcf7 .wpcf7-response-output { border-color: var(--mec-ui-red); border-radius: var(--mec-ui-radius); font-family: var(--mec-ui-font); font-size: 14px; line-height: 1.6; }
body.mec-site-ui #main .select2-container .select2-selection--single { min-height: 48px; border: 1px solid var(--mec-ui-border); border-radius: var(--mec-ui-radius); background: #fff; font-family: var(--mec-ui-font); }
body.mec-site-ui #main .select2-container .select2-selection__rendered { font-family: var(--mec-ui-font) !important; font-size: 15px; line-height: 46px; }
body.mec-site-ui #main .select2-container .select2-selection__arrow { height: 46px; }
@media (max-width: 600px) {
  body.mec-legacy-ui #main .wpb_wrapper :is(p, li, blockquote) { font-size: 15px; }
  body.mec-legacy-ui #main .wpb_wrapper h2 { font-size: 25px; }
  body.mec-legacy-ui #main .wpb_wrapper h3 { font-size: 21px; }
}
