/* 
    Fonts: Use var(--primary-font) & var(--secondary-font)
    Color: Use var(--primary-color) & var(--primary-color-hover) & var(--secondary-color)
*/

:root {
    --initial-font-size: 18px;
    --space-between-elements: 100px;
    --element-spacing: calc(var(--space-between-elements) / 2) 0;
}
/* @import url('../css/fontface/proxima-secondary-fontface.css'); */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    height: 100%;
}
body,
html {
    width: 100%;
}


body {
    font-family: var(--secondary-font)!important;
    color: var(--text-color);
    background-color: #fff;
    font-weight: 400;
    font-size: var(--initial-font-size);
    line-height: 1.5;
}

h1,
h2 {
    font-family: var(--primary-font);
    font-weight: 400;
    color: var(--primary-color) !important;
    margin: 0 0 15px;
    line-height: 1.16;
    letter-spacing: -0.36px;
}

h1 {
    font-size: 48px;
}

h2 {
    font-size: 36px;
}

h3,
h4 {
    font-size: 24px;
}
h3{
    font-family: var(--secondary-font) !important;
    font-weight: 600 !important;

}

.page-id-1425 p a {
    color: #c41230 !important;
}

#nav-main-1 .menu-items a {
  font-family: var(--secondary-font) !important;
  font-weight: 800;
  font-size: 24px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.container {
    position: relative;
    max-width: 1230px;
    width: 100%;
    margin: 0 auto;
    padding: 0 15px;
}


/* SPACING BETWEEN ELEMENTS | PADDING/MARGIN */

.padding,
.search .content-wrapper,
.article-content {
    padding: var(--element-spacing);
}

.margin {
    margin: var(--element-spacing);
}

/* PADDING OVERWRITES */
html{
    font-family: var(--primary-font);
}
.p-0 {
    padding: 0;
}

.pt-0 {
    padding-top: 0;
}

.pr-0 {
    padding-right: 0;
}

.pb-0 {
    padding-bottom: 0;
}

.pl-0 {
    padding-left: 0;
}

/* .pt-x2 {
    padding-top: calc(var(--space-between-elements) * 2);
} */

.pb-x2 {
    padding-bottom: calc(var(--space-between-elements) * 2);
}

/* END SPACING BETWEEN ELEMENTS */

.article-content {
    padding-top: 0;
    position: relative;
}

.flex {
    display: flex;
    align-items: center;
}

.flex-space-between {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.site-branding .custom-logo {
  display: inline-block;
}
 
.site-branding .custom-logo:focus-visible {
  outline: 2px solid #000;
  box-shadow: 0 0 0 4px #fff, 0 0 0 6px #000;
  border-radius: 4px;
}

.btn {
    display: inline-block;
    background-color: var(--primary-color);
    color: #fff;
    padding: 10px 25px;
    text-decoration: none;
    text-align: center;
    text-decoration: none;
    font-family: var(--secondary-font) !important;
    border: 2px solid transparent;
    
}


.top-btn.btn-alt {
  font-family: var(--secondary-font) !important;
    font-size: 18px !important;
    text-transform: uppercase !important;
    color: #fff !important;
     font-weight: 600;

    background-color: transparent !important;
    border: 2px solid #fff !important;

    padding: 10px 25px !important;
    display: inline-block !important;

    letter-spacing: 0 !important;
}

.btn-disabled {
    color: #d8d8d8;
    /* background-color: #536688; */
    border: none;
}

/* [MERCY-115] Unified button hover (matches nav Get Started): navy bg + white text */
.btn:hover {
    background-color: var(--secondary-color) !important; /* #002858 */
    border-color: var(--secondary-color) !important;
    color: #fff !important;
}

.btn-alt:hover {
    background-color: var(--secondary-color) !important; /* #002858 */
    color: #fff !important;
    border: 2px solid var(--secondary-color) !important;
    text-decoration: none;
}

/* [MERCY-115] Form progress bar: un-activated step = light blue (was #A7A8AA gray) */
.two-step .step-one-images path[fill="#A7A8AA"],
.two-step path[fill="#A7A8AA"] {
    fill: #69B4F6 !important;
}

/* [MERCY-115] Child-dropdown styling removed from global.css — it lives in
   1-layer-nav.css now (white panel, navy #002858 / Poppins 400 items, #69B4F6
   hover underline per Figma). These !important rules forced black/600/no-underline
   and overrode the spec. */

.header.pos-fixed {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 1000;
}

.logged-in .header.pos-fixed {
    top: 32px; /* [MERCY-115] desktop admin bar = 32px (matches body padding calc(...+32)); hero sits flush under nav */
}
/* WP admin bar is 46px on mobile widths */
@media screen and (max-width: 782px) {
    .logged-in .header.pos-fixed {
        top: 46px;
    }
}

.primary-color {
    color: var(--primary-color);
}

.secondary-color {
    color: var(--secondary-color);
}

.primary-font {
    font-family: var(--primary-font);
}

.secondary-font {
    font-family: var(--secondary-font);
}

/* BreadCrumbs */
.breadcrumb {
    list-style: none;
    list-style-position: inside;
    display: flex;
    font-size: 15px;
}

.breadcrumb .seperator {
    margin: 0 5px;
}

.breadcrumb li a {
    color: var(--primary-color);
}

/* Search Results Page */
.search .container > h2 {
    margin-bottom: 0;
}

.search .container > p {
    font-size: 14px;
    font-style: italic;
}

.search .container .tease {
    padding: 25px 0;
}

.search .container .tease .read-more {
    color: var(--primary-color);
}

.search .pagination {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.search .pagination ul {
    list-style: none;
    display: flex;
    gap: 15px;
    font-size: 14px;
}

/* Form CSS Overwrites */
.request-info {
    /* border: 1px solid #707070; */
    padding: 30px 20px !important;
}

.request-info .form-header {
     font-family: var(--secondary-font) !important;
    font-size: 20px !important;
}

.request-info .disclaimer {
    font-size: 12px !important;
    line-height: 18px !important;
    margin-top: 40px !important;
}

#eddyform .form-button {
    font-size: 32px !important;
    margin-top: 16px !important;
    font-weight: 500 !important;
}

#eddyform div.error {
    top: 5px !important;
}

