/* Bear & Willow HR — shared inner-page styles (Editorial & Calm direction) */

body {
  font-family: "Geist", -apple-system, "Helvetica Neue", sans-serif;
  font-size: 17px; line-height: 1.6; color: var(--ink);
  background: var(--cream);
}

.display, h1, h2, h3 {
  font-family: "Source Sans 3", "Source Sans Pro", "Source Serif 4", Georgia, serif;
  font-weight: 400; letter-spacing: -0.018em; line-height: 1.05;
  color: var(--forest); margin: 0;
}
.display .it, h1 .it, h2 .it, h3 .it { color: var(--sage-deep); font-weight: 600; }

/* <em> in body content — keep semantic emphasis but use color, not italic */
em { font-style: normal; color: var(--sage-deep); font-weight: 600; }

.eyebrow {
  font-family: "Geist Mono", ui-monospace, monospace;
  font-size: 11.5px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--moss); font-weight: 500;
}

.lede {
  font-size: 20px; line-height: 1.55; color: var(--ink-soft);
  max-width: 60ch; text-wrap: pretty;
}

/* Nav */
.bw-nav {
  position: sticky; top: 0; z-index: 50;
  background: rgba(242, 235, 220, 0.86);
  backdrop-filter: saturate(140%) blur(12px);
  -webkit-backdrop-filter: saturate(140%) blur(12px);
  border-bottom: 1px solid var(--hair);
}
.bw-nav-inner { display: flex; align-items: center; justify-content: space-between; height: 76px; }
.bw-nav-links { display: flex; align-items: center; gap: 16px; }
.bw-nav-links a, .btn { white-space: nowrap; }
.bw-nav-links a {
  text-decoration: none; color: var(--ink-soft);
  font-size: 13.5px; font-weight: 450;
  padding: 8px 0; position: relative;
  transition: color 160ms ease;
}
.bw-nav-links a:hover { color: var(--forest); }
.bw-nav-links a.active { color: var(--forest); }
.bw-nav-links a.active::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 2px;
  height: 1px; background: var(--sage-deep);
}
.bw-nav-cta {
  text-decoration: none; color: var(--forest);
  font-size: 13.5px; font-weight: 500;
  padding: 8px 16px; border-radius: 999px;
  border: 1px solid var(--hair-strong);
  transition: background 180ms ease, border-color 180ms ease;
}
.bw-nav-cta:hover { background: var(--ivory); border-color: var(--forest); }


/* Buttons */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 12px 22px; border-radius: 999px;
  font-size: 14.5px; font-weight: 500; letter-spacing: -0.005em;
  text-decoration: none;
  transition: transform 180ms ease, background 180ms ease, box-shadow 180ms ease;
  border: 1px solid transparent;
}
.btn-primary { background: var(--forest); color: var(--ivory); }
.btn-primary:hover { background: var(--ink); transform: translateY(-1px); }
.btn-ghost { background: transparent; color: var(--forest); border-color: var(--hair-strong); }
.btn-ghost:hover { background: var(--ivory); border-color: var(--forest); }
.btn-arrow::after { content: "→"; transition: transform 180ms ease; }
.btn-arrow:hover::after { transform: translateX(3px); }
.btn-lg { padding: 14px 28px; font-size: 15px; }

/* Page header (used on every inner page) */
.page-header {
  padding: 88px 0 64px;
  border-bottom: 1px solid var(--hair);
  position: relative;
}
.page-header .crumb {
  font-family: "Geist Mono", monospace; font-size: 11.5px;
  color: var(--moss); letter-spacing: 0.16em; text-transform: uppercase;
  margin-bottom: 18px; display: inline-block;
}
.page-header h1 {
  font-size: clamp(48px, 6.4vw, 88px);
  line-height: 1.0; margin: 0 0 22px;
  color: var(--forest);
  text-wrap: balance;
}
.page-header p.lede { margin: 0; max-width: 64ch; }

section { padding: 88px 0; }

/* Prose blocks (long-form text) */
.prose {
  max-width: 720px; margin: 0 auto;
  font-size: 17.5px; line-height: 1.7; color: var(--ink-soft);
}
.prose h2 {
  font-size: clamp(28px, 3.4vw, 40px);
  margin: 56px 0 16px;
  color: var(--forest);
}
.prose h3 {
  font-size: 24px; margin: 32px 0 10px; color: var(--forest);
}
.prose p { margin: 0 0 18px; }
.prose ul, .prose ol { margin: 0 0 24px; padding-left: 24px; }
.prose ul li, .prose ol li { margin-bottom: 8px; }
.prose strong { color: var(--ink); font-weight: 600; }
.prose a { color: var(--forest); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--sage-deep); }
.prose blockquote {
  margin: 28px 0; padding: 20px 28px;
  border-left: 2px solid var(--sage-deep);
  background: var(--ivory);
  font-family: "Source Sans 3", "Source Sans Pro", serif; font-size: 21px;
  color: var(--forest); border-radius: 0 6px 6px 0;
}

