/* Cowboys V3 (alive + clean + mobile-first) */
:root{
  --bg:#0B1F3A;
  --red:#E63946;
  --glass: rgba(255,255,255,.08);
  --glass2: rgba(255,255,255,.06);
  --stroke: rgba(255,255,255,.14);
  --text: rgba(255,255,255,.92);
  --muted: rgba(255,255,255,.72);
  --muted2: rgba(255,255,255,.62);
  --shadow: 0 18px 55px rgba(0,0,0,.32);
  --shadow2: 0 10px 30px rgba(0,0,0,.22);
  --r: 22px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text);
  background: var(--bg);
  overflow-x:hidden;
}
a{color:inherit}

/* Background stage (subtle alive) */
.bgStage{position:fixed; inset:0; z-index:-1; pointer-events:none;}
.bgImage{
  position:absolute; inset:0;
  background-size:cover;
  background-position:center;
  opacity:.22;
  filter: saturate(1.08) contrast(1.02);
  transform: scale(1.04);
  transition: background-image 800ms ease, opacity 600ms ease;
}
.bgGlow{
  position:absolute; inset:-20%;
  background:
    radial-gradient(900px 520px at 20% 0%, rgba(230,57,70,.35), transparent 62%),
    radial-gradient(900px 520px at 95% 10%, rgba(45,212,191,.16), transparent 62%),
    radial-gradient(900px 520px at 50% 100%, rgba(255,255,255,.08), transparent 60%);
  opacity:.95;
  animation: glowDrift 18s ease-in-out infinite;
  filter: blur(0px);
}
@keyframes glowDrift{
  0%,100%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(-1.2%, 0.8%, 0) scale(1.02)}
}
.bgGrid{
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: 90px 90px;
  opacity:.10;
  mask-image: radial-gradient(closest-side at 50% 25%, rgba(0,0,0,.9), transparent 70%);
  animation: gridSlide 16s linear infinite;
}
@keyframes gridSlide{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-90px,-90px,0)}
}
.bgNoise{
  position:absolute; inset:0;
  opacity:.06;
  background-image:url("/assets/backgrounds/noise.png");
  background-size: 260px 260px;
  mix-blend-mode: overlay;
}

/* Layout helpers */
.container{max-width:1120px; margin:0 auto; padding:0 16px;}
.section{padding:28px 0;}
.sectionHead{display:flex; flex-direction:column; gap:6px; margin-bottom:12px;}
.sectionHead h2{margin:0; font-size:22px; letter-spacing:.2px;}
.muted{margin:0; color:var(--muted)}
.mutedSmall{margin:0; color:var(--muted2); font-size:13px;}

