/* Selected brand palette: Navy + Koralle. Dark coral keeps small text readable on paper. */
:root {
  --navy: #0b1d2c;
  --navy2: #17354b;
  --paper: #f3f1eb;
  --beige: #e8e4dc;
  --ink: #0b1d2c;
  --muted: #506372;
  --accent: #a93620;
  --coral: #ff805a;
  --coral-hover: #ff987a;
  --coral-soft: #f9e2d8;
  --line: #d2d5d4;
  --white: #ffffff;
  --on-dark-muted: #ccd7de;
  --on-dark-soft: #acbcc7;
}

::selection { background: var(--coral); color: var(--navy); }
:focus-visible { outline-color: var(--navy); }
.site-header :focus-visible,
.hero :focus-visible,
.services-section :focus-visible,
.site-footer :focus-visible,
.reel-inner :focus-visible { outline-color: var(--coral); }

.site-header { background: linear-gradient(180deg, #0b1d2ce0, #0b1d2c70); }
.site-header.is-scrolled { background: var(--navy); }
.desktop-nav a:hover, .mobile-nav a:hover { color: var(--coral); }
.button.dark, .button.light, .nav-cta {
  background: var(--coral);
  color: var(--navy);
  border: 1px solid var(--accent);
  font-weight: 600;
}
.site-header .nav-cta { border-color: var(--coral); }
.button.dark:hover, .button.light:hover, .nav-cta:hover {
  background: var(--coral-hover);
  color: var(--navy);
}
.text-link { color: var(--accent); }
.text-link:hover { color: var(--navy); }
.section-top .eyebrow, .crew-index { color: var(--accent); }

.video-hero .film-shade {
  background: linear-gradient(180deg, #0b1d2c48 0%, #0b1d2c12 30%, #0b1d2c85 55%, #0b1d2ce8 100%);
}
.video-hero h1 span { color: var(--coral); }
.video-hero-copy p, .video-hero-meta { color: var(--on-dark-muted); }
.video-hero-copy .eyebrow { color: var(--paper); }
.hero-video-actions > .text-link { color: var(--coral); }
.hero-video-actions > .text-link:hover { color: var(--white); }
.video-hero .play-icon { background: var(--coral); border-color: var(--coral); }
.video-hero .play-icon:after { border-left-color: var(--navy); }
.video-hero .reel-button:hover .play-icon { background: var(--coral-hover); }
.video-hero .hero-film .motion-control { background: #0b1d2c99; border-color: var(--on-dark-soft); }

.filter { border-color: #9daeb9; }
.filter:hover { background: var(--coral-soft); border-color: var(--accent); }
.filter.active { background: var(--coral); color: var(--navy); border-color: var(--accent); }
.filter.active:hover { background: var(--coral-hover); }
.medium-filters button.active { color: var(--accent); border-color: var(--accent); }
.project-card:hover .card-title { color: var(--accent); }
.project-card:focus-visible { outline-offset: 8px; }
.media-badge { background: #0b1d2cd9; }
.card-open { border-bottom-color: var(--coral); }

.services-intro h2 em { color: var(--coral); }
.services-section .section-top, .services-intro p, .service-body { color: var(--on-dark-muted); }
.services-section .section-top .eyebrow { color: var(--coral); }
.services-note { color: var(--on-dark-soft); border-left-color: var(--coral); }
.service-no, .service .plus, .service-body li:before { color: var(--coral); }
.service summary small { color: var(--on-dark-soft); }
.service-work { color: var(--coral); }
.service-work:hover { color: var(--white); }

.freelance-invite { background: var(--coral-soft); }
.freelance-invite .eyebrow { color: var(--accent); }
.process-section, .faq-section { background: var(--beige); }
.process-grid article > span { color: var(--accent); }
.team-label { background: var(--navy); color: var(--paper); }
.crew-role .placeholder-inline { color: var(--muted); border-color: #8799a6; }
.email-preview { background: var(--coral-soft); border-color: #c69d8f; }
input::placeholder, textarea::placeholder { color: var(--muted); }
.contact-email { color: var(--accent); border-bottom-color: var(--accent); }
.contact-email:hover { color: var(--navy); }
.gallery-controls button:not(:disabled):hover { background: var(--coral); border-color: var(--accent); }
.draft-label { background: var(--coral-soft); color: var(--accent); }
.reel-inner .eyebrow { color: var(--coral); }
.reel-inner > p, .footer-top > p { color: var(--on-dark-muted); }
.footer-bottom { color: var(--on-dark-soft); }
.site-footer a:hover, .reel-inner .dialog-close:hover { color: var(--coral); }

@media (prefers-reduced-motion: reduce) {
  .button:hover { transform: none; }
}