/*
Theme Name: CrossTalk Studios
Theme URI: https://studios.crosstalkpublishing.com
Description: A Divi child theme for the production studio of the CrossTalk Publishing family.
Author: Craig Marvin Johnson
Template: Divi
Version: 1.0.1
Text Domain: crosstalk-studios
*/

:root {
  --cts-ink: #071f3e;
  --cts-gold: #b97712;
  --cts-bright-gold: #d79b2d;
  --cts-paper: #f4f1ea;
  --cts-white: #ffffff;
  --cts-black: #15191d;
  --cts-steel: #536473;
  --cts-line: rgba(7, 31, 62, .17);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.cts-site { margin: 0; background: var(--cts-paper); color: var(--cts-ink); font-family: Arial, Helvetica, sans-serif; font-size: 16px; line-height: 1.5; }
.cts-site main { display: block; }
.cts-site p { padding-bottom: 0; }
.cts-site img { display: block; max-width: 100%; }
.cts-site a { color: inherit; }
.cts-site h1, .cts-site h2, .cts-site h3 { color: inherit; font-family: Georgia, serif; font-weight: 700; letter-spacing: 0; }
.cts-section-label, .cts-kicker { margin: 0 0 14px; color: var(--cts-gold); text-transform: uppercase; font-size: 10px; line-height: 1.3; font-weight: 800; letter-spacing: .16em; }

.cts-header { position: sticky; top: 0; z-index: 999; min-height: 72px; padding: 0 4vw; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; background: rgba(244,241,234,.97); border-bottom: 1px solid var(--cts-line); backdrop-filter: blur(12px); }
.admin-bar .cts-header { top: 32px; }
.cts-brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; }
.cts-brand img { width: 48px; height: 48px; object-fit: cover; }
.cts-brand span { display: grid; line-height: 1; }
.cts-brand strong { font-family: Georgia, serif; font-size: 18px; }
.cts-brand small { margin-top: 4px; color: var(--cts-gold); text-transform: uppercase; font-size: 9px; font-weight: 800; letter-spacing: .2em; }
.cts-desktop-nav, .cts-desktop-nav ul { display: flex; align-items: center; margin: 0; padding: 0; list-style: none; }
.cts-desktop-nav a { padding: 4px 15px; border-left: 1px solid var(--cts-line); font-size: 11px; font-weight: 800; text-decoration: none; white-space: nowrap; }
.cts-desktop-nav > a:first-child, .cts-desktop-nav li:first-child a { border-left: 0; }
.cts-header-action { justify-self: end; min-height: 40px; padding: 0 15px; display: inline-flex; align-items: center; background: var(--cts-ink); color: white !important; font-size: 11px; font-weight: 800; text-decoration: none; }
.cts-mobile-menu { display: none; }

.cts-hero { position: relative; min-height: 700px; overflow: hidden; background: white; }
.cts-hero-logo { position: absolute; inset: 0 0 0 auto; width: 62%; height: 100%; object-fit: cover; object-position: center; opacity: .3; }
.cts-hero-wash { position: absolute; inset: 0; background: rgba(255,255,255,.18); }
.cts-hero-copy { position: relative; z-index: 2; width: min(860px, 72vw); padding: 110px 7vw 105px; }
.cts-hero-copy h1 { margin: 0; font-size: 106px; line-height: .87; }
.cts-hero-copy > p:not(.cts-kicker) { max-width: 650px; margin: 30px 0 34px; font-family: Georgia, serif; font-size: 31px; line-height: 1.3; }
.cts-hero-note { position: absolute; z-index: 2; right: 4vw; bottom: 28px; margin: 0; display: flex; align-items: center; gap: 10px; color: var(--cts-ink); text-transform: uppercase; font-size: 9px; font-weight: 800; letter-spacing: .13em; }
.cts-hero-note span { width: 4px; height: 4px; background: var(--cts-gold); }
.cts-actions { display: flex; flex-wrap: wrap; gap: 13px; align-items: center; }
.cts-primary-action, .cts-secondary-action { min-height: 50px; padding: 0 20px; display: inline-flex; justify-content: center; align-items: center; gap: 10px; border: 1px solid var(--cts-ink); background: var(--cts-ink); color: white !important; font-size: 12px; font-weight: 800; text-decoration: none; }
.cts-secondary-action { background: transparent; color: var(--cts-ink) !important; }
.cts-primary-action.inverse { background: white; border-color: white; color: var(--cts-ink) !important; }
.cts-text-action { display: inline-flex; gap: 9px; padding-bottom: 4px; border-bottom: 2px solid var(--cts-gold); font-weight: 800; text-decoration: none; }

.cts-intro { padding: 96px 7vw; display: grid; grid-template-columns: 1fr .8fr; gap: 10vw; align-items: end; }
.cts-intro h2, .cts-work > header h2, .cts-process h2, .cts-closing h2, .cts-page-hero h1 { margin: 0; font-size: 65px; line-height: 1; }
.cts-intro > p { margin: 0; font-size: 18px; line-height: 1.75; }