#eddyform .error-message {
    right: -5px !important;
    width: calc(100% + 9px) !important;
}

#eddyform #rn-error {
    color: var(--secondary-color);
    text-align: left;
    margin-top: 25px;
}

#eddyform input::placeholder {
    color: #000;
}

#eddyform {
    .radio-group {
        .radio {
            gap: 5px;
            input {
                height: 11px;
                width: 11px;
            }
        }
    }
}
.aos-with-thumbnails-block h2{
    text-align: center !important;
}
.aos-thumbnails .aos-thumbnail-container,p {
    text-align: left !important;
    align-items: flex-start !important;
}

.aos-thumbnail-container h3{
    text-transform: uppercase !important;
}

.call-to-action-container .call-to-action-box .btn {
    display: block !important;      
    margin-top: 30px !important;    
    width: fit-content;             
    text-align: center;  
    text-transform: uppercase;          
}
.call-to-action-container .call-to-action-box h2 {
    max-width: 100%; /* [MERCY-115] was 356px — let title use full card width, wrap only at card edge */
    width: 100%;
}

.request-info .form-header {
    text-align: center !important;
}
section.hero-section.aos-b .hero-text {
    max-width: 612px;
    width: 100%;
}
.title-text_block.padding.pt-x2 {
    padding: 25px 10px ; 
}
section.hero-section {
    margin-bottom: 60px;
}
.accordion-with-tabs.padding {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
  /* padding-left: 70px; */
}

/* If you want EVEN LESS space when they are stacked */
.accordion-with-tabs.padding + .accordion-with-tabs.padding {
  padding-top: 20px !important;
}

/* 2) Make each accordion-item a single bordered box */
.accordion-with-tabs .accordion-item {
  border: 1px solid #DADFE1 !important;
  margin-bottom: 24px; /* spacing between items */
  background: #fff;
}

/* 3) Header: remove border so it doesn't create seam */
.accordion-with-tabs .accordion-header {
  border: 0 !important;               
  border-bottom: 0 !important;
  margin: 0 !important;
  padding: 18px 20px !important;
  background-color: #EDECE2;
}

/* 4) Body: remove border + remove padding (you wanted no padding here) */
.accordion-with-tabs .accordion-body {
  border: 0 !important;               
  margin: 0 !important;
  padding: 0 !important;
  background: #fff !important;
}

/* 5) Tabs bar = full width, NO fill — tabs sit on white; only the button is blue */
.accordion-with-tabs .tabs {
  margin: 0 !important;
}

