/* Mr. Engineering V6.2.5
 * Unified front-end action-button system across every public page.
 * Primary: gold/navy. Secondary: navy outline on light surfaces and white outline on dark surfaces.
 */

:root{
  --mre-action-gold:#D6A93A;
  --mre-action-gold-hover:#E5BC55;
  --mre-action-navy:#081B33;
  --mre-action-white:#FFFFFF;
  --mre-action-radius:999px;
  --mre-action-shadow:0 10px 24px rgba(214,169,58,.22);
  --mre-action-shadow-hover:0 14px 32px rgba(214,169,58,.34);
}

/* ------------------------------------------------------------
   1. Shared geometry for every textual action button
   ------------------------------------------------------------ */
.mre-btn,
.mre-video-hero__button,
.wp-element-button,
.wp-block-button__link,
button[type="submit"]:not(.mre-project-gallery-v6__item),
input[type="submit"],
input[type="button"]{
  min-height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:11px 24px;
  border:2px solid transparent;
  border-radius:var(--mre-action-radius);
  font:inherit;
  font-size:.92rem;
  font-weight:850;
  line-height:1.25;
  text-align:center;
  text-decoration:none!important;
  white-space:normal;
  cursor:pointer;
  opacity:1;
  transition:background-color .2s ease,border-color .2s ease,color .2s ease,box-shadow .2s ease,transform .2s ease;
  -webkit-tap-highlight-color:transparent;
}

/* ------------------------------------------------------------
   2. Primary actions everywhere
   ------------------------------------------------------------ */
.mre-btn--primary,
.mre-header__cta .mre-btn,
.mre-video-hero__button--primary,
.wp-block-button:not(.is-style-outline) .wp-block-button__link,
.wp-element-button:not(.is-style-outline),
button[type="submit"]:not(.mre-project-gallery-v6__item),
input[type="submit"],
input[type="button"].mre-btn--primary,
.mre-search-form button[type="submit"],
.mre-smart-search-actions-v608 button,
.mre-kiosk-cart-v609 button,
.mre-v610-success button,
.mre-track-payment__gateways button,
.mre-services-hub-v607__footer a.is-primary{
  background:var(--mre-action-gold)!important;
  border-color:var(--mre-action-gold)!important;
  color:var(--mre-action-navy)!important;
  text-shadow:none!important;
  box-shadow:var(--mre-action-shadow)!important;
}

.mre-btn--primary:hover,
.mre-btn--primary:focus-visible,
.mre-header__cta .mre-btn:hover,
.mre-header__cta .mre-btn:focus-visible,
.mre-video-hero__button--primary:hover,
.mre-video-hero__button--primary:focus-visible,
.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.wp-block-button:not(.is-style-outline) .wp-block-button__link:focus-visible,
.wp-element-button:not(.is-style-outline):hover,
.wp-element-button:not(.is-style-outline):focus-visible,
button[type="submit"]:not(.mre-project-gallery-v6__item):hover,
button[type="submit"]:not(.mre-project-gallery-v6__item):focus-visible,
input[type="submit"]:hover,
input[type="submit"]:focus-visible,
.mre-search-form button[type="submit"]:hover,
.mre-smart-search-actions-v608 button:hover,
.mre-kiosk-cart-v609 button:hover,
.mre-v610-success button:hover,
.mre-track-payment__gateways button:hover,
.mre-services-hub-v607__footer a.is-primary:hover{
  background:var(--mre-action-gold-hover)!important;
  border-color:var(--mre-action-gold-hover)!important;
  color:var(--mre-action-navy)!important;
  box-shadow:var(--mre-action-shadow-hover)!important;
  transform:translateY(-2px);
}

/* Textual WhatsApp/contact CTA follows the same site action palette.
   Floating branded communication icons remain unchanged. */
.mre-btn--whatsapp{
  background:var(--mre-action-gold)!important;
  border-color:var(--mre-action-gold)!important;
  color:var(--mre-action-navy)!important;
  box-shadow:var(--mre-action-shadow)!important;
}
.mre-btn--whatsapp:hover,
.mre-btn--whatsapp:focus-visible{
  background:var(--mre-action-gold-hover)!important;
  border-color:var(--mre-action-gold-hover)!important;
  color:var(--mre-action-navy)!important;
}

/* ------------------------------------------------------------
   3. Secondary actions on light surfaces
   ------------------------------------------------------------ */
.mre-btn--outline,
.mre-btn--ghost,
.mre-btn--secondary,
.mre-btn--call,
.mre-btn--hero-secondary,
.mre-video-hero__button--secondary,
.wp-block-button.is-style-outline .wp-block-button__link,
.mre-v610-nav>button:not(.mre-btn),
.mre-track-v611-response__actions .mre-btn--ghost,
.mre-services-hub-v607__footer a:not(.is-primary){
  background:transparent!important;
  border-color:var(--mre-action-navy)!important;
  color:var(--mre-action-navy)!important;
  box-shadow:none!important;
  opacity:1!important;
}

