/*
 * Your Space Your Time — Cassiopeia core CSS
 * Paste into the child template's user.css, or add after existing template CSS.
 * No external fonts or icon libraries required.
 */
:root {
  --yst-green: #556b3e;
  --yst-green-dark: #364b35;
  --yst-olive: #85964e;
  --yst-sage: #eef2e9;
  --yst-grey: #525852;
  --yst-grey-light: #f6f7f4;
  --yst-border: #dce2d6;
  --yst-white: #ffffff;
  --yst-width: 1240px;
  --yst-radius: 6px;
  --cassiopeia-color-primary: var(--yst-green-dark);
  --cassiopeia-color-link: var(--yst-green);
  --cassiopeia-color-hover: var(--yst-green-dark);
  --body-color: var(--yst-grey);
  --body-bg: var(--yst-white);
}
body {
  color: var(--yst-grey);
  background: var(--yst-white);
  font-family: "Montserrat", "Segoe UI", Arial, sans-serif;
  font-size: 1rem;
  line-height: 1.75;
}
h1, h2, h3, h4, h5, h6 {
  color: var(--yst-green-dark);
  font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  font-weight: 400;
  line-height: 1.2;
  text-transform: none;
  overflow-wrap: break-word;
}
h1 { font-size: clamp(1.85rem, 2.6vw, 2.4rem); margin: 0 0 1.15rem; }
h2 { font-size: clamp(1.65rem, 2.1vw, 2rem); margin: 0 0 1rem; }
h3 { font-size: clamp(1.3rem, 1.8vw, 1.55rem); margin: 0 0 .85rem; }
h4 { font-size: 1.25rem; }
p { margin: 0 0 1.1rem; }
a { color: var(--yst-green); text-decoration-thickness: 1px; text-underline-offset: .2em; }
a:hover { color: var(--yst-green-dark); }
a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible, summary:focus-visible {
  outline: 3px solid var(--yst-green);
  outline-offset: 4px;
}
img { max-width: 100%; height: auto; }
strong, b { font-weight: 600; }
::selection { color: var(--yst-white); background: var(--yst-green); }

/* Cassiopeia header: leave menu opening/closing to Joomla's native script. */
.container-header {
  background-color: var(--yst-white);
  background-image: none;
  box-shadow: none;
  border-bottom: 1px solid var(--yst-border);
}
.container-header .navbar-brand,
.container-header .navbar-brand a,
.container-header .mod-menu { color: var(--yst-grey); }
.container-header .navbar-brand img { width: auto; max-height: 145px; }
.container-header .container-nav {
  width: 100%;
  max-width: var(--yst-width);
  margin-inline: auto;
  padding: .65rem 1.5rem;
  justify-content: center;
}
.container-header .mod-menu { gap: .3rem 1rem; }
.container-header .mod-menu > li > a,
.container-header .mod-menu > li > span,
.container-header .mod-menu > li > button {
  color: var(--yst-grey);
  font-size: .83rem;
  font-weight: 500;
  letter-spacing: .055em;
  text-transform: uppercase;
}
.container-header .mod-menu a { text-decoration: none; }
.container-header .mod-menu a:hover,
.container-header .mod-menu li.active > a,
.container-header .mod-menu li.current > a { color: var(--yst-green-dark); }
.container-header .mod-menu li.active > a,
.container-header .mod-menu li.current > a { text-decoration: underline; text-underline-offset: .4em; }
.container-header .mod-menu .metismenu-item > ul,
.container-header .mod-menu .mod-menu__sub {
  background: var(--yst-white);
  border: 1px solid var(--yst-border);
  border-radius: var(--yst-radius);
  box-shadow: 0 8px 24px rgb(54 75 53 / 9%);
}
.container-header .mod-menu ul a,
.container-header .mod-menu ul span {
  color: var(--yst-grey);
  font-size: .9rem;
  white-space: normal;
}
.container-header .navbar-toggler { color: var(--yst-green-dark); border-color: var(--yst-border); }
.container-header .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='%23364b35' stroke-width='2' stroke-linecap='round' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.container-header .metismenu.mod-menu .mm-toggler { color: var(--yst-grey); }

