/* SeniorFit home: gym image in the header, model photo below it. */
body.site.view-featured.itemid-101 {
  background: #071b38;
  color: #eaf4ff;
}

.container-header {
  position: relative;
  z-index: 2;
  background-color: #061a38;
  background-image:
    linear-gradient(100deg, rgba(4, 20, 45, .82), rgba(5, 42, 85, .72) 58%, rgba(5, 34, 70, .65)),
    url("../../../../../images/seniorfit-gym-bg.png");
  background-size: cover;
  background-position: right 48%;
  background-repeat: no-repeat;
  box-shadow: 0 5px 22px rgba(3, 16, 38, .35);
}

.container-header .navbar-brand {
  display: flex;
  align-items: center;
  gap: 1rem;
  min-height: 88px;
  padding: .5rem 0;
}

.container-header .navbar-brand .brand-logo {
  display: block;
  flex: 0 0 76px;
  width: 76px;
  height: 76px;
  overflow: hidden;
  background: url("../../../../../images/seniorfit-logo.png") center / contain no-repeat;
  font-size: 0 !important;
  color: transparent !important;
  text-indent: -9999px !important;
}

.container-header .navbar-brand .brand-logo img,
.container-header .navbar-brand .brand-logo span,
.container-header .navbar-brand .brand-logo > * {
  display: none !important;
}

.container-header .navbar-brand::after {
  content: "SeniorFit";
  color: #fff;
  font-size: clamp(1.55rem, 3vw, 2.25rem);
  font-weight: 800;
  letter-spacing: .025em;
  line-height: 1.1;
  text-shadow: 0 2px 8px rgba(0, 0, 0, .35);
}

.container-header .mod-menu a,
.container-header .navbar-toggler {
  color: #f4f9ff;
}

/* Start the model image after the header; keep its right side anchored in view. */
body.site.view-featured.itemid-101 .site-grid {
  min-height: calc(100vh - 90px);
  padding-top: clamp(1.25rem, 4vh, 3rem);
  background-color: #0a2850;
  background-image:
    linear-gradient(90deg, rgba(5, 39, 91, .48) 0%, rgba(7, 48, 112, .50) 48%, rgba(4, 32, 78, .66) 100%),
    url("../../../../../images/seniorfit-model-bg.png");
  background-size: cover;
  background-position: right top;
  background-repeat: no-repeat;
}

body.site.view-featured.itemid-101 .card,
body.site.view-featured.itemid-101 .mod-login,
body.site.view-featured.itemid-101 .mod-menu {
  border: 1px solid rgba(151, 197, 242, .35);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(0, 13, 34, .24);
}