.skipLink{position:absolute; left:-999px; width:1px; height:1px; overflow:hidden;}
.skipLink:focus{left:12px; top:12px; width:auto; height:auto; padding:10px 12px; border-radius:12px; background:#fff; color:#000; z-index:99999;}

/* Glass */
.glass{
  background: var(--glass2);
  border: 1px solid var(--stroke);
  border-radius: var(--r);
  box-shadow: var(--shadow2);
  backdrop-filter: blur(16px);
  position:relative;
  overflow:hidden;
}
.glass:before{
  content:"";
  position:absolute; inset:-1px;
  background: radial-gradient(650px 220px at 20% 10%, rgba(255,255,255,.14), transparent 60%);
  opacity:.8;
  pointer-events:none;
}

/* Header */
.siteHeader{
  position:sticky; top:0; z-index:9990;
  backdrop-filter: blur(14px);
  background: rgba(11,31,58,.74);
  border-bottom: 1px solid rgba(255,255,255,.12);
}
.topBar{display:flex; justify-content:space-between; align-items:center; padding:10px 16px; gap:10px;}
.topLeft{display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
.topLink{color:var(--muted); text-decoration:none; font-size:13px; font-weight:800;}
.topLink:hover{color:#fff; text-decoration:underline;}
.pill{padding:6px 10px; border-radius:999px; background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.14); color:var(--muted); font-size:12px; font-weight:900;}
.pillLink{padding:8px 10px; border-radius:999px; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.06); text-decoration:none; font-weight:1000; color:#fff;}
.pillLink:hover{background:rgba(255,255,255,.10);}

.navRow{display:flex; align-items:center; justify-content:space-between; padding:12px 16px; gap:14px;}
.brand{display:flex; align-items:center; text-decoration:none;}
.brandLogo{height:34px; width:auto; filter: drop-shadow(0 10px 22px rgba(0,0,0,.25));}
.navLinks{display:flex; gap:16px; align-items:center;}
.navLinks a{color:var(--muted); text-decoration:none; font-weight:1000; padding:8px 10px; border-radius:12px;}
.navLinks a:hover{color:#fff; background:rgba(255,255,255,.08);}

.navDrop{position:relative;}
.navDropBtn{
  color:var(--muted);
  background:transparent;
  border:0;
  font:inherit;
  font-weight:1000;
  padding:8px 10px;
  border-radius:12px;
  cursor:pointer;
}
.navDropBtn:hover{color:#fff; background:rgba(255,255,255,.08);}
.navDropMenu{
  position:absolute; top:44px; right:0;
  min-width:220px;
  background: rgba(11,31,58,.96);
  border:1px solid rgba(255,255,255,.14);
  border-radius:16px;
  box-shadow: var(--shadow);
  padding:8px;
  display:none;
  z-index:9999;
}
.navDropMenu a{
  display:block;
  padding:10px 10px;
  border-radius:12px;
  text-decoration:none;
  color:rgba(255,255,255,.90);
  font-weight:900;
}
.navDropMenu a:hover{background:rgba(255,255,255,.08);}
.navDrop.open .navDropMenu{display:block;}

.navActions{display:flex; align-items:center; gap:10px;}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 14px; border-radius:14px;
  font-weight:1000; text-decoration:none;
  border:1px solid rgba(255,255,255,.14);
  box-shadow: 0 12px 30px rgba(0,0,0,.16);
  transition: transform .12s ease, filter .12s ease, background .12s ease;
}
.btn:hover{transform: translateY(-1px); filter: brightness(1.04);}
.btnPrimary{background: var(--red); color:#fff; border-color: rgba(0,0,0,.15);}
.btnGhost{background: rgba(255,255,255,.08); color:#fff;}
.btnGhost:hover{background: rgba(255,255,255,.12);}

.hamburger{
  width:44px; height:44px; border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.08);
  display:none; flex-direction:column; justify-content:center; gap:6px;
  padding:0 12px; cursor:pointer;
}
.hamburger span{display:block; height:2px; background:#fff; opacity:.9; border-radius:2px;}

/* Trust strip */
.trustStrip{
  border-top:1px solid rgba(255,255,255,.10);
  border-bottom:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
}
.trustStripInner{
  max-width:1120px;
  margin:0 auto;
  padding:10px 16px;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.trustItem{color:rgba(255,255,255,.84); font-weight:1000; font-size:13px;}
.trustDot{width:5px; height:5px; border-radius:999px; background:rgba(255,255,255,.35);}
.trustLink{
  margin-left:auto;
  color:rgba(255,255,255,.92);
  font-weight:1000;
  text-decoration:none;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
}
.trustLink:hover{background:rgba(255,255,255,.10);}

/* Google reviews slot in trust strip */
.trustGoogle{display:flex; align-items:center; gap:10px; padding:6px 8px; border-radius:14px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.06);}
.googleBadge{height:clamp(24px, 2.2vw, 32px); width:auto; opacity:.96;}
.googleText{display:flex; align-items:baseline; gap:8px; color:rgba(255,255,255,.92); font-weight:1000;}
.googleStar{color:#ffd36b;}
.googleSmall{color:rgba(255,255,255,.60); font-size:12px; font-weight:800;}

/* Mobile menu */
.menuOverlay{
  position:fixed; inset:0;
  z-index:9998;
  background:rgba(0,0,0,.55);
  backdrop-filter: blur(8px);
  opacity:0;
  pointer-events:none;
  transition: opacity .12s ease;
}
.mobileMenu{
  position:fixed; top:0; right:0;
  height:100vh; width:min(86vw, 390px);
  z-index:9999;
  background: rgba(11,31,58,.98);
  border-left:1px solid rgba(255,255,255,.14);
  padding:14px;
  display:flex; flex-direction:column;
  box-shadow: var(--shadow);
  transform: translateX(104%);
  pointer-events:none;
  transition: transform .16s ease;
}
.menu-open .menuOverlay{opacity:1; pointer-events:auto;}
.menu-open .mobileMenu{transform: translateX(0); pointer-events:auto;}
.mobileMenuHead{display:flex; align-items:center; justify-content:space-between; padding:8px 6px;}
.mobileMenuTitle{color:#fff; font-weight:1000; font-size:16px;}
.iconBtn{
  width:42px; height:42px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.08);
  color:#fff;
  cursor:pointer;
}
.mobileCloseBtn{position:relative; z-index:10000;}
.mobileMenuLinks{display:flex; flex-direction:column; gap:8px; padding:8px 6px;}
.mobileMenuLinks a{color:var(--text); text-decoration:none; font-weight:1000; padding:10px 10px; border-radius:14px;}
.mobileMenuLinks a:hover{background:rgba(255,255,255,.08);}
.mobileMenuLinks hr{border:0; border-top:1px solid rgba(255,255,255,.14); margin:8px 0;}
.mobileMenuCtas{margin-top:auto; display:grid; gap:10px; padding:10px 6px;}

/* Hamburger hint */
.navActions{position:relative;}
.menuHint{
  position:absolute;
  right:0;
  top:54px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.26);
  color:rgba(255,255,255,.90);
  font-weight:1000;
  font-size:12px;
  opacity:0;
  transform: translateY(-6px);
  pointer-events:none;
  transition: opacity .18s ease, transform .18s ease;
}
.show-menu-hint .menuHint{opacity:1; transform: translateY(0);}

/* Hero */
.hero{padding:34px 0 12px;}
.heroGrid{display:grid; grid-template-columns: 1fr 1fr; gap:24px; align-items:stretch;}
.heroCopy{padding:18px;}
.hero h1{margin:0 0 10px; font-size:clamp(30px, 4vw, 50px); line-height:1.02; letter-spacing:-.4px;}
.lead{margin:0 0 14px; color:rgba(255,255,255,.78); font-size:clamp(15px, 2vw, 18px); max-width:64ch;}
.heroCtas{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:12px;}
.chipRow{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px;}
.chip{padding:8px 10px; border-radius:999px; border:1px solid rgba(255,255,255,.14); background:rgba(0,0,0,.18); font-weight:1000; font-size:12px; color:rgba(255,255,255,.86);}

.microProof{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:10px;}
.micro{border-radius:18px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.06); padding:12px; transition: transform .14s ease;}
.micro:hover{transform: translateY(-2px);}
.microTop{font-weight:1000;}
.microSub{color:rgba(255,255,255,.72); font-weight:800; font-size:12px; margin-top:4px;}

.heroBadges{display:flex; gap:10px; flex-wrap:wrap; margin-top:14px; align-items:center;}
.heroBadges img{height:clamp(34px, 3.2vw, 46px); width:auto; opacity:.98; filter: drop-shadow(0 12px 26px rgba(0,0,0,.22));}

.heroMedia{padding:12px; display:flex; flex-direction:column; gap:10px;}
.videoShell{position:relative; border-radius:18px; overflow:hidden; border:1px solid rgba(255,255,255,.12); background:rgba(0,0,0,.22);}
.heroVideo{width:100%; height:260px; object-fit:cover; display:block;}
.videoOverlay{
  position:absolute; left:0; right:0; bottom:0;
  padding:12px;
  background: linear-gradient(to top, rgba(0,0,0,.56), transparent);
}
.openPill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 11px;
  border-radius:999px;
  border:1px solid rgba(49,214,140,.35);
  background: rgba(0,0,0,.34);
  color: rgba(236,255,246,.96);
  font-weight:1000;
  font-size:12px;
  margin-bottom:10px;
  box-shadow: 0 10px 26px rgba(0,0,0,.28);
}
.openDot{width:10px; height:10px; border-radius:999px; background:#2bff9a; box-shadow: 0 0 0 0 rgba(43,255,154,.55); animation: openPulse 1.25s infinite;}
@keyframes openPulse{0%{box-shadow:0 0 0 0 rgba(43,255,154,.55);}70%{box-shadow:0 0 0 10px rgba(43,255,154,0);}100%{box-shadow:0 0 0 0 rgba(43,255,154,0);}}
.videoTitle{font-weight:1000;}
.videoSub{color:rgba(255,255,255,.78); font-weight:800; font-size:12px; margin-top:2px;}

/* Tiles */
.tiles{display:grid; grid-template-columns:repeat(3, 1fr); gap:12px;}
.tile{
  text-decoration:none;
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  padding:14px;
  display:flex; gap:12px; align-items:center;
  transition: transform .14s ease, background .14s ease, box-shadow .14s ease;
  position:relative;
  overflow:hidden;
}
.tile:before{
  content:"";
  position:absolute; inset:-1px;
  background: radial-gradient(520px 240px at 12% 0%, rgba(255,255,255,.10), transparent 62%);
  opacity:0;
  transition: opacity .14s ease;
}
.tile:hover{transform: translateY(-3px); background: rgba(255,255,255,.08); box-shadow: var(--shadow2);}
.tile:hover:before{opacity:1;}
.tileIconImg{
  width:46px; height:46px; object-fit:contain;
  border-radius:16px;
  padding:10px;
  background: rgba(230,57,70,.14);
  border:1px solid rgba(230,57,70,.28);
}
.tileBody{flex:1}
.tileTitle{font-weight:1000; margin-bottom:4px;}
.tileText{color:rgba(255,255,255,.72); font-weight:800; font-size:13px; line-height:1.25;}
.tileArrow{color:rgba(255,255,255,.85); font-weight:1000;}

/* Timeline */
.timeline{list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(4, 1fr); gap:12px;}
.step{display:flex; gap:10px;}
.stepNum{width:38px; height:38px; border-radius:16px; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); font-weight:1000;}
.stepCard{flex:1; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:18px; padding:12px;}
.stepTitle{font-weight:1000; margin-bottom:4px;}
.stepText{color:rgba(255,255,255,.72); font-weight:800; font-size:13px; line-height:1.25;}

/* Two-column cards */
.twoCol{display:grid; grid-template-columns:repeat(2,1fr); gap:12px;}
.card{padding:14px;}
.card h3{margin:0 0 8px}
.list{margin:0; padding-left:18px; color:rgba(255,255,255,.78); font-weight:800;}
.list li{margin:8px 0;}

/* Proof band */
.proofBand{
  margin-top:14px;
  padding:14px;
  display:flex;
  gap:14px;
  align-items:center;
}
.truck{height:62px; width:auto;}
.proofBandCopy{flex:1}
.proofBandTitle{font-weight:1000}
.proofBandText{color:rgba(255,255,255,.70); font-weight:800; font-size:13px; margin-top:4px;}

/* Forms */
.miniForm{display:grid; gap:10px; margin-top:10px;}
.miniForm input, .miniForm select{
  width:100%;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.18);
  color:#fff;
  font-weight:800;
}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
.toggleRow{display:flex; gap:10px; align-items:center; color:rgba(255,255,255,.82); font-weight:1000; font-size:13px;}
.toggleRow input{width:18px; height:18px;}
.finePrint{color:rgba(255,255,255,.65); font-size:12px; margin:6px 0 0;}

.uploadBox{border-radius:16px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.04); padding:12px; display:grid; gap:10px; margin-top:10px;}
.uploadHint{color:rgba(255,255,255,.78); font-weight:800; font-size:13px;}
.divider{height:1px; background:rgba(255,255,255,.12); margin:10px 0;}

/* Footer (portal-style) */
.siteFooter{
  position:relative;
  overflow:hidden;
  border-top:1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.18);
  padding:42px 0 112px;
}
.footerBg{
  position:absolute; inset:0;
  background-image: url("/assets/img/footercowboysweb.png");
  background-size: cover;
  background-position: center;
  opacity:.55;
  transform: scale(1.02);
  filter: saturate(1.05) contrast(1.02);
}
.footerOverlay{
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(11,31,58,.78) 0%, rgba(11,31,58,.72) 35%, rgba(11,31,58,.92) 100%);
}
.footerInner{
  position:relative;
  display:grid;
  grid-template-columns: 1.2fr .9fr .9fr .9fr;
  gap:26px;
  align-items:start;
}
.footerCol{display:flex; flex-direction:column; gap:10px;}
.footerColRight{align-items:flex-start;}
.footerLogo{height:44px; width:auto; filter: drop-shadow(0 10px 22px rgba(0,0,0,.25));}
.footerTitle{font-weight:1000; letter-spacing:.14em; font-size:12px; color:rgba(255,255,255,.78);}
.footerText{color:rgba(255,255,255,.78); font-weight:800; font-size:13px; line-height:1.35;}
.footerText a{color:#fff; text-decoration:none; border-bottom:1px solid rgba(255,255,255,.22)}
.footerText a:hover{border-bottom-color:rgba(255,255,255,.55)}
.footerLinks{display:flex; flex-direction:column; gap:8px;}
.footerLinks a{color:rgba(255,255,255,.84); text-decoration:none; font-weight:1000;}
.footerLinks a:hover{color:#fff; text-decoration:underline;}
.footerBadges{display:flex; gap:10px; flex-wrap:wrap; align-items:center;}
.footerBadgeImg{height:44px; width:auto; opacity:.98; filter: drop-shadow(0 10px 18px rgba(0,0,0,.22));}
.footerPills{display:flex; flex-direction:column; gap:8px;}
.footerPill{padding:10px 12px; border-radius:14px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.06); font-weight:1000; color:rgba(255,255,255,.88)}
.footerCta{
  display:inline-flex; justify-content:center; align-items:center;
  padding:12px 14px;
  border-radius:16px;
  background: var(--red);
  color:#fff;
  text-decoration:none;
  font-weight:1000;
  border:1px solid rgba(0,0,0,.18);
}
.footerCta.ghost{background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16)}
.footerCta:hover{filter:brightness(1.03)}
.footerBottom{
  position:relative;
  margin-top:26px;
  padding:14px 16px;
  text-align:center;
  color:rgba(255,255,255,.75);
  font-weight:900;
  border-top:1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.12);
}

