/* ==========================================================================
   THE CREATIVE PODCAST
   Black, red and white. No fourth colour.
   Loaded from an mu-plugin so it survives a theme switch.

   Elementor cannot take a var() for font-family, so the faces are applied
   here by class. Colours come from the Elementor kit globals so Site
   Settings remains the rebranding surface.
   ========================================================================== */

@font-face{
  font-family:'Geist';
  src:url('fonts/geist-var.woff2') format('woff2-variations'),
      url('fonts/geist-var.woff2') format('woff2');
  font-weight:100 900;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Geist';
  src:url('fonts/geist-var-ext.woff2') format('woff2-variations'),
      url('fonts/geist-var-ext.woff2') format('woff2');
  font-weight:100 900;font-style:normal;font-display:swap;
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}


:root{
  --tcp-red:#E00202;--tcp-red-ink:#B00101;--tcp-red-lift:#FF5252;
  --tcp-red-h:#B00101;
  --tcp-red-tint:#FDECEC;
  --tcp-ink:#0A0A0A;
  --tcp-muted:#5A5A5A;
  --tcp-line:#E3E3E3;
  --tcp-soft:#F0F0F0;
  --tcp-bg:#FFFFFF;
  --tcp-bg-alt:#F5F5F5;

  --tcp-display:'Geist',system-ui,-apple-system,'Segoe UI',sans-serif;
  --tcp-body:'Geist',system-ui,-apple-system,'Segoe UI',sans-serif;

  --tcp-pill:999px;
  --tcp-card:20px;
  --tcp-media:16px;

  /* shadows are tinted to the ground, never pure black */
  --tcp-shadow:0 2px 8px rgba(10,10,10,.06);
  --tcp-shadow-lift:0 18px 40px -18px rgba(10,10,10,.28);
  --tcp-ease:cubic-bezier(.2,.7,.3,1);

  /* Astra's own variables, repointed so its controls cannot bring back a fourth hue */
  --ast-global-color-0:#E00202;
  --ast-global-color-1:#B00101;
  --ast-global-color-2:#0A0A0A;
  --ast-global-color-3:#5A5A5A;
  --ast-global-color-4:#FFFFFF;
  --ast-global-color-5:#F5F5F5;
  --ast-global-color-6:#E3E3E3;
  --ast-global-color-7:#E00202;
  --ast-global-color-8:#FDECEC;
}

/* ---------- Overflow guards. Nothing may extend past the viewport. ---------- */
html{overflow-x:hidden}
body{overflow-x:clip;background:var(--tcp-bg);color:var(--tcp-ink)}
img,video,iframe,svg{max-width:100%;height:auto}
.elementor-widget-image img{height:auto}
pre,code,table{max-width:100%;overflow-x:auto}

/* ---------- Typography ---------- */
:where(body),:where(.elementor) p,:where(.elementor) li{
  font-family:var(--tcp-body);line-height:1.65;
}
:where(.elementor) h1,:where(.elementor) h2,:where(.elementor) h3,:where(.elementor) h4{
  font-family:var(--tcp-display);font-weight:700;letter-spacing:-.02em;line-height:1.1;
}

