/* Quietcation brand palette — shared across every live page in version 700. */
:root {
  --qc-paper: #F1EEE7;
  --qc-limestone: #DDD5C9;
  --qc-forest: #15231C;
  --qc-pine: #10231B;
  --qc-lichen: #929987;
  --qc-hairline: rgba(21, 35, 28, .14);
  --qc-muted-on-dark: rgba(241, 238, 231, .72);
  /* One restrained material texture, matching the start overlay: same seed,
     scale and noise character everywhere; only the density changes for dark
     surfaces so the texture remains quiet on both paper and forest green. */
  --qc-grain-light: url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='qc-light-grain' x='-20%25' y='-20%25' width='140%25' height='140%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4' seed='8' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23qc-light-grain)' opacity='.24'/%3E%3C/svg%3E");
  --qc-grain-dark: url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='qc-dark-grain' x='-20%25' y='-20%25' width='140%25' height='140%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4' seed='8' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23qc-dark-grain)' opacity='.18'/%3E%3C/svg%3E");
  --paper: var(--qc-limestone);
  --cream: var(--qc-paper);
  --bg: var(--qc-limestone);
  --ink: var(--qc-forest);
  --green: var(--qc-forest);
  --topbar-bg: var(--qc-limestone);
  --pine-green-deep: var(--qc-forest);
  --ink-soft: rgba(21, 35, 28, .72);
  --ink-muted: rgba(21, 35, 28, .56);
  --muted: rgba(21, 35, 28, .56);
  --line: var(--qc-hairline);
  accent-color: var(--qc-forest);
  color-scheme: light;
}

/* The place articles use a lighter paper than the limestone site surfaces. */
html.qc-place-page { --paper: #f4f1ea; }

html { background-color: var(--qc-limestone) !important; }
body { color: var(--qc-forest); }
body::before { background-color: var(--qc-limestone) !important; }

::selection {
  background: rgba(196, 177, 148, .52) !important;
  color: var(--qc-forest);
}
::-moz-selection {
  background: rgba(196, 177, 148, .52) !important;
  color: var(--qc-forest);
}
.footer ::selection,
.footer ::-moz-selection,
.menu-overlay ::selection,
.menu-overlay ::-moz-selection,
.faq-hero ::selection,
.faq-hero ::-moz-selection,
.hero ::selection,
.hero ::-moz-selection {
  background: rgba(211, 190, 157, .78) !important;
  color: var(--qc-pine);
}

html body :focus-visible {
  outline: 1px solid var(--qc-lichen) !important;
  outline-offset: 3px !important;
}

html body:not(.menu-open) .masthead,
html body:not(.menu-open) .topbar {
  background-color: #ddd5c9 !important;
  color: var(--qc-forest) !important;
  border-bottom-color: transparent !important;
}
html body:not(.menu-open) .masthead :is(a, button),
html body:not(.menu-open) .topbar :is(a, button) {
  color: var(--qc-forest) !important;
}
html body.menu-open .masthead,
html body.menu-open .masthead :is(a, button) {
  color: var(--qc-paper) !important;
}
html body .menu-overlay {
  background-color: var(--qc-forest) !important;
  color: var(--qc-paper) !important;
}
html body .menu-overlay a { color: var(--qc-paper) !important; }

/* Editorial material system: grain sits inside the paper surfaces, never over
   photography, maps, controls or form fields. */
@media (min-width: 761px) {
  html body:not(.quietcation-home) main:not(.hero) {
    background-image: var(--qc-grain-light);
    background-size: 180px 180px;
    background-blend-mode: multiply;
  }

  html body .qc-place,
  html body main.qc-place,
  html body .about2-content,
  html body .faq-editorial,
  html body .contact2-content {
    background-image: var(--qc-grain-light);
    background-size: 180px 180px;
    background-blend-mode: multiply;
  }
}

/* Shared quiet interaction: colour changes should arrive gradually across the site. */
html body :where(button, input[type="submit"], .btn, .facts-booking__button, .location-note__route, .contact-04__mail, .context-teaser__link, .places2-see-more, .footer-newsletter-submit, .qc-newsletter-submit) {
  transition-property: background-color, border-color, color, opacity, box-shadow !important;
  transition-duration: 760ms !important;
  transition-timing-function: cubic-bezier(.22, .7, .22, 1) !important;
}

@media (prefers-reduced-motion: reduce) {
  html body :where(button, input[type="submit"], .btn, .facts-booking__button, .location-note__route, .contact-04__mail, .context-teaser__link, .places2-see-more, .footer-newsletter-submit, .qc-newsletter-submit) {
    transition-duration: 1ms !important;
  }
}

html body .modal-overlay .modal-card,
html body .launch-modal .launch-modal__card {
  background-color: var(--qc-paper) !important;
  color: var(--qc-forest) !important;
  border-color: rgba(21, 35, 28, .14) !important;
}
html body .modal-overlay .modal-close,
html body .launch-modal .launch-modal__close,
html body .modal-overlay .modal-title,
html body .launch-modal .launch-modal__title {
  color: var(--qc-forest) !important;
}
html body .modal-overlay .modal-card .modal-close:is(:hover, :focus, :focus-visible, :active),
html body .launch-modal .launch-modal__card .launch-modal__close:is(:hover, :focus, :focus-visible, :active) {
  outline: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}
html body .modal-overlay :is(.modal-mail, .launch-modal__mail),
html body .launch-modal :is(.modal-mail, .launch-modal__mail) {
  background: var(--qc-forest) !important;
  border-color: var(--qc-forest) !important;
  color: var(--qc-paper) !important;
}

/* Keep email-field edges steady on focus; the resting field treatment remains visible. */
html body.index-page--listing4 .newsletter-input:focus,
html body.index-page--listing4 .newsletter-input:focus-visible {
  border-color: rgba(34, 32, 30, .12) !important;
  outline: none !important;
  box-shadow: none !important;
}
html body #themesPanel .qc-newsletter-field:focus-within,
html body #directory-launch-modal .qc-newsletter-field:focus-within {
  border-bottom-color: rgba(21, 35, 28, .46) !important;
}
html body input[type="email"]:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

