/* One clipped letterhead surface, with menus free to open beyond it. */
.site-header,
html[data-theme=dark] .site-header {
  background: transparent;
}
.header-inner {
  --header-wine-top: 344px;
  --header-wine-bottom: 294px;
  --header-white-top: 322px;
  --header-white-bottom: 272px;
  background: transparent;
  border-radius: inherit;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.header-inner::before,
.header-inner::after {
  content: none;
  display: none;
}
.header-backdrop {
  position: absolute;
  inset: 0;
  z-index: -1;
  isolation: isolate;
  overflow: hidden;
  pointer-events: none;
  border-radius: inherit;
  /* Keep the blended video inside the rounded surface in composited browsers. */
  -webkit-mask-image: linear-gradient(#000, #000);
  mask-image: linear-gradient(#000, #000);
  background: radial-gradient(ellipse at 80% 0%, #35445555, transparent 65%),
    linear-gradient(115deg, #20242c, #111b25);
}
.header-backdrop::before,
.header-backdrop::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: 0;
  transition: clip-path .46s var(--ease);
}
.header-backdrop::before {
  z-index: 0;
  background: linear-gradient(130deg, #7f2944, #c92b44);
  clip-path: polygon(0 0, var(--header-wine-top) 0,
    var(--header-wine-bottom) 100%, 0 100%);
}
.header-backdrop::after {
  z-index: 1;
  background: #fff;
  clip-path: polygon(0 0, var(--header-white-top) 0,
    var(--header-white-bottom) 100%, 0 100%);
}
.header-backdrop .header-smoke {
  z-index: 2;
  border-radius: 0;
  clip-path: polygon(var(--header-wine-top) 0, 100% 0,
    100% 100%, var(--header-wine-bottom) 100%);
}
.header-backdrop .header-smoke .smoke-video {
  /* Keep the lower moving wisps visible in both letterhead heights. */
  object-position: 50% 85%;
  filter: blur(2.5px);
  transform: scale(1.04);
}

/* A quiet promise in the charcoal area, clear of identity and navigation. */
.header-motto {
  display: none;
  position: absolute;
  margin: 0;
  pointer-events: none;
  color: #f0e8ec;
  font-size: 14px;
  font-weight: 450;
  letter-spacing: .015em;
  line-height: 1.45;
  text-align: right;
  text-wrap: balance;
  transition: opacity .28s var(--ease);
}
.header-motto em {
  display: block;
  color: #f0b3c7;
  font-style: normal;
  font-weight: 650;
}
.menu-label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}
.site-header .header-tools .menu-button,
html[data-theme=dark] .site-header .header-tools .menu-button {
  width: 68px;
  min-width: 68px;
  height: 44px;
  padding: 0 8px;
  grid-template-columns: 16px auto;
  align-items: center;
  justify-content: center;
  column-gap: 5px;
  border-radius: 16px;
  border-color: #ffffff65;
  background: #ffffff12;
}
.site-header .menu-button .icon {
  width: 16px;
  height: 16px;
}
.site-header .menu-button[aria-expanded=true],
html[data-theme=dark] .site-header .menu-button[aria-expanded=true] {
  background: #7f2944;
  border-color: #e3a1bb;
  box-shadow: inset 0 1px 0 #ffffff25;
}

@media (min-width:851px) {
  html:not(.header-compact) .header-motto {
    display: block;
    top: auto;
    bottom: 10px;
    right: 99px;
    width: auto;
    max-width: calc(100% - var(--header-wine-top) - 130px);
    font-size: 12px;
    line-height: 1.3;
    white-space: nowrap;
    text-wrap: nowrap;
  }
  html:not(.header-compact) .header-motto em { display: inline; }
}
@media (min-width:1101px) {
  html:not(.header-compact) .header-identity { padding-right: 258px; }
}
@media (min-width:851px) and (max-width:1200px) {
  .header-inner {
    --header-wine-top: 300px;
    --header-wine-bottom: 266px;
    --header-white-top: 282px;
    --header-white-bottom: 248px;
  }
  html:not(.header-compact) .header-motto { font-size: 11.5px; }
}
@media (min-width:851px) and (max-width:1100px) {
  html:not(.header-compact) .header-motto {
    right: 25px;
    bottom: 4px;
    font-size: 10.5px;
    line-height: 1.2;
  }
}
.header-compact .header-inner {
  --header-wine-top: 216px;
  --header-wine-bottom: 196px;
  --header-white-top: 198px;
  --header-white-bottom: 176px;
  border-radius: 24px;
}
.header-compact .header-motto { display: none; }
@media (max-width:1100px) {
  .header-compact .header-inner {
    grid-template-columns: 146px minmax(0,1fr) 292px;
  }
}
@media (max-width:850px) {
  html:not(.header-compact) { scroll-padding-top: 214px; }
  .header-space { height: 196px; }
  .header-inner {
    --header-wine-top: 224px;
    --header-wine-bottom: 191px;
    --header-white-top: 207px;
    --header-white-bottom: 174px;
    grid-template-columns: minmax(0,1fr) 124px;
    grid-template-rows: 70px;
  }
  html:not(.header-compact) .header-inner {
    --header-mobile-inset: 14px;
    grid-template-rows: 70px;
    padding: 8px var(--header-mobile-inset);
    min-height: 0;
    border-radius: inherit;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }
  html:not(.header-compact) .header-tools {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
    margin: 0;
  }
  html:not(.header-compact) .header-motto {
    display: block;
    position: absolute;
    top: auto;
    bottom: 10px;
    right: 148px;
    width: auto;
    max-width: calc(100% - var(--header-wine-top) - 162px);
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: #f7f8fa;
    font-size: 10.5px;
    line-height: 1.3;
    text-align: right;
    letter-spacing: .015em;
    white-space: nowrap;
    text-wrap: nowrap;
  }
  html:not(.header-compact) .header-motto em { display: inline; }
  .header-compact .header-motto { display: none; }
  .header-compact .header-inner {
    --header-wine-top: 199px;
    --header-wine-bottom: 181px;
    --header-white-top: 182px;
    --header-white-bottom: 163px;
    grid-template-columns: minmax(0,1fr) 292px;
  }
}
@media (max-width:600px) {
  html:not(.header-compact) { scroll-padding-top: 225px; }
  .header-space { height: 207px; }
  .header-inner {
    --header-wine-top: 216px;
    --header-wine-bottom: 191px;
    --header-white-top: 199px;
    --header-white-bottom: 174px;
  }
  html:not(.header-compact) .header-inner {
    grid-template-rows: 66px;
    padding-bottom: 0;
  }
  /* Plain type on the existing access surface, without a separate banner. */
  html:not(.header-compact) .header-motto {
    top: calc(100% + 5px);
    bottom: auto;
    left: 12px;
    right: 12px;
    max-width: none;
    color: #536075;
    line-height: 1.4;
    text-align: center;
  }
  html:not(.header-compact) .header-motto em { color: #7f2944; }
  html[data-theme=dark]:not(.header-compact) .header-motto { color: #dfe6f0; }
  html[data-theme=dark]:not(.header-compact) .header-motto em { color: #efb5c8; }
  html:not(.header-compact) .header-utilities {
    height: 121px;
    padding-top: 23px;
  }
  html:not(.header-compact) .site-header .site-nav {
    top: calc(100% + 129px);
    max-height: calc(100dvh - 225px);
  }
  .header-compact .header-inner {
    --header-wine-top: 135px;
    --header-wine-bottom: 117px;
    --header-white-top: 120px;
    --header-white-bottom: 103px;
    grid-template-columns: minmax(0,1fr) 218px;
    grid-template-rows: 44px;
    min-height: 64px;
  }
  .header-compact .site-header .header-tools .icon-button,
  .header-compact .quick-link {
    width: 44px;
    height: 44px;
    min-height: 44px;
  }
  .header-compact .site-header .header-tools .menu-button {
    width: 68px;
    min-width: 68px;
    height: 44px;
  }
}
@media (max-width:375px) {
  .header-compact .header-inner {
    grid-template-columns: minmax(0,1fr) 168px;
  }
  .header-compact .quick-phone { display: none; }
}
@media (max-width:360px) {
  html:not(.header-compact) .header-inner {
    --header-mobile-inset: 10px;
    --full-header-logo: clamp(110px, calc(100vw - 210px), 143px);
    --header-wine-top: calc(var(--full-header-logo) + 44px);
    --header-wine-bottom: calc(var(--full-header-logo) + 26px);
    --header-white-top: calc(var(--full-header-logo) + 30px);
    --header-white-bottom: calc(var(--full-header-logo) + 12px);
  }
  html:not(.header-compact) .brand-art {
    width: var(--full-header-logo);
    height: calc(var(--full-header-logo) * .375);
  }
  html:not(.header-compact) .brand .brand-art img {
    width: var(--full-header-logo);
  }
}
@media (max-width:340px) {
  .header-compact .header-inner {
    --header-wine-top: 123px;
    --header-wine-bottom: 105px;
    --header-white-top: 108px;
    --header-white-bottom: 91px;
  }
  .header-compact .brand-art { width: 78px; height: 30px; }
  .header-compact .brand .brand-art img { width: 78px; }
}
@media (prefers-reduced-motion:reduce) {
  .header-backdrop::before,
  .header-backdrop::after,
  .header-motto { transition: none; }
}

/* Merge the logo paper with its letterhead while the diagonal contracts. */
.brand .brand-art img{mix-blend-mode:multiply}

/* Slim expanded mobile access links; keep their established widths and labels. */
@media (max-width:850px) {
  html:not(.header-compact) .site-header .header-utilities :is(.header-auto,.header-portal) {
    min-height: 36px;
    height: 36px;
    padding-block: 6px;
  }
  html:not(.header-compact) .site-header .header-utilities {
    grid-template-rows: 36px 36px;
    height: 95px;
  }
  html:root:not(.header-compact) { scroll-padding-top: 203px; }
  /* Keep this spacer constant when the fixed header compacts. */
  html .header-space { height: 185px; }
  html:root:not(.header-compact) .site-header .site-nav {
    top: calc(100% + 103px);
    max-height: calc(100dvh - 203px);
  }
}
@media (max-width:600px) {
  html:not(.header-compact) .site-header .header-utilities {
    height: 105px;
    padding-top: 22px;
    padding-bottom: 6px;
  }
  html:root:not(.header-compact) { scroll-padding-top: 209px; }
  html .header-space { height: 191px; }
  html:root:not(.header-compact) .site-header .site-nav {
    top: calc(100% + 113px);
    max-height: calc(100dvh - 209px);
  }
}

/* Align the two utility rows on matching axes in the expanded mobile header. */
@media (max-width:850px) {
  html:not(.header-compact) .site-header .header-utilities {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  html:not(.header-compact) .site-header .header-utilities .header-contact {
    justify-content: center;
  }
  html:not(.header-compact) .site-header .header-utilities .header-emergency {
    justify-self: center;
    justify-content: center;
  }
  html:not(.header-compact) .site-header .header-utilities :is(.header-auto,.header-portal) {
    width: 100%;
    max-width: 174px;
    min-height: 36px;
    height: 36px;
    justify-self: center;
    justify-content: center;
  }
}