.tcp-h1 .elementor-heading-title,.tcp-h1{
  font-family:var(--tcp-display)!important;font-weight:700;letter-spacing:-.03em;
  line-height:1.0;font-size:clamp(2.5rem,6vw,4.6rem);color:var(--tcp-ink);
}
.tcp-h2 .elementor-heading-title,.tcp-h2{
  font-family:var(--tcp-display)!important;font-weight:700;letter-spacing:-.02em;
  line-height:1.06;font-size:clamp(1.85rem,3.6vw,2.9rem);
}
.tcp-h3 .elementor-heading-title,.tcp-h3{
  font-family:var(--tcp-display)!important;font-weight:600;letter-spacing:-.015em;
  line-height:1.15;font-size:clamp(1.15rem,2vw,1.5rem);
}
.tcp-h4 .elementor-heading-title,.tcp-h4{
  font-family:var(--tcp-display)!important;font-weight:600;line-height:1.2;font-size:1.02rem;
}
.tcp-body .elementor-widget-container,.tcp-body{
  font-family:var(--tcp-body);font-size:1rem;line-height:1.65;max-width:66ch;color:var(--tcp-muted);
}
.tcp-body-lg .elementor-widget-container,.tcp-body-lg{
  font-family:var(--tcp-body);font-size:clamp(1.02rem,1.4vw,1.15rem);
  line-height:1.6;max-width:62ch;color:var(--tcp-muted);
}
.tcp-meta .elementor-widget-container,.tcp-meta{
  font-family:var(--tcp-body)!important;font-size:.78rem;font-weight:600;
  letter-spacing:.05em;line-height:1.4;
}
.tcp-meta p{margin:0}

/* Eyebrow: red tint pill */
.tcp-eyebrow .elementor-heading-title,
.tcp-eyebrow .elementor-widget-container > *{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.42rem .9rem;border-radius:var(--tcp-pill);
  background:var(--tcp-red-tint);color:var(--tcp-red)!important;
  font-family:var(--tcp-body)!important;font-size:.68rem;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;line-height:1;
}

/* ---------- Buttons. Red primary, black secondary. ---------- */
.elementor-widget-button .elementor-button,
.elementor-widget-button .elementor-button:visited,
.elementor-button,
.ast-button,.ast-custom-button,.button,input[type=submit],.wp-block-button__link{
  background-color:var(--tcp-red);
  color:#fff;
  border:0;
  border-radius:var(--tcp-pill)!important;
  font-family:var(--tcp-body)!important;
  font-weight:600;
  box-shadow:var(--tcp-shadow);
  transition:transform .2s var(--tcp-ease),background-color .2s var(--tcp-ease),box-shadow .2s var(--tcp-ease);
}
.elementor-widget-button .elementor-button:hover,
.elementor-button:hover,.ast-button:hover,.button:hover,input[type=submit]:hover{
  background-color:var(--tcp-red-h);color:#fff;
  transform:translateY(-2px);box-shadow:var(--tcp-shadow-lift);
}
.elementor-button:active,.ast-button:active,.button:active{transform:translateY(0)}

