/*
 * Automatic seasonal palette.
 *
 * Spring: March-May
 * Summer: June-August
 * Autumn: September-October
 * Christmas: November-December
 * Winter: January-February
 *
 * The page structure stays unchanged. Only colour, light and a restrained
 * tone on large atmospheric photographs follow the season.
 */

:root {
  --season-header: #fff;
  --season-soft: #eee8dc;
  --season-hover: #eee8dc;
  --season-field: #fffdf8;
  --season-invite: #efe3cc;
  --season-status: #eee7da;
  --season-photo: none;
}

html[data-season="spring"] {
  --ink: #292b25;
  --dark: #24261f;
  --paper: #f4f3e9;
  --white: #fffdf7;
  --gold: #88733d;
  --gold-light: #ccb67a;
  --line: #d7d5c7;
  --muted: #65665c;
  --season-header: #fffef9;
  --season-soft: #e9ebdf;
  --season-hover: #e7eadc;
  --season-field: #fffef8;
  --season-invite: #e9e2ca;
  --season-status: #e7e9dc;
  --season-photo: saturate(.96) brightness(1.015);
}

html[data-season="summer"] {
  --ink: #2d2921;
  --dark: #262219;
  --paper: #f8f2e4;
  --white: #fffaf0;
  --gold: #9f722e;
  --gold-light: #dfbd74;
  --line: #dfd2b9;
  --muted: #6a6254;
  --season-header: #fffaf1;
  --season-soft: #f0e5cc;
  --season-hover: #eee1c6;
  --season-field: #fffaf0;
  --season-invite: #f2dfb9;
  --season-status: #efe2c9;
  --season-photo: saturate(1.025) brightness(1.015) contrast(1.01);
}

html[data-season="autumn"] {
  --ink: #30271f;
  --dark: #292018;
  --paper: #f3ece2;
  --white: #fff9f1;
  --gold: #966133;
  --gold-light: #d09a61;
  --line: #d6c4b2;
  --muted: #675a4f;
  --season-header: #fff9f1;
  --season-soft: #ead9c8;
  --season-hover: #e6d3c0;
  --season-field: #fffaf4;
  --season-invite: #ecd5b8;
  --season-status: #eadccd;
  --season-photo: saturate(.95) sepia(.055) contrast(1.025) brightness(.985);
}

html[data-season="christmas"] {
  --ink: #2b211d;
  --dark: #17251f;
  --paper: #f4eadb;
  --white: #fff8ed;
  --gold: #a87a38;
  --gold-light: #e0bd76;
  --line: #cfbda4;
  --muted: #69594e;
  --season-header: #f8eddd;
  --season-soft: #e7d5be;
  --season-hover: #ddc7aa;
  --season-field: #fff8ed;
  --season-invite: #ead0a7;
  --season-status: #e4d2bc;
  --season-photo: saturate(.98) sepia(.085) contrast(1.055) brightness(.95);
}

html[data-season="winter"] {
  --ink: #272b29;
  --dark: #202422;
  --paper: #f1f2ef;
  --white: #fafbf7;
  --gold: #806b4b;
  --gold-light: #c4a979;
  --line: #cbd0cc;
  --muted: #5f6461;
  --season-header: #fbfcf9;
  --season-soft: #e3e7e3;
  --season-hover: #dfe4e0;
  --season-field: #fbfcf9;
  --season-invite: #e5dfd2;
  --season-status: #e1e5e1;
  --season-photo: saturate(.86) contrast(1.025) brightness(.98);
}

body {
  transition: background-color .35s ease, color .35s ease;
}

a:focus-visible,
summary:focus-visible {
  outline-color: var(--gold);
}

.site-header,
.gateway-header {
  background: var(--season-header);
}

/* The supplied logo has a white matte. Multiply lets that matte take on the
   exact colour of each light header while preserving the original artwork. */
.site-header .brand-logo,
.gateway-header .brand-logo {
  background: transparent;
  mix-blend-mode: multiply;
}

/* The footer uses the complementary light treatment already defined in the
   photography stylesheet, so its matte disappears into the dark surface. */
.footer .brand-logo {
  background: transparent;
  mix-blend-mode: screen;
}

.mobile-menu nav {
  background: var(--season-header);
}

.gateway-door > img {
  filter: var(--season-photo);
  transition: transform .8s cubic-bezier(.2, .5, .3, 1), filter .35s ease;
}

.hero-photo img,
.craft-image img {
  filter: var(--season-photo);
  transition: filter .35s ease;
}

.crosslink,
.courtyard-section,
.food-information {
  background: var(--season-soft);
}

.product-photo {
  background: var(--season-soft);
}

.store-row:hover {
  background: var(--season-hover);
}

#apprentice-application input,
#apprentice-application select,
#apprentice-application textarea {
  background: var(--season-field);
}

.application-status {
  background: var(--season-status);
  border-left-color: var(--gold);
}

.apprentice-invite {
  background: var(--season-invite);
}

/* Christmas is styled as a classic evening room: deep pine, burgundy,
   antique gold and candle-warm surfaces. */
