/* Orchard Route sunset-orchard palette and festoon-lighting treatment.
   Built from the current Orchard Route logo and the late-summer orchard reference image. */

:root {
  --orchard-shadow: #271d0d;
  --orchard-shadow-deep: #180f08;
  --bark: #5d2c0e;
  --chestnut: #9f531e;
  --burnt-orange: #d16c23;
  --apple-red: #8f2e12;
  --sunset-amber: #ef952d;
  --festoon-gold: #fdd565;
  --lantern-cream: #faf397;
  --parchment: #f5e4bd;
  --parchment-deep: #e7c58f;
  --leaf-shadow: #3b4313;

  --ink: var(--orchard-shadow);
  --cream: #fff6d5;
  --cream-muted: #e9d8ad;
  --gold: var(--festoon-gold);
  --gold-deep: var(--sunset-amber);
  --apple: var(--apple-red);
  --leaf: var(--leaf-shadow);
  --leaf-bright: #5b5a20;
  --forest: var(--orchard-shadow);
  --forest-soft: var(--bark);
  --line: rgba(253, 213, 101, .20);
  --shadow: 0 28px 80px rgba(24, 15, 8, .42);
}

body {
  color: var(--cream);
  background:
    radial-gradient(circle at 84% -10%, rgba(239, 149, 45, .18), transparent 34rem),
    radial-gradient(circle at 8% 18%, rgba(143, 46, 18, .10), transparent 28rem),
    linear-gradient(180deg, #271d0d 0%, #3a210f 36%, #211308 70%, #180f08 100%);
}

body::before {
  opacity: .72;
  background-image:
    repeating-linear-gradient(90deg, rgba(250, 243, 151, .012) 0 1px, transparent 1px 46px),
    linear-gradient(180deg, rgba(239, 149, 45, .025), transparent 30%, rgba(93, 44, 14, .04));
}

.site-header.is-scrolled {
  background: rgba(39, 29, 13, .94);
  border-color: rgba(253, 213, 101, .18);
  box-shadow:
    0 12px 34px rgba(24, 15, 8, .34),
    0 4px 28px rgba(239, 149, 45, .08);
}

.site-brand-copy span {
  color: #e9d8ad;
}

.site-nav > a {
  color: rgba(255, 246, 213, .88);
}

.site-nav > a:hover,
.site-nav > a:focus-visible {
  color: #fff7da;
  background: rgba(253, 213, 101, .09);
}

.site-nav .nav-cta,
.btn-primary {
  color: #2b190b;
  border-color: rgba(255, 248, 207, .42);
  background: linear-gradient(180deg, #ffe68c 0%, #fdd565 42%, #ef952d 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .48),
    0 7px 20px rgba(93, 44, 14, .24),
    0 0 26px rgba(253, 213, 101, .18);
}

.site-nav .nav-cta:hover,
.site-nav .nav-cta:focus-visible,
.btn-primary:hover,
.btn-primary:focus-visible {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .58),
    0 10px 26px rgba(93, 44, 14, .30),
    0 0 38px rgba(253, 213, 101, .28);
}

.btn-secondary {
  color: #fff4d4;
  border-color: rgba(253, 213, 101, .28);
  background: rgba(93, 44, 14, .30);
  box-shadow: inset 0 1px 0 rgba(255, 246, 213, .04);
}

.btn-secondary:hover,
.btn-secondary:focus-visible {
  border-color: rgba(253, 213, 101, .42);
  background: rgba(159, 83, 30, .38);
  box-shadow: 0 0 26px rgba(239, 149, 45, .11);
}

.eyebrow,
.section-label {
  color: var(--festoon-gold);
}

/* Warm the shared hero treatment without replacing the existing photography. */
.hero::before {
  background:
    radial-gradient(circle at 76% 18%, rgba(253, 213, 101, .34), transparent 23rem),
    radial-gradient(circle at 58% 60%, rgba(209, 108, 35, .18), transparent 30rem),
    linear-gradient(90deg, rgba(39, 29, 13, .88), rgba(71, 36, 14, .52) 50%, rgba(24, 15, 8, .80)),
    linear-gradient(180deg, rgba(24, 15, 8, .10), rgba(24, 15, 8, .84));
}

.route-page-hero,
.about-hero {
  background-color: var(--orchard-shadow);
  background-image:
    radial-gradient(circle at 78% 14%, rgba(253, 213, 101, .29), transparent 27rem),
    radial-gradient(circle at 58% 68%, rgba(209, 108, 35, .14), transparent 32rem),
    linear-gradient(90deg, rgba(39, 29, 13, .94), rgba(80, 41, 16, .58) 52%, rgba(24, 15, 8, .84)),
    linear-gradient(180deg, rgba(24, 15, 8, .08), rgba(24, 15, 8, .79)),
    url("../img/orchard-hero.png");
}

.directory-hero {
  background:
    radial-gradient(circle at 78% 12%, rgba(253, 213, 101, .30), transparent 28rem),
    radial-gradient(circle at 18% 74%, rgba(143, 46, 18, .13), transparent 30rem),
    linear-gradient(135deg, #4c2810 0%, #271d0d 54%, #180f08 100%);
}

/* Section rhythm: orchard shadow, bark and warm parchment rather than green. */
.home-intro,
.route-page-section-dark,
.about-story,
.about-details,
.directory-intro,
.directory-guide,
.route-page-cta-section {
  background:
    radial-gradient(circle at 84% 4%, rgba(239, 149, 45, .13), transparent 28rem),
    radial-gradient(circle at 8% 92%, rgba(143, 46, 18, .08), transparent 24rem),
    linear-gradient(180deg, #3a210f 0%, #271d0d 48%, #1b1109 100%);
}

.makers-section,
.route-page-section-light,
.about-principles,
.directory-list-section {
  color: var(--orchard-shadow);
  background:
    radial-gradient(circle at 88% 4%, rgba(253, 213, 101, .34), transparent 26rem),
    linear-gradient(180deg, #f8eccd 0%, #efd7a9 52%, #e4be83 100%);
}

.makers-section .section-heading > p:not(.section-label),
.route-page-section-light .section-heading > p:not(.section-label),
.route-page-section-light .route-page-card p,
.about-principles .section-heading > p:not(.section-label),
.directory-list-section .section-heading > p:not(.section-label) {
  color: #654426;
}

.makers-section .section-label,
.route-page-section-light .section-label,
.about-principles .section-label,
.directory-list-section .section-label {
  color: var(--apple-red);
}

/* Homepage cards: bark timber lit by warm bulbs just outside the frame. */
.home-intro-panel {
  border-color: rgba(253, 213, 101, .25);
  background:
    radial-gradient(circle at 10% -2%, rgba(253, 213, 101, .13), transparent 12rem),
    linear-gradient(145deg, rgba(159, 83, 30, .48), rgba(39, 29, 13, .96)),
    var(--orchard-shadow);
  box-shadow:
    inset 0 1px 0 rgba(255, 246, 213, .08),
    0 24px 58px rgba(24, 15, 8, .30),
    0 0 42px rgba(239, 149, 45, .09);
}

.home-intro-panel:nth-child(2) {
  background:
    radial-gradient(circle at 92% 3%, rgba(143, 46, 18, .16), transparent 16rem),
    radial-gradient(circle at 12% -2%, rgba(253, 213, 101, .11), transparent 12rem),
    linear-gradient(145deg, rgba(109, 53, 19, .52), rgba(39, 29, 13, .97));
}

.home-intro-panel p,
.home-final-panel p {
  color: rgba(255, 246, 213, .82);
}

.home-final-cta {
  background:
    radial-gradient(circle at 82% 12%, rgba(209, 108, 35, .20), transparent 30rem),
    radial-gradient(circle at 10% 100%, rgba(253, 213, 101, .10), transparent 25rem),
    linear-gradient(180deg, #2c190d 0%, #180f08 100%);
}

.home-final-panel {
  border-color: rgba(253, 213, 101, .26);
  background:
    radial-gradient(circle at 92% 5%, rgba(253, 213, 101, .12), transparent 19rem),
    radial-gradient(circle at 5% 100%, rgba(143, 46, 18, .10), transparent 20rem),
    linear-gradient(145deg, rgba(159, 83, 30, .42), rgba(39, 29, 13, .91));
  box-shadow:
    inset 0 1px 0 rgba(255, 246, 213, .08),
    0 26px 70px rgba(24, 15, 8, .30),
    0 0 48px rgba(239, 149, 45, .10);
}

/* A very subtle line of out-of-frame festoon lights above the homepage route chooser. */
.home-intro::after {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 92px;
  z-index: 0;
  pointer-events: none;
  opacity: .58;
  background:
    radial-gradient(circle at 8% 12px, #fff8cf 0 2px, #fdd565 3px, rgba(253, 213, 101, .28) 7px, transparent 22px),
    radial-gradient(circle at 29% 24px, #fff8cf 0 2px, #ef952d 3px, rgba(239, 149, 45, .24) 7px, transparent 23px),
    radial-gradient(circle at 53% 9px, #fff8cf 0 2px, #fdd565 3px, rgba(253, 213, 101, .26) 7px, transparent 22px),
    radial-gradient(circle at 76% 25px, #fff8cf 0 2px, #ef952d 3px, rgba(239, 149, 45, .23) 7px, transparent 23px),
    radial-gradient(circle at 94% 11px, #fff8cf 0 2px, #fdd565 3px, rgba(253, 213, 101, .26) 7px, transparent 22px);
  mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, .7) 45%, transparent 100%);
}

.home-intro > .section-inner {
  position: relative;
  z-index: 1;
}

/* Festoon-lit card system. The small hot spots imply nearby bulbs without drawing literal strings across content. */
.home-intro-panel,
.home-final-panel,
.route-page-card,
.route-page-panel,
.route-page-cta,
.about-panel,
.about-principle-card,
.about-cta-panel,
.directory-copy-panel,
.directory-card,
.directory-guide-card,
.related-producer-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.home-intro-panel::before,
.home-final-panel::before,
.route-page-card::before,
.route-page-panel::before,
.route-page-cta::before,
.about-panel::before,
.about-principle-card::before,
.about-cta-panel::before,
.directory-copy-panel::before,
.directory-card::before,
.directory-guide-card::before,
.related-producer-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  border-radius: inherit;
  background:
    radial-gradient(circle at 8% 0%, rgba(255, 248, 207, .95) 0 1px, rgba(253, 213, 101, .82) 2px, rgba(253, 213, 101, .18) 8px, transparent 32px),
    radial-gradient(circle at 93% 8%, rgba(255, 248, 207, .78) 0 1px, rgba(239, 149, 45, .68) 2px, rgba(239, 149, 45, .13) 8px, transparent 34px),
    radial-gradient(ellipse at 18% 0%, rgba(253, 213, 101, .11), transparent 28%),
    radial-gradient(ellipse at 88% 3%, rgba(209, 108, 35, .09), transparent 30%);
  opacity: .82;
}

.home-intro-panel > *,
.home-final-panel > *,
.route-page-card > *,
.route-page-panel > *,
.route-page-cta > *,
.about-panel > *,
.about-principle-card > *,
.about-cta-panel > *,
.directory-copy-panel > *,
.directory-card > *,
.directory-guide-card > *,
.related-producer-card > * {
  position: relative;
  z-index: 1;
}

.route-page-card,
.route-page-panel,
.about-panel,
.directory-copy-panel,
.directory-guide-card,
.related-producer-card {
  border-color: rgba(253, 213, 101, .22);
  background:
    linear-gradient(145deg, rgba(159, 83, 30, .22), rgba(39, 29, 13, .72));
  box-shadow:
    inset 0 1px 0 rgba(255, 246, 213, .06),
    0 20px 54px rgba(24, 15, 8, .22),
    0 0 32px rgba(239, 149, 45, .07);
}

.route-page-section-light .route-page-card {
  border-color: rgba(93, 44, 14, .18);
  background:
    radial-gradient(circle at 9% 0%, rgba(253, 213, 101, .22), transparent 11rem),
    rgba(255, 250, 228, .55);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .54),
    0 18px 44px rgba(93, 44, 14, .14),
    0 0 28px rgba(239, 149, 45, .08);
}

.route-page-cta,
.about-cta-panel {
  border-color: rgba(253, 213, 101, .27);
  background:
    radial-gradient(circle at 92% 4%, rgba(253, 213, 101, .12), transparent 18rem),
    linear-gradient(145deg, rgba(159, 83, 30, .36), rgba(39, 29, 13, .86));
  box-shadow:
    inset 0 1px 0 rgba(255, 246, 213, .07),
    0 24px 62px rgba(24, 15, 8, .28),
    0 0 42px rgba(239, 149, 45, .10);
}

.route-page-step {
  border-color: rgba(253, 213, 101, .20);
  background:
    radial-gradient(circle at 94% 0%, rgba(239, 149, 45, .08), transparent 10rem),
    rgba(93, 44, 14, .18);
  box-shadow:
    inset 0 1px 0 rgba(255, 246, 213, .04),
    0 14px 34px rgba(24, 15, 8, .15);
}

.route-page-step::before {
  color: var(--festoon-gold);
}

.route-page-list li::before,
.home-points li::before {
  background: var(--festoon-gold);
  box-shadow:
    0 0 0 5px rgba(253, 213, 101, .12),
    0 0 18px rgba(253, 213, 101, .25);
}

/* The three About principles become warm timber / apple / sunset rather than green cards. */
.about-principle-card {
  border: 1px solid rgba(253, 213, 101, .18);
  color: var(--cream);
  box-shadow:
    0 22px 54px rgba(93, 44, 14, .20),
    0 0 34px rgba(239, 149, 45, .08);
}

.about-principle-card:nth-child(1) {
  background: linear-gradient(145deg, #6f3512, #271d0d 74%);
}

.about-principle-card:nth-child(2) {
  background: linear-gradient(145deg, #8f2e12, #3b1d0c 72%);
}

.about-principle-card:nth-child(3) {
  background: linear-gradient(145deg, #9f531e, #32200f 72%);
}

/* Homepage producer cards retain individuality, but live in the same sunset orchard. */
.maker-card {
  border: 1px solid rgba(253, 213, 101, .16);
  box-shadow:
    0 20px 56px rgba(93, 44, 14, .22),
    0 0 30px rgba(239, 149, 45, .06);
}

.maker-card.loaders {
  --maker-bg: radial-gradient(circle at 78% 18%, rgba(253, 213, 101, .40), transparent 31%), linear-gradient(135deg, #9f531e, #3b210f 72%);
}

.maker-card.king-brain {
  --maker-bg: radial-gradient(circle at 18% 12%, rgba(253, 213, 101, .24), transparent 30%), linear-gradient(135deg, #3b4313, #271d0d 72%);
}

.maker-card.brays {
  --maker-bg: radial-gradient(circle at 82% 15%, rgba(239, 149, 45, .31), transparent 30%), linear-gradient(135deg, #8f2e12, #35180b 72%);
}

.maker-card.wadys {
  --maker-bg: radial-gradient(circle at 18% 12%, rgba(253, 213, 101, .27), transparent 31%), linear-gradient(135deg, #6e461e, #271d0d 74%);
}

/* Cider-house directory cards: warm producer-specific accents without a wall of green. */
.directory-card.loaders {
  --directory-bg: radial-gradient(circle at 78% 18%, rgba(253, 213, 101, .40), transparent 31%), linear-gradient(135deg, #9f531e, #3b210f 72%);
}

.directory-card.king-brain {
  --directory-bg: radial-gradient(circle at 18% 12%, rgba(253, 213, 101, .23), transparent 30%), linear-gradient(135deg, #3b4313, #271d0d 72%);
}

.directory-card.brays {
  --directory-bg: radial-gradient(circle at 82% 15%, rgba(239, 149, 45, .31), transparent 30%), linear-gradient(135deg, #8f2e12, #35180b 72%);
}

.directory-card.wadys {
  --directory-bg: radial-gradient(circle at 18% 12%, rgba(253, 213, 101, .27), transparent 31%), linear-gradient(135deg, #6e461e, #271d0d 74%);
}

.directory-card:hover,
.directory-card:focus-visible,
.related-producer-card:hover,
.related-producer-card:focus-visible,
.directory-guide-card:hover,
.directory-guide-card:focus-visible {
  border-color: rgba(253, 213, 101, .46);
  box-shadow:
    0 26px 66px rgba(93, 44, 14, .28),
    0 0 46px rgba(239, 149, 45, .16);
}

.business-details {
  border-color: rgba(253, 213, 101, .20);
  background:
    radial-gradient(circle at 92% 0%, rgba(239, 149, 45, .08), transparent 19rem),
    rgba(93, 44, 14, .16);
  box-shadow: 0 18px 48px rgba(24, 15, 8, .18);
}

.business-details > div {
  border-bottom-color: rgba(253, 213, 101, .15);
}

.business-details dt {
  color: var(--festoon-gold);
}

.site-footer {
  border-top-color: rgba(253, 213, 101, .16);
  background:
    radial-gradient(circle at 84% 0%, rgba(239, 149, 45, .08), transparent 24rem),
    #180f08;
}

.footer-links a {
  color: #e9d8ad;
}

.back-to-top {
  color: #fff4d4;
  border-color: rgba(253, 213, 101, .22);
  background: rgba(39, 29, 13, .92);
  box-shadow: 0 0 24px rgba(239, 149, 45, .08);
}

.age-gate {
  background: rgba(24, 15, 8, .97);
}

.age-gate-card {
  border-color: rgba(253, 213, 101, .25);
  background:
    radial-gradient(circle at 88% 5%, rgba(253, 213, 101, .13), transparent 16rem),
    linear-gradient(145deg, #5d2c0e, #271d0d 70%);
  box-shadow:
    0 30px 90px rgba(0, 0, 0, .44),
    0 0 56px rgba(239, 149, 45, .12);
}

@media (max-width: 900px) {
  .site-nav {
    background: rgba(39, 29, 13, .98);
    border-color: rgba(253, 213, 101, .20);
  }
}

@media (max-width: 620px) {
  .home-intro::after {
    height: 70px;
    opacity: .38;
  }

  .home-intro-panel,
  .home-final-panel,
  .route-page-card,
  .route-page-panel,
  .route-page-cta,
  .about-panel,
  .about-principle-card,
  .about-cta-panel,
  .directory-copy-panel,
  .directory-card,
  .directory-guide-card {
    box-shadow:
      inset 0 1px 0 rgba(255, 246, 213, .05),
      0 16px 38px rgba(24, 15, 8, .22),
      0 0 24px rgba(239, 149, 45, .06);
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-nav .nav-cta,
  .btn,
  .directory-card,
  .related-producer-card,
  .directory-guide-card {
    transition: none !important;
  }
}