body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;line-height:1.55;color:#111;background:#fafafa}
a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover{border-bottom-color:#111}
.container{max-width:940px;margin:0 auto;padding:1.25rem}
header{position:sticky;top:0;background:rgba(250,250,250,.94);backdrop-filter:blur(6px);border-bottom:1px solid #eee}
nav{display:flex;gap:1rem;flex-wrap:wrap}
h1{font-size:clamp(1.6rem,1.2rem + 1.2vw,2.3rem);line-height:1.2;margin:0.7em 0 .4em}
h2{font-size:clamp(1.2rem,1rem + .6vw,1.6rem);line-height:1.25;margin:1.2em 0 .4em}
p{margin:.7em 0}
.footer{border-top:1px solid #eee;margin-top:2rem;padding:1rem 0 2rem;color:#555}
.hero{padding:2rem 0 1rem}
.gallery{display:grid;grid-template-columns:1fr;gap:1rem}
@media(min-width:760px){.gallery{grid-template-columns:repeat(2,1fr)}}
.gallery img{width:100%;height:auto;display:block;border:1px solid #eee}
video{width:100%;max-height:70vh;display:block;margin:1rem 0;border:1px solid #ccc}

/* Frameless full-bleed video */
.section-video { margin: 0; padding: 0; }
.video-wrap { width: 100vw; margin-left: calc(50% - 50vw); background: transparent; display:block; }
.video-wrap video { width: 100vw; height: 100vh; display:block; border:0; outline:0; object-fit: contain; background:#fff; }

to { transform: translateX(-50%); }
}


/* Frameless HORSEOLOGY page */
.section-horseology { margin:0; padding:0; }
.horseology-wrap { width:100vw; margin-left:calc(50% - 50vw); text-align:center; background:#fff; }
.horseology-wrap img { width:100vw; height:auto; display:block; }


/* Full-bleed poem page */
.poem-full { margin: 0; padding: 0; }
.poem-full .wrap { width: 100vw; margin-left: calc(50% - 50vw); background: #fff; }
.poem-full figure { margin: 0; }
.poem-full img { display:block; width:100vw; height:auto; object-fit:contain; background:#fff; }
.poem-full figcaption { text-align: center; font-size: .95rem; color: #555; padding: .6rem 1rem 1.2rem; }


/* Hide native video controls/UI across browsers */
video::-webkit-media-controls { display: none !important; }
video::-webkit-media-controls-enclosure { display: none !important; }
video::-webkit-media-controls-panel { display: none !important; }
video::-moz-media-controls { display: none !important; }
video::-ms-media-controls { display: none !important; }
video { outline: 0; border: 0; }

/* center video */
.video-wrap { width: 100vw; margin-left: calc(50% - 50vw); background: transparent; display:block; }
.video-wrap video { width: 100vw; height: 100vh; display:block; border:0; outline:0; object-fit: contain; background:#fff; }


/* Full-bleed HORSEOLOGY image */
.poem-full { margin: 0; padding: 0; }
.poem-full .wrap { width: 100vw; margin-left: calc(50% - 50vw); background: #fff; }
.poem-full img { display:block; width:100vw; height:auto; object-fit:contain; background:#fff; }

5% { opacity: 1; }
  25% { opacity: 1; }
  30% { opacity: 0; }
  100% { opacity: 0; }
}
@media (max-width: 600px) {
  .hero-split { display:flex; flex-wrap:nowrap; flex-direction:row; gap:0.75rem; align-items:stretch; width:100%; height:100vh; margin-left:calc(50% - 50vw); padding:0 0.5rem; box-sizing:border-box; }
  .hero-split .bio-col, .hero-split .video-col { flex:0 0 88%; max-width:88%; display:flex; }
  .hero-split .video-wrap { width:100%; height:100vh; background: transparent; }
  .hero-split .video-wrap video { width:100%; height:100%; object-fit:contain; display:block; background: transparent; border:0; outline:0; }
}
}

/* Back link styling */
.back-link { position: fixed; top: 1rem; left: 1rem; font-size: 0.95rem; color: #333; text-decoration: none; opacity: 0; transition: opacity 0.3s; background: rgba(255,255,255,0.6); padding: 0.2rem 0.4rem; border-radius: 4px; }
.back-link:hover { opacity: 1; }
body:hover .back-link { opacity: 1; }

/* One-at-a-time FADE slideshow (no side-by-side) */
.slideshow { position: relative; width: 100%; height: 75vh; max-height: 900px; margin: 0 auto; overflow: hidden; background: #fff; }
.slideshow img { position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  object-fit: cover; opacity: 0; transition: opacity 1s linear; animation: slidefade 36s infinite; }
@keyframes slidefade {
  0% { opacity: 0; }
  5% { opacity: 1; }
  25% { opacity: 1; }
  30% { opacity: 0; }
  100% { opacity: 0; }
}
@media (max-width: 600px) {
  .hero-split { display:flex; flex-wrap:nowrap; flex-direction:row; gap:0.75rem; align-items:stretch; width:100%; height:100vh; margin-left:calc(50% - 50vw); padding:0 0.5rem; box-sizing:border-box; }
  .hero-split .bio-col, .hero-split .video-col { flex:0 0 88%; max-width:88%; display:flex; }
  .hero-split .video-wrap { width:100%; height:100vh; background: transparent; }
  .hero-split .video-wrap video { width:100%; height:100%; object-fit:contain; display:block; background: transparent; border:0; outline:0; }
} }

/* Blog-style stacked images */
.stack { max-width: 1100px; margin: 0 auto; }
.stack figure { margin: 0 0 2rem 0; }
.stack img { width: 100%; height: auto; display: block; }


/* Back link styling for plain pages */
.back-link { position: fixed; top: 1rem; left: 1rem; font-size: 0.95rem; color: #333; text-decoration: none;
  opacity: 0; transition: opacity 0.3s; background: rgba(255,255,255,0.6); padding: 0.2rem 0.4rem; border-radius: 4px; }
.back-link:hover { opacity: 1; }
body:hover .back-link { opacity: 1; }

/* poem scroll */
html, body { height: 100%; }
body { overflow-y: auto; }
.poem-full .wrap { width: 100vw; margin-left: calc(50% - 50vw); }

/* Force stacked images */
.stack { max-width: 1100px; margin: 0 auto; display: block; }
.stack figure { margin: 0 0 2rem 0; width: 100%; }
.stack img { display: block; width: 100%; height: auto; }

.video-wrap { position: relative; }
.video-overlay {
  position: absolute;
  top: 1rem;
  left: 1rem;
  max-width: 350px;
  background: rgba(255,255,255,0.7);
  padding: 0.5rem 0.8rem;
  font-size: 0.9rem;
  line-height: 1.4;
}




/* Full-screen background video hero */
.bg-hero { position: relative; width: 100vw; height: 100vh; overflow: hidden; margin-left: calc(50% - 50vw); background:black; }
.bg-hero .bg-video { position: absolute; top:6%; bottom:6%; left:20%; right:2%; object-fit: contain; background:black; box-shadow: 0 0 40px rgba(0,0,0,0.9); }
.hero-overlay { position: relative; z-index: 1; height: 100%; display: flex; align-items: flex-start; padding: 2rem; }
.hero-overlay .bio { max-width:650px; padding-left:2rem; padding-top:3rem; }
.hero-overlay .bio p { margin: 0 0 1rem 0; font-size: clamp(0.9rem, 0.9vw + 0.85rem, 1.15rem); line-height: 1.5; text-align: justify; text-justify: inter-word; color:white; max-width:650px; margin-right:3rem; }
.hero-overlay .bio a { text-decoration: underline; color:white; }

@media (max-width: 700px) {
  .hero-overlay { position: relative; z-index: 1; height: 100%; display: flex; align-items: flex-start; padding: 2rem; }
  .hero-overlay .bio p { margin: 0 0 1rem 0; font-size: clamp(0.9rem, 0.9vw + 0.85rem, 1.15rem); line-height: 1.5; text-align: justify; text-justify: inter-word; color:white; max-width:650px; margin-right:3rem; }
}

.video-caption { margin-top: 0.5rem; }
.video-caption p { text-align: center; font-size: 1.1rem; font-weight:500; margin: 0; color:white; }

/* Topics of interest black square */
.topics-square { width: 100vw; margin-left: calc(50% - 50vw); background: #000; color: #fff; }
.topics-square .topics-inner { max-width: 1100px; margin: 0 auto; padding: 2.5rem 1.25rem; }
.topics-square h2 { margin: 0 0 1rem 0; font-size: 1.25rem; font-weight: 600; }
.topics-square ul { list-style: none; padding: 0; margin: 0; }
.topics-square li { margin: 0.8rem 0; line-height: 1.8; color:#fff; }
@media (min-width: 900px) {
  .topics-square .topics-inner { padding: 3rem 1.5rem; }
  .topics-square h2 { font-size: 1.35rem; }
}


@media (min-width: 900px) {
  .topics-square ul {
    column-count: 2;
    column-gap: 3rem;
  }
  .topics-square li {
    break-inside: avoid;
  }
}