/* Stage 7D: homepage-only surfaces, spacing and finite motion. No scroll owner. */
.pe-site {
  --pf-porcelain: #ece8e0;
  --pf-services: #e2e0d4;
  --pf-sage: #e4e6dc;
  --pf-night: #111e1a;
  --pf-edge: #d0d6c6;
  --pf-warm: #e8d0ad;
  --pf-ease: cubic-bezier(.22,.65,.25,1);
  --pf-feedback: 180ms;
  --pf-enter: 600ms;
  --pf-state: 520ms;
  --pf-plate: 540ms;
  --pf-light: 1350ms;
  --pf-light-intro: 2800ms;
  --pf-distance: 8px;
  --pf-stagger: 70ms;
  --pf-reading-stagger: 45ms;
  --pe-ease: var(--pf-ease);
  background: var(--pf-porcelain);
}
/* Five short islands, never a page-wide or animated gradient. */
.pf-seam { height: 48px; pointer-events: none; position: relative; }
.pf-seam__inner { height: 100%; position: relative; }
.pf-seam__axis { display: block; position: absolute; top: 0; bottom: 0; width: 1px; }
.pf-seam--hero-services { background: linear-gradient(var(--pf-porcelain),var(--pf-services)); }
.pf-seam--hero-services .pf-seam__axis { left: var(--pe-gutter); background: linear-gradient(transparent,#a98a55,transparent); }
.pf-seam--services-anatomy { background: linear-gradient(var(--pf-services),var(--pf-porcelain)); }
.pf-seam--services-anatomy .pf-seam__axis { left: 40%; background: linear-gradient(#a5ae9c,transparent); }
.pf-seam--anatomy-approach { height: 56px; background: linear-gradient(var(--pf-porcelain),var(--pf-sage)); }
.pf-seam--anatomy-approach .pf-seam__axis { left: var(--pe-gutter); background: linear-gradient(#a5ae9c,transparent); }
.pf-seam--approach-light { height: 80px; background: linear-gradient(var(--pf-sage) 0%,var(--pf-edge) 48%,var(--pf-night) 100%); }
.pf-seam--approach-light .pf-seam__axis { left: 64%; top: 16px; bottom: 8px; background: linear-gradient(#9ca990,var(--pf-warm)); }
.pf-seam--light-faq { height: 56px; background: linear-gradient(var(--pf-night) 0%,#87927e 44%,var(--pf-porcelain) 100%); }
.pf-seam--light-faq .pf-seam__axis { left: 64%; top: 8px; bottom: 20px; background: linear-gradient(var(--pf-warm),transparent); }
.pe-site .pe-continuity { padding-block: 28px 24px; }
.pe-site .pe-services { background: var(--pf-services); border-block: 0; padding-top: 48px; }
.pe-site .pe-anatomy { background: var(--pf-porcelain); border-block: 0; }
.pe-site .pe-anatomy .atlas { padding-block: 64px 48px; }
.pe-site .pe-approach { --at-surface: var(--pf-sage); --at-duration: var(--pf-state); --at-ease: var(--pf-ease); }
.pe-site .pe-approach > .pe-shell { padding-bottom: 36px; }
.pe-site .pe-light { --lt-bg: var(--pf-night); }
.pe-site .pe-light .lt-shell { padding-block: 28px 32px; }
.pe-site .pe-light .lt-meta { border-top: 0; padding-top: 0; }
/* FAQ is the real return to action. Keep its native details and exact text. */
.pe-site .faq {
  width: auto; max-width: var(--pe-shell); margin-inline: auto;
  padding: 48px var(--pe-gutter) 48px;
  gap: clamp(36px,6vw,86px); grid-template-columns: 1.15fr 1fr;
  color: var(--pe-ink); font-family: var(--pe-font-ui);
}
.pe-site .faq h2 { font: 400 clamp(48px,4.8vw,70px)/1.02 var(--pe-font-display); letter-spacing: -.03em; margin: 0; }
.pe-site .faq .eyebrow { color: var(--pe-muted); font: 500 10px/1.7 var(--pe-font-ui); letter-spacing: .12em; margin-bottom: 24px; }
.pe-site .faq details { padding: 0; border-color: var(--pe-line); }
.pe-site .faq summary { min-height: 56px; font: 400 13px/1.8 var(--pe-font-ui); color: #3e5144; padding-block: 16px; }
.pe-site .faq details p { font: 400 14px/1.9 var(--pe-font-ui); color: #475344; margin: 0 0 22px; }
.pe-site .faq summary:focus-visible { outline: 2px solid #38563f; outline-offset: 4px; }
.pe-site .cf-closing { background: var(--pf-porcelain); }
.pe-site .cf-closing__inner { padding-block: 48px 60px; position: relative; border-top: 0; }
.pe-site .cf-closing__inner::before { content: ''; position: absolute; top: 0; left: var(--pe-gutter); right: var(--pe-gutter); height: 1px; background: var(--pe-line); }
.pe-site footer.wrap { width: auto; max-width: var(--pe-shell); margin-inline: auto; padding-inline: var(--pe-gutter); }
/* Text opacity stays 1: background handoffs never make reading temporarily faint. */
@keyframes pf-text-in { from { opacity: 1; transform: translateY(var(--pf-distance)); } to { opacity: 1; transform: none; } }
@media(prefers-reduced-motion:no-preference) {
  .pe-site .pe-hero__title { animation: pf-text-in var(--pf-enter) var(--pf-ease) both; }
  .pe-site .pe-hero__ctas { animation: none; opacity: 1; transform: none; }
  .pe-site [data-editorial-reveal].is-in-view { animation: pf-text-in var(--pf-enter) var(--pf-ease) both; }
  .pe-site .pe-anatomy[data-reveal-ready]:not([data-entered]) :is(.anatomy-title,.intro,.specimen,.layers,.explanation) { opacity: 1; transform: translateY(var(--pf-distance)); }
  .pe-site .pe-anatomy[data-reveal-ready] :is(.anatomy-title,.intro,.specimen,.layers,.explanation) { transition: transform var(--pf-enter) var(--pf-ease); }
  .pe-site .pe-anatomy[data-reveal-ready] .specimen { transition-delay: var(--pf-stagger); }
  .pe-site .pe-anatomy[data-reveal-ready] .layers { transition-delay: var(--pf-stagger); }
  .pe-site .pe-anatomy[data-reveal-ready] .explanation { transition-delay: calc(2 * var(--pf-stagger)); }
  .pe-site .pe-approach[data-reveal-ready]:not([data-entered]) :is(.at-heading,.at-story) { opacity: 1; transform: translateY(var(--pf-distance)); }
  .pe-site .pe-approach[data-reveal-ready]:not([data-entered]) .at-story { transform: none; }
  .pe-site .pe-approach[data-reveal-ready] :is(.at-heading,.at-story) { transition: transform var(--pf-enter) var(--pf-ease); }
  .pe-site .pe-approach[data-enhanced] :is(.at-statement,.at-reading) { animation-name: pf-text-in; }
  .pe-site .pe-approach[data-enhanced] .at-reading { animation-delay: var(--pf-reading-stagger); }
  .pe-site .pe-light[data-entrance] .lt-copy { animation: pf-text-in var(--pf-enter) var(--pf-ease) both; }
  .pe-site .pe-light[data-entrance] .lt-closing { animation: none; opacity: 1; transform: none; }
  .pe-site .pe-light[data-entrance] .lt-neutral { animation-duration: 900ms; animation-timing-function: var(--pf-ease); }
  .pe-site .pe-light[data-entrance]:not([data-interacted]) .lt-active { animation-duration: var(--pf-light-intro); animation-timing-function: var(--pf-ease); }
}
.pe-site .pe-services :is(.pe-service-art__layer,.pe-study,.pe-study img,.pe-study-plate,.pe-services__visual-label,.pe-service,.pe-service__title,.pe-service__toggle,.pe-service__book) { transition-duration: var(--pf-plate); }
.pe-site .pe-anatomy .layers button { transition-duration: var(--pf-state); transition-timing-function: var(--pf-ease); }
.pe-site .pe-light .lt-active { transition-duration: var(--pf-light); transition-timing-function: var(--pf-ease); }
.pe-site .pe-light .lt-cta { transition-duration: var(--pf-feedback); }
@media(max-width:800px) {
  .pf-seam { height: 36px; }
  .pf-seam--anatomy-approach { height: 42px; }
  .pf-seam--approach-light { height: 64px; }
  .pf-seam--light-faq { height: 48px; }
  .pe-site .pe-anatomy .atlas { padding-block: 48px 36px; }
  .pe-site .faq { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 28px; }
}
@media(max-width:620px) {
  .pf-seam { height: 28px; }
  .pf-seam--anatomy-approach { height: 32px; }
  .pf-seam--approach-light { height: 48px; }
  .pf-seam--light-faq { height: 36px; }
  .pf-seam--approach-light .pf-seam__axis { top: 5px; bottom: 4px; }
  .pf-seam--light-faq .pf-seam__axis { top: 3px; bottom: 6px; }
  .pf-seam--services-anatomy .pf-seam__axis { left: var(--pe-gutter); }
  .pf-seam--approach-light .pf-seam__axis,.pf-seam--light-faq .pf-seam__axis { left: 72%; }
  .pe-site .pe-continuity { padding-block: 22px 18px; }
  .pe-site .pe-services { padding-top: 32px; }
  .pe-site .pe-anatomy .atlas { padding-block: 36px 32px; }
  .pe-site .pe-approach > .pe-shell { padding-bottom: 24px; }
  .pe-site .pe-light .lt-shell { padding-block: 22px 28px; }
  .pe-site .faq { display: block; padding-block: 32px 30px; }
  .pe-site .faq h2 { font-size: clamp(42px,12vw,60px); margin-bottom: 26px; }
  .pe-site .faq .eyebrow { margin-bottom: 20px; }
  .pe-site .faq summary { font-size: 13px; }
  .pe-site .cf-closing__inner { padding-block: 34px 44px; }
}
@media(prefers-reduced-motion:reduce) {
  .pe-site :is(.pe-hero,.pe-services,.pe-anatomy,.pe-approach,.pe-light,.faq,.cf-closing) *,
  .pe-site :is(.pe-hero,.pe-services,.pe-anatomy,.pe-approach,.pe-light,.faq,.cf-closing) *::before,
  .pe-site :is(.pe-hero,.pe-services,.pe-anatomy,.pe-approach,.pe-light,.faq,.cf-closing) *::after { animation: none !important; transition: none !important; }
}