html body .contact-04:not(.about-context-card):not(.context-about-card) {
  background: var(--qc-paper) !important;
  color: var(--qc-forest) !important;
}
html body .contact-04:not(.about-context-card):not(.context-about-card)::before,
html body .contact-04:not(.about-context-card):not(.context-about-card)::after {
  background: rgba(146, 153, 135, .16) !important;
}
html body .contact-04:not(.about-context-card):not(.context-about-card) :is(.contact-04__kicker, h2, .contact-04__copy, .contact-04__mail, .contact-04__links a) {
  color: var(--qc-forest) !important;
}
html body .contact-04#contact {
  background: var(--qc-paper) !important;
  background-image: none !important;
  color: var(--qc-forest) !important;
}
html body.about2-page .contact-04#contact {
  background: var(--qc-paper) !important;
  background-image: none !important;
  color: var(--qc-forest) !important;
}
html body .contact-04#contact::before,
html body .contact-04#contact::after {
  background: rgba(146, 153, 135, .16) !important;
}
html body.about2-page .contact-04#contact::before,
html body.about2-page .contact-04#contact::after {
  background: rgba(146, 153, 135, .16) !important;
}
html body .contact-04#contact :is(.contact-04__kicker, h2, .contact-04__copy, .contact-04__mail, .contact-04__links a) {
  color: var(--qc-forest) !important;
}
html body .contact-04.about-context-card,
html body .contact-04.context-about-card {
  background: linear-gradient(145deg, #10231B 0%, #15231C 56%, #10231B 100%) !important;
  color: var(--qc-paper) !important;
}
html body .contact-04.about-context-card::before,
html body .contact-04.context-about-card::before {
  background: radial-gradient(circle at 14% 18%, rgba(146, 153, 135, .16), transparent 34%), radial-gradient(circle at 88% 82%, rgba(146, 153, 135, .1), transparent 31%) !important;
}
html body .contact-04.about-context-card :is(.contact-04__kicker, h2, .contact-04__copy, .contact-04__mail),
html body .contact-04.context-about-card :is(.contact-04__kicker, h2, .contact-04__copy, .contact-04__mail) {
  color: var(--qc-paper) !important;
}
html body .contact-04.about-context-card .contact-04__kicker,
html body .contact-04.context-about-card .contact-04__kicker {
  color: #B5BAAB !important;
}

html body .facts-booking__button--primary {
  background: var(--qc-forest) !important;
  border-color: var(--qc-forest) !important;
  color: var(--qc-paper) !important;
}
html body .facts-booking__button--primary:hover,
html body .facts-booking__button--primary:focus-visible {
  background: var(--qc-pine) !important;
  border-color: var(--qc-pine) !important;
  color: var(--qc-paper) !important;
}
html body .stay-intro .facts-booking__button.facts-booking__button--primary,
html body .stay-intro .facts-booking__button.facts-booking__button--primary:hover,
html body .stay-intro .facts-booking__button.facts-booking__button--primary:focus-visible {
  background: var(--qc-forest) !important;
  border-color: var(--qc-forest) !important;
  color: var(--qc-paper) !important;
}
html body main.qc-place {
  background-color: var(--qc-paper) !important;
}
html body .facts-booking__button--secondary {
  border-color: rgba(21, 35, 28, .28) !important;
  color: var(--qc-forest) !important;
}
html body .facts-booking__button--secondary:hover,
html body .facts-booking__button--secondary:focus-visible {
  background: rgba(146, 153, 135, .12) !important;
  border-color: rgba(21, 35, 28, .38) !important;
}
html body .location-note__actions .location-note__route {
  border-color: rgba(21, 35, 28, .3) !important;
  color: var(--qc-forest) !important;
}
html body .location-note__actions .location-note__route:hover,
html body .location-note__actions .location-note__route:focus-visible {
  background: rgba(146, 153, 135, .12) !important;
}

html body .qc-newsletter-form :is(input, button):focus-visible,
html body .footer-newsletter-form :is(input, button):focus-visible {
  outline-color: var(--qc-lichen) !important;
}

/* Closed navigation has no edge in either its initial or scrolled state. */
html body:not(.menu-open):not(.site-menu-open) > :is(.masthead, .topbar)[class] {
  border-bottom: 0 !important;
  box-shadow: none !important;
}

/* Beige headers stay flat on every page. */
html:not(.qc-place-page):not(.menu-surface-open) body:not(.quietcation-home):not(.editorial-reference-page):not(.menu-open):not(.site-menu-open):not(.menu-closing):not(.is-page-leaving) > :is(.masthead, .topbar)[class]:not(#places-masthead),
html.qc-place-page:not(.menu-surface-open) body:not(.menu-open):not(.site-menu-open):not(.menu-closing):not(.is-page-leaving) > .masthead.is-scrolled,
html:not(.menu-surface-open) body:is(.qc-light-surface-visible, .qc-desktop-list-visible):not(.menu-open):not(.site-menu-open):not(.menu-closing):not(.is-page-leaving) > #places-masthead,
html[data-qc-mobile-page]:not(.qc-place-page):not(.menu-surface-open) body.editorial-reference-page:not(.menu-open):not(.site-menu-open):not(.menu-closing):not(.is-page-leaving) > .masthead.qc-mobile-hero-past,
html:not(.menu-surface-open) body.quietcation-home:not(.menu-open):not(.site-menu-open):not(.menu-closing):not(.is-page-leaving) > #home-masthead.is-scrolled {
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  border-bottom: 0 !important;
}
@media (min-width: 761px) {
  html:not(.menu-surface-open) body.editorial-reference-page:not(.menu-open):not(.site-menu-open):not(.menu-closing):not(.is-page-leaving) > .masthead {
    background-image: none !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    border-bottom: 0 !important;
  }
}
html.qc-place-page body > .masthead:not(.is-scrolled),
html[data-qc-mobile-page="woodnest"] body > .masthead:not(.is-scrolled),
html[data-qc-mobile-page="manna-arcadia"] body > .masthead:not(.is-scrolled),
html[data-qc-mobile-page="st-moritz-in-summer"] body > .masthead:not(.is-scrolled),
html[data-qc-mobile-page="trakt-forest-hotel"] body > .masthead:not(.is-scrolled),
html body.quietcation-home > #home-masthead:not(.is-scrolled),
html body.is-page-leaving > :is(.masthead, .topbar),
html.menu-surface-open body > :is(.masthead, .topbar)[class],
html body:is(.menu-open, .site-menu-open, .menu-closing) > :is(.masthead, .topbar)[class],
html.menu-surface-open body.quietcation-home > #home-masthead,
html body.quietcation-home:is(.menu-open, .site-menu-open, .menu-closing) > #home-masthead {
  box-shadow: none !important;
}