/* Sticky mobile bar */
.mobileBar{
  position:fixed; left:0; right:0; bottom:0;
  display:none;
  background:rgba(11,31,58,.90);
  border-top:1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(14px);
  padding:10px 12px;
  gap:10px;
  z-index:9992;
}
.mbBtn{
  flex:1; text-align:center; text-decoration:none;
  padding:12px 10px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  color:#fff;
  font-weight:1000;
}
.mbPrimary{background:var(--red); border-color:rgba(0,0,0,.15);}

/* Reveal animations */
.reveal{opacity:1; transform:none;}
.reveal.in{opacity:1; transform:none;}

@media (max-width: 980px){
  .navLinks{display:none;}
  .hamburger{display:flex;}
  .heroGrid{grid-template-columns:1fr;}
  .tiles{grid-template-columns:1fr;}
  .timeline{grid-template-columns:1fr;}
  .twoCol{grid-template-columns:1fr;}
  .mobileBar{display:flex;}
  .footerInner{grid-template-columns:1fr 1fr;}
}
@media (max-width:720px){
  .trustLink{ margin-left:0; width:100%; text-align:center;}
  .footerInner{grid-template-columns:1fr;}
  .footerBadgeImg{height:52px;}
}
@media (max-width:560px){
  .row2{grid-template-columns:1fr;}
}