.mre-btn--outline:hover,
.mre-btn--outline:focus-visible,
.mre-btn--ghost:hover,
.mre-btn--ghost:focus-visible,
.mre-btn--secondary:hover,
.mre-btn--secondary:focus-visible,
.mre-btn--call:hover,
.mre-btn--call:focus-visible,
.mre-btn--hero-secondary:hover,
.mre-btn--hero-secondary:focus-visible,
.mre-video-hero__button--secondary:hover,
.mre-video-hero__button--secondary:focus-visible,
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:focus-visible,
.mre-v610-nav>button:not(.mre-btn):hover,
.mre-v610-nav>button:not(.mre-btn):focus-visible,
.mre-services-hub-v607__footer a:not(.is-primary):hover{
  background:var(--mre-action-navy)!important;
  border-color:var(--mre-action-navy)!important;
  color:var(--mre-action-white)!important;
  box-shadow:0 10px 24px rgba(8,27,51,.18)!important;
  transform:translateY(-2px);
}

/* ------------------------------------------------------------
   4. Secondary actions on dark/image surfaces
   ------------------------------------------------------------ */
:is(
  .mre-section--dark,
  .mre-cta,
  .mre-video-hero,
  .mre-page-hero,
  .mre-widget--cta,
  .mre-service-pricing-card,
  .mre-project-conversion,
  .mre-project-case-marquee-v621__card,
  .mre-kiosk-cart-v609,
  .mre-hero,
  .mre-hero--approved,
  .mre-hero--v502,
  .mre-hero--v503
) :is(
  .mre-btn--outline,
  .mre-btn--ghost,
  .mre-btn--secondary,
  .mre-btn--call,
  .mre-btn--hero-secondary,
  .mre-video-hero__button--secondary,
  .wp-block-button.is-style-outline .wp-block-button__link
){
  background:transparent!important;
  border-color:var(--mre-action-white)!important;
  color:var(--mre-action-white)!important;
  box-shadow:none!important;
}

:is(
  .mre-section--dark,
  .mre-cta,
  .mre-video-hero,
  .mre-page-hero,
  .mre-widget--cta,
  .mre-service-pricing-card,
  .mre-project-conversion,
  .mre-project-case-marquee-v621__card,
  .mre-kiosk-cart-v609,
  .mre-hero,
  .mre-hero--approved,
  .mre-hero--v502,
  .mre-hero--v503
) :is(
  .mre-btn--outline,
  .mre-btn--ghost,
  .mre-btn--secondary,
  .mre-btn--call,
  .mre-btn--hero-secondary,
  .mre-video-hero__button--secondary,
  .wp-block-button.is-style-outline .wp-block-button__link
):hover,
:is(
  .mre-section--dark,
  .mre-cta,
  .mre-video-hero,
  .mre-page-hero,
  .mre-widget--cta,
  .mre-service-pricing-card,
  .mre-project-conversion,
  .mre-project-case-marquee-v621__card,
  .mre-kiosk-cart-v609,
  .mre-hero,
  .mre-hero--approved,
  .mre-hero--v502,
  .mre-hero--v503
) :is(
  .mre-btn--outline,
  .mre-btn--ghost,
  .mre-btn--secondary,
  .mre-btn--call,
  .mre-btn--hero-secondary,
  .mre-video-hero__button--secondary,
  .wp-block-button.is-style-outline .wp-block-button__link
):focus-visible{
  background:var(--mre-action-white)!important;
  border-color:var(--mre-action-white)!important;
  color:var(--mre-action-navy)!important;
  box-shadow:0 10px 24px rgba(0,0,0,.16)!important;
}

/* ------------------------------------------------------------
   5. Page-specific action coverage
   ------------------------------------------------------------ */
/* Project archive filter submit + mobile filter trigger. */
.mre-project-filter-toggle{
  min-height:44px;
  border:2px solid var(--mre-action-navy)!important;
  border-radius:var(--mre-action-radius)!important;
  background:transparent!important;
  color:var(--mre-action-navy)!important;
  font-weight:850!important;
}
.mre-project-filter-toggle:hover,
.mre-project-filter-toggle:focus-visible{
  background:var(--mre-action-navy)!important;
  color:#fff!important;
}

/* Search-page submit button. */
.mre-search-form button[type="submit"]{
  min-width:48px;
  padding-inline:18px!important;
}

/* Client portal payment actions. */
.mre-track-payment__gateways button{
  min-height:46px!important;
  border-radius:var(--mre-action-radius)!important;
  padding:11px 20px!important;
}

/* Quote-form back buttons remain clear secondary actions. */
.mre-v610-nav>button:not(.mre-btn){
  min-height:44px;
  padding:9px 20px!important;
  border-width:2px!important;
  border-style:solid!important;
  border-radius:var(--mre-action-radius)!important;
  text-decoration:none!important;
}

/* Service-menu footer actions use the same hierarchy. */
.mre-services-hub-v607__footer a{
  min-height:42px;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  border-width:2px!important;
  border-radius:var(--mre-action-radius)!important;
  padding:9px 17px!important;
}

