:root {
  --screen-paper: #EBECC8;
  --cine-ink: #3D504C;
  --amber-splice: #BF7832;
  --slate-vault: #3D334C;
  --panel-grey: #DCE0F0;
  --steel-rail: #7A7C90;
  --mint-bin: #E0FAEA;
  --zinc-res: #9A959B;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-size: 16px;
  font-family: Georgia, "Times New Roman", serif;
  background-color: #EBECC8;
  color: #3D504C;
  line-height: 1.65;
  overflow-x: hidden;
}

h1, h2, h3, h4 {
  font-family: "Trebuchet MS", Verdana, sans-serif;
  letter-spacing: 0.01em;
  margin: 0 0 0.5em;
  line-height: 1.15;
}

p {
  margin: 0 0 1em;
}

a {
  color: #BF7832;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
  text-decoration-color: #9A959B;
  text-decoration-thickness: 2px;
}

.wrap {
  width: min(1180px, 100% - 48px);
  margin: 0 auto;
}

/* ---------- reel rack header ---------- */

.reelrack {
  background-color: #3D334C;
  color: #EBECC8;
  border-bottom: 6px solid #3D334C;
  box-shadow: inset 0 -2px 0 #7A7C90;
  padding: 18px 0 14px;
}

.reelrack-inner {
  display: flex;
  align-items: stretch;
  gap: 22px;
  flex-wrap: wrap;
}

.reelrack-frame {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 250px;
  padding: 8px 18px 8px 0;
  border-right: 2px solid #7A7C90;
}

.reelrack-brand {
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-size: 1.12rem;
  font-weight: 700;
  color: #EBECC8;
  letter-spacing: 0.06em;
  display: flex;
  align-items: center;
  gap: 9px;
}

.reelrack-brand:hover {
  text-decoration: none;
  color: #E0FAEA;
}

.reelrack-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background-color: #9A959B;
  display: inline-block;
  flex: none;
}

.reelrack-sub {
  font-size: 0.74rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #E0FAEA;
  margin-top: 4px;
}

.reelrack-cans {
  display: flex;
  flex: 1;
  gap: 10px;
  align-items: flex-end;
  flex-wrap: wrap;
}

.reelrack-can {
  position: relative;
  display: block;
  background-color: #EBECC8;
  color: #3D504C;
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-size: 0.86rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  padding: 14px 16px 16px;
  border-radius: 4px;
  border-bottom: 4px solid #7A7C90;
  box-shadow: 0 2px 0 #7A7C90;
}

.reelrack-can::before {
  content: "";
  position: absolute;
  top: 4px;
  left: 50%;
  transform: translateX(-50%);
  width: 34px;
  height: 5px;
  background-color: #BF7832;
  border-radius: 2px;
}

.reelrack-can:hover {
  text-decoration: none;
  background-color: #E0FAEA;
  color: #3D334C;
}

.reelrack-can:nth-child(1) { min-width: 94px; }
.reelrack-can:nth-child(2) { min-width: 118px; }
.reelrack-can:nth-child(3) { min-width: 108px; }
.reelrack-can:nth-child(4) { min-width: 126px; }
.reelrack-can:nth-child(5) { min-width: 96px; }

.reelrack-can.is-current {
  background-color: #BF7832;
  color: #FFF6E8;
  border-bottom-color: #3D334C;
}

.reelrack-can.is-current::before {
  background-color: #3D334C;
}

.reelrack-toggle {
  display: none;
  background-color: #EBECC8;
  color: #3D334C;
  border: 2px solid #7A7C90;
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-weight: 700;
  font-size: 0.9rem;
  letter-spacing: 0.08em;
  padding: 10px 16px;
  cursor: pointer;
  margin-left: auto;
}

.reelrack-toggle::after {
  content: " +";
}

.reelrack.is-open .reelrack-toggle::after {
  content: " -";
}

/* ---------- film wall hero ---------- */

.filmwall {
  padding: 56px 0 0;
}

.filmwall-copy {
  max-width: 880px;
  padding-bottom: 34px;
}

.filmwall-kicker {
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-size: 0.78rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: #3D334C;
  border-left: 5px solid #BF7832;
  padding-left: 12px;
  margin-bottom: 22px;
  display: inline-block;
}

