/* ============================================================
   Finance Guide Connect - financeguideconnect.com
   Custom Styles (Bootstrap 5 used for grid/layout)
   Palette: Navy #0A1931 | Teal #00C2A8 | Gold #FFC947
            Coral #FF6B6B | Violet #6C5CE7 | Light #F6F8FF
   ============================================================ */
:root{
  --navy:#0A1931;
  --navy-2:#142952;
  --teal:#00C2A8;
  --teal-dark:#009e89;
  --gold:#FFC947;
  --gold-dark:#e0a92e;
  --coral:#FF6B6B;
  --violet:#6C5CE7;
  --light:#F6F8FF;
  --muted:#5d6b8a;
  --radius:18px;
  --shadow:0 18px 45px rgba(10,25,49,.12);
  --shadow-sm:0 8px 24px rgba(10,25,49,.10);
}
*{scroll-behavior:smooth}
body{font-family:'Segoe UI',system-ui,-apple-system,Roboto,'Helvetica Neue',Arial,sans-serif;color:#1e2a44;background:#fff;overflow-x:hidden}
h1,h2,h3,h4,h5{font-weight:800;letter-spacing:-.5px;color:var(--navy)}
.section-pad{padding:84px 0}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:.8rem;font-weight:800;letter-spacing:2px;text-transform:uppercase;padding:8px 16px;border-radius:100px;margin-bottom:14px}
.eyebrow.teal{background:rgba(0,194,168,.14);color:var(--teal-dark)}
.eyebrow.gold{background:rgba(255,201,71,.22);color:#8a6a12}
.eyebrow.white{background:rgba(255,255,255,.18);color:#fff}
.eyebrow.violet{background:rgba(108,92,231,.14);color:var(--violet)}
.section-title{font-size:clamp(1.7rem,3.4vw,2.6rem);margin-bottom:12px}
.section-sub{color:var(--muted);font-size:1.06rem;max-width:680px}
.btn{border-radius:100px;font-weight:700;padding:12px 28px;transition:.25s}
.btn-teal{background:var(--teal);color:#fff;border:none}
.btn-teal:hover{background:var(--teal-dark);color:#fff;transform:translateY(-2px);box-shadow:0 12px 26px rgba(0,194,168,.35)}
.btn-gold{background:var(--gold);color:var(--navy);border:none}
.btn-gold:hover{background:var(--gold-dark);color:#fff;transform:translateY(-2px)}
.btn-navy{background:var(--navy);color:#fff;border:none}
.btn-navy:hover{background:var(--navy-2);color:var(--gold);transform:translateY(-2px)}
.btn-outline-light{border:2px solid rgba(255,255,255,.6);color:#fff}
.btn-outline-light:hover{background:#fff;color:var(--navy)}
.btn-coral{background:var(--coral);color:#fff;border:none}
.btn-coral:hover{background:#e55555;color:#fff;transform:translateY(-2px)}

/* ---------- Topbar ---------- */
.topbar{background:var(--navy);color:#dbe4ff;font-size:.86rem;padding:9px 0}
.topbar a{color:#fff;text-decoration:none}
.topbar a:hover{color:var(--gold)}
.topbar .dot{opacity:.35;margin:0 10px}

/* ---------- Navbar ---------- */
.navbar{padding:14px 0;background:#fff!important;box-shadow:0 6px 24px rgba(10,25,49,.07);position:sticky;top:0;z-index:1030}
.brand-logo{width:46px;height:46px;border-radius:14px;background:linear-gradient(135deg,var(--navy),var(--violet));display:flex;align-items:center;justify-content:center;color:var(--gold);font-size:1.4rem;font-weight:900}
.brand-name{line-height:1;font-size:1.18rem;font-weight:900;color:var(--navy)}
.brand-name span{color:var(--teal)}
.brand-tag{font-size:.7rem;letter-spacing:2.5px;text-transform:uppercase;color:var(--muted);font-weight:700}
.navbar-nav .nav-link{font-weight:700;color:var(--navy);margin:0 4px;border-radius:100px;padding:9px 16px!important;font-size:.95rem}
.navbar-nav .nav-link:hover,.navbar-nav .nav-link.active{background:var(--light);color:var(--teal-dark)}

/* ---------- Hero ---------- */
.hero{background:radial-gradient(1000px 500px at 85% 10%,rgba(0,194,168,.35),transparent 60%),radial-gradient(700px 420px at 10% 90%,rgba(255,201,71,.25),transparent 60%),linear-gradient(120deg,#0A1931 0%,#142952 55%,#1d3a7a 100%);color:#fff;padding:90px 0 70px;position:relative;overflow:hidden}
.hero h1{color:#fff;font-size:clamp(2.1rem,4.6vw,3.6rem);line-height:1.08}
.hero h1 .hl-teal{color:var(--teal)}
.hero h1 .hl-gold{color:var(--gold)}
.hero p.lead{color:#cdd8f5;font-size:1.12rem}
.hero-badges .badge-pill{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:100px;padding:9px 16px;font-size:.85rem;font-weight:600;backdrop-filter:blur(6px)}
.hero-card{background:#fff;border-radius:22px;box-shadow:0 30px 70px rgba(0,0,0,.35);overflow:hidden;color:var(--navy)}
.hero-card img{height:230px;object-fit:cover;width:100%}
.hero-float{position:absolute;border-radius:18px;padding:12px 18px;font-weight:800;box-shadow:var(--shadow);animation:float 4s ease-in-out infinite}
.float-1{background:var(--gold);color:var(--navy);top:18%;right:4%}
.float-2{background:var(--teal);color:#fff;bottom:14%;left:2%;animation-delay:1.2s}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.hero-stats{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:16px;backdrop-filter:blur(8px)}

/* ---------- Stats strip ---------- */
.stats-strip{background:linear-gradient(90deg,var(--gold),#ffdf8e);padding:26px 0}
.stat-num{font-size:2rem;font-weight:900;color:var(--navy)}
.stat-label{font-weight:700;color:#4a3d08;font-size:.9rem;text-transform:uppercase;letter-spacing:1px}

/* ---------- Service cards ---------- */
.service-card{border:none;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);transition:.3s;height:100%;background:#fff}
.service-card:hover{transform:translateY(-10px);box-shadow:var(--shadow)}
.service-card .img-wrap{position:relative;height:210px;overflow:hidden}
.service-card .img-wrap img{width:100%;height:100%;object-fit:cover;transition:.5s}
.service-card:hover .img-wrap img{transform:scale(1.08)}
.service-card .img-wrap .tag{position:absolute;top:14px;left:14px;border-radius:100px;padding:6px 14px;font-size:.75rem;font-weight:800;color:#fff}
.tag-1{background:var(--teal)} .tag-2{background:var(--violet)} .tag-3{background:var(--coral)}
.tag-4{background:var(--gold);color:var(--navy)!important} .tag-5{background:#0984e3} .tag-6{background:#e17055}
.service-card .card-body{padding:26px}
.service-icon{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;color:#fff;margin-top:-52px;position:relative;box-shadow:var(--shadow-sm)}

/* ---------- Why choose ---------- */
.why-section{background:linear-gradient(135deg,#00C2A8 0%,#0A1931 85%);color:#fff}
.why-section h2{color:#fff}
.why-section .section-sub{color:#d8fff8}
.why-card{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:var(--radius);padding:28px;height:100%;backdrop-filter:blur(10px);transition:.3s}
.why-card:hover{background:#fff;color:var(--navy);transform:translateY(-6px)}
.why-card:hover p{color:var(--muted)}
.why-card h5{color:#fff}
.why-card:hover h5{color:var(--navy)}
.why-card .w-icon{width:56px;height:56px;border-radius:16px;background:var(--gold);color:var(--navy);display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:16px}

/* ---------- Steps ---------- */
.steps-section{background:var(--light)}
.step-card{background:#fff;border-radius:var(--radius);padding:30px;height:100%;box-shadow:var(--shadow-sm);position:relative;border-top:6px solid var(--teal);transition:.3s}
.step-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.step-card.s2{border-color:var(--violet)} .step-card.s3{border-color:var(--gold)} .step-card.s4{border-color:var(--coral)}
.step-num{width:52px;height:52px;border-radius:100px;background:var(--navy);color:var(--gold);font-weight:900;font-size:1.3rem;display:flex;align-items:center;justify-content:center;margin-bottom:16px}

/* ---------- Testimonials ---------- */
.testi-section{background:linear-gradient(180deg,#FFF6DE,#fff)}
.testi-card{background:#fff;border-radius:var(--radius);padding:30px;height:100%;box-shadow:var(--shadow-sm);border:1px solid #f0e4c3;position:relative;transition:.3s}
.testi-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.testi-card .quote{font-size:2.6rem;color:var(--gold);line-height:1;font-family:Georgia,serif}
.testi-stars{color:#f5a623;font-size:1rem;letter-spacing:2px}
.testi-name{font-weight:900;color:var(--navy);margin-top:14px;display:flex;align-items:center;gap:10px}
.testi-avatar{width:46px;height:46px;border-radius:100px;display:flex;align-items:center;justify-content:center;font-weight:900;color:#fff;font-size:1.1rem}

/* ---------- Blog cards ---------- */
.blog-card{border:none;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);height:100%;transition:.3s;background:#fff}
.blog-card:hover{transform:translateY(-8px);box-shadow:var(--shadow)}
.blog-card img{height:220px;object-fit:cover;width:100%}
.blog-card .card-body{padding:26px}

/* ---------- FAQ ---------- */
.faq-section{background:linear-gradient(135deg,#6C5CE7,#0A1931);color:#fff}
.faq-section h2{color:#fff}
.accordion-item{border-radius:14px!important;overflow:hidden;border:none;margin-bottom:12px}
.accordion-button{font-weight:800;color:var(--navy)}
.accordion-button:not(.collapsed){background:var(--gold);color:var(--navy)}

/* ---------- CTA ---------- */
.cta-band{background:radial-gradient(600px 300px at 90% 20%,rgba(255,201,71,.4),transparent 60%),var(--navy);border-radius:26px;padding:56px;color:#fff;position:relative;overflow:hidden}
.cta-band h2{color:#fff}

/* ---------- Page hero ---------- */
.page-hero{padding:74px 0;color:#fff;position:relative;overflow:hidden}
.page-hero h1{color:#fff;font-size:clamp(2rem,4vw,3rem)}
.page-hero p{color:rgba(255,255,255,.85);font-size:1.08rem}
.ph-about{background:linear-gradient(120deg,#0A1931,#6C5CE7)}
.ph-services{background:linear-gradient(120deg,#009e89,#0A1931)}
.ph-blog{background:linear-gradient(120deg,#e17055,#6C5CE7)}
.ph-contact{background:linear-gradient(120deg,#0984e3,#0A1931)}
.ph-legal{background:linear-gradient(120deg,#2d3436,#0A1931)}
.ph-sub{background:linear-gradient(120deg,#00C2A8,#6C5CE7)}
.breadcrumb-custom{background:rgba(255,255,255,.15);display:inline-flex;border-radius:100px;padding:8px 20px;font-size:.88rem;font-weight:600}
.breadcrumb-custom a{color:var(--gold);text-decoration:none}
.breadcrumb-custom span{color:#fff}

/* ---------- Service detail ---------- */
.detail-row{padding:56px 0;border-bottom:1px solid #eef1f8}
.detail-row:last-child{border:none}
.detail-img{border-radius:20px;overflow:hidden;box-shadow:var(--shadow);height:100%;min-height:300px}
.detail-img img{width:100%;height:100%;object-fit:cover;min-height:300px}
.check-list{list-style:none;padding:0}
.check-list li{padding:9px 0 9px 36px;position:relative;font-weight:500;color:#33415e}
.check-list li::before{content:"✔";position:absolute;left:0;top:9px;width:26px;height:26px;border-radius:100px;background:rgba(0,194,168,.15);color:var(--teal-dark);font-weight:900;display:flex;align-items:center;justify-content:center;font-size:.8rem}

/* ---------- Blog single ---------- */
.blog-single-hero img{border-radius:22px;box-shadow:var(--shadow);width:100%;height:420px;object-fit:cover}
.blog-content{font-size:1.08rem;line-height:1.85;color:#33415e}
.blog-content h2{margin-top:38px;font-size:1.6rem}
.blog-content h3{margin-top:30px;font-size:1.25rem;color:var(--teal-dark)}
.blog-content p{margin-bottom:18px}
.blog-quote{background:var(--light);border-left:6px solid var(--gold);border-radius:0 16px 16px 0;padding:22px 26px;font-style:italic;font-weight:600;color:var(--navy)}
.toc-box{background:#fff;border:1px solid #e6ebf7;border-radius:16px;padding:24px;box-shadow:var(--shadow-sm);position:sticky;top:110px}
.toc-box a{text-decoration:none;color:#33415e;font-weight:600;display:block;padding:8px 0;border-bottom:1px dashed #e6ebf7}
.toc-box a:hover{color:var(--teal-dark)}

/* ---------- Forms ---------- */
.form-card{background:#fff;border-radius:22px;box-shadow:var(--shadow);padding:40px}
.form-control,.form-select{border-radius:12px;padding:13px 16px;border:2px solid #e6ebf7;font-weight:500}
.form-control:focus,.form-select:focus{border-color:var(--teal);box-shadow:0 0 0 4px rgba(0,194,168,.15)}
.form-label{font-weight:800;color:var(--navy)}
.info-card{border-radius:var(--radius);padding:30px;color:#fff;height:100%;box-shadow:var(--shadow-sm)}
.info-1{background:linear-gradient(135deg,var(--teal),#0A1931)}
.info-2{background:linear-gradient(135deg,var(--violet),#3c3485)}
.info-3{background:linear-gradient(135deg,#e17055,#8e3b2f)}
.info-card a{color:var(--gold);text-decoration:none;font-weight:700;word-break:break-all}
.alert-custom{display:none;border-radius:14px;padding:16px 20px;font-weight:600;margin-top:18px}
.alert-ok{display:block;background:#e6fbf5;border:1px solid var(--teal);color:#046a5c}
.alert-err{display:block;background:#ffecec;border:1px solid var(--coral);color:#a02a2a}

/* ---------- Footer ---------- */
footer{background:#070f22;color:#c6d2ef;padding:70px 0 0}
footer h5{color:#fff;font-size:1.05rem;margin-bottom:18px}
footer a{color:#c6d2ef;text-decoration:none}
footer a:hover{color:var(--gold)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:46px;padding:20px 0;font-size:.9rem}
.social-btn{width:42px;height:42px;border-radius:100px;background:rgba(255,255,255,.1);display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:1.1rem;margin-right:8px;transition:.25s}
.social-btn:hover{background:var(--teal);color:#fff;transform:translateY(-3px)}
#backTop{position:fixed;bottom:26px;right:26px;width:52px;height:52px;border-radius:100px;background:var(--gold);color:var(--navy);border:none;font-size:1.3rem;font-weight:900;display:none;z-index:2000;box-shadow:var(--shadow)}
#backTop:hover{background:var(--teal);color:#fff}
.legal-box{background:#fff;border-radius:20px;box-shadow:var(--shadow-sm);padding:46px;border:1px solid #eef1f8}
.legal-box h2{font-size:1.5rem;margin-top:34px;color:var(--navy)}
.legal-box h3{font-size:1.15rem;margin-top:24px;color:var(--teal-dark)}
.legal-box p,.legal-box li{color:#3a4a6b;line-height:1.8}
.map-wrap{border-radius:20px;overflow:hidden;box-shadow:var(--shadow);border:6px solid #fff}
@media(max-width:768px){.section-pad{padding:56px 0}.form-card{padding:26px}.legal-box{padding:26px}.blog-single-hero img{height:260px}}