/* Secondary sits on black, tertiary on soft grey */
.tcp-btn-dark .elementor-button{background-color:var(--tcp-ink)!important;color:#fff!important}
.tcp-btn-dark .elementor-button:hover{background-color:#000!important}
.tcp-btn-soft .elementor-button{background-color:var(--tcp-soft)!important;color:var(--tcp-ink)!important;box-shadow:none}
.tcp-btn-soft .elementor-button:hover{background-color:var(--tcp-line)!important}

/* ---------- Focus, hover and active states everywhere ---------- */
a:focus-visible,button:focus-visible,
.elementor-button:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible,
.menu-item > a:focus-visible{
  outline:3px solid var(--tcp-red);
  outline-offset:3px;
  border-radius:4px;
}
.elementor a:hover{color:var(--tcp-red)}

/* ---------- Cards and elevation ---------- */
.tcp-card{
  background:#fff;border:1px solid var(--tcp-line);border-radius:var(--tcp-card);
  box-shadow:var(--tcp-shadow);
  transition:transform .25s var(--tcp-ease),box-shadow .25s var(--tcp-ease),border-color .25s var(--tcp-ease);
}
.tcp-card:hover{transform:translateY(-4px);box-shadow:var(--tcp-shadow-lift);border-color:transparent}
.tcp-cover img{border-radius:var(--tcp-media);object-fit:cover;box-shadow:var(--tcp-shadow)}

.tcp-stat .elementor-counter-number-wrapper{
  font-family:var(--tcp-display)!important;font-weight:700;letter-spacing:-.03em;
  line-height:1;color:var(--tcp-ink);
}
.tcp-stat .elementor-counter-number-suffix{color:var(--tcp-red)}
.tcp-stat .elementor-counter-title{
  font-family:var(--tcp-body);font-size:.9rem;color:var(--tcp-muted);font-weight:500;
}

/* ---------- Header ---------- */
.ast-primary-header-bar,.site-header,.main-header-bar{
  background-color:#fff!important;
  border-bottom:1px solid var(--tcp-line)!important;
  box-shadow:none!important;
}
.custom-logo-link img,.ast-site-identity img,.site-logo-img img{
  height:54px!important;width:auto!important;max-width:none!important;
}
.main-header-menu a,.ast-header-break-point .main-navigation a{
  color:var(--tcp-ink)!important;
  font-family:var(--tcp-body)!important;font-size:.88rem;font-weight:500;
}
.main-header-menu .current-menu-item > a,
.main-header-menu a:hover{color:var(--tcp-red)!important}

/* Dropdown: works on hover and on touch via :focus-within */
.main-header-menu .sub-menu{
  border:1px solid var(--tcp-line);
  border-radius:14px;
  box-shadow:var(--tcp-shadow-lift);
  padding:6px;
  min-width:210px;
  background:#fff;
}
.main-header-menu .sub-menu a{border-radius:10px;padding:.6rem .8rem!important}
.main-header-menu .sub-menu a:hover{background:var(--tcp-red-tint)}
.main-header-menu li:focus-within > .sub-menu{opacity:1;visibility:visible;display:block}
.menu-item-has-children > a::after{color:var(--tcp-red)}

/* Hamburger */
.ast-mobile-menu-trigger-minimal,
.menu-toggle,.ast-mobile-menu-buttons-minimal{
  color:var(--tcp-ink)!important;background:transparent!important;
}
.ast-header-break-point .main-header-menu{background:#fff}
.ast-header-break-point .main-header-menu .sub-menu{box-shadow:none;border:0;border-radius:0}

/* Touch targets never below 44px */
.main-header-menu a,.elementor-button,.ast-button{min-height:44px;display:inline-flex;align-items:center}
.main-header-menu a{min-height:0}
@media (max-width:921px){
  .main-header-menu a{min-height:44px}
}

/* ---------- Footer ---------- */
.site-footer,.ast-small-footer{background:var(--tcp-ink)!important;color:#fff}
.site-footer a,.ast-small-footer a{color:#fff!important}
.site-footer a:hover,.ast-small-footer a:hover{color:var(--tcp-red)!important}
.ast-small-footer{border-top:0!important}

/* ---------- Astra chrome off where Elementor owns the page ---------- */
.ast-page-builder-template .entry-header,
.ast-page-builder-template .entry-content{margin:0;padding:0}
.ast-page-builder-template .site-content > .ast-container{max-width:none;padding:0}
.ast-container{max-width:none}
body.elementor-page .site-content{padding-top:0}

/* ---------- Motion preference ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms!important;transition-duration:.001ms!important;
    scroll-behavior:auto!important;
  }
  .tcp-card:hover,.elementor-button:hover{transform:none}
}

/* ---------- Responsive ---------- */
@media (max-width:1024px){
  :root{--tcp-card:16px}
}
@media (max-width:768px){
  .custom-logo-link img,.ast-site-identity img,.site-logo-img img{height:44px!important}
  .tcp-h1 .elementor-heading-title,.tcp-h1{font-size:clamp(2rem,9vw,2.8rem)}
  .elementor-button{width:auto}
}

/* ---------- Platform cards, inactive ones read as pending not broken ---------- */
.tcp-card-soon{
  background:var(--tcp-bg-alt)!important;box-shadow:none!important;
  border-style:dashed!important;border-color:#C9C9C9!important;
}
.tcp-card-soon .elementor-heading-title{color:var(--tcp-muted)!important}
.tcp-card-soon .tcp-meta,.tcp-card-soon .tcp-meta *{color:#4A4A4A!important}
.tcp-card-soon:hover{transform:none!important;box-shadow:none!important}

/* ---------- Episode cards: media flush to the card edge ---------- */
.tcp-ep{overflow:hidden}
.tcp-ep-thumb img{
  border-radius:0!important;width:100%;aspect-ratio:16/9;object-fit:cover;display:block;
  transition:transform .5s var(--tcp-ease);
}
.tcp-ep:hover .tcp-ep-thumb img{transform:scale(1.04)}

/* ---------- Inverted black band ---------- */
.tcp-invert,.tcp-invert p,.tcp-invert li{color:#fff}
.tcp-invert h1,.tcp-invert h2,.tcp-invert h3,.tcp-invert h4,
.tcp-invert .elementor-heading-title{color:#fff!important}
.tcp-invert .tcp-body .elementor-widget-container,
.tcp-invert .tcp-body{color:rgba(255,255,255,.78)}

/* ---------- Social icons in brand colours ---------- */
.tcp-socials .elementor-social-icon{
  background:transparent!important;
  border:1px solid var(--tcp-line);
  color:var(--tcp-ink)!important;
  transition:all .2s var(--tcp-ease);
}
.tcp-socials .elementor-social-icon:hover{
  background:var(--tcp-red)!important;border-color:var(--tcp-red);color:#fff!important;
  transform:translateY(-2px);box-shadow:var(--tcp-shadow-lift);
}

/* ---------- 404 ---------- */
.tcp-404{min-height:60vh;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:80px 24px;gap:18px}
.tcp-404 .code{font-family:var(--tcp-display);font-size:clamp(4rem,14vw,9rem);line-height:.9;
  color:var(--tcp-red);letter-spacing:-.04em}
.tcp-404 h1{font-family:var(--tcp-display);font-size:clamp(1.5rem,3vw,2.2rem);color:var(--tcp-ink)}
.tcp-404 p{color:var(--tcp-muted);max-width:52ch}
.tcp-404 .links{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:8px}
.tcp-404 .links a{
  display:inline-flex;align-items:center;min-height:44px;padding:.8rem 1.4rem;
  border-radius:var(--tcp-pill);background:var(--tcp-soft);color:var(--tcp-ink);
  font-weight:600;font-size:.9rem;transition:all .2s var(--tcp-ease);
}
.tcp-404 .links a:first-child{background:var(--tcp-red);color:#fff}
.tcp-404 .links a:hover{transform:translateY(-2px);box-shadow:var(--tcp-shadow-lift)}

/* ---------- Click to call and mail ---------- */
a[href^="tel:"],a[href^="mailto:"]{color:var(--tcp-red);font-weight:600}
a[href^="tel:"]:hover,a[href^="mailto:"]:hover{text-decoration:underline}
/* ---------- Button variants. The build library emits tcp-btn-<style>. ----------
   Specificity matches Astra's injected .elementor-widget-button .elementor-button
   so these actually land. */
.elementor-widget-button.tcp-btn-secondary .elementor-button,
.tcp-btn-secondary .elementor-button{
  background-color:var(--tcp-ink)!important;color:#fff!important;
}
.elementor-widget-button.tcp-btn-secondary .elementor-button:hover,
.tcp-btn-secondary .elementor-button:hover{background-color:#000!important}

.elementor-widget-button.tcp-btn-soft .elementor-button,
.tcp-btn-soft .elementor-button{
  background-color:var(--tcp-soft)!important;color:var(--tcp-ink)!important;box-shadow:none!important;
}
.elementor-widget-button.tcp-btn-soft .elementor-button:hover,
.tcp-btn-soft .elementor-button:hover{background-color:var(--tcp-line)!important}

/* On the black band, a secondary button must not disappear */
.tcp-invert .tcp-btn-secondary .elementor-button{
  background-color:#fff!important;color:var(--tcp-ink)!important;
}

/* Buttons inherit the pill radius, overriding the library's 4px default */
.elementor-button{border-radius:var(--tcp-pill)!important}
/* ==========================================================================
   PAGE BANNER and FOOTER
   Podover's furniture, re-pitched from its orange to the brand red.
   ========================================================================== */
.tcp-banner{
  position:relative;background:#0A0A0A center/cover no-repeat;
  padding:clamp(70px,11vw,130px) 24px;text-align:center;isolation:isolate;
}
.tcp-banner::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(224,2,2,.55),rgba(10,10,10,.78));
}
.tcp-banner-inner{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:14px}
.tcp-banner-title{
  font-family:var(--tcp-display);font-weight:700;color:#fff;
  text-transform:uppercase;letter-spacing:-.01em;line-height:1.05;
  font-size:clamp(1.9rem,5vw,3.2rem);margin:0;
}
.tcp-crumbs{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:center;
  font-size:.8rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.78)}
.tcp-crumbs a{color:#fff}
.tcp-crumbs a:hover{color:#fff;text-decoration:underline}
.tcp-crumbs span[aria-hidden]{color:var(--tcp-red-lift);font-weight:700}

/* ---------- Footer ---------- */
.tcp-footer{position:relative;background:#0A0A0A;color:#fff;padding:72px 24px 0;overflow:hidden}
.tcp-footer-inner{
  max-width:1200px;margin:0 auto;display:flex;flex-wrap:wrap;gap:40px;
}
.tcp-fcol{flex:1 1 190px;min-width:0;display:flex;flex-direction:column;gap:12px}
.tcp-fbrand{flex:1.6 1 280px}
.tcp-fbrand p{color:rgba(255,255,255,.72);font-size:.95rem;line-height:1.7;margin:0;max-width:34ch}
.tcp-fcol h2{
  font-family:var(--tcp-display);font-size:1.05rem;font-weight:700;color:#fff;margin:0 0 6px;
  display:flex;align-items:center;gap:10px;
}
/* waveform marks beside the footer headings removed at the client's request */
.tcp-fcol a{color:rgba(255,255,255,.72);font-size:.94rem;transition:color .2s var(--tcp-ease)}
.tcp-fcol a:hover{color:var(--tcp-red)}
.tcp-frow{display:inline-flex;align-items:center;min-height:32px}

.tcp-fsocial{display:flex;gap:10px;margin-top:4px}
.tcp-fsocial a{
  width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.08);color:#fff;transition:all .2s var(--tcp-ease);
}
.tcp-fsocial svg{width:17px;height:17px}
.tcp-fsocial a:hover{background:var(--tcp-red);color:#fff;transform:translateY(-2px)}

.tcp-footer-base{
  max-width:1200px;margin:56px auto 0;padding:22px 0;
  border-top:1px solid rgba(255,255,255,.12);
  text-align:center;color:rgba(255,255,255,.6);font-size:.86rem;
}

.tcp-top{
  position:fixed;right:20px;bottom:20px;z-index:80;
  width:46px;height:46px;border-radius:50%;
  background:var(--tcp-red);color:#fff;
  display:inline-flex;align-items:center;justify-content:center;
  opacity:0;visibility:hidden;transform:translateY(8px);
  transition:all .25s var(--tcp-ease);box-shadow:var(--tcp-shadow-lift);
}
.tcp-top.is-on{opacity:1;visibility:visible;transform:none}
.tcp-top:hover{background:var(--tcp-red-h)}
.tcp-top svg{width:20px;height:20px}

@media (max-width:820px){
  .tcp-footer{padding-top:52px}
  .tcp-footer-inner{gap:28px}
  .tcp-fcol{flex:1 1 44%}
  .tcp-fbrand{flex:1 1 100%}
  .tcp-top{right:14px;bottom:14px}
}
@media (max-width:520px){
  .tcp-fcol{flex:1 1 100%}
}
/* ---------- Contact form ---------- */
.tcp-form{display:flex;flex-direction:column;gap:16px;max-width:660px}
.tcp-field{display:flex;flex-direction:column;gap:7px}
.tcp-field label{font-size:.8rem;font-weight:600;color:var(--tcp-ink)}
.tcp-field input,.tcp-field select,.tcp-field textarea{
  padding:.9rem 1.05rem;border:1px solid var(--tcp-line);border-radius:var(--tcp-input,12px);
  background:#fff;color:var(--tcp-ink);font-family:var(--tcp-body);font-size:.96rem;width:100%;
  transition:border-color .2s var(--tcp-ease),box-shadow .2s var(--tcp-ease);
}
.tcp-field textarea{min-height:140px;resize:vertical}
.tcp-field input:focus,.tcp-field select:focus,.tcp-field textarea:focus{
  outline:none;border-color:var(--tcp-red);box-shadow:0 0 0 3px var(--tcp-red-tint);
}
.tcp-field-row{display:flex;gap:14px;flex-wrap:wrap}
.tcp-field-row .tcp-field{flex:1 1 220px;min-width:0}
.tcp-guest-fields{display:flex;flex-direction:column;gap:16px}
.tcp-guest-fields[hidden]{display:none}
.tcp-submit{
  align-self:flex-start;padding:.95rem 2rem;border:0;border-radius:var(--tcp-pill);
  background:var(--tcp-red);color:#fff;font-family:var(--tcp-body);font-weight:600;font-size:.95rem;
  cursor:pointer;box-shadow:var(--tcp-shadow);
  transition:transform .2s var(--tcp-ease),background-color .2s var(--tcp-ease),box-shadow .2s var(--tcp-ease);
}
.tcp-submit:hover{background:var(--tcp-red-h);transform:translateY(-2px);box-shadow:var(--tcp-shadow-lift)}
.tcp-submit:active{transform:translateY(0)}
.tcp-form .form-status{
  font-size:.92rem;font-weight:600;color:var(--tcp-red);
  padding:13px 15px;border-radius:12px;background:var(--tcp-red-tint);margin:0;
}
.tcp-form .form-status[hidden]{display:none}
.tcp-form .form-status.is-ok{color:#0F7B3E;background:rgba(15,123,62,.1)}

/* Elementor's html widget must not clip the form */
.elementor-widget-html{overflow:visible}
button.tcp-top{border:0;padding:0;cursor:pointer;font:inherit}

/* Elementor containers drop _css_classes but keep _element_id, so the
   inverted bands are hooked by id. */
#tcp-band-dark,#tcp-band-dark-2{background:var(--tcp-ink)!important}
#tcp-band-dark h1,#tcp-band-dark h2,#tcp-band-dark h3,#tcp-band-dark .elementor-heading-title,
#tcp-band-dark-2 h1,#tcp-band-dark-2 h2,#tcp-band-dark-2 h3,#tcp-band-dark-2 .elementor-heading-title{color:#fff!important}
#tcp-band-dark p,#tcp-band-dark li,#tcp-band-dark-2 p,#tcp-band-dark-2 li{color:rgba(255,255,255,.82)!important}

/* #E00202 as small text on white is 4.40:1, under the 4.5 AA floor.
   Red text uses a darker red on light grounds and a lifted red on dark. */
.tcp-eyebrow .elementor-heading-title,.tcp-eyebrow{color:var(--tcp-red-ink)!important}
#tcp-band-dark .tcp-eyebrow .elementor-heading-title,
#tcp-band-dark-2 .tcp-eyebrow .elementor-heading-title,
.tcp-banner .tcp-eyebrow .elementor-heading-title{color:var(--tcp-red-lift)!important}
