/* R2 Gold: a brighter heritage-gold layer over the Still Water system.
   Client copy and the underlying R2 layout remain unchanged. */

:root {
  --gold: #C1A948;
  --gold-soft: #DCCB93;
  --gold-ink: #78613E;
  --gold-line: rgba(193, 169, 72, .72);
  --gold-wash: rgba(193, 169, 72, .075);

  /* Homepage tokens. */
  --brass: var(--gold);
  --hair: var(--gold-line);

  /* Interior-page tokens. */
  --bli-secondary-soft: var(--gold-soft);
  --bli-secondary: var(--gold);
  --bli-secondary-ink: var(--gold-ink);
  --bli-brass: var(--gold);
  --bli-gold-line: var(--gold-line);
  --bli-gold-wash: var(--gold-wash);
}

/* Homepage: carry the existing sunburst into R2 without restoring the old header. */
.nav {
  border-bottom-color: rgba(193, 169, 72, .55);
}

.nav.is-scrolled {
  border-bottom-color: var(--gold-line);
}

.nav__mark {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.nav__mark::before,
.foot__mark::before {
  content: "";
  display: block;
  flex: 0 0 auto;
  background: var(--gold);
  -webkit-mask: url("r2-assets/misc/bl-logo.png") center / contain no-repeat;
  mask: url("r2-assets/misc/bl-logo.png") center / contain no-repeat;
}

.nav__mark {
  font-size: clamp(20px, 1.9vw, 26px);
}

.nav__mark::before {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: #fff url("r2-assets/misc/bl-logo.png") center / 92% no-repeat;
  -webkit-mask: none;
  mask: none;
  box-shadow: 0 0 0 1px rgba(193, 169, 72, .7), 0 2px 10px rgba(0, 0, 0, .25);
}

.nav__cta {
  border-color: var(--gold);
}

.nav__cta:hover,
.nav.is-scrolled .nav__cta:hover {
  color: #223A4A;
  background: var(--gold);
  border-color: var(--gold);
}

/* Navigation controls match the existing links on each page layout. */
.bli-nav .bli-menu-button { color:var(--bli-ink);font-size:13px;font-weight:400;letter-spacing:.01em;text-transform:none; }
.bli-nav .bli-menu-button::after { position:static;left:auto;right:auto;bottom:auto;background:transparent;transform:translateY(-.15rem) rotate(45deg); }
.nav .bli-hasmenu { position:relative; }
.nav .bli-menu-button { color: inherit; font-size: inherit; letter-spacing: inherit; }
.nav .bli-menu-button { appearance:none;border:0;background:transparent;padding:0 0 3px;font:inherit;cursor:pointer; }
.nav .bli-menu-button::after { content:"";display:inline-block;width:.35rem;height:.35rem;margin-left:.4rem;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translateY(-.15rem) rotate(45deg); }
.nav .bli-menu { position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%) translateY(6px);min-width:250px;padding:.6rem;background:#fff;border:1px solid var(--gold-line);box-shadow:0 20px 50px -24px rgba(34,58,74,.4);opacity:0;visibility:hidden;transition:opacity .2s ease,transform .2s ease;color:#223A4A;font-family:var(--bli-font-sans, "DM Sans", Arial, sans-serif); }
.nav .bli-menu a { display:block;padding:.65rem .8rem;color:#223A4A;font-size:12px;line-height:1.35;text-decoration:none; }
.nav .bli-menu-button[aria-expanded="true"]+.bli-menu { opacity:1;visibility:visible;transform:translateX(-50%) translateY(0); }
.nav .bli-burger { color: inherit; }
.nav .bli-burger span { background: currentColor; }
.nav .bli-burger { display:inline-flex;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:.6rem;min-width:44px;min-height:44px;justify-content:center;align-items:center; }
.nav .bli-burger span { width:24px;height:2px; }
.nav + .bli-mobilenav { position:fixed;inset:0;z-index:70;background:#F7F4EC;transform:translateX(100%);transition:transform .35s ease;display:flex;flex-direction:column;padding:5rem 2rem 2rem;gap:.15rem;overflow:auto;font-family:var(--bli-font-sans, "DM Sans", Arial, sans-serif); }
.nav + .bli-mobilenav.is-open { transform:none; }
.nav + .bli-mobilenav a { font-family:var(--bli-font-display, "Lora", Georgia, serif);font-size:clamp(1.45rem,7vw,2rem);color:#223A4A;padding:.55rem 0;border-bottom:1px solid rgba(193,169,72,.35);text-decoration:none; }
.nav + .bli-mobilenav .bli-close { position:absolute;top:1.2rem;right:1.4rem;font-size:2rem;background:none;border:0;color:#223A4A;cursor:pointer;min-width:44px;min-height:44px; }
.nav + .bli-mobilenav .bli-mobile-group { margin:.7rem 0 .15rem;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:#526876; }
.nav + .bli-mobilenav .bli-mobile-sub { padding-left:1rem;font-size:1.05rem; }
@media (max-width:1179px) {
  .nav > nav, .nav__cta { display:none; }
  .nav .bli-burger { display:inline-flex; }
}
@media (min-width:1180px) {
  .nav .bli-burger { display:none; }
}

.progress {
  background: rgba(193, 169, 72, .28);
}

.rooms__head,
.services {
  border-color: var(--gold-line);
}

.services {
  border-top: 1px solid var(--gold-line);
}

.svc {
  border-color: rgba(193, 169, 72, .48);
}

.svc:last-of-type {
  border-bottom-color: var(--gold-line);
}

.svc__title {
  color: var(--gold-ink);
  transition: color .35s ease;
}

.svc__btn:hover .svc__title,
.svc__btn:focus-visible .svc__title {
  color: var(--water);
}

.svc__panel > div {
  padding-left: 18px;
  border-left: 1px solid transparent;
  transition: border-color .45s ease;
}

.svc__btn[aria-expanded="true"] + .svc__panel > div {
  border-left-color: var(--gold-line);
}

.svc__price {
  padding-left: 0;
  border-left: 0;
}

.voices__stage {
  padding-block: 18px;
  border-block: 1px solid var(--gold-line);
}

.voice blockquote::before {
  content: "\201C";
  display: block;
  height: 28px;
  margin-bottom: 10px;
  color: var(--gold);
  font-size: 58px;
  line-height: .8;
}

.dot {
  border-color: var(--gold-ink);
}

.dot[aria-selected="true"] {
  background: var(--gold);
  border-color: var(--gold);
}

.btn {
  border: 1px solid var(--gold);
}

.btn:hover {
  color: #223A4A;
  background: var(--gold);
}

.foot {
  background:
    linear-gradient(var(--gold-wash), var(--gold-wash)),
    var(--mist);
  border-top-color: var(--gold-line);
}

.foot__base {
  border-top-color: var(--gold-line);
}

.foot__mark::before {
  width: 72px;
  height: 72px;
  margin-bottom: 18px;
}

.foot__col a:hover,
.foot__col a:focus-visible {
  border-bottom-color: var(--gold);
}

/* Interior pages: one shared accent system across every copied route. */
.bli-header,
.bli-pagehero,
.bli-cta,
.bli-footer {
  border-color: var(--bli-gold-line);
}

.bli-pagehero {
  border-bottom: 1px solid var(--bli-gold-line);
}

.bli-kicker,
.bli-rubric,
.bli-band .bli-kicker {
  color: var(--bli-secondary-ink);
}

.bli-pill--sea {
  border-color: var(--bli-brass);
}

.bli-pill--sea:hover,
.bli-pill--secondary:hover,
.bli-pill--ghost:hover,
.bli-pill--ghost-dark:hover {
  color: var(--bli-primary-dark);
  background: var(--bli-brass);
  border-color: var(--bli-brass);
}

.bli-pill--secondary,
.bli-pill--ghost,
.bli-pill--ghost-dark {
  border-color: var(--bli-brass);
}

.bli-glance,
.bli-svc,
.bli-faq-item,
.bli-quote,
.bli-footer__legal {
  border-color: var(--bli-gold-line);
}

.bli-quote {
  border-top: 1px solid var(--bli-gold-line);
  border-bottom: 1px solid var(--bli-gold-line);
}

.bli-svc h2,
.bli-svc h3,
.bli-uform button {
  color: var(--bli-secondary-ink);
}

.bli-footer {
  background:
    linear-gradient(var(--bli-gold-wash), var(--bli-gold-wash)),
    var(--bli-sand);
}

.bli-footer a:hover,
.bli-footer a:focus-visible {
  text-decoration-color: var(--bli-brass);
}

@media (max-width: 520px) {
  .nav__mark {
    gap: 8px;
  }

  .nav__mark {
    font-size: 19px;
  }

  .nav__mark::before {
    width: 46px;
    height: 46px;
  }

  .foot__mark::before {
    width: 60px;
    height: 60px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .svc__title,
  .svc__panel > div {
    transition: none;
  }
}

/* Larger header logo on interior pages (homepage uses .nav__mark above). The size stays constant on scroll.
   --bli-hdr-h is the fixed header's height; page content clears it so breadcrumbs are never covered. */
:root {
  --bli-hdr-logo: 100px;
  --bli-hdr-h: calc(var(--bli-hdr-logo) + 1.3rem + 1px);
}
@media (max-width: 640px) { :root { --bli-hdr-h: calc(var(--bli-hdr-logo) + 1rem + 1px); } }
@media (max-width: 520px) { :root { --bli-hdr-logo: 68px; } }
.bli-logo,
.bli-header.is-scrolled .bli-logo { height: var(--bli-hdr-logo); }
#main > .bli-wrap:first-child[style*="padding-top:7rem"] { padding-top: calc(var(--bli-hdr-h) + 1.5rem) !important; }

/* Keep the Explore/Services chevrons on the same line as their labels. */
.nav .bli-menu-button { white-space: nowrap; }
@media (min-width: 1180px) and (max-width: 1279px) {
  .nav__mark { font-size: 20px; }
  .nav__mark::before { width: 54px; height: 54px; }
}

/* Keep the white wordmark and nav readable while the hero brightens ("let the light in"),
   until the header switches to its white state on scroll. */
.nav::before {
  content: "";
  position: absolute;
  inset: 0 0 -28px 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(26, 42, 56, .62) 0%, rgba(26, 42, 56, .34) 60%, rgba(26, 42, 56, 0) 100%);
  transition: opacity .45s ease;
}
.nav.is-scrolled::before { opacity: 0; }

/* Header logo: her official SVG artwork (same art, slightly heavier lines so the rays hold up at small sizes).
   Over the dark hero it uses a reversed copy (black lettering and monogram in white, gold unchanged);
   when the header turns white, it crossfades to her original colors. */
.nav__mark {
  --mk: 96px;
  position: relative;
  padding-left: calc(var(--mk) + 14px);
  min-height: var(--mk);
  display: inline-flex;
  align-items: center;
}
.nav__mark::before,
.nav__mark::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  width: var(--mk);
  height: var(--mk);
  margin-top: calc(var(--mk) / -2);
  background-color: transparent;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  -webkit-mask: none;
  mask: none;
  border-radius: 0;
  box-shadow: none;
  transition: opacity .45s ease;
}
.nav__mark::before {
  background-image: url("bl-logo-header.svg");
  opacity: 0;
}
.nav__mark::after {
  background-image: url("bl-logo-header-light.svg");
  opacity: 1;
  filter: drop-shadow(0 1px 5px rgba(0, 0, 0, .4));
}
.nav.is-scrolled .nav__mark::before { opacity: 1; }
.nav.is-scrolled .nav__mark::after { opacity: 0; }
@media (min-width: 1180px) and (max-width: 1279px) { .nav__mark { --mk: 78px; } }
@media (max-width: 520px) { .nav__mark { --mk: 62px; } }

/* Footer logo matches the header logo (same artwork and size), on interior pages and the homepage. */
.bli-footer .bli-logo { height: var(--bli-hdr-logo); }
.foot__mark::before {
  width: var(--bli-hdr-logo);
  height: var(--bli-hdr-logo);
  background: url("bl-logo-header.svg") center / contain no-repeat;
  -webkit-mask: none;
  mask: none;
}