:root {
  --occ-canvas: #f2ede7;
  --occ-paper: #f7f4f0;
  --occ-surface: #e9e1da;
  --occ-ink: #292424;
  --occ-muted: #685f5b;
  --occ-wine: #601e27;
  --occ-wine-deep: #601e27;
  --occ-line: #d8cec5;
  --occ-font-title: "Cormorant Garamond", "Times New Roman", serif;
  --occ-font-body: Inter, system-ui, sans-serif;
}

html, body { background: var(--occ-canvas) !important; color: var(--occ-ink) !important; font-family: var(--occ-font-body) !important; font-size: 16px !important; }
body, p, a, li, button, input, textarea, select { font-family: var(--occ-font-body) !important; }
a[href], button:not(:disabled), [role="button"]:not([aria-disabled="true"]), summary, label[for], select, input[type="checkbox"], input[type="radio"] { cursor: pointer !important; }
h1, h2, h3, h4, h5, h6, .serif, .display { font-family: var(--occ-font-title) !important; font-style: normal; font-weight: 300 !important; text-wrap: balance; }
h1 { font-size: clamp(48px, 5vw, 76px) !important; line-height: .96 !important; letter-spacing: -.04em !important; }
h2 { font-size: clamp(30px, 3vw, 44px) !important; line-height: 1.08 !important; letter-spacing: -.03em !important; }
h3 { font-size: clamp(22px, 2.1vw, 29px) !important; line-height: 1.12 !important; letter-spacing: -.02em !important; }
p { font-size: 16px !important; line-height: 1.75 !important; }
.eyebrow, .small, .chapter-number, .section-index, .hero-sub { color: var(--occ-wine) !important; font-family: var(--occ-font-body) !important; font-size: 11px !important; font-weight: 600 !important; letter-spacing: .18em !important; text-transform: uppercase; }
.occ-global-header, .occ-global-footer { background: rgba(242, 237, 231, .96) !important; color: var(--occ-ink) !important; }
.occ-global-header :is(a, button), .occ-global-footer :is(a, p, span) { color: var(--occ-ink) !important; }
:is(a.primary, a.end-button, a.button, .button.primary, button.button, .occ-cta-primary) { border-color: var(--occ-wine) !important; border-radius: 0 !important; background: var(--occ-wine) !important; color: var(--occ-paper) !important; }
:is(a.primary, a.end-button, a.button, .button.primary, button.button, .occ-cta-primary):hover { background: var(--occ-wine-deep) !important; }

@media (prefers-reduced-motion: no-preference) {
  html.occ-motion-ready main > section:not(:first-child) { transition: opacity 560ms cubic-bezier(.22,1,.36,1), transform 560ms cubic-bezier(.22,1,.36,1); }
  html.occ-motion-ready main > section.occ-reveal-pending { opacity: 0; transform: translate3d(0, 18px, 0); }
  html.occ-motion-ready main > section.is-visible { opacity: 1; transform: none; }
  main section img:not([src*="logo"]) { transition: transform 900ms cubic-bezier(.22,1,.36,1); }
  main :is(figure,.media,.photo):hover img:not([src*="logo"]) { transform: scale(1.025); }
  details[open] > :not(summary) { animation: occ-faq-open 260ms cubic-bezier(.22,1,.36,1) both; }
}
@keyframes occ-faq-open { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; } main > section { opacity: 1 !important; transform: none !important; } }
@media (max-width: 639px) { h1 { font-size: clamp(42px, 12vw, 58px) !important; } h2 { font-size: clamp(30px, 9vw, 40px) !important; } h3 { font-size: clamp(22px, 7vw, 28px) !important; } }

