/* =========================
   Global variables
   ========================= */
:root{
  --brand: #285a84;           /* base blue */
  --brand-light: #3679b0;     /* lighter hover blue */
  --brand-dark: #1f4668;      /* optional pressed/active */
  --brand-hover: var(--brand-light); /* alias for legacy refs */
  --accent: #c2ef7e;          /* lime */
  --cta: #85C872;             /* green CTA */
  --cta-hover: #5EA669;       /* green hover */
}

/* Smooth transitions & kill gradients that block hover effects */
button,
.button,
.btn,
.tg-button,
input[type="submit"],
input[type="button"],
a.button,
a.btn,
.wp-block-button .wp-block-button__link,
.wpforms-submit,
.wpforms-page-button{
  background-image: none !important;
  transition:
    background-color .18s ease,
    color .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
}

/* =========================
   Header layout tweaks
   ========================= */
#header-right-section{
  float: none !important;
  display: flex;
  justify-content: center;
  width: 100%;
}
#header-right-sidebar{
  display: flex;
  justify-content: center;
  width: 100%;
}

/* =========================
   CTA Widget
   ========================= */
.widget_call_to_action{
  text-align: center;
  max-width: 100%;
  padding: 1rem;
  margin: 0 auto;
}
.call-to-action-content-wrapper{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.call-to-action-content h3,
.call-to-action-content p{
  text-align: center;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}
.call-to-action-content-wrapper .read-more{
  display: inline-block;
  margin-top: 1rem;
  background-color: var(--cta);
  color: #fff;
  padding: 0.75rem 1.5rem;
  border-radius: 6px;
  font-weight: normal;
  text-decoration: none;
}
.call-to-action-content-wrapper .read-more:hover{
  background-color: var(--cta-hover);
  color: #fff;
}

/* =========================
   Page-specific tweaks
   ========================= */
.hidden-token-field{ display: none !important; }

/* Page 1723: solid header, comfy hero, clear footer */
.page-id-1723 h1.entry-title,
.page-id-1723 .entry-title{ display: none !important; }
.page-id-1723 .wp-block-cover:first-of-type{
  min-height: 90vh;
  margin-bottom: 4rem;
}
.page-id-1723 .breadcrumb,
.page-id-1723 .breadcrumbs,
.page-id-1723 nav.rank-math-breadcrumb{ display: none !important; }
.page-id-1723 ul,
.page-id-1723 ol{ list-style: none !important; padding-left: 0; }
.page-id-1723 ul li,
.page-id-1723 ol li{ margin-left: 1.5em; position: relative; }

/* Hide page title only on page ID 1864 and 2011 (cover classic + block themes) */
.page-id-1864 .entry-title,
.page-id-2011 .entry-title,
.page-id-2011 h1.entry-title,
.page-id-2011 .page-title,
.page-id-2011 .wp-block-post-title,
.page-id-2011 .wp-block-post-title a,
.page-id-2011 .entry-header .entry-title{
  display: none !important;
  visibility: hidden !important;
}

/* =========================
   WPForms – hide injected fields for form 1941
   ========================= */
.wpforms-form-1941 .wpforms-field-website,
.wpforms-form-1941 .wpforms-field-email{
  display: none !important;
}

/* =========================
   WPForms – form 1941 styling
   ========================= */
#wpforms-form-1941{ --card-radius: 14px; }
#wpforms-form-1941 .wpforms-field{ margin-bottom: 22px; }
#wpforms-form-1941 .wpforms-field-label{ font-weight: 600; }

/* Buttons */
#wpforms-form-1941 .wpforms-page-button,
#wpforms-form-1941 .wpforms-submit{
  background-color: var(--brand) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 9999px !important;
  padding: 12px 22px !important;
  box-shadow: 0 6px 18px rgba(40,90,132,.18);
}
#wpforms-form-1941 .wpforms-page-button:hover,
#wpforms-form-1941 .wpforms-submit:hover{
  background-color: var(--brand-light) !important;
  color: #fff !important;
  filter: none !important;
}
#wpforms-form-1941 .wpforms-page-button:active,
#wpforms-form-1941 .wpforms-submit:active{
  background-color: var(--brand-dark) !important;
}

/* Progress indicator color */
#wpforms-form-1941 .wpforms-page-indicator .wpforms-page-progress,
#wpforms-form-1941 .wpforms-page-indicator .wpforms-page-progress .bar,
#wpforms-form-1941 .wpforms-page-indicator .wpforms-page-indicator-page.current{
  background-color: var(--brand) !important;
}