.filmwall h1 {
  font-size: clamp(2.3rem, 5.4vw, 4.2rem);
  color: #3D504C;
  font-weight: 700;
  margin-bottom: 22px;
}

.filmwall-display {
  display: block;
  color: #BF7832;
  font-size: 1.14em;
  letter-spacing: -0.01em;
}

.filmwall-lede {
  font-size: 1.1rem;
  max-width: 760px;
  color: #3D504C;
}

.filmwall-more {
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-weight: 700;
  display: inline-block;
  margin-top: 4px;
  border-bottom: 2px solid #BF7832;
  color: #3D334C;
  padding-bottom: 2px;
}

.filmwall-more::after {
  content: " \2192";
  color: #BF7832;
}

.filmwall-more:hover {
  text-decoration: none;
  border-bottom-color: #9A959B;
}

.filmwall-band {
  display: grid;
  grid-template-columns: 1.05fr 1.4fr 1fr;
  align-items: end;
  gap: 20px;
  background-color: #DCE0F0;
  border-top: 6px solid #3D334C;
  border-bottom: 6px solid #3D334C;
  padding: 26px 24px 0;
  position: relative;
}

.filmwall-band::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 6px;
  background-color: #BF7832;
}

.filmwall-note {
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #3D334C;
  margin-bottom: 8px;
}

.canstower {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  height: 190px;
  padding-bottom: 0;
}

.canstower-can {
  background-color: #3D334C;
  border-radius: 3px 3px 0 0;
  position: relative;
  flex: 1;
  border-top: 5px solid #BF7832;
}

.canstower-can::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 14px;
  transform: translateX(-50%);
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 4px solid #7A7C90;
}

.canstower-can:nth-child(1) { height: 94px; }
.canstower-can:nth-child(2) { height: 146px; }
.canstower-can:nth-child(3) { height: 118px; }
.canstower-can:nth-child(4) { height: 172px; background-color: #BF7832; }
.canstower-can:nth-child(5) { height: 132px; }
.canstower-can:nth-child(6) { height: 100px; }

.canstower-can:nth-child(4)::after {
  border-color: #3D334C;
}

.filmwall-mid {
  display: flex;
  gap: 14px;
  align-items: flex-end;
  height: 190px;
}

.chalkwall {
  flex: 1.3;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  align-content: end;
  padding-bottom: 0;
}

.chalkslate {
  background-color: #3D504C;
  border-radius: 3px 3px 0 0;
  padding: 10px;
  min-height: 62px;
  position: relative;
}

.chalkslate::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 10px;
  width: 26px;
  height: 52px;
  border-top: 2px solid #EBECC8;
  border-bottom: 2px solid #EBECC8;
  background-color: #DCE0F0;
}

.chalkslate.is-tall { min-height: 92px; }
.chalkslate.is-short { min-height: 70px; }

.scenelist {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding-bottom: 0;
}

.scenecard {
  background-color: #EBECC8;
  border-left: 6px solid #BF7832;
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #3D334C;
  padding: 7px 9px;
}

.scenecard:nth-child(2) {
  border-left-color: #3D334C;
  margin-left: 10px;
}

.scenecard:nth-child(3) {
  margin-left: 4px;
}

.cuetable {
  height: 190px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.cuecrank {
  width: 62px;
  height: 62px;
  border: 7px solid #3D334C;
  border-radius: 50%;
  margin: 0 auto 10px;
  position: relative;
  background-color: #EBECC8;
}

.cuecrank::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 44px;
  height: 6px;
  background-color: #3D334C;
  transform: translate(-50%, -50%);
}

.cuecrank::after {
  content: "";
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  width: 10px;
  height: 14px;
  background-color: #BF7832;
}