body.site.view-featured.itemid-101 .card-header,
body.site.view-featured.itemid-101 .card-header h3 {
  background: linear-gradient(100deg, #0a3267, #0878c9);
  color: #fff;
}

/* Subtle gym atmosphere behind every Joomla page; keep the home model scene. */
body.site:not(.view-featured.itemid-101) .site-grid {
  background-color: #edf4fa;
  background-image:
    linear-gradient(rgba(239, 246, 252, .91), rgba(239, 246, 252, .94)),
    url("../../../../../images/seniorfit-gym-bg.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

/* The login module belongs only on the homepage. */
body.site:not(.view-featured.itemid-101) .container-sidebar-right .card:has(.mod-login),
body.site:not(.view-featured.itemid-101) .container-sidebar-right .card:has([id^="login-form"]),
body.site:not(.view-featured.itemid-101) .container-sidebar-right .mod-login {
  display: none !important;
}

@media (max-width: 767px) {
  .container-header .navbar-brand {
    min-height: 70px;
  }
  .container-header .navbar-brand .brand-logo {
    flex-basis: 58px;
    width: 58px;
    height: 58px;
  }
  body.site.view-featured.itemid-101 .site-grid {
    min-height: calc(100vh - 70px);
    padding-top: 1rem;
    background-size: auto 72vh;
    background-position: right top;
  }
}



/* Hide the breadcrumb and page title on the landing page. */
body.site.view-featured.itemid-101 .container-component .mod-breadcrumbs,
body.site.view-featured.itemid-101 .container-component .breadcrumb,
body.site.view-featured.itemid-101 .container-component nav[aria-label="breadcrumb"],
body.site.view-featured.itemid-101 .container-component .page-header {
  display: none !important;
}

/* Round gym-style home control, available from every page. */
.container-header {
  position: relative;
}

.container-header .seniorfit-home-button {
  position: absolute;
  z-index: 5;
  top: 50%;
  right: clamp(1rem, 3vw, 2.5rem);
  display: grid;
  width: 54px;
  height: 54px;
  place-items: center;
  border: 2px solid rgba(226, 243, 255, .9);
  border-radius: 50%;
  background: linear-gradient(145deg, #1596e8, #07356d 78%);
  box-shadow: 0 5px 15px rgba(0, 12, 32, .45), inset 0 1px 3px rgba(255, 255, 255, .28);
  color: #fff;
  transform: translateY(-50%);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}

.container-header .seniorfit-home-button:hover {
  color: #fff;
  filter: brightness(1.12);
  transform: translateY(-50%) scale(1.06);
  box-shadow: 0 7px 19px rgba(0, 12, 32, .55), inset 0 1px 3px rgba(255, 255, 255, .3);
}

.container-header .seniorfit-home-button:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
}

.container-header .seniorfit-register-button {
  position: absolute;
  z-index: 5;
  top: 50%;
  right: clamp(5rem, 8vw, 7.5rem);
  padding: .7rem 1.1rem;
  border: 1px solid rgba(226, 243, 255, .82);
  border-radius: 999px;
  background: linear-gradient(145deg, #1596e8, #07356d 78%);
  box-shadow: 0 5px 15px rgba(0, 12, 32, .4), inset 0 1px 3px rgba(255, 255, 255, .25);
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  text-shadow: 0 1px 4px rgba(0, 0, 0, .3);
  transform: translateY(-50%);
}

.container-header .seniorfit-register-button:hover,
.container-header .seniorfit-register-button:focus-visible {
  color: #fff;
  filter: brightness(1.12);
  outline: 2px solid #fff;
  outline-offset: 3px;
}

body.site.com_users.view-registration .com-users-registration {
  padding: clamp(1.25rem, 3vw, 2.25rem);
  border: 1px solid rgba(151, 197, 242, .45);
  border-radius: 16px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 12px 32px rgba(0, 35, 80, .16);
}

body.site.com_users.view-registration .mod-breadcrumbs,
body.site.com_users.view-registration .breadcrumb,
body.site.com_users.view-registration .page-header {
  display: none;
}

body.site.com_users.view-registration .seniorfit-page-heading {
  margin: 0 0 1.25rem;
  color: #082f63;
  font-size: clamp(1.65rem, 3vw, 2.25rem);
  font-weight: 800;
}

body.site.com_users.view-registration .com-users-registration__register {
  border-color: #0878c9;
  background: linear-gradient(100deg, #0a3267, #0878c9);
  color: #fff;
  font-weight: 700;
}

.container-header .seniorfit-home-button svg {
  width: 27px;
  height: 27px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.5;
  stroke-linecap: round;
}

@media (max-width: 767px) {
  .container-header .seniorfit-home-button {
    right: 1rem;
    width: 46px;
    height: 46px;
  }
  .container-header .seniorfit-home-button svg {
    width: 23px;
    height: 23px;
  }
  .container-header .seniorfit-register-button {
    top: auto;
    right: 4.75rem;
    bottom: .5rem;
    padding: .45rem .75rem;
    font-size: .9rem;
    transform: none;
  }
}

/* Compact home login card in the upper-left, directly below the header. */
body.site.view-featured.itemid-101 .site-grid {
  position: relative;
}

body.site.view-featured.itemid-101 .container-sidebar-right .card:has(.mod-login),
body.site.view-featured.itemid-101 .container-sidebar-right .card:has([id^="login-form"]) {
  position: absolute;
  z-index: 3;
  top: 1.25rem;
  left: clamp(1rem, 3vw, 2.5rem);
  width: min(280px, calc(100vw - 2rem));
  margin: 0;
  border-radius: 10px;
}

body.site.view-featured.itemid-101 .container-sidebar-right .card:has(.mod-login) .card-header,
body.site.view-featured.itemid-101 .container-sidebar-right .card:has([id^="login-form"]) .card-header {
  padding: .5rem .75rem;
}

body.site.view-featured.itemid-101 .container-sidebar-right .card:has(.mod-login) .card-header h3,
body.site.view-featured.itemid-101 .container-sidebar-right .card:has([id^="login-form"]) .card-header h3 {
  margin: 0;
  font-size: 1.05rem;
}

body.site.view-featured.itemid-101 .container-sidebar-right .card:has(.mod-login) .card-body,
body.site.view-featured.itemid-101 .container-sidebar-right .card:has([id^="login-form"]) .card-body {
  padding: .7rem;
  font-size: .9rem;
}

body.site.view-featured.itemid-101 .container-sidebar-right .card:has(.mod-login) .form-control,
body.site.view-featured.itemid-101 .container-sidebar-right .card:has([id^="login-form"]) .form-control {
  min-width: 0;
  max-width: 100%;
  font-size: .9rem;
}

@media (max-width: 767px) {
  body.site.view-featured.itemid-101 .container-sidebar-right .card:has(.mod-login),
  body.site.view-featured.itemid-101 .container-sidebar-right .card:has([id^="login-form"]) {
    top: .75rem;
    left: .75rem;
    width: min(260px, calc(100vw - 1.5rem));
  }
}


/* Mobile homepage: keep the login card in the page flow so it cannot cover menu cards. */
@media (max-width: 767px) {
  body.site.view-featured.itemid-101 .container-sidebar-right .card:has(.mod-login),
  body.site.view-featured.itemid-101 .container-sidebar-right .card:has([id^="login-form"]) {
    position: relative;
    inset: auto;
    z-index: 1;
    width: 100%;
    max-width: none;
    margin: .75rem 0 1rem;
  }
}

/* Force homepage sidebar cards into normal vertical flow on phone layouts. */
@media (max-width: 767px) {
  body.site.view-featured.itemid-101 .container-sidebar-right .card {
    position: static !important;
    inset: auto !important;
    float: none !important;
    transform: none !important;
    width: 100% !important;
    max-width: none !important;
    margin: .75rem 0 1rem !important;
  }
}

/* Responsive fallback for narrow and foldable screens; also defeats cached layout variants. */
@media (max-width: 1024px) {
  .site-grid .container-sidebar-right .card {
    position: static !important;
    inset: auto !important;
    float: none !important;
    transform: none !important;
    width: 100% !important;
    max-width: none !important;
    margin: .75rem 0 1rem !important;
  }
}