/* White Beard production identity. Loaded after page and responsive styles. */
:root {
  --wb-purple: #4f4dae;
  --wb-orange: #d9813a;
  --wb-green: #016338;
  --wb-magenta: #851057;
  --wb-yellow: #ffc901;
  --wb-blue: #4faee9;
  --color-paper: #f8f4ed;
  --color-cream: #f3eee5;
  --color-ink: #201b17;
  --color-clay: var(--wb-orange);
  --color-roast: var(--wb-purple);
  --color-muted: #655e58;
  --text-base: clamp(1rem, .95rem + .2vw, 1.125rem);
}
[hidden] { display: none !important; }
body { overflow-wrap: break-word; }
body[data-page] main :is(h1,h2,h3), .product-modal__title {
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1;
}
body[data-page] main :is(h1,h2,h3) em { font-weight: 600; }
body[data-page] main h1 { font-weight: 800; line-height: .91; letter-spacing: -.035em; }
.wb-container.home-hero__inner, .wb-container.contact-hero__grid {
  width: min(calc(100% - var(--container-padding) * 2), var(--container-width));
}
.home-hero__title, .coffee-hero__title { text-transform: uppercase; max-width: 11ch; }
.home-hero__title { font-size: clamp(4.8rem, 9.5vw, 9.5rem); }
.home-hero__title em, .coffee-hero__title em { color: var(--wb-yellow); font-weight: 700; }
.home-hero__overlay { background: linear-gradient(90deg, rgba(25,20,39,.86), rgba(25,20,39,.55) 55%, rgba(25,20,39,.2)); }
.home-hero__copy { color: #fff; max-width: 32rem; }
.home-hero__grain { opacity: .035; }
.home-section__eyebrow, .story-eyebrow { font-size: .75rem; line-height: 1.5; }
.story-events { background: var(--wb-orange); color: var(--color-ink); }
.story-events .story-heading, .story-events .story-heading em { color: var(--color-ink); }
.coffee-direction { background-color: var(--color-cream); }
.coffee-consultation { border-top: 5px solid var(--wb-purple); }
.visit-main { --visit-green: var(--wb-green); --visit-clay: var(--wb-orange); --visit-clay-dark: var(--wb-purple); }
.contact-main { --contact-green: var(--wb-green); --contact-clay: var(--wb-orange); --contact-clay-dark: var(--wb-purple); }
.story-lead, .home-intro__lead { font-family: var(--font-body); line-height: 1.55; }
.wb-button, .button, .coffee-filter, .product-modal__option { font-family: var(--font-body); font-weight: 600; }
:focus-visible { outline: 3px solid var(--wb-blue); outline-offset: 4px; }
.wb-button :is(img,svg), .site-nav__toggle :is(img,svg) { flex-shrink: 0; }
.wb-button--dark img, .contact-social__arrow img, .contact-link--light .contact-link__icon img {
  filter: brightness(0) invert(1);
}
.wb-button--light img { filter: brightness(0); }
.visit-info-card__icon img { filter: brightness(0) invert(1); }
.contact-social__link:hover .contact-social__arrow img { filter: brightness(0); }
.story-events .story-copy, .story-events .story-lead,
.visit-closing .visit-copy, .contact-location .contact-copy {
  color: var(--color-ink);
}
.visit-location__primary, .visit-location__label,
.visit-closing__title, .visit-closing__title em,
.visit-closing__copy, .visit-closing__contact-link,
.contact-location, .contact-location__label,
.contact-location__address, .contact-location__note {
  color: var(--color-ink);
}
.visit-closing__contact-link:hover { color: var(--color-ink); text-decoration: underline; }
.site-logo__image--light, .site-footer__logo { mix-blend-mode: screen; }
.site-logo__image--dark { mix-blend-mode: multiply; }
.home-intro__picture, .home-visit__picture, .story-beginning__picture { aspect-ratio: 4/3; }
.home-intro__image, .home-visit__image { width: 100%; height: 100%; object-fit: cover; }
.visit-atmosphere__figure--workspace .visit-atmosphere__image { aspect-ratio: 16/9; }
.visit-atmosphere__figure--counter .visit-atmosphere__image { aspect-ratio: 4/3; }
.site-footer { border-top: 4px solid var(--wb-orange); }
.site-footer__title { font-family: var(--font-body); font-weight: 600; }
.site-footer__logo { width: min(100%, 14rem); height: auto; }

/* The Coffee header stays dark, including the scrolled state. */
@media (max-width: 991px) {
  body[data-page="coffee-and-beans"] .site-nav__toggle-icon,
  body[data-page="home"] .site-header:not(.is-scrolled) .site-nav__toggle-icon {
    filter: brightness(0) invert(1);
  }
  body[data-page="home"] .site-header.is-scrolled .site-nav__toggle-icon { filter: none; }
  /* Full-width opaque panel avoids translucent gaps and theme leakage. */
  html.nav-open body .site-nav__panel {
    width: 100%; max-width: none; height: 100dvh;
    padding: calc(var(--header-height) + 1.25rem) max(1.25rem, env(safe-area-inset-right)) max(1.25rem, env(safe-area-inset-bottom));
    background: var(--color-ink) !important; color: #fff !important;
  }
  html.nav-open body .site-nav__toggle-icon { filter: brightness(0) invert(1) !important; }
  html.nav-open body .site-logo__image--light { display: block !important; }
  html.nav-open body .site-logo__image--dark { display: none !important; }
  .site-nav__toggle { min-width: 44px; min-height: 44px; }
  .site-nav__panel .site-nav__link { font-size: 1.75rem; font-weight: 600; line-height: 1.2; }
  .site-nav__link.is-active::before { font-size: .7rem; letter-spacing: .1em; }
  .site-nav__actions { flex-shrink: 0; }
  html.nav-open body .site-nav__actions a { color: var(--color-ink) !important; background: #fff !important; border-color: #fff !important; }
  .home-hero__title { font-size: clamp(4.3rem, 12vw, 7rem); }
  .coffee-hero__title { font-size: clamp(4.3rem, 12vw, 7rem); }
  .home-hero__overlay { background: linear-gradient(180deg, rgba(25,20,39,.7), rgba(25,20,39,.74)); }
}
@media (max-width: 767px) {
  .home-hero__content, .coffee-hero__content, .visit-hero__content, .contact-hero__content { text-align: center; margin-inline: auto; }
  .home-hero__title, .coffee-hero__title, .visit-hero__title, .contact-hero__title { margin-inline: auto; }
  .home-hero__copy, .coffee-hero__copy, .visit-hero__copy { margin-inline: auto; }
  .home-hero__actions, .coffee-hero__actions, .visit-hero__actions { justify-content: center; }
  .home-hero__eyebrow, .coffee-hero__eyebrow, .visit-eyebrow { justify-content: center; }
  .site-footer { text-align: center; }
  .site-footer__grid { grid-template-columns: 1fr; gap: 2rem; }
  .site-footer__brand, .site-footer__logo, .site-footer__description { margin-inline: auto; }
  .site-footer__bottom, .site-footer__socials, .site-footer__links, .site-footer__list { justify-content: center; align-items: center; }
  .site-footer__bottom { flex-direction: column; gap: 1rem; }
  .home-intro__picture, .home-visit__picture { aspect-ratio: 4/3; min-height: 0; }
  .home-visit__motto { font-size: .875rem; }
  .story-hero__title { max-width: 14ch; }
  .story-hero__content-inner { text-align: center; margin-inline: auto; }
  .story-hero__title, .story-hero__lead { margin-inline: auto; }
  .story-hero__chapter, .story-hero__year, .story-hero__content .story-eyebrow { justify-content: center; }
  .story-section, .visit-section, .contact-section { padding-block: 4rem; }
  .story-people { min-height: 0; }
}
@media (max-width: 374px) {
  .home-hero__title, .coffee-hero__title { font-size: 4rem; }
}
@media (max-height: 620px) and (max-width: 991px) {
  html.nav-open body .site-nav__panel { gap: .75rem; padding-top: var(--header-height); }
  .site-nav__panel .site-nav__link { min-height: 44px; padding-block: .4rem; font-size: 1.35rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}