/* ------------------------------------------------------------
   6. Disabled/loading/focus states
   ------------------------------------------------------------ */
.mre-btn:disabled,
.mre-btn[aria-disabled="true"],
button[type="submit"]:disabled,
input[type="submit"]:disabled,
.wp-element-button[aria-disabled="true"]{
  opacity:.58!important;
  cursor:not-allowed!important;
  transform:none!important;
  box-shadow:none!important;
  filter:grayscale(.18);
}

:is(
  .mre-btn,
  .mre-video-hero__button,
  .wp-element-button,
  .wp-block-button__link,
  button[type="submit"],
  input[type="submit"],
  .mre-project-filter-toggle,
  .mre-track-payment__gateways button,
  .mre-services-hub-v607__footer a
):focus-visible{
  outline:3px solid var(--mre-action-gold-hover)!important;
  outline-offset:3px!important;
}

/* ------------------------------------------------------------
   7. Mobile: centered, equal, comfortably tappable
   ------------------------------------------------------------ */
@media(max-width:760px){
  .mre-cta__actions,
  .mre-video-hero__actions,
  .mre-hero__actions,
  .mre-hero-v501__actions,
  .mre-hero-v503__actions,
  .mre-project-conversion__actions,
  .mre-track-v611-response__actions{
    justify-content:center!important;
    align-items:center!important;
    text-align:center!important;
  }

  :is(
    .mre-cta__actions,
    .mre-video-hero__actions,
    .mre-hero__actions,
    .mre-hero-v501__actions,
    .mre-hero-v503__actions,
    .mre-project-conversion__actions
  ) .mre-btn,
  .mre-video-hero__button,
  .mre-form-nav .mre-btn,
  .mre-track-v611-response__actions .mre-btn{
    min-height:48px!important;
    justify-content:center!important;
    text-align:center!important;
  }

  .mre-project-case-marquee-v621__actions,
  .mre-track-v611-response__actions,
  .mre-project-conversion__actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:9px!important;
    width:100%!important;
  }

  .mre-project-case-marquee-v621__actions .mre-btn,
  .mre-track-v611-response__actions .mre-btn,
  .mre-project-conversion__actions .mre-btn,
  .mre-widget--cta .mre-btn{
    width:100%!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .mre-btn,
  .mre-video-hero__button,
  .wp-element-button,
  .wp-block-button__link,
  button[type="submit"],
  input[type="submit"]{
    transition:none!important;
  }
  .mre-btn:hover,
  .mre-video-hero__button:hover,
  button[type="submit"]:hover,
  input[type="submit"]:hover{
    transform:none!important;
  }
}

/* ------------------------------------------------------------
   8. Legacy high-specificity component overrides
   These selectors intentionally match older !important rules.
   ------------------------------------------------------------ */
.mre-hero-v501__actions .mre-btn--primary,
.mre-hero-v503__actions .mre-btn--primary,
.mre-hero--v502 .mre-hero-v501__actions .mre-btn--primary,
.mre-hero--v503 .mre-hero-v503__actions .mre-btn--primary{
  background:var(--mre-action-gold)!important;
  border-color:var(--mre-action-gold)!important;
  color:var(--mre-action-navy)!important;
  box-shadow:var(--mre-action-shadow)!important;
}
.mre-hero-v501__actions .mre-btn--primary:hover,
.mre-hero-v503__actions .mre-btn--primary:hover,
.mre-hero--v502 .mre-hero-v501__actions .mre-btn--primary:hover,
.mre-hero--v503 .mre-hero-v503__actions .mre-btn--primary:hover{
  background:var(--mre-action-gold-hover)!important;
  border-color:var(--mre-action-gold-hover)!important;
  color:var(--mre-action-navy)!important;
}

.mre-hero-v501__actions .mre-btn--hero-secondary,
.mre-hero-v503__actions .mre-btn--hero-secondary,
.mre-hero--v502 .mre-hero-v501__actions .mre-btn--hero-secondary,
.mre-hero--v503 .mre-hero-v503__actions .mre-btn--hero-secondary,
.mre-service-pricing-card .mre-btn--outline,
.mre-service-pricing-card .mre-btn--call,
.mre-service-item-price-card .mre-btn--secondary,
.mre-service-item-price-card .mre-btn--call{
  background:transparent!important;
  border:2px solid #fff!important;
  color:#fff!important;
  box-shadow:none!important;
}
.mre-hero-v501__actions .mre-btn--hero-secondary:hover,
.mre-hero-v503__actions .mre-btn--hero-secondary:hover,
.mre-service-pricing-card .mre-btn--outline:hover,
.mre-service-pricing-card .mre-btn--call:hover,
.mre-service-item-price-card .mre-btn--secondary:hover,
.mre-service-item-price-card .mre-btn--call:hover{
  background:#fff!important;
  border-color:#fff!important;
  color:var(--mre-action-navy)!important;
}