.accordion-with-tabs .tab-headers {
  /* [MERCY-115] removed blue fill — tab row is white; tabs spread evenly with
     the Request Info CTA at the end (no dead gap) */
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* remove the HR gap completely */
.accordion-with-tabs .tabs hr,
.accordion-with-tabs hr {
  display: none !important;
}

/* 6) Tabs = all same style (no “active” visual difference) */
/* [MERCY-115] white bg, #222211 Poppins SemiBold 16/24, title case (Figma) */
.accordion-with-tabs .tab-header,
.accordion-with-tabs .tab-header.active {
  background: #FFFFFF !important;
  color: #222211 !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 16px 28px !important;
  font-family: var(--primary-font) !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  line-height: 24px !important;
  text-transform: none !important;
}

/* 7) Padding ONLY inside tab content area */
.accordion-with-tabs .tab-bodies {
  padding: 20px !important; /* adjust to match Figma */
  margin: 0 !important;
}

.accordion-with-tabs .tab-body {
  padding: 0 !important; /* keep content clean */
}
.why-save-block.padding
{
    background-color: #F5F5F5; /* [MERCY-115] was #EDECE2 */
}
/* [MERCY-115] "Ways to Save" section heading — match other section titles (override the 22px/uppercase item-h2 rule) */
.why-save-block.padding.why-b .container > h2 {
    color: #222211 !important;
    font-family: var(--primary-font) !important;
    font-weight: 600 !important; /* Poppins SemiBold */
    font-size: 36px !important;
    line-height: 1.2 !important;
    text-transform: none !important;
}
/* [MERCY-115] Card title — Poppins SemiBold 36/41.76, -0.36 tracking, capitalize, navy */
.why-save-block .item-content h2 {
    color: #222211 !important;
    font-family: var(--primary-font) !important;
    font-weight: 600 !important;
    font-size: 36px !important;
    line-height: 41.76px !important;
    letter-spacing: -0.36px !important;
    text-transform: capitalize !important;
}
/* [MERCY-115] Card descriptions — Poppins Regular 16/24 (incl. Word-paste spans) */
.why-save-block .item-content p,
.why-save-block .item-content p * {
    font-family: var(--primary-font) !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 24px !important;
}
/* [MERCY-115] Removed last-child white-underline override — the nav CSS now
   applies the #69B4F6 active underline uniformly to all items. */

.hero-section.Afford-ability .hero-text h1{
    padding: 28.5px 70px 28.5px 70px !important;
}
.hero-section.Afford-ability .hero-text{
    width: 612px;

}
/* [MERCY-115] Nav dropdown-caret styling removed from global.css — it belongs in
   assets/css/components/navigation/1-layer-nav.css (filled #222211 triangle, 8x4).
   This leaked white-chevron rule was MORE specific (> li.menu-item-has-children >
   span > a::after) and overrode the real caret, rendering a floating diagonal; the
   sibling rule's margin-bottom:14px is what pushed it up off the text. */

/* Remove space between stacked title-text blocks */
.title-text_block + .title-text_block {
    padding-top: 0 !important;
    margin-top: 0 !important;
}
.why-save-block.padding.why-b h2 {
    font-size: 22px;
    font-weight: 600;
    text-transform: uppercase;
}

@media screen and (max-width: 999px) {
    :root {
        --initial-font-size: 18px;
        --space-between-elements: 50px;
    }
       .aos-with-thumbnails-block h2 {
        text-align: left !important;
    }

#eddyform .form-button {
    font-size: 16px !important;
}
/* [MERCY-115] Digital UAT row 60 (DB): "MOBILE: placement of this header makes it look like it's not
   part of the program option section.. Can there be less space below it?" — "Explore Career-Driven
   Graduate Programs". Bottom margin 35px -> 25px so the heading sits closer to its cards (Jonathan's
   value; 0 pulled it flush and read as broken). The block's h2 also contributes padding-bottom,
   reduced 50px -> 25px separately in aos-with-thumbnails-block/style.css. Left margin kept at 10px.
   This rule is already inside the <=999px media query, so desktop is unaffected. */
.dis-sec .block-title{
    margin: 0 0 25px 10px;
}
/* .call-to-action-container .call-to-action-box > h2 {
    margin: 0 0 35px 10px;
} */
.call-to-action-container .call-to-action-box .btn {
    /* margin-left: auto !important; */
    margin-right: auto !important;
    font-size: 24px !important;
    font-weight: 600 !important;
}
.aos-thumbnail-container h3 {
    font-size: 22px !important;
    font-weight: 600 !important;
}
.aos-thumbnail-container a {
    font-size: 22px !important;
    font-weight: 600 !important;
}
.accordion-with-tabs .tab-header, .accordion-with-tabs .tab-header{
    text-align: justify;
}
.accordion-with-tabs .tab-headers {
    flex-direction: column;
}
.accordion-with-tabs.padding + .accordion-with-tabs.padding {
    padding-top: 0px !important;
}   
.hero-section.Afford-ability .hero-text h1 {
     padding: 54px 25px !important;
}
.hero-section.Afford-ability .hero-text {
    width: 100%;
    text-align: center; /* [MERCY-115] center the h1 box in the stacked ≤999 view (Affordability/Online) */
}
/* [MERCY-115] Catch-all: center the hero h1 box for EVERY variant in the stacked ≤999 view
   (home, affordability/online, programs/single-programs, graduate/aos-b, and future pages). */
.hero-section .hero-text {
    text-align: center;
}
.title-text_block.padding.fin-aid h2 {
    max-width: none; /* was 224px — jammed long headings into a skinny column; wrap at content width like the body copy */
}
section.hero-section.Afford-ability ~ .title-text_block h2 {
    max-width: none; /* was 244px — same fix */
}
.why-save-block.padding.why-b p {
    text-align: center !important;
}
.why-save-block.padding.why-b .container h2 {
    text-align: center;
}
.footer-copyright .container {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    font-size: 15px;
}
}
.accordion-with-tabs .tab-headers .tab-header {
  pointer-events: none;
  cursor: default;
}