/* --- V3 "alive" polish (A: subtle, Apple-glass) --- */

/* Ambient gradient drift (very subtle) */
body::before{
  content:"";
  position:fixed;
  inset:-25%;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(520px 340px at 18% 18%, rgba(230,57,70,.16), transparent 62%),
    radial-gradient(520px 340px at 82% 22%, rgba(255,255,255,.10), transparent 62%),
    radial-gradient(520px 340px at 70% 78%, rgba(230,57,70,.10), transparent 62%),
    radial-gradient(520px 340px at 22% 84%, rgba(255,255,255,.06), transparent 62%);
  filter: blur(58px) saturate(1.05);
  opacity:.55;
  transform: translate3d(0,0,0);
  animation: ambientDrift 28s ease-in-out infinite alternate;
}
@keyframes ambientDrift{
  0%{ transform: translate3d(-1.5%, -1.0%, 0) scale(1.02); }
  50%{ transform: translate3d(1.2%, -0.6%, 0) scale(1.03); }
  100%{ transform: translate3d(0.8%, 1.2%, 0) scale(1.02); }
}

/* Scroll reveal */
.reveal{opacity:1; transform:none;}
.reveal.in{
  opacity:1;
  transform:none;
  filter:none;
}

/* Micro-interactions (hover/tap) */
.tile, .card, .proofCard, .stepCard, .mediaCard, .micro{
  transition: transform .14s ease, background .14s ease, border-color .14s ease, box-shadow .14s ease;
}
.tile:hover, .card:hover, .proofCard:hover, .stepCard:hover, .mediaCard:hover, .micro:hover{
  transform: translateY(-2px);
  border-color: rgba(255,255,255,.18);
  box-shadow: 0 12px 44px rgba(0,0,0,.18);
}
.tile:active, .card:active, .proofCard:active, .stepCard:active, .mediaCard:active{
  transform: translateY(0) scale(.99);
}

