:root {
  --blue-deep:   #0b9751a8;
  --blue-mid:    #11d47cd1;
  --blue-light:  #55eda4;
  --accent:      #c8a96e;
  --charcoal:    #2c7a68;
  --grey-soft:   #3d9481;
  --white:       #ffffff;
  --off-white:   #f7f9fc;
  --shadow-card: 0 8px 32px rgba(7, 161, 125, 0.516);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: 'DM Sans', sans-serif; color: var(--charcoal); background: var(--white); overflow-x: hidden; }
h1, h2, h3, h4, .display-font { font-family: 'Playfair Display', serif; }

/* NAVBAR */
#mainNav { transition: all .35s ease; padding: 1.2rem 0; background: transparent; z-index: 1000; }
#mainNav.scrolled { background: var(--white) !important; box-shadow: 0 2px 24px rgba(0,51,102,.10); padding: .6rem 0; }
#mainNav .navbar-brand { font-family: 'Playfair Display', serif; font-weight: 800; font-size: 1.45rem; color: var(--white); transition: color .3s; }
#mainNav.scrolled .navbar-brand { color: var(--blue-deep); }
#mainNav .nav-link { color: rgba(255,255,255,.88) !important; font-weight: 500; font-size: .95rem; padding: .4rem 1rem !important; }
#mainNav.scrolled .nav-link { color: var(--charcoal) !important; }
#mainNav .nav-link:hover { color: var(--accent) !important; }
#mainNav .btn-contact { background: var(--accent); color: var(--white) !important; border-radius: 3px; font-weight: 600; padding: .45rem 1.3rem !important; }