.cueshelf {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.cuecan {
  height: 17px;
  background-color: #3D334C;
  border-radius: 2px;
  box-shadow: inset 0 -2px 0 #7A7C90;
}

.cuecan:nth-child(2) { margin: 0 10px; }
.cuecan:nth-child(3) { margin: 0 4px; }
.cuecan:nth-child(4) { margin: 0 16px; background-color: #BF7832; }
.cuecan:nth-child(5) { margin: 0 6px; }

.filmwall-cta {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  background-color: #BF7832;
  color: #FFF6E8;
  margin: 22px -24px 0;
  padding: 18px 26px;
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-weight: 700;
  font-size: 1.05rem;
  letter-spacing: 0.04em;
}

.filmwall-cta:hover {
  text-decoration: none;
  background-color: #A9641F;
}

.filmwall-cta span {
  font-size: 1.5rem;
  line-height: 1;
}

/* ---------- slate list registry ---------- */

.slatelist {
  padding: 72px 0 64px;
  background-color: #EBECC8;
}

.slatelist-head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  align-items: end;
  margin-bottom: 44px;
  border-bottom: 3px solid #7A7C90;
  padding-bottom: 18px;
}

.slatelist-head h2 {
  font-size: clamp(1.7rem, 3.2vw, 2.5rem);
  color: #3D334C;
  margin: 0;
}

.slatelist-head p {
  margin: 0;
  color: #3D504C;
}

.slateregistry {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.slatecard {
  background-color: #DCE0F0;
  position: relative;
  padding: 26px 30px 26px 34px;
  border-left: 7px solid #3D334C;
}

.slatecard:nth-child(1) { width: 78%; margin-left: 0; border-left-color: #BF7832; }
.slatecard:nth-child(2) { width: 64%; margin-left: 22%; border-left-color: #7A7C90; }
.slatecard:nth-child(3) { width: 84%; margin-left: 4%; }
.slatecard:nth-child(4) { width: 58%; margin-left: 30%; border-left-color: #BF7832; }
.slatecard:nth-child(5) { width: 72%; margin-left: 11%; border-left-color: #7A7C90; }
.slatecard:nth-child(6) { width: 69%; margin-left: 20%; }

.slatecard-mark {
  position: absolute;
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-weight: 700;
  font-size: 1.1rem;
  color: #BF7832;
  border: 2px solid #BF7832;
  width: 34px;
  height: 34px;
  line-height: 30px;
  text-align: center;
}

.slatecard-mark.pos-a { top: 14px; right: 20px; }
.slatecard-mark.pos-b { bottom: 14px; right: 34px; }
.slatecard-mark.pos-c { top: 20px; left: -17px; background-color: #EBECC8; }
.slatecard-mark.pos-d { bottom: -14px; right: 90px; background-color: #EBECC8; }
.slatecard-mark.pos-e { top: 14px; right: 62px; }
.slatecard-mark.pos-f { top: -15px; left: 40px; background-color: #EBECC8; }

.slatecard h3 {
  font-size: 1.25rem;
  color: #3D334C;
  margin-bottom: 8px;
  padding-right: 48px;
}

.slatetag {
  display: inline-block;
  background-color: #E0FAEA;
  color: #3D334C;
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 3px 9px;
  border: 1px solid #7A7C90;
  margin-bottom: 10px;
}

.slatecard p {
  margin: 0;
  color: #3D504C;
}

/* ---------- cue table ledger band ---------- */

.cuetableledger {
  background-color: #7A7C90;
  color: #EBECC8;
  padding: 16px 0;
}

.cuetableledger-inner {
  display: flex;
  align-items: center;
  gap: 26px;
  flex-wrap: wrap;
}

.ledger-cans {
  display: flex;
  gap: 7px;
  flex: none;
}

.ledger-can {
  width: 15px;
  height: 26px;
  background-color: #EBECC8;
  border-radius: 2px;
  border-top: 4px solid #3D334C;
}

.ledger-can:nth-child(2) { border-top-color: #BF7832; }
.ledger-can:nth-child(3) { height: 20px; }
.ledger-can:nth-child(4) { border-top-color: #3D334C; height: 30px; }

.ledger-text {
  margin: 0;
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-size: 0.98rem;
  letter-spacing: 0.02em;
  color: #FFF6E8;
}

/* ---------- story sections ---------- */

.storyband {
  padding: 64px 0;
  background-color: #DCE0F0;
}

.storyband-grid {
  display: grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap: 48px;
}

.storyband h2 {
  font-size: clamp(1.6rem, 3vw, 2.3rem);
  color: #3D334C;
}

.storyband h3 {
  font-size: 1.2rem;
  color: #3D334C;
  margin-top: 28px;
}

.storyaside {
  background-color: #3D334C;
  color: #EBECC8;
  padding: 28px;
  border-top: 8px solid #BF7832;
}

.storyaside h3 {
  color: #E0FAEA;
  margin-top: 0;
}

.storyaside ul {
  margin: 0;
  padding-left: 18px;
}

.storyaside li {
  margin-bottom: 10px;
  color: #EBECC8;
}

.storyaside a {
  color: #E0FAEA;
  border-bottom: 2px solid #BF7832;
}

.storybody p {
  color: #3D504C;
}

.storybody a {
  font-weight: 700;
  color: #3D334C;
  border-bottom: 2px solid #BF7832;
}

.storybody a:hover {
  text-decoration: none;
  border-bottom-color: #9A959B;
}

/* ---------- reel shelf footer ---------- */

.reelshelf {
  background-color: #3D334C;
  color: #EBECC8;
  padding: 52px 0 0;
  margin-top: 0;
}

.reelshelf-room {
  padding-bottom: 40px;
}

.reelshelf-backboard {
  background-color: #EBECC8;
  color: #3D504C;
  border-radius: 4px;
  padding: 22px 24px 24px;
  margin-bottom: 42px;
  border-top: 8px solid #BF7832;
}

.reelshelf-canrow {
  display: flex;
  gap: 10px;
  align-items: flex-end;
  padding-bottom: 14px;
  border-bottom: 4px solid #7A7C90;
  margin-bottom: 6px;
  height: 62px;
}

.reelshelf-can {
  background-color: #3D334C;
  border-radius: 3px;
  flex: 1;
  height: 30px;
  box-shadow: inset 0 -4px 0 #7A7C90;
}

.reelshelf-can:nth-child(2) { height: 42px; }
.reelshelf-can:nth-child(3) { height: 34px; background-color: #BF7832; box-shadow: inset 0 -4px 0 #3D334C; }
.reelshelf-can:nth-child(4) { height: 46px; }
.reelshelf-can:nth-child(5) { height: 28px; }
.reelshelf-can:nth-child(6) { height: 38px; }
.reelshelf-can:nth-child(7) { height: 32px; background-color: #BF7832; box-shadow: inset 0 -4px 0 #3D334C; }
.reelshelf-can:nth-child(8) { height: 44px; }

.reelshelf-rail {
  height: 10px;
  background-color: #7A7C90;
  border-radius: 2px;
}

.reelshelf-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr;
  gap: 42px;
}

.reelshelf-brand {
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-size: 1.12rem;
  font-weight: 700;
  color: #EBECC8;
  letter-spacing: 0.06em;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 9px;
}

.reelshelf-title {
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #E0FAEA;
  margin: 0 0 12px;
  padding-bottom: 6px;
  border-bottom: 2px solid #7A7C90;
}

.reelshelf-links {
  list-style: none;
  margin: 0;
  padding: 0;
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-size: 0.95rem;
}

.reelshelf-links li {
  margin-bottom: 9px;
}

.reelshelf-links a {
  color: #EBECC8;
  border-bottom: 1px solid #7A7C90;
}

.reelshelf-links a:hover {
  text-decoration: none;
  border-bottom-color: #9A959B;
  color: #E0FAEA;
}

.reelshelf-blurb {
  color: #EBECC8;
  font-size: 0.95rem;
  max-width: 380px;
  margin: 0;
}

.reelshelf-strip {
  border-top: 2px solid #7A7C90;
  background-color: #3D334C;
  padding: 16px 0 20px;
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-size: 0.84rem;
}

.reelshelf-strip-inner {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 26px;
  justify-content: space-between;
  color: #EBECC8;
}

.reelshelf-strip a {
  color: #EBECC8;
}

.reelshelf-strip a:hover {
  color: #E0FAEA;
}

.reelshelf-year {
  color: #BF7832;
  margin-right: 6px;
}

/* ---------- scroll reveal ---------- */

.reveal {
  visibility: visible;
}

.js .reveal {
  visibility: hidden;
  transform: translateY(18px);
  transition: transform 0.5s ease;
}

.js .reveal.is-seen {
  visibility: visible;
  transform: none;
}

/* ---------- services page ---------- */

.pagehead {
  padding: 54px 0 30px;
  background-color: #EBECC8;
}

.pagehead-kicker {
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-size: 0.76rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #3D334C;
  border-left: 5px solid #BF7832;
  padding-left: 12px;
  margin-bottom: 18px;
  display: inline-block;
}

.pagehead h1 {
  font-size: clamp(2rem, 4vw, 3.1rem);
  color: #3D504C;
  max-width: 900px;
  margin-bottom: 16px;
}

.pagehead p {
  max-width: 780px;
  font-size: 1.06rem;
  color: #3D504C;
}

.serviceblocks {
  padding: 30px 0 56px;
}

.serviceblock {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 26px;
  padding: 30px 0;
  border-top: 2px solid #7A7C90;
}

.serviceblock:last-child {
  border-bottom: 2px solid #7A7C90;
}

.serviceblock-mark {
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-weight: 700;
  font-size: 1.4rem;
  color: #BF7832;
  border: 3px solid #BF7832;
  width: 62px;
  height: 62px;
  line-height: 56px;
  text-align: center;
  align-self: start;
  background-color: #DCE0F0;
}

.serviceblock h2 {
  font-size: 1.4rem;
  color: #3D334C;
  margin-bottom: 10px;
}

.serviceblock p {
  color: #3D504C;
  max-width: 860px;
}

.processband {
  background-color: #DCE0F0;
  padding: 54px 0;
  border-top: 6px solid #3D334C;
}

.processband h2 {
  color: #3D334C;
  font-size: 1.9rem;
  margin-bottom: 10px;
}

.processband > .wrap > p {
  max-width: 760px;
  margin-bottom: 26px;
}

.processsteps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.processstep {
  background-color: #EBECC8;
  border-top: 5px solid #BF7832;
  padding: 18px 18px 20px;
}

.processstep h3 {
  font-size: 1.02rem;
  color: #3D334C;
  margin-bottom: 6px;
}

.processstep p {
  font-size: 0.92rem;
  margin: 0;
  color: #3D504C;
}

.ctaband {
  padding: 48px 0;
  background-color: #EBECC8;
}

.ctaband-inner {
  background-color: #3D334C;
  color: #EBECC8;
  padding: 34px 34px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 26px;
  flex-wrap: wrap;
  border-left: 10px solid #BF7832;
}

.ctaband h2 {
  color: #E0FAEA;
  margin-bottom: 6px;
  font-size: 1.6rem;
}

.ctaband p {
  margin: 0;
  max-width: 620px;
  color: #EBECC8;
}

.ctaband-link {
  background-color: #BF7832;
  color: #FFF6E8;
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-weight: 700;
  padding: 14px 24px;
  letter-spacing: 0.04em;
  flex: none;
}

.ctaband-link:hover {
  text-decoration: none;
  background-color: #A9641F;
}

/* ---------- contact page ---------- */

.contactgrid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 40px;
  padding: 30px 0 56px;
}

.contactform {
  background-color: #DCE0F0;
  padding: 30px 30px 34px;
  border-top: 7px solid #3D334C;
}

.contactform h2 {
  color: #3D334C;
  font-size: 1.4rem;
  margin-bottom: 18px;
}

.field {
  margin-bottom: 16px;
}

.field label {
  display: block;
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-size: 0.8rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #3D334C;
  margin-bottom: 6px;
}

.field input,
.field textarea {
  width: 100%;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1rem;
  color: #3D504C;
  background-color: #EBECC8;
  border: 2px solid #7A7C90;
  padding: 10px 12px;
}

.field input:focus,
.field textarea:focus {
  outline: 3px solid #BF7832;
  outline-offset: 1px;
  border-color: #3D334C;
}

.field textarea {
  min-height: 150px;
  resize: vertical;
}

.contactsubmit {
  background-color: #BF7832;
  color: #FFF6E8;
  border: none;
  font-family: "Trebuchet MS", Verdana, sans-serif;
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 0.06em;
  padding: 13px 30px;
  cursor: pointer;
}

.contactsubmit:hover {
  background-color: #A9641F;
}

.formnote {
  font-size: 0.86rem;
  color: #3D334C;
  margin-top: 14px;
  margin-bottom: 0;
}

.contactaside {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.contactpanel {
  background-color: #3D334C;
  color: #EBECC8;
  padding: 24px 26px;
  border-left: 8px solid #BF7832;
}

.contactpanel h2 {
  color: #E0FAEA;
  font-size: 1.15rem;
  margin-bottom: 12px;
}

.contactpanel p {
  margin: 0 0 8px;
  color: #EBECC8;
}

.contactpanel a {
  color: #E0FAEA;
  border-bottom: 2px solid #BF7832;
}

.contactpanel a:hover {
  text-decoration: none;
}

.contactpanel-mint {
  background-color: #E0FAEA;
  color: #3D334C;
  padding: 24px 26px;
  border-left: 8px solid #3D334C;
}

.contactpanel-mint h2 {
  color: #3D334C;
  font-size: 1.15rem;
  margin-bottom: 12px;
}

.contactpanel-mint p {
  color: #3D334C;
  margin: 0 0 8px;
}

.hourrow {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid #7A7C90;
  padding: 6px 0;
  font-size: 0.95rem;
}

.hourrow:last-child {
  border-bottom: none;
}

.faqband {
  padding: 20px 0 60px;
}

.faqband h2 {
  color: #3D334C;
  font-size: 1.7rem;
  margin-bottom: 22px;
}

.faqitem {
  border-top: 2px solid #7A7C90;
  padding: 18px 0;
}

.faqitem:last-child {
  border-bottom: 2px solid #7A7C90;
}

.faqitem h3 {
  font-size: 1.08rem;
  color: #3D334C;
  margin-bottom: 6px;
}

.faqitem p {
  margin: 0;
  color: #3D504C;
  max-width: 820px;
}

/* ---------- responsive ---------- */

@media (max-width: 980px) {
  body .filmwall-band{
    grid-template-columns: 1fr 1fr;
  }

  body .cuetable{
    display: none;
  }

  body .storyband-grid{
    grid-template-columns: 1fr;
    gap: 30px;
  }

  body .reelshelf-grid.reelrack{
    grid-template-columns: 1fr 1fr;
  }

  body .processsteps.cuereel{
    grid-template-columns: 1fr 1fr;
  }

  body .contactgrid{
    grid-template-columns: 1fr;
  }

  body .slatelist-head{
    grid-template-columns: 1fr;
    gap: 12px;
  }

  body .slatecard, .slatecard:nth-child(1), .slatecard:nth-child(2), .slatecard:nth-child(3), .slatecard:nth-child(4), .slatecard:nth-child(5), .slatecard:nth-child(6){
    width: 100%;
    margin-left: 0;
  }
}
@media (max-width: 820px) {
  body .reelrack-toggle{
    display: block;
  }

  body .reelrack-cans{
    display: none;
    width: 100%;
    flex-direction: column;
    align-items: stretch;
  }

  body .reelrack.is-open .reelrack-cans{
    display: flex;
  }

  body .reelrack-frame{
    border-right: none;
    min-width: 0;
    flex: 1;
  }

  body .reelrack-can{
    width: 100%;
  }
}
@media (max-width: 620px) {/* r*/ 
  body .filmwall-band{
    grid-template-columns: 1fr;
  }

  body .filmwall-mid{
    display: no/* r*/ ne;
  }

  body .reelshelf-grid{
    grid-template-columns: 1fr;
    /* r*/ gap: 30px;
  }

  body .processsteps{
    grid-template-columns: 1fr;
  }

  body .serviceblock{
    grid-template-columns: 1fr;
    gap: 14px;
  }

  body .filmwall-cta{
    font-size: 0.95rem;
    padding: 16px 18px;
  }

  body .slatecard{
    padding: 22px 20px 22px 22px;
  }

  body .slatecard-mark.pos-c, body .slatecard-mark.pos-f{
    left: auto;
    right: 14px;
    top: 12px;
  }
}