/*
Theme Name: Death & Dementia
Theme URI: https://deathndementia.com/
Author: Death & Dementia Editorial
Description: Penny-dreadful editorial theme for deathndementia.com — a dark-curiosity magazine of strange deaths, true crime, folklore and the unexplained. Matte-ink tabloid archetype.
Version: 1.0.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: deathndementia
Tags: custom-menu, featured-images, custom-post-types
*/

/* ============================================================
   Death & Dementia — Matte Ink Tabloid
   Tokens
   ============================================================ */
:root{
  --dd-ink:#141013;        /* matte warm near-black field */
  --dd-ink-2:#1c171a;      /* raised panel */
  --dd-ink-3:#0d0a0c;      /* recessed / drawer */
  --dd-bone:#e8e2d4;       /* bone ivory text */
  --dd-bone-soft:rgba(232,226,212,.72);
  --dd-bone-faint:rgba(232,226,212,.20);
  --dd-blood:#7a1620;      /* sanguine oxblood */
  --dd-blood-deep:#5a0f18;
  --dd-mustard:#c8952f;    /* aged jaundice */
  --dd-rule:rgba(232,226,212,.20);
  --dd-maxw:1400px;
  --dd-display:'Bebas Neue',Impact,'Haettenschweiler','Arial Narrow Bold',sans-serif;
  --dd-body:'Old Standard TT',Georgia,'Times New Roman',serif;
  /* signature motion: "creak" — weighted, slow-in, no bounce */
  --dd-creak:cubic-bezier(.7,0,.25,1);
  --dd-creak-slow:cubic-bezier(.82,0,.2,1);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background-color:var(--dd-ink);
  color:var(--dd-bone);
  font-family:var(--dd-body);
  font-size:18px;
  line-height:1.6;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4,h5{margin:0 0 .4em;font-weight:400}

/* film grain overlay */
.dd-grain{
  pointer-events:none;position:fixed;inset:0;width:100%;height:100%;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  opacity:.10;z-index:100;mix-blend-mode:multiply;
}
.dd-half{background-image:radial-gradient(circle,#000 1px,transparent 1px);background-size:3px 3px}

.dd-wrap{max-width:var(--dd-maxw);margin:0 auto;width:100%}
.dd-shell{min-height:100vh;display:flex;flex-direction:column;position:relative}
.dd-display{font-family:var(--dd-display);letter-spacing:-.01em;line-height:.9}
.dd-serif{font-family:var(--dd-body)}
.dd-skip{position:absolute;left:-9999px}
.dd-skip:focus{left:8px;top:8px;z-index:200;background:var(--dd-mustard);color:#000;padding:8px 14px}

/* ============================================================
   Header / masthead
   ============================================================ */
.dd-masthead{border-bottom:8px solid var(--dd-bone);background:var(--dd-blood);position:sticky;top:0;z-index:50}
.dd-topbar{display:flex;justify-content:space-between;align-items:center;gap:1rem;
  padding:.45rem 1.5rem;border-bottom:1px solid var(--dd-bone-faint);
  font-family:var(--dd-display);font-size:.72rem;letter-spacing:.35em;text-transform:uppercase;color:var(--dd-bone)}
.dd-topbar span:nth-child(2){opacity:.85}
.dd-brandrow{padding:1.4rem 1.5rem;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.25rem}
.dd-brand{display:flex;align-items:center;gap:.9rem;text-decoration:none}
.dd-brand__mark{flex:0 0 auto;width:64px;height:64px}
.dd-brand__mark svg{width:100%;height:100%;display:block}
.dd-brand__words{display:flex;flex-direction:column;line-height:.82}
.dd-brand__name{font-family:var(--dd-display);font-size:clamp(2.6rem,6vw,4.6rem);color:var(--dd-mustard);letter-spacing:-.005em}
.dd-brand__tag{font-family:var(--dd-body);font-style:italic;font-weight:700;text-transform:uppercase;
  letter-spacing:.32em;font-size:.7rem;color:var(--dd-bone);margin-top:2px}
.dd-cta{display:inline-block;background:var(--dd-mustard);color:#000;text-decoration:none;
  font-family:var(--dd-display);font-size:1.4rem;letter-spacing:.02em;padding:.55rem 1.4rem;
  border:0;cursor:pointer;transition:transform .25s var(--dd-creak),background-color .25s var(--dd-creak)}
.dd-cta:hover,.dd-cta:focus{background:var(--dd-bone);transform:rotate(-1deg)}

/* primary nav */
.dd-nav{background:var(--dd-bone);color:#000;display:flex;flex-wrap:wrap;border-top:1px solid #000}
.dd-nav a{flex:1 1 auto;text-align:center;text-decoration:none;color:#000;
  font-family:var(--dd-display);font-size:1.15rem;letter-spacing:.03em;
  padding:.4rem 1rem;border-right:1px solid #000;transition:background-color .2s var(--dd-creak)}
.dd-nav a:last-child{border-right:0}
.dd-nav a:hover,.dd-nav a:focus,.dd-nav .current-menu-item>a{background:var(--dd-mustard)}
.dd-navtoggle{display:none}

/* ============================================================
   Main grid / hero
   ============================================================ */
.dd-main{max-width:var(--dd-maxw);margin:0 auto;width:100%;display:grid;grid-template-columns:2fr 1fr;
  gap:0;border-left:1px solid var(--dd-rule);border-right:1px solid var(--dd-rule);flex:1 0 auto}
.dd-lead{grid-column:1;padding:2rem;border-right:1px solid var(--dd-rule);border-bottom:1px solid var(--dd-rule)}
.dd-aside{grid-column:2;display:flex;flex-direction:column}

.dd-kicker{display:inline-block;background:var(--dd-mustard);color:#000;
  font-family:var(--dd-display);font-size:1.05rem;letter-spacing:.05em;padding:.15rem .6rem;margin-bottom:.6rem}
.dd-lead h1,.dd-lead__title{font-family:var(--dd-display);color:var(--dd-bone);
  font-size:clamp(3rem,7vw,7rem);line-height:.88;margin:.1em 0 .35em}
.dd-lead__title a{text-decoration:none}
.dd-em{color:var(--dd-blood)}
.dd-standfirst{font-size:1.35rem;font-style:italic;color:var(--dd-bone-soft);max-width:40ch;line-height:1.35;margin:0 0 1.2rem}
.dd-leadgrid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start;border-top:2px solid var(--dd-bone);padding-top:1.5rem}
.dd-figure{background:var(--dd-bone);padding:5px;transform:rotate(-1deg);box-shadow:0 20px 40px rgba(0,0,0,.5)}
.dd-figure__inner{background:var(--dd-ink-3);position:relative;overflow:hidden;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center}
.dd-figure img{width:100%;height:100%;object-fit:cover}
.dd-infographic{background:transparent;padding:0;transform:none;box-shadow:none;max-width:820px;margin:2rem auto}
.dd-infographic img{height:auto;object-fit:contain}
.dd-figcap{font-family:var(--dd-body);font-size:.92rem;color:var(--dd-bone);opacity:.72;font-style:italic;margin-top:.55rem;text-align:center}
/* Homepage + hub hero bands */
.dd-home-hero{position:relative;margin:0 0 2.2rem;overflow:hidden;border-bottom:3px solid var(--dd-blood)}
.dd-home-hero img{width:100%;height:clamp(240px,42vw,440px);object-fit:cover;display:block;filter:saturate(.92) contrast(1.03)}
.dd-home-hero__veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,16,19,.15) 0%,rgba(20,16,19,.35) 55%,rgba(20,16,19,.92) 100%)}
.dd-home-hero__line{position:absolute;left:0;right:0;bottom:1.1rem;margin:0 auto;max-width:60ch;padding:0 1.2rem;text-align:center;font-family:var(--dd-body);font-style:italic;font-size:clamp(1rem,2.4vw,1.35rem);color:var(--dd-bone);text-shadow:0 2px 12px rgba(0,0,0,.8)}
.dd-hubhero{margin:0 0 1.6rem;overflow:hidden;border-bottom:3px solid var(--dd-blood)}
.dd-hubhero img{width:100%;height:clamp(200px,34vw,360px);object-fit:cover;display:block;filter:saturate(.92) contrast(1.03)}
.dd-caption{font-size:.85rem;font-style:italic;color:var(--dd-bone-soft);border-left:2px solid var(--dd-blood);padding-left:1rem;margin-top:1rem}
.dd-subhead{font-family:var(--dd-display);font-size:2rem;color:var(--dd-mustard);border-bottom:1px solid var(--dd-blood);padding-bottom:.25rem;margin-bottom:.75rem}
.dd-lead__body p{margin:0 0 1rem;line-height:1.65}
.dd-blockquote{font-weight:700;font-style:italic}
.dd-readmore{display:block;text-align:center;background:var(--dd-bone);color:#000;text-decoration:none;
  padding:.9rem 1rem;font-family:var(--dd-display);font-size:1.7rem;margin-top:1rem;
  transition:background-color .25s var(--dd-creak)}
.dd-readmore:hover,.dd-readmore:focus{background:var(--dd-mustard)}

/* ============================================================
   Cabinet of Curiosities
   ============================================================ */
.dd-cabinet{padding:2rem;background:rgba(0,0,0,.35);border-bottom:1px solid var(--dd-rule);flex:1 0 auto}
.dd-cabinet__title{font-family:var(--dd-display);font-size:2.6rem;color:var(--dd-mustard);text-align:center;margin-bottom:1.2rem}
.dd-drawers{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.dd-drawer{position:relative;border:1px solid var(--dd-bone-faint);background:var(--dd-ink-3);aspect-ratio:1/1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;padding:1rem;
  text-decoration:none;color:var(--dd-bone);text-align:center;overflow:hidden;
  transition:background-color .3s var(--dd-creak),transform .45s var(--dd-creak-slow)}
.dd-drawer__icon{width:38px;height:38px}
.dd-drawer__icon svg{width:100%;height:100%}
.dd-drawer__label{font-size:.62rem;font-weight:700;letter-spacing:.02em;text-transform:uppercase;font-family:var(--dd-body)}
.dd-drawer__pull{position:absolute;left:50%;bottom:6px;transform:translateX(-50%);width:22px;height:4px;border-radius:2px;background:var(--dd-bone-faint)}
.dd-drawer:hover,.dd-drawer:focus{background:var(--dd-blood)}
.dd-drawer:hover .dd-drawer__pull{background:var(--dd-mustard)}
/* signature: drawer creak-open when randomly pulled */
.dd-drawer.is-pulled{transform:translateY(10px) scale(1.04);background:var(--dd-blood);z-index:2;box-shadow:0 18px 30px rgba(0,0,0,.6)}
.dd-random{display:block;width:100%;margin-top:1.5rem;padding:.9rem 1rem;background:var(--dd-mustard);color:#000;border:0;cursor:pointer;
  font-family:var(--dd-display);font-size:1.5rem;text-decoration:none;text-align:center;transform:skewX(-6deg);
  transition:transform .3s var(--dd-creak)}
.dd-random:hover,.dd-random:focus{transform:skewX(0)}

/* Curator card */
.dd-curator{padding:2rem;background:var(--dd-blood);border-bottom:1px solid var(--dd-rule)}
.dd-curator__row{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}
.dd-curator__portrait{width:80px;height:80px;border-radius:50%;border:2px solid var(--dd-bone);overflow:hidden;background:var(--dd-ink-3);flex:0 0 auto}
.dd-curator__portrait img,.dd-curator__portrait svg{width:100%;height:100%;object-fit:cover}
.dd-curator__name{font-family:var(--dd-display);font-size:1.8rem;color:var(--dd-mustard);line-height:1}
.dd-curator__role{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--dd-bone)}
.dd-curator__quote{font-style:italic;font-size:1.1rem;line-height:1.4;color:var(--dd-bone);margin:0}

/* ============================================================
   Article grid (cards)
   ============================================================ */
.dd-grid-sec{max-width:var(--dd-maxw);margin:0 auto;width:100%;border-left:1px solid var(--dd-rule);border-right:1px solid var(--dd-rule);background:rgba(0,0,0,.2)}
.dd-cards{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--dd-rule)}
.dd-card{padding:2rem;border-right:1px solid var(--dd-rule)}
.dd-card:last-child{border-right:0}
.dd-card__cat{display:inline-block;background:var(--dd-bone);color:#000;font-family:var(--dd-display);font-size:.9rem;padding:.05rem .5rem;margin-bottom:.6rem}
.dd-card__title{font-family:var(--dd-display);font-size:clamp(1.7rem,2.5vw,2.3rem);line-height:.92;margin-bottom:.7rem}
.dd-card__title a{text-decoration:none;transition:color .2s var(--dd-creak)}
.dd-card__title a:hover,.dd-card__title a:focus{color:var(--dd-blood)}
.dd-card__media{display:block;background:var(--dd-ink-3);height:12rem;margin-bottom:1rem;position:relative;overflow:hidden}
.dd-card__media img{width:100%;height:100%;object-fit:cover}
.dd-card__exhibit{position:absolute;left:1rem;top:1rem;font-family:var(--dd-display);color:var(--dd-bone);font-size:1.05rem}
.dd-card__exhibit::before{content:"";display:block;width:3rem;height:3px;background:var(--dd-mustard);margin-bottom:.35rem}
.dd-card__dek{font-size:.95rem;font-style:italic;color:var(--dd-bone-soft);line-height:1.5;margin:0}

/* section heading (generic) */
.dd-sechead{font-family:var(--dd-display);font-size:2.4rem;color:var(--dd-mustard);padding:1.5rem 2rem .5rem}

/* ============================================================
   Single article / pages
   ============================================================ */
.dd-article{max-width:820px;margin:0 auto;padding:2.5rem 1.5rem 3rem}
.dd-article__head{border-bottom:2px solid var(--dd-bone);padding-bottom:1.2rem;margin-bottom:1.6rem}
.dd-article__title{font-family:var(--dd-display);font-size:clamp(2.6rem,6vw,5rem);line-height:.9;color:var(--dd-bone);margin:.2em 0}
.dd-meta{font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dd-bone-soft);font-family:var(--dd-body)}
.dd-meta a{color:var(--dd-mustard);text-decoration:none}
.dd-prose{font-size:1.12rem;line-height:1.75}
.dd-prose p{margin:0 0 1.2rem}
.dd-prose h2{font-family:var(--dd-display);font-size:2.4rem;color:var(--dd-mustard);margin:2rem 0 .6rem;letter-spacing:.005em}
.dd-prose h3{font-family:var(--dd-display);font-size:1.8rem;color:var(--dd-bone);margin:1.6rem 0 .5rem}
.dd-prose a{color:var(--dd-mustard);text-underline-offset:3px}
.dd-prose blockquote{border-left:4px solid var(--dd-blood);margin:1.5rem 0;padding:.4rem 0 .4rem 1.2rem;font-style:italic;color:var(--dd-bone)}
.dd-prose img{margin:1.5rem 0}
.dd-prose ul,.dd-prose ol{margin:0 0 1.2rem;padding-left:1.3rem}
.dd-prose li{margin:.3rem 0}
.dd-prose figure{margin:1.8rem 0}
.dd-prose figcaption{font-size:.85rem;font-style:italic;color:var(--dd-bone-soft);margin-top:.4rem}

/* site-specific "dispatch note" callout (replaces AI-slop border-l-4 tint box) */
.dd-dispatch{position:relative;background:var(--dd-ink-2);border-top:3px solid var(--dd-blood);border-bottom:3px solid var(--dd-blood);
  padding:1.4rem 1.4rem 1.4rem 3.2rem;margin:1.8rem 0}
.dd-dispatch::before{content:"";position:absolute;left:1rem;top:1.5rem;width:24px;height:24px;
  background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c8952f' stroke-width='1.6'%3E%3Cpath d='M12 2v6M12 8l3 3M12 8l-3 3M5 21h14M8 21l1-6h6l1 6'/%3E%3C/svg%3E")}
.dd-dispatch__label{display:block;font-family:var(--dd-display);font-size:1.15rem;letter-spacing:.06em;color:var(--dd-mustard);margin-bottom:.2rem}
.dd-dispatch p{margin:0;font-style:italic}

/* FAQ accordion */
.dd-faq{margin:2rem 0}
.dd-faq details{border-bottom:1px solid var(--dd-rule)}
.dd-faq summary{cursor:pointer;list-style:none;padding:1rem 2rem 1rem 0;position:relative;
  font-family:var(--dd-display);font-size:1.5rem;color:var(--dd-bone)}
.dd-faq summary::-webkit-details-marker{display:none}
.dd-faq summary::after{content:"+";position:absolute;right:.2rem;top:.9rem;color:var(--dd-mustard);font-size:1.6rem;transition:transform .3s var(--dd-creak)}
.dd-faq details[open] summary::after{content:"\2013"}
.dd-faq__body{padding:0 0 1.1rem;color:var(--dd-bone-soft)}

/* ============================================================
   Footer — The Midnight Letter
   ============================================================ */
.dd-foot{background:var(--dd-blood);border-top:8px solid var(--dd-bone);padding:3.5rem 0 2rem;margin-top:auto}
.dd-foot__grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:3rem;padding:0 1.5rem;margin-bottom:3rem}
.dd-foot__lead h2{font-family:var(--dd-display);font-size:clamp(2.6rem,6vw,5rem);color:var(--dd-mustard);margin:0 0 .3em}
.dd-foot__lead p{font-size:1.25rem;color:var(--dd-bone);max-width:32ch;margin:0 0 1.2rem}
.dd-signup{display:flex;flex-wrap:wrap;gap:.8rem}
.dd-signup input{flex:1 1 200px;background:rgba(232,226,212,.1);border:3px solid var(--dd-bone);padding:.8rem;
  color:var(--dd-bone);font-family:var(--dd-display);font-size:1.3rem}
.dd-signup input::placeholder{color:var(--dd-bone-faint)}
.dd-signup input:focus{background:var(--dd-bone);color:#000;outline:none}
.dd-signup button{background:var(--dd-mustard);color:#000;border:0;padding:.8rem 1.5rem;font-family:var(--dd-display);font-size:1.5rem;cursor:pointer}
.dd-foot h3{font-family:var(--dd-display);font-size:1.7rem;color:var(--dd-mustard);margin-bottom:.8rem}
.dd-foot ul{list-style:none;margin:0;padding:0;font-family:var(--dd-display);font-size:1.25rem}
.dd-foot li{margin:.25rem 0}
.dd-foot a{text-decoration:none}
.dd-foot__mono{display:flex;flex-direction:column;align-items:flex-end;justify-content:center}
.dd-foot__logo{font-family:var(--dd-display);font-size:4.5rem;color:var(--dd-bone);line-height:.8}
.dd-foot__bar{border-top:1px solid var(--dd-bone-faint);padding:1.5rem;display:flex;flex-wrap:wrap;gap:1rem;
  justify-content:space-between;font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;font-weight:700}
.dd-foot__bar .dd-social{display:flex;gap:1.5rem}

/* ============================================================
   Signature link treatment: "ink-bleed" (spreading stain underline)
   ============================================================ */
.dd-inklink{text-decoration:none;background-image:linear-gradient(var(--dd-mustard),var(--dd-mustard));
  background-repeat:no-repeat;background-position:0 100%;background-size:0% 0.14em;
  transition:background-size .35s var(--dd-creak),color .2s var(--dd-creak)}
.dd-inklink:hover,.dd-inklink:focus{background-size:100% 0.14em;color:var(--dd-mustard)}

/* ============================================================
   Signature reveal: "unshroud" (fade + de-blur + rise)
   ============================================================ */
/* no-JS-safe: only hide when JS is present (html.dd-js), reveal on scroll */
.dd-js .dd-unshroud{opacity:0;filter:blur(6px);transform:translateY(14px);
  transition:opacity .7s var(--dd-creak-slow),filter .7s var(--dd-creak-slow),transform .7s var(--dd-creak-slow)}
.dd-js .dd-unshroud.is-seen{opacity:1;filter:blur(0);transform:none}

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width:1000px){
  .dd-main{grid-template-columns:1fr}
  .dd-lead,.dd-aside{grid-column:1}
  .dd-lead{border-right:0}
  .dd-cards{grid-template-columns:1fr}
  .dd-card{border-right:0;border-bottom:1px solid var(--dd-rule)}
  .dd-foot__grid{grid-template-columns:1fr;gap:2rem}
  .dd-foot__mono{align-items:flex-start}
}
@media (max-width:720px){
  .dd-leadgrid{grid-template-columns:1fr}
  .dd-navtoggle{display:block;width:100%;background:var(--dd-ink);color:var(--dd-bone);border:0;
    font-family:var(--dd-display);font-size:1.3rem;padding:.5rem;cursor:pointer;letter-spacing:.1em}
  .dd-nav{flex-direction:column;display:none}
  .dd-nav.is-open{display:flex}
  .dd-nav a{border-right:0;border-bottom:1px solid #000;flex:1 1 100%}
  .dd-topbar{font-size:.6rem;letter-spacing:.2em}
}

/* ============================================================
   Reduced motion — signatures degrade to instant
   ============================================================ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.001ms !important;animation-duration:.001ms !important}
  .dd-js .dd-unshroud{opacity:1;filter:none;transform:none}
  .dd-inklink{transition:none}
}