/* Subtle "sheen" sweep for primary CTA (triggered via JS) */
.btnPrimary{
  position:relative;
  overflow:hidden;
}
.btnPrimary.shimmer::after{
  content:"";
  position:absolute;
  top:-40%;
  left:-60%;
  width:40%;
  height:180%;
  transform: rotate(18deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.35), transparent);
  animation: ctaShimmer .8s ease-in-out 1;
}
@keyframes ctaShimmer{
  from{ left:-60%; opacity:0; }
  15%{ opacity:1; }
  to{ left:130%; opacity:0; }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  body::before{ animation:none !important; }
  .reveal{opacity:1; transform:none;}
  .tile, .card, .proofCard, .stepCard, .mediaCard, .micro{ transition:none !important; }
  .btnPrimary.shimmer::after{ animation:none !important; }
}



/* Tighten spacing between hero and Services */
#hero{ padding-bottom: 40px; }
#services{ padding-top: 54px; }
@media (max-width: 768px){
  #hero{ padding-bottom: 28px; }
  #services{ padding-top: 40px; }
}



/* Media card overlay polish */
.mediaCard{ position: relative; overflow: hidden; }
.mediaCard video{ display:block; width:100%; height:auto; }
.videoOverlay{
  position:absolute; inset:0;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding: 16px;
  gap: 8px;
  pointer-events:none;
  background: linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,.55) 100%);
}
.videoTitle{
  font-weight: 800;
  letter-spacing: .2px;
  text-shadow: 0 10px 30px rgba(0,0,0,.55);
}
.openPill{
  align-self:flex-start;
  background: rgba(10,25,45,.55);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(10px);
}



