/*
Theme Name: Outrank Strategy Child for Divi
Description: Outrank Strategy Child for Divi.
Author: Outrank Strategy
Author URI: https://outrankstrategy.com/
Template: Divi
Version: 5.8.1
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: divi-child
Domain Path: /languages
*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Montserrat:wght@600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap');

/* ==========================================================================
   Global Styles - Gold Coast Permitting brand system
   ========================================================================== */
:root{
    --gcp-deep-navy:#1e3a8a;
    --gcp-primary:#00236f;
    --gcp-bright-gold:#fbbf24;
    --gcp-amber-gold:#d97706;
    --gcp-parchment-white:#f9f7f2;
    --gcp-ink-black:#1a1a1a;
    --gcp-slate-gray:#1e293b;
    --gcp-on-surface:#191c1e;
    --gcp-on-surface-variant:#444651;
}

body{ font-family:'Inter',sans-serif; color:var(--gcp-on-surface); background:var(--gcp-parchment-white); }
body h1,body h2,body h3,body h4,body h5,body h6{ font-family:'Montserrat',sans-serif !important; }
.material-symbols-outlined{
    font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;
    vertical-align:middle;
    line-height:1;
}

/* ==========================================================================
   Typography utilities
   ========================================================================== */
.gcp-eyebrow{ font-family:'Montserrat',sans-serif; font-size:12px; font-weight:800; letter-spacing:.2em; text-transform:uppercase; color:var(--gcp-amber-gold); display:block; margin-bottom:1rem; }
.gcp-navy-text{ color:var(--gcp-deep-navy); }
.gcp-gold-text{ color:var(--gcp-bright-gold); }

/* ==========================================================================
   Section backgrounds / padding / text-on-dark
   Divi's native background_color / background_image / text_text_color /
   custom_padding / custom_css_main_element shortcode attributes do not
   generate CSS for content saved outside the Visual Builder, so all
   section-level styling below is applied via module_class instead.
   ========================================================================== */