/* Optional top-logo module; use this wrapper if a custom position is added. */
.yst-topbar {
  max-width: var(--yst-width);
  margin-inline: auto;
  padding: 1.4rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
}
.yst-topbar__logo img { display: block; max-width: 190px; }
.yst-topbar__contact { text-align: right; font-size: .92rem; }
.yst-topbar__contact p { margin: .15rem 0; }
.yst-topbar__contact a { overflow-wrap: anywhere; }

/* Reusable content and section utilities. */
.yst-wrap { width: 100%; max-width: var(--yst-width); margin-inline: auto; }
.yst-section { padding: clamp(2rem, 4vw, 3.5rem) 1.5rem; }
.yst-section--sage { background: var(--yst-sage); }
.yst-section--grey { background: var(--yst-grey-light); }
.yst-text { max-width: 780px; }
.yst-home { color: var(--yst-grey); }
.yst-home *, .yst-home *::before, .yst-home *::after { box-sizing: border-box; }

/* Intro: supplied heading and text, with a small face-to-face/remote panel. */
.yst-intro {
  background: var(--yst-sage);
  border-radius: var(--yst-radius);
  padding: clamp(1.5rem, 3.5vw, 3rem);
  margin-bottom: 2rem;
}
.yst-intro__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, .32fr);
  align-items: center;
  gap: 2.5rem;
}
.yst-intro__copy > :last-child { margin-bottom: 0; }
.yst-intro__availability {
  padding: 1.4rem 0 1.4rem 1.5rem;
  border-left: 2px solid var(--yst-olive);
  color: var(--yst-green-dark);
  font-size: 1.05rem;
  line-height: 1.65;
  margin: 0;
}
.yst-intro h1 { max-width: 760px; }

/* Six services: three columns and two equally sized rows on desktop. */
.yst-services {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: 1fr;
  gap: 1.25rem;
  margin: 0 0 2rem;
}
.yst-service {
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: 1.7rem;
  background: var(--yst-white);
  border: 1px solid var(--yst-border);
  border-top: 3px solid var(--yst-olive);
  border-radius: var(--yst-radius);
  transition: border-color .18s ease, box-shadow .18s ease;
}
.yst-service:hover {
  border-color: var(--yst-olive);
  box-shadow: 0 5px 18px rgb(54 75 53 / 7%);
}
.yst-service h2 { font-size: 1.55rem; margin: 0 0 1rem; }
.yst-service h2 a { color: var(--yst-green-dark); text-decoration: none; }
.yst-service h2 a:hover { text-decoration: underline; }
.yst-service p { font-size: .96rem; margin-bottom: 1.5rem; }
.yst-service__link {
  align-self: flex-start;
  display: inline-block;
  margin-top: auto;
  color: var(--yst-green-dark);
  font-size: .88rem;
  font-weight: 500;
}
.yst-service__link::after { content: " →"; padding-left: .3rem; }
.yst-contact-note {
  background: var(--yst-grey-light);
  border-radius: var(--yst-radius);
  padding: 1.5rem 1.8rem;
}
.yst-contact-note p { margin: 0; }
.yst-contact-note a { font-weight: 600; }

/* Optional retained woodland banner: set image via HTML or your hero module. */
.yst-woodland { position: relative; overflow: hidden; background: var(--yst-sage); }
.yst-woodland > img {
  display: block;
  width: 100%;
  height: clamp(220px, 25vw, 360px);
  object-fit: cover;
  object-position: center;
}
.yst-woodland__caption {
  position: absolute;
  inset: auto 0 0;
  padding: 1.15rem 1.5rem;
  background: rgb(35 50 30 / 85%);
  color: var(--yst-white);
  text-align: center;
  font-family: Georgia, serif;
  font-size: clamp(1rem, 1.5vw, 1.25rem);
}
.yst-woodland__caption p { max-width: 1050px; margin: 0 auto; }