/* HERO */
#hero { min-height: 100vh; background: linear-gradient(135deg, var(--blue-deep) 0%, #004d48 60%, #003738 100%); position: relative; display: flex; align-items: center; }
.hero-tag { display: inline-block; background: rgba(200, 168, 110, 0.364); border: 1px solid rgba(218, 168, 75, 0.855); color: var(--accent); font-size: .78rem; letter-spacing: 1.8px; text-transform: uppercase; padding: .35rem 1rem; margin-bottom: 1.4rem; }
.hero-heading { font-size: clamp(2.4rem, 5vw, 3.6rem); color: var(--white); line-height: 1.15; font-weight: 800; margin-bottom: 1.4rem; }
.hero-heading span { color: var(--accent); }
.hero-sub { color: rgba(255,255,255,.72); font-size: 1.07rem; line-height: 1.75; max-width: 500px; margin-bottom: 2.2rem; }
.hero-cta-primary { background: var(--accent); color: var(--white); padding: .85rem 2.2rem; font-weight: 600; border-radius: 3px; text-decoration: none; display: inline-block; transition: all .2s; }
.hero-cta-primary:hover { background: #6f571d9b; transform: translateY(-2px); box-shadow: 0 8px 24px rgba(255, 202, 104, 0.247); color: #fff; }
.hero-cta-secondary { color: rgba(255,255,255,.85); font-weight: 500; text-decoration: none; margin-left: 1.5rem; border-bottom: 1px solid rgba(255,255,255,.3); }

/* STATS & CARDS */
.hero-stats { margin-top: 3rem; display: flex; gap: 2.5rem; }
.hero-stat-num { font-family: 'Playfair Display', serif; font-size: 2.1rem; color: var(--white); font-weight: 700; }
.hero-stat-label { font-size: .78rem; color: rgba(59, 213, 177, 0.54); text-transform: uppercase; }
.hero-img-card { background: linear-gradient(160deg, rgb(255, 255, 255) 0%, rgb(120, 232, 193) 100%); border: 1px solid rgba(7, 62, 50, 0.12); border-radius: 8px; padding: 2.5rem; backdrop-filter: blur(10px); }
.hero-doc-icon { width: 64px; height: 64px; background: rgba(210, 164, 79, 0.15); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-bottom: 1.2rem; }
.hero-doc-icon i { font-size: 1.8rem; color: var(--accent); }
.hero-cert-badge { display: inline-flex; align-items: center; gap: .5rem; background: rgba(255,255,255,.08); border: 1px solid rgba(7, 139, 93, 0.94); padding: .5rem 1rem; border-radius: 50px; color: rgba(8, 100, 74, 0.8); font-size: .82rem; margin-bottom: .75rem; }

/* FLOATING CARDS */
.floating-card { position: absolute; background: var(--white); border-radius: 8px; padding: .8rem 1.2rem; box-shadow: 0 12px 40px rgba(30, 197, 153, 0.2); display: flex; align-items: center; gap: .7rem; }
.fc-left { bottom: -1.5rem; left: -2rem; animation: floatUpDown 3s ease-in-out infinite; }
.fc-right { top: -1.5rem; right: -1.5rem; animation: floatUpDown 3.5s ease-in-out infinite reverse; }
@keyframes floatUpDown { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
.fc-icon { width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.fc-icon.green { background: #067e3e; color: #48e68a; }
.fc-icon.blue { background: var(--blue-light); color: var(--blue-deep); }
.fc-text-top { font-size: .78rem; color: var(--grey-soft); }
.fc-text-main { font-size: .9rem; font-weight: 600; color: var(--charcoal); }

/* TRUST BAR */
#trustBar { background: var(--off-white); border-top: 1px solid #e8edf3; border-bottom: 1px solid #e8edf3; padding: 1.5rem 0; }
.trust-item { display: flex; align-items: center; gap: .65rem; color: var(--grey-soft); font-size: .88rem; font-weight: 500; }
.trust-item i { color: var(--blue-deep); font-size: 1.15rem; }

/* SECTIONS */
section { padding: 100px 0; }
.section-label { display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase; color: var(--accent); margin-bottom: .8rem; }
.section-heading { font-size: clamp(1.9rem, 3.5vw, 2.8rem); color: var(--blue-deep); font-weight: 700; line-height: 1.2; }
.section-sub { color: var(--grey-soft); font-size: 1.02rem; line-height: 1.8; }
.divider-accent { width: 48px; height: 3px; background: var(--accent); margin: 1.2rem 0 1.5rem; border-radius: 2px; }

/* SERVICES */
#services { background: var(--off-white); }
.service-card { background: var(--white); border-radius: 8px; padding: 2.2rem 1.8rem; border: 1px solid #e4eaf3; box-shadow: var(--shadow-card); transition: all .3s ease; height: 100%; position: relative; overflow: hidden; }
.service-card:hover { transform: translateY(-8px); box-shadow: 0 20px 50px rgba(0,51,102,.14); }
.service-card::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--blue-deep), var(--accent)); transform: scaleX(0); transition: transform .35s ease; }
.service-card:hover::after { transform: scaleX(1); }
.svc-icon { width: 56px; height: 56px; background: var(--blue-light); border-radius: 8px; display: flex; align-items: center; justify-content: center; margin-bottom: 1.3rem; transition: all .3s; }
.service-card:hover .svc-icon { background: var(--blue-deep); }
.service-card:hover .svc-icon i { color: #fff; }
.svc-icon i { font-size: 1.5rem; color: var(--blue-deep); }
.svc-title { font-family: 'Playfair Display', serif; font-size: 1.2rem; font-weight: 700; color: var(--blue-deep); margin-bottom: .7rem; }
.svc-text { color: var(--grey-soft); font-size: .93rem; line-height: 1.75; }
.svc-link { display: inline-flex; align-items: center; gap: .35rem; color: var(--blue-deep); font-weight: 600; font-size: .88rem; text-decoration: none; margin-top: 1.2rem; transition: all .2s; }
.svc-link:hover { gap: .65rem; color: var(--accent); }

/* PROCESS */
.process-step { display: flex; gap: 1.5rem; margin-bottom: 2.5rem; }
.step-num { flex-shrink: 0; width: 48px; height: 48px; background: var(--blue-deep); color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: 'Playfair Display', serif; font-weight: 700; }
.step-content h5 { font-family: 'Playfair Display', serif; color: var(--blue-deep); font-weight: 700; margin-bottom: .4rem; }
.step-content p { color: var(--grey-soft); font-size: .92rem; margin: 0; }
.process-visual { background: linear-gradient(145deg, var(--blue-deep), #004d99); border-radius: 12px; padding: 3rem; color: #fff; position: relative; overflow: hidden; }
.process-metric { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15); border-radius: 8px; padding: 1rem 1.2rem; margin-bottom: .75rem; }
.pm-value { font-family: 'Playfair Display', serif; font-size: 1.8rem; font-weight: 700; }
.pm-label { font-size: .8rem; color: rgba(255,255,255,.6); }
.process-big-num { font-family: 'Playfair Display', serif; font-size: 6rem; font-weight: 800; color: rgba(255,255,255,.08); position: absolute; bottom: 1rem; right: 2rem; line-height: 1; }

/* ABOUT & EXPERTISE */
#about { background: var(--off-white); }
.about-img-wrap { position: relative; border-radius: 10px; overflow: hidden; }
.about-img-placeholder { height: 480px; background: linear-gradient(145deg, var(--blue-light), #d6e4f7); display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 1rem; }
.about-img-placeholder i { font-size: 5rem; color: var(--blue-mid); opacity: .5; }
.about-badge { position: absolute; bottom: 2rem; left: -1.5rem; background: var(--blue-deep); color: #fff; padding: 1.2rem 1.5rem; border-radius: 8px; box-shadow: 0 10px 30px rgba(0,51,102,.35); }
.ab-num { font-family: 'Playfair Display', serif; font-size: 2rem; font-weight: 800; color: var(--accent); }
.ab-label { font-size: .78rem; color: rgba(255,255,255,.7); }
.expertise-item { display: flex; align-items: flex-start; gap: 1rem; margin-bottom: 1.5rem; }
.ei-icon { width: 44px; height: 44px; background: var(--blue-light); border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.ei-icon i { color: var(--blue-deep); }
.ei-title { font-weight: 600; color: var(--charcoal); margin-bottom: .2rem; }
.ei-text { font-size: .86rem; color: var(--grey-soft); margin: 0; }

/* TESTIMONIALS */
#testimonials { background: var(--white); }
.testi-card { background: var(--off-white); border: 1px solid #e4eaf3; border-radius: 10px; padding: 2rem; height: 100%; position: relative; }
.stars { color: #f4c542; font-size: .85rem; margin-bottom: .4rem; }
.testi-quote { font-size: 3rem; line-height: 1; color: var(--accent); font-family: 'Playfair Display', serif; }
.testi-text { color: var(--grey-soft); font-size: .93rem; line-height: 1.75; margin-bottom: 1.5rem; }
.testi-author { display: flex; align-items: center; gap: .85rem; }
.ta-avatar { width: 44px; height: 44px; background: var(--blue-light); border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.ta-avatar i { color: var(--blue-deep); }
.ta-name { font-weight: 600; font-size: .92rem; color: var(--charcoal); }
.ta-role { font-size: .8rem; color: var(--grey-soft); }

/* CONTACT FORM & INFO */
#contact { background: linear-gradient(135deg, #f0f5fc, var(--white)); }
.form-card { background: var(--white); border-radius: 12px; padding: 3rem; box-shadow: 0 20px 60px rgba(0,51,102,.10); border: 1px solid #e4eaf3; }
.form-label { font-size: .85rem; font-weight: 600; color: var(--charcoal); margin-bottom: .4rem; }
.form-control, .form-select { border: 1.5px solid #dce4ef; border-radius: 5px; padding: .7rem 1rem; font-size: .92rem; }
.btn-submit { background: var(--blue-deep); color: #fff; border: none; padding: .9rem; font-weight: 600; border-radius: 5px; width: 100%; transition: all .2s; }
.btn-submit:hover { background: var(--blue-mid); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,51,102,.25); }

.contact-info-item { display: flex; align-items: flex-start; gap: 1rem; margin-bottom: 1.8rem; }
.ci-icon { width: 46px; height: 46px; background: var(--blue-light); border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.ci-icon i { color: var(--blue-deep); font-size: 1.1rem; }
.ci-label { font-size: .78rem; font-weight: 700; text-transform: uppercase; color: var(--accent); margin-bottom: .15rem; }
.ci-value { font-size: .95rem; font-weight: 500; color: var(--charcoal); }

/* FOOTER */
#footer { background: #00382f; padding: 80px 0 0; color: rgba(255,255,255,.65); }
.footer-brand { font-family: 'Playfair Display', serif; font-size: 1.5rem; font-weight: 800; color: #fff; margin-bottom: .8rem; }
.footer-tagline { font-size: .88rem; line-height: 1.7; margin-bottom: 1.5rem; }
.footer-social a { width: 36px; height: 36px; background: rgba(255,255,255,.08); border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: rgba(255,255,255,.65); margin-right: .4rem; text-decoration: none; border: 1px solid rgba(255,255,255,.12); transition: all .2s; }
.footer-social a:hover { background: var(--accent); color: #fff; border-color: var(--accent); }
#footer h6 { font-family: 'Playfair Display', serif; color: #fff; font-size: 1rem; font-weight: 700; margin-bottom: 1.2rem; }
#footer ul { list-style: none; padding: 0; }
#footer ul li { margin-bottom: .65rem; }
#footer ul li a { color: rgba(255,255,255,.6); text-decoration: none; font-size: .88rem; transition: all .2s; }
#footer ul li a:hover { color: var(--accent); padding-left: 4px; }
.footer-contact-item { display: flex; align-items: flex-start; gap: .65rem; margin-bottom: .85rem; font-size: .88rem; }
.footer-contact-item i { color: var(--accent); margin-top: 2px; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.08); padding: 1.2rem 0; margin-top: 3rem; font-size: .82rem; color: rgba(255,255,255,.35); display: flex; justify-content: space-between; }
.footer-bottom a { color: rgba(255,255,255,.45); text-decoration: none; }

#scrollTop { position: fixed; bottom: 2rem; right: 2rem; width: 44px; height: 44px; background: var(--blue-deep); color: #fff; border: none; border-radius: 50%; display: flex; align-items: center; justify-content: center; opacity: 0; transition: all .3s; z-index: 999; }
#scrollTop.visible { opacity: 1; }

@media (max-width: 991px) {
  #hero { padding-top: 100px; padding-bottom: 60px; min-height: auto; }
  .footer-bottom { flex-direction: column; text-align: center; gap: 1rem; }
}