/* Footer polish: badges + social consistent and premium */
.footerBadges{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}
.footerBadgeImg{
  height: 44px;
  width:auto;
  opacity:.92;
  transition: transform .18s ease, opacity .18s ease, filter .18s ease;
}
.footerBadgeImg:hover{
  transform: translateY(-1px);
  opacity:1;
  filter: drop-shadow(0 0 12px rgba(255,255,255,.10)) drop-shadow(0 0 14px rgba(230,57,70,.18));
}

.footerSocial{ display:flex; flex-direction:column; gap:10px; }
.socialIcons{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.socialIcons a{
  width: 40px; height: 40px;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.socialIcons a:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.18);
  box-shadow: 0 0 0 1px rgba(230,57,70,.16), 0 12px 30px rgba(0,0,0,.28);
}
.socialIcons img{ width: 22px; height: 22px; display:block; filter: saturate(1.1); opacity:.92; }

@media (max-width: 768px){
  .footerBadgeImg{ height: 38px; }
  .socialIcons a{ width: 32px; height: 32px; }
}




/* Footer background image (portal-style) */
.siteFooter .footerBg{
  background-image: url("/assets/img/footercowboysweb.png");
  opacity: .22;
}



.placeholderNote{ opacity:.55; font-style: italic; }



/* Header logo size tweak (small increase) */
.brand__logo{
  height: clamp(28px, 2.2vw, 38px);
  width: auto;
}
@media (max-width: 768px){
  .brand__logo{ height: 32px; }
}




/* Footer alignment + spacing */
.siteFooter .footerInner{
  max-width: 1200px;
  margin: 0 auto;
  padding: 44px 18px 26px;
  display: grid;
  grid-template-columns: 1.25fr .9fr .8fr .95fr;
  gap: 26px;
  align-items: start;
}
@media (max-width: 980px){
  .siteFooter .footerInner{
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 640px){
  .siteFooter .footerInner{
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 34px 16px 22px;
  }
}
.siteFooter .footerBottom{
  padding: 14px 18px 22px;
}




/* Open 24/7 pill bottom-right in media overlay */
.videoOverlay{ position:absolute; inset:0; }
.openPill{
  position:absolute;
  right: 14px;
  bottom: 14px;
  pointer-events:none;
}
@media (max-width: 768px){
  .openPill{ right: 12px; bottom: 12px; }
}




}



/* Partner logos row: grid for clean spacing (auto wraps to 2 rows) */
.partnerRow{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
  gap: 16px 18px;
  padding: 14px 10px 0;
  align-items: center;
  justify-items: center;
  max-width: 100%;
}
.partnerRow img{
  height: clamp(32px, 2.8vw, 52px);
  width: auto;
  opacity: .92;
  transition: transform .18s ease, opacity .18s ease, filter .18s ease;
}
.partnerRow img:hover{
  transform: translateY(-1px) scale(1.02);
  opacity: 1;
  filter: saturate(1.2) drop-shadow(0 0 12px rgba(255,255,255,.10)) drop-shadow(0 0 14px rgba(230,57,70,.18));
}
@media (max-width: 768px){
  .partnerRow{
    grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
    gap: 16px 18px;
    padding: 12px 8px 0;
  }
}




/* Footer logo robust clamp (covers different logo filenames) */
.siteFooter img.footerLogo,
.siteFooter .footerInner img.footerLogo,
.siteFooter img[src*="Cowboys_Logo"],
.siteFooter img[src*="cowboyslogo"],
.siteFooter img[src*="Cowboys_Logo.png"],
.siteFooter img[src*="cowboyslogo.png"]{
  width: auto !important;
  height: auto !important;
  max-width: clamp(180px, 22vw, 280px) !important;
  max-height: 64px !important;
  object-fit: contain !important;
  display: block;
}
@media (max-width: 768px){
  .siteFooter img.footerLogo,
  .siteFooter img[src*="Cowboys_Logo"],
  .siteFooter img[src*="cowboyslogo"]{
    max-width: 240px !important;
    max-height: 56px !important;
  }
}




/* === Hero media spacing fixes (partner logos + remove empty gap) === */
.heroGrid{ align-items: start !important; } /* stop stretching right card taller than its content */
.heroMedia{ align-self: start; }           /* ensure media card collapses to content */

/* Partner logos: force even spacing across the full row */
.heroMedia .partnerRow{
  width: 100%;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px 18px;
  padding: 14px 12px 4px;
}
.heroMedia .partnerRow img{
  height: clamp(34px, 3vw, 56px);
  justify-self: center;
}
@media (max-width: 700px){
  .heroMedia .partnerRow{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 14px;
    padding: 12px 10px 0;
  }
  .heroMedia .partnerRow img{
    height: 44px;
  }
}




