/* DJ in Depth revamp, Oct 2026.
   Loaded only on pages whose content contains "dj-page" (see functions.php).
   Everything is scoped to .dj-page so the rest of the site is untouched. */
.dj-page{
  --paper:#F1F3F1; --panel:#E3E8E6; --ink:#1C3346; --muted:#4E6170; --rule:#C8D1CE;
  --teal:#2D7672; --gold:#D9A42A; --on-teal:#FFFFFF;
  --display:"Bodoni Moda","Didot","Bodoni 72",Georgia,serif;
  --body:"Source Serif 4",Georgia,"Times New Roman",serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  background:var(--paper);color:var(--ink);font:400 1.06rem/1.65 var(--body);
}
.dj-page *{box-sizing:border-box}
.dj-page a{color:var(--teal)}
.dj-page a:focus-visible,.dj-page button:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:2px}
.dj-page p{margin:0 0 14px}
.dj-page .wrap{max-width:1080px;margin-inline:auto;padding-inline:clamp(16px,4vw,32px)}

.dj-page .hero{background:#111}
.dj-page .hero img{display:block;width:100%;height:auto;aspect-ratio:1600/401;object-fit:cover;object-position:center 30%;filter:sepia(.15)}
.dj-page .credit{font:400 .72rem/1.4 var(--mono);color:var(--muted);padding-top:6px;margin:0}
.dj-page .intro{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(20px,4vw,48px);padding-block:clamp(28px,5vw,52px) 8px;align-items:end}
.dj-page .eyebrow{font:500 .76rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--teal);margin:0 0 14px}
.dj-page h1{font:700 clamp(2.2rem,5.2vw,3.7rem)/1.04 var(--display);margin:0;text-wrap:balance;letter-spacing:-.005em;color:var(--ink)}
.dj-page h1 em{font-style:italic;font-weight:500}
.dj-page h2{font:700 clamp(1.6rem,3.4vw,2.3rem)/1.12 var(--display);margin:0 0 8px;text-wrap:balance;color:var(--ink)}
.dj-page h3{font:700 1.2rem/1.25 var(--display);margin:0;text-wrap:balance;color:var(--ink)}
.dj-page .lede{margin:18px 0 0;max-width:62ch}
.dj-page .ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.dj-page .btn{display:inline-flex;align-items:center;gap:10px;font:600 1rem/1 var(--body);padding:14px 22px;border-radius:3px;text-decoration:none;cursor:pointer;border:0}
.dj-page .btn.primary{background:var(--teal);color:var(--on-teal);box-shadow:inset 0 -3px 0 var(--gold)}
.dj-page .btn.primary:hover{filter:brightness(1.07);color:var(--on-teal)}
.dj-page .btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--rule)}
.dj-page .btn.ghost:hover{border-color:var(--teal)}

.dj-page .ledger{margin:0;display:grid;border-top:2px solid var(--ink)}
.dj-page .ledger div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid var(--rule);padding:9px 0}
.dj-page .ledger dt{font:400 .78rem/1.4 var(--mono);color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.dj-page .ledger dd{margin:0;font:600 1rem/1.4 var(--body);font-variant-numeric:tabular-nums;text-align:right}

.dj-page section{padding-block:clamp(36px,6vw,64px)}
.dj-page section + section{border-top:1px solid var(--rule)}
.dj-page .sub{color:var(--muted);margin:0 0 26px;max-width:62ch}
.dj-page .prose p{max-width:64ch}

.dj-page .stories{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:20px}
.dj-page .story{display:flex;flex-direction:column;text-decoration:none;color:var(--ink);background:var(--panel);border-radius:3px;overflow:hidden}
.dj-page .story img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:top;display:block}
.dj-page .story .txt{padding:14px 16px 16px;display:flex;flex-direction:column;gap:8px;flex:1}
.dj-page .cite{font:400 .72rem/1.45 var(--mono);color:var(--muted);letter-spacing:.02em}
.dj-page .story h3{font-size:1.18rem;line-height:1.2}
.dj-page .story p{margin:0;font-size:.95rem;line-height:1.5}
.dj-page .story .go{margin-top:auto;font:500 .76rem/1 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--teal);padding-top:6px}
.dj-page .story:hover h3{text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:4px}

