/*
Theme Name: Coded TV
Theme URI: https://codedtv.com
Author: Coded TV
Author URI: https://codedtv.com
Description: Custom WordPress theme for Coded TV — a Nigerian media, technology and creative solutions company. Built around a red/white/black broadcast-inspired design system, with a native WordPress blog, an editable Portfolio Projects post type, and Customizer-managed contact details.
Version: 3.4.1 Approved Services Showcase + Academy Training Feature
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: coded-tv
*/

/* =====================================================================
   This file is the theme's main stylesheet (WordPress requires the
   header comment above). Enqueued as-is in functions.php.
   ===================================================================== */
/* =====================================================================
   CODED TV — GLOBAL STYLES
   Shared across every page: tokens, reset, buttons, header, footer.
   Edit this file once and the change appears on every page that
   links to it.
   ===================================================================== */

/* ===================== TOKENS ===================== */
:root{
  --red: #C4121C;
  --red-dark: #8F0D15;
  --red-deep: #6B0A10;
  --white: #FFFFFF;
  --paper: #FAF6F2;
  --ink: #150F0D;
  --ink-soft: #2A211F;
  --grey: #756E68;
  --grey-line: #E7DFD6;

  --display: 'Arial Narrow', 'Oswald', 'Helvetica Neue', Impact, sans-serif;
  --body: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --mono: ui-monospace, 'SF Mono', 'Courier New', monospace;

  --container: 1240px;
  --radius: 2px;
  --ease: cubic-bezier(.22,.68,.12,1);
  --header-h: 106px;
}

*,*::before,*::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; scroll-padding-top: var(--header-h); }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
  *,*::before,*::after{ animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
}

body{
  margin:0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--body);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font-family: inherit; cursor:pointer; }
.container{ max-width: var(--container); margin:0 auto; padding: 0 24px; }
:focus-visible{ outline: 3px solid var(--red); outline-offset: 3px; }

/* ===================== SHARED TEXT STYLES ===================== */
.eyebrow{
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--red);
  display:flex;
  align-items:center;
  gap:10px;
  margin: 0 0 18px;
}
.eyebrow::before{
  content:"";
  width:7px; height:7px; border-radius:50%;
  background: var(--red);
  box-shadow: 0 0 0 3px rgba(228,25,44,0.18);
  flex-shrink:0;
}
.eyebrow.on-light::before{ box-shadow: 0 0 0 3px rgba(255,255,255,0.25); }

h1,h2,h3{
  font-family: var(--display);
  font-weight: 800;
  font-stretch: condensed;
  letter-spacing: -.01em;
  line-height: .96;
  margin: 0;
  text-transform: uppercase;
}
h2{ font-size: clamp(34px, 5.2vw, 64px); }
h3{ font-size: clamp(20px, 2.4vw, 28px); }

.lede{
  font-size: clamp(16px, 1.6vw, 19px);
  line-height: 1.55;
  color: var(--grey);
  max-width: 46ch;
}
.on-dark .lede{ color: rgba(255,255,255,0.72); }
.timecode{ font-family: var(--mono); font-size:12px; letter-spacing:.08em; color: var(--grey); }