.gcp-bg-navy{ background-color:#1e3a8a !important; }
.gcp-bg-slate{ background-color:#1e293b !important; }
.gcp-bg-ink{ background-color:#1a1a1a !important; }
.gcp-bg-surface-low{ background-color:#eceef0 !important; }
.gcp-bg-surface-lower{ background-color:#f2f4f6 !important; }
.gcp-bg-white{ background-color:#ffffff !important; }

.gcp-on-dark, .gcp-on-dark p, .gcp-on-dark h1, .gcp-on-dark h2, .gcp-on-dark h3, .gcp-on-dark h4{ color:#ffffff; }

.gcp-pad-xl{ padding:180px 0 !important; }
.gcp-pad-lg{ padding:120px 0 !important; }
.gcp-pad-md{ padding:100px 0 !important; }
.gcp-pad-sm{ padding:48px 0 !important; }
.gcp-pad-header-hero{ padding:160px 0 100px !important; }
.gcp-pad-footer{ padding:80px 0 48px !important; }
@media (max-width:767px){
    .gcp-pad-xl,.gcp-pad-header-hero{ padding:120px 0 60px !important; }
    .gcp-pad-lg{ padding:80px 0 !important; }
    .gcp-pad-md{ padding:64px 0 !important; }
}

/* ==========================================================================
   Buttons (replace non-functional et_pb_button color/style attributes)
   ========================================================================== */
.gcp-btn{ display:inline-block; padding:20px 40px; font-family:'Montserrat',sans-serif; font-weight:700; font-size:13px; text-transform:uppercase; letter-spacing:1px; text-decoration:none; text-align:center; border:1px solid transparent; transition:all .2s ease; }
.gcp-btn-sm{ padding:14px 28px; font-size:12px; }
.gcp-btn-gold{ background:#fbbf24; color:#1a1a1a !important; }
.gcp-btn-gold:hover{ background:#d97706; }
.gcp-btn-navy{ background:#1e3a8a; color:#ffffff !important; }
.gcp-btn-navy:hover{ background:#1e293b; }
.gcp-btn-outline-light{ background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.4); color:#ffffff !important; }
.gcp-btn-outline-light:hover{ background:rgba(255,255,255,.15); }
.gcp-btn-outline-navy{ background:transparent; border-color:#1e3a8a; color:#1e3a8a !important; }
.gcp-btn-outline-navy:hover{ background:#1e3a8a; color:#ffffff !important; }
.gcp-btn-underline{ padding:0 0 4px; border-bottom:2px solid #fbbf24; color:#1e3a8a !important; }

/* ==========================================================================
   Site header (used inside a Code module, repeated per page)
   ========================================================================== */
.gcp-header{ position:fixed; top:0; left:0; width:100%; z-index:9999; background:rgba(249,247,242,.97); backdrop-filter:blur(8px); border-bottom:1px solid rgba(30,41,59,.15); }
.gcp-header-inner{ max-width:1280px; width:90%; margin:0 auto; display:flex; justify-content:space-between; align-items:center; height:80px; }
.gcp-header-logo{ font-family:'Montserrat',sans-serif; font-weight:800; font-size:22px; color:var(--gcp-deep-navy); text-decoration:none; letter-spacing:-0.02em; }
.gcp-header-nav{ display:flex; align-items:center; gap:2rem; }
.gcp-header-nav a{ font-size:11px; text-transform:uppercase; letter-spacing:.15em; font-weight:700; color:var(--gcp-on-surface-variant); text-decoration:none; position:relative; padding-bottom:4px; transition:color .2s ease; }
.gcp-header-nav a:hover, .gcp-header-nav a.active{ color:var(--gcp-deep-navy); }
.gcp-header-nav a.active::after{ content:''; position:absolute; bottom:-4px; left:0; width:100%; height:2px; background:var(--gcp-bright-gold); }
.gcp-header-cta{ background:var(--gcp-deep-navy); color:#fff; padding:14px 28px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.15em; text-decoration:none; border-left:4px solid transparent; transition:all .2s ease; white-space:nowrap; }
.gcp-header-cta:hover{ border-left-color:var(--gcp-bright-gold); background:var(--gcp-slate-gray); color:#fff; }
.gcp-header-spacer{ height:80px; width:100%; display:block; }
@media (max-width:980px){ .gcp-header-nav{ display:none; } }

/* ==========================================================================
   Blueprint pattern background
   ========================================================================== */
.gcp-blueprint-pattern{ position:absolute; inset:0; pointer-events:none; background-image:radial-gradient(#1e3a8a 0.5px, transparent 0.5px); background-size:24px 24px; opacity:.05; }
.gcp-blueprint-pattern.on-dark{ background-image:radial-gradient(#f9f7f2 0.5px, transparent 0.5px); }

.gcp-bg-hero-home{
    background:linear-gradient(90deg, rgba(30,58,138,.95) 0%, rgba(30,58,138,.55) 100%), url('https://junclaude.hostpro.org/wp-content/uploads/2026/07/home-hero-bg.jpg') !important;
    background-size:cover !important;
    background-position:center !important;
}
.gcp-bg-services-hero{
    background:linear-gradient(90deg, rgba(30,58,138,.92) 0%, rgba(30,58,138,.72) 100%) !important;
}

/* ==========================================================================
   Bento grid / card components (used within Code modules)
   ========================================================================== */
.gcp-bento-grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:24px; }
.gcp-bento-grid > *{ min-width:0; }
.gcp-col-4{ grid-column:span 4; }
.gcp-col-6{ grid-column:span 6; }
.gcp-col-8{ grid-column:span 8; }
.gcp-col-12{ grid-column:span 12; }
@media (max-width:900px){ .gcp-bento-grid > *{ grid-column:span 12 !important; } }

.gcp-card{ background:#fff; border:1px solid rgba(30,41,59,.15); padding:40px; }
.gcp-card-navy{ background:var(--gcp-deep-navy); color:#fff; border-color:var(--gcp-deep-navy); }
.gcp-card-hover{ transition:all .3s cubic-bezier(.4,0,.2,1); }
.gcp-card-hover:hover{ transform:translateY(-4px); border-left:4px solid var(--gcp-bright-gold); }

.gcp-stat{ background:#fff; padding:40px; border:1px solid rgba(30,41,59,.1); box-shadow:0 1px 2px rgba(0,0,0,.04); }
.gcp-stat-number{ font-family:'Montserrat',sans-serif; font-weight:700; font-size:56px; display:block; margin-bottom:.5rem; }

.gcp-pillar{ padding:32px; border:1px solid rgba(255,255,255,.1); background:var(--gcp-deep-navy); color:#fff; height:100%; transition:all .3s ease; }
.gcp-pillar:hover{ border-color:rgba(251,191,36,.5); transform:translateY(-6px); }

.gcp-timeline{ position:relative; display:flex; flex-wrap:wrap; justify-content:space-between; gap:32px; }
.gcp-timeline::before{ content:''; position:absolute; top:40px; left:0; width:100%; height:2px; background:rgba(30,58,138,.1); z-index:0; }
.gcp-timeline-step{ position:relative; z-index:1; flex:1 1 200px; display:flex; flex-direction:column; align-items:center; text-align:center; }
.gcp-timeline-circle{ width:80px; height:80px; border-radius:50%; background:var(--gcp-parchment-white); border:2px solid var(--gcp-deep-navy); color:var(--gcp-deep-navy); display:flex; flex-direction:column; align-items:center; justify-content:center; margin-bottom:1rem; }
.gcp-timeline-circle.is-final{ background:var(--gcp-bright-gold); border-color:var(--gcp-bright-gold); color:var(--gcp-ink-black); }

.gcp-faq-card{ padding:24px; border:1px solid rgba(30,41,59,.1); background:#fff; transition:all .3s ease; }
.gcp-faq-card:hover{ border-color:var(--gcp-bright-gold); }

/* ==========================================================================
   Footer
   ========================================================================== */
.gcp-footer a{ color:rgba(255,255,255,.8); text-decoration:none; }
.gcp-footer a:hover{ color:var(--gcp-bright-gold); }

/* ==========================================================================
   Responsive / Media Queries
   ========================================================================== */
@media only screen and (max-width: 980px) {
    .gcp-bento-grid{ gap:16px; }
}

@media only screen and (max-width: 767px) {
    .gcp-header-inner{ height:64px; }
    .gcp-header-spacer{ height:64px; }
}
