/* -------------------------------------------------------------------
   Brand Color Palette
   -------------------------------------------------------------------
   • Orange Accent:    #d3732d
   • Cream Background: #faf8e5
   • Dark Primary:     #001324
   • Light Blue:       #a7dde7
*/

:root {
  --brand-orange:   #d3732d;
  --brand-cream:    #faf8e5;
  --brand-dark:     #001324;
  --brand-light:    #faf8e7;
  --brand-lightblue:#a7dde7;
}

/* -------------------------------------------------------------------
   Base Overrides
   ------------------------------------------------------------------- */
body {
  background-color: var(--brand-cream);
  color: var(--brand-dark);
  font-family: Arial, Helvetica, sans-serif;
}

/* -------------------------------------------------------------------
   Navbar
   ------------------------------------------------------------------- */
.navbar {
  background-color: var(--brand-dark) !important;
}

.navbar-brand span,
.navbar-light .navbar-nav .nav-link {
  color: var(--brand-cream) !important;
}

.navbar-toggler {
  border-color: var(--brand-lightblue);
}

.navbar-toggler-icon {
  background-image: url('data:image/svg+xml;charset=utf8,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30"%3E%3Cpath stroke="%23faf8e5" stroke-width="2" stroke-linecap="round" stroke-miterlimit="10" d="M4 7h22M4 15h22M4 23h22"/%3E%3C/svg%3E');
}


/* Nav link hover/active */
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
  color: var(--brand-orange) !important;
}

/* -------------------------------------------------------------------
   Buttons
   ------------------------------------------------------------------- */
.btn-primary {
  background-color: var(--brand-orange);
  border: 1px solid var(--brand-orange);
  color: var(--brand-cream);
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: darken(var(--brand-orange), 5%);
  border-color: darken(var(--brand-orange), 8%);
}

/* Secondary “light” button on dark backgrounds */
.btn-light {
  background-color: var(--brand-cream);
  color: var(--brand-dark);
}


/* Hero Section with Background Image */
.hero-section {
  position: relative;
  background: url('images/doublea-logo.png') center center / cover no-repeat;
  height: 80vh;
  padding-top: 5rem;
  padding-bottom: 5rem;
}

.hero-overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: rgba(0, 6, 11, 0.9); /* transparency adjuster*/
  z-index: 1;
}


.hero-section .container {
  z-index: 2;
}

.hero-section h1,
.hero-section p,
.hero-section a {
  color: #faf8e5; 
}





/* -------------------------------------------------------------------
   Hero Section
   ------------------------------------------------------------------- */
#hero {
  background-color: var(--brand-dark);
  color: var(--brand-cream);
}

/* -------------------------------------------------------------------
   Cards
   ------------------------------------------------------------------- */
.card {
  border: none;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.card-title {
  color: var(--brand-dark);
}

.card-text {
  color: #444;
}

/* -------------------------------------------------------------------
   Testimonials Blockquote
   ------------------------------------------------------------------- */
blockquote {
  border-left: 4px solid var(--brand-orange);
  padding-left: 1rem;
  color: #333;
}

/* -------------------------------------------------------------------
   Section Backgrounds
   ------------------------------------------------------------------- */
section#services {
  background-color: var(--brand-cream);
}

section#about {
  background-color: #fff;
}

section#testimonials {
  background-color: var(--brand-lightblue);
  color: var(--brand-dark);
}

/* Testimonials cards */
#testimonials .card {
  background-color: var(--brand-cream);
}

/* -------------------------------------------------------------------
   Contact Section
   ------------------------------------------------------------------- */
#contact {
    background-color: #fdfae7 !important;
    color: var(--brand-dark);
}
  
  /* Ensure form labels are still legible on the lighter background */
#contact .form-label {
    color: var(--brand-dark);
}

#contact .form-control {
  background-color: #fff;
  border: 1px solid #ccc;
}

/* Submit button */
#contact button {
  background-color: var(--brand-orange);
  border: none;
  color: var(--brand-cream);
}

/* -------------------------------------------------------------------
   Footer
   ------------------------------------------------------------------- */


footer a {
  color: var(--brand-lightblue);
}

footer a:hover {
  color: var(--brand-orange);
}
/* styles.css */

/* Add a bit of extra space above the “built by” line */
.footer-credit {
  margin-top: 0.5rem;
  font-size: 0.85rem; /* slightly smaller text */
  opacity: 0.8;       /* soften it just a touch */
}

