/* ============================================================
   Will Solomon — Noir Dossier design system
   Blend of Dark Cinematic Noir + Field-Dossier Utilitarian
   ============================================================ */

:root{
  --black-bean:#380E06;
  --white-smoke:#F6F6F3;
  --blood-red:#5F0E07;
  --platinum:#D2D6DA;
  --rich-black:#001114;
  --ink:#0a0503;
  --gold:#E8A05C;      /* Nameless War accent */
  --teal:#6FBBB3;      /* Leaves accent */
  --cream:#F0E4D4;     /* Queen of Hearts accent */
  --line:rgba(246,246,243,0.2);
  --line-strong:rgba(246,246,243,0.3);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--rich-black);
  color:var(--white-smoke);
  font-family:Raleway,sans-serif;
  font-weight:300;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}

.wrap{max-width:1440px;margin:0 auto;}
.pad{padding-left:64px;padding-right:64px;}

/* ---------- type helpers ---------- */
.serif{font-family:'Sorts Mill Goudy',serif;}
.eyebrow{
  font-size:12px;letter-spacing:0.4em;text-transform:uppercase;
  color:var(--platinum);font-weight:200;
}
.rule{height:1px;background:var(--blood-red);width:64px;}
.rule-faint{height:1px;background:rgba(246,246,243,0.25);}

/* ---------- nav ---------- */
.nav{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 64px;height:84px;background:var(--rich-black);
  border-bottom:1px solid var(--line-strong);
}
.brand{display:flex;align-items:center;gap:12px;}
.brand img{height:34px;width:34px;object-fit:contain;}
.brand .name{font-family:'Sorts Mill Goudy',serif;font-size:19px;color:var(--white-smoke);line-height:1;letter-spacing:0.06em;}
.brand .sub{font-size:12px;letter-spacing:0.28em;text-transform:uppercase;color:var(--platinum);font-weight:200;margin-top:4px;}
.navlinks{display:flex;align-items:stretch;height:84px;font-size:10px;letter-spacing:0.3em;text-transform:uppercase;font-weight:200;}
.navlinks a{
  display:flex;align-items:center;padding:0 24px;
  border-left:1px solid rgba(246,246,243,0.15);color:var(--platinum);
  transition:background .2s,color .2s;
}
.navlinks a:last-child{border-right:1px solid rgba(246,246,243,0.15);}
.navlinks a:hover{color:var(--white-smoke);background:rgba(246,246,243,0.06);}
.navlinks a.active{color:var(--rich-black);background:var(--white-smoke);}
.navtoggle{display:none;background:none;border:1px solid var(--line-strong);color:var(--white-smoke);
  font-size:10px;letter-spacing:0.3em;text-transform:uppercase;padding:10px 16px;cursor:pointer;}

/* ---------- buttons ---------- */
.btn{
  display:inline-block;background:var(--blood-red);color:var(--white-smoke);
  font-size:12px;letter-spacing:0.28em;text-transform:uppercase;
  padding:17px 38px;font-weight:400;border:1px solid var(--blood-red);cursor:pointer;
  transition:filter .2s;
}
.btn:hover{filter:brightness(1.25);}
.btn-ghost{
  display:inline-block;color:var(--platinum);font-size:11px;letter-spacing:0.32em;
  text-transform:uppercase;padding:16px 38px;border:1px solid rgba(210,214,218,0.45);
  font-weight:200;background:none;cursor:pointer;transition:border-color .2s,color .2s;
}
.btn-ghost:hover{border-color:var(--white-smoke);color:var(--white-smoke);}
.stamp{
  font-size:12px;letter-spacing:0.28em;text-transform:uppercase;color:var(--white-smoke);
  font-weight:400;border:2px solid var(--blood-red);padding:6px 14px;
  background:rgba(95,14,7,0.25);display:inline-block;
}

/* ---------- section header (dossier divider) ---------- */
.sechead{display:flex;align-items:center;gap:20px;}
.sechead .line{height:1px;background:rgba(246,246,243,0.25);flex:1;}
.sechead .tag{font-size:12px;letter-spacing:0.28em;text-transform:uppercase;color:var(--white-smoke);
  font-weight:400;border:1px solid var(--blood-red);padding:5px 12px;flex:none;}

