/* Four Seasons identity. Load after the shared page and footer styles.
   Sky blue and leaf green are accents; darker shades keep small labels legible.
   The established Inter type scale and page layouts remain unchanged. */
:root {
  --brand-sky: #008fd5;
  --brand-leaf: #579f12;
  --brand-blue-ink: #006da6;
  --brand-blue-hover: #005884;
  --brand-green-ink: #3e7610;
  --brand-green-hover: #315f0c;
  --brand-sky-tint: #eaf6fc;
  --brand-leaf-tint: #f0f7e8;
  --blue: var(--brand-blue-ink);
  --pg-blue: var(--brand-blue-ink);
}

body.site-typography {
  --pg-accent: var(--brand-blue-ink);
  --pg-tint: var(--brand-sky-tint);
  --ab-blue: var(--brand-blue-ink);
}
/* The outlined SVG has a tight canvas; retain the earlier crop only for PNG fallbacks. */
body.site-typography img.company-logo[src$="four-seasons-logo.svg"],
body.site-typography.about-page .ab-location-card > img.company-logo[src$="four-seasons-logo.svg"] {
  aspect-ratio: 1465 / 390;
  object-fit: contain;
  object-position: center;
  height: auto;
}
body.site-typography.pg-theme-green,
body.site-typography.pg-theme-sand {
  --pg-accent: var(--brand-green-ink);
  --pg-tint: var(--brand-leaf-tint);
}

/* Primary actions share one blue; secondary light actions stay readable on photos. */
.site-typography .pill.blue-pill,
.site-typography .circle.blue,
.site-typography .home-office-card .pill,
.site-typography .pg-button:not(.pg-button--light):not(.pg-button--outline):not(.pg-button--dark),
.site-typography.about-page .ab-button:not(.ab-button-light),
.site-typography .unified-header.is-scrolled .header-cta {
  background: var(--brand-blue-ink);
  border-color: var(--brand-blue-ink);
  color: #fff;
}
.site-typography .pill.blue-pill:hover,
.site-typography .circle.blue:hover,
.site-typography .home-office-card .pill:hover,
.site-typography .pg-button:not(.pg-button--light):not(.pg-button--outline):not(.pg-button--dark):hover,
.site-typography.about-page .ab-button:not(.ab-button-light):hover,
.site-typography .unified-header.is-scrolled .header-cta:hover {
  background: var(--brand-blue-hover);
  border-color: var(--brand-blue-hover);
}
.site-typography .pg-button--light:hover,
.site-typography.about-page .ab-button-light:hover {
  background: var(--brand-sky-tint);
  border-color: var(--brand-sky-tint);
}

/* Keep both direct contact actions in the shared header. */
body.site-typography .unified-header { gap: 18px; }
.site-typography .unified-header .desktop-nav { gap: 20px; }
.site-typography .unified-header .header-phone {
  display: inline-flex;
  justify-content: center;
  height: 44px;
  padding-inline: 14px;
  box-sizing: border-box;
  border-radius: 999px;
  background: var(--brand-blue-ink);
  color: #fff;
}
.site-typography .unified-header .header-phone svg { width: 20px; height: 20px; }
.site-typography .unified-header .header-phone:hover { background: var(--brand-blue-hover); }
.site-typography .unified-header .header-whatsapp {
  display: inline-grid;
  place-items: center;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  border: 1px solid #ffffff38;
  border-radius: 50%;
  background: var(--brand-green-ink);
  color: #fff;
  text-decoration: none;
  transition: background .2s, transform .2s;
}
.site-typography .unified-header .header-whatsapp:hover {
  background: var(--brand-green-hover);
  transform: translateY(-2px);
}
.site-typography .unified-header .header-whatsapp .brand-icon {
  display: block;
  width: 23px;
  height: 23px;
  fill: currentColor;
  stroke: none;
}
.site-typography .unified-header .header-whatsapp use { fill: currentColor; stroke: none; }
.site-typography .unified-header .desktop-nav > a:after,
.site-typography .unified-header .desktop-nav .services-toggle:after {
  height: 2px;
  background: var(--brand-leaf);
}
.site-typography .unified-header .services-all-link { color: var(--brand-blue-ink); }
.site-typography .unified-header .services-menu-group { --service-icon: var(--brand-sky); }
.site-typography .unified-header :is(.services-group-1, .services-group-2) { --service-icon: var(--brand-leaf); }
.site-typography .unified-header .services-menu-group > a:is(:hover, :focus-visible, [aria-current="page"]) {
  background: var(--brand-sky-tint);
  color: var(--brand-blue-ink);
}
.site-typography .unified-header .mobile-nav > a:last-child { color: var(--brand-blue-ink); }
.site-typography .unified-header :is(a, button):focus-visible {
  outline-color: var(--brand-sky);
}