/* Partner strip polish */
.partnerRow{
  margin-top: 10px;
  padding: 12px 14px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 14px 34px rgba(0,0,0,.22);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.partnerRow img{
  margin: 0;
}




/* Hero: force equal column heights */
.heroGrid{
  align-items: stretch;
}
.heroCard,
.heroLeft,
.heroRight{
  height: 100%;
}
.heroLeft,
.heroRight{
  display: flex;
  flex-direction: column;
}
.heroRight .mediaWrap,
.heroRight .heroMedia,
.heroRight .heroVideo,
.heroRight .videoWrap{
  flex: 1 1 auto;
}
.heroRight .partnerRow{
  flex: 0 0 auto;
}


/* Partner logos: better horizontal spacing + consistent sizing */
.partnerRow{
  grid-template-columns: repeat(4, 1fr);
  column-gap: 22px;
  row-gap: 12px;
  padding-left: 18px;
  padding-right: 18px;
}
.partnerRow img{
  height: clamp(34px, 3.1vw, 56px);
  max-width: 120px;
}
@media (max-width: 768px){
  .partnerRow{
    grid-template-columns: repeat(2, 1fr);
    column-gap: 18px;
    row-gap: 10px;
    padding-left: 14px;
    padding-right: 14px;
  }
  .partnerRow img{
    max-width: 140px;
  }
}




/* =========================
   HARD OVERRIDES (hero equal height + partner spacing)
   These are intentionally broad to catch class-name drift.
   ========================= */

/* 1) Hero two-card layout: force equal height */
.heroGrid,
.hero__grid,
.hero-grid,
.hero .grid2,
.hero .gridTwo,
.section.hero .grid2,
#hero .grid2{
  align-items: stretch !important;
}

/* If the hero container is flex */
.heroGrid,
.hero__grid,
.hero-grid,
.hero .grid2,
.section.hero .grid2,
#hero .grid2{
  display: flex;
  gap: 28px !important;
}
@supports (display: grid){
  .heroGrid,
  .hero__grid,
  .hero-grid,
  .hero .grid2,
  .section.hero .grid2,
  #hero .grid2{
    display: grid;
    grid-template-columns: 1fr 1fr !important;
    gap: 28px !important;
  }
}

/* Make the direct children stretch to the tallest one */
.heroGrid > *,
.hero__grid > *,
.hero-grid > *,
.hero .grid2 > *,
.section.hero .grid2 > *,
#hero .grid2 > *{
  height: auto;
  align-self: stretch !important;
}

/* Make "card" wrappers fill column height (covers multiple names) */
.heroCard,
.heroLeft,
.heroRight,
.hero .card,
.hero .panel,
.hero .heroCard,
.hero .heroLeft,
.hero .heroRight{
  height: 100% !important;
}

/* If the right card contains media + partner strip, let media flex so card fills height */
.heroRight,
.hero .heroRight,
.hero .mediaCard,
.hero .videoCard{
  display: flex !important;
  flex-direction: column !important;
}
.heroRight video,
.hero .heroRight video,
.heroRight .video,
.heroRight .videoWrap,
.heroRight .media,
.heroRight .mediaWrap,
.heroRight .heroVideo,
.heroRight .heroMedia,
.hero .heroRight .videoWrap,
.hero .heroRight .mediaWrap{
  flex: 1 1 auto !important;
  min-height: 0 !important;
}
.heroRight .partnerRow,
.heroRight .partnerStrip,
.heroRight .partnerLogos,
.hero .heroRight .partnerRow,
.hero .heroRight .partnerStrip,
.hero .heroRight .partnerLogos{
  flex: 0 0 auto !important;
}

/* 2) Partner logos: force horizontal spacing */
.partnerRow,
.partnerStrip,
.partnerLogos{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  justify-items: center !important;
  align-items: center !important;
  column-gap: 22px !important;
  row-gap: 12px !important;
  padding: 12px 18px !important;
}
.partnerRow img,
.partnerStrip img,
.partnerLogos img{
  height: clamp(34px, 3.1vw, 56px) !important;
  width: auto !important;
  max-width: 140px !important;
  object-fit: contain !important;
  opacity: .95;
}

/* Mobile: 2 columns */
@media (max-width: 768px){
  .heroGrid,
  .hero__grid,
  .hero-grid,
  .hero .grid2,
  .section.hero .grid2,
  #hero .grid2{
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }
  .partnerRow,
  .partnerStrip,
  .partnerLogos{
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    column-gap: 18px !important;
    row-gap: 10px !important;
    padding: 10px 14px !important;
  }
}




/* =========================
   MOBILE: show video first + keep it visible
   ========================= */
