/* ===========================================================
   FIB INVESTMENTS
   Premium Wealth Management Theme
=========================================================== */

:root{
    --primary:#7DBB2F;
    --primary-dark:#6AA329;

    --secondary:#111827;

    --dark:#0F172A;

    --white:#ffffff;

    --light:#F8FAF7;

    --light-2:#F2F7ED;

    --body:#64748B;

    --border:#E5E7EB;

    --success:#16A34A;

    --danger:#DC2626;

    --radius:24px;

    --radius-sm:16px;

    --shadow-sm:0 6px 20px rgba(15,23,42,.05);

    --shadow-md:0 18px 50px rgba(15,23,42,.08);

    --shadow-lg:0 30px 70px rgba(15,23,42,.12);

    --transition:.35s cubic-bezier(.4,0,.2,1);
}

/* ========================= */

html{

scroll-behavior:smooth;

}

body{

font-family:'Inter',sans-serif;

color:var(--secondary);

background:#fff;

overflow-x:hidden;

line-height:1.7;

}

/* ========================= */

.section{

padding:110px 0;

}

.section-sm{

padding:80px 0;

}

.section-lg{

padding:140px 0;

}

/* ========================= */

.container-custom{

max-width:1280px;

margin:auto;

padding-left:24px;

padding-right:24px;

}

/* ========================= */

.section-title{

font-family:'Manrope',sans-serif;

font-weight:800;

font-size:52px;

line-height:1.1;

letter-spacing:-1px;

color:var(--secondary);

}

.section-desc{

font-size:18px;

color:var(--body);

margin-top:20px;

line-height:1.9;

}

/* ========================= */

.badge{

display:inline-flex;

align-items:center;

gap:10px;

padding:12px 24px;

background:#EEF7E5;

border-radius:999px;

color:var(--primary);

font-weight:600;

font-size:14px;

}

/* ========================= */

.card{

background:#fff;

border-radius:30px;

border:1px solid var(--border);

box-shadow:var(--shadow-sm);

transition:var(--transition);

}

.card:hover{

transform:translateY(-8px);

box-shadow:var(--shadow-md);

}

/* ========================= */

.btn{

display:inline-flex;

align-items:center;

justify-content:center;

gap:12px;

padding:18px 34px;

font-weight:700;

border-radius:999px;

transition:var(--transition);

text-decoration:none;

cursor:pointer;

}

.btn-primary{

background:linear-gradient(

135deg,

var(--primary),

var(--primary-dark)

);

color:#fff;

box-shadow:

0 18px 35px rgba(125,187,47,.25);

}

.btn-primary:hover{

transform:translateY(-3px);

}

.btn-outline{

border:2px solid var(--primary);

color:var(--primary);

background:#fff;

}

.btn-outline:hover{

background:var(--primary);

color:#fff;

}

/* ========================= */

.shadow-premium{

box-shadow:

0 35px 80px rgba(15,23,42,.12);

}

.shadow-card{

box-shadow:

0 15px 45px rgba(15,23,42,.08);

}

/* ========================= */

.gradient-text{

background:

linear-gradient(

90deg,

var(--primary),

#96D33A

);

-webkit-background-clip:text;

-webkit-text-fill-color:transparent;

}

/* ========================= */

.bg-light{

background:var(--light);

}

.bg-light-2{

background:var(--light-2);

}

/* ========================= */

.image-radius{

border-radius:36px;

overflow:hidden;

}

/* ========================= */

.icon-box{

width:70px;

height:70px;

display:flex;

align-items:center;

justify-content:center;

border-radius:22px;

background:#EEF7E5;

color:var(--primary);

}

/* ========================= */

.subtitle{

font-size:18px;

font-weight:600;

color:var(--body);

}

/* ========================= */

.divider{

width:80px;

height:4px;

background:var(--primary);

border-radius:999px;

margin-top:20px;

}

/* ========================= */

@media(max-width:1024px){

.section{

padding:90px 0;

}

.section-title{

font-size:40px;

}

}

@media(max-width:768px){

.section{

padding:70px 0;

}

.section-title{

font-size:34px;

}

.section-desc{

font-size:16px;

}

.container-custom{

padding-left:20px;

padding-right:20px;

}

.btn{

width:100%;

}

}

@media(max-width:480px){

.section-title{

font-size:30px;

}

.badge{

font-size:13px;

padding:10px 18px;

}

}