/* Seasonal draft. Original logo and product photography remain untouched. */
:root {
  --ink: #291c16;
  --blue: #a63b21;
  --acid: #efbd57;
  --paper: #fbf4e8;
  --muted: #715c4f;
  --line: #d8c5ad;
  --cyan: #857346;
  --pink: #832e29;
  --orange: #cc6228;
  --yellow: #efbd57;
  --brand-gradient: linear-gradient(110deg, #762921 0%, #a63b21 36%, #c65a24 66%, #e5a33d 100%);
}

body { background: var(--paper); }
.hero h1, .section-head h2, .process h2, .about h2, .quote h2, .facebook-feed h2, .anthem-copy h2,
.service-detail h3, .steps h3, .work figure figcaption b {
  font-family: "Barlow Condensed", "Arial Narrow", Impact, sans-serif;
}
a, button, input, select, textarea { -webkit-tap-highlight-color: rgba(166, 59, 33, .18); }
:focus-visible { outline: 3px solid #a63b21; outline-offset: 5px; }
.services :focus-visible, .quote :focus-visible, .facebook-feed :focus-visible { outline-color: #ffda87; }
[id] { scroll-margin-top: 155px; }

.nav {
  background: rgba(251, 244, 232, .96);
  border-bottom: 1px solid #deccb5;
  box-shadow: 0 6px 24px rgba(72, 38, 21, .06);
}
.nav nav a:not(.nav-cta):hover { color: #a63b21; }
.nav-cta {
  background: #8e3025 !important;
  box-shadow: 0 7px 18px rgba(118, 41, 33, .17);
}
.nav-cta:hover { background: #6e211b !important; }

.hero {
  position: relative;
  background: radial-gradient(ellipse at 5% 100%, #eecb92 0%, transparent 60%), #fff8ec;
}
.hero-copy { position: relative; z-index: 2; }
.hero h1 em { color: #a63b21; }
.hero .eyebrow { color: #8b3323; }
.hero .lede { color: #655146; }
.hero .trust { color: #75614e; }
.hero .trust b { color: #722b20; }
.hero-visual::after {
  background: linear-gradient(150deg, rgba(95, 39, 23, .03) 30%, rgba(138, 51, 28, .34));
}
.hero-logo:hover img, .nav .brand:hover img {
  filter: drop-shadow(0 12px 22px rgba(118, 41, 33, .25));
}
.button { transition: background-color .2s ease, box-shadow .2s ease; }
.button.primary { background: #873025; }
.button.primary:hover { background: #63251d; box-shadow: 0 8px 24px rgba(99, 37, 29, .18); }
.button.ghost { background: rgba(255, 251, 242, .55); border-color: #bba080; }
.button.ghost:hover { background: #fffaf0; }
.floating-card { background: #efbd57; color: #291c16; }
.pulse { background: #8f3023; animation-name: autumnPulse; }

.motion-ribbon {
  background: var(--brand-gradient);
  background-size: 180% 100%;
  animation: autumnFlow 14s ease-in-out infinite alternate;
  border-color: #d68c43;
}
.ribbon-track i { color: #ffdf94; }

.shop-anthem {
  background: linear-gradient(105deg, #fbf4e8 0%, #f4e2c3 75%, #edcf98 100%);
  border-bottom-color: #ddc5a1;
}
.anthem-mark {
  background: conic-gradient(from 25deg, #857346, #efbd57, #c65a24, #832e29, #857346);
  box-shadow: 0 12px 30px rgba(118, 41, 33, .17);
  animation: autumnFloat 6s ease-in-out infinite;
}
.shop-anthem audio { color-scheme: light; accent-color: #a63b21; }

.services, .facebook-feed, footer { background: #291c16; }
.services .eyebrow, .facebook-feed .eyebrow { color: #efbd57; }
.services .section-head > p { color: #d0beb1; }
.service-shell, .service-tabs, .service-tab { border-color: #5e4637; }
.service-tab { color: #c1a18b; }
.service-tab.active {
  color: #fff7e9;
  background: linear-gradient(105deg, #823026, #a63b21);
}
.service-tab::after { background: #efbd57; }
.service-tab:hover { background-color: #422a1e; }
.service-tab.active:hover { background: linear-gradient(105deg, #823026, #a63b21); }
.service-detail p, .service-detail li { color: #d3c2b4; }
.service-detail a { color: #f5c66e; }

.process {
  background: radial-gradient(ellipse at 85% 5%, #f9db8f 0%, transparent 65%), #e8ac4d;
}
.process .eyebrow { color: #6e2a1e; }
.steps { border-color: #663625; }
.steps article { border-color: rgba(102, 54, 37, .32); }
.steps p { color: #4c2c1e; }

.work { background: #f7ecdb; }
.work .section-head > p { color: #715c4f; }
.work figure {
  border: 1px solid rgba(118, 41, 33, .15);
  box-shadow: 0 14px 28px rgba(75, 43, 24, .12);
}
.work figure figcaption { background: linear-gradient(transparent, rgba(41, 28, 22, .96)); }
.product-rotator:focus-visible { outline-color: #a63b21; }
.facebook-link {
  color: #8b3024;
  background: none;
  -webkit-text-fill-color: currentColor;
}
.facebook-link:hover { text-decoration: underline; }
.facebook-copy > p:not(.eyebrow) { color: #d3c2b4; }
.facebook-feed .button.primary { background: #983a26; border: 1px solid #d58b4a; }
.facebook-feed .button.primary:hover { background: #762921; }
.facebook-window {
  background: linear-gradient(145deg, #c66b33, #efbd57 45%, #823026);
  box-shadow: 0 28px 70px rgba(15, 8, 4, .35);
}

.about {
  background: radial-gradient(ellipse at 0% 100%, #f2dfbb 0%, transparent 60%), #fff9ef;
}
.about .eyebrow { color: #a63b21; }
.about > div > p:not(.eyebrow) { color: #715c4f; }
.badge { background: #913625; box-shadow: 0 10px 25px rgba(74, 32, 19, .2); }
.quote {
  background: radial-gradient(ellipse at 100% 0%, #9c4129 0%, transparent 65%), #7a2c24;
}
.quote .eyebrow { color: #ffda87; }
.quote form { background: #fffaf1; box-shadow: 0 22px 60px rgba(45, 15, 9, .20); }
.quote input, .quote select, .quote textarea { background: #fffdf9; border-color: #d5c0a7; }
.quote input:focus, .quote select:focus, .quote textarea:focus { border-color: #a63b21; }
.quote form :focus-visible { outline-color: #a63b21; }
.contact-card span, .contact-card small { opacity: 1; color: #f3d7be; }
.form-note { color: #715c4f; }

/* A few leaves along the margins, never a click-blocking layer. */
.falling-leaves {
  position: fixed;
  inset: 0;
  z-index: 19;
  pointer-events: none;
  overflow: hidden;
  transition: opacity .25s ease;
}
.falling-leaves span {
  position: absolute;
  top: -50px;
  left: var(--leaf-x);
  width: var(--leaf-size);
  height: calc(var(--leaf-size) * 1.18);
  color: var(--leaf-color);
  background: currentColor;
  -webkit-mask: url("assets/autumn-leaf.svg") center / contain no-repeat;
  mask: url("assets/autumn-leaf.svg") center / contain no-repeat;
  opacity: 0;
  animation: leafFall var(--leaf-speed) linear var(--leaf-delay) infinite;
  will-change: transform;
}
.falling-leaves span:nth-child(1) { --leaf-x: 1%; --leaf-size: 23px; --leaf-speed: 23s; --leaf-delay: -4s; --leaf-color: #d99a36; }
.falling-leaves span:nth-child(2) { --leaf-x: 5%; --leaf-size: 30px; --leaf-speed: 28s; --leaf-delay: -18s; --leaf-color: #bc5028; }
.falling-leaves span:nth-child(3) { --leaf-x: 2%; --leaf-size: 19px; --leaf-speed: 19s; --leaf-delay: -13s; --leaf-color: #913625; }
.falling-leaves span:nth-child(4) { --leaf-x: 93%; --leaf-size: 26px; --leaf-speed: 25s; --leaf-delay: -8s; --leaf-color: #b86b29; }
.falling-leaves span:nth-child(5) { --leaf-x: 97%; --leaf-size: 20px; --leaf-speed: 22s; --leaf-delay: -17s; --leaf-color: #e6ac43; }
.falling-leaves span:nth-child(6) { --leaf-x: 95%; --leaf-size: 32px; --leaf-speed: 29s; --leaf-delay: -2s; --leaf-color: #9b3d28; }

.motion-toggle {
  position: fixed;
  bottom: 16px;
  left: 16px;
  z-index: 35;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 10px 15px;
  border: 1px solid #c49a6e;
  border-radius: 24px;
  background: #fff7e9;
  color: #682c20;
  box-shadow: 0 5px 22px rgba(41, 28, 22, .15);
  font: 600 .875rem/1.3 Inter, sans-serif;
  cursor: pointer;
}
.motion-toggle[hidden] { display: none; }
.motion-toggle:hover { background: #f8e5c5; }
.motion-paused *, .motion-paused *::before, .motion-paused *::after { animation-play-state: paused !important; }
.motion-paused .falling-leaves { opacity: 0; }
.motion-paused .reveal { opacity: 1; transform: none; transition: none; }
.motion-paused .hero-visual > img { transform: none !important; }
.motion-paused .product-rotator img { transition: none; }
.motion-paused .hero-copy > *, .motion-paused .hero-logo,
.motion-paused .nav .brand img, .motion-paused .service-detail { animation: none !important; opacity: 1; }

@keyframes leafFall {
  0% { opacity: 0; transform: translate3d(0, -5vh, 0) rotate(-35deg); }
  8% { opacity: .68; }
  38% { transform: translate3d(18px, 39vh, 0) rotate(115deg); }
  72% { opacity: .58; transform: translate3d(-12px, 77vh, 0) rotate(245deg); }
  100% { opacity: 0; transform: translate3d(10px, calc(100vh + 90px), 0) rotate(350deg); }
}
@keyframes autumnFlow { to { background-position: 100% 50%; } }
@keyframes autumnFloat {
  0%, 100% { transform: rotate(-6deg) translateY(0); }
  50% { transform: rotate(2deg) translateY(-5px); }
}
@keyframes autumnPulse {
  0%, 100% { box-shadow: 0 0 0 7px rgba(143, 48, 35, .16); }
  50% { box-shadow: 0 0 0 12px rgba(143, 48, 35, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .falling-leaves, .motion-toggle { display: none !important; }
  .motion-ribbon, .anthem-mark { animation: none !important; }
  .product-rotator img { transition: none; }
}
@media (max-width: 800px) {
  [id] { scroll-margin-top: 115px; }
  .falling-leaves span:nth-child(2), .falling-leaves span:nth-child(3), .falling-leaves span:nth-child(6) { display: none; }
  .hero { background: radial-gradient(ellipse at 5% 50%, #f5dcb1, transparent 75%), #fff8ec; }
  .hero .trust { flex-wrap: wrap; }
  .shop-anthem { gap: 20px; }
  .anthem-mark { width: 66px; height: 66px; }
  .anthem-mark span { width: 48px; height: 48px; }
  .anthem-copy h2 { line-height: 1; }
  .motion-toggle { bottom: max(12px, env(safe-area-inset-bottom)); left: 12px; }
  footer { padding-bottom: 90px; }
}
