/* site-chrome.css
   Cookie consent banner styling, lifted unchanged from style.css so the
   consent banner keeps its appearance on pages that do not load style.css.
   Added 21 September 2026 during the homepage and email offer integration.
   Source rules: every .cookie-banner rule in style.css, in original order. */

/* Variables these rules depend on, copied from the :root block in style.css
   so the banner renders identically on pages that do not load style.css. */
.cookie-banner, .cookie-banner * {
  --L-bg: #f4f3ef;
  --L-di: rgba(17,17,16,0.08);
  --L-mu: #413f3c;
  --L-soft: #6f6b63;
  --L-text: #111110;
  --T: .4s cubic-bezier(0.25,1,0.5,1);
  --font-body: 'Work Sans','WorkSans-fallback',sans-serif;
  --pad-x-desk: 48px;
  --pad-x-tab: 24px;
  --teal: #009d8d;
  --tx: #e8e7e2;
  --mu: #b7b3ac;
  --bo: rgba(232,231,226,0.15);
}

.cookie-banner {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 18px var(--pad-x-desk);
  background: #0d0d0c;
  border-top: 1px solid var(--bo);
  color: var(--mu);
  font-family: var(--font-body);
  font-size: 13px;
  line-height: 1.5;
  transform: translateY(110%);
  transition: transform .4s ease,background var(--T),border-color var(--T),color var(--T);
}
.cookie-banner.is-visible {
  transform: translateY(0);
}
[data-inv="1"] .cookie-banner {
  background: var(--L-bg);
  border-top-color: var(--L-di);
  color: var(--tx);
}
.cookie-banner__text {
  max-width: 640px;
}
.cookie-banner__text a {
  color: var(--teal);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.cookie-banner__actions {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
}
.cookie-banner__btn {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  padding: 10px 18px;
  border-radius: 999px;
  border: 1px solid rgba(232,231,226,0.3);
  background: transparent;
  color: inherit;
  cursor: pointer;
  transition: background .2s,border-color .2s,color .2s;
}
[data-inv="1"] .cookie-banner__btn {
  border-color: var(--L-di);
}
.cookie-banner__btn:hover {
  border-color: var(--teal);
  color: var(--teal);
}
.cookie-banner__btn--accept {
  background: var(--teal);
  border-color: var(--teal);
  color: #0d0d0c;
}
[data-inv="1"] .cookie-banner__btn--accept {
  color: #fff;
}
.cookie-banner__btn--accept:hover {
  opacity: .88;
  color: #0d0d0c;
}
[data-inv="1"] .cookie-banner__btn--accept:hover {
  color: #fff;
}
@media (max-width:768px){
  .cookie-banner {
    flex-direction: column;
    align-items: flex-start;
    padding: 18px var(--pad-x-tab);
  }
  .cookie-banner__actions {
    width: 100%;
  }
  .cookie-banner__btn {
    flex: 1;
  }}
[data-inv="1"] .cookie-banner {
  background: var(--L-bg);
  border-color: var(--L-di);
}
[data-inv="1"] .cookie-banner__text {
  color: var(--L-mu);
}
[data-inv="1"] .cookie-banner__text a {
  color: #00756a;
}
[data-inv="1"] .cookie-banner__btn {
  color: var(--L-text);
  border-color: var(--L-soft);
}
[data-inv="1"] .cookie-banner__btn--accept {
  background: #00756a;
  border-color: #00756a;
  color: #fff;
}
@media (min-width:1440px){
  .cookie-banner {
    font-size: 14px;
  }}
