/* Birch Bloom 2026 look for inner pages (guides, services, plans, legal).
   Loaded after each page's own styles, so it only restyles; content and
   layout widths stay the page's own. Matches the homepage. */
:root {
  --forest: #1E3327;
  --display: "Fraunces", ui-serif, Georgia, serif;
  --heavy: "Inter Tight", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --mono: "Inter Tight", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --foil: linear-gradient(100deg, #7A5A16 0%, #B98E35 18%, #F1D88A 32%, #C59A3E 46%, #8C6A1E 60%, #D9B860 76%, #F6E3A1 86%, #A57D2A 100%);
}
body { font-family: var(--heavy); letter-spacing: -0.005em; }
h1, h2, h3, .way h3, .faq h3 { font-family: var(--display); letter-spacing: -0.02em; }
h1 { font-weight: 300; font-size: clamp(2.3rem, 6vw, 3.9rem); line-height: 1.02; letter-spacing: -0.03em; }
h2 { font-weight: 400; font-size: clamp(1.6rem, 3.6vw, 2.2rem); line-height: 1.1; }
a { color: var(--gold-deep); }
main a:not(.btn) { text-underline-offset: 3px; text-decoration-thickness: 1px; }

/* Floating pill header */
header.pill {
  position: fixed; top: 14px; left: 0; right: 0; margin: 0 auto; z-index: 50;
  width: min(1120px, calc(100% - 24px));
  background: rgba(30,51,39,.86); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(242,237,228,.14); border-radius: 999px; box-shadow: 0 10px 30px rgba(0,0,0,.12);
}
.pill__row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .5rem .55rem .5rem 1.1rem; }
.pill__brand { display: flex; align-items: center; gap: .55rem; color: #F2EDE4; text-decoration: none; font-family: ui-serif, "Hoefler Text", Georgia, serif; font-size: 1.12rem; -webkit-font-smoothing: antialiased; white-space: nowrap; }
.pill__leaf { display: block; width: 20px; height: 30px; flex: none; background: linear-gradient(160deg, #F6E3A1 0%, #C59A3E 30%, #F1D88A 52%, #A57D2A 78%, #E8CC85 100%); -webkit-mask: url(/assets/leaf.png) center/contain no-repeat; mask: url(/assets/leaf.png) center/contain no-repeat; }
.pill__brand em { color: #D9B860; }
@supports ((-webkit-background-clip: text) or (background-clip: text)) { .pill__brand em { background: linear-gradient(100deg, #A27A2A 0%, #F1D88A 28%, #B98E35 50%, #F6E3A1 74%, #A57D2A 100%); -webkit-background-clip: text; background-clip: text; color: transparent; padding-right: .06em; } }
.pill nav { display: flex; gap: 1.6rem; }
.pill nav a { color: #F2EDE4; text-decoration: none; font-family: var(--mono); font-weight: 600; font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; -webkit-font-smoothing: antialiased; }
.pill nav a:hover { color: #E9DFCC; }
.pill__btn { background: #F2EDE4; color: #2A2A28; text-decoration: none; font-weight: 600; font-size: .9rem; padding: .62rem 1.15rem; border-radius: 999px; white-space: nowrap; }
.pill__btn:hover { background: #fff; color: #2A2A28; }
main { padding-top: clamp(7.5rem, 13vw, 9rem) !important; }

/* Mono labels with a hairline */
.eyebrow { font-family: var(--mono); font-weight: 600; font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--charcoal-soft); display: flex; gap: 1rem; align-items: center; }
.eyebrow::after { content: ""; flex: 1; height: 1px; background: var(--hairline); }
.eyebrow a { color: inherit; }
.meta { font-family: var(--mono); font-size: .8rem; letter-spacing: .02em; }
.rule { height: 3px; width: 96px; background: var(--foil); border-radius: 2px; }

/* Tables, boxes, buttons */
th { font-family: var(--mono); font-weight: 600; font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; border-bottom: 1px solid var(--charcoal); }
.checklist, .way, .panel { border-radius: 18px; }
.btn { border-radius: 999px; padding: .85rem 1.4rem; }

/* Closing call to action: the deep green band, with words lighting up on scroll */
.cta { background: var(--forest); border: 0; border-radius: 22px; padding: clamp(1.6rem, 4vw, 2.6rem); color: #F2EDE4; }
.cta h2 { color: #F2EDE4; font-size: clamp(1.7rem, 4vw, 2.5rem); }
.cta p { color: rgba(242,237,228,.92); font-family: var(--display); font-size: clamp(1.1rem, 2vw, 1.35rem); line-height: 1.4; }
.cta a:not(.btn) { color: #E9DFCC; }
.cta .btn { background: #F2EDE4; color: #1E3327; }
.cta .btn:hover { background: #fff; }

/* Scroll reveal and gentle entrances (motion.js) */
[data-reveal] .w { transition: opacity .25s linear; }
[data-reveal] .w.dim { opacity: .22; }
.rise { animation: bb-rise .8s ease both; }
@keyframes bb-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

footer { font-size: .85rem; }

@media (max-width: 860px) {
  .pill nav { display: none; }
  header.pill { top: 10px; width: calc(100% - 20px); }
  .pill__row { padding: .45rem .5rem .45rem 1rem; }
  .pill__brand { font-size: 1.02rem; }
  .pill__leaf { width: 16px; height: 24px; }
  .pill__btn { font-size: .82rem; padding: .5rem .95rem; }
}
@media (prefers-reduced-motion: reduce) {
  [data-reveal] .w.dim { opacity: 1; }
  .rise { animation: none; }
}
@media print { header.pill { display: none; } main { padding-top: 0 !important; } [data-reveal] .w { opacity: 1 !important; } }