html[data-season="christmas"] body.gateway-page,
html[data-season="christmas"] .gateway-footer,
html[data-season="christmas"] .bakery-hero,
html[data-season="christmas"] .menu-callout,
html[data-season="christmas"] .craft-section,
html[data-season="christmas"] .party-facts,
html[data-season="christmas"] .footer {
  background-color: #17251f;
  background-image:
    radial-gradient(circle at 78% 8%, rgba(224, 189, 118, .2), transparent 28%),
    linear-gradient(135deg, #102019 0%, #20231d 53%, #491b23 100%);
}

html[data-season="christmas"] .site-header,
html[data-season="christmas"] .gateway-header {
  background: linear-gradient(100deg, #f8eddd 0%, #fff8ed 48%, #eee0ca 100%);
  border-bottom-color: rgba(124, 30, 40, .34);
  box-shadow: inset 0 -3px #a87a38;
}

html[data-season="christmas"] .door-shade {
  background:
    radial-gradient(circle at 70% 18%, rgba(224, 189, 118, .17), transparent 33%),
    linear-gradient(180deg, rgba(24, 17, 13, .03) 12%, rgba(47, 24, 20, .34) 48%, rgba(16, 29, 23, .95) 100%);
}

html[data-season="christmas"] .eyebrow {
  letter-spacing: .22em;
}

html[data-season="christmas"] .button:hover,
html[data-season="christmas"] .nav-cta:hover {
  background: #702532;
  border-color: #702532;
}

html[data-season="christmas"] .season-banner {
  min-height: 39px;
  padding: 9px 4.5%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 25px;
  color: #faead0;
  background:
    radial-gradient(circle at 18% 50%, rgba(224, 189, 118, .18), transparent 22%),
    linear-gradient(90deg, #173127 0%, #401820 48%, #173127 100%);
  border-bottom: 1px solid #a87a38;
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: .17em;
  text-align: center;
}

html[data-season="christmas"] .season-banner strong {
  color: #e7c88a;
  font-family: var(--serif);
  font-size: 15px;
  font-weight: 400;
  letter-spacing: .12em;
}

html[data-season="christmas"] .season-banner span:last-child {
  color: #f5e8d4;
}

html[data-season="christmas"] .cafe-hero .hero-copy {
  color: #fff5e8;
  background:
    radial-gradient(circle at 12% 16%, rgba(224, 189, 118, .16), transparent 28%),
    linear-gradient(145deg, #14281f 0%, #273025 56%, #551e29 100%);
  border-right: 1px solid #a87a38;
}

html[data-season="christmas"] .cafe-hero .hero-copy .eyebrow,
html[data-season="christmas"] .cafe-hero .hero-copy p {
  color: #eadcc8;
}

html[data-season="christmas"] .cafe-hero .hero-copy em {
  color: #e7c88a;
}

html[data-season="christmas"] .cafe-hero .button,
html[data-season="christmas"] .booking-submit {
  color: #fff8ed;
  background: #702532;
  border-color: #b98947;
}

html[data-season="christmas"] .cafe-hero .text-link {
  color: #fff5e8;
  border-color: #d7af67;
}

html[data-season="christmas"] .info-strip {
  color: #f8ead5;
  background: #173127;
  border-color: #a87a38;
}

html[data-season="christmas"] .menu-heading,
html[data-season="christmas"] .information-heading,
html[data-season="christmas"] .apprentice-heading {
  background:
    radial-gradient(circle at 82% 18%, rgba(168, 122, 56, .14), transparent 29%),
    linear-gradient(112deg, #f4eadb 0%, #f8efe2 60%, #e8d4ba 100%);
}

html[data-season="christmas"] .booking-section,
html[data-season="christmas"] .courtyard-section,
html[data-season="christmas"] .crosslink,
html[data-season="christmas"] .food-information {
  background:
    radial-gradient(circle at 83% 8%, rgba(112, 37, 50, .08), transparent 27%),
    linear-gradient(135deg, #ead8c2 0%, #f1e4d3 58%, #dec5a4 100%);
}

html[data-season="christmas"] .booking-form {
  background: #fff7ea;
  border-color: rgba(112, 37, 50, .38);
  box-shadow: 0 22px 55px rgba(49, 28, 20, .12), inset 0 4px #a87a38;
}

html[data-season="christmas"] .door-button,
html[data-season="christmas"] .nav-cta {
  border-color: #a87a38;
}

html[data-season="christmas"] .gateway-door:hover .door-button {
  color: #351b1d;
  background: #f7e8d2;
}

html[data-season="christmas"] .photo-figure img,
html[data-season="christmas"] .courtyard-photo img,
html[data-season="christmas"] .menu-heading-photo img,
html[data-season="christmas"] .party-hero img {
  filter: var(--season-photo);
}

/* The dedicated Christmas photographs are already colour graded for this
   palette, so they should not receive the general seasonal filter twice. */
html[data-season="christmas"] img[data-seasonal-photo="christmas"] {
  filter: none;
}

@media (max-width: 800px) {
  html[data-season="christmas"] .season-banner {
    padding: 10px 6%;
    flex-direction: column;
    gap: 1px;
    font-size: 10px;
  }

  html[data-season="christmas"] .season-banner strong {
    font-size: 13px;
  }

  html[data-season="christmas"] .cafe-hero .hero-copy {
    border-right: 0;
    border-bottom: 1px solid #a87a38;
  }
}

@media (prefers-reduced-motion: reduce) {
  body,
  .gateway-door > img,
  .hero-photo img,
  .craft-image img {
    transition: none;
  }
}