@media (max-width: 768px){
  /* Make sure the hero stack is predictable */
  .heroGrid,
  .hero__grid,
  .hero-grid,
  .hero .grid2,
  .section.hero .grid2,
  #hero .grid2{
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
  }

  /* Put the media/video card FIRST on mobile */
  .heroRight,
  .hero .heroRight,
  .hero .mediaCard,
  .hero .videoCard{
    order: 1 !important;
  }
  .heroLeft,
  .hero .heroLeft{
    order: 2 !important;
  }

  /* Ensure the video area actually has height on mobile (no collapse) */
  .heroRight video,
  .hero .heroRight video,
  .heroRight .heroVideo,
  .heroRight .heroMedia,
  .heroRight .videoWrap,
  .heroRight .mediaWrap{
    width: 100% !important;
    height: auto !important;
    min-height: 220px !important;
    aspect-ratio: 16 / 9;
    border-radius: 18px !important;
    overflow: hidden;
  }

  /* Partner strip under video: keep tight + readable */
  .partnerRow,
  .partnerStrip,
  .partnerLogos{
    margin-top: 12px !important;
  }

  /* Optional: reduce heavy padding inside hero cards on small screens */
  .heroCard,
  .heroLeft,
  .heroRight,
  .hero .card,
  .hero .panel{
    padding: 18px !important;
  }
}




/* =========================
   Header: make "Customer Portal" slightly smaller (subtle)
   ========================= */
.header a[href*="portal"],
.header .nav a[href*="portal"],
.header .headerCta a[href*="portal"],
.header .toplink[href*="portal"],
.header .portalLink{
  font-size: 0.92em !important; /* just a touch smaller */
  letter-spacing: .01em;
}

/* If it's rendered as a pill/button in the header */
.header a[href*="portal"].btn,
.header .nav a[href*="portal"].btn,
.header a[href*="portal"].pill,
.header a[href*="portal"].cta{
  padding: 10px 14px !important;
}

/* =========================
   Polish pack: micro-interactions + cleaner focus
   ========================= */
:root{
  --glowBlue: rgba(90, 170, 255, .22);
  --glowRed: rgba(230, 57, 70, .28);
  --glowGreen: rgba(24, 215, 142, .24);
}

/* Nav links feel more premium */
.header .nav a{
  position: relative;
  transition: transform .18s ease, opacity .18s ease;
}
.header .nav a::after{
  content:"";
  position:absolute;
  left: 10%;
  right: 10%;
  bottom: -8px;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.35), transparent);
  opacity: 0;
  transform: translateY(4px);
  transition: opacity .18s ease, transform .18s ease;
}
.header .nav a:hover{
  transform: translateY(-1px);
}
.header .nav a:hover::after,
.header .nav a:focus-visible::after{
  opacity: 1;
  transform: translateY(0);
}

/* Buttons lift slightly on hover */
.btn, .pill, .cta, button{
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.btn:hover, .pill:hover, .cta:hover, button:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 30px rgba(0,0,0,.22);
}
.btn:active, .pill:active, .cta:active, button:active{
  transform: translateY(0px);
  box-shadow: 0 6px 16px rgba(0,0,0,.18);
}

/* Better keyboard focus (premium + accessible) */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px rgba(255,255,255,.14), 0 0 0 6px var(--glowBlue);
  border-radius: 12px;
}

/* Cards: subtle hover sheen (doesn't feel 'alive' but feels polished) */
.card, .panel, .heroCard, .heroLeft, .heroRight{
  position: relative;
}
.card::before, .panel::before, .heroCard::before, .heroLeft::before, .heroRight::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius: inherit;
  background: radial-gradient(1200px 280px at 20% 0%, rgba(255,255,255,.06), transparent 55%);
  opacity: 0;
  transition: opacity .22s ease;
  pointer-events:none;
}
.card:hover::before, .panel:hover::before, .heroCard:hover::before, .heroLeft:hover::before, .heroRight:hover::before{
  opacity: 1;
}

/* Inputs: slightly clearer depth */
input, select, textarea{
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}






/* --- HARD SAFETY CLAMPS (prevents giant icons / overlays) --- */

/* Never let any footer images blow up */
.siteFooter img{max-width:180px;height:auto;}

/* Social icons (if present anywhere in footer) */
.siteFooter .socialPill img,
.siteFooter .followPills img,
.siteFooter .footerFollow img,
.siteFooter .footerSocial img{
  width:34px;
  height:34px;
  max-width:34px;
  max-height:34px;
  object-fit:contain;
}

/* Partner row images stay consistent */
.partnerRow img{
  max-height:34px;
  width:auto;
  object-fit:contain;
}

/* Hard-disable the mobile drawer on desktop */
@media (min-width: 981px){
  .hamburger{display:none !important;}
  .menuOverlay{display:none !important;}
  .mobileMenu{display:none !important;}
}