.cts-services { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--cts-line); border-bottom: 1px solid var(--cts-line); background: white; }
.cts-services article { min-height: 380px; padding: 48px 32px; display: flex; flex-direction: column; align-items: flex-start; border-left: 1px solid var(--cts-line); }
.cts-services article:first-child { border-left: 0; }
.cts-services article > span { color: var(--cts-gold); font-size: 10px; font-weight: 800; }
.cts-services h3 { margin: 28px 0 17px; font-size: 35px; line-height: 1.05; }
.cts-services p { margin: 0 0 26px; color: var(--cts-steel); line-height: 1.65; }
.cts-services a { margin-top: auto; padding-bottom: 4px; border-bottom: 2px solid var(--cts-gold); font-size: 12px; font-weight: 800; text-decoration: none; }

.cts-work { padding: 96px 5vw; background: var(--cts-black); color: white; }
.cts-work > header { margin: 0 2vw 48px; }
.cts-work > header h2 { max-width: 900px; color: white; }
.cts-project-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.cts-project-grid article { min-width: 0; padding-bottom: 28px; border-bottom: 1px solid rgba(255,255,255,.2); }
.cts-project-image { aspect-ratio: 16 / 10; display: grid; place-items: center; overflow: hidden; background: var(--cts-ink); color: white; text-decoration: none; }
.cts-project-image.gold { background: var(--cts-gold); }
.cts-project-image.light { background: #dce3e8; color: var(--cts-ink); }
.cts-project-image img { width: 100%; height: 100%; object-fit: cover; }
.cts-project-image > span { font-family: Georgia, serif; font-size: 56px; }
.cts-project-grid article > p:first-of-type { margin: 22px 0 10px; color: var(--cts-bright-gold); text-transform: uppercase; font-size: 9px; font-weight: 800; letter-spacing: .14em; }
.cts-project-grid h3 { margin: 0; color: white; font-size: 31px; line-height: 1.08; }
.cts-project-grid h3 a { text-decoration: none; }
.cts-project-grid article > p:not(:first-of-type) { color: #c7d0d7; line-height: 1.65; }
.cts-work .cts-text-action, .cts-work-link { color: white; }
.cts-work-link { margin: 40px 2vw 0; display: inline-flex; gap: 9px; padding-bottom: 4px; border-bottom: 2px solid var(--cts-gold); font-weight: 800; text-decoration: none; }
.cts-project-page { min-height: 650px; }
.cts-empty { grid-column: 1 / -1; padding: 50px 0; }
.cts-empty h2 { margin: 0; color: white; font-size: 46px; }

.cts-process { padding: 100px 7vw; display: grid; grid-template-columns: 1fr 1fr; gap: 9vw; background: #e5eaf0; }
.cts-process ol { margin: 0; padding: 0; list-style: none; }
.cts-process li { padding: 22px 0; display: grid; grid-template-columns: 45px 1fr; gap: 18px; border-bottom: 1px solid var(--cts-line); }
.cts-process li > span { color: var(--cts-gold); font-size: 10px; font-weight: 800; }
.cts-process strong { font-family: Georgia, serif; font-size: 24px; }
.cts-process li p { margin: 6px 0 0; color: var(--cts-steel); line-height: 1.55; }
.cts-closing { padding: 100px 7vw; background: var(--cts-gold); color: white; text-align: center; }
.cts-closing .cts-kicker { color: var(--cts-ink); }
.cts-closing h2 { max-width: 900px; margin: 0 auto 34px; color: white; }

.cts-footer { padding: 42px 5vw; display: grid; grid-template-columns: 1fr auto auto; gap: 5vw; align-items: center; border-top: 1px solid var(--cts-line); font-size: 11px; }
.cts-footer > div:first-child > p { max-width: 350px; margin: 13px 0 0; color: var(--cts-steel); }
.cts-footer nav { display: flex; flex-wrap: wrap; gap: 17px; }
.cts-footer nav a, .cts-footer > div:last-child > a { font-weight: 800; }
.cts-footer > div:last-child { text-align: right; }
.cts-footer > div:last-child p { margin: 9px 0 0; }

.cts-page-hero { padding: 96px 7vw; background: var(--cts-ink); color: white; }
.cts-page-hero h1 { max-width: 1050px; color: white; font-size: 82px; overflow-wrap: anywhere; }
.cts-page-hero > p:not(.cts-section-label) { max-width: 760px; margin: 25px 0 0; color: #d5dee6; font-family: Georgia, serif; font-size: 23px; line-height: 1.5; }
.cts-page-image { margin: 0; padding: 70px 7vw 0; display: grid; place-items: center; background: white; }
.cts-page-image img { width: min(900px, 100%); max-height: 620px; object-fit: contain; }
.cts-prose { width: min(900px, calc(100% - 48px)); min-height: 430px; margin: 0 auto; padding: 80px 0 100px; font-family: Georgia, serif; font-size: 19px; line-height: 1.85; }
.cts-prose.cts-resource-page { width: 100%; max-width: none; padding: 0; }
.cts-prose h2 { margin: 1.5em 0 .55em; font-size: 39px; line-height: 1.12; }
.cts-prose h3 { font-size: 28px; }
.cts-prose a { color: var(--cts-gold); font-weight: 700; }
.cts-index { width: min(940px, calc(100% - 48px)); min-height: 560px; margin: 0 auto; padding: 75px 0 100px; }
.cts-index article { padding: 40px 0; border-bottom: 1px solid var(--cts-line); }
.cts-index article > p:first-child { color: var(--cts-gold); text-transform: uppercase; font-size: 10px; font-weight: 800; }
.cts-index h2 { margin: 0; font-size: 42px; }
.cts-index h2 a { text-decoration: none; }
.cts-not-found { min-height: 650px; padding: 110px 8vw; }
.cts-not-found h1 { max-width: 900px; margin: 0; font-size: 76px; line-height: .96; }
.cts-not-found > p:not(.cts-section-label) { margin: 25px 0 30px; font-size: 18px; }

@media (max-width: 1150px) {
  .cts-header { grid-template-columns: 1fr auto auto; gap: 16px; }
  .cts-desktop-nav { display: none; }
  .cts-mobile-menu { position: relative; display: block; }
  .cts-mobile-menu summary { width: 42px; height: 42px; display: grid; place-content: center; gap: 4px; cursor: pointer; list-style: none; }
  .cts-mobile-menu summary::-webkit-details-marker { display: none; }
  .cts-mobile-menu summary span { width: 22px; height: 2px; background: var(--cts-ink); }
  .cts-mobile-menu nav, .cts-mobile-menu ul { margin: 0; padding: 13px; display: grid; list-style: none; }
  .cts-mobile-menu nav { position: absolute; top: 52px; right: 0; width: min(340px, calc(100vw - 32px)); background: white; border: 1px solid var(--cts-line); box-shadow: 0 18px 45px rgba(0,0,0,.18); }
  .cts-mobile-menu ul { padding: 0; }
  .cts-mobile-menu nav a { padding: 13px 10px; border-bottom: 1px solid var(--cts-line); font-size: 12px; font-weight: 800; text-decoration: none; }
  .cts-hero-copy h1 { font-size: 84px; }
  .cts-intro h2, .cts-work > header h2, .cts-process h2, .cts-closing h2 { font-size: 53px; }
  .cts-services { grid-template-columns: repeat(2, 1fr); }
  .cts-services article:nth-child(3) { border-left: 0; border-top: 1px solid var(--cts-line); }
  .cts-services article:nth-child(4) { border-top: 1px solid var(--cts-line); }
}

@media (max-width: 760px) {
  .admin-bar .cts-header { top: 46px; }
  .cts-header { min-height: 64px; padding: 0 16px; }
  .cts-header-action { display: none; }
  .cts-brand img { width: 42px; height: 42px; }
  .cts-brand strong { font-size: 16px; }
  .cts-hero { min-height: 720px; }
  .cts-hero-logo { width: 100%; opacity: .2; }
  .cts-hero-wash { background: rgba(255,255,255,.28); }
  .cts-hero-copy { width: 100%; padding: 100px 24px 115px; }
  .cts-hero-copy h1 { font-size: 60px; }
  .cts-hero-copy > p:not(.cts-kicker) { font-size: 24px; }
  .cts-hero-note { left: 24px; right: auto; flex-wrap: wrap; }
  .cts-intro, .cts-process { grid-template-columns: 1fr; }
  .cts-intro { padding: 68px 24px; gap: 34px; }
  .cts-intro h2, .cts-work > header h2, .cts-process h2, .cts-closing h2 { font-size: 42px; }
  .cts-services { grid-template-columns: 1fr; }
  .cts-services article { min-height: 320px; padding: 44px 25px; border-left: 0; border-top: 1px solid var(--cts-line); }
  .cts-services article:first-child { border-top: 0; }
  .cts-work { padding: 68px 18px; }
  .cts-project-grid { grid-template-columns: 1fr; }
  .cts-process { padding: 70px 24px; gap: 40px; }
  .cts-closing { padding: 78px 24px; }
  .cts-footer { padding: 38px 22px; grid-template-columns: 1fr; }
  .cts-footer > div:last-child { text-align: left; }
  .cts-page-hero { padding: 68px 24px; }
  .cts-page-hero h1 { font-size: 54px; }
  .cts-page-image { padding: 42px 20px 0; }
  .cts-prose { width: calc(100% - 42px); padding: 60px 0 76px; font-size: 18px; }
  .cts-prose h2 { font-size: 32px; }
  .cts-not-found { padding: 85px 24px; }
  .cts-not-found h1 { font-size: 52px; }
}

@media (max-width: 390px) {
  .cts-brand small { display: none; }
  .cts-hero-copy h1 { font-size: 52px; }
  .cts-actions { align-items: stretch; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
