html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: #100e0c; color: #f3ede5; font-family: Archivo, Helvetica, Arial, sans-serif; }
* { box-sizing: border-box; }
img { display: block; max-width: 100%; }
button { font: inherit; color: inherit; }
a { color: #d8ab6b; text-decoration: none; }
a:hover { color: #c8714a; }
::selection { background: #c8714a; color: #100e0c; }

[data-reveal][data-anim] { opacity: 0; transform: translateY(20px); transition: opacity .8s ease, transform .8s cubic-bezier(.22,.61,.36,1); }
[data-reveal][data-anim].in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { [data-reveal][data-anim] { opacity: 1; transform: none; transition: none; } html { scroll-behavior: auto; } }

nav::-webkit-scrollbar { display: none; }
[data-yt] { transition: opacity .25s ease, border-color .25s ease; }
[data-yt]:hover { opacity: .92; }
article:hover, a[href$=".pdf"]:hover, a[target="_blank"]:hover { border-color: rgba(200,113,74,.5); }

.overlay { position: fixed; inset: 0; z-index: 100; background: rgba(9,8,7,.96); display: flex; flex-direction: column; padding: clamp(14px,2.6vw,36px); gap: 14px; }
.overlay[hidden] { display: none; }
.overlay--video { align-items: center; justify-content: center; overflow: auto; }
.overlay-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; max-width: 1180px; flex: 0 0 auto; }
.overlay-title { margin: 0; font-family: 'Instrument Serif', Georgia, serif; font-size: clamp(17px,2.2vw,26px); color: #f3ede5; }
.overlay-actions { display: flex; gap: 10px; }
.overlay-actions a, .overlay-actions button { border: 1px solid rgba(243,237,229,.3); border-radius: 2px; padding: 9px 16px; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; background: none; cursor: pointer; white-space: nowrap; }
.overlay-actions a { border-color: rgba(216,171,107,.45); }
.overlay-actions button:hover { border-color: #c8714a; color: #d8ab6b; }
#doc-frame { flex: 1 1 auto; min-height: 0; width: 100%; border: 1px solid rgba(243,237,229,.14); background: #1a1714; }
.video-box { width: 100%; max-width: min(1180px, calc((100dvh - 190px) * 16 / 9)); aspect-ratio: 16/9; max-height: calc(100dvh - 190px); background: #000; border: 1px solid rgba(243,237,229,.14); }
.video-box iframe { width: 100%; height: 100%; border: 0; display: block; }