.accordion-with-tabs .tab-headers .tab-header:first-child {
  pointer-events: auto;
  cursor: pointer;
}

/* Thank You Page Button Additions */
.thank-you-apply-buttons {
  display: flex;
  gap: 32px;
  margin-top: 24px;
}

.thank-you-apply-buttons .apply-col {
  flex: 1;
  text-align: center;
}

.thank-you-apply-buttons h2 {
  color: #ffffff;
  font-size: 20px;
  margin-bottom: 10px;
  font-weight: 400;
}

/* Button cleanup */
.thank-you-apply-buttons .apply-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #ffffff;
  color: #003EAB;
  padding: 3px 24px 23px 26px;
  min-height: auto;       /* removes tall box issue */
  width: auto;            /* prevents full-width stretch */
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
  border-radius: 4px;
  line-height: 1.0;
  margin-left: 69px;
}

.thank-you-apply-buttons .apply-btn:hover {
  background-color: #f2f2f2;
}

/* Slightly push Graduate Application button down */
.thank-you-apply-buttons .apply-col:first-child .apply-btn {
  margin-top: 24px; /* tweak to 6–12px if needed */
  margin-left: 24px;
}

.thank-you-apply-buttons .apply-col {
  text-align: center;
}

/* Mobile stacking */
@media (max-width: 768px) {
  .thank-you-apply-buttons {
    flex-direction: column;
  }
/* button css */
.thank-you-apply-buttons .apply-col h2{
    font-size: 24px !important;
    text-align: left;
    max-width: none !important;
}
.thank-you-apply-buttons .apply-btn{
    margin: 0px !important;
}
}

/* for program page start */
.tile .text .text-container ul li::marker {
    color: #003EAB; /* Mercy blue */
}
#nav-main-1 .menu-items li a {
 text-decoration: none;
}
.single-programs section.hero-section {
    margin-bottom: 0px;
}
.single-programs .why-card p{
    font-family: var(--secondary-font);
    text-align: center;
    color: white;
    font-size: 24px;
     font-weight: 800;
    line-height: 100%;
    text-align: center !important;
     text-transform: uppercase !important;
    margin-top: 10px

}
/* MUOHIO-380: force white on Why Choose card description (h6/span) */
.single-programs .why-card h6,
.single-programs .why-card h6 span {
    color: #ffffff !important;
}