/* Radio “cards” */
#wpforms-form-1941 .wpforms-image-choices-modern .wpforms-image-choices-item{
  border-radius: 12px;
}

/* =========================
   WPForms – Confirmation (global)
   ========================= */
.wpforms-confirmation-container-full{
  background: #f7fbf2;
  border: 2px solid var(--accent);
  border-radius: var(--card-radius);
  padding: 28px 28px 26px;
  max-width: 760px;
  margin: 28px auto;
  box-shadow: 0 10px 28px rgba(0,0,0,.06);
}
.wpforms-confirmation-container-full h3{
  color: var(--brand);
  margin-top: 0;
  margin-bottom: 10px;
  font-weight: 700;
}
.wpforms-confirmation-container-full p,
.wpforms-confirmation-container-full li{
  font-size: 1.05rem;
  line-height: 1.6;
}
.wpforms-confirmation-container-full a.wpforms-button{
  display: inline-block;
  background: var(--brand);
  color: #fff !important;
  text-decoration: none !important;
  padding: 12px 20px;
  border-radius: 9999px;
  font-weight: 600;
  box-shadow: 0 6px 18px rgba(40,90,132,.18);
}
.wpforms-confirmation-container-full a.wpforms-button:hover{
  background-color: var(--brand-light);
  color: #fff !important;
  filter: none;
}
.wpforms-confirmation-container-full::after{
  content: "";
  display: block;
  height: 6px;
  margin: 18px auto 0;
  max-width: 840px;
  background: var(--brand);
  border-radius: 6px;
}
@media (max-width: 640px){
  .wpforms-confirmation-container-full{ padding: 22px; }
  #wpforms-form-1941 .wpforms-page-button,
  #wpforms-form-1941 .wpforms-submit{ width: 100%; }
}

/* Centered bullet list only for WPForms form ID 1941 confirmations */
#wpforms-confirmation-1941{ text-align: center; }
#wpforms-confirmation-1941 ul{
  display: inline-block;
  text-align: left;
  margin: 0 auto 1rem;
  padding-left: 1.25rem;
  list-style: disc;
}
#wpforms-confirmation-1941 li{ margin: 0.25rem 0; }
#wpforms-confirmation-1941 a.wpforms-confirmation-cta,
#wpforms-confirmation-1941 a[href*="calendly.com"]{
  display: inline-block;
  padding: 0.75rem 1.25rem;
  border-radius: 9999px;
  background: var(--brand);
  color: #fff !important;
  text-decoration: none;
}
#wpforms-confirmation-1941 a.wpforms-confirmation-cta:hover,
#wpforms-confirmation-1941 a[href*="calendly.com"]:hover{ opacity: .9; }

/* =========================
   Theme/Generic Buttons (fallback)
   ========================= */
.button,
.btn,
.tg-button,
a.button,
a.btn{
  background-color: var(--brand);
  color: #fff;
  border: none;
}
.button:hover,
.btn:hover,
.tg-button:hover,
a.button:hover,
a.btn:hover{
  background-color: var(--brand-light);
  color: #fff;
}

/* =========================
   Gutenberg “Buttons” block
   ========================= */
/* Solid */
.wp-block-button .wp-block-button__link{
  background-color: var(--brand);
  color: #fff;
  border: none;
  border-radius: 9999px;
}
.wp-block-button .wp-block-button__link:hover,
.wp-block-button .wp-block-button__link:focus-visible{
  background-color: var(--brand-light) !important;
  color: #fff !important;
}

/* Outline style */
.wp-block-button.is-style-outline .wp-block-button__link{
  background: transparent !important;
  color: var(--brand) !important;
  border: 2px solid var(--brand) !important;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:focus-visible{
  background: var(--brand) !important;
  color: #fff !important;
  border-color: var(--brand-light) !important;
}

/* If block sets its own background, still make hover obvious */
.wp-block-button .wp-block-button__link.has-background:hover{
  filter: none !important;
  background-image: none !important;
}

/* =========================
   BLOG: Post titles & Read More
   ========================= */
.wp-block-post-title a{
  color: var(--brand);
  text-decoration: none;
}
.wp-block-post-title a:hover{
  color: #ffffff !important;
  background: var(--brand) !important;
  padding: .08em .25em;
  border-radius: .3em;
}

/* Gutenberg "Read more" link – style like a button */
.wp-block-read-more{
  display: inline-block;
  background: var(--brand);
  color: #fff !important;
  padding: .6rem 1rem;
  border-radius: 9999px;
  text-decoration: none !important;
}
.wp-block-read-more:hover{
  background: var(--brand-light);
  color: #fff !important;
}

/* =========================
   Focus states (accessibility)
   ========================= */
.wp-block-button .wp-block-button__link:focus-visible,
.button:focus-visible,
.btn:focus-visible,
a.button:focus-visible,
a.btn:focus-visible,
#wpforms-form-1941 .wpforms-page-button:focus-visible,
#wpforms-form-1941 .wpforms-submit:focus-visible{
  outline: 2px solid var(--brand-light);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(54,121,176,.25);
}

