/*
   FSDG site-specific styles for template-native pages (root, es/, locations/).
   These are the ONLY site additions on top of the Framex template css
   (bootstrap / slicknav / swiper / all.min / animate / magnific /
   mousecursor / custom.css). Legacy shim css (fsdg-compat.css) is NOT
   linked by these pages.
   Edit rules here, never in custom.css (template-owned).
*/

/* Brand palette (2026-09): aqua accent + navy structural.
   Overrides the template defaults from custom.css :root. */
:root {
    --primary-color: #012136;
    --accent-color: #00B8CD;
    --divider-color: rgba(1, 33, 54, 0.10);
}

/* Navy image scrims — custom.css hardcodes near-black rgba(24,24,24,x)
   gradients, restate them with the navy brand rgb(1,33,54) at the same
   alphas/positions. */
.hero::before {
    background: linear-gradient(90deg, rgba(1, 33, 54, 0.8) 0%, rgba(1, 33, 54, 0.72) 36.01%, transparent 63.02%), linear-gradient(180deg, rgba(1, 33, 54, 0.8) 0%, transparent 18.18%);
}

.project-item-image figure a::before {
    background: linear-gradient(180deg, transparent 39.2%, rgba(1, 33, 54, 0.8) 100%);
}

.intro-video-content-box::before {
    background: linear-gradient(180deg, transparent 50.75%, rgba(1, 33, 54, 0.8) 100%);
}

.contact-us-box::before {
    background: linear-gradient(270deg, transparent -5%, rgba(1, 33, 54, 0.9) 100%);
}

.page-header:before {
    background: linear-gradient(90deg, rgba(1, 33, 54, 0.8) 0%, rgba(1, 33, 54, 0.72) 36.01%, transparent 63.02%), linear-gradient(180deg, rgba(1, 33, 54, 0.8) 0%, transparent 18.18%);
}

.hero-img-slider-metal:before {
    background: linear-gradient(90deg, rgba(1, 33, 54, 0.80) 16.17%, transparent 100%);
}

.cta-box-metal::before {
    background: linear-gradient(90deg, rgba(1, 33, 54, 0.90) 30.93%, transparent 75.22%);
}

.core-features-item-stone.box-2 .core-features-item-image-stone figure::before {
    background: linear-gradient(180deg, transparent 50%, rgba(1, 33, 54, 0.80) 82.5%);
}

.team-item-image-stone figure::before {
    background: linear-gradient(180deg, transparent 50%, rgba(1, 33, 54, 0.80) 90%);
}

.navbar-brand img {
    max-height: 50px;
    width: auto;
}

/* Admin-managed logo spacing. The template pads the header via
   `.navbar { padding: 30px 0 }` (20px below 991px) — the .container only
   adds 15px horizontal, which stays so the logo aligns with page content.
   Neutralize the navbar padding and restated the same defaults on the
   brand anchor, so the inline style emitted from nav.json
   (logo paddingTop/paddingBottom, admin Menu Editor) is the ONLY
   vertical control and overrides these defaults. */
.main-header .navbar {
    padding-top: 0;
    padding-bottom: 0;
}

.navbar-brand {
    padding-top: 30px;
    padding-bottom: 30px;
}

@media only screen and (max-width: 991px) {
    .navbar-brand {
        padding-top: 20px;
        padding-bottom: 20px;
    }
}

/* FontAwesome <i> icons inside template .icon-box (template ships <img> icons) */
.icon-box i {
    color: var(--white-color);
    font-size: 22px;
    position: relative;
    z-index: 1;
}

/* Standalone subscribe section (template expresses newsletter as a footer
   widget; FSDG keeps the pre-footer Mailchimp section) */
.site-subscribe {
    padding: 0 0 120px;
}

.subscribe-form .form-group {
    display: flex;
    gap: 15px;
}

.subscribe-form input {
    flex: 1;
}

/* services grid card text (page-services) */
.service-item-content p {
    margin: 10px 0 0;
}

/* In-content links. custom.css styles anchors per-component only and its
   global `a{}` sets no color, so links inside body copy render browser
   default blue. Template pattern (cf. .footer-links ul li a and
   .section-footer-text p a): inherit text color + accent on hover. */
.service-entry a,
.about-us-content a,
.about-us-body-content a,
.contact-us-info-content a,
.how-it-work-item-content a,
.service-feature-item a,
.section-title-content a,
.section-title p a,
.cta-content-metal p a,
.accordion-body a {
    color: inherit;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: all 0.4s ease-in-out;
}

.service-entry a:hover,
.about-us-content a:hover,
.about-us-body-content a:hover,
.contact-us-info-content a:hover,
.how-it-work-item-content a:hover,
.service-feature-item a:hover,
.section-title-content a:hover,
.section-title p a:hover,
.cta-content-metal p a:hover,
.accordion-body a:hover {
    color: var(--accent-color);
}