@media screen and (max-width: 999px) {
    .single-programs .hero-section .container {
    align-items: normal !important;
    }
    /* [MERCY-115] center the program-page h1 box in the stacked ≤999 view (matches home/affordability) */
    .single-programs .hero-section .hero-text {
        text-align: center;
    }
    .single-programs .image-and-text-container{
    div.tiles div.tile {
    /* [MERCY-115] mobile: image on top of the content (was column-reverse) */
    flex-direction: column !important;
    }
    }
.single-programs .image-and-text-container + .call-to-action-container .inner {
  display: flex;
  flex-direction: column-reverse;
}
.tile .text>.text-container, ul{
    padding-left: 0px;
    font-size: 20px;
    line-height: 20px;
    font-weight: 400;
}
.tile .text>.text-container div{
    padding-left: 0; /* [MERCY-115] align body content with the title on mobile (was 25px) */
}
.tile .text .text-container ul li {
    margin-bottom: 12px; /* adjust spacing here */
}
}

@media screen and (min-width: 999px) {
.footer-right .socials{
display: flex !important;
gap: 12px !important;
}
.single-programs .hero-section .hero-text {
margin: 0 0 0 -70px;
max-width: 800px !important;
width: 100% !important;
}
.call-to-action-container .call-to-action-box {
font-size: 20px !important;
line-height: 26px; 
}
.call-to-action-container .call-to-action-box .btn {
    /* margin-left: auto !important; */
    margin-right: auto !important;
    font-size: 24px !important;
    font-weight: 600 !important;
}
.why-block {
    margin-top: 40px;
}
/* [MERCY-115] Digital UAT row 41 (DB): "a lot of uneccesary space above and below this block"
   — Why Choose Mercy University. Removes the 40px top margin on desktop only; the rule above is
   left intact so <=999px spacing is unchanged. Kept in this file (not why-block/style.css) because
   both rules use the same `.why-block` selector at equal specificity, so source order decides the
   winner. Breakpoint is 1000px to match the nav's hamburger collapse at <=999 — starting at 999
   would apply desktop spacing to one pixel of mobile view (see
   .claude/bugs/eddyevolution-nav-breakpoint-hero-deadzone/). Bottom margin handled in
   acf-blocks/why-block/style.css. */
@media screen and (min-width: 1000px) {
    .why-block {
        margin-top: 0;
    }
}
.single-programs .image-and-text-container + .call-to-action-container.margin .col-two .call-to-action-box  {
 width: 701px !important;
 padding: 112px 62px 112px 59px !important;
}
.single-programs .image-and-text-container + .call-to-action-container.margin{
 margin-top: 0% !important;

}
.single-programs .image-and-text-container + .call-to-action-container.margin .col-two {
    padding-left: 500px;
}
.tile .image img {
    max-width: 627px !important;
    width: 100%;
    height: 476px !important;
    /* margin-left: -30px; */
}
.tile .image{
    height: 632px !important;
}
.tile.left .text {
    align-items: center !important;
    margin-left: 0px;
    margin-right: 0px !important;
    background-position-y: 10% !important;
}

.tile .text .text-container ul li {
    white-space: normal;
}
.tile .text .text-container ul li::marker {
    color: #003EAB; /* Mercy blue */
}
.tile .text>.text-container, ul{
    padding-left: 25px;
    font-size: 20px;
    line-height: 1.4;
    font-weight: 400;
}
.tile .text .text-container ul li {
    margin-bottom: 12px; /* adjust spacing here */
}
.single-programs .image-and-text-container .tile{
    height: auto !important;
    border:none !important;
    border-width:unset !important;
}
.single-programs .image-and-text-container{
    padding-top: 20px !important;
    margin: 0% !important;
    padding-bottom: 0% !important;
}

}
@media screen and (max-width: 767px) {
  .call-to-action-container .call-to-action-box {
    font-size: 20px !important;
    line-height: 26px;
  }
  /* FORCE override gradient */
  .image-and-text-container .tiles .tile .image {
    background: #003EAB !important;
    min-height: unset !important;
    margin-top: 50px; 
    padding: 16px 0; 
  }

  /* center image */
  .image-and-text-container .tiles .tile .image img {
    width: 328px !important;
    height: 196px !important;
    margin: 0 auto !important;
    display: block;
    margin-top: -56px !important;
  }

  /* stack layout */
  .image-and-text-container .tiles .tile {
    flex-direction: column !important;
  }

  /* clean text section */
  .image-and-text-container .tiles .tile .text {
    background: #fff !important;
    padding: 20px 20px 10px !important; 
    margin: 0 !important;
  }

  .image-and-text-container .tiles .tile .text ul {
    margin-bottom: 0 !important;
  }

 
  /* social wrapper */
  #footer .footer-right .socials {
    display: flex !important;
    justify-content: center !important; 
    align-items: center;
    gap: 40px !important; 
    margin-top: 20px;
    padding: 10px 0; 
  }

  #footer .footer-right .socials a img {
    width: 35px;
    height: 35px;
  }

    #footer .footer-right p {
    margin: 0 auto !important;
    max-width: 100% !important;
    text-align: center !important;
    }

}
/* for program page end */

