/* Screenplay Format Guide — page-specific editorial refresh.
   Keep technical data, examples, links, metadata and interactions unchanged. */
body.page-screenplay-format {
  --format-ink: #111317;
  --format-yellow: #F8D000;
  --format-bg: #E2E4E9;
  --format-paper: #F0F2F5;
  --format-blue: #D6E4EE;
  --format-cream: #FFF6CF;
  color: var(--format-ink);
  background: var(--format-bg) !important;
}
body.page-screenplay-format > header {
  border-bottom: 1px solid rgba(17,19,23,.72) !important;
  box-shadow: 0 5px 20px rgba(17,19,23,.045) !important;
}
body.page-screenplay-format > header img[src*="drlogo"],
body.page-screenplay-format > footer img[src*="drlogo"],
body.page-screenplay-format > header img[alt*="DraftsRush"],
body.page-screenplay-format > footer img[alt*="DraftsRush"] {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  background: transparent !important;
  transform: none !important;
}
body.page-screenplay-format > header a[aria-label="DraftsRush Home"],
body.page-screenplay-format > footer a[aria-label="DraftsRush Home"] {
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  background: transparent !important;
}
body.page-screenplay-format main > div.max-w-4xl {
  max-width: 1120px !important;
  padding-top: clamp(2rem,4vw,3.5rem) !important;
  padding-bottom: clamp(3rem,6vw,5.5rem) !important;
}
body.page-screenplay-format main article {
  gap: clamp(2rem,4vw,3.25rem) !important;
}
body.page-screenplay-format main article > header {
  padding: clamp(1.5rem,4.2vw,3.5rem) !important;
  border: 1px solid rgba(17,19,23,.72) !important;
  border-radius: 24px !important;
  background: var(--format-paper) !important;
  box-shadow: 0 14px 34px rgba(17,19,23,.055) !important;
}
body.page-screenplay-format main article > header > div:first-child {
  display: inline-block;
  border-radius: 999px !important;
  background: var(--format-blue) !important;
  color: var(--format-ink) !important;
  border: 1px solid rgba(17,19,23,.2);
  letter-spacing: .08em;
}
body.page-screenplay-format main article > header h1 {
  font-size: clamp(2.25rem,5.3vw,4.4rem) !important;
  line-height: 1.02 !important;
  letter-spacing: -.065em !important;
  text-wrap: balance;
  max-width: 900px;
}
body.page-screenplay-format main article > header p {
  max-width: 780px;
  font-size: clamp(.98rem,1.3vw,1.1rem) !important;
  line-height: 1.75 !important;
}
body.page-screenplay-format main article > header > div:last-child {
  border-color: rgba(17,19,23,.18) !important;
  border-top-width: 1px !important;
  padding-top: 1.15rem !important;
  line-height: 1.8;
}
body.page-screenplay-format main article > section {
  border: 1px solid rgba(17,19,23,.55) !important;
  border-radius: 20px !important;
  box-shadow: 0 8px 24px rgba(17,19,23,.035) !important;
  padding: clamp(1.2rem,3.5vw,2.5rem) !important;
}
body.page-screenplay-format main article > section:nth-of-type(1) {
  background: var(--format-cream) !important;
}
body.page-screenplay-format main article > section:nth-of-type(1) .bg-black {
  background: var(--format-blue) !important;
  color: var(--format-ink) !important;
  border-radius: 999px !important;
}
body.page-screenplay-format main article > section h2 {
  font-size: clamp(1.35rem,2.7vw,2rem) !important;
  line-height: 1.12 !important;
  letter-spacing: -.045em !important;
  text-wrap: balance;
}
body.page-screenplay-format main article > section h3 {
  letter-spacing: -.035em;
  line-height: 1.2;
}
body.page-screenplay-format main article > section > div:first-child {
  border-color: rgba(17,19,23,.18) !important;
}
body.page-screenplay-format main article > section .bg-black.text-white,
body.page-screenplay-format main article > section span.bg-black {
  background: #E5E8ED !important;
  color: var(--format-ink) !important;
  border: 1px solid rgba(17,19,23,.2) !important;
  border-radius: 8px !important;
}
body.page-screenplay-format main article > section .overflow-x-auto {
  border: 1px solid rgba(17,19,23,.35) !important;
  border-radius: 12px !important;
  overflow-x: auto;
}
body.page-screenplay-format main article > section table thead {
  background: #D6E4EE !important;
  color: var(--format-ink) !important;
}
body.page-screenplay-format main article > section table thead th {
  border-color: rgba(17,19,23,.16) !important;
  font-weight: 800;
}
body.page-screenplay-format main article > section table tbody {
  background: #FBFCFD !important;
}
body.page-screenplay-format main article > section table tbody tr {
  border-color: rgba(17,19,23,.12) !important;
}
body.page-screenplay-format main article > section table tbody td {
  border-color: rgba(17,19,23,.12) !important;
  line-height: 1.55;
}
body.page-screenplay-format main article > section table tbody tr:hover {
  background: #FFF6CF !important;
}
body.page-screenplay-format main article > section .font-screenplay {
  border-radius: 12px;
}
body.page-screenplay-format main article > section a,
body.page-screenplay-format main article > section button,
body.page-screenplay-format main > div > div:first-child > a {
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}
body.page-screenplay-format main article > section a[class*="border-"],
body.page-screenplay-format main article > section button[class*="border-"],
body.page-screenplay-format main > div > div:first-child > a {
  border-width: 1px !important;
  border-radius: 999px !important;
  box-shadow: 0 3px 10px rgba(17,19,23,.045) !important;
}
body.page-screenplay-format main article > section a[class*="border-"]:hover,
body.page-screenplay-format main article > section button[class*="border-"]:hover,
body.page-screenplay-format main > div > div:first-child > a:hover {
  transform: translateY(-2px);
  box-shadow: 0 7px 16px rgba(17,19,23,.09) !important;
}
body.page-screenplay-format main article > section .border-b-2,
body.page-screenplay-format main article > section .border-t-2 {
  border-width: 1px !important;
  border-color: rgba(17,19,23,.16) !important;
}
body.page-screenplay-format main article > section .brutal-box,
body.page-screenplay-format main article > section .brutal-box-lg {
  box-shadow: 0 4px 14px rgba(17,19,23,.04) !important;
}
body.page-screenplay-format > footer {
  border-top: 1px solid rgba(17,19,23,.4) !important;
  box-shadow: none !important;
}
body.page-screenplay-format > footer > div > div:first-child {
  border-bottom: 1px solid rgba(17,19,23,.16) !important;
  border-top: 0 !important;
  box-shadow: none !important;
}
body.page-screenplay-format > footer > div > div:first-child > div:first-child,
body.page-screenplay-format > footer > div > div:first-child > div:first-child > a,
body.page-screenplay-format > footer > div > div:first-child > div:first-child > a img {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  transform: none !important;
}
body.page-screenplay-format > footer > div > div:first-child > div:last-child > span {
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  background: var(--format-yellow) !important;
}
body.page-screenplay-format > footer > div > div:first-child > div:last-child a {
  border: 1px solid rgba(17,19,23,.22) !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  background: rgba(240,242,245,.72) !important;
}
body.page-screenplay-format > footer > div > div:last-child {
  border-top: 1px solid rgba(17,19,23,.16) !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}
