/* One inherited clock keeps every section in the same eclipse phase. */
@property --night { syntax: '<percentage>'; inherits: true; initial-value: 0%; }
:root { --night:0%; animation:eclipse-cycle 40s infinite; }
@keyframes eclipse-cycle {
  0%,10%,100% { --night:0%; }
  24% { --night:18%; }
  35% { --night:55%; }
  45%,55% { --night:100%; }
  65% { --night:58%; }
  78% { --night:16%; }
  90% { --night:0%; }
}
body { isolation:isolate; }
/* Atmospheric shadow moves across the viewport; it never blurs the text. */
body::before {
 content:''; position:fixed; inset:-30vh -80vw; z-index:-1; pointer-events:none;
 background:radial-gradient(ellipse at center, #17273240 0%,#55647420 28%,transparent 62%);
 filter:blur(48px); transform:translateX(-65%); opacity:0;
 animation:eclipse-shadow 40s infinite;
}
@keyframes eclipse-shadow {
 0%,10% { transform:translateX(-65%); opacity:0; }
 30% { opacity:.7; }
 48%,52% { transform:translateX(0); opacity:.35; }
 70% { opacity:.7; }
 90%,100% { transform:translateX(65%); opacity:0; }
}
.hero__background { animation:eclipse-atmosphere 40s infinite; }
@keyframes eclipse-atmosphere {
 0%,10%,90%,100% { filter:sepia(.22) saturate(.7) brightness(1.25); }
 30%,70% { filter:sepia(.06) saturate(.4) brightness(.85) blur(1.4px); }
 45%,55% { filter:sepia(0) saturate(1) brightness(1); }
}
.hero__shade { background:linear-gradient(90deg,color-mix(in srgb,var(--bg) 88%,transparent),transparent 95%),linear-gradient(0deg,var(--bg),transparent 90%); }
.wordmark,.site-header nav a,.header-contact,.hero__bottom { color:var(--text); }
.hero h1 { text-shadow:none; }
.hero__intro,.hero__eyebrow { color:var(--text); }
.button { background:color-mix(in srgb,#174e52,#e6bd83 var(--night));border-color:color-mix(in srgb,#174e52,#efcc9b var(--night));color:color-mix(in srgb,#fffdf8,#17191d var(--night)); }
.button:hover { background:color-mix(in srgb,#0d393d,#f3d4a7 var(--night)); }
.text-cta:hover,.site-header nav a:hover,.header-contact:hover { color:var(--text); }
.mobile-action { background:var(--bg); }
/* Portrait artwork and its contact overlay retain their approved contrast. */
.interest-dialog { --night:100%; color-scheme:dark; }
@media(max-width:760px) {
 .hero__shade { background:linear-gradient(180deg,transparent 12%,color-mix(in srgb,var(--bg) 65%,transparent) 42%,var(--bg) 78%); }
 body::before { filter:blur(28px); }
}
@media(prefers-reduced-motion:reduce) {
 :root { animation:none; --night:100%; }
 body::before { display:none; }
 .hero__background { animation:none; }
}


/* Matched daylight/eclipsed plates: no dark image remains at full daylight. */
.hero__art--day { z-index:-4; }
.hero__art--day .hero__background { animation:none; filter:none; }
.hero__art--night { z-index:-3; opacity:var(--night); }
.site-header { background:transparent; border-bottom:0; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
.hero__shade { background:linear-gradient(90deg,color-mix(in srgb,var(--bg) 82%,transparent),transparent 86%),linear-gradient(0deg,var(--bg),transparent 36%); }
@media(max-width:760px) {
 .hero__shade { background:linear-gradient(180deg,transparent 20%,color-mix(in srgb,var(--bg) 40%,transparent) 46%,var(--bg) 82%); }
}