.reveal{ opacity:0; transform: translateY(28px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.in-view{ opacity:1; transform: translateY(0); }

/* ===================== BUTTONS ===================== */
.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 16px 28px;
  font-family: var(--body);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .03em;
  text-transform: uppercase;
  border-radius: var(--radius);
  border: 1.5px solid transparent;
  transition: transform .35s var(--ease), background .25s ease, color .25s ease, border-color .25s ease;
  white-space: nowrap;
}
.btn:hover{ transform: translateY(-2px); }
.btn:active{ transform: translateY(0); }

.btn-primary{ background: var(--red); color: var(--white); }
.btn-primary:hover{ background: var(--red-dark); }

.btn-outline{ background: transparent; color: var(--ink); border-color: var(--ink); }
.btn-outline:hover{ background: var(--ink); color: var(--white); }

.btn-outline-light{ background: transparent; color: var(--white); border-color: rgba(255,255,255,0.55); }
.btn-outline-light:hover{ background: var(--white); color: var(--ink); border-color: var(--white); }

.btn-sm{ padding: 11px 20px; font-size:12.5px; }

.play-btn{
  width: 64px; height:64px; border-radius:50%;
  background: rgba(255,255,255,0.95);
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
  transition: transform .35s var(--ease), background .25s ease;
  box-shadow: 0 8px 24px rgba(0,0,0,0.35);
}
.play-btn svg{ width:20px; height:20px; margin-left:3px; }
.play-btn .tri{ fill: var(--red); }
.thumb:hover .play-btn, .featured-reel:hover .play-btn{ transform: scale(1.08); background: var(--red); }
.thumb:hover .play-btn .tri, .featured-reel:hover .play-btn .tri{ fill:#fff; }
.play-btn.sm{ width:46px; height:46px; }
.play-btn.sm svg{ width:14px; height:14px; }

/* ===================== TOPBAR (utility bar: email, hours, socials) ===================== */
.topbar{ background: var(--ink); position: sticky; top:0; z-index: 201; }
.topbar-row{
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding: 9px 24px; font-size:12.5px;
}
.topbar-left{ display:flex; align-items:center; gap:26px; flex-wrap:wrap; }
.topbar-left a, .topbar-hours{
  display:flex; align-items:center; gap:7px; color: rgba(255,255,255,0.78); white-space:nowrap;
}
.topbar-left a:hover{ color:#fff; }
.topbar-left svg{ width:14px; height:14px; fill: var(--red); flex-shrink:0; }

.topbar-right{ display:flex; align-items:center; gap:14px; flex-shrink:0; }
.visit-us-label{ color: rgba(255,255,255,0.6); font-weight:600; white-space:nowrap; }
.topbar-social{ margin-top:0; gap:8px; }
.topbar-social a{ width:26px; height:26px; border:none; background: rgba(255,255,255,0.08); }
.topbar-social svg{ width:12px; height:12px; }

/* ===================== GLOBAL HEADER (white main nav) ===================== */
.site-header{
  position: sticky; top:0; z-index: 200; background:#fff;
  border-bottom: 1px solid var(--grey-line);
  transition: box-shadow .3s ease;
}
.topbar + .site-header{ top: 0; }
.site-header.scrolled{ box-shadow: 0 6px 24px rgba(0,0,0,0.08); }

.nav-row{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding: 14px 24px; }

.logo{ display:flex; align-items:center; gap:10px; flex-shrink:0; }
.logo-mark{ height:38px; width:auto; display:block; }
.logo-word{ font-family: var(--display); font-weight:800; font-size:20px; letter-spacing:.01em; color: var(--ink); line-height:1; }
.logo .dot{ display:none; } /* the live-dot suits a dark header; omitted on the new light nav */
@keyframes pulse-rec{ 0%,100%{opacity:1;} 50%{opacity:.35;} }

/* footer lockup uses the full icon+wordmark image, so no separate text/dot needed */
.logo-full{ height:58px; width:auto; display:block; }

.nav-links{ display:flex; align-items:center; gap:28px; list-style:none; margin:0; padding:0; }
.nav-links li{ position:relative; }
.nav-links a{
  font-size: 13px; font-weight:700; letter-spacing:.02em; text-transform:uppercase;
  color: var(--ink-soft);
  position:relative; padding-bottom:4px; white-space:nowrap;
  display:inline-flex; align-items:center; gap:5px;
}
.nav-links a::after{
  content:""; position:absolute; left:0; bottom:0; width:0; height:2px; background: var(--red);
  transition: width .3s var(--ease);
}
.nav-links a:hover{ color: var(--red); }
.nav-links a:hover::after{ width:100%; }
.nav-links li.current-menu-item > a,
.nav-links li.current_page_item > a,
.nav-links li.current-menu-ancestor > a{ color: var(--red); }
.nav-links li.current-menu-item > a::after,
.nav-links li.current_page_item > a::after,
.nav-links li.current-menu-ancestor > a::after{ width:100%; }

/* dropdown caret + submenu for items with children (set up under Appearance > Menus) */
.nav-links li.menu-item-has-children > a::before{
  content:""; width:6px; height:6px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor;
  transform: rotate(45deg) translateY(-2px); margin-left:2px; order:2;
}
.nav-links .sub-menu{
  list-style:none; margin:0; padding:10px 0; position:absolute; top:100%; left:0;
  background:#fff; border:1px solid var(--grey-line); border-radius: var(--radius);
  min-width:220px; box-shadow: 0 16px 40px rgba(0,0,0,0.12);
  opacity:0; visibility:hidden; transform: translateY(6px); transition: all .2s ease; z-index:50;
}
.nav-links li.menu-item-has-children:hover > .sub-menu{ opacity:1; visibility:visible; transform: translateY(0); }
.nav-links .sub-menu a{ display:block; padding:10px 20px; font-size:12.5px; text-transform:none; letter-spacing:0; font-weight:600; }
.nav-links .sub-menu a::after{ display:none; }
.nav-links .sub-menu a:hover{ background: var(--paper); }

.nav-cta{ display:flex; align-items:center; gap:14px; flex-shrink:0; }
.nav-cta .btn{ padding: 12px 20px; font-size:12px; }
.nav-cta .btn svg{ margin-left:2px; }

.icon-btn{
  width:38px; height:38px; border-radius:50%; border:1px solid var(--grey-line); background:transparent;
  display:flex; align-items:center; justify-content:center; flex-shrink:0; transition: border-color .25s ease, background .25s ease;
}
.icon-btn:hover{ border-color: var(--red); background: rgba(196,18,28,0.06); }
.icon-btn svg{ width:16px; height:16px; fill: var(--ink); }

.search-panel{
  max-height:0; overflow:hidden; background: var(--paper); border-top: 1px solid transparent;
  transition: max-height .35s var(--ease), border-color .35s ease;
}
.search-panel.open{ max-height:90px; border-color: var(--grey-line); }
.search-panel .container{ padding: 18px 24px; }
.search-form{ display:flex; gap:0; max-width:520px; }
.search-form input[type="search"]{
  flex:1; padding:12px 16px; border:1px solid var(--grey-line); border-right:none; border-radius: var(--radius) 0 0 var(--radius);
  font-family: var(--body); font-size:14px;
}
.search-form input[type="search"]:focus{ outline:none; border-color: var(--red); }
.search-form button{
  background: var(--red); color:#fff; border:none; padding:0 20px; border-radius: 0 var(--radius) var(--radius) 0;
  font-weight:700; font-size:12px; text-transform:uppercase; letter-spacing:.05em;
}

.burger{ display:none; width:40px; height:40px; border:1px solid var(--grey-line); background:transparent; border-radius:50%; align-items:center; justify-content:center; flex-shrink:0; }
.burger span, .burger span::before, .burger span::after{
  content:""; display:block; width:16px; height:1.5px; background: var(--ink); position:relative; transition: all .3s ease;
}
.burger span::before{ position:absolute; top:-5px; }
.burger span::after{ position:absolute; top:5px; }
.burger.open span{ background: transparent; }
.burger.open span::before{ top:0; transform: rotate(45deg); background: var(--ink); }
.burger.open span::after{ top:0; transform: rotate(-45deg); background: var(--ink); }

.mobile-panel{
  position: fixed; inset:0; z-index:299; background: var(--ink);
  display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:20px;
  padding: 40px; transform: translateY(-100%); transition: transform .45s var(--ease);
  overflow-y:auto;
}
.mobile-panel.open{ transform: translateY(0); }
.mobile-panel a{ font-family: var(--display); font-weight:800; font-size: 30px; color:#fff; text-transform:uppercase; }
.mobile-panel .mobile-logo{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.mobile-panel .mobile-logo .logo-mark{ height:40px; }
.mobile-panel .mobile-logo .logo-word{ font-size:22px; color:#fff; }
.mobile-panel .btn{ margin-top:10px; }
.mobile-panel .social-row{ margin-top: 20px; }

/* spacer so fixed header doesn't overlap page content on inner pages */
.page-offset{ height: var(--header-h); }

@media (max-width: 1100px){
  .nav-links, .nav-cta .btn{ display:none; }
  .burger{ display:flex; }
  .topbar-left{ gap:16px; }
  .visit-us-label{ display:none; }
}
@media (max-width: 700px){
  .topbar-row{ flex-wrap:wrap; gap:8px; padding: 8px 20px; }
  .topbar-hours{ display:none; }
}

/* ===================== GLOBAL FOOTER ===================== */
footer.site-footer{ background: var(--ink); color: rgba(255,255,255,0.7); padding: 80px 0 28px; }

.footer-top{ display:grid; grid-template-columns: 1.2fr .85fr .85fr 1.1fr 1.1fr; gap: 32px; padding-bottom: 48px; border-bottom: 1px solid rgba(255,255,255,0.1); }

.footer-brand .logo{ margin-bottom: 16px; }
.footer-brand p{ font-size:14px; line-height:1.65; max-width: 42ch; color: rgba(255,255,255,0.6); margin: 0 0 22px; }

.footer-col h4{ font-family: var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:#fff; margin: 0 0 18px; }
.footer-col ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.footer-col a{ font-size:14px; color: rgba(255,255,255,0.6); transition: color .25s ease; }
.footer-col a:hover{ color: var(--red); }

.footer-addr{ font-size:13.5px; line-height:1.55; color: rgba(255,255,255,0.6); margin:0 0 16px; }
.footer-addr strong{ display:block; color: rgba(255,255,255,0.9); font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; margin-bottom:4px; }

.footer-hours{ font-size:13.5px; line-height:1.7; color: rgba(255,255,255,0.6); }
.footer-hours .row{ display:flex; justify-content:space-between; gap:12px; }

.social-row{ display:flex; gap:10px; margin-top:6px; flex-wrap:wrap; }
.social-row a{ width:36px; height:36px; border:1px solid rgba(255,255,255,0.2); border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; transition: background .25s ease, border-color .25s ease; }
.social-row a:hover{ border-color: var(--red); background: var(--red); }
.social-row svg{ width:14px; height:14px; fill: rgba(255,255,255,0.75); }
.social-row a:hover svg{ fill:#fff; }

.newsletter{ margin-top: 22px; }
.newsletter-form{ display:flex; gap:0; border:1px solid rgba(255,255,255,0.22); border-radius: var(--radius); overflow:hidden; max-width: 340px; }
.newsletter-form input{
  flex:1; min-width:0; background:transparent; border:none; padding: 13px 14px;
  color:#fff; font-family: var(--body); font-size:13.5px;
}
.newsletter-form input::placeholder{ color: rgba(255,255,255,0.4); }
.newsletter-form input:focus{ outline:none; background: rgba(255,255,255,0.06); }
.newsletter-form button{
  background: var(--red); color:#fff; border:none; padding: 0 18px;
  font-family: var(--body); font-weight:700; font-size:12px; letter-spacing:.05em; text-transform:uppercase;
  transition: background .25s ease;
}
.newsletter-form button:hover{ background: var(--red-dark); }
.newsletter-note{ font-size:12px; color: rgba(255,255,255,0.4); margin-top:10px; }
.newsletter-note.success{ color: var(--red); }

.footer-contact-row{ display:flex; align-items:center; gap:10px; font-size:14px; margin-bottom:10px; color: rgba(255,255,255,0.72); }
.footer-contact-row svg{ width:16px; height:16px; fill: var(--red); flex-shrink:0; }
.footer-contact-row a:hover{ color: var(--red); }

.footer-bottom{ display:flex; justify-content:space-between; align-items:center; padding-top: 26px; flex-wrap:wrap; gap:14px; }
.footer-bottom-left{ display:flex; align-items:center; gap:20px; flex-wrap:wrap; }
.footer-bottom p{ font-family: var(--mono); font-size:11.5px; letter-spacing:.05em; color: rgba(255,255,255,0.4); margin:0; }
.footer-legal{ display:flex; gap:18px; }
.footer-legal a{ font-size:12px; color: rgba(255,255,255,0.5); }
.footer-legal a:hover{ color: var(--red); }

.onair-pill{ display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color: rgba(255,255,255,0.6); }
.onair-pill .dot{ width:7px; height:7px; border-radius:50%; background: var(--red); animation: pulse-rec 2.2s infinite; }

.sav-fab{
  position: fixed; right: 22px; bottom: 22px; z-index: 150;
  display:flex; align-items:center; gap:10px;
  background: var(--red); color:#fff; border-radius: 50px;
  padding: 14px 20px 14px 16px;
  box-shadow: 0 10px 28px rgba(0,0,0,0.35);
  font-family: var(--body); font-weight:700; font-size:13px; letter-spacing:.02em; text-transform:uppercase;
  transition: transform .3s var(--ease), background .25s ease;
}
.sav-fab:hover{ transform: translateY(-3px); background: var(--red-dark); }
.sav-fab .sav-dot{ width:8px; height:8px; border-radius:50%; background:#fff; animation: pulse-rec 1.8s infinite; }

/* ===================== VIDEO LIGHTBOX (shared) ===================== */
#videoLightbox{
  position:fixed; inset:0; background:rgba(10,7,6,0.92); display:none;
  align-items:center; justify-content:center; z-index:1000; padding:24px;
}
#videoLightbox .lb-inner{ width:100%; max-width:960px; aspect-ratio:16/9; position:relative; }
#videoLightbox #closeLightbox{
  position:absolute; top:-44px; right:0; background:transparent; border:none; color:#fff; font-size:28px; line-height:1;
}
#videoLightbox #lightboxFrame{ width:100%; height:100%; background:#000; }

/* ===================== GENERIC INNER-PAGE HERO ===================== */
/* Reusable banner for every page that isn't the homepage. Keeps the
   fixed header readable (dark background sits directly under it)
   without needing extra header states. */
.page-hero{ background: var(--ink); color:#fff; padding: 80px 0 80px; position:relative; overflow:hidden; }
.page-hero::before{
  content:""; position:absolute; inset:0;
  background: radial-gradient(ellipse at 20% 0%, rgba(228,25,44,0.22), transparent 55%);
  pointer-events:none;
}
.page-hero .container{ position:relative; z-index:1; }
.page-hero .eyebrow{ color: rgba(255,255,255,0.85); }
.page-hero h1{ font-size: clamp(38px, 6.5vw, 76px); max-width: 20ch; margin: 0 0 18px; }
.page-hero .lede{ color: rgba(255,255,255,0.72); max-width: 56ch; }

.coming-soon{ padding: 100px 0; text-align:center; }
.coming-soon .badge{
  display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:11px;
  letter-spacing:.12em; text-transform:uppercase; color: var(--red); background: rgba(228,25,44,0.08);
  padding: 6px 14px; border-radius: 20px; margin-bottom: 22px;
}
.coming-soon .badge .dot{ width:6px; height:6px; border-radius:50%; background: var(--red); animation: pulse-rec 2.2s infinite; }
.coming-soon h2{ margin-bottom: 16px; }
.coming-soon .lede{ margin: 0 auto 32px; }

/* ===================== SECTION SHELL (shared) ===================== */
.section-pad{ padding: 110px 0; }
.section-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:32px; margin-bottom: 56px; flex-wrap:wrap; }
.section-head .lede{ margin-top:14px; }
.section-head.center{ flex-direction:column; align-items:center; text-align:center; }
.section-head.center .eyebrow{ justify-content:center; }
.section-head.center .lede{ margin-left:auto; margin-right:auto; }

/* ===================== CHANNEL GUIDE GRID (shared) =====================
   Used for: home services, academy programmes — anywhere a set of
   options needs a broadcast-style "channel" card. */
.channels{ display:grid; grid-template-columns: repeat(3, 1fr); gap:1px; background: var(--grey-line); border:1px solid var(--grey-line); }
.channels.cols-2{ grid-template-columns: repeat(2, 1fr); }
.channel-card{
  background: var(--paper); padding: 34px 30px; position:relative; overflow:hidden;
  min-height: 300px; display:flex; flex-direction:column; justify-content:space-between;
  transition: background .4s ease;
}
.channel-card::before{ content:""; position:absolute; inset:0; background: var(--red); transform: translateY(100%); transition: transform .45s var(--ease); z-index:0; }
.channel-card:hover::before{ transform: translateY(0); }
.channel-card > *{ position:relative; z-index:1; }
.channel-card:hover{ color:#fff; }
.channel-card:hover .ch-num, .channel-card:hover .ch-desc{ color: rgba(255,255,255,0.85); }
.channel-card:hover .play-btn.sm{ background:#fff; }
.channel-card:hover .play-btn.sm .tri{ fill: var(--red); }

.ch-num{ font-family: var(--mono); font-size:13px; color: var(--red); letter-spacing:.1em; transition: color .4s ease; }
.ch-name{ font-family: var(--display); font-weight:800; font-size: clamp(24px,2.6vw,30px); margin: 14px 0 10px; text-transform:uppercase; }
.ch-desc{ font-size:14.5px; color: var(--grey); line-height:1.5; margin:0 0 26px; transition: color .4s ease; }
.ch-foot{ display:flex; align-items:center; justify-content:space-between; }
.ch-list{ list-style:none; margin:0 0 26px; padding:0; font-size:13.5px; color:var(--grey); line-height:1.9; transition: color .4s ease; }
.channel-card:hover .ch-list{ color: rgba(255,255,255,0.85); }
.ch-list li::before{ content:"— "; }

/* ===================== SHOWREEL / THUMB GRID (shared) ===================== */
.reel-wrap{ display:grid; grid-template-columns: 1.6fr 1fr; gap: 22px; }
.featured-reel{ position:relative; aspect-ratio: 16/10; border-radius: var(--radius); overflow:hidden; background: linear-gradient(135deg,#241512,#0e0a09); display:flex; align-items:center; justify-content:center; cursor:pointer; }
.featured-reel .thumb-tex{ position:absolute; inset:0; background: radial-gradient(circle at 25% 30%, rgba(228,25,44,0.35), transparent 55%), repeating-linear-gradient(120deg, rgba(255,255,255,0.03) 0 2px, transparent 2px 5px); }
.reel-meta{ position:absolute; left:24px; bottom:24px; z-index:2; }
.reel-meta .tag{ font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:#fff; background: var(--red); padding: 5px 10px; border-radius: 2px; margin-bottom:10px; display:inline-block; }
.reel-meta h3{ color:#fff; }
.reel-duration{ position:absolute; right:20px; top:20px; z-index:2; font-family:var(--mono); font-size:12px; color:#fff; background: rgba(0,0,0,0.5); padding:5px 10px; border-radius:2px; }

.reel-side{ display:flex; flex-direction:column; gap:22px; }
.thumb{ position:relative; aspect-ratio: 16/9.4; border-radius: var(--radius); overflow:hidden; cursor:pointer; background: linear-gradient(140deg,#231411,#100b09); display:flex; align-items:center; justify-content:center; }
.thumb .thumb-tex{ position:absolute; inset:0; background: radial-gradient(circle at 70% 30%, rgba(228,25,44,0.28), transparent 60%); }
.thumb .reel-meta{ left:18px; bottom:16px; }
.thumb .reel-meta .tag{ font-size:10px; padding:4px 8px; }
.thumb .reel-meta h3{ font-size: 18px; }
.thumb .reel-duration{ right:14px; top:14px; font-size:11px; }

.grid-projects{ margin-top: 22px; display:grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
.grid-projects .thumb{ aspect-ratio: 4/5; }
.grid-projects.cols-3 .thumb{ aspect-ratio: 4/3.4; }

/* ===================== STATS STRIP (shared) ===================== */
.stats-strip{ background: var(--ink); color:#fff; padding: 64px 0; }
.stats-grid{ display:grid; grid-template-columns: repeat(4,1fr); }
.stat{ text-align:center; padding: 0 20px; border-left: 1px solid rgba(255,255,255,0.12); }
.stat:first-child{ border-left:none; }
.stat .num{ font-family: var(--display); font-weight:800; font-size: clamp(36px,4.6vw,58px); color: var(--red); line-height:1; }
.stat .label{ font-family: var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color: rgba(255,255,255,0.6); margin-top:10px; }

/* ===================== SAV / INFO BANNER (shared) ===================== */
.sav-banner{ background: var(--white); border: 1px solid var(--grey-line); border-radius: var(--radius); padding: 56px; display:grid; grid-template-columns: 1.1fr .9fr; gap: 40px; align-items:center; position:relative; overflow:hidden; }
.sav-banner::after{ content:""; position:absolute; top:-40%; right:-10%; width:420px; height:420px; border-radius:50%; background: radial-gradient(circle, rgba(228,25,44,0.12), transparent 70%); }
.sav-chatcard{ background: var(--paper); border:1px solid var(--grey-line); border-radius: var(--radius); padding: 22px; position:relative; z-index:1; }
.sav-chatcard .avatar{ width:34px; height:34px; border-radius:50%; background: var(--red); color:#fff; display:flex; align-items:center; justify-content:center; font-family:var(--display); font-weight:800; font-size:16px; flex-shrink:0; }
.sav-msg{ display:flex; gap:12px; align-items:flex-start; margin-bottom:16px; }
.sav-msg p{ margin:0; background:#fff; border:1px solid var(--grey-line); padding:12px 16px; border-radius: 4px 12px 12px 12px; font-size:14px; line-height:1.5; }
.sav-msg.user{ flex-direction:row-reverse; }
.sav-msg.user p{ background: var(--ink); color:#fff; border-color: var(--ink); border-radius: 12px 4px 12px 12px; }
.sav-msg.user .avatar{ background: var(--ink); }
.sav-badge{ display:inline-flex; align-items:center; gap:6px; font-family:var(--mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; background: rgba(228,25,44,0.1); color: var(--red); padding:4px 10px; border-radius: 20px; margin-bottom:6px; }

/* ===================== QUOTE / TESTIMONIAL CARDS (shared) ===================== */
.quotes{ display:grid; grid-template-columns: repeat(2,1fr); gap: 22px; }
.quotes.cols-1{ grid-template-columns: 1fr; max-width: 640px; margin: 0 auto; }
.quotes.cols-3{ grid-template-columns: repeat(3,1fr); }
.quote-card{ background: var(--white); border:1px solid var(--grey-line); border-radius: var(--radius); padding: 36px; position:relative; }
.quote-card .mark{ font-family: var(--display); font-weight:800; font-size: 64px; color: var(--red); line-height:.5; display:block; margin-bottom: 18px; }
.quote-card p.q{ font-size: 18px; line-height:1.55; margin:0 0 22px; }
.quote-person{ display:flex; align-items:center; gap:12px; }
.quote-person .qavatar{ width:42px; height:42px; border-radius:50%; background: var(--ink); color:#fff; display:flex; align-items:center; justify-content:center; font-family:var(--display); font-weight:800; font-size:16px; flex-shrink:0; }
.quote-person .name{ font-weight:700; font-size:14px; }
.quote-person .role{ font-size:12.5px; color: var(--grey); }
@media (max-width: 980px){ .quotes.cols-3{ grid-template-columns: repeat(1,1fr); } }

/* ===================== PLAIN TAG LIST (shared: client types, industries) ===================== */
.tag-list{ display:flex; flex-wrap:wrap; gap:10px; }
.tag-list span{
  font-family: var(--mono); font-size:12px; letter-spacing:.05em; text-transform:uppercase;
  padding: 10px 18px; border-radius: 30px; border: 1px solid var(--grey-line); color: var(--ink-soft); background: var(--paper);
}

/* ===================== SIMPLE VALUE / ROLE CARD (shared, no photo) ===================== */
.value-card{ background: var(--paper); border:1px solid var(--grey-line); padding: 26px; border-radius: var(--radius); transition: border-color .25s ease; }
.value-card:hover{ border-color: var(--red); }
.value-card h4{ font-family: var(--display); font-weight:800; font-size:18px; text-transform:uppercase; margin: 0 0 8px; }
.value-card p{ font-size:13.5px; color: var(--grey); line-height:1.5; margin:0; }
.value-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:16px; }
@media (max-width: 980px){ .value-grid{ grid-template-columns: repeat(2,1fr); } }
@media (max-width: 620px){ .value-grid{ grid-template-columns: 1fr; } }

/* ===================== NOTICE BANNER (shared: pending-approval / coming-soon states) ===================== */
.notice-banner{
  background: rgba(196,18,28,0.06); border:1px solid rgba(196,18,28,0.2); border-radius: var(--radius);
  padding: 20px 24px; display:flex; gap:14px; align-items:flex-start; margin-bottom: 40px;
}
.notice-banner svg{ width:20px; height:20px; fill: var(--red); flex-shrink:0; margin-top:2px; }
.notice-banner p{ font-size:14px; line-height:1.55; color: var(--ink-soft); margin:0; }
.notice-banner strong{ display:block; margin-bottom:4px; }

/* ===================== FAQ ACCORDION (shared, native <details>) ===================== */
.faq-list{ max-width: 780px; }
.faq-item{ border-bottom: 1px solid var(--grey-line); padding: 6px 0; }
.faq-item summary{
  cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:20px;
  padding: 18px 0; font-family: var(--display); font-weight:800; font-size:17px; text-transform:uppercase; letter-spacing:-.01em;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{ content:"+"; font-family: var(--body); font-weight:400; font-size:22px; color: var(--red); flex-shrink:0; }
.faq-item[open] summary::after{ content:"\2212"; }
.faq-item p{ font-size:14.5px; color: var(--grey); line-height:1.6; margin:0 0 20px; max-width:65ch; }

/* ===================== FINAL CTA BAND (shared) ===================== */
.final-cta{ background: var(--red); color:#fff; padding: 110px 0; text-align:center; position:relative; overflow:hidden; }
.final-cta::before{ content:""; position:absolute; inset:0; background: repeating-linear-gradient(115deg, rgba(255,255,255,0.05) 0 2px, transparent 2px 40px); }
.final-cta .inner{ position:relative; z-index:1; max-width: 720px; margin:0 auto; }
.final-cta h2{ color:#fff; margin-bottom: 20px; }
.final-cta .lede{ color: rgba(255,255,255,0.85); max-width:52ch; margin: 0 auto 40px; }
.final-cta .ctas{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
.final-cta .btn-primary{ background:#fff; color: var(--red); }
.final-cta .btn-primary:hover{ background: var(--ink); color:#fff; }

/* ===================== NUMBERED PROCESS STEPS (shared) =====================
   For genuine sequences only: production process, how-we-work timelines. */
.process-steps{ display:grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--grey-line); border: 1px solid var(--grey-line); }
.process-steps.cols-6{ grid-template-columns: repeat(3, 1fr); }
.process-step{ background: var(--paper); padding: 32px 26px; position:relative; }
.process-step .pnum{ font-family: var(--display); font-weight:800; font-size: 44px; color: var(--grey-line); line-height:1; margin-bottom: 18px; }
.process-step h3{ font-size: 19px; margin-bottom: 10px; }
.process-step p{ font-size: 13.5px; color: var(--grey); line-height:1.55; margin:0; }
@media (max-width: 980px){ .process-steps.cols-6{ grid-template-columns: repeat(2,1fr); } }
@media (max-width: 620px){ .process-steps.cols-6{ grid-template-columns: repeat(1,1fr); } }

/* ===================== MEDIA BLOCK (image/video placeholder, shared) ===================== */
.media-block{
  position:relative; border-radius: var(--radius); overflow:hidden; aspect-ratio: 4/3;
  background: linear-gradient(140deg,#241512,#0e0a09);
}
.media-block .thumb-tex{ position:absolute; inset:0; background: radial-gradient(circle at 30% 25%, rgba(228,25,44,0.3), transparent 55%); }
.media-block.wide{ aspect-ratio: 16/10; }
.media-block.square{ aspect-ratio: 1/1; }

/* ===================== SPLIT CONTENT ROW (shared) ===================== */
.split-row{ display:grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items:center; }
.split-row.reverse{ direction: rtl; }
.split-row.reverse > *{ direction: ltr; }
.split-row ul.check-list{ list-style:none; margin: 22px 0 0; padding:0; display:flex; flex-direction:column; gap:12px; }
.split-row ul.check-list li{ display:flex; gap:10px; font-size:15px; color: var(--ink-soft); align-items:flex-start; }
.split-row ul.check-list li::before{ content:"✓"; color: var(--red); font-weight:700; flex-shrink:0; }

/* ===================== PILL TAGS / FILTERS (shared) ===================== */
.pill-filters{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom: 40px; }
.pill-filter{
  font-family: var(--mono); font-size:12px; letter-spacing:.06em; text-transform:uppercase;
  padding: 10px 18px; border-radius: 30px; border: 1px solid var(--grey-line); background: transparent; color: var(--grey);
  transition: all .25s ease;
}
.pill-filter:hover{ border-color: var(--ink); color: var(--ink); }
.pill-filter.active{ background: var(--red); border-color: var(--red); color: #fff; }

/* ===================== PEOPLE GRID (shared: team / alumni) ===================== */
.people-grid{ display:grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.person-card{ text-align:left; }
.person-photo{
  aspect-ratio: 4/5; border-radius: var(--radius); margin-bottom: 16px; position:relative; overflow:hidden;
  background: linear-gradient(150deg,#241512,#0e0a09); display:flex; align-items:center; justify-content:center;
}
.person-photo .thumb-tex{ position:absolute; inset:0; background: radial-gradient(circle at 35% 25%, rgba(228,25,44,0.28), transparent 55%); }
.person-initial{ position:relative; z-index:1; font-family: var(--display); font-weight:800; font-size: 42px; color: rgba(255,255,255,0.85); }
.person-card .name{ font-family: var(--display); font-weight:800; font-size:19px; text-transform:uppercase; margin-bottom:2px; }
.person-card .role{ font-family: var(--mono); font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color: var(--red); }

/* ===================== FORM ELEMENTS (shared) ===================== */
.field{ margin-bottom: 20px; }
.field label{ display:block; font-family:var(--mono); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; color: var(--grey); margin-bottom:8px; }
.field input, .field select, .field textarea{
  width:100%; padding: 14px 16px; border:1px solid var(--grey-line); border-radius: var(--radius);
  background: var(--white); font-family: var(--body); font-size:14.5px; color: var(--ink);
  transition: border-color .25s ease;
}
.field input:focus, .field select:focus, .field textarea:focus{ outline:none; border-color: var(--red); }
.field textarea{ resize: vertical; min-height: 130px; }
.field-row{ display:grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.form-note{ font-size:13px; color: var(--grey); margin-top:6px; }
.form-note.success{ color: var(--red); font-weight:600; }

/* ===================== RESPONSIVE (shared components) ===================== */
@media (max-width: 980px){
  .footer-top{ grid-template-columns: 1fr 1fr; row-gap: 40px; }
  .footer-brand{ grid-column: 1 / -1; }
  .reel-wrap{ grid-template-columns: 1fr; }
  .grid-projects{ grid-template-columns: repeat(2,1fr); }
  .channels{ grid-template-columns: repeat(2,1fr); }
  .stats-grid{ grid-template-columns: repeat(2,1fr); row-gap: 32px; }
  .stat:nth-child(3){ border-left:none; }
  .sav-banner{ grid-template-columns: 1fr; }
  .quotes{ grid-template-columns: 1fr; }
  .process-steps{ grid-template-columns: repeat(2,1fr); }
  .split-row{ grid-template-columns: 1fr; gap: 32px; }
  .split-row.reverse{ direction: ltr; }
  .people-grid{ grid-template-columns: repeat(2,1fr); }
  .field-row{ grid-template-columns: 1fr; }
}
@media (max-width: 620px){
  .footer-top{ grid-template-columns: 1fr; }
  .footer-bottom{ flex-direction:column; align-items:flex-start; }
  .sav-fab span.fab-label{ display:none; }
  .sav-fab{ padding: 14px; }
  .section-pad{ padding: 76px 0; }
  .channels{ grid-template-columns: 1fr; }
  .grid-projects{ grid-template-columns: 1fr; }
  .stats-grid{ grid-template-columns: 1fr; }
  .stat{ border-left:none; border-top: 1px solid rgba(255,255,255,0.12); padding-top:24px; }
  .stat:first-child{ border-top:none; padding-top:0; }
  .process-steps{ grid-template-columns: 1fr; }
  .people-grid{ grid-template-columns: 1fr 1fr; }
  .page-hero{ padding: 60px 0 50px; }
}

/* ===================== KEY/VALUE LIST (shared: hours, quick facts) ===================== */
.kv-list{ display:flex; flex-direction:column; gap:11px; font-size:13.5px; }
.kv-list .row{ display:flex; justify-content:space-between; gap:16px; }
.kv-list .row .k{ color: var(--grey); }
.kv-list .row .v{ font-weight:700; text-align:right; }

/* ===================== INFO CARD (shared: contact offices) ===================== */
.info-card{ background: var(--white); border:1px solid var(--grey-line); border-radius: var(--radius); padding: 26px; }
.info-card h4{ font-family: var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color: var(--red); margin: 0 0 10px; }
.info-card p{ font-size:14px; line-height:1.6; color: var(--ink-soft); margin:0; }

/* ===================== MILESTONE ROW (shared: about timeline) ===================== */
.milestone-row{ display:flex; gap:26px; padding: 22px 0; border-top: 1px solid var(--grey-line); align-items:baseline; }
.milestone-row:last-child{ border-bottom: 1px solid var(--grey-line); }
.milestone-row .myear{ font-family: var(--display); font-weight:800; font-size: 26px; color: var(--red); flex-shrink:0; width: 90px; }
.milestone-row .mtext{ font-size:15px; color: var(--ink-soft); line-height:1.5; }

/* ===================== BLOG CARDS (shared) ===================== */
.blog-featured{ display:grid; grid-template-columns: 1.1fr .9fr; gap:40px; align-items:center; margin-bottom: 60px; }
.blog-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:26px; }
.blog-card{ display:block; }
.blog-card .media-block{ margin-bottom:18px; aspect-ratio: 4/3; }
.blog-card .tag{ font-family:var(--mono); font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color: var(--red); margin-bottom:10px; display:inline-block; }
.blog-card h3{ font-size: 21px; margin-bottom:10px; }
.blog-card p.excerpt{ font-size:14px; color:var(--grey); line-height:1.55; margin:0 0 12px; }
.blog-meta{ font-family: var(--mono); font-size:11.5px; color: var(--grey); letter-spacing:.04em; }

@media (max-width: 980px){
  .blog-featured{ grid-template-columns:1fr; }
  .blog-grid{ grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 620px){
  .blog-grid{ grid-template-columns: 1fr; }
}
/* ===================== HERO (home only) ===================== */
.hero{ position:relative; min-height: calc(100svh - var(--header-h)); display:flex; flex-direction:column; justify-content:flex-end; background: var(--ink); overflow:hidden; color:#fff; }
.hero-media{
  position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(ellipse at 30% 20%, rgba(228,25,44,0.28), transparent 55%),
    linear-gradient(180deg, rgba(21,15,13,0.35) 0%, rgba(21,15,13,0.55) 55%, rgba(21,15,13,0.96) 100%),
    repeating-linear-gradient(115deg, #1c1310 0 2px, #17100e 2px 4px),
    linear-gradient(135deg, #241512 0%, #150f0d 60%, #0e0a09 100%);
  background-blend-mode: normal, normal, overlay, normal;
  animation: kenburns 22s ease-in-out infinite alternate;
}
@keyframes kenburns{ from{ transform: scale(1); } to{ transform: scale(1.08); } }
.hero-grain{
  position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.5; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}
.viewfinder{ position:absolute; inset: 24px 24px; z-index:2; pointer-events:none; opacity:.55; }
.vf-corner{ position:absolute; width:26px; height:26px; border: 1.5px solid rgba(255,255,255,0.55); }
.vf-corner.tl{ top:0; left:0; border-right:none; border-bottom:none; }
.vf-corner.tr{ top:0; right:0; border-left:none; border-bottom:none; }
.vf-corner.bl{ bottom:0; left:0; border-right:none; border-top:none; }
.vf-corner.br{ bottom:0; right:0; border-left:none; border-top:none; }
.hero-tag{ position:absolute; top: 24px; right: 24px; z-index: 3; font-family: var(--mono); font-size:11px; letter-spacing:.15em; text-transform:uppercase; color: rgba(255,255,255,0.75); display:flex; align-items:center; gap:8px; }
.hero-tag .dot{ width:7px; height:7px; border-radius:50%; background: var(--red); animation: pulse-rec 2.2s infinite; }
.hero-inner{ position:relative; z-index:3; padding: 70px 0 40px; }
.hero-inner .eyebrow{ color: rgba(255,255,255,0.85); }
.hero-title{ font-size: clamp(48px, 9.6vw, 128px); line-height: .92; margin: 0 0 22px; max-width: 16ch; }
.hero-title em{ font-style: italic; color: var(--red); }
.hero-sub{ font-size: clamp(16px, 1.7vw, 20px); color: rgba(255,255,255,0.75); max-width: 52ch; margin: 0 0 36px; line-height:1.6; }
.hero-ctas{ display:flex; flex-wrap:wrap; gap:16px; margin-bottom: 56px; }
.ticker{ border-top: 1px solid rgba(255,255,255,0.14); overflow:hidden; white-space:nowrap; padding: 18px 0; }
.ticker-track{ display:inline-flex; gap:0; animation: ticker 26s linear infinite; }
@keyframes ticker{ from{ transform: translateX(0); } to{ transform: translateX(-50%); } }
.ticker-item{ font-family: var(--mono); font-size:13px; letter-spacing:.1em; text-transform:uppercase; color: rgba(255,255,255,0.55); padding: 0 20px; display:flex; align-items:center; gap:20px; }
.ticker-item .sep{ color: var(--red); }

@media (max-width: 620px){
  .hero-inner{ padding-top: 40px; }
  .viewfinder{ inset: 16px 14px; }
  .hero-tag{ top: 16px; }
}

/* =====================================================================
   WORDPRESS-SPECIFIC ADDITIONS
   Blog prose, pagination, form banners, portfolio filter states,
   and core alignment/caption classes WordPress expects every theme
   to support.
   ===================================================================== */

/* ---- Core WP alignment / caption classes ---- */
.alignleft{ float:left; margin:6px 24px 16px 0; }
.alignright{ float:right; margin:6px 0 16px 24px; }
.aligncenter{ display:block; margin:16px auto; }
.wp-caption{ max-width:100%; }
.wp-caption-text{ font-size:13px; color:var(--grey); margin-top:8px; }
.screen-reader-text{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }

/* ---- Entry content / prose (real blog posts, legal pages) ---- */
.entry-content, .prose{
  font-size:16px; line-height:1.75; color:var(--ink-soft); max-width:720px;
}
.entry-content p, .prose p{ margin:0 0 22px; }
.entry-content h2, .prose h2{ font-size:clamp(24px,3vw,32px); margin:44px 0 16px; text-transform:none; letter-spacing:-.01em; }
.entry-content h3, .prose h3{ font-size:clamp(19px,2.2vw,23px); margin:36px 0 12px; text-transform:none; letter-spacing:-.01em; }
.entry-content ul, .entry-content ol, .prose ul, .prose ol{ margin:0 0 22px; padding-left:22px; }
.entry-content li, .prose li{ margin-bottom:8px; }
.entry-content a, .prose a{ color:var(--red); text-decoration:underline; text-underline-offset:2px; }
.entry-content img{ border-radius:var(--radius); margin:8px 0 22px; }
.entry-content blockquote, .prose blockquote{
  border-left:3px solid var(--red); margin:28px 0; padding:4px 0 4px 22px; font-style:italic; color:var(--ink);
}
.entry-content figcaption{ font-size:13px; color:var(--grey); margin-top:-14px; margin-bottom:22px; }
.entry-content hr, .prose hr{ border:none; border-top:1px solid var(--grey-line); margin:40px 0; }
.entry-content table, .prose table{ width:100%; border-collapse:collapse; margin:0 0 22px; font-size:14.5px; }
.entry-content th, .entry-content td, .prose th, .prose td{ border:1px solid var(--grey-line); padding:10px 14px; text-align:left; }

/* ---- Single post header meta ---- */
.post-meta{ display:flex; flex-wrap:wrap; gap:16px; align-items:center; margin-top:18px; }
.post-meta span{ font-family:var(--mono); font-size:12px; letter-spacing:.05em; color:rgba(255,255,255,0.65); text-transform:uppercase; }
.post-meta .cat-pill{ background:var(--red); color:#fff; padding:5px 12px; border-radius:20px; font-size:11px; letter-spacing:.08em; }
.post-featured-media{ margin:0 0 48px; }
.post-featured-media .media-block{ aspect-ratio:21/9; }
.post-featured-media img{ width:100%; aspect-ratio:21/9; object-fit:cover; border-radius:var(--radius); }

/* ---- Blog card image (real featured images, falls back to placeholder) ---- */
.blog-card .media-block img{ width:100%; height:100%; object-fit:cover; position:relative; z-index:1; }
.blog-featured .media-block img{ width:100%; height:100%; object-fit:cover; position:relative; z-index:1; }
.thumb img, .featured-reel img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }

/* ---- Pagination ---- */
.site-pagination{ display:flex; flex-wrap:wrap; gap:10px; margin-top:50px; }
.site-pagination a, .site-pagination span{
  font-family:var(--mono); font-size:13px; padding:10px 16px; border:1px solid var(--grey-line); border-radius:var(--radius); color:var(--ink-soft);
}
.site-pagination a:hover{ border-color:var(--red); color:var(--red); }
.site-pagination .current{ background:var(--ink); border-color:var(--ink); color:#fff; }

/* ---- Form success / error banners ---- */
.form-banner{ border-radius:var(--radius); padding:16px 20px; font-size:14px; margin-bottom:24px; }
.form-banner.success{ background:rgba(196,18,28,0.07); border:1px solid rgba(196,18,28,0.25); color:var(--ink); }
.form-banner.error{ background:rgba(196,18,28,0.07); border:1px solid var(--red); color:var(--red-dark); }

/* ---- No-JS fallback: hide lightbox trigger cursor affordance gracefully if JS disabled (harmless either way) ---- */
.no-js .thumb, .no-js .featured-reel{ cursor:default; }

/* ---- Empty state (no posts / no projects yet) ---- */
.empty-state{ text-align:center; padding:60px 20px; color:var(--grey); }
.empty-state h3{ margin-bottom:10px; }

/* ---- WordPress nav menu integration ---- */
/* Desktop menu: wp_nav_menu outputs <li><a>, style through the <li> state classes */
.nav-links li{ list-style:none; }
.nav-links li.current-menu-item > a,
.nav-links li.current_page_item > a,
.nav-links li.current-menu-ancestor > a{ color:#fff; }
.nav-links li.current-menu-item > a::after,
.nav-links li.current_page_item > a::after,
.nav-links li.current-menu-ancestor > a::after{ width:100%; }

/* Mobile menu: collapse the <ul>/<li> wrapper so <a> becomes a direct
   flex child of .mobile-panel and inherits its existing link styling. */
.mobile-menu-list, .mobile-menu-list li{ display:contents; }

/* ===================== EDITABLE HOMEPAGE VIDEO + HIRE MODAL ===================== */
.hero-media{ overflow:hidden; background:var(--ink); transform:none !important; animation:none; }
.hero-youtube-bg{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:177.77777778vh; height:100vh; min-width:100%; min-height:56.25vw;
  border:0; pointer-events:none; max-width:none;
}
.hero-video-overlay{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(90deg,rgba(20,0,2,.76) 0%,rgba(18,0,2,.58) 48%,rgba(0,0,0,.55) 100%),
    linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.28) 72%,rgba(0,0,0,.55) 100%);
}
.hero-grain{ z-index:2; }
.viewfinder{ z-index:3; }
.hero-tag,.hero-inner{ z-index:4; }
.ticker{ position:relative; z-index:4; }
.coded-tv-about-media{ overflow:hidden; min-height:360px; }
.coded-tv-about-media iframe{ width:100%; height:100%; min-height:360px; border:0; display:block; }

.coded-tv-hire-modal{
  position:fixed; inset:0; z-index:99999; display:none; align-items:center; justify-content:center;
  padding:24px; background:rgba(0,0,0,.82); backdrop-filter:blur(4px);
}
.coded-tv-hire-modal.is-open{ display:flex; }
.coded-tv-hire-dialog{
  width:min(760px,100%); max-height:90vh; overflow:auto; position:relative;
  background:#fff; color:var(--ink); padding:34px; box-shadow:0 30px 100px rgba(0,0,0,.45);
}
.coded-tv-hire-dialog h2{ font-size:clamp(30px,4vw,46px); margin:0 0 10px; }
.coded-tv-hire-dialog .lede{ max-width:62ch; margin-bottom:24px; }
.coded-tv-hire-close{
  position:absolute; top:14px; right:18px; border:0; background:transparent; color:var(--ink);
  font-size:34px; line-height:1; cursor:pointer;
}
.coded-tv-honeypot{ position:absolute !important; left:-9999px !important; }
body.coded-tv-modal-open{ overflow:hidden; }
.coded-tv-full-editor-page .prose{ max-width:none; }

@media (max-width:620px){
  .hero-youtube-bg{ width:177.77777778vh; height:100vh; min-width:100%; min-height:56.25vw; }
  .coded-tv-hire-dialog{ padding:26px 18px 22px; }
}


/* ===================== CODED TV v1.5 — PROMINENT HEADER WORDMARK ===================== */
.coded-tv-header-logo{display:flex;align-items:center;flex:0 0 auto;line-height:0;}
.logo-horizontal{display:block;width:280px;height:auto;max-height:70px;object-fit:contain;}
.nav-row{min-height:92px;}
@media (max-width:1200px){.logo-horizontal{width:235px}.nav-links{gap:20px}}
@media (max-width:1100px){.logo-horizontal{width:260px}.nav-row{min-height:86px}}
@media (max-width:620px){.logo-horizontal{width:220px;max-height:62px}.nav-row{padding-left:16px;padding-right:16px}.mobile-panel .logo-horizontal{width:245px;filter:none}}

/* ===================== CODED TV FINAL v2.0 ===================== */
/* Real supplied square Coded TV logo in header */
.logo-horizontal{width:100px!important;height:100px!important;max-height:none!important;object-fit:contain!important;}
.nav-row{min-height:112px!important;}
.mobile-panel .logo-horizontal{width:110px!important;height:110px!important;}
.nav-links li.current-menu-item > a,
.nav-links li.current_page_item > a,
.nav-links li.current-menu-ancestor > a{color:var(--red)!important;}
@media(max-width:1100px){.logo-horizontal{width:86px!important;height:86px!important}.nav-row{min-height:98px!important}}
@media(max-width:620px){.logo-horizontal{width:76px!important;height:76px!important}.nav-row{min-height:86px!important}.mobile-panel .logo-horizontal{width:96px!important;height:96px!important}}

/* Full-cover background video for designed page heroes */
.video-page-hero{position:relative;isolation:isolate;background:#100b0b;overflow:hidden;}
.page-hero-video{position:absolute;inset:0;overflow:hidden;z-index:0;background:#100b0b;}
.page-hero-video iframe{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:177.7778vh;height:100vh;min-width:100%;min-height:56.25vw;border:0;pointer-events:none;max-width:none;}
.page-hero-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(18,3,4,.84),rgba(12,7,7,.62) 55%,rgba(5,5,5,.54));pointer-events:none;}
.video-page-hero>.container{position:relative;z-index:2;}
.video-page-hero::before{display:none!important;}

/* Media blocks */
.media-block img{width:100%;height:100%;display:block;object-fit:cover;}
.video-inline-frame{overflow:hidden;}
.video-inline-frame iframe,.responsive-video iframe{width:100%;height:100%;border:0;display:block;}
.video-inline-frame iframe{min-height:355px;}
.responsive-video{position:relative;aspect-ratio:16/9;overflow:hidden;background:#120b0b;max-width:980px;}
.responsive-video iframe{position:absolute;inset:0;}

/* Core values image cards */
.core-values-grid{align-items:stretch;}
.core-value-card{padding:0!important;overflow:hidden;display:flex;flex-direction:column;}
.core-value-card img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;}
.core-value-copy{padding:22px 24px 26px;}
.core-value-copy p{margin-bottom:0;}

/* Services and learning format CTAs */
.service-value-card,.learning-format-card{display:flex;flex-direction:column;align-items:flex-start;}
.service-learn-link{display:inline-flex;gap:8px;align-items:center;margin-top:auto;padding-top:18px;color:var(--red);font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;}
.service-learn-link:hover{color:var(--ink);}
.results-experience{max-width:980px;padding:24px 0 0;}
.results-experience h3{font-size:22px;margin:0 0 10px;}
.results-experience p{max-width:95ch;line-height:1.7;color:var(--ink-soft);}

/* Academy */
.brochure-panel{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:36px;border:1px solid var(--grey-line);background:#fff;}
.brochure-panel .lede{max-width:65ch;margin:10px 0 0;}
.academy-application-dialog{width:min(900px,100%);}
.hp-field{position:absolute!important;left:-9999px!important;}
.consent-line{display:flex;align-items:flex-start;gap:9px;font-size:13px;line-height:1.5;margin:16px 0 22px;}
.consent-line input{margin-top:3px;}

/* Portfolio hero */
.portfolio-hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:center;}
.portfolio-hero-video{aspect-ratio:16/9;overflow:hidden;background:#050505;border:1px solid rgba(255,255,255,.13);}
.portfolio-hero-video iframe{width:100%;height:100%;display:block;border:0;}

/* Blog media-house hero */
.blog-media-hero{min-height:400px;background-image:url('assets/images/blog-hero-media-clean.jpg');background-size:cover;background-position:center;display:flex;align-items:center;}
.blog-media-hero::before{display:none!important;}
.blog-hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,3,3,.93) 0%,rgba(8,3,3,.72) 48%,rgba(8,3,3,.25) 100%);}
.blog-media-hero .container{position:relative;z-index:2;}
.blog-media-hero h1{font-size:clamp(64px,10vw,118px);letter-spacing:-.04em;text-transform:uppercase;margin-bottom:18px;}
.blog-media-hero .eyebrow{letter-spacing:.28em;}
.blog-media-hero .lede{font-size:clamp(18px,2.2vw,28px);max-width:34ch;line-height:1.45;border-left:3px solid var(--red);padding-left:18px;}

/* Footer social prominence */
.footer-social-wrap,.footer-social-secondary{margin-top:18px;}
.footer-social-label{display:block;color:#fff;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:9px;}
.footer-social-row{margin-top:0!important;}
.footer-social-row a{border-color:rgba(255,255,255,.32);}
.footer-social-row svg{fill:#fff;}
.newsletter-form button{cursor:pointer;}

@media(max-width:900px){
  .portfolio-hero-grid{grid-template-columns:1fr;gap:30px;}
  .brochure-panel{align-items:flex-start;flex-direction:column;}
}
@media(max-width:620px){
  .page-hero-video iframe{width:177.7778vh;height:100vh;min-width:100%;min-height:56.25vw;}
  .video-inline-frame iframe{min-height:260px;}
  .blog-media-hero{min-height:360px;background-position:65% center;}
  .blog-media-hero h1{font-size:64px;}
}
.play-btn{border:0;cursor:pointer;padding:0;}

.coded-tv-header-logo{display:flex;align-items:center;flex:0 0 auto;}
.coded-tv-header-logo img{width:116px;height:116px;object-fit:contain;display:block;}
@media (max-width:900px){.coded-tv-header-logo img{width:90px;height:90px;}}
@media (max-width:620px){.coded-tv-header-logo img{width:76px;height:76px;}}

/* =====================================================================
   CODED TV FINAL PREMIUM SYSTEM — v3.0
   Consistent visual hierarchy, spacing, responsive behaviour and
   conversion-focused components across every public-facing page.
   ===================================================================== */
:root{
  --red:#d41424;
  --red-bright:#ef233c;
  --red-dark:#8a0711;
  --red-deep:#4a0509;
  --paper:#fbf8f5;
  --paper-2:#f4efeb;
  --ink:#110c0c;
  --ink-soft:#312827;
  --grey:#716966;
  --grey-line:#e7ddd7;
  --container:1280px;
  --radius:14px;
  --radius-lg:24px;
  --shadow-sm:0 10px 34px rgba(27,9,9,.07);
  --shadow-lg:0 28px 80px rgba(30,6,8,.16);
  --header-h:96px;
}
body{background:var(--paper);font-size:16px;line-height:1.65;}
.container{padding-left:clamp(20px,3vw,36px);padding-right:clamp(20px,3vw,36px);}
h1,h2,h3{letter-spacing:-.025em;}
h2{font-size:clamp(34px,4.4vw,58px);line-height:1.02;}
h3{line-height:1.08;}
.lede{font-size:clamp(16px,1.4vw,19px);line-height:1.7;}
.section-pad{padding:clamp(72px,8vw,108px) 0;}
.section-head{margin-bottom:clamp(34px,5vw,56px);}
.section-head>div{max-width:800px;}
.section-head>.lede{max-width:520px;}
.eyebrow{font-weight:700;letter-spacing:.2em;}

/* premium utility bar */
.topbar{
  background:linear-gradient(110deg,#4b0509 0%,#8d0711 34%,#d41424 70%,#71050b 100%);
  box-shadow:0 1px 0 rgba(255,255,255,.12) inset;
}
.topbar-row{min-height:46px;padding-top:8px;padding-bottom:8px;}
.topbar-left a,.topbar-hours,.visit-us-label{color:rgba(255,255,255,.9);}
.topbar-left svg{fill:#fff;opacity:.92;}
.topbar-social a{background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.18);}
.topbar-social a:hover{background:#fff;transform:translateY(-2px);}
.topbar-social a:hover svg{fill:var(--red);}

/* premium navigation */
.site-header{background:rgba(255,255,255,.97);backdrop-filter:blur(18px);border-bottom:1px solid rgba(50,20,20,.08);}
.site-header.scrolled{box-shadow:0 14px 40px rgba(21,8,8,.09);}
.nav-row{min-height:96px!important;padding-top:8px!important;padding-bottom:8px!important;}
.coded-tv-header-logo img,.logo-horizontal{width:92px!important;height:92px!important;object-fit:contain!important;}
.nav-links{gap:clamp(16px,2.1vw,30px);}
.nav-links a{font-size:12.5px;letter-spacing:.04em;}
.nav-cta .btn{border-radius:10px;box-shadow:0 10px 22px rgba(212,20,36,.18);}
.icon-btn{border-radius:50%;}

/* universal premium page hero */
.page-hero{
  padding:clamp(82px,9vw,128px) 0;
  background:
    radial-gradient(circle at 18% 24%,rgba(236,31,50,.25),transparent 34%),
    linear-gradient(125deg,#21090b 0%,#0e0a0a 55%,#240609 100%);
}
.page-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 0 64%,rgba(255,255,255,.025) 64% 65%,transparent 65% 100%);pointer-events:none;}
.page-hero h1{font-size:clamp(44px,6vw,76px);line-height:.98;max-width:17ch;}
.page-hero .lede{font-size:clamp(17px,1.5vw,20px);}
.video-page-hero{min-height:min(650px,72vh);display:flex;align-items:center;}
.page-hero-overlay{background:linear-gradient(90deg,rgba(17,4,5,.91) 0%,rgba(27,6,8,.76) 47%,rgba(3,3,3,.42) 100%)!important;}

/* premium cards and content surfaces */
.value-grid{gap:18px!important;background:transparent!important;border:0!important;}
.value-card,.info-card,.faq-item,.blog-card,.channel-card{
  border:1px solid rgba(90,46,40,.12)!important;
  border-radius:var(--radius)!important;
  background:rgba(255,255,255,.82)!important;
  box-shadow:var(--shadow-sm);
}
.value-card{padding:28px!important;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s ease;}
.value-card:hover{transform:translateY(-6px);box-shadow:0 20px 46px rgba(35,8,10,.12);border-color:rgba(212,20,36,.35)!important;}
.value-card h4{font-size:17px;line-height:1.2;margin-bottom:10px;}
.value-card p{color:var(--grey);line-height:1.65;font-size:14px;}
.service-learn-link{font-size:10.5px;letter-spacing:.13em;padding-top:22px;}
.info-card{padding:24px!important;}
.media-block{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg);}
.tag-list span{border-radius:999px;padding:11px 18px;background:#fff;border:1px solid var(--grey-line);box-shadow:0 6px 20px rgba(32,12,12,.04);}

/* universal forms */
form .field label{font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);}
.field input,.field select,.field textarea,
.coded-tv-corporate-form input,.coded-tv-corporate-form select,.coded-tv-corporate-form textarea{
  min-height:50px;border:1px solid #ded2cb!important;border-radius:10px!important;background:#fff!important;padding:13px 15px!important;transition:border-color .2s ease,box-shadow .2s ease;
}
.field textarea{min-height:150px;}
.field input:focus,.field select:focus,.field textarea:focus,
.coded-tv-corporate-form input:focus,.coded-tv-corporate-form select:focus,.coded-tv-corporate-form textarea:focus{outline:none;border-color:var(--red)!important;box-shadow:0 0 0 4px rgba(212,20,36,.08);}
.btn{border-radius:10px;padding:15px 24px;}
.btn-primary{box-shadow:0 12px 28px rgba(212,20,36,.22);background:linear-gradient(135deg,var(--red),#b50b18);}
.btn-primary:hover{background:linear-gradient(135deg,#ec2638,var(--red));box-shadow:0 16px 34px rgba(212,20,36,.28);}

/* designed about/academy/portfolio sections */
.split-row{gap:clamp(38px,6vw,78px)!important;}
.core-value-card{border-radius:16px!important;box-shadow:var(--shadow-sm);}
.core-value-card img{aspect-ratio:16/9;}
.core-value-copy{padding:24px 26px 28px!important;}
.channels{gap:16px!important;background:transparent!important;border:0!important;}
.channel-card{min-height:280px;padding:30px!important;}
.channel-card:hover{transform:translateY(-5px);box-shadow:0 20px 46px rgba(35,8,10,.12);}
.brochure-panel{border-radius:18px!important;box-shadow:var(--shadow-sm);padding:38px!important;}
.portfolio-hero-video,.video-inline-frame,.responsive-video{border-radius:18px;box-shadow:var(--shadow-lg);}
.thumb,.featured-reel{border-radius:18px;overflow:hidden;}

/* final CTA */
.final-cta,.premium-final-cta{
  background:
    radial-gradient(circle at 18% 30%,rgba(255,255,255,.08),transparent 30%),
    linear-gradient(125deg,#7d0710 0%,#d41424 53%,#6a050b 100%)!important;
  position:relative;overflow:hidden;
}
.final-cta::before{content:"";position:absolute;inset:-20%;background:repeating-linear-gradient(120deg,transparent 0 55px,rgba(255,255,255,.04) 55px 57px);transform:rotate(-3deg);pointer-events:none;}
.final-cta .inner{position:relative;z-index:1;}

/* premium footer */
.site-footer{background:linear-gradient(145deg,#0d0808,#170b0c 58%,#23080b);}
.footer-top{gap:clamp(28px,4vw,56px);}
.footer-col h4{color:#fff;}
.footer-col a:hover{color:#fff;}
.footer-social-row a{background:rgba(255,255,255,.06);}
.newsletter-form{border-radius:10px;}
.newsletter-form button{background:linear-gradient(135deg,var(--red),#b90c18);}

/* Services premium page */
.services-premium-hero{min-height:650px;}
.services-premium-hero h1 em{font-style:normal;color:#ff3046;}
.services-hero-content{display:grid;grid-template-columns:minmax(0,760px) 1fr;align-items:center;min-height:520px;}
.services-premium-hero .lede{max-width:52ch;margin:24px 0 26px;}
.services-hero-points{display:flex;gap:18px;flex-wrap:wrap;margin:0 0 32px;}
.services-hero-points span{display:inline-flex;align-items:center;gap:9px;color:#fff;font-weight:650;font-size:14px;}
.services-hero-points span::before{content:"";width:9px;height:9px;border:2px solid var(--red-bright);border-radius:50%;box-shadow:0 0 0 4px rgba(239,35,60,.1);}
.premium-services-section{background:var(--paper);}
.premium-services-section--tint{background:linear-gradient(180deg,#fff 0%,#faf3ef 100%);border-top:1px solid var(--grey-line);border-bottom:1px solid var(--grey-line);}
.premium-service-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
.premium-service-grid .service-value-card{min-height:235px;position:relative;overflow:hidden;}
.premium-service-grid .service-value-card::before{content:"";position:absolute;top:0;left:0;width:4px;height:0;background:linear-gradient(var(--red-bright),var(--red));transition:height .35s var(--ease);}
.premium-service-grid .service-value-card:hover::before{height:100%;}
.premium-service-grid .service-value-card h4{font-size:19px;}
.quote-premium-section{background:linear-gradient(135deg,#150a0b,#2a080c);color:#fff;}
.quote-premium-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center;}
.quote-premium-section h2{color:#fff;}
.quote-premium-section .lede{color:rgba(255,255,255,.72);max-width:58ch;}
.quote-premium-card{background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.035));border:1px solid rgba(255,255,255,.14);padding:36px;border-radius:20px;box-shadow:0 30px 70px rgba(0,0,0,.22);}
.quote-premium-card h3{font-size:28px;margin-bottom:12px;}
.quote-premium-card p{color:rgba(255,255,255,.72);margin-bottom:24px;}
.quote-premium-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:rgba(239,35,60,.14);border:1px solid rgba(239,35,60,.4);color:#ff6a7a;font-size:22px;margin-bottom:24px;}
.services-results-premium{background:#fff;}
.services-results-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:56px;align-items:center;}
.services-results-copy h3{font-size:clamp(26px,3vw,38px);margin-bottom:16px;}
.services-results-copy>p{color:var(--grey);line-height:1.75;}
.premium-check-list{columns:2;column-gap:28px;margin-top:26px;}
.premium-check-list li{break-inside:avoid;}
.client-logo-section{padding:84px 0;background:linear-gradient(120deg,#5a050b,#9b0712 48%,#520407);color:#fff;overflow:hidden;}
.client-logo-heading{text-align:center;margin-bottom:40px;}
.client-logo-heading .eyebrow{justify-content:center;color:#ff9da7;}
.client-logo-heading h2{font-size:clamp(34px,4vw,52px);}
.client-logo-heading .lede{margin:14px auto 0;color:rgba(255,255,255,.72);max-width:58ch;}
.client-logo-marquee{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);}
.client-logo-track{display:flex;width:max-content;animation:coded-tv-client-scroll 34s linear infinite;}
.client-logo-marquee:hover .client-logo-track{animation-play-state:paused;}
.client-logo-item{width:250px;height:126px;margin:0 11px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(255,255,255,.055);backdrop-filter:blur(4px);}
.client-logo-item img{width:220px;height:106px;object-fit:contain;opacity:.96;transition:transform .3s ease,opacity .3s ease;}
.client-logo-item:hover img{transform:scale(1.05);opacity:1;}
@keyframes coded-tv-client-scroll{to{transform:translateX(-50%);}}
.premium-industries-section{background:linear-gradient(180deg,#fbf8f5,#f4eeea);}
.premium-faq-section{background:#fff;border-top:1px solid var(--grey-line);}
.faq-item{overflow:hidden;margin-bottom:12px;}
.faq-item summary{padding:20px 22px;font-weight:700;}
.faq-item p{padding:0 22px 22px;}

/* Contact page + Google Maps */
.contact-map-section{padding:0 0 clamp(72px,8vw,108px);}
.contact-map-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.contact-map-card{background:#fff;border:1px solid var(--grey-line);border-radius:16px;overflow:hidden;box-shadow:var(--shadow-sm);}
.contact-map-frame{aspect-ratio:16/10;background:#eee;}
.contact-map-frame iframe{width:100%;height:100%;border:0;display:block;}
.contact-map-copy{padding:20px 22px 24px;}
.contact-map-copy h3{font-size:20px;margin-bottom:8px;text-transform:none;}
.contact-map-copy p{font-size:14px;color:var(--grey);margin:0 0 14px;}
.contact-map-copy a{color:var(--red);font-weight:750;font-size:13px;}

/* WhatsApp contact integration */
.coded-tv-whatsapp-float{position:fixed;right:22px;bottom:22px;z-index:9998;display:flex;align-items:center;gap:10px;background:#168c46;color:#fff;border-radius:999px;padding:12px 17px;box-shadow:0 16px 38px rgba(0,0,0,.22);font-weight:750;font-size:13px;transition:transform .25s ease,box-shadow .25s ease;}
.coded-tv-whatsapp-float:hover{transform:translateY(-3px);box-shadow:0 20px 46px rgba(0,0,0,.28);}
.coded-tv-whatsapp-float svg{width:20px;height:20px;fill:#fff;}

/* Generic Gutenberg/Classic pages and seeded service pages */
.prose{max-width:850px;}
.prose>h1:first-child{display:none;}
.prose h2{font-size:clamp(27px,3.2vw,38px);margin-top:50px;line-height:1.1;}
.prose ul{display:grid;gap:8px;}
.prose li::marker{color:var(--red);}
.prose>a,.prose p>a{display:inline-flex;margin-top:10px;font-weight:800;text-decoration:none!important;border-bottom:2px solid var(--red);padding-bottom:3px;}

/* Blog */
.blog-card{padding-bottom:16px;overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s var(--ease);}
.blog-card:hover{transform:translateY(-6px);box-shadow:0 20px 48px rgba(35,8,10,.12);}
.blog-card>.media-block{border-radius:14px 14px 0 0;box-shadow:none;}
.blog-card>.tag,.blog-card>h3,.blog-card>p,.blog-card>.blog-meta{margin-left:18px;margin-right:18px;}

/* responsive */
@media(max-width:1100px){
  .coded-tv-header-logo img,.logo-horizontal{width:80px!important;height:80px!important;}
  .premium-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .services-results-grid,.quote-premium-grid{grid-template-columns:1fr;gap:38px;}
  .contact-map-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:900px){
  .topbar-hours{display:none;}
  .nav-row{min-height:84px!important;}
  .coded-tv-header-logo img,.logo-horizontal{width:70px!important;height:70px!important;}
  .services-hero-content{grid-template-columns:1fr;}
  .page-hero,.video-page-hero{min-height:auto;}
  .portfolio-hero-grid,.split-row{grid-template-columns:1fr!important;}
  .client-logo-item{width:220px;}
}
@media(max-width:700px){
  .topbar-right .visit-us-label{display:none;}
  .topbar-row{justify-content:center;}
  .topbar-left{display:none;}
  .topbar-social a{width:30px;height:30px;}
  .premium-service-grid,.premium-service-grid--three{grid-template-columns:1fr!important;}
  .premium-check-list{columns:1;}
  .contact-map-grid{grid-template-columns:1fr;}
  .client-logo-section{padding:64px 0;}
  .client-logo-item{width:190px;height:110px;}
  .client-logo-item img{width:165px;height:86px;}
  .coded-tv-whatsapp-float{right:14px;bottom:14px;padding:12px;width:48px;height:48px;justify-content:center;}
  .coded-tv-whatsapp-float span{display:none;}
  .page-hero h1{font-size:clamp(40px,12vw,58px);}
}
@media(prefers-reduced-motion:reduce){.client-logo-track{animation:none;}}

/* ===================== PORTFOLIO 9-PROJECT SHOWCASE ===================== */
.portfolio-selected-projects{background:linear-gradient(180deg,#fbf8f5 0%,#fff 48%,#f8f2ee 100%);}
.portfolio-intro-panel{max-width:1050px;margin:0 auto 48px;padding:34px 38px;border:1px solid rgba(196,18,28,.18);border-radius:22px;background:linear-gradient(135deg,rgba(196,18,28,.045),rgba(255,255,255,.94));box-shadow:0 20px 55px rgba(45,16,16,.06);}
.portfolio-intro-panel h2{font-size:clamp(34px,4vw,54px);margin:4px 0 18px;letter-spacing:-.035em;}
.portfolio-intro-panel p:last-child{font-size:17px;line-height:1.8;color:#5e504b;max-width:92ch;}
.portfolio-showcase-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;}
.portfolio-showcase-card{background:#fff;border:1px solid #eaded8;border-radius:20px;overflow:hidden;box-shadow:0 16px 42px rgba(38,18,18,.08);transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);}
.portfolio-showcase-card:hover{transform:translateY(-7px);box-shadow:0 26px 62px rgba(57,13,18,.14);border-color:rgba(196,18,28,.35);}
.portfolio-showcase-media{display:block;position:relative;width:100%;aspect-ratio:16/9;border:0;padding:0;background:#120a0b;overflow:hidden;cursor:pointer;text-align:left;}
.portfolio-showcase-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.48));transition:background .3s ease;}
.portfolio-showcase-card:hover .portfolio-showcase-media::after{background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.36));}
.portfolio-showcase-media img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.01);transition:transform .5s var(--ease);}
.portfolio-showcase-card:hover .portfolio-showcase-media img{transform:scale(1.055);}
.portfolio-number{position:absolute;z-index:3;top:14px;left:14px;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#ed1b2c,#b90816);color:#fff;font-weight:800;font-size:14px;box-shadow:0 8px 22px rgba(190,10,25,.3);}
.portfolio-play{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.94);box-shadow:0 14px 34px rgba(0,0,0,.25);transition:transform .25s ease,background .25s ease;}
.portfolio-play svg{width:25px;height:25px;fill:#c4121c;margin-left:3px;}
.portfolio-showcase-card:hover .portfolio-play{transform:translate(-50%,-50%) scale(1.08);background:#fff;}
.portfolio-watch-label{position:absolute;z-index:3;right:16px;bottom:14px;font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:#fff;background:rgba(0,0,0,.5);border:1px solid rgba(255,255,255,.22);padding:8px 10px;border-radius:999px;backdrop-filter:blur(5px);}
.portfolio-showcase-copy{padding:22px 22px 24px;}
.portfolio-showcase-copy .tag{display:inline-flex;margin-bottom:10px;}
.portfolio-showcase-copy h3{font-size:21px;line-height:1.18;margin:0 0 10px;letter-spacing:-.02em;}
.portfolio-showcase-copy p{margin:0;color:#655753;font-size:14px;line-height:1.65;}
.portfolio-more-projects{margin-top:76px;padding-top:58px;border-top:1px solid #eaded8;}
@media(max-width:1000px){.portfolio-showcase-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:650px){.portfolio-intro-panel{padding:26px 24px;margin-bottom:32px}.portfolio-showcase-grid{grid-template-columns:1fr;gap:18px}.portfolio-showcase-copy{padding:19px 18px 21px}.portfolio-play{width:58px;height:58px}.portfolio-watch-label{display:none}}

/* v3.3 client logo visibility refinements */
.client-logo-item{background:linear-gradient(145deg,rgba(255,255,255,.10),rgba(255,255,255,.045));border-color:rgba(255,255,255,.18);}
.client-logo-item img{width:220px!important;height:106px!important;object-fit:contain!important;opacity:1!important;filter:none!important;}
@media(max-width:620px){.client-logo-item img{width:170px!important;height:88px!important;}}

/* =====================================================================
   v3.3.1 MOBILE RESPONSIVENESS HARDENING
   Ensures all content remains visible and readable on phones/tablets.
   ===================================================================== */

/* Safer defaults for flexible content */
html, body { width:100%; max-width:100%; }
body { overflow-x:hidden; }
.container { width:100%; }
iframe, video, embed, object { max-width:100%; }
input, select, textarea, button { max-width:100%; }
.entry-content, .prose, .blog-card, .blog-featured, .portfolio-showcase-card { min-width:0; }
.entry-content img, .prose img, .wp-block-image img { height:auto; }
.entry-content pre, .prose pre { max-width:100%; overflow:auto; }
.entry-content table, .prose table { display:block; max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }

/* Fail-open animation behaviour: content must never stay invisible on smaller screens. */
@media (max-width: 900px){
  .reveal,
  .reveal.in-view { opacity:1 !important; transform:none !important; visibility:visible !important; }
}

/* Tablet */
@media (max-width: 900px){
  :root{ --header-h:84px; }
  .container{ padding-left:20px; padding-right:20px; }
  .section-pad{ padding:72px 0 !important; }
  .page-hero{ padding:64px 0 58px !important; }
  .page-hero h1{ font-size:clamp(38px,8.5vw,58px) !important; max-width:100% !important; overflow-wrap:anywhere; }
  .page-hero .lede{ font-size:17px !important; max-width:100% !important; }
  h2{ font-size:clamp(30px,6vw,46px); }
  h3{ line-height:1.1; }

  .blog-featured{ grid-template-columns:1fr !important; gap:28px !important; margin-bottom:42px !important; }
  .blog-featured .media-block{ width:100%; }
  .blog-grid{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:20px !important; }
  .blog-card{ width:100%; min-width:0; }
  .blog-card h3{ font-size:20px !important; line-height:1.2 !important; overflow-wrap:anywhere; }
  .blog-card p.excerpt{ display:block !important; visibility:visible !important; opacity:1 !important; }
  .blog-meta{ display:block !important; visibility:visible !important; opacity:1 !important; }
  .blog-media-hero{ min-height:320px !important; padding:56px 0 !important; }
  .blog-media-hero .container{ width:100%; }
  .blog-media-hero h1{ font-size:clamp(48px,13vw,74px) !important; line-height:.95 !important; }
  .blog-media-hero .lede{ font-size:17px !important; max-width:30ch !important; padding-left:14px !important; }

  .entry-content, .prose{ max-width:100% !important; font-size:16px !important; line-height:1.7 !important; }
  .entry-content h2, .prose h2{ font-size:clamp(25px,6vw,34px) !important; line-height:1.12 !important; }
  .entry-content h3, .prose h3{ font-size:clamp(20px,5vw,27px) !important; line-height:1.18 !important; }
  .post-featured-media img, .post-featured-media .media-block{ aspect-ratio:16/9 !important; }

  .split-row,
  .split-row[style],
  .portfolio-hero-grid,
  .services-hero-content,
  .services-results-grid,
  .quote-premium-grid{ grid-template-columns:1fr !important; gap:30px !important; }

  .grid-projects.cols-3,
  #portfolioGrid{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; }

  .footer-top{ grid-template-columns:1fr 1fr !important; }
  .footer-brand{ grid-column:1/-1 !important; }
  .newsletter-form{ width:100%; max-width:100% !important; }
}

/* Phones */
@media (max-width: 620px){
  :root{ --header-h:78px; }
  .container{ padding-left:16px !important; padding-right:16px !important; }
  .section-pad{ padding:56px 0 !important; }
  .page-hero{ padding:50px 0 44px !important; }
  .eyebrow{ font-size:10px !important; letter-spacing:.13em !important; gap:8px !important; margin-bottom:14px !important; }
  .page-hero h1{ font-size:clamp(34px,11.5vw,48px) !important; line-height:.98 !important; }
  .page-hero .lede, .lede{ font-size:15.5px !important; line-height:1.58 !important; }
  h2{ font-size:clamp(28px,9vw,38px) !important; line-height:1.02 !important; }
  h3{ font-size:20px !important; line-height:1.15 !important; }

  .topbar{ position:relative !important; }
  .topbar-row{ padding:7px 12px !important; min-height:auto !important; }
  .topbar-left{ display:none !important; }
  .topbar-right{ width:100%; justify-content:center !important; }
  .site-header{ position:sticky !important; top:0 !important; }
  .nav-row{ min-height:76px !important; padding:8px 14px !important; }
  .coded-tv-header-logo img,.logo-horizontal{ width:68px !important; height:68px !important; object-fit:contain !important; }
  .icon-btn{ display:none !important; }
  .burger{ display:flex !important; }
  .mobile-panel{ padding:28px 22px !important; justify-content:flex-start !important; padding-top:90px !important; gap:16px !important; }
  .mobile-panel a{ font-size:24px !important; line-height:1.1 !important; }
  .mobile-menu-list{ width:100%; margin:0; padding:0; list-style:none; }
  .mobile-menu-list li{ margin:0 0 12px; }

  /* Blog: force all text visible, single-column, readable spacing */
  .blog-media-hero{ min-height:300px !important; padding:46px 0 !important; background-position:68% center !important; }
  .blog-media-hero .blog-hero-overlay{ background:linear-gradient(90deg,rgba(8,3,3,.96) 0%,rgba(8,3,3,.82) 62%,rgba(8,3,3,.45) 100%) !important; }
  .blog-media-hero h1{ font-size:clamp(44px,17vw,64px) !important; margin-bottom:14px !important; }
  .blog-media-hero .lede{ font-size:15px !important; line-height:1.55 !important; max-width:25ch !important; color:rgba(255,255,255,.9) !important; }
  .blog-featured{ display:grid !important; grid-template-columns:1fr !important; gap:20px !important; margin-bottom:34px !important; }
  .blog-featured > *{ min-width:0; }
  .blog-featured .media-block{ aspect-ratio:16/10 !important; }
  .blog-featured h2{ font-size:28px !important; line-height:1.08 !important; }
  .blog-grid{ grid-template-columns:1fr !important; gap:18px !important; }
  .blog-card{ display:block !important; width:100% !important; background:#fff; border:1px solid var(--grey-line); border-radius:14px; }
  .blog-card .media-block{ aspect-ratio:16/10 !important; margin-bottom:16px !important; }
  .blog-card>.tag,.blog-card>h3,.blog-card>p,.blog-card>.blog-meta{ margin-left:16px !important; margin-right:16px !important; }
  .blog-card h3{ font-size:20px !important; margin-bottom:9px !important; color:var(--ink) !important; }
  .blog-card p.excerpt{ font-size:14px !important; line-height:1.55 !important; color:var(--grey) !important; margin-bottom:12px !important; }
  .blog-meta{ font-size:11px !important; color:var(--grey) !important; padding-bottom:16px; }
  .tag-list{ gap:8px !important; }
  .tag-list span{ padding:8px 12px !important; font-size:10.5px !important; }
  .newsletter-form{ display:grid !important; grid-template-columns:1fr !important; border:none !important; overflow:visible !important; gap:10px !important; }
  .newsletter-form input{ border:1px solid var(--grey-line) !important; border-radius:8px !important; min-height:46px; background:#fff !important; color:var(--ink) !important; }
  .site-footer .newsletter-form input{ background:rgba(255,255,255,.06) !important; color:#fff !important; border-color:rgba(255,255,255,.18) !important; }
  .newsletter-form button{ min-height:46px; border-radius:8px !important; }

  /* Posts / prose */
  .entry-content, .prose{ font-size:15.5px !important; line-height:1.72 !important; width:100% !important; }
  .entry-content p, .prose p{ margin-bottom:18px !important; }
  .entry-content blockquote, .prose blockquote{ margin:22px 0 !important; padding-left:16px !important; }
  .post-meta{ gap:8px 12px !important; }
  .post-meta span{ font-size:10px !important; }
  .post-featured-media{ margin-bottom:28px !important; }

  /* All multi-column layouts become one-column on phones */
  .split-row,
  .split-row[style],
  .field-row,
  .contact-map-grid,
  .value-grid,
  .channels,
  .channels.cols-2,
  .quotes,
  .process-steps,
  .process-steps.cols-6,
  .people-grid,
  .premium-service-grid,
  .premium-service-grid--three,
  .services-results-grid,
  .quote-premium-grid,
  .portfolio-hero-grid,
  .services-hero-content,
  .grid-projects,
  .grid-projects.cols-3,
  #portfolioGrid,
  .portfolio-showcase-grid{
    grid-template-columns:1fr !important;
  }

  .channel-card{ min-height:auto !important; padding:26px 22px !important; }
  .value-card,.info-card,.faq-item{ padding-left:18px !important; padding-right:18px !important; }
  .notice-banner{ padding:16px !important; }
  .notice-banner p{ font-size:13px !important; }
  .kv-list .row{ align-items:flex-start; }
  .kv-list .row .v{ max-width:62%; overflow-wrap:anywhere; }

  .portfolio-intro-panel{ padding:22px 18px !important; border-radius:16px !important; }
  .portfolio-intro-panel p:last-child{ font-size:15px !important; line-height:1.65 !important; }
  .portfolio-showcase-copy h3{ font-size:19px !important; }
  .portfolio-showcase-copy p{ font-size:13.5px !important; }

  .final-cta{ padding:68px 0 !important; }
  .final-cta .lede{ margin-bottom:26px !important; }
  .final-cta .ctas{ display:grid !important; grid-template-columns:1fr !important; width:100%; gap:10px !important; }
  .final-cta .btn{ width:100%; justify-content:center; white-space:normal !important; text-align:center; }
  .btn{ white-space:normal !important; text-align:center; justify-content:center; padding:14px 18px !important; }

  .footer-top{ grid-template-columns:1fr !important; gap:30px !important; }
  footer.site-footer{ padding:58px 0 24px !important; }
  .footer-bottom-left,.footer-legal{ gap:12px !important; }
  .footer-legal{ flex-wrap:wrap; }

  .coded-tv-whatsapp-float{ right:12px !important; bottom:12px !important; }
  .sav-fab{ right:12px !important; bottom:70px !important; }
}

/* Very small phones */
@media (max-width: 380px){
  .container{ padding-left:14px !important; padding-right:14px !important; }
  .page-hero h1{ font-size:34px !important; }
  .blog-media-hero h1{ font-size:44px !important; }
  .coded-tv-header-logo img,.logo-horizontal{ width:62px !important; height:62px !important; }
  .mobile-panel a{ font-size:21px !important; }
}

/* =====================================================================
   v3.4 — PREMIUM SERVICE LANDING PAGES + OUR TEAM
   These templates inherit the existing global header/footer and tokens.
   ===================================================================== */
.service-landing-hero{min-height:700px;background-size:cover;background-position:center;display:flex;align-items:center;color:#fff;padding:105px 0;position:relative}.service-landing-hero .container{position:relative}.service-landing-hero h1{font-size:clamp(54px,7vw,96px);line-height:.94;text-transform:uppercase;max-width:880px;margin:0}.service-landing-hero h2{font-size:clamp(21px,2vw,30px);text-transform:uppercase;color:#ff5364;margin:24px 0 12px}.service-landing-hero .container>p:not(.eyebrow){max-width:610px;font-size:17px;line-height:1.75;color:#eadfe1;margin-bottom:28px}.service-back{float:right;color:#fff;text-decoration:none;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.service-landing-body{background:#fff}.service-landing-intro{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:start;margin-bottom:55px}.service-landing-intro .eyebrow,.service-process .eyebrow{color:var(--red)}.service-landing-intro h2,.service-process h2{font-size:clamp(38px,4.6vw,65px);text-transform:uppercase;line-height:.98;margin:0}.service-landing-intro>p{color:var(--grey);font-size:16px;line-height:1.8;padding-top:26px}.service-landing-columns{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--grey-line)}.service-landing-columns>div{padding:42px;border-right:1px solid var(--grey-line);min-height:360px}.service-landing-columns>div:last-child{border:0}.service-landing-columns span{font-weight:800;color:var(--red);font-size:13px}.service-landing-columns h3{font-size:28px;text-transform:uppercase;margin:15px 0 22px}.service-landing-columns ul{list-style:none;margin:0;padding:0}.service-landing-columns li{position:relative;padding:11px 0 11px 20px;border-bottom:1px solid var(--grey-line);font-size:14px;line-height:1.5}.service-landing-columns li:before{content:'+';position:absolute;left:0;color:var(--red)}.service-landing-columns .dark{background:var(--ink);color:#fff}.service-landing-columns .dark li{border-color:rgba(255,255,255,.12)}.service-process{display:grid;grid-template-columns:.7fr 1.3fr;gap:75px;margin-top:90px}.service-process ol{list-style:none;counter-reset:steps;margin:0;padding:0}.service-process li{counter-increment:steps;display:grid;grid-template-columns:48px 1fr 1fr;align-items:center;border-top:1px solid var(--grey-line);padding:20px 0}.service-process li:before{content:'0' counter(steps);color:var(--red);font-weight:800;font-size:12px}.service-process b{font-size:21px;text-transform:uppercase}.service-process span{color:var(--grey);font-size:14px}.service-landing-cta,.team-page-cta{background:var(--red);color:#fff;padding:72px 0}.service-landing-cta .container,.team-page-cta .container{display:flex;justify-content:space-between;align-items:center;gap:40px}.service-landing-cta h2,.team-page-cta h2{font-size:clamp(40px,5vw,70px);text-transform:uppercase;margin:0}.service-landing-cta p:not(.eyebrow){color:#ffd9dd}.btn-white{background:#fff;color:var(--red)!important}.team-page-hero{background:linear-gradient(125deg,#13090b,#2b0b10);color:#fff;padding:105px 0}.team-page-hero-inner{display:grid;grid-template-columns:1.25fr .75fr;gap:60px;align-items:end}.team-page-hero h1{font-size:clamp(55px,7vw,96px);line-height:.94;text-transform:uppercase;margin:0}.team-page-hero h1 em{font-style:normal;color:#ff3045}.team-page-hero-inner>p{color:#d9cfd1;font-size:17px;line-height:1.75}.team-page-section{background:var(--paper)}.team-page-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.team-profile{background:#fff;overflow:hidden;border:1px solid var(--grey-line)}.team-profile-photo{height:470px;overflow:hidden;background:#eee}.team-profile-photo img{width:100%;height:100%;object-fit:cover;object-position:center 22%;transition:.45s}.team-profile-featured .team-profile-photo img{object-position:center 35%}.team-profile:hover img{transform:scale(1.035)}.team-profile-copy{padding:28px;border-top:4px solid var(--red)}.team-profile-copy>span{color:var(--red);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.14em}.team-profile-copy h2{font-size:28px;text-transform:uppercase;line-height:1.05;margin:10px 0}.team-profile-copy p{color:var(--grey);min-height:44px}.service-text-link{color:var(--red);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;text-decoration:none}
@media(max-width:980px){.service-landing-columns{grid-template-columns:1fr}.service-landing-columns>div{border-right:0;border-bottom:1px solid var(--grey-line);min-height:0}.service-landing-intro,.service-process,.team-page-hero-inner{grid-template-columns:1fr}.team-page-grid{grid-template-columns:repeat(2,1fr)}.team-profile:last-child{grid-column:1/3}}
@media(max-width:620px){.service-landing-hero{min-height:650px;padding:75px 0;background-position:58% center}.service-landing-hero h1{font-size:clamp(44px,13vw,64px)!important}.service-back{float:none;display:block;margin-bottom:20px}.service-landing-intro{display:block}.service-landing-intro>p{padding-top:20px}.service-landing-columns>div{padding:28px 20px}.service-process{gap:35px;margin-top:62px}.service-process li{grid-template-columns:38px 1fr}.service-process li span{grid-column:2}.service-landing-cta .container,.team-page-cta .container{display:block}.service-landing-cta .btn,.team-page-cta .btn{margin-top:24px;width:100%}.team-page-hero{padding:70px 0}.team-page-hero h1{font-size:clamp(45px,14vw,65px)}.team-page-grid{grid-template-columns:1fr}.team-profile:last-child{grid-column:auto}.team-profile-photo{height:410px}}
.founder-hero{background:linear-gradient(125deg,#12080a,#2b0c11);color:#fff;padding:90px 0}.founder-hero-grid{display:grid;grid-template-columns:1fr .85fr;align-items:center;gap:75px}.founder-hero h1{font-size:clamp(58px,7vw,100px);line-height:.92;text-transform:uppercase;margin:0}.founder-hero h1 em{font-style:normal;color:#ff3045}.founder-hero-grid>div:first-child>p:not(.eyebrow){max-width:630px;color:#dfd2d4;font-size:17px;line-height:1.75}.founder-portrait{height:610px;overflow:hidden;border-bottom:6px solid var(--red)}.founder-portrait img{width:100%;height:100%;object-fit:cover;object-position:center 35%}.founder-story{display:grid;grid-template-columns:1fr 1fr;gap:75px}.founder-story .eyebrow{color:var(--red)}.founder-story h2{font-size:clamp(40px,4.5vw,66px);text-transform:uppercase;line-height:.98}.founder-story>div:last-child{color:var(--grey);font-size:16px;line-height:1.8}@media(max-width:780px){.founder-hero-grid,.founder-story{grid-template-columns:1fr}.founder-hero{padding:65px 0}.founder-portrait{height:480px}.founder-hero h1{font-size:clamp(48px,14vw,68px)}}

/* v3.4.1 — approved main Services page */
.services-showcase-hero{min-height:740px;background:#14090b;color:#fff;position:relative;display:flex;align-items:center;overflow:hidden}.services-showcase-media,.services-showcase-shade{position:absolute;inset:0}.services-showcase-collage{display:grid;grid-template-columns:1.25fr .75fr;height:100%;gap:5px;opacity:.75}.services-showcase-collage>div{background-size:cover;background-position:center}.services-showcase-collage>div:first-child{grid-row:1/3}.services-showcase-shade{background:linear-gradient(90deg,rgba(14,5,7,.98),rgba(14,5,7,.84) 42%,rgba(14,5,7,.18) 78%)}.services-showcase-hero-copy{position:relative;z-index:2;padding:90px 0 150px}.services-showcase-hero-copy h1{font-size:clamp(58px,8vw,112px);line-height:.9;text-transform:uppercase;letter-spacing:-.025em;margin:0}.services-showcase-hero-copy h1 em{font-style:normal;color:#ff233f}.services-showcase-hero-copy>p:not(.eyebrow){max-width:610px;color:#ddd1d3;font-size:18px;line-height:1.7}.services-showcase-actions{display:flex;gap:12px;margin-top:32px}.services-showcase-stats{position:absolute;z-index:3;right:0;bottom:0;display:grid;grid-template-columns:repeat(3,1fr);width:min(680px,70vw);background:rgba(215,11,36,.95)}.services-showcase-stats>div{padding:25px 30px;border-left:1px solid rgba(255,255,255,.24)}.services-showcase-stats strong{display:block;font-size:32px}.services-showcase-stats span{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.services-showcase-index{background:var(--paper)}.services-showcase-heading{display:flex;justify-content:space-between;align-items:end;gap:35px;margin-bottom:38px}.services-showcase-heading .eyebrow{color:var(--red)}.services-showcase-heading h2{font-size:clamp(42px,5vw,72px);line-height:.96;text-transform:uppercase;max-width:780px;margin:0}.services-showcase-heading>p{max-width:420px;color:var(--grey);line-height:1.7}.services-showcase-filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}.services-showcase-filters button{border:1px solid var(--grey-line);background:#fff;padding:12px 17px;font:700 10px var(--body);text-transform:uppercase;letter-spacing:.08em;cursor:pointer}.services-showcase-filters button.is-active{background:var(--ink);border-color:var(--ink);color:#fff}.services-showcase-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.services-showcase-card{background:#fff;border:1px solid var(--grey-line);overflow:hidden;transition:.35s}.services-showcase-card:hover{transform:translateY(-7px);box-shadow:0 24px 55px rgba(40,20,20,.12)}.services-showcase-card a{color:inherit;text-decoration:none}.services-showcase-image{height:255px;background-size:cover;background-position:center;position:relative;padding:18px;color:#fff;display:flex;align-items:end;justify-content:space-between}.services-showcase-image span{position:absolute;top:17px;left:17px;background:var(--red);padding:8px 10px;font-size:12px;font-weight:800}.services-showcase-image b{font-size:9px;letter-spacing:.12em;text-transform:uppercase}.services-showcase-card-copy{padding:25px}.services-showcase-card-copy h3{font-size:25px;line-height:1.05;text-transform:uppercase;margin:0 0 12px}.services-showcase-card-copy p{color:var(--grey);font-size:14px;line-height:1.65;min-height:70px}.services-showcase-card-copy strong{font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--red)}.services-showcase-card-copy i{font-style:normal;font-size:16px}.services-showcase-quote{background:var(--red);color:#fff;padding:72px 0}.services-showcase-quote .container{display:flex;justify-content:space-between;align-items:center;gap:40px}.services-showcase-quote h2{font-size:clamp(42px,5vw,72px);line-height:.96;text-transform:uppercase;margin:0}.services-showcase-quote p:not(.eyebrow){max-width:670px;color:#ffdce0}.services-showcase-editor{padding-bottom:0}
/* Academy — featured 8 Saturday training */
.academy-saturday-feature{min-height:650px;position:relative;display:flex;align-items:center;color:#fff;overflow:hidden}.academy-saturday-media{position:absolute;inset:0;background-size:cover;background-position:center}.academy-saturday-inner{position:relative;z-index:2;padding:90px 0}.academy-saturday-inner>div{max-width:720px}.academy-saturday-inner h2{font-size:clamp(55px,7vw,94px);line-height:.92;text-transform:uppercase;margin:0}.academy-saturday-inner h2 em{font-style:normal;color:#ff3045}.academy-saturday-inner>div>p:not(.eyebrow){max-width:610px;color:#e6dadd;font-size:17px;line-height:1.7}.academy-saturday-points{display:flex;flex-wrap:wrap;gap:9px;margin:24px 0 30px}.academy-saturday-points span{border:1px solid rgba(255,255,255,.32);background:rgba(10,5,6,.32);backdrop-filter:blur(8px);padding:9px 12px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
@media(max-width:1000px){.services-showcase-grid{grid-template-columns:repeat(2,1fr)}.services-showcase-heading{display:block}.services-showcase-heading>p{margin-top:18px}}
@media(max-width:620px){.services-showcase-hero{min-height:690px}.services-showcase-collage{grid-template-columns:1fr}.services-showcase-collage>div:not(:first-child){display:none}.services-showcase-shade{background:linear-gradient(90deg,rgba(14,5,7,.96),rgba(14,5,7,.52))}.services-showcase-hero-copy{padding:65px 16px 180px!important}.services-showcase-hero-copy h1{font-size:clamp(49px,15vw,72px)!important}.services-showcase-actions{flex-direction:column;align-items:flex-start}.services-showcase-stats{width:100%;grid-template-columns:repeat(3,1fr)}.services-showcase-stats>div{padding:18px 12px}.services-showcase-stats strong{font-size:25px}.services-showcase-stats span{font-size:8px}.services-showcase-grid{grid-template-columns:1fr}.services-showcase-filters button{flex:1 1 45%}.services-showcase-image{height:240px}.services-showcase-heading h2{font-size:42px!important}.services-showcase-quote .container{display:block}.services-showcase-quote .btn{width:100%;margin-top:22px}.academy-saturday-feature{min-height:620px}.academy-saturday-media{background-position:62% center}.academy-saturday-inner{padding:70px 16px!important}.academy-saturday-inner h2{font-size:clamp(49px,14vw,68px)!important}}