/* ==== Creative masthead video fixes ==== */

/* 1) Kill the default bg image & gradient */
header.masthead {
  background: none !important;           /* removes gradient + image */
  background-image: none !important;     /* belt-and-suspenders */
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
  min-height: 100vh;                     /* full screen */
  padding: 0 !important;                            /* remove big template padding */

  /* Override Creative's default large padding that pushes content down */
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* 2) Video layer fills header */
.masthead .video-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.masthead .video-bg .video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;                     /* key: behave like bg-size: cover */
}

/* 3) Readability overlay + keep content above video */
.masthead .video-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0);
  z-index: 1;
}
.masthead .container {
  position: relative;
  z-index: 2;
}

/* Absolute center block for text */
.masthead .masthead-center{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);  /* dead-center in header */
  width:min(95%, 1000px);
  text-align:center;
  z-index:2;                         /* above video/overlay */
}

/* Optional: tidy heading spacing */
.masthead .masthead-center h1{ margin-top:0; }

/* Brand color */
:root{
  --bs-primary: #D89C60;
  --bs-primary-rgb: 216,156,96;
}

/* Brand button using #D89C60 with readable text */
.btn-brand{
  --bs-btn-bg:#D89C60; --bs-btn-border-color:#D89C60; --bs-btn-color:#1f2937;
  background-color:#D89C60 !important; border-color:#D89C60 !important; color:#fff !important;
}
.btn-brand:hover{ background-color:#C5864A !important; border-color:#C5864A !important; }
.btn-brand:active{ background-color:#B4753D !important; border-color:#B4753D !important; }


/* Outline variant that fills on hover */
.btn-outline-primary{
  --bs-btn-color: #D89C60;
  --bs-btn-border-color: #D89C60;
  --bs-btn-hover-bg: #D89C60;
  --bs-btn-hover-border-color: #D89C60;
  --bs-btn-hover-color: #1f2937;
  --bs-btn-active-bg: #D89C60;
  --bs-btn-active-border-color: #D89C60;
}


/* Brand the Creative divider */
.brand-divider{
  display:block;                
  width:8rem;                /* base length */
  height:.25rem !important;     /* thickness */
/*  margin:1.5rem auto;          centered */  
  background-color:#D89C60 !important;
  border:0 !important;
  opacity:1 !important;
}

/* Grow the line on larger screens (optional) */
@media (min-width:768px){ .brand-divider{ width:10rem; } }
@media (min-width:1200px){ .brand-divider{ width:12rem; } }