/* Same motion tokens and type hierarchy as App Router pages. */
:root { --occ-motion-fast:180ms; --occ-motion-standard:320ms; --occ-motion-slow:560ms; --occ-ease:cubic-bezier(.22,1,.36,1); }
main .reveal, main .rise, main [data-occ-reveal] { opacity:1; transform:none; }
main > section { opacity:1; transform:none; }
main :is(.hero-photo,.audience-img,.process-photo,.origin-photo,.photo) { overflow:hidden; }
main :is(.hero-photo,.audience-img,.process-photo,.origin-photo,.photo) img { width:100%; height:auto; object-fit:contain; display:block; }
main .photo-fallback { display:none; }
main .faq details { margin:0; padding:0; border-top:1px solid var(--occ-line); }
main .faq summary { padding:24px 36px 24px 0; min-height:72px; line-height:1.5; position:relative; }
main .faq details p { margin:0; padding:0 36px 24px 0; }
@media(prefers-reduced-motion:no-preference) {
 main > section { transition:opacity var(--occ-motion-slow) var(--occ-ease),transform var(--occ-motion-slow) var(--occ-ease); }
 main > section.occ-reveal-pending { opacity:0; transform:translateY(16px); }
 main :is(.hero-photo,.audience-img,.process-photo,.origin-photo,.photo) img { transition:transform var(--occ-motion-slow) var(--occ-ease); }
 main :is(.hero-photo,.audience-img,.process-photo,.origin-photo,.photo):hover img { transform:scale(1.015); }
 details[open] > :not(summary) { animation:occ-faq-open var(--occ-motion-standard) var(--occ-ease) both; }
}
@media(prefers-reduced-motion:reduce) {
 :root { --occ-motion-fast:1ms; --occ-motion-standard:1ms; --occ-motion-slow:1ms; }
 main > section,main .reveal,main .rise,main [data-occ-reveal] { opacity:1!important; transform:none!important; }
 main img { transform:none!important; }
}

/* Shared static HTML footer: visually identical to the App Router SiteFooter.
   Static page rewrites must not introduce an alternate footer layout. */