/* Footer */
.bw-foot { background: var(--forest); color: var(--ivory); padding: 80px 0 32px; }
.bw-foot-top {
  display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 56px;
  padding-bottom: 56px; border-bottom: 1px solid rgba(250, 246, 235, 0.14);
}
.bw-foot-blurb { color: rgba(250, 246, 235, 0.72); font-size: 14.5px; margin-top: 16px; max-width: 32ch; }
.bw-foot h5 {
  font-family: "Geist Mono", monospace; font-size: 11px;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--sage-soft); margin: 0 0 18px; font-weight: 500;
}
.bw-foot ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.bw-foot ul a { text-decoration: none; color: rgba(250, 246, 235, 0.82); font-size: 14.5px; }
.bw-foot ul a:hover { color: var(--ivory); }
.bw-foot-bottom { display: flex; justify-content: space-between; align-items: center; padding-top: 28px; gap: 16px; flex-wrap: wrap; }
.bw-foot-bottom .legal { color: rgba(250, 246, 235, 0.6); font-size: 13px; }
.bw-foot-bottom .socials { display: flex; gap: 14px; }
.bw-foot-bottom .socials a { width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(250, 246, 235, 0.2); display: inline-flex; align-items: center; justify-content: center; color: var(--ivory); text-decoration: none; transition: background 180ms ease, border-color 180ms ease; }
.bw-foot-bottom .socials a:hover { background: rgba(250, 246, 235, 0.06); border-color: var(--ivory); }
.bw-foot-bottom .socials svg { width: 16px; height: 16px; }
.bw-foot .bw-logo { color: var(--ivory); }
.bw-foot .bw-tag { color: var(--sage-soft); }
@media (max-width: 900px) { .bw-foot-top { grid-template-columns: 1fr 1fr; gap: 32px; } }

/* Reveal */
.reveal { opacity: 0; transform: translateY(14px); transition: opacity 700ms ease, transform 700ms ease; }
.reveal.in { opacity: 1; transform: none; }

/* Shared page components */
.band{background:var(--ivory);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.sec-head{max-width:760px;margin-bottom:48px}
.sec-head h2{font-size:clamp(34px,4.2vw,52px);margin:14px 0 16px}
.sec-head p{color:var(--ink-soft);margin:0 0 12px;font-size:17.5px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.split.rev>:first-child{order:2}
@media(max-width:900px){.split{grid-template-columns:1fr;gap:36px}.split.rev>:first-child{order:0}}
.split h2{font-size:clamp(32px,3.8vw,48px);margin:14px 0 18px}
.split p{color:var(--ink-soft);margin:0 0 14px}
.ph{border-radius:10px;overflow:hidden;background:var(--linen);box-shadow:var(--shadow-md)}
.ph img{width:100%;height:100%;object-fit:cover;display:block}
.ticks{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.ticks li{padding-left:26px;position:relative;font-size:15.5px;color:var(--ink-soft);line-height:1.5}
.ticks li::before{content:"";position:absolute;left:2px;top:7px;width:11px;height:7px;border-left:1.5px solid var(--sage-deep);border-bottom:1.5px solid var(--sage-deep);transform:rotate(-45deg)}
.ticks.cross li::before{content:"×";border:0;transform:none;top:-3px;left:3px;width:auto;height:auto;color:var(--clay);font-size:22px;font-weight:600}
.ticks strong{color:var(--forest);font-weight:600}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{padding:8px 14px;border-radius:999px;background:var(--ivory);border:1px solid var(--hair-strong);font-size:14px;color:var(--forest)}
.quote-card{background:var(--ivory);border:1px solid var(--hair);border-radius:10px;padding:32px;display:flex;flex-direction:column;gap:18px}
.quote-card p{font-family:"Source Sans 3","Source Sans Pro",sans-serif;font-size:22px;line-height:1.4;color:var(--forest);margin:0}
.quote-card cite{font-style:normal;font-family:"Geist Mono",monospace;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--moss)}
.note{background:var(--ivory);border:1px solid var(--hair);border-radius:8px;padding:20px 24px;font-size:15px;color:var(--ink-soft);line-height:1.6}
.note strong{color:var(--forest)}
.note a,.text-link{color:var(--forest);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--sage-deep)}
.faq details{border-bottom:1px solid var(--hair);padding:20px 0}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;font-family:"Source Sans 3","Source Sans Pro",sans-serif;font-size:21px;font-weight:500;color:var(--forest)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:22px;color:var(--sage-deep)}
.faq details[open] summary::after{content:"−"}
.faq details p{margin:12px 0 0;color:var(--ink-soft);font-size:16px}
.meta-strip{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.meta-strip span{padding:9px 16px;border-radius:999px;background:var(--forest);color:var(--ivory);font-size:14px}

/* Common card */
.card {
  background: var(--ivory); border: 1px solid var(--hair);
  border-radius: 8px;
  padding: 28px 28px 32px;
}

/* CTA banner (re-usable section) */
.cta-band {
  background: var(--forest); color: var(--ivory);
  padding: 100px 0; text-align: center;
}
.cta-band h2 {
  color: var(--ivory); font-size: clamp(38px, 4.6vw, 60px);
  margin: 0 auto 20px; max-width: 22ch; text-wrap: balance;
}
.cta-band p { color: rgba(250, 246, 235, 0.82); font-size: 17px; max-width: 50ch; margin: 0 auto 32px; }
.cta-band .btn-primary { background: var(--ivory); color: var(--forest); }
.cta-band .btn-primary:hover { background: var(--cream); }
.cta-band .btn-ghost { background: transparent; color: var(--ivory); border-color: rgba(250, 246, 235, 0.3); }
.cta-band .btn-ghost:hover { border-color: var(--ivory); background: rgba(250, 246, 235, 0.06); }