/* MUOHIO-380: Course Highlights alignment — shift text content right on desktop */
@media screen and (min-width: 1000px) {
    .image-and-text-container .tile.left .text > .text-container {
        padding-left: 50px;
    }
}

/* MUOHIO-380: MBA program page hero — smaller font so "Business Administration, MBA" fits line 1 */
body.postid-1730 .hero-section .hero-text h1 {
    font-size: 40px !important;
}

/* MUOHIO-380: undergraduate-and-microcredentials page hero override */
body.page-id-1495 .hero-section .hero-text h1 {
    display: inline-block;
    background-color: var(--primary-color);
    color: #fff !important;
    font-weight: 700 !important;
    font-size: 48px !important;
    padding: 54px 64px 54px 70px !important;
    border-radius: 0;
    max-width: 1100px !important;
    width: auto !important;
    margin: 0px auto;
}

/* MUOHIO-380 (2026-04-23): header overlaps top of hero image on mobile across program pages —
   nudge image down globally so faces/heads don't get clipped. Julia flagged this on multiple pages. */
@media screen and (max-width: 999px) {
    body.single-programs .hero-banner {
        margin-top: 0; /* [MERCY-115] removed mobile top margin (was 14px) */
    }
}

/* MUOHIO-380: English Studies hero — form was covering woman's face, shift form 20px right
   1704 = English Studies BA */
@media screen and (min-width: 1000px) {
    body.postid-1704 .hero-section #requestinfo,
    body.postid-1704 .hero-section .request-info {
        transform: translateX(20px);
    }
}

/* MUOHIO-380: in-content link color — Mercy brand blue (#003EAB). 2026-04-29 / 30
   Covers content-area links in:
     - .accordion-with-tabs .tab-body  (programs accordion w/ tabs — "Learn more." links)
     - .degrees-accordion-container .degrees-acc-content  (degrees accordion content)
     - .image-and-text-container .tile .text  (Highlights block — TechCred link, etc.)
   Underline retained so color is not the only signal (ADA AA pass at 5.87:1 on white). */
.accordion-with-tabs .tab-body a,
.degrees-accordion-container .degrees-acc-content a,
.image-and-text-container .text-container a,
.title-text_block .title-text_block__text a {
    color: #003EAB;
}
.accordion-with-tabs .tab-body a:hover,
.accordion-with-tabs .tab-body a:focus,
.degrees-accordion-container .degrees-acc-content a:hover,
.degrees-accordion-container .degrees-acc-content a:focus,
.image-and-text-container .text-container a:hover,
.image-and-text-container .text-container a:focus,
.title-text_block .title-text_block__text a:hover,
.title-text_block .title-text_block__text a:focus {
    color: #003EAB;
    text-decoration: underline;
}

.field-wrapper[data-field-name="backtoschool"] {
    display: none;
}

/* [MERCY-115] Hero height = 700px site-wide (Figma) */
/* min-width 1000 to match the nav's hamburger collapse at ≤999px — full-height hero only on
   desktop. (Was 960 for the old 960px nav breakpoint, which left a 960–999px dead zone.) */
@media screen and (min-width: 1000px) {
    .hero-section,
    .hero-section .container {
        min-height: 700px !important;
    }
}
/* [MERCY-115] Digital UAT row 16 (CK) — Program Highlights bullets on program pages.
   Symptom: on mobile the disc markers sit outside the tile, ~28px left of the "Program
   Highlights" heading, and look like they're running off the screen. Affects every program page.
   Cause: the comma-selector typo in `.tile .text>.text-container, ul` (lines 728 and 798) —
   the comma makes `ul` its own selector, so EVERY <ul> sitewide gets padding-left:0 at <=999px.
   With `list-style-position: outside` and no padding there is no gutter to hold the marker.
   Not correcting the typo pre-launch: restoring default padding to every list would also move
   the mobile nav and footer lists. Scoped to the program-page tiles instead; fix the typo
   properly after 8/3. */
@media screen and (max-width: 999px) {
    .image-and-text-container .tiles .tile .text .text-container ul {
        padding-left: 1.2em;
    }
}