/* =========================
   Misc carry-over
   ========================= */
.wpforms-confirmation-container-full a.wpforms-button{ background: var(--brand); }

/* =========================================
   Pillar pages: 1723 + 1864 + 9999 (scoped safely)
   ========================================= */
/* Plain content links (NOT buttons) */
:is(.page-id-1723, .page-id-1864, .page-id-2011) .entry-content
  a:not(.wp-block-button__link):not(.wp-element-button):not(.wp-block-file__button){
  text-decoration: none;
  color: var(--brand);
  transition: color .2s ease, background-color .2s ease;
}

/* Invert on hover: white text on blue chip */
:is(.page-id-1723, .page-id-1864, .page-id-2011) .entry-content
  a:not(.wp-block-button__link):not(.wp-element-button):not(.wp-block-file__button):hover,
:is(.page-id-1723, .page-id-1864, .page-id-2011) .entry-content
  a:not(.wp-block-button__link):not(.wp-element-button):not(.wp-block-file__button):focus-visible{
  color: #fff !important;
  background-color: var(--brand);
  text-decoration: none;
  border-radius: .2em;
  padding: .05em .15em;
}

/* Keep visited the same brand color */
:is(.page-id-1723, .page-id-1864, .page-id-2011) .entry-content
  a:not(.wp-block-button__link):not(.wp-element-button):not(.wp-block-file__button):visited{
  color: var(--brand);
}