/* Buttons, forms, standard Joomla content and footer. */
.btn-primary, .yst-button {
  display: inline-block;
  padding: .7rem 1.25rem;
  border: 1px solid var(--yst-green);
  border-radius: var(--yst-radius);
  background: var(--yst-green);
  color: var(--yst-white);
  font-weight: 500;
  line-height: 1.4;
  text-decoration: none;
  box-shadow: none;
}
.btn-primary:hover, .btn-primary:focus, .yst-button:hover {
  background: var(--yst-green-dark);
  border-color: var(--yst-green-dark);
  color: var(--yst-white);
}
.form-control, .form-select {
  border-color: var(--yst-border);
  border-radius: var(--yst-radius);
  color: var(--yst-grey);
  background-color: var(--yst-white);
}
.form-control:focus, .form-select:focus { border-color: var(--yst-green); box-shadow: none; }
.com-content-article__body li { margin-bottom: .4rem; }
.breadcrumb { background: transparent; font-size: .85rem; }
.container-footer {
  color: var(--yst-grey);
  background-color: var(--yst-grey-light);
  background-image: none;
  border-top: 1px solid var(--yst-border);
}
.container-footer a { color: var(--yst-green-dark); }
.container-footer .grid-child { padding-block: 2rem; }

/* Tablet and mobile. */
@media (max-width: 991.98px) {
  .yst-services { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .yst-intro__layout { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
  .yst-intro__availability { padding: .6rem 0 .6rem 1rem; }
  .container-header .container-nav { justify-content: flex-start; }
}
@media (max-width: 575.98px) {
  body { font-size: .96rem; }
  .yst-section { padding: 1.7rem 1rem; }
  .yst-intro { padding: 1.4rem; }
  .yst-services { grid-template-columns: minmax(0, 1fr); grid-auto-rows: auto; gap: 1rem; }
  .yst-service { padding: 1.4rem; }
  .yst-service h2 { font-size: 1.45rem; }
  .yst-contact-note { padding: 1.3rem; }
  .yst-topbar { flex-direction: column; padding: 1rem; gap: .75rem; }
  .yst-topbar__logo img { max-width: 150px; }
  .yst-topbar__contact { text-align: center; }
  .yst-woodland__caption { position: static; }
}
@media (prefers-reduced-motion: reduce) {
  .yst-service { transition: none; }
}


/* Your Space Your Time — top-logo module
   Append this to the bottom of your existing user.css. */
.yst-top-logo,
.yst-top-logo *,
.yst-top-logo::before,
.yst-top-logo *::before {
  box-sizing: border-box;
}
.yst-top-logo {
  width: 100%;
  max-width: var(--yst-width, 1240px);
  margin-inline: auto;
  padding: 1.4rem 1.5rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr);
  align-items: center;
  column-gap: clamp(1.5rem, 3vw, 2.5rem);
}
.yst-top-logo::before {
  content: "";
  grid-column: 2;
  grid-row: 1;
  width: 1px;
  height: 125px;
  background: var(--yst-border, #dce2d6);
}
.yst-top-logo__brand {
  grid-column: 1;
  grid-row: 1;
  display: block;
  justify-self: start;
}
.yst-top-logo__brand img {
  display: block;
  width: 198px;
  max-width: 100%;
  height: auto;
  margin: 0;
}
.yst-top-logo__details {
  grid-column: 3;
  grid-row: 1;
  min-width: 0;
}
.yst-top-logo .yst-top-logo__title {
  margin: 0 0 1rem;
  color: var(--yst-green-dark, #364b35);
  font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  font-size: clamp(1.3rem, 1.8vw, 1.65rem);
  font-weight: 400;
  line-height: 1.35;
}
.yst-top-logo .yst-top-logo__contact {
  margin: .45rem 0;
  font-size: .94rem;
  line-height: 1.55;
}
.yst-top-logo__contact a {
  display: inline-flex;
  align-items: flex-start;
  gap: .7rem;
  max-width: 100%;
  color: var(--yst-grey, #525852);
  text-decoration: none;
}
.yst-top-logo__contact a:hover {
  color: var(--yst-green-dark, #364b35);
  text-decoration: underline;
  text-underline-offset: .2em;
}
.yst-top-logo__contact a:focus-visible {
  outline: 3px solid var(--yst-green, #556b3e);
  outline-offset: 4px;
}
.yst-top-logo__contact a > span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.yst-top-logo__contact a::before {
  content: "";
  flex: 0 0 19px;
  width: 19px;
  height: 19px;
  margin-top: .12rem;
  background-color: var(--yst-green, #556b3e);
  -webkit-mask: var(--yst-contact-icon) center / contain no-repeat;
  mask: var(--yst-contact-icon) center / contain no-repeat;
}
.yst-top-logo__email {
  --yst-contact-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 6 9 7 9-7'/%3E%3C/svg%3E");
}
.yst-top-logo__phone {
  --yst-contact-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.12.96.36 1.91.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.9.34 1.85.58 2.81.7A2 2 0 0 1 22 16.92Z'/%3E%3C/svg%3E");
}
@media (max-width: 767.98px) {
  .yst-top-logo {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 1rem;
    padding: 1.25rem 1rem;
    text-align: center;
  }
  .yst-top-logo__brand {
    grid-column: 1;
    grid-row: 1;
    justify-self: center;
  }
  .yst-top-logo__brand img { width: 165px; }
  .yst-top-logo::before {
    grid-column: 1;
    grid-row: 2;
    width: min(100%, 340px);
    height: 1px;
    justify-self: center;
  }
  .yst-top-logo__details { grid-column: 1; grid-row: 3; }
  .yst-top-logo .yst-top-logo__title { margin-bottom: .8rem; }
  .yst-top-logo__contact a { text-align: left; }
}


/* Your Space Your Time — full-width desktop menu and team blog
   Append after the existing core CSS.
   Team menu item > Page Display > Page Class: yst-team-blog */

/* Desktop menu: use the full header width and keep the top level on one line. */
.container-header .container-nav {
  width: 100%;
  max-width: none;
  margin-inline: 0;
  padding-inline: clamp(.75rem, 1.8vw, 2rem);
}
@media (min-width: 992px) {
  .container-header .container-nav { justify-content: center; }
  .container-header .container-nav > .moduletable,
  .container-header .container-nav .navbar {
    width: 100%;
    max-width: none;
    min-width: 0;
  }
  .container-header .container-nav .navbar-collapse {
    width: 100%;
    flex-basis: auto;
  }
  .container-header .container-nav .mod-menu {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-evenly;
    align-items: center;
    width: 100%;
    gap: clamp(.3rem, .7vw, .8rem);
  }
  .container-header .container-nav .mod-menu > li {
    flex: 0 0 auto;
    margin: 0;
    padding: 0;
  }
  .container-header .container-nav .mod-menu > li > a,
  .container-header .container-nav .mod-menu > li > span,
  .container-header .container-nav .mod-menu > li > button {
    padding: .7rem .1rem;
    font-size: clamp(.7rem, .85vw, .82rem);
    letter-spacing: .025em;
    white-space: nowrap;
  }
}

/* Only the team category blog. Retain Joomla's four-column setting. */
:is(.yst-team-blog, .blogyst-team-blog) .blog-items {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: 1fr;
  gap: 1.35rem;
  align-items: stretch;
}
:is(.yst-team-blog, .blogyst-team-blog) .blog-items > .blog-item {
  display: flex;
  flex-direction: column;
  min-width: 0;
  width: auto;
  max-width: none;
  height: 100%;
  margin: 0;
  padding: 1.1rem;
  border: 1px solid var(--yst-border, #dce2d6);
  border-radius: var(--yst-radius, 6px);
  background: var(--yst-white, #ffffff);
  box-sizing: border-box;
}
:is(.yst-team-blog, .blogyst-team-blog) .blog-item .item-image {
  flex: 0 0 auto;
  float: none;
  width: 100%;
  margin: 0 0 1rem;
  text-align: center;
}
:is(.yst-team-blog, .blogyst-team-blog) .blog-item .item-image a,
:is(.yst-team-blog, .blogyst-team-blog) .blog-item .item-image picture {
  display: block;
  width: 100%;
}
:is(.yst-team-blog, .blogyst-team-blog) .blog-item .item-image img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: center top;
  border-radius: 3px;
  margin: 0;
}
:is(.yst-team-blog, .blogyst-team-blog) .blog-item .item-content {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-width: 0;
}
:is(.yst-team-blog, .blogyst-team-blog) .blog-item .page-header { margin: 0 0 .75rem; }
:is(.yst-team-blog, .blogyst-team-blog) .blog-item .page-header h2,
:is(.yst-team-blog, .blogyst-team-blog) .blog-item .page-header h3,
:is(.yst-team-blog, .blogyst-team-blog) .blog-item h2.item-title {
  margin: 0;
  color: var(--yst-green-dark, #364b35);
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 1.25;
  overflow-wrap: break-word;
}
:is(.yst-team-blog, .blogyst-team-blog) .blog-item .page-header a {
  color: inherit;
  text-decoration: none;
}
:is(.yst-team-blog, .blogyst-team-blog) .blog-item .page-header a:hover { text-decoration: underline; }
:is(.yst-team-blog, .blogyst-team-blog) .blog-item .item-content h3,
:is(.yst-team-blog, .blogyst-team-blog) .blog-item .item-content h4 {
  font-size: 1.08rem;
  font-weight: 400;
  line-height: 1.4;
  margin: 0 0 .75rem;
}
:is(.yst-team-blog, .blogyst-team-blog) .blog-item .item-content .page-header h3 { font-size: 1.4rem; }
:is(.yst-team-blog, .blogyst-team-blog) .blog-item p {
  font-size: .9rem;
  line-height: 1.65;
  margin-bottom: .85rem;
}
:is(.yst-team-blog, .blogyst-team-blog) .blog-item .readmore {
  margin-top: auto;
  margin-bottom: 0;
  padding-top: 1rem;
}
:is(.yst-team-blog, .blogyst-team-blog) .blog-item .readmore .btn {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  padding: .45rem .85rem;
  border: 1px solid var(--yst-border, #dce2d6);
  border-radius: 4px;
  background: var(--yst-sage, #eef2e9);
  color: var(--yst-green-dark, #364b35);
  font-size: .82rem;
  font-weight: 400;
  line-height: 1.4;
  text-decoration: none;
  box-shadow: none;
}
:is(.yst-team-blog, .blogyst-team-blog) .blog-item .readmore .btn:hover {
  border-color: var(--yst-green, #556b3e);
  background: var(--yst-green, #556b3e);
  color: #fff;
}
@media (max-width: 991.98px) {
  :is(.yst-team-blog, .blogyst-team-blog) .blog-items { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
  :is(.yst-team-blog, .blogyst-team-blog) .blog-items {
    grid-template-columns: minmax(0, 1fr);
    grid-auto-rows: auto;
    gap: 1rem;
  }
  :is(.yst-team-blog, .blogyst-team-blog) .blog-items > .blog-item { padding: 1rem; }
  :is(.yst-team-blog, .blogyst-team-blog) .blog-item .item-image { max-width: 260px; margin-inline: auto; }
}
/* Updated homepage: four core services, benefits and contact invitation.
   Append this after the existing CSS, or use the complete updated user.css. */
.yst-home--updated .yst-intro__copy { max-width: 940px; }
.yst-home--updated .yst-intro h1 { max-width: 900px; }
.yst-home--updated .yst-services-heading { margin-bottom: 1.3rem; }
.yst-home--updated .yst-services {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25rem;
  margin-bottom: 2.5rem;
}
.yst-home--updated .yst-service { padding: 1.5rem; }
.yst-home--updated .yst-service h3 {
  font-size: 1.45rem;
  font-weight: 400;
  line-height: 1.3;
  margin: 0 0 1rem;
}
.yst-home--updated .yst-service h3 a {
  color: var(--yst-green-dark, #364b35);
  text-decoration: none;
}
.yst-home--updated .yst-service h3 a:hover { text-decoration: underline; }
.yst-home--updated .yst-service p { font-size: .94rem; }
.yst-home--updated .yst-benefits {
  display: grid;
  grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr);
  gap: 1.5rem 3rem;
  align-items: start;
  margin-bottom: 2.5rem;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: var(--yst-grey-light, #f6f7f4);
  border-radius: var(--yst-radius, 6px);
}
.yst-home--updated .yst-benefits h2 { margin: 0; }
.yst-home--updated .yst-benefits ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.yst-home--updated .yst-benefits li {
  position: relative;
  margin: 0 0 .9rem;
  padding-left: 1.75rem;
}
.yst-home--updated .yst-benefits li:last-child { margin-bottom: 0; }
.yst-home--updated .yst-benefits li::before {
  content: "";
  position: absolute;
  left: .2rem;
  top: .45rem;
  width: .45rem;
  height: .8rem;
  border: solid var(--yst-green, #556b3e);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.yst-home--updated .yst-next-step {
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: var(--yst-sage, #eef2e9);
  border-radius: var(--yst-radius, 6px);
}
.yst-home--updated .yst-next-step > p { max-width: 850px; }
.yst-home--updated .yst-next-step__action { margin: 1.4rem 0 0; }
.yst-home--updated .yst-next-step__link {
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  max-width: 100%;
  padding: .85rem 1.2rem;
  background: var(--yst-green, #556b3e);
  color: #fff;
  border: 1px solid var(--yst-green, #556b3e);
  border-radius: var(--yst-radius, 6px);
  font-size: .94rem;
  font-weight: 500;
  line-height: 1.5;
  text-decoration: none;
}
.yst-home--updated .yst-next-step__link:hover {
  background: var(--yst-green-dark, #364b35);
  border-color: var(--yst-green-dark, #364b35);
  color: #fff;
}
.yst-home--updated .yst-next-step__link::before {
  content: "";
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.12.96.36 1.91.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.9.34 1.85.58 2.81.7A2 2 0 0 1 22 16.92Z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.12.96.36 1.91.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.9.34 1.85.58 2.81.7A2 2 0 0 1 22 16.92Z'/%3E%3C/svg%3E") center / contain no-repeat;
}
@media (max-width: 991.98px) {
  .yst-home--updated .yst-services { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
  .yst-home--updated .yst-benefits { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
}
@media (max-width: 575.98px) {
  .yst-home--updated .yst-services { grid-template-columns: minmax(0, 1fr); }
  .yst-home--updated .yst-service { padding: 1.4rem; }
  .yst-home--updated .yst-next-step__link { align-items: flex-start; }
  .yst-home--updated .yst-next-step__link::before { margin-top: .1rem; }
}
/* Your Space Your Time — About Us
   Append to existing user.css, or use the complete updated stylesheet. */
.yst-about { color: var(--yst-grey, #525852); }
.yst-about *, .yst-about *::before { box-sizing: border-box; }
.yst-about__intro {
  padding: clamp(1.5rem, 3.5vw, 3rem);
  margin-bottom: 2rem;
  border-radius: var(--yst-radius, 6px);
  background: var(--yst-sage, #eef2e9);
}
.yst-about__intro > :last-child { margin-bottom: 0; }
.yst-about__intro p { max-width: 980px; }
.yst-about .yst-about__lead {
  margin-bottom: 1.1rem;
  color: var(--yst-green-dark, #364b35);
  font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  font-size: clamp(1.2rem, 1.8vw, 1.45rem);
  font-weight: 400;
  line-height: 1.45;
}
.yst-about__grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: 1.5rem;
  margin-bottom: 1.5rem;
  align-items: stretch;
}
.yst-about__panel {
  min-width: 0;
  padding: clamp(1.4rem, 2.8vw, 2.3rem);
  border: 1px solid var(--yst-border, #dce2d6);
  border-radius: var(--yst-radius, 6px);
  background: #fff;
}
.yst-about__panel--grey { background: var(--yst-grey-light, #f6f7f4); }
.yst-about__panel--sage { background: var(--yst-sage, #eef2e9); }
.yst-about__panel > :last-child { margin-bottom: 0; }
.yst-about h2 { font-size: clamp(1.5rem, 2vw, 1.8rem); font-weight: 400; }
.yst-about__list {
  margin: 0 0 1.25rem;
  padding: 0;
  list-style: none;
}
.yst-about__list li {
  position: relative;
  padding-left: 1.15rem;
  margin-bottom: .65rem;
}
.yst-about__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .7em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--yst-olive, #85964e);
}
.yst-about__list li:last-child { margin-bottom: 0; }
.yst-about__contact {
  padding: clamp(1.5rem, 3vw, 2.5rem);
  margin-top: 2rem;
  border-left: 3px solid var(--yst-olive, #85964e);
  border-radius: var(--yst-radius, 6px);
  background: var(--yst-grey-light, #f6f7f4);
}
.yst-about__contact > p { max-width: 880px; }
.yst-about__contact > :last-child { margin-bottom: 0; }
.yst-about__contact .yst-button { margin-top: .25rem; }
@media (max-width: 767.98px) {
  .yst-about__grid { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
}
/* Your Space Your Time — alternating content/image layouts.
   Append to user.css, or use the complete updated stylesheet. */
.yst-content-page *, .yst-content-page *::before { box-sizing: border-box; }
.yst-content-page__heading { margin-bottom: 1.5rem; }
.yst-split {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(1.5rem, 3vw, 3rem);
  margin-bottom: 2rem;
  padding: clamp(1.4rem, 3vw, 2.5rem);
  border: 1px solid var(--yst-border, #dce2d6);
  border-radius: var(--yst-radius, 6px);
  background: #fff;
}
.yst-split--sage { background: var(--yst-sage, #eef2e9); }
.yst-split--image-left { grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); }
.yst-split__text { grid-column: 1; grid-row: 1; min-width: 0; }
.yst-split__media { grid-column: 2; grid-row: 1; min-width: 0; width: 100%; margin: 0; }
.yst-split--image-left .yst-split__text { grid-column: 2; }
.yst-split--image-left .yst-split__media { grid-column: 1; }
.yst-split__text > :last-child { margin-bottom: 0; }
.yst-content-page h2 {
  font-size: clamp(1.5rem, 2vw, 1.8rem);
  font-weight: 400;
}
.yst-split__text h2:not(:first-child) { margin-top: 1.75rem; }
.yst-content-page .yst-content-page__lead {
  color: var(--yst-green-dark, #364b35);
  font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.45;
}
.yst-split__placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 230px;
  aspect-ratio: 4 / 3;
  padding: 1.5rem;
  border: 1px dashed var(--yst-olive, #85964e);
  border-radius: var(--yst-radius, 6px);
  background: var(--yst-grey-light, #f6f7f4);
  color: var(--yst-grey, #525852);
  text-align: center;
}
.yst-split__placeholder p { margin: 0; font-size: .95rem; }
.yst-split__media > img,
.yst-split__media > a > img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--yst-radius, 6px);
}
.yst-content-page__list {
  margin: 0 0 1.25rem;
  padding-left: 1.25rem;
}
.yst-content-page__list li { margin-bottom: .4rem; }
.yst-content-page__list li::marker { color: var(--yst-green, #556b3e); }
.yst-content-page__contact {
  padding: clamp(1.5rem, 3vw, 2.5rem);
  border-radius: var(--yst-radius, 6px);
  background: var(--yst-sage, #eef2e9);
}
.yst-content-page__contact > p { max-width: 880px; }
.yst-content-page__contact > :last-child { margin-bottom: 0; }
.yst-content-page__contact .yst-button { margin-top: .4rem; }
@media (max-width: 767.98px) {
  .yst-split, .yst-split--image-left { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .yst-split .yst-split__text { grid-column: 1; grid-row: 1; }
  .yst-split .yst-split__media { grid-column: 1; grid-row: 2; }
  .yst-split__placeholder { min-height: 200px; }
}