/*
 * brand.css — GetReady To Get Noticed theme.
 * Palette matches the getreadyweb.com landing page and the GetReady logo:
 *   orange #f5821f | blue #1b75bc | blue-light #2e9fe0 | ink #26313f
 * Loaded after style.css; overrides only, keep style.css portable.
 */

:root {
    --gr-orange: #f5821f;
    --gr-orange-light: #ffa14e;
    --gr-blue: #1b75bc;
    --gr-blue-light: #2e9fe0;
    --gr-blue-deep: #14538a;
    --gr-ink: #26313f;
    --gr-mist: #f4f9fd;
}

body {
    color: var(--gr-ink);
}

a {
    color: var(--gr-blue);
}
a:hover {
    color: var(--gr-blue-light);
}

/* --- Header / logo ----------------------------------------------------- */
.top-header {
    background: linear-gradient(180deg, var(--gr-mist) 0%, #ffffff 100%);
}
.site-title img {
    height: 52px;
    width: auto;
}
.site-description {
    color: var(--gr-blue);
    font-weight: 600;
}

/* --- Navbar ------------------------------------------------------------ */
.navbar {
    background-color: #e3f2fc; /* mobile collapsed bar */
}
@media (min-width: 992px) {
    .navbar {
        background-color: var(--gr-blue);
    }
}
.navbar .nav-link {
    color: #fff;
}
.navbar .nav-link:hover {
    color: #d8ecfb;
}

/* --- Mobile menu toggler ----------------------------------------------- */
.navbar-toggler {
    background-color: #e3f2fc;
}
/* hamburger (collapsed) and X (open) icons in brand blue (#1b75bc) */
.nav-header .collapsed .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%231b75bc' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.nav-header .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.707001 0.707001L22.707 22.707' stroke='%231b75bc' stroke-width='2'/%3E%3Cpath d='M22.707 0.707001L0.707001 22.707' stroke='%231b75bc' stroke-width='2'/%3E%3C/svg%3E");
}

/* --- Buttons ----------------------------------------------------------- */
.btn-primary,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    color: #fff;
    border-color: var(--gr-blue-deep);
}
.btn-primary {
    background: linear-gradient(180deg, var(--gr-blue) 0%, var(--gr-blue-light) 100%);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background: linear-gradient(180deg, var(--gr-blue-light) 0%, var(--gr-blue) 100%);
}

/* a.btn (style.css) is more specific than a lone class — match it */
a.btn-outline-primary, .btn-outline-primary {
    color: var(--gr-blue);
    border-color: var(--gr-blue);
}
a.btn-outline-primary:hover, .btn-outline-primary:hover {
    color: #fff;
    background: var(--gr-blue);
}

/* Floating quote CTA — orange so it pops off the blue/white page */
.nav-cta-float .btn-sm-primary {
    color: #fff;
    border-color: #d96f12;
    background: linear-gradient(180deg, var(--gr-orange) 0%, var(--gr-orange-light) 100%);
}
.nav-cta-float .btn-sm-primary:hover,
.nav-cta-float .btn-sm-primary:focus {
    background: linear-gradient(180deg, var(--gr-orange-light) 0%, var(--gr-orange) 100%);
}

/* --- Hero -------------------------------------------------------------- */
/* Gradient fallback when no photo; with images/hero.jpg present, the
   ::before layer tints the photo brand-blue so the white title stays
   readable without hiding the image. */
.banner-hero {
    background-image: linear-gradient(135deg, var(--gr-blue-deep) 0%, var(--gr-blue) 55%, var(--gr-blue-light) 100%);
    background-position: center 32%;
    /* Hero height & title position: top padding pushes the title down,
       bottom padding sets space below it. Tweak these two numbers. */
    padding: 170px 0 60px;
    position: relative;
}
.banner-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg,
        rgba(20, 83, 138, 0.72) 0%,
        rgba(27, 117, 188, 0.55) 55%,
        rgba(46, 159, 224, 0.40) 100%);
}
.banner-hero .container {
    position: relative;
    z-index: 1;
}
.banner-hero .banner-title {
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.45);
}

/* --- Footer ------------------------------------------------------------ */
.bg-primary {
    background-color: var(--gr-blue-deep) !important;
}
.footer, .footer a {
    color: #fff;
}
.footer a:hover {
    color: #d8ecfb;
}

/* --- Home service cards (base look in style.css; brand accents here) --- */
.service-card {
    box-shadow: 0 14px 40px -14px rgba(27, 117, 188, 0.35);
    border-top-color: var(--gr-orange);
}
.service-card h3 {
    color: var(--gr-blue);
}

/* --- Sidebar card (matches landing-page card look) --------------------- */
.sidebar .sidebar-cta {
    background: #fff;
    border-radius: 14px;
    padding: 28px 22px;
    box-shadow: 0 14px 40px -14px rgba(27, 117, 188, 0.35);
}
.sidebar .sidebar-cta h3 {
    color: var(--gr-blue);
}