/* [MERCY-115] Digital UAT row 53 (DB) — "could we maybe lessen the space between fields? This would
   help shorten it a bit on the second page." (RFI form, all pages.)
   The gap comes from the plugin: custom-rfi-form/includes/css/qcf.css:113
   `#eddyform .field { margin-bottom: 24px }`. Overridden here in the theme rather than edited in the
   plugin — plugin edits are wiped on update.
   Targets only real fields via `> .field-wrapper > .field`, so `#eddyform .actions .field` keeps its
   own 15px and the Go Back / submit / disclaimer block is untouched. Specificity (1,0,3) beats the
   plugin's (1,0,1) regardless of which stylesheet loads first.
   Applied to step one as well as step two so both steps keep the same rhythm — tightening only step
   two makes the spacing visibly jump when you click Next. Also helps row 55 (form above the fold on
   mobile). */
#eddyform .step-one > .field-wrapper > .field,
#eddyform .step-two > .field-wrapper > .field {
    margin-bottom: 12px;
}

/* [MERCY-115] Digital UAT row 55 (DB) — "best practice is to be able to see the form above the fold
   on mobile... Recommend making the hero image text have less blank space on top and bottom so it
   pushes the form up a bit." MOBILE ONLY, SITE-WIDE.
   The blank space is vertical padding on the hero <h1>, not on .hero-text. The base value now lives
   in acf-blocks/hero-banner/style.css:101 (`padding: 15px 24px !important`, was 54px) — it HAS to be
   set there, because block.json registers that file via "style": "file:./style.css" and block styles
   enqueue AFTER this stylesheet, so an equal-specificity override here loses on source order.
   The rule below only covers the hero VARIANTS, which each re-declare the padding at higher
   specificity than the block's generic selector and would otherwise keep the old 54px:
   .Afford-ability (affordability + online) sets `padding: 54px 25px !important` at (0,3,1) vs the
   block's (0,2,1). Values kept at 15px so every page matches.
   Longhand padding-top/padding-bottom on purpose — the variants use different horizontal padding
   (24px / 25px / 70px) and that must be preserved.
   Desktop (>=1000px) deliberately untouched. Does not alter the hero background or text colour —
   that is row 40, frozen pending design approval. */
@media screen and (max-width: 999px) {
    .hero-section.Afford-ability .hero-text h1,
    .hero-section.deg-le .hero-text h1,
    .hero-section.aos-b .hero-text h1,
    .single-programs .hero-section .hero-text h1 {
        padding-top: 15px !important;
        padding-bottom: 15px !important;
    }
}

/* [MERCY-115] Digital UAT row 56 (DB) — "MOBILE: headline seems like it could be just a bit smaller
   and maybe get it down to three lines?" Section titles 36px -> 34px, MOBILE ONLY, SITE-WIDE.
   Target was "Graduate Programs for Driven Professionals" (.title-text_block h2), which wrapped to
   four lines with "Driven" and "Professionals" each stranded on their own line.

   NOT a blanket `h2` !important rule. The theme has two distinct groups and only one is a section
   title. Section titles sit at 36px; these are intentionally smaller and must NOT be touched:
   glance-block (24/30/32), notification-banner (20), why-save-block (22), thank-you-apply-buttons
   (20/24), student-spotlight mobile card (32). A catch-all would blow all of those up.

   Prefixed with `body` on purpose. Most of these live in block stylesheets registered via
   block.json "style": "file:./style.css", which WordPress enqueues AFTER this file — an
   equal-specificity override here would lose on source order (see row 55). `body` adds one element
   to the specificity so these win regardless of load order. */
@media screen and (max-width: 999px) {
    /* base fallback: any section h2 with no rule of its own (was 36px) */
    h2 {
        font-size: 34px;
    }

    /* the explicit 36px section titles, per block */
    body .title-text_block h2,                                  /* "Graduate Programs for Driven Professionals" */
    body .aos-with-thumbnails-block h2,
    body .call-to-action-container .call-to-action-box > h2,
    body .accordion-heading,                                    /* accordion-with-tabs */
    body .why-block_inner > h2,                                 /* "Why Choose Mercy University?" */
    body .student-spotlight_block-content h2,
    body .get-started-block h2,
    body .tile .text h2,                                        /* image-and-text-tiles, "Program Highlights" */
    body .outcomes-block h2 {                                   /* was 35px */
        font-size: 34px !important;
    }
}