/*
Theme Name: The Cowboy Doctor — Ranch Editorial
Description: Dark editorial single-page theme for "The Making of a Cowboy Doctor" by Kyle Ver Steeg, M.D. Landing gate, typewriter headline, album galleries.
Author: Studio of Books
Version: 1.5
*/

:root{
  --bg:#0e1216;
  --bg-2:#171c21;
  --fg:#e9e2d3;
  --ink:#18140f;
  --muted:#b9b2a0;
  --rust:#c1502e;
  --rust-deep:#9a3e23;
  --steel:#3a6b78;
  --steel-deep:#234750;
  --gold:#a6782a;
  --line: rgba(233,226,211,0.14);
  --shadow: rgba(0,0,0,0.5);
}
*{box-sizing:border-box;}
body{ margin:0; background:var(--bg); color:var(--fg); font-family:'Source Serif 4', Georgia, serif; font-size:1.06rem; line-height:1.7; }
h1,h2,h3{ margin:0; font-family:'Archivo', sans-serif; font-weight:900; letter-spacing:-0.01em; }
p{ margin:0 0 1.1em 0; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
.wrap{ max-width:1160px; margin:0 auto; padding:0 32px; }
.label{ font-family:'Archivo', sans-serif; font-weight:700; font-size:1.05rem; letter-spacing:0.02em; color:var(--rust); }

@keyframes kb{ from{ transform:scale(1); } to{ transform:scale(1.09); } }
.kb{ animation: kb 24s ease-in-out infinite alternate; }
@keyframes fadeUp{ from{ opacity:0; transform:translateY(20px); } to{ opacity:1; transform:translateY(0); } }
.fu{ opacity:0; animation: fadeUp .9s ease forwards; }
@keyframes drawLine{ to{ stroke-dashoffset:0; } }
@keyframes typeBlink{ 0%,49%{ opacity:1; } 50%,100%{ opacity:0; } }
#hero-typewriter .type-cursor{ display:inline-block; margin-left:2px; animation:typeBlink .9s step-end infinite; }
.ekg-path{ stroke-dasharray:340; stroke-dashoffset:340; animation: drawLine 2.2s ease forwards; animation-delay:.5s; }

/* ---------- Landing gate ---------- */
#titlepage{
  position:fixed; inset:0; z-index:999;
  background:var(--bg);
  display:flex; align-items:center; justify-content:center;
  transition:opacity 1s ease, visibility 1s ease;
}
#titlepage.hidden{ opacity:0; visibility:hidden; pointer-events:none; }
.tp-layout{ display:flex; align-items:center; justify-content:center; gap:56px; width:min(1360px,95vw); }
@media (max-width:820px){ .tp-layout{ flex-direction:column; gap:36px; } }
.tp-inner{ flex:1 1 480px; max-width:520px; text-align:left; padding:32px; opacity:0; animation:tpFade 1.4s ease forwards; }
@media (max-width:820px){ .tp-inner{ text-align:center; padding:32px 24px 0; } }
@keyframes tpFade{ to{ opacity:1; } }
.tp-cover{ flex:0 0 500px; width:500px; display:flex; align-items:flex-end; opacity:0; animation: tpCoverFade 1.3s ease 1.7s forwards; }
@media (max-width:820px){ .tp-cover{ width:320px; flex-basis:320px; } }
.tp-cover img{ display:block; box-shadow:0 30px 60px rgba(24,20,15,.28); }
.tp-cover .back{ width:42%; margin-right:-8%; transform:rotate(-3deg); }
.tp-cover .front{ width:58%; position:relative; z-index:2; }
@keyframes tpCoverFade{ from{ opacity:0; transform:scale(.94) translateY(16px); } to{ opacity:1; transform:scale(1) translateY(0); } }
.tp-vitals{ width:100%; height:120px; margin-bottom:6px; overflow:visible; }
.tp-vitals-line{ fill:none; stroke:var(--steel); stroke-width:2; stroke-dasharray:900; stroke-dashoffset:900; filter:drop-shadow(0 0 6px rgba(58,107,120,0.4)); animation:drawLine 3.2s ease-out forwards; }
.tp-ridge-line{ fill:none; stroke:var(--rust); stroke-width:2.2; stroke-dasharray:900; stroke-dashoffset:900; opacity:0; filter:drop-shadow(0 0 6px rgba(193,80,46,0.35)); animation:drawLine 2.6s ease-out 2.9s forwards, tpRidgeFade .1s linear 2.9s forwards; }
@keyframes tpRidgeFade{ to{ opacity:1; } }
.tp-readout{ display:flex; justify-content:space-between; font-family:'Archivo',sans-serif; font-weight:700; font-size:11px; letter-spacing:0.1em; color:var(--muted); margin-bottom:26px; opacity:0.85; font-variant-numeric:tabular-nums; text-transform:uppercase; }
.tp-title{ font-family:'Archivo',sans-serif; font-weight:900; letter-spacing:-0.01em; text-transform:uppercase; font-size:clamp(1.9rem,5.4vw,3.1rem); line-height:1.05; color:var(--fg); opacity:0; transform:translateY(10px); animation:tpRise 1s ease-out 3.3s forwards; }
.tp-sub{ margin-top:16px; font-family:'Source Serif 4',serif; font-style:italic; color:var(--muted); font-size:1.05rem; opacity:0; transform:translateY(10px); animation:tpRise 1s ease-out 3.7s forwards; }
@keyframes tpRise{ to{ opacity:1; transform:translateY(0); } }
#tp-enter{ margin-top:36px; opacity:0; transform:translateY(10px); animation:tpRise 1s ease-out 4.2s forwards; }
@media (prefers-reduced-motion:reduce){
  .tp-inner{ animation:none; opacity:1; }
  .tp-vitals-line,.tp-ridge-line,.tp-title,.tp-sub,#tp-enter,.tp-cover img{ animation:none!important; opacity:1!important; stroke-dashoffset:0!important; transform:none!important; }
}