/* Buttons (only if the block hasn't set custom colors) */
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-button
  .wp-block-button__link:not(.has-background):not(.has-text-color){
  background-color: var(--brand) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 9999px;
  background-image: none !important;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-button
  .wp-block-button__link:not(.has-background):hover,
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-button
  .wp-block-button__link:not(.has-background):focus-visible{
  background-color: var(--brand-light) !important;
  color: #fff !important;
}

/* Outline buttons */
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-button.is-style-outline .wp-block-button__link{
  background: transparent !important;
  color: var(--brand) !important;
  border: 2px solid var(--brand) !important;
}
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-button.is-style-outline .wp-block-button__link:hover,
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-button.is-style-outline .wp-block-button__link:focus-visible{
  background: var(--brand) !important;
  color: #fff !important;
  border-color: var(--brand-light) !important;
}

/* File block (download) button */
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-file .wp-block-file__button{
  background-color: var(--brand) !important;
  color: #fff !important;
  border-radius: 9999px;
  background-image: none !important;
  transition: background-color .2s ease, color .2s ease;
}
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-file .wp-block-file__button:hover,
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-file .wp-block-file__button:focus-visible{
  background-color: var(--brand-light) !important;
  color: #fff !important;
}

/* Icons inside File buttons & links inherit color */
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-file .wp-block-file__button i,
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-file .wp-block-file__button svg,
:is(.page-id-1723, .page-id-1864, .page-id-2011) .entry-content a i,
:is(.page-id-1723, .page-id-1864, .page-id-2011) .entry-content a svg{
  color: inherit;
  fill: currentColor;
  transition: color .2s ease, fill .2s ease;
}

/* Ensure buttons aren't treated as plain links by the chip rule */
:is(.page-id-1723, .page-id-1864, .page-id-2011) .entry-content .wp-block-button__link,
:is(.page-id-1723, .page-id-1864, .page-id-2011) .entry-content .wp-element-button,
:is(.page-id-1723, .page-id-1864, .page-id-2011) .entry-content .wp-block-file__button{
  background-color: unset; /* handled in their specific sections */
}

/* --- Fix File block filename + icon color on pillar pages (1723, 1864, 9999) --- */

/* Keep the file name link simple: always brand color, underline on hover */
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-file a:not(.wp-block-file__button){
  background: none !important;      /* no chip */
  color: var(--brand) !important;   /* always brand blue */
  padding: 0 !important;
  border-radius: 0 !important;
  text-decoration: none;
}
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-file a:not(.wp-block-file__button):hover,
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-file a:not(.wp-block-file__button):focus-visible{
  background: none !important;
  color: var(--brand) !important;   /* stay brand blue on hover */
  text-decoration: underline;       /* subtle hover feedback */
}

/* Ensure any icons in that link inherit brand blue (never white) */
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-file a:not(.wp-block-file__button) i,
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-file a:not(.wp-block-file__button) svg{
  color: var(--brand) !important;
  fill: var(--brand) !important;
}

/* File block BUTTON itself still works like a button */
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-file .wp-block-file__button{
  display: inline-flex;
  align-items: center;
  gap: .5em;
  line-height: 1;
  background-color: var(--brand) !important;
  color: #fff !important;
  border-radius: 9999px;
  transition: background-color .2s ease, color .2s ease;
}
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-file .wp-block-file__button:hover,
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-file .wp-block-file__button:focus-visible{
  background-color: var(--brand-light) !important;
  color: #fff !important;
}

/* --- File block FA icon: stronger hover effect --- */
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-file a:not(.wp-block-file__button) i,
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-file a:not(.wp-block-file__button) svg{
  color: var(--brand);     /* base navy */
  fill: var(--brand);
  transition: color .2s ease, fill .2s ease, filter .2s ease, transform .2s ease;
}

:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-file a:not(.wp-block-file__button):hover i,
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-file a:not(.wp-block-file__button):hover svg{
  color: #4aa3ff !important;   /* bright sky blue */
  fill: #4aa3ff !important;
  filter: drop-shadow(0 0 4px rgba(74,163,255,.6)); /* glow-ish */
  transform: scale(1.1);       /* subtle bump up */
}

/* =========================================
   Pillar Page Layout Padding Fix
   (for page IDs 1723 + 1864 + 9999)
   ========================================= */
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-group.alignwide,
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-group.alignfull,
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-cover__inner-container {
  padding-left: 1.25rem;   /* ~20px on desktop */
  padding-right: 1.25rem;
}

@media (max-width: 768px) {
  :is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-group.alignwide,
  :is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-group.alignfull,
  :is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-cover__inner-container {
    padding-left: 1rem;   /* ~16px on tablet/mobile */
    padding-right: 1rem;
  }
}

/* Constrain long text areas inside wide groups */
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-group.alignwide > *:not(.wp-block-cover):not(.wp-block-columns),
:is(.page-id-1723, .page-id-1864, .page-id-2011) .wp-block-group.alignfull > *:not(.wp-block-cover):not(.wp-block-columns) {
  max-width: 900px;     /* your chosen width */
  margin-left: auto;
  margin-right: auto;
}

.page-id-1102 .entry-title{display:none!important;visibility:hidden!important;}

/* Hero wrapper */
.hero-vid {
  position: relative;
  max-width: 1280px;           /* adjust to taste */
  margin: 0 auto;
}

/* Make VideoPress players responsive */
.hero-vid video,
.hero-vid iframe {
  width: 100%;
  height: auto;
  display: block;
  border: 0;
}

/* Show loop by default; hide main until click */
.hero-vid .main-clip { display: none; }

/* Position the custom play button over the loop */
.hero-vid .play-trigger {
  position: absolute;
  inset: auto 0 16px 0;        /* bottom centered on desktop */
  display: grid;
  place-items: center;
  z-index: 3;
  pointer-events: auto;
}

@media (min-width: 900px) {
  .hero-vid .play-trigger {
    inset: 0;                  /* center on larger screens */
    height: 0;                 /* let inner button position itself */
  }
  .hero-vid .play-trigger .wp-block-button__link {
    position: absolute;
    left: 50%; top: 50%;
    transform: translate(-50%, -50%);
  }
}

/* Button style (tweak to your brand green) */
.hero-vid .play-trigger .wp-block-button__link {
  background: #2f7d32;         /* Neil CPA green */
  color: #fff;
  border-radius: 999px;
  padding: 12px 18px;
  font-weight: 600;
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
}

/* Optional: kill any WP “dim” overlay if your loop sits in a Cover block elsewhere */
.wp-block-cover.has-background-dim::before { opacity: 0 !important; }

/* Make the hero area full width and responsive */
.hero-vid { position: relative; width: 100%; max-width: none; }

/* Prevent theme wrappers from constraining VideoPress/shortcode widths */
.hero-vid .wp-block-shortcode,
.hero-vid .jetpack-video-wrapper,
.hero-vid figure,
.hero-vid iframe,
.hero-vid video { width: 100% !important; height: auto !important; display: block; }

/* Keep a clean 16:9 area; crop if the container is taller */
.hero-vid video, .hero-vid iframe { aspect-ratio: 16 / 9; object-fit: cover; }

/* Kill Cover-block dim overlays if present */
.wp-block-cover.has-background-dim::before { opacity: 0 !important; }

/* Play button styling */
.hero-vid .play-trigger{
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  background: #2f7d32; color: #fff; border: 0; border-radius: 999px;
  padding: 12px 18px; font-weight: 600; cursor: pointer;
  box-shadow: 0 10px 24px rgba(0,0,0,.18); z-index: 3;
}

/* Wrapper */
.hero-vid { position: relative; width:100%; max-width:1200px; margin:0 auto 28px; }

/* Make players responsive and fill nicely */
.hero-vid video,
.hero-vid iframe { width:100% !important; height:auto !important; display:block; aspect-ratio:16/9; object-fit:cover; }

/* Hide main video until we flip the switch */
.hero-vid .main-clip { display:none; }

/* When playing: show main, hide loop & button */
.hero-vid.is-playing .main-clip { display:block; }
.hero-vid.is-playing .loop-clip,
.hero-vid.is-playing .play-trigger { display:none; }

/* Overlay play button (prevent theme button styles) */
.hero-vid .play-trigger { 
  all: unset;                  /* kill theme styles */
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:86px; height:86px; border-radius:999px; background:#2f7d32; color:#fff;
  display:grid; place-items:center; cursor:pointer; z-index:5;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
}
.hero-vid .play-icon { font-size:28px; line-height:1; }

/* If a Cover block around this is dimming, nuke it */
.wp-block-cover.has-background-dim::before { opacity:0 !important; }

.hero-vid{position:relative;width:100%;max-width:1200px;margin:0 auto 28px}
.hero-vid video,.hero-vid iframe{width:100%!important;height:auto!important;display:block;aspect-ratio:16/9;object-fit:cover;background:#000}

/* Hide the play button and loop after we start playing */
.hero-vid.is-playing .play-trigger,
.hero-vid.is-playing .loop-clip{display:none}

/* Overlay Play button (not WP Buttons block) */
.hero-vid .play-trigger{all:unset;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:86px;height:86px;border-radius:999px;background:#2f7d32;color:#fff;display:grid;place-items:center;
  cursor:pointer;z-index:5;box-shadow:0 10px 24px rgba(0,0,0,.18)}
.hero-vid .play-icon{font-size:28px;line-height:1}

/* Kill Cover dim if present */
.wp-block-cover.has-background-dim::before{opacity:0!important}

.hero-vid{position:relative;width:100%;max-width:1200px;margin:0 auto 32px}
.hero-vid video{width:100%!important;height:auto!important;display:block;aspect-ratio:16/9;object-fit:cover;background:#000}

.hero-vid.is-playing .loop-clip,
.hero-vid.is-playing .play-trigger{display:none}

.hero-vid .play-trigger{all:unset;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:86px;height:86px;border-radius:999px;background:#2f7d32;color:#fff;display:grid;place-items:center;
  cursor:pointer;z-index:5;box-shadow:0 10px 24px rgba(0,0,0,.18)}
.hero-vid .play-icon{font-size:28px;line-height:1}

/* Nuke any Cover dim overlay nearby */
.wp-block-cover.has-background-dim::before{opacity:0!important}

/* ===== Hero play button: rounded-square over rounded-square ===== */
.hero-vid .play-trigger{
  all: unset;
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 88px; height: 88px;                      /* outer size */
  background: var(--cta);                         /* outer green */
  border-radius: 14px;                            /* rounded square */
  display: grid; place-items: center;
  cursor: pointer; z-index: 5;
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
}

/* inner rounded square */
.hero-vid .play-trigger::before{
  content: "";
  width: 68px; height: 68px;                      /* slightly smaller than outer */
  background: var(--accent);                      /* bright lime */
  border-radius: 10px;                            /* rounded square */
  display: block;
}

/* play triangle on top of the inner square */
.hero-vid .play-trigger::after{
  content: "";
  position: absolute;
  /* triangle pointing right */
  width: 0; height: 0;
  border-left: 18px solid #17324a;                /* dark navy triangle for contrast */
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  /* nudge a hair to the right so it feels centered optically */
  transform: translateX(2px);
}

/* keep your old text icon hidden (we're drawing with ::after now) */
.hero-vid .play-icon{ display:none; }

/* optional: smaller on very small screens */
@media (max-width:480px){
  .hero-vid .play-trigger{ width:72px; height:72px; border-radius:12px; }
  .hero-vid .play-trigger::before{ width:56px; height:56px; border-radius:9px; }
  .hero-vid .play-trigger::after{
    border-left-width:16px; border-top-width:10px; border-bottom-width:10px;
  }
}

/* focus state (keyboard users) */
.hero-vid .play-trigger:focus-visible{
  outline: 3px solid var(--brand-light);
  outline-offset: 3px;
}

/* --- Custom Square Play Button --- */
.hero-vid .play-trigger {
  all: unset;
  position: absolute;
  left: 50%; 
  top: 50%; 
  transform: translate(-50%, -50%);
  width: 90px; 
  height: 90px;
  border-radius: 16px;                  /* rounded square */
  background: var(--accent);            /* bright lime */
  display: grid; 
  place-items: center;
  cursor: pointer; 
  z-index: 5;
  box-shadow: 0 8px 20px rgba(0,0,0,.25);
  transition: transform .2s ease, box-shadow .2s ease;
}

.hero-vid .play-trigger:hover {
  transform: translate(-50%, -50%) scale(1.1); /* grow effect */
  box-shadow: 0 12px 28px rgba(0,0,0,.35);     /* stronger glow */
}

/* Inner blue square */
.hero-vid .play-trigger::before {
  content: "";
  width: 60%;
  height: 60%;
  background: var(--brand);             /* your dark blue */
  border-radius: 12px;
  display: block;
}

/* White triangle "play" icon */
.hero-vid .play-trigger::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-35%, -50%);     /* adjust for centering */
  width: 0; 
  height: 0;
  border-left: 18px solid #fff;         /* white triangle */
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
}

/* Full-width hero video on all screens */
.hero-vid {
  max-width: none !important;   /* remove the 1200px cap */
  margin: 0 auto 32px !important;
  width: 100% !important;
  padding: 0 !important;
}

/* Kill left/right padding injected by WP groups/blocks */
.hero-vid .wp-block-group,
.hero-vid .wp-block-cover__inner-container {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Make .hero-vid truly edge-to-edge even inside nested Cover/Group wrappers */
.hero-vid{
  /* full-bleed hack */
  width: 100vw !important;
  max-width: 100vw !important;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;

  /* kill internal block gaps in this section only */
  --wp--style--block-gap: 0 !important;

  /* no extra padding around the media */
  padding: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 32px !important; /* keep your bottom spacing */
}

/* Strip paddings/margins that nested blocks add */
.hero-vid :is(.wp-block-cover, .wp-block-group, .wp-block-columns){
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Cover inner container often injects padding */
.hero-vid .wp-block-cover__inner-container{
  padding: 0 !important;
  max-width: none !important;
}

/* Any alignfull/alignwide inside should inherit full-bleed too */
.hero-vid :is(.alignfull, .wp-block-group.alignfull, .wp-block-cover.alignfull){
  width: 100% !important;
  max-width: 100% !important;
}

/* Safety: make the actual media fill */
.hero-vid video,
.hero-vid iframe{
  width: 100% !important;
  height: auto !important;
  display: block;
  aspect-ratio: 16/9;
  object-fit: cover;
}

/* Remove theme container padding for this one hero only */
.entry-content > .hero-vid{ padding-left: 0 !important; padding-right: 0 !important; }

/* Reset previous full-bleed hack so it won't get clipped */
.hero-vid{
  left: auto !important;
  right: auto !important;
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

/* Strip nested padding/margins INSIDE the hero only */
.hero-vid :is(.wp-block-cover, .wp-block-group, .wp-block-columns, .wp-block-cover__inner-container){
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Make the media fill */
.hero-vid video,
.hero-vid iframe{
  width: 100% !important;
  height: auto !important;
  display: block;
  aspect-ratio: 16/9;
  object-fit: cover;
}

/* True full-bleed on the COVER itself (no clipping) */
.hero-edge{
  --wp--style--block-gap: 0 !important;
}
.hero-edge.wp-block-cover{
  padding: 0 !important;
}
.hero-edge .wp-block-cover__inner-container{
  padding: 0 !important;
  max-width: none !important;
}
.hero-edge .hero-vid{
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
.hero-edge video,
.hero-edge iframe{
  width: 100% !important;
  height: auto !important;
  display: block;
  aspect-ratio: 16/9;
  object-fit: cover;
}
