/* Methodic — Pine / technical drawing study. Shared public-site theme. */
:root { color-scheme: light; --bg: #F8FAF7; --ink: #25312A; --muted: #617065; --line: #D9E2D9; --accent: #385E4A; --guide: #CFDCD1; --page-inset: 48px; }
.nav-cta, .btn-primary, .btn-submit { background: #DEEADF; color: #2A4535; border: 1px solid #CFDCD1; }
.nav-cta:hover, .btn-primary:hover, .btn-submit:hover { background: #CFDFD1; opacity: 1; }
.btn-secondary { border-color: var(--guide); }
.hero-glow, .pe-hero-glow { display: none; }
.hero, .pe-hero, .fd-hero { background-image: linear-gradient(var(--guide), var(--guide)), linear-gradient(var(--guide), var(--guide)); background-size: 1px 100%, 1px 100%; background-position: 32px 0, calc(100% - 32px) 0; background-repeat: no-repeat; border-bottom: 1px solid var(--guide); }
.hero::before, .pe-hero::before, .fd-hero::before { content: ''; position: absolute; pointer-events: none; top: 30px; bottom: 30px; right: 20%; width: 1px; background: repeating-linear-gradient(to bottom, var(--guide) 0 7px, transparent 7px 14px); opacity: .6; }
.hero::after, .pe-hero::after, .fd-hero::after { content: ''; position: absolute; pointer-events: none; inset: 0 24px auto; height: 8px; background: linear-gradient(var(--accent),var(--accent)) left top / 17px 1px no-repeat, linear-gradient(var(--accent),var(--accent)) right top / 17px 1px no-repeat; }
.process-section { background: #F8FAF7; }
.process-card { background: #EFF4EE; border-color: var(--guide); border-radius: 0; }
.process-number { border-color: #A6B8AB; }
.process-mark { text-shadow: none; }
.logo-mark { filter: brightness(0) saturate(100%) invert(26%) sepia(12%) saturate(1100%) hue-rotate(89deg) brightness(92%) contrast(87%); }
.field-wrap { border-color: var(--guide); }
.field-wrap:focus-within { border-color: var(--accent); }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
::selection { background: #DEEADF; color: #25312A; }
@media (max-width: 768px) {
 .hero, .pe-hero, .fd-hero { background-position: 12px 0, calc(100% - 12px) 0; }
 .hero::before, .pe-hero::before, .fd-hero::before { display: none; }
 .hero::after, .pe-hero::after, .fd-hero::after { inset-inline: 4px; }
}

.thesis-band { background: #DEEADF; }
.thesis-band h2 { color: var(--ink); }
.thesis-band .lede, .thesis-band p, .thesis-band .section-eyebrow { color: #46574A; }