.btn{ display:inline-flex; align-items:center; gap:8px; font-family:'Archivo', sans-serif; font-weight:700; font-size:0.92rem; padding:15px 30px; background:var(--fg); color:var(--ink); border:1px solid var(--fg); transition:background .2s,color .2s; }
.btn:hover{ background:transparent; color:var(--fg); }
.textlink{ font-family:'Archivo', sans-serif; font-weight:700; font-size:0.92rem; color:var(--rust-deep); border-bottom:2px solid var(--rust); padding-bottom:2px; }

header{ background:#637F9C; border-bottom:2px solid var(--ink); position:sticky; top:0; z-index:100; }
nav.wrap{ display:flex; align-items:center; justify-content:space-between; height:76px; }
.brand{
  font-family:'Archivo', sans-serif; font-weight:900; font-size:1.6rem;
  color:var(--gold);
  display:inline-block;
  background-size:cover; background-position:center 30%;
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}
.navlinks{ display:flex; gap:0; list-style:none; margin:0; padding:0; }
.navlinks a{ display:block; padding:10px 16px; font-family:'Archivo', sans-serif; font-weight:700; font-size:0.95rem; color:var(--muted); }
.navlinks a:hover{ color:var(--fg); }
.navlinks a.active{ color:var(--rust); }

/* Hero: surgical (steel) meets ranch (rust), split down the middle */
.hero{ position:relative; height:640px; overflow:hidden; }
.hero-split{ position:absolute; inset:0; display:grid; grid-template-columns:1fr 1fr; }
.hero-half{ position:relative; overflow:hidden; }
.hero-half img{ width:100%; height:100%; object-fit:cover; }
.hero-half.steel img{ filter:grayscale(1) contrast(1.1) brightness(.6); }
.hero-half.steel::after{ content:""; position:absolute; inset:0; background:var(--steel); mix-blend-mode:multiply; opacity:.55; }
.hero-half.rust img{ filter:grayscale(.6) contrast(1.08) brightness(.62); position:absolute; width:140%; max-width:140%; height:140%; top:-20%; left:-5%; }
.hero-half.rust::after{ content:""; position:absolute; inset:0; background:var(--rust); mix-blend-mode:multiply; opacity:.5; }
.hero-content{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; text-align:center; padding:70px 40px 0; z-index:2; }
.hero-content h1{ color:#fff; font-size:clamp(2.2rem,5vw,3.8rem); line-height:0.98; text-transform:uppercase; text-shadow:0 6px 30px rgba(0,0,0,.45); max-width:920px; }
.hero-content .byline{ margin-top:70px; margin-bottom:0; font-family:'Source Serif 4', serif; font-style:italic; font-size:2rem; color:#f0e8da; }
.hero-ctas{ margin-top:40px; display:flex; gap:22px; align-items:center; flex-wrap:wrap; justify-content:center; }
.hero-ctas .textlink{ color:#f0d8c8; border-color:rgba(240,216,200,.6); }

section{ padding:76px 0; scroll-margin-top:76px; }
.section-head{ margin-bottom:44px; text-align:center; }
.section-head h2{ font-size:clamp(1.7rem,3.4vw,2.4rem); text-transform:uppercase; }

#gallery{ background:var(--bg-2); border-top:2px solid var(--ink); border-bottom:2px solid var(--ink); }
.sheet{ display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--ink); }
.frame{ position:relative; aspect-ratio:4/3; overflow:hidden; }
.frame img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.frame:hover img{ transform:scale(1.08); }
.frame .tint{ display:none; }
.frame .cap{ position:absolute; left:10px; bottom:10px; color:#fff; font-family:'Archivo', sans-serif; font-weight:700; font-size:0.78rem; text-transform:uppercase; text-shadow:0 1px 4px rgba(0,0,0,0.6); }

/* Gallery albums */
.albums{ display:grid; grid-template-columns:repeat(4,1fr); gap:32px; }
@media (max-width:1024px){ .albums{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:760px){ .albums{ grid-template-columns:1fr; } }
.album-card{
  position:relative; background:var(--bg-2); border-radius:14px; overflow:hidden;
  box-shadow:0 6px 18px rgba(0,0,0,.35);
  transition:transform .3s ease, box-shadow .3s ease;
}
.album-card:hover{ transform:translateY(-10px) scale(1.03); box-shadow:0 26px 44px rgba(0,0,0,.55); }
.album-cover{ position:relative; aspect-ratio:4/3; overflow:hidden; }
.album-cover img{ width:100%; height:100%; object-fit:cover; object-position:center 30%; transition:transform .5s ease; }
.album-cover .tint{ display:none; }
.album-card:hover .album-cover img{ transform:scale(1.08); }
.album-card.open{ outline:2px solid var(--rust); outline-offset:-2px; }
.album-info{ padding:26px 28px 30px; text-align:center; }
.album-info h3{ font-family:'Source Serif 4', serif; font-weight:600; font-size:1.4rem; margin-bottom:14px; color:var(--fg); }
.album-info .album-desc{ font-size:0.94rem; line-height:1.6; color:var(--muted); margin:0 0 22px; }
.album-seeall{
  font-family:'Archivo', sans-serif; font-weight:700; font-size:0.76rem; letter-spacing:.06em; text-transform:uppercase;
  color:var(--rust); background:none; border:none; border-bottom:2px solid var(--rust);
  padding:0 0 3px; cursor:pointer; transition:color .2s ease, border-color .2s ease;
}
.album-seeall:hover{ color:var(--fg); border-color:var(--fg); }
.album-seeall .album-count{ font-weight:700; }
.album-detail[hidden]{ display:none; }
.album-detail-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--ink); margin-top:2px; }
.album-detail-grid.count-2{ grid-template-columns:repeat(2,1fr); }
.album-detail-grid.count-1{ grid-template-columns:minmax(0,360px); justify-content:center; }
@media (max-width:760px){
  .album-detail-grid{ grid-template-columns:repeat(2,1fr); }
  .album-detail-grid.count-1{ grid-template-columns:minmax(0,300px); }
}
.album-detail-grid .frame{ aspect-ratio:4/3; }

/* About: ranch photo as a literal full-bleed background */
#about{ position:relative; overflow:hidden; }
#about .bgphoto{ position:absolute; inset:0; z-index:0; }
#about .bgphoto img{ width:100%; height:100%; object-fit:cover; }
#about .scrim{ position:absolute; inset:0; background:linear-gradient(100deg, rgba(24,20,15,.94) 40%, rgba(24,20,15,.55)); z-index:1; }
#about .wrap{ position:relative; z-index:2; }
.about-grid{ display:grid; grid-template-columns:0.85fr 1.15fr; gap:56px; align-items:start; }
.about-portrait{ position:relative; border:3px solid var(--bg); }
.about-portrait img{ width:100%; }
.about-portrait .tint{ display:none; }
.pull{ font-family:'Archivo', sans-serif; font-weight:900; text-transform:uppercase; font-size:clamp(1.4rem,2.6vw,1.9rem); line-height:1.15; color:#fff; border-left:6px solid var(--rust); padding-left:22px; margin:26px 0; }
.about-copy p{ color:#e9e1d2; }
.about-copy .label{ color:var(--rust); }
.about-copy strong{ font-weight:600; color:#fff; }

#books{ background:var(--bg-2); border-top:2px solid var(--ink); border-bottom:2px solid var(--ink); }
.book-grid{ display:grid; grid-template-columns:0.9fr 1.1fr; gap:60px; align-items:center; }
.book-covers{ display:flex; align-items:flex-end; }
.book-covers img{ box-shadow:0 22px 46px var(--shadow); }
.book-covers .back{ width:42%; margin-right:-6%; transform:rotate(-2deg); }
.book-covers .front{ width:58%; position:relative; z-index:2; }
.book-copy h2{ font-size:clamp(1.6rem,3vw,2.1rem); text-transform:uppercase; margin-bottom:6px; }
.book-copy .subhead{ font-family:'Source Serif 4', serif; font-style:italic; color:var(--muted); margin-bottom:20px; }
.spec-list{ margin-top:24px; border-top:2px solid var(--ink); }
.spec-row{ display:flex; justify-content:space-between; padding:12px 0; border-bottom:1px solid var(--line); font-family:'Archivo', sans-serif; font-size:0.88rem; }
.spec-row .k{ color:var(--muted); font-weight:700; text-transform:uppercase; }

#buy{ background:var(--bg); }
.buy-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; border-top:2px solid var(--ink); }
.buy-col{ padding:30px 26px; border-right:1px solid var(--line); border-bottom:2px solid var(--ink); }
.buy-col:last-child{ border-right:none; }
.buy-col h4{ font-size:1.05rem; text-transform:uppercase; margin-bottom:10px; }
.buy-col p{ color:var(--muted); font-size:0.94rem; margin-bottom:18px; }
.isbn-line{ margin-top:34px; text-align:center; font-family:'Archivo', sans-serif; font-size:0.85rem; color:var(--muted); text-transform:uppercase; }
.isbn-line span{ color:var(--rust-deep); }

footer{ background:var(--ink); color:var(--fg); text-align:center; padding:34px 0; font-family:'Archivo', sans-serif; font-size:0.82rem; }

/* Custom cursor */
*{ cursor: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0OCIgaGVpZ2h0PSI1MiIgdmlld0JveD0iMCAwIDQ4IDUyIj4KICA8ZyB0cmFuc2Zvcm09InJvdGF0ZSgtMzUgMjQgMjYpIj4KICAgIDxsaW5lIHgxPSIyNCIgeTE9IjEuNSIgeDI9IjI0IiB5Mj0iMTUiIHN0cm9rZT0iI2M3YzdjNyIgc3Ryb2tlLXdpZHRoPSIzIiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4KICAgIDxyZWN0IHg9IjE5LjUiIHk9IjEzLjUiIHdpZHRoPSI5IiBoZWlnaHQ9IjYiIGZpbGw9IiNhNjc4MmEiIHN0cm9rZT0iIzE4MTQwZiIgc3Ryb2tlLXdpZHRoPSIxLjIiLz4KICAgIDxyZWN0IHg9IjE1IiB5PSIxOS41IiB3aWR0aD0iMTgiIGhlaWdodD0iMjEiIHJ4PSIzIiBmaWxsPSIjZTllMmQzIiBzdHJva2U9IiMxODE0MGYiIHN0cm9rZS13aWR0aD0iMi4yIi8+CiAgICA8cmVjdCB4PSIxNy4yNSIgeT0iMzAiIHdpZHRoPSIxMy41IiBoZWlnaHQ9IjguMjUiIGZpbGw9IiMzYTZiNzgiIG9wYWNpdHk9IjAuNTUiLz4KICAgIDxsaW5lIHgxPSIxNi4yIiB5MT0iMjQuNzUiIHgyPSIzMS44IiB5Mj0iMjQuNzUiIHN0cm9rZT0iIzE4MTQwZiIgc3Ryb2tlLXdpZHRoPSIxIi8+CiAgICA8bGluZSB4MT0iMTYuMiIgeTE9IjMwIiB4Mj0iMzEuOCIgeTI9IjMwIiBzdHJva2U9IiMxODE0MGYiIHN0cm9rZS13aWR0aD0iMSIvPgogICAgPGxpbmUgeDE9IjE2LjIiIHkxPSIzNS4yNSIgeDI9IjMxLjgiIHkyPSIzNS4yNSIgc3Ryb2tlPSIjMTgxNDBmIiBzdHJva2Utd2lkdGg9IjEiLz4KICAgIDxyZWN0IHg9IjIxLjc1IiB5PSI0MC41IiB3aWR0aD0iNC41IiBoZWlnaHQ9IjYiIGZpbGw9IiMxODE0MGYiLz4KICAgIDxlbGxpcHNlIGN4PSIyNCIgY3k9IjQ4IiByeD0iOC4yNSIgcnk9IjMiIGZpbGw9IiMxODE0MGYiLz4KICA8L2c+Cjwvc3ZnPgo="), auto; }