/* Accent details connect pool and garden sections without recolouring photography. */
.site-typography .eyebrow:before { background: var(--brand-leaf); }
.site-typography .eyebrow.light:before { background: #bce68d; }
.site-typography :is(.pg-blog-tag, .pg-faq-list summary svg, .pg-guide-number) {
  color: var(--pg-accent);
}
.site-typography.pg-theme-night .pg-guide :is(.pg-guide-number, .pg-eyebrow) { color: #b8e8ff; }
.site-typography .pg-contact-method > span {
  background: var(--brand-sky-tint);
  color: var(--brand-blue-ink);
}
.site-typography :is(.text-link, .pg-text-link, .home-text-link):hover,
.site-typography .pg-contact-method a:hover,
.site-typography .pg-article-toc a:hover {
  color: var(--brand-blue-ink);
  border-color: var(--brand-blue-ink);
}
.site-typography .intro-hero .pg-text-link:hover { color: #b8e8ff; border-color: #b8e8ff; }
.site-typography .pg-filter[aria-pressed="true"] {
  background: var(--brand-blue-ink);
  border-color: var(--brand-blue-ink);
}
.site-typography .pg-filter:hover { border-color: var(--brand-sky); }
.site-typography .pg-inline-notice { border-left-color: var(--brand-leaf); background: var(--brand-leaf-tint); }
.site-typography #faq .faq-item[open] { border-color: #94cce6; background: var(--brand-sky-tint); }
.site-typography #faq .faq-item summary > span { color: var(--brand-blue-ink); background: var(--brand-sky-tint); }
.site-typography #faq .faq-item[open] summary > span { color: #fff; background: var(--brand-blue-ink); }
.site-typography .pg-faq-group details[open] { border-color: #94cce6 !important; background: var(--brand-sky-tint); }
.site-typography .process-journey .process-card.is-active { border-color: var(--brand-sky); background: var(--brand-sky-tint); }
.site-typography .process-journey .process-card.is-active .process-card-icon { background: var(--brand-blue-ink); color: #fff; }
.site-typography .process-journey .process-card.is-complete .process-card-icon { background: var(--brand-leaf-tint); color: var(--brand-green-ink); }
.site-typography .process-route-progress { stroke: var(--brand-sky); }
.site-typography .process-time-track > span { background: var(--brand-leaf); }
.site-typography .site-footer :is(.sf-links > a, .sf-service-list > a, .sf-contact a):hover {
  color: var(--brand-blue-ink);
}
.site-typography .site-footer a:focus-visible { outline-color: var(--brand-sky); }

/* Keep the original 900px menu breakpoint aligned with site-consistency.js. */
@media (max-width: 1490px) {
  .site-typography .unified-header .header-phone { width: 44px; padding: 0; }
  .site-typography .unified-header .header-phone span { display: none; }
}
@media (min-width: 901px) and (max-width: 1150px) {
  body.site-typography .unified-header { --nav-logo-width: 155px; gap: 12px; }
  .site-typography .unified-header .desktop-nav { gap: 14px; }
  .site-typography .unified-header .header-cta { padding-inline: 15px; gap: 10px; }
  .site-typography .unified-header .header-whatsapp { flex-basis: 38px; width: 38px; height: 38px; }
}
@media (min-width: 901px) and (max-width: 990px) {
  body.site-typography .unified-header { --nav-logo-width: 135px; gap: 8px; }
  .site-typography .unified-header .desktop-nav { gap: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  .site-typography .unified-header .header-whatsapp { transition: none; }
}

/* Keep navigation readable over every real project photograph. */
.site-typography .unified-header:not(.is-scrolled) .desktop-nav>a,
.site-typography .unified-header:not(.is-scrolled) .desktop-nav>.nav-services>.services-toggle,
.site-typography .unified-header:not(.is-scrolled) .header-phone,
.site-typography .unified-header:not(.is-scrolled) .menu-toggle{color:#fff}
.site-typography .unified-header:not(.is-scrolled) .brand{background:#fffffff2;border-radius:8px;padding:6px 9px;box-sizing:content-box}
.site-typography .featured-client-copy .pill{background:var(--brand-blue-ink);color:white}
.site-typography .featured-client-copy .pill:hover{background:var(--brand-blue-hover)}

/* A transparent reverse wordmark blends with photography; full colour returns on scroll. */
body.site-typography .unified-header:not(.is-scrolled) .brand{background:transparent;border-radius:0;padding:0;box-shadow:none;box-sizing:border-box}
body.site-typography .unified-header .brand .company-logo-on-photo{display:none;aspect-ratio:1465/390;object-fit:contain;height:auto}
body.site-typography .unified-header:not(.is-scrolled) .brand>.company-logo:not(.company-logo-on-photo){display:none}
body.site-typography .unified-header:not(.is-scrolled) .brand>.company-logo-on-photo{display:block}

.site-typography .unified-header .quote-label-short,
.site-typography .unified-header .mobile-nav > .mobile-chat-link { display: none; }

@media (max-width: 900px) {
  body.site-typography .unified-header {
    --icon-surface: rgb(10 39 54 / 62%);
    --header-ink: white;
    --quote-surface: white;
    --quote-ink: #103d58;
    --nav-logo-width: clamp(150px, 45vw, 198px);
    display: grid;
    grid-template-columns: minmax(0, 1fr) 44px 44px auto 44px;
    column-gap: clamp(2px, .7vw, 6px);
    padding: 6px max(clamp(10px, 3vw, 24px), env(safe-area-inset-right)) 6px max(clamp(10px, 3vw, 24px), env(safe-area-inset-left));
  }
  body.site-typography .unified-header:not(.is-scrolled) {
    background: linear-gradient(to bottom, rgb(5 30 45 / 42%), transparent);
  }
  body.site-typography .unified-header.is-scrolled {
    --icon-surface: #eaf4f8;
    --header-ink: #103d58;
    --quote-surface: var(--brand-blue-ink);
    --quote-ink: white;
  }
  body.site-typography .unified-header .brand {
    display: flex;
    align-items: center;
    justify-self: start;
    width: min(100%, var(--nav-logo-width));
    min-width: 0;
    min-height: 44px;
  }
  body.site-typography .unified-header :is(.header-phone, .header-whatsapp, .header-cta, .menu-toggle) {
    position: relative;
    isolation: isolate;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 44px;
    min-height: 44px;
    margin: 0;
    border: 0;
    background: transparent;
    transform: none;
  }
  body.site-typography .unified-header :is(.header-phone, .header-whatsapp, .menu-toggle) {
    width: 44px;
    padding: 0;
    color: var(--header-ink);
  }
  /* The painted icon is smaller than its touch target. */
  .unified-header :is(.header-phone, .header-whatsapp, .menu-toggle, .header-cta)::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 6px;
    border-radius: 99px;
    background: var(--icon-surface);
  }
  body.site-typography .unified-header .header-whatsapp { color: white; }
  .unified-header .header-whatsapp::before { background: var(--brand-green-ink); }
  body.site-typography .unified-header .header-phone svg { width: 17px; height: 17px; }
  body.site-typography .unified-header .header-whatsapp .brand-icon { width: 19px; height: 19px; }
  body.site-typography .unified-header .menu-toggle svg { width: 19px; height: 19px; }
  body.site-typography .unified-header .header-cta {
    gap: 0;
    padding: 0 13px;
    font-size: .875rem;
    color: var(--quote-ink);
  }
  .unified-header .header-cta::before { inset: 5px 0; background: var(--quote-surface); }
  body.site-typography .unified-header .header-cta svg { display: none; }
  .site-typography .unified-header :is(.header-phone,.header-cta,.header-whatsapp,.menu-toggle):active::before { filter: brightness(.92); }
}
@media (max-width: 600px) {
  .site-typography .unified-header .quote-label-full { display: none; }
  .site-typography .unified-header .quote-label-short { display: inline; }
}
@media (max-width: 405px) {
  body.site-typography .unified-header { grid-template-columns: minmax(0, 1fr) 44px auto 44px; }
  body.site-typography .unified-header .header-whatsapp { display: none; }
  .site-typography .unified-header .mobile-nav > .mobile-chat-link { display: flex; }
  .site-typography .unified-header .mobile-chat-link .brand-icon { fill: var(--brand-green-ink); stroke: none; }
}
@media (max-width: 350px) {
  body.site-typography .unified-header {
    column-gap: 0;
    padding-inline: max(6px, env(safe-area-inset-left)) max(6px, env(safe-area-inset-right));
  }
  body.site-typography .unified-header .header-cta { padding-inline: 8px; }
}

/* Keep the business wordmark and the website name together in the home link. */
body.site-typography .unified-header .brand {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}
.unified-header .site-brand-label {
  margin-top: 1px;
  color: #fff;
  font: 550 11px/1.15 var(--site-font);
  white-space: nowrap;
  text-shadow: 0 1px 3px #082838;
}
.unified-header.is-scrolled .site-brand-label { color: #174762; text-shadow: none; }
@media (max-width: 900px) {
  body.site-typography .unified-header { padding-block: 2px; grid-template-rows: minmax(0, 1fr); }
}