.dj-page .split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:clamp(24px,5vw,56px);align-items:center}
.dj-page .split.flip{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}
.dj-page .split.top{align-items:start}
.dj-page figure{margin:0}
.dj-page figure img{width:100%;height:auto;display:block;border-radius:2px}
.dj-page figcaption{font:400 .72rem/1.4 var(--mono);color:var(--muted);padding-top:6px}
.dj-page .split p{max-width:60ch}
.dj-page .more{font:500 .8rem/1 var(--mono);text-transform:uppercase;letter-spacing:.08em}
.dj-page .tool{background:var(--panel);border-radius:3px;padding:clamp(20px,4vw,36px)}
.dj-page .tool ul{margin:0 0 18px;padding-left:1.1em}
.dj-page .tool li{margin-bottom:6px}
.dj-page img.who{width:min(187px,100%);border-radius:50%;aspect-ratio:1;object-fit:cover}
.dj-page img.who.big{width:min(260px,100%)}

.dj-page .chapters{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.dj-page .chapters li{display:grid;grid-template-columns:9.5rem minmax(0,1fr);gap:8px 24px;padding:16px 0;border-bottom:1px solid var(--rule);margin:0}
.dj-page .chapters .yrs{font:500 .85rem/1.5 var(--mono);color:var(--teal);font-variant-numeric:tabular-nums;padding-top:3px}
.dj-page .chapters h3{margin-bottom:4px}
.dj-page .chapters p{margin:0;max-width:62ch}

.dj-page .sources{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:16px}
.dj-page .source{border-top:2px solid var(--gold);padding-top:12px}
.dj-page .source p{margin:6px 0 0;font-size:.95rem;line-height:1.5}
.dj-page .thanks{columns:2 260px;column-gap:32px;padding-left:1.1em;margin:0}
.dj-page .thanks li{margin-bottom:6px;break-inside:avoid}

.dj-page .features{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:22px}
.dj-page .feature h3{font-size:1.1rem;margin-bottom:4px}
.dj-page .feature p{margin:0;font-size:.97rem;line-height:1.55}
.dj-page .shot{border:1px solid var(--rule);border-radius:4px;overflow:hidden;box-shadow:0 10px 30px -18px rgba(0,0,0,.45)}

.dj-page .contact{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.dj-page .addr{font:500 1.05rem/1 var(--mono);padding:12px 14px;border:1px dashed var(--rule);border-radius:3px;user-select:all}
.dj-page .pagehead{padding-block:clamp(32px,6vw,60px) clamp(20px,3vw,28px)}
.dj-page .pagehead .lede{font-size:1.12rem}
.dj-page .formslot{border:1px dashed var(--rule);border-radius:3px;padding:20px}

@media (max-width:760px){
  .dj-page .intro,.dj-page .split,.dj-page .split.flip{grid-template-columns:1fr}
  .dj-page .split.flip figure{order:-1}
  .dj-page .chapters li{grid-template-columns:1fr;gap:2px}
}
@media (prefers-reduced-motion:reduce){.dj-page *{transition:none!important}}

/* WPForms contact form inside the new design */
.dj-page .wpforms-container{margin:0;max-width:640px}
.dj-page .wpforms-container .wpforms-field{padding:0 0 14px}
.dj-page .wpforms-container .wpforms-field-label{font:500 .78rem/1.2 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--ink);margin-bottom:6px}
.dj-page .wpforms-container .wpforms-required-label{color:var(--teal)}
.dj-page .wpforms-container input[type=text],.dj-page .wpforms-container input[type=email],.dj-page .wpforms-container select,.dj-page .wpforms-container textarea{font:400 1rem/1.4 var(--body);padding:11px 12px;border:1px solid var(--rule);border-radius:3px;background:#fff;color:var(--ink);max-width:100%!important;width:100%}
.dj-page .wpforms-container textarea{min-height:150px}
.dj-page .wpforms-container input:focus,.dj-page .wpforms-container select:focus,.dj-page .wpforms-container textarea:focus{border-color:var(--teal);box-shadow:0 0 0 2px rgba(45,118,114,.2);outline:none}
.dj-page .wpforms-container button[type=submit]{font:600 1rem/1 var(--body);padding:14px 22px;border-radius:3px;border:0;background:var(--teal);color:var(--on-teal);box-shadow:inset 0 -3px 0 var(--gold);cursor:pointer}
.dj-page .wpforms-container button[type=submit]:hover{filter:brightness(1.07)}
.dj-page .wpforms-confirmation-container-full{background:var(--panel);border:1px solid var(--rule);color:var(--ink);border-radius:3px;padding:16px 18px}
.dj-page .wpforms-container label.wpforms-error,.dj-page .wpforms-container em.wpforms-error{font:400 .85rem/1.4 var(--body);color:#A33A2B}