/* One full-screen grain surface also runs behind the open-menu masthead. */
html body > #site-menu.menu-overlay {
  background-color: #15231c !important;
  background-image: var(--qc-grain-dark) !important;
  background-size: 512px 512px !important;
  background-repeat: repeat !important;
  background-blend-mode: soft-light !important;
}

/* Unified paper palette across every viewport and editorial page. */
html body:not(.menu-open) :is(.masthead, .topbar) {
  background-color: #d8cdc0 !important;
}

html body {
  background-color: #ddd5c9 !important;
}

/* Remove legacy page-wide and component-specific noise layers. The shared
   material surfaces below are the single source of truth for grain. */
html body::before {
  background-image: none !important;
}
html body .site-menu-overlay::after {
  background-image: var(--qc-grain-dark) !important;
  background-size: 512px 512px !important;
  opacity: .18 !important;
  animation: none !important;
}
html body :is(.modal-card, .launch-modal__card)::before {
  background-image: var(--qc-grain-light) !important;
  background-size: 512px 512px !important;
  opacity: .24 !important;
}
html body :is(.qc-actions-dock, .qc-actions-sheet)::before {
  background-image: var(--qc-grain-light) !important;
  background-size: 512px 512px !important;
  opacity: .24 !important;
}

html body:not(.quietcation-home) main:not(.hero):not(.qc-place),
html body .about2-content,
html body .faq-editorial,
html body .contact2-content {
  background-color: #ddd5c9 !important;
  background-image: var(--qc-grain-light) !important;
  background-size: 512px 512px !important;
  background-repeat: repeat !important;
  background-blend-mode: soft-light !important;
}