body.page-screenplay-format > footer .brutal-box,
body.page-screenplay-format > footer .brutal-box-lg {
  box-shadow: none !important;
}
body.page-screenplay-format > footer a[style*="background-color"] {
  background-color: #F0F2F5 !important;
}
@media (max-width: 640px) {
  body.page-screenplay-format main > div.max-w-4xl { padding-inline: 1rem !important; }
  body.page-screenplay-format main article > header { border-radius: 17px !important; }
  body.page-screenplay-format main article > section { border-radius: 15px !important; }
  body.page-screenplay-format main article > section table { min-width: 640px; }
}
@media (prefers-reduced-motion: reduce) {
  body.page-screenplay-format main a,
  body.page-screenplay-format main button { transition: none !important; }
}


/* Target the actual commercial CTA and return link (they are div wrappers, not sections). */
body.page-screenplay-format main .commercial-scriptwriting-cta {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: clamp(1.5rem,4vw,3.5rem) !important;
  padding: clamp(1.5rem,4vw,3rem) !important;
  border: 1px solid rgba(17,19,23,.62) !important;
  border-radius: 22px !important;
  background: #F8D000 !important;
  box-shadow: 0 8px 22px rgba(17,19,23,.045) !important;
}
body.page-screenplay-format main .commercial-scriptwriting-cta > div > span {
  display: inline-block;
  background: rgba(255,255,255,.58) !important;
  color: #111317 !important;
  border: 1px solid rgba(17,19,23,.2) !important;
  border-radius: 999px !important;
  padding: .4rem .7rem !important;
  letter-spacing: .07em;
}
body.page-screenplay-format main .commercial-scriptwriting-cta h2 {
  font-size: clamp(1.6rem,3.2vw,2.45rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -.05em !important;
  margin-top: 1rem !important;
  margin-bottom: .65rem !important;
}
body.page-screenplay-format main .commercial-scriptwriting-cta p {
  max-width: 650px !important;
  font-size: clamp(.95rem,1.35vw,1.1rem) !important;
  line-height: 1.7 !important;
}
body.page-screenplay-format main .commercial-scriptwriting-cta > a {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  padding: .95rem 1.4rem !important;
  background: #111317 !important;
  color: #fff !important;
  border: 1px solid #111317 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  white-space: nowrap;
}
body.page-screenplay-format main .commercial-scriptwriting-cta > a:hover {
  background: #292c32 !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(17,19,23,.13) !important;
}
body.page-screenplay-format main .screenplay-return-link {
  margin-top: 2.5rem !important;
}
body.page-screenplay-format main .screenplay-return-link > a {
  display: inline-flex !important;
  align-items: center;
  min-height: 48px;
  padding: .85rem 1.25rem !important;
  border: 1px solid rgba(17,19,23,.6) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  text-decoration: none;
}
body.page-screenplay-format main .screenplay-return-link > a:hover {
  background: #FFF6CF !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(17,19,23,.06) !important;
}
@media (max-width: 767px) {
  body.page-screenplay-format main .commercial-scriptwriting-cta {
    grid-template-columns: minmax(0,1fr) !important;
    align-items: start !important;
    border-radius: 16px !important;
  }
  body.page-screenplay-format main .commercial-scriptwriting-cta > a {
    width: fit-content;
    white-space: normal;
  }
}


/* Reduce nested-card clutter while preserving the primary outlined article sections and shared site shell. */
body.page-screenplay-format main article > section .font-screenplay {
  border: 1px solid rgba(17,19,23,.28) !important;
  box-shadow: none !important;
  background: #FAF9F5 !important;
  border-radius: 10px !important;
}
body.page-screenplay-format main article > section .overflow-x-auto {
  box-shadow: none !important;
}
body.page-screenplay-format main article > section .bg-white.border-black.rounded-xl.brutal-box {
  box-shadow: none !important;
}
body.page-screenplay-format main article > section .brutal-box,
body.page-screenplay-format main article > section .brutal-box-lg {
  box-shadow: none !important;
}
body.page-screenplay-format main article > section:last-of-type .space-y-3 > div {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(17,19,23,.16) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 0 1rem !important;
}
body.page-screenplay-format main article > section:last-of-type .space-y-3 > div:last-child {
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
}
body.page-screenplay-format main article > section:last-of-type .space-y-3 {
  gap: 1rem !important;
}
@media (max-width: 767px) {
  body.page-screenplay-format main article > section .font-screenplay {
    padding: 1rem !important;
  }
}


/* Stronger DraftsRush editorial treatment: visible ink outlines and compact offset shadows. */
body.page-screenplay-format main article > header {
  border: 2px solid #111317 !important;
  border-radius: 20px !important;
  background: #F0F2F5 !important;
  box-shadow: 7px 7px 0 #111317 !important;
}
body.page-screenplay-format main article > header > div:first-child {
  background: #D6E4EE !important;
  color: #111317 !important;
  border: 1.5px solid #111317 !important;
  border-radius: 8px !important;
}
body.page-screenplay-format main article > section {
  border: 1.5px solid #111317 !important;
  border-radius: 18px !important;
  box-shadow: 4px 4px 0 #111317 !important;
  background: #FFFFFF !important;
}
body.page-screenplay-format main article > section:nth-of-type(1) {
  background: #FFF6CF !important;
}
body.page-screenplay-format main article > section:nth-of-type(3) {
  background: #F0F2F5 !important;
}
body.page-screenplay-format main article > section .brutal-box,
body.page-screenplay-format main article > section .brutal-box-lg {
  box-shadow: none !important;
}
body.page-screenplay-format main article > section .font-screenplay {
  border: 1.5px solid #111317 !important;
  border-radius: 10px !important;
  background: #FAF9F5 !important;
  box-shadow: none !important;
}
body.page-screenplay-format main article > section .overflow-x-auto {
  border: 1.5px solid #111317 !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
body.page-screenplay-format main article > section .bg-white.border-black.rounded-xl.brutal-box {
  border: 1px solid rgba(17,19,23,.24) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}
body.page-screenplay-format main .commercial-scriptwriting-cta {
  border: 1.5px solid #111317 !important;
  border-radius: 18px !important;
  background: #F8D000 !important;
  box-shadow: 5px 5px 0 #111317 !important;
}
body.page-screenplay-format main .commercial-scriptwriting-cta > a {
  border: 1.5px solid #111317 !important;
  border-radius: 10px !important;
  box-shadow: 3px 3px 0 #111317 !important;
}
body.page-screenplay-format main .commercial-scriptwriting-cta > a:hover {
  transform: translate(-1px,-1px) !important;
  box-shadow: 4px 4px 0 #111317 !important;
}
body.page-screenplay-format main .screenplay-return-link > a {
  border: 1.5px solid #111317 !important;
  border-radius: 10px !important;
  box-shadow: 3px 3px 0 #111317 !important;
}
body.page-screenplay-format main article > section .bg-black.text-white,
body.page-screenplay-format main article > section span.bg-black {
  background: #D6E4EE !important;
  color: #111317 !important;
  border: 1px solid #111317 !important;
  border-radius: 7px !important;
}
@media (max-width: 640px) {
  body.page-screenplay-format main article > header { box-shadow: 4px 4px 0 #111317 !important; }
  body.page-screenplay-format main article > section { box-shadow: 3px 3px 0 #111317 !important; }
  body.page-screenplay-format main .commercial-scriptwriting-cta { box-shadow: 4px 4px 0 #111317 !important; }
}


/* Editorial hero inspired by the American Psycho ending page redesign. */
body.page-screenplay-format main article > header.screenplay-hero {
  width: calc(100% + clamp(0px, 2vw, 24px));
  margin-left: calc(-1 * clamp(0px, 1vw, 12px)) !important;
  padding: clamp(28px, 5vw, 64px) clamp(22px, 4vw, 48px) 24px !important;
  border: 0 !important;
  border-bottom: 1px solid #b6c4d0 !important;
  border-radius: 0 !important;
  background: #D6E4EE !important;
  box-shadow: none !important;
}
.screenplay-hero-inner {
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(280px,.78fr);
  align-items: center;
  gap: clamp(28px,5vw,72px);
}
.screenplay-hero-copy { min-width: 0; }
.screenplay-hero-eyebrow,
.screenplay-hero-meta,
.screenplay-hero-art-label,
.screenplay-hero-art-bottom,
.screenplay-hero-footer {
  font-family: 'JetBrains Mono',monospace;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.screenplay-hero-eyebrow {
  display:flex; align-items:center; gap:11px; margin-bottom:22px; color:#526273;
}
.screenplay-hero-eyebrow span {
  width:8px;height:8px;border-radius:50%;background:#b79b00;
  box-shadow:0 0 0 5px rgba(183,155,0,.14);flex:none;
}
body.page-screenplay-format main article > header.screenplay-hero h1 {
  margin:0 0 20px !important;
  max-width:780px;
  color:#15191f;
  font-size:clamp(40px,5.6vw,72px) !important;
  line-height:.99 !important;
  letter-spacing:-.065em !important;
  font-weight:900;
}
.screenplay-hero h1 em {
  font-family:Georgia,serif;font-weight:500;letter-spacing:-.055em;
}
.screenplay-hero-lede {
  max-width:650px;margin:0 0 22px !important;color:#465362;
  font-size:clamp(15px,1.5vw,19px) !important;line-height:1.7 !important;
}
.screenplay-hero-meta {
  display:flex;flex-wrap:wrap;align-items:center;gap:11px;
  margin:0 0 25px;color:#526273;font-size:9px;line-height:1.8;
}
.screenplay-hero-meta i { width:18px;height:1px;background:#9aa9b7; }
.screenplay-hero-cta {
  display:inline-flex;align-items:center;justify-content:space-between;gap:24px;
  padding:14px 20px;border:1px solid #111317;border-radius:999px;
  background:#F8D000;color:#15191f;text-decoration:none;font-weight:800;
  box-shadow:0 5px 14px rgba(20,24,30,.08);transition:transform .2s,box-shadow .2s;
}
.screenplay-hero-cta:hover { transform:translateY(-2px);box-shadow:0 9px 20px rgba(20,24,30,.13); }
.screenplay-hero-art {
  min-width:0;min-height:340px;padding:22px;display:flex;flex-direction:column;justify-content:space-between;
  position:relative;overflow:hidden;border:1px solid #111317;border-radius:20px;
  background:linear-gradient(145deg,#252b33,#111317 72%,#303a43);
  color:#f2f1ec;box-shadow:0 20px 45px rgba(20,24,30,.16);
}
.screenplay-hero-art:before {
  content:'';position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent 0,transparent 35px,rgba(255,255,255,.045) 36px);
}
.screenplay-hero-art-label,.screenplay-hero-art-bottom { position:relative;z-index:1;display:flex;justify-content:space-between;gap:10px;color:#d3d8de;font-size:9px; }
.screenplay-paper {
  position:relative;z-index:1;display:flex;flex-direction:column;gap:15px;
  width:100%;max-width:310px;margin:20px auto;padding:25px 22px;min-height:220px;
  background:#f7f4eb;color:#252a31;border-radius:3px;
  box-shadow:8px 10px 0 rgba(0,0,0,.25);font:10px/1.55 'Courier Prime',Courier,monospace;
}
.screenplay-paper-slug { font-weight:700;letter-spacing:.015em; }
.screenplay-paper-action { max-width:230px; }
.screenplay-paper-character { margin:0 0 -12px 36%;font-weight:700; }
.screenplay-paper-dialogue { margin-left:22%;max-width:180px; }
.screenplay-paper-transition { align-self:flex-end;margin-top:auto;font-weight:700; }
.screenplay-hero-art-bottom { border-top:1px solid rgba(255,255,255,.25);padding-top:13px; }
.screenplay-hero-footer {
  max-width:1240px;margin:26px auto 0;display:flex;justify-content:space-between;gap:14px;
  color:#526273;font-size:9px;
}
@media(max-width:760px) {
  body.page-screenplay-format main article > header.screenplay-hero {
    width:calc(100% + 2rem);margin-left:-1rem !important;padding:34px 22px 22px !important;
  }
  .screenplay-hero-inner { grid-template-columns:minmax(0,1fr);gap:30px; }
  body.page-screenplay-format main article > header.screenplay-hero h1 {font-size:clamp(40px,11vw,60px) !important;}
  .screenplay-hero-art {min-height:285px;}
  .screenplay-hero-footer {flex-direction:column;gap:7px;}
}


/* Hero layout fix: full-width editorial header sits outside the article content wrapper. */
body.page-screenplay-format main > header.screenplay-hero {
  display:block !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:clamp(38px,5.5vw,76px) 24px 24px !important;
  border:0 !important;
  border-bottom:1px solid #b6c4d0 !important;
  border-radius:0 !important;
  background:#D6E4EE !important;
  box-shadow:none !important;
}
body.page-screenplay-format main > header.screenplay-hero .screenplay-hero-inner {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(300px,.78fr) !important;
  align-items:center !important;
  gap:clamp(32px,6vw,84px) !important;
  max-width:1240px !important;
  width:100% !important;
  margin:0 auto !important;
}
body.page-screenplay-format main > header.screenplay-hero .screenplay-hero-copy,
body.page-screenplay-format main > header.screenplay-hero .screenplay-hero-art { min-width:0; }
body.page-screenplay-format main > header.screenplay-hero .screenplay-hero-art {
  display:flex !important;
  min-height:340px !important;
  width:100% !important;
  flex-direction:column !important;
  justify-content:space-between !important;
}
body.page-screenplay-format main > header.screenplay-hero h1 {
  font-size:clamp(42px,6vw,78px) !important;
  line-height:.98 !important;
  margin:0 0 22px !important;
  max-width:780px !important;
}
body.page-screenplay-format main > header.screenplay-hero .screenplay-hero-lede {
  max-width:640px !important;
  margin:24px 0 !important;
}
body.page-screenplay-format main > header.screenplay-hero .screenplay-hero-footer {
  max-width:1240px !important;
  margin:28px auto 0 !important;
  display:flex !important;
  flex-direction:row !important;
  justify-content:space-between !important;
}
body.page-screenplay-format main > div.max-w-4xl {
  max-width:1120px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
@media(max-width:760px) {
  body.page-screenplay-format main > header.screenplay-hero { padding:34px 22px 22px !important; }
  body.page-screenplay-format main > header.screenplay-hero .screenplay-hero-inner { grid-template-columns:minmax(0,1fr) !important;gap:30px !important; }
  body.page-screenplay-format main > header.screenplay-hero h1 {font-size:clamp(40px,11vw,60px) !important;}
  body.page-screenplay-format main > header.screenplay-hero .screenplay-hero-art {min-height:285px !important;}
  body.page-screenplay-format main > header.screenplay-hero .screenplay-hero-footer {flex-direction:column !important;gap:7px !important;}
}