.occ-global-footer {
  width: 100%;
  padding: 0;
  border-top: 1px solid rgba(41,36,36,.1) !important;
  background: var(--occ-canvas) !important;
  color: var(--occ-ink) !important;
}
.occ-global-footer-inner {
  width: 100%;
  max-width: 1360px;
  margin: 0 auto;
  padding: 64px 48px;
}
.occ-global-footer-main {
  display: grid;
  grid-template-columns: minmax(0,1fr);
  gap: 0;
  padding-bottom: 48px;
  border-bottom: 1px solid var(--occ-line);
}
.occ-global-footer-brand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 24px;
  max-width: none;
  padding-bottom: 44px;
  border-bottom: 1px solid var(--occ-line);
}
.occ-global-footer-brand > a:first-child { display: inline-flex; align-items: center; }
.occ-global-footer-brand img {
  display: block;
  width: auto;
  height: 52px;
  object-fit: contain;
}
.occ-global-footer-brand p {
  display: block !important;
  max-width: 680px;
  margin: 0 !important;
  color: var(--occ-ink) !important;
  font: 400 38px/1.02 "Cormorant Garamond", Georgia, serif !important;
  letter-spacing: -.035em !important;
  text-align: left;
  text-transform: none !important;
}
.occ-global-footer-nav {
  display: grid;
  grid-template-columns: 1.12fr 1.08fr 1.08fr .92fr .75fr .75fr;
  gap: 32px;
  padding-top: 44px;
  border: 0;
}
.occ-global-footer-nav > div,
.occ-global-footer-nav > div:nth-child(5),
.occ-global-footer-nav > div:nth-child(6) {
  grid-column: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  text-align: left;
}
.occ-global-footer-nav > div:nth-child(n+4) {
  justify-self: center;
  text-align: center;
}
.occ-global-footer-nav > div:nth-child(n+4) p { align-items: center; }
.occ-global-footer-heading {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  margin-bottom: 16px;
  color: var(--occ-ink) !important;
  font: 600 12px/1.2 Inter, system-ui, sans-serif !important;
  letter-spacing: .18em !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
}
.occ-global-footer-nav p {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0 !important;
}
.occ-global-footer-nav p a {
  color: var(--occ-muted) !important;
  font: 400 14px/1.55 Inter, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  text-transform: none !important;
}
.occ-global-footer-nav p a:hover,
.occ-global-footer-heading:hover { color: var(--occ-wine) !important; }
.occ-global-footer-legal {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 20px;
  border-top: 0;
}
.occ-global-footer-legal > div {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 24px;
}
.occ-global-footer-legal > p,
.occ-global-footer-legal > div > p,
.occ-global-footer-legal > div > a {
  margin: 0 !important;
  color: rgba(41,36,36,.55) !important;
  font: 400 12px/1.55 Inter, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.occ-global-footer-legal a:hover { color: var(--occ-ink) !important; }
@media (max-width: 1023px) {
  .occ-global-footer-inner { padding: 56px 32px; }
  .occ-global-footer-nav { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .occ-global-footer-nav > div:nth-child(n+4) { justify-self: stretch; text-align: left; }
  .occ-global-footer-nav > div:nth-child(n+4) p { align-items: flex-start; }
}
@media (max-width: 639px) {
  .occ-global-footer-inner { padding: 48px 20px; }
  .occ-global-footer-main { padding-bottom: 40px; }
  .occ-global-footer-brand {
    gap: 24px;
    align-items: flex-start;
    flex-direction: column;
    padding-bottom: 36px;
  }
  .occ-global-footer-brand img { height: 42px; }
  .occ-global-footer-brand p { font-size: 32px !important; text-align: left; }
  .occ-global-footer-nav {
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 36px 24px;
    padding-top: 36px;
  }
  .occ-global-footer-nav > div,
  .occ-global-footer-nav > div:nth-child(even) {
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }
  .occ-global-footer-legal { flex-direction: column; align-items: flex-start; }
  .occ-global-footer-legal > div { align-items: flex-start; }
}

/* Compact fitted menus: center each dropdown under its own navigation label. */
.occ-global-nav-item .occ-global-dropdown {
  box-sizing: border-box;
  width: max-content;
  min-width: 100%;
  max-width: min(216px, calc(100vw - 32px));
  padding: 0;
}
.occ-global-nav-item .occ-global-dropdown a {
  padding: 12px;
  text-align: center;
  white-space: normal;
  overflow-wrap: break-word;
  font-size: 12px;
  line-height: 1.35;
  letter-spacing: .04em;
}

/* Approved OCC brand signature, shared across legacy static-page footers. */
.occ-global-footer-brand .occ-global-footer-statement{display:flex;flex-direction:column;align-items:flex-start;gap:16px;width:100%;max-width:920px}
.occ-global-footer-brand .occ-global-footer-statement p{max-width:100%;margin:0!important;text-align:left!important}
.occ-global-footer-brand .occ-global-footer-statement p.occ-global-footer-eyebrow{
  color:var(--occ-wine,#601E27)!important;
  font:600 11px/1.5 Inter,system-ui,sans-serif!important;
  letter-spacing:.22em!important;
  text-transform:uppercase!important;
}
.occ-global-footer-brand .occ-global-footer-statement p.occ-global-footer-tagline{
  color:var(--occ-ink,#292424)!important;
  font:400 clamp(34px,3.15vw,46px)/1.09 "Cormorant Garamond",Georgia,serif!important;
  letter-spacing:-.025em!important;
}
.occ-global-footer-brand .occ-global-footer-tagline span{display:block}
.occ-global-footer-brand .occ-global-footer-statement p.occ-global-footer-proof{
  color:var(--occ-muted,#685F5B)!important;
  font:400 13px/1.65 Inter,system-ui,sans-serif!important;
  letter-spacing:normal!important;
  text-transform:none!important;
}
@media(max-width:639px){
  .occ-global-footer-brand .occ-global-footer-statement p.occ-global-footer-tagline{font-size:34px!important}
  .occ-global-footer-brand .occ-global-footer-statement p.occ-global-footer-proof{font-size:13px!important}
}

/* OCC footer two-column editorial signature, shared with the App Router footer. */
.occ-global-footer-brand{
  display:grid!important;
  grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr)!important;
  grid-template-rows:auto auto;
  column-gap:clamp(40px,5vw,90px);
  row-gap:24px;
  align-items:end;
  padding-bottom:40px!important;
}
.occ-global-footer-brand>a:first-child{
  grid-column:1;
  grid-row:1;
  align-self:start;
}
.occ-global-footer-brand img{height:46px}
.occ-global-footer-brand .occ-global-footer-statement{display:contents!important}
.occ-global-footer-brand .occ-global-footer-eyebrow{display:none!important}
.occ-global-footer-brand .occ-global-footer-statement p.occ-global-footer-tagline{
  grid-column:1;
  grid-row:2;
  align-self:end;
  max-width:620px!important;
  font:400 clamp(30px,2.7vw,40px)/1.09 "Cormorant Garamond",Georgia,serif!important;
  letter-spacing:-.025em!important;
}
.occ-global-footer-brand .occ-global-footer-statement p.occ-global-footer-proof{
  grid-column:2;
  grid-row:1/span 2;
  align-self:end;
  max-width:390px!important;
  padding:20px 0 0;
  border-top:1px solid var(--occ-line);
  font:400 14px/1.75 Inter,system-ui,sans-serif!important;
  color:var(--occ-muted,#685F5B)!important;
}
@media(max-width:767px){
  .occ-global-footer-brand{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto auto auto;row-gap:22px}
  .occ-global-footer-brand>a:first-child{grid-column:1;grid-row:1}
  .occ-global-footer-brand .occ-global-footer-statement p.occ-global-footer-tagline{grid-column:1;grid-row:2;font-size:30px!important}
  .occ-global-footer-brand .occ-global-footer-statement p.occ-global-footer-proof{grid-column:1;grid-row:3;max-width:100%!important}
}