/* ---------- dossier / case-file cards ---------- */
.filegrid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;}
.file{
  border:1px solid var(--line-strong);background:rgba(246,246,243,0.03);
  display:flex;flex-direction:column;
}
.file-head{display:flex;align-items:center;justify-content:space-between;
  padding:13px 20px;border-bottom:1px solid var(--line-strong);}
.file-head .no{font-size:12px;letter-spacing:0.22em;text-transform:uppercase;color:var(--platinum);font-weight:300;}
.file-body{display:flex;flex-direction:column;gap:16px;padding:24px;align-items:center;text-align:center;}
.file-body img{width:170px;box-shadow:0 30px 60px rgba(0,0,0,0.8);border:1px solid rgba(246,246,243,0.15);}
.file-title{font-family:'Sorts Mill Goudy',serif;font-size:24px;color:var(--white-smoke);letter-spacing:0.03em;}
.file-hook{font-size:12px;line-height:1.7;color:var(--platinum);font-weight:200;}
.openfile{font-size:10px;letter-spacing:0.3em;text-transform:uppercase;color:var(--platinum);
  font-weight:300;border-bottom:1px solid var(--blood-red);padding-bottom:5px;}
.genre-fantasy{color:var(--gold);}
.genre-espionage{color:var(--teal);}
.genre-romance{color:var(--cream);}

/* ---------- forms ---------- */
.field{display:flex;flex-direction:column;gap:8px;margin-bottom:22px;}
.field label{font-size:12px;letter-spacing:0.28em;text-transform:uppercase;color:var(--platinum);font-weight:300;}
.field input,.field textarea,.field select{
  background:rgba(246,246,243,0.04);border:1px solid var(--line-strong);color:var(--white-smoke);
  font-family:Raleway,sans-serif;font-size:14px;font-weight:300;padding:14px 16px;outline:none;
  transition:border-color .2s;
}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--blood-red);}
.field textarea{resize:vertical;min-height:120px;}
.field input::placeholder,.field textarea::placeholder{color:rgba(210,214,218,0.4);}

/* ---------- footer ---------- */
.footer{
  background:var(--rich-black);border-top:1px solid var(--line);
  padding:34px 64px;display:flex;align-items:center;justify-content:space-between;
}
.footer .copy{display:flex;align-items:center;gap:10px;}
.footer .copy img{height:24px;width:24px;object-fit:contain;}
.footer .copy span{font-size:12px;color:var(--platinum);font-weight:200;letter-spacing:0.18em;text-transform:uppercase;}
.footer nav{display:flex;gap:28px;font-size:10px;letter-spacing:0.3em;text-transform:uppercase;color:var(--platinum);font-weight:200;}
.footer nav a:hover{color:var(--white-smoke);}

/* ---------- generic page header ---------- */
.pagehead{padding:80px 64px 40px;display:flex;flex-direction:column;gap:20px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,var(--rich-black) 0%,var(--ink) 100%);}
.pagehead h1{font-family:'Sorts Mill Goudy',serif;font-size:72px;line-height:1.02;margin:0;
  color:var(--white-smoke);letter-spacing:0.04em;}
.pagehead p{font-size:15px;line-height:1.8;color:var(--platinum);font-weight:200;max-width:640px;margin:0;}

/* ============================================================
   RESPONSIVE — collapse to mobile
   ============================================================ */
@media(max-width:1100px){
  .pad{padding-left:28px;padding-right:28px;}
  .nav{padding:0 24px;}
  .footer{padding:28px 24px;}
  .filegrid{grid-template-columns:1fr 1fr;}
}
@media(max-width:820px){
  .navlinks{
    display:none;position:absolute;top:84px;left:0;right:0;height:auto;
    flex-direction:column;background:var(--rich-black);border-bottom:1px solid var(--line-strong);
  }
  .navlinks.open{display:flex;}
  .navlinks a{height:auto;padding:18px 24px;border-left:none;border-top:1px solid rgba(246,246,243,0.1);}
  .navlinks a:last-child{border-right:none;}
  .navtoggle{display:block;}
  .pagehead{padding:48px 24px 32px;}
  .pagehead h1{font-size:44px;}
  .filegrid{grid-template-columns:1fr;}
  .footer{flex-direction:column;gap:20px;text-align:center;}
  .promo-band{grid-template-columns:1fr!important;justify-items:center;text-align:center;}
  .promo-band video{width:320px!important;}
}