html.qc-place-page body main.qc-place {
  background-color: #f4f1ea !important;
  background-image: var(--qc-grain-light) !important;
  background-size: 512px 512px !important;
  background-repeat: repeat !important;
  background-blend-mode: soft-light !important;
}

/* Paper cards use the same texture too; photographic and interactive surfaces
   stay clean so the grain reads as a deliberate material, not an overlay. */
html body .contact-04#contact,
html body.about2-page .contact-04#contact,
html body .modal-overlay .modal-card,
html body .launch-modal .launch-modal__card {
  background-image: var(--qc-grain-light) !important;
  background-size: 512px 512px !important;
  background-repeat: repeat !important;
  background-blend-mode: soft-light !important;
}

html body .menu-overlay,
html body .contact-04.about-context-card,
html body .contact-04.context-about-card {
  background-image: var(--qc-grain-dark) !important;
  background-size: 512px 512px !important;
  background-repeat: repeat !important;
  background-blend-mode: soft-light !important;
}

/* MANNA desktop: retain paper grain without horizontally tiled seams that can
   read as vertical background lines on its large uninterrupted surfaces. */
@media (min-width: 901px) {
  html[data-qc-mobile-page="manna-arcadia"] body main.qc-place,
  html[data-qc-mobile-page="manna-arcadia"] body main.qc-place .quiet-story {
    background-color: #f4f1ea !important;
    background-image: var(--qc-grain-light) !important;
    background-size: 100vw 100vw !important;
    background-position: center top !important;
    background-repeat: repeat-y !important;
    background-attachment: fixed !important;
    background-blend-mode: soft-light !important;
  }
}