/* THE DARK THRESHOLD — shared design system
   Alden Cross · quiet horror · deep black + blood red + Cormorant Garamond */
:root{
  --black:#08080a;
  --coal:#0e0e12;
  --smoke:#16161c;
  --bone:#e8e4da;
  --ash:#8a8794;
  --blood:#8f1d1d;
  --blood-dim:rgba(143,29,29,.12);
  --line:rgba(232,228,218,.08);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--black);
  color:var(--bone);
  font-family:'Inter',sans-serif;
  font-weight:300;
  line-height:1.75;
  letter-spacing:.01em;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.05;
  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.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.wrap{max-width:1100px;margin:0 auto;padding:0 28px;position:relative;z-index:1;}

/* ---------- nav ---------- */
nav{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(8,8,10,.75);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);}
nav .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;max-width:1100px;}
.brand{font-family:'Cormorant Garamond',serif;font-size:1.35rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--bone);text-decoration:none;}
.brand em{font-style:normal;color:var(--blood);}
nav .links a{color:var(--ash);text-decoration:none;margin-left:30px;font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;transition:color .25s;}
nav .links a:hover{color:var(--bone);}
nav .links a.active{color:var(--bone);}

/* ---------- shared bits ---------- */
.kicker{font-size:.7rem;letter-spacing:.32em;text-transform:uppercase;color:var(--blood);margin-bottom:18px;font-weight:500;}
.btn{
  display:inline-block;padding:16px 38px;text-decoration:none;font-size:.78rem;
  letter-spacing:.18em;text-transform:uppercase;font-weight:500;transition:all .3s;border:none;cursor:pointer;
}
.btn-solid{background:var(--blood);color:#fff;box-shadow:0 8px 40px rgba(143,29,29,.35);}
.btn-solid:hover{background:#a52222;transform:translateY(-2px);}
.btn-line{border:1px solid var(--line);color:var(--bone);background:none;}
.btn-line:hover{border-color:var(--blood);color:var(--blood);}
a{color:var(--blood);text-decoration:none;}
a:hover{color:#a52222;}

/* ---------- page header ---------- */
.page-head{padding:150px 0 60px;}
.page-head h1{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:clamp(2.2rem,5vw,3.4rem);line-height:1.12;margin-bottom:22px;}
.page-head .lead{color:var(--ash);font-size:1.02rem;max-width:680px;}
.page-head .byline{font-size:.76rem;letter-spacing:.22em;text-transform:uppercase;color:var(--bone);opacity:.7;margin-bottom:26px;}
.page-head .byline span{color:var(--blood);}

/* ---------- story cards (free library) ---------- */
.free-list{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:20px;}
.fcard{background:var(--black);padding:44px;transition:background .3s;position:relative;overflow:hidden;}
.fcard:hover{background:var(--coal);}
.fcard .num{font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--blood);font-size:.9rem;margin-bottom:16px;letter-spacing:.06em;}
.fcard h3{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:1.45rem;margin-bottom:14px;line-height:1.3;}
.fcard p{color:var(--ash);font-size:.92rem;line-height:1.7;margin-bottom:20px;}
.fcard .free-badge{display:inline-block;font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--blood);border:1px solid var(--blood);padding:5px 12px;margin-bottom:18px;}
.fcard .readmore{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--bone);border-bottom:1px solid var(--blood);padding-bottom:3px;}
.fcard .readmore:hover{color:var(--blood);}

/* ---------- full story reading page ---------- */
.reader{padding:150px 0 40px;}
.story-title{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:clamp(2rem,4.5vw,3rem);line-height:1.15;margin-bottom:14px;}
.story-meta{font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ash);margin-bottom:44px;}
.story-meta span{color:var(--blood);}
.rule{width:70px;height:1px;background:var(--blood);margin:0 0 44px;}
.story-body{max-width:720px;font-family:'Cormorant Garamond',serif;font-size:1.22rem;line-height:1.85;color:var(--bone);}
.story-body p{margin-bottom:1.5em;}
.story-body p:first-of-type::first-letter{
  font-size:3.6rem;float:left;line-height:.82;padding:6px 12px 0 0;color:var(--blood);font-weight:600;
}
.story-body em{color:var(--ash);}
.story-end{max-width:720px;margin-top:50px;padding-top:36px;border-top:1px solid var(--line);color:var(--ash);font-size:.9rem;font-style:italic;}

/* ---------- CTA band ---------- */
.cta-band{background:var(--coal);border:1px solid var(--line);padding:70px 50px;text-align:center;position:relative;overflow:hidden;margin:90px 0 0;}
.cta-band::before{content:"\201C";position:absolute;top:-30px;left:20px;font-family:'Cormorant Garamond',serif;font-size:9rem;color:var(--blood);opacity:.12;line-height:1;}
.cta-band h2{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:2rem;margin-bottom:16px;}
.cta-band p{color:var(--ash);margin-bottom:30px;font-size:.98rem;}
.cta-band .amount{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:3.2rem;line-height:1;margin-bottom:6px;}
.cta-band .amount small{font-size:.95rem;color:var(--ash);font-weight:300;letter-spacing:.1em;}
.cta-row{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-top:8px;}

/* ---------- newsletter ---------- */
.news{text-align:center;padding:90px 0 50px;border-top:1px solid var(--line);}
.news h2{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:2.1rem;margin-bottom:16px;}
.news p.sub{color:var(--ash);margin-bottom:34px;}
.news form{display:flex;gap:12px;justify-content:center;max-width:480px;margin:0 auto;}
.news input[type="email"]{flex:1;padding:16px 20px;background:var(--coal);border:1px solid var(--line);color:var(--bone);font-family:'Inter',sans-serif;font-size:.95rem;outline:none;min-width:0;}
.news input[type="email"]:focus{border-color:var(--blood);}
.news .btn-solid{padding:16px 30px;}
.news .note{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ash);opacity:.6;margin-top:22px;}
.news .fine{margin-top:14px;font-size:.78rem;color:var(--ash);opacity:.75;}
.news-status{margin-top:18px;font-size:.85rem;letter-spacing:.02em;min-height:1.2em;}
.news-status.ok{color:#9fc29a;}
.news-status.err{color:#c77b6f;}

/* ---------- footer ---------- */
footer{padding:56px 0 76px;border-top:1px solid var(--line);text-align:center;color:var(--ash);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;}
footer a{color:var(--ash);text-decoration:none;margin:0 14px;transition:color .25s;}
footer a:hover{color:var(--bone);}

@media(max-width:860px){
  .free-list{grid-template-columns:1fr;}
  nav .links a{margin-left:16px;font-size:.68rem;}
  .news form{flex-direction:column;}
  .cta-band{padding:50px 26px;}
  .story-body{font-size:1.15rem;}
}