/********** The Seun Onakoya Company — theme (based on the Startup template) **********/
/* Colours, fonts, sizes and alignment come from Admin > Appearance as CSS variables. */
:root {
    --primary: #C9A13B;
    --primary-dark: #A8832A;
    --secondary: #E6C76A;
    --light: #FAF6EC;
    --dark: #0B0B0B;
    --body-color: #3F3F46;
    --heading-color: #0B0B0B;
    --font-body: 'Nunito', sans-serif;
    --font-heading: 'Playfair Display', serif;
    --base-size: 16px;
    --body-align: justify;
}

html { scroll-behavior: smooth; }

body {
    font-family: var(--font-body);
    font-size: var(--base-size);
    color: var(--body-color);
    background: #FFFFFF;
    line-height: 1.75;
}

a { color: var(--primary-dark); text-decoration: none; }
a:hover { color: var(--primary); }

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .display-1, .display-3, .display-4, .display-6 {
    font-family: var(--font-heading);
    color: var(--heading-color);
    line-height: 1.25;
}

.bg-primary { background-color: var(--primary) !important; }
.bg-dark { background-color: var(--dark) !important; }
.bg-light { background-color: var(--light) !important; }
.text-primary { color: var(--primary) !important; }
.text-dark { color: var(--dark) !important; }
.text-white-75 { color: rgba(255, 255, 255, .8) !important; }
.text-white-75 p, .text-white-75 { color: rgba(255, 255, 255, .8); }
.border-primary { border-color: var(--primary) !important; }

.skip-link { position: absolute; top: 0; left: 0; z-index: 10000; background: var(--primary); color: var(--dark); padding: 8px 16px; }

/*** Body text: justified by default (Admin > Appearance), headings and centred blocks keep their alignment ***/
.sec-body p, .sec-body li, .sec-text, .post-content p, .post-content li, .card-text, .footer-about-text p {
    text-align: var(--body-align);
}
.sec-body p, .post-content p, .sec-text, .card-text p { hyphens: auto; -webkit-hyphens: auto; }
.price-card .sec-text { text-align: left; hyphens: manual; }
.text-center .sec-text, .text-center.sec-text, .service-item .sec-text, .service-item .card-text, .text-center .sec-body p,
.cta-text p, .hero-text, .footer-about-text p { text-align: center; }
.sec-body ul, .post-content ul { padding-left: 1.25rem; }
.sec-body ul li::marker, .post-content ul li::marker { color: var(--primary); }
.sec-body h3, .post-content h2, .post-content h3 { margin-top: 1.75rem; margin-bottom: .75rem; }
.sec-body table, .post-content table { width: 100%; margin-bottom: 1.5rem; border-collapse: collapse; background: #fff; }
.sec-body table th, .sec-body table td, .post-content table th, .post-content table td { border: 1px solid #e7dfc8; padding: .75rem 1rem; vertical-align: top; text-align: left; }
.sec-body table thead th, .sec-body table tr:first-child th, .post-content table thead th { background: var(--dark); color: var(--primary); font-family: var(--font-body); font-weight: 700; }
.sec-body table tbody tr:nth-child(even), .post-content table tbody tr:nth-child(even) { background: var(--light); }
.table-wrap { overflow-x: auto; }
.text-col { max-width: 900px; }
blockquote { border-left: 4px solid var(--primary); padding: .5rem 0 .5rem 1.25rem; font-style: italic; font-size: 1.1em; color: var(--dark); margin: 1.5rem 0; }

/* Images placed in the rich-text editor (left / right / centre) */
.sec-body img, .post-content img { max-width: 100%; height: auto; border-radius: 6px; }
.sec-body img[style*="float: left"], .post-content img[style*="float: left"], .img-left { float: left; margin: .35rem 1.5rem 1rem 0; max-width: 50%; }
.sec-body img[style*="float: right"], .post-content img[style*="float: right"], .img-right { float: right; margin: .35rem 0 1rem 1.5rem; max-width: 50%; }
.img-center, .post-content p[style*="text-align: center"] img { display: block; margin-left: auto; margin-right: auto; }
.post-content::after, .sec-body::after { content: ""; display: table; clear: both; }
@media (max-width: 575.98px) {
    .sec-body img[style*="float"], .post-content img[style*="float"] { float: none !important; max-width: 100% !important; margin: 1rem 0 !important; width: 100% !important; }
}

/*** Headings weight ***/
h1, h2, .fw-bold { font-weight: 700 !important; }
h3, h4, .fw-semi-bold { font-weight: 700 !important; }
h5, h6, .fw-medium { font-weight: 600 !important; }

.sec-kicker {
    font-family: var(--font-body);
    letter-spacing: 2px;
    font-size: .95rem;
    font-weight: 800 !important;
}

/*** Buttons ***/
.btn { font-family: var(--font-body); font-weight: 700; transition: .5s; }
.btn-primary, .btn-primary:focus {
    color: var(--dark);
    background-color: var(--primary);
    border-color: var(--primary);
    box-shadow: inset 0 0 0 50px transparent;
}
.btn-primary:hover, .btn-primary:active, .btn-primary.active {
    color: var(--primary);
    background-color: var(--dark) !important;
    border-color: var(--primary) !important;
}
.btn-dark { background: var(--dark); border-color: var(--dark); color: var(--primary); }
.btn-dark:hover { background: #222; color: #fff; border-color: #222; }
.btn-outline-primary { color: var(--primary-dark); border-color: var(--primary); }
.btn-outline-primary:hover { background: var(--primary); color: var(--dark); border-color: var(--primary); }
.btn-outline-light:hover { color: var(--dark); }
.btn-square { width: 36px; height: 36px; }
.btn-sm-square { width: 30px; height: 30px; }
.btn-lg-square { width: 48px; height: 48px; }
.btn-square, .btn-sm-square, .btn-lg-square {
    padding-left: 0; padding-right: 0; text-align: center;
    display: inline-flex; align-items: center; justify-content: center;
}

/*** Top bar ***/
#site-topbar { border-bottom: 1px solid rgba(201, 161, 59, .25); }
#site-topbar a:hover { color: var(--primary) !important; }

/*** Navbar ***/
.site-logo { height: 76px; width: auto; transition: .4s; }
.sticky-top .site-logo { height: 60px; }
.navbar-dark .navbar-nav .nav-link {
    font-family: var(--font-body);
    position: relative;
    margin-left: 22px;
    padding: 35px 0;
    color: #FFFFFF;
    font-size: 16px;
    font-weight: 700;
    outline: none;
    transition: .5s;
}
.sticky-top.navbar-dark .navbar-nav .nav-link { padding: 22px 0; color: #FFFFFF; }
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link.active { color: var(--primary); }
.navbar-dark .navbar-toggler { color: var(--primary) !important; border-color: var(--primary) !important; }
.dropdown-menu { background: var(--dark); border: 1px solid rgba(201, 161, 59, .35); border-radius: 0; padding: .5rem 0; min-width: 260px; }
.dropdown-item { color: #fff; padding: .55rem 1.25rem; font-weight: 600; }
.dropdown-item:hover, .dropdown-item:focus, .dropdown-item.active { background: var(--primary); color: var(--dark); }
.nav-cta { white-space: nowrap; }

@media (max-width: 991.98px) {
    #site-navbar { position: relative; background: var(--dark); }
    .navbar-dark .navbar-nav .nav-link,
    .sticky-top.navbar-dark .navbar-nav .nav-link { padding: 10px 0; margin-left: 0; color: #fff; }
    .navbar-dark .dropdown-menu { display: block; position: static; border: 0; background: transparent; padding: 0 0 .5rem 1rem; }
    .navbar-dark .dropdown-toggle::after { display: none; }
    .site-logo { height: 58px; }
    .navbar-collapse { max-height: 75vh; overflow-y: auto; padding-bottom: 1rem; }
}

@media (min-width: 992px) {
    .nav-overlay #site-navbar {
        position: absolute; width: 100%; top: 0; left: 0;
        border-bottom: 1px solid rgba(255, 255, 255, .12);
        background: linear-gradient(rgba(0, 0, 0, .55), rgba(0, 0, 0, 0));
        z-index: 999;
    }
    .nav-solid #site-navbar { position: relative; background: var(--dark); }
    #site-navbar.sticky-top { position: fixed !important; top: 0; left: 0; width: 100%; background: var(--dark) !important; z-index: 1030; }
    .navbar-dark .navbar-nav .nav-link::before {
        position: absolute; content: ""; width: 0; height: 2px; bottom: -1px; left: 50%;
        background: var(--primary); transition: .5s;
    }
    .navbar-dark .navbar-nav .nav-link:hover::before,
    .navbar-dark .navbar-nav .nav-link.active::before { width: 100%; left: 0; }
    .navbar .nav-item .dropdown-menu { display: block; visibility: hidden; top: 100%; transform: rotateX(-75deg); transform-origin: 0% 0%; opacity: 0; transition: .4s; }
    .navbar .nav-item:hover .dropdown-menu, .navbar .nav-item:focus-within .dropdown-menu { transform: rotateX(0deg); visibility: visible; opacity: 1; }
}
@media (min-width: 992px) and (max-width: 1299.98px) {
    .navbar-dark .navbar-nav .nav-link { margin-left: 14px; font-size: 15px; }
    .site-logo { height: 62px; }
}

/*** Hero carousel ***/
.carousel-caption { top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, .7); z-index: 1; }
.sec-hero .carousel-item img { position: absolute; inset: 0; }
.hero-kicker { color: var(--primary) !important; letter-spacing: 3px; }
.hero-inner h1, .hero-inner h2 { text-shadow: 0 2px 18px rgba(0, 0, 0, .35); }
.hero-note { color: rgba(255, 255, 255, .78) !important; font-size: .95rem; letter-spacing: .3px; }
@media (max-width: 991.98px) { .sec-hero .carousel-item { height: auto !important; min-height: 620px !important; } }
@media (max-width: 576px) {
    .carousel-caption .h5 { font-size: 13px; font-weight: 600 !important; }
    .carousel-caption .display-3 { font-size: 30px; font-weight: 700 !important; }
    .carousel-caption .lead { font-size: 1rem; }
}
.carousel-control-prev, .carousel-control-next { width: 8%; z-index: 2; }
.carousel-control-prev-icon, .carousel-control-next-icon { width: 3rem; height: 3rem; }

/*** Page header ***/
.bg-header { background-color: var(--dark); background-position: center center; background-repeat: no-repeat; background-size: cover; }
.nav-overlay .bg-header { padding-top: 7rem !important; }
.page-h1 { text-shadow: 0 2px 18px rgba(0, 0, 0, .4); }
.breadcrumb-tsoc a:hover { color: var(--primary) !important; }

/*** Section title (template underline with running dot) ***/
.section-title::before {
    position: absolute; content: ""; width: 150px; height: 5px; left: 0; bottom: 0;
    background: var(--primary); border-radius: 2px;
}
.section-title.text-center::before { left: 50%; margin-left: -75px; }
.section-title.section-title-sm::before { width: 90px; height: 3px; }
.section-title::after {
    position: absolute; content: ""; width: 6px; height: 5px; bottom: 0px; background: #FFFFFF;
    animation: section-title-run 5s infinite linear;
}
.section-title.section-title-sm::after { width: 4px; height: 3px; }
.section-title.text-center::after { animation: section-title-run-center 5s infinite linear; }
.section-title.section-title-sm::after { animation: section-title-run-sm 5s infinite linear; }
@keyframes section-title-run { 0% { left: 0; } 50% { left: 145px; } 100% { left: 0; } }
@keyframes section-title-run-center { 0% { left: 50%; margin-left: -75px; } 50% { left: 50%; margin-left: 45px; } 100% { left: 50%; margin-left: -75px; } }
@keyframes section-title-run-sm { 0% { left: 0; } 50% { left: 85px; } 100% { left: 0; } }
.sec-bg-dark .section-title::after { background: var(--dark); }
#site-footer .section-title::after { background: #000000; }

/*** Section background presets ***/
.sec-bg-light { background: var(--light); }
.sec-bg-dark { background: var(--dark); color: rgba(255, 255, 255, .85); }
.sec-bg-dark h2, .sec-bg-dark h3, .sec-bg-dark h4 { color: #fff; }
.sec-bg-dark .bg-light { background: #161616 !important; }
.sec-bg-gold { background: var(--primary); color: var(--dark); }
.sec-bg-gold .text-primary, .sec-bg-gold .sec-kicker { color: var(--dark) !important; }
.sec-bg-gold .section-title::before { background: var(--dark); }
.py-6 { padding-top: 6rem !important; padding-bottom: 6rem !important; }

/*** Facts ***/
.fact-box { min-height: 150px; }
.fact-box i { font-size: 1.4rem; }
.fact-box .sec-text { text-align: left; }
.fact-box h3 a:hover { color: inherit; }
@media (min-width: 991.98px) {
    .facts { position: relative; margin-top: -75px; z-index: 3; }
}

/*** Service cards ***/
.service-item {
    position: relative; min-height: 320px; height: 100%; padding: 40px 30px 50px; transition: .5s;
    border: 1px solid transparent;
}
.service-item:hover { border-color: var(--primary); box-shadow: 0 0 30px rgba(201, 161, 59, .18); }
.service-item .service-icon {
    margin-bottom: 30px; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center;
    background: var(--primary); border-radius: 2px; transform: rotate(-45deg); flex-shrink: 0;
}
.service-item .service-icon i { transform: rotate(45deg); font-size: 1.3rem; }
.service-item a.btn { position: absolute; width: 60px; bottom: -48px; left: 50%; margin-left: -30px; opacity: 0; }
.service-item:hover a.btn { bottom: -24px; opacity: 1; }
@media (hover: none) { .service-item a.btn { bottom: -24px; opacity: 1; } }
.callbox h3, .callbox p { color: var(--dark) !important; }

/*** Cards and blog ***/
.card-img-cover { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; }
.team-item, .blog-item { transition: .5s; }
.blog-item .blog-img img { transition: .5s; }
.blog-item:hover .blog-img img { transform: scale(1.08); }
.blog-item:hover { box-shadow: 0 0 30px rgba(0, 0, 0, .08); }
.blog-item h3 a:hover { color: var(--primary-dark) !important; }

/*** Steps ***/
.step-item { border-top: 4px solid var(--primary); }
.step-num { position: absolute; top: 12px; right: 18px; font-family: var(--font-heading); font-size: 2.6rem; font-weight: 700; color: rgba(201, 161, 59, .3); line-height: 1; }

/*** Checklists ***/
.check-item { border-left: 3px solid var(--primary); }

/*** Pricing ***/
.price-card { border: 1px solid #efe6cc; }
.price-card.featured { border: 2px solid var(--primary); z-index: 1; }
.price-amount { font-family: var(--font-heading); color: var(--dark); }
.small-note p { text-align: center !important; }

/*** FAQ ***/
.faq-acc .accordion-button { font-family: var(--font-body); font-weight: 700; color: var(--dark); background: var(--light); }
.faq-acc .accordion-button:not(.collapsed) { background: var(--dark); color: var(--primary); box-shadow: none; }
.faq-acc .accordion-button:focus { box-shadow: 0 0 0 .2rem rgba(201, 161, 59, .35); }
.faq-acc .accordion-button:not(.collapsed)::after { filter: invert(70%) sepia(60%) saturate(500%) hue-rotate(5deg); }
.faq-group { color: var(--dark); }
.faq-acc .accordion-header { margin: 0; }

/*** Forms ***/
.hp-field { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.form-box .form-label { color: var(--dark); font-weight: 700; }
.form-box .form-check-label, .form-box legend { color: var(--dark); }
.form-box .form-note, .form-note { color: var(--dark); }
.form-control:focus, .form-select:focus { border-color: var(--primary); box-shadow: 0 0 0 .2rem rgba(201, 161, 59, .25); }
.req { color: #b02a37; }
.form-box .req { color: var(--dark); }
.form-check-input:checked { background-color: var(--primary); border-color: var(--primary); }
.newsletter-box { border: 1px solid rgba(201, 161, 59, .4); }
.newsletter-box .sec-body p { color: rgba(255, 255, 255, .82); text-align: left; }
.g-recaptcha { transform-origin: 0 0; }
@media (max-width: 360px) { .g-recaptcha { transform: scale(.85); } }

/*** CTA ***/
.cta-box { border: 1px solid rgba(201, 161, 59, .45); background-image: radial-gradient(circle at 15% 20%, rgba(201, 161, 59, .18), transparent 45%), radial-gradient(circle at 85% 80%, rgba(201, 161, 59, .14), transparent 40%); }
.cta-text p { color: rgba(255, 255, 255, .85); }

/*** Logos ***/
.logo-img { max-height: 110px; width: auto; object-fit: contain; filter: grayscale(10%); transition: .3s; }
.logo-img:hover { filter: none; transform: scale(1.04); }
.vendor-carousel .logo-img { max-height: 90px; margin: auto; }

/*** Embeds ***/
.embed-full { position: relative; }
.embed-full iframe { display: block; width: 100%; height: calc(100vh - 106px); min-height: 520px; }
.embed-full .consent-embed { min-height: calc(100vh - 106px); }
.has-fullscreen-embed #site-footer { margin-top: 0 !important; }
@media (max-width: 991.98px) { .embed-full iframe { height: calc(100vh - 80px); } }

/*** Blog article ***/
.post-content { font-size: 1.06em; }
.post-content h2 { font-size: 1.85rem; }
.post-content h3 { font-size: 1.45rem; }
.post-content p { margin-bottom: 1.25rem; }
.post-hero-img { max-height: 520px; object-fit: cover; }
.comment-avatar { width: 48px; height: 48px; font-weight: 800; font-size: 1.2rem; }
.comment { border-bottom: 1px solid #f0e9d6; padding-bottom: 1rem; }

/*** Footer ***/
#site-footer { background: #000000 !important; }
/* Footer brand box: pure black so the gold logo (black background) blends in */
.footer-brand-box { background: #000000; border: 1px solid rgba(201, 161, 59, .45); border-top: 4px solid var(--primary); }
.footer-brand-box .footer-logo { border-radius: 0; }
.footer-about-text p { color: rgba(255, 255, 255, .8) !important; }
.footer-motto { color: var(--primary) !important; }
#site-footer .section-title h2 { font-size: 1.4rem; }
.footer-logo { width: 210px; height: auto; }
.footer-about-text p { margin-bottom: .5rem; }
.footer-news-text p { color: rgba(255, 255, 255, .8); margin-bottom: .5rem; text-align: left !important; }
.footer-bottom { background: #000000; border-top: 1px solid rgba(201, 161, 59, .25); }
.link-animated a { transition: .5s; }
.link-animated a:hover { padding-left: 10px; color: var(--primary) !important; }
@media (min-width: 767.98px) {
    .footer-about { margin-bottom: -75px; position: relative; z-index: 2; }
}

/*** Back to top & WhatsApp ***/
.back-to-top { position: fixed; display: none; right: 30px; bottom: 100px; z-index: 99; }
.back-to-top.back-left { right: auto; left: 30px; }
.whatsapp-float {
    position: fixed; bottom: 24px; right: 24px; z-index: 1040;
    display: inline-flex; align-items: center; gap: 10px;
    background: #25D366; color: #fff; border-radius: 50px; padding: 12px 18px 12px 14px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .25); font-weight: 700; transition: transform .3s;
}
.whatsapp-float.whatsapp-left { right: auto; left: 24px; }
.whatsapp-float i { font-size: 30px; line-height: 1; }
.whatsapp-float:hover { color: #fff; transform: translateY(-3px); }
.whatsapp-float::before {
    content: ""; position: absolute; inset: 0; border-radius: 50px; border: 2px solid #25D366;
    animation: wa-pulse 2.2s infinite; pointer-events: none;
}
@keyframes wa-pulse { 0% { transform: scale(1); opacity: .8; } 100% { transform: scale(1.25); opacity: 0; } }
@media (max-width: 575.98px) { .whatsapp-label { display: none; } .whatsapp-float { padding: 14px; } }

/*** Misc ***/
.split-img img { box-shadow: 0 20px 40px rgba(0, 0, 0, .12); }
.pagination .page-link { color: var(--dark); }
.pagination .page-item.active .page-link { background: var(--primary); border-color: var(--primary); color: var(--dark); }
.wow { visibility: hidden; }
@media (prefers-reduced-motion: reduce) {
    .wow { visibility: visible !important; animation: none !important; }
    .section-title::after { animation: none; }
}

/*** Consent: cookie banner, external content placeholders, form consent ***/
.cookie-banner { position: fixed; left: 20px; bottom: 20px; z-index: 1060; max-width: 460px; width: calc(100% - 40px); background: #000; color: rgba(255,255,255,.85); border: 1px solid rgba(201,161,59,.55); border-radius: 12px; box-shadow: 0 20px 50px rgba(0,0,0,.45); transform: translateY(20px); opacity: 0; transition: .35s; }
.cookie-banner.open { transform: none; opacity: 1; }
.cookie-banner .cc-inner { padding: 20px 22px; }
.cookie-banner a { color: var(--primary); }
.cookie-banner .cc-detail, .cookie-banner .cc-save { display: none; }
.cookie-banner.show-detail .cc-detail, .cookie-banner.show-detail .cc-save { display: block; }
.cookie-banner.show-detail .cc-settings { display: none; }
.cookie-banner .form-check-input:disabled { opacity: .7; }
.cookie-banner p { text-align: left !important; }
@media (max-width: 575.98px) { .cookie-banner { left: 10px; bottom: 10px; width: calc(100% - 20px); } }
.consent-embed { position: relative; background: var(--dark) linear-gradient(135deg, rgba(201,161,59,.12), transparent 60%); color: rgba(255,255,255,.85); display: flex; align-items: center; justify-content: center; min-height: 320px; }
.consent-embed.is-loaded { display: block; background: none; min-height: 0; }
.consent-embed-full { min-height: calc(100vh - 106px); }
.consent-embed-full.is-loaded iframe { height: calc(100vh - 106px); min-height: 520px; display: block; }
.ce-placeholder { max-width: 520px; text-align: center; padding: 32px 20px; }
.ce-placeholder > i { font-size: 2rem; color: var(--primary); margin-bottom: 12px; }
.ce-placeholder .h5 { color: #fff; }
.ce-placeholder p { text-align: center !important; }
.ce-placeholder a { color: var(--primary); }
.consent-check .form-check-label { line-height: 1.5; }
.consent-check.consent-dark .form-check-label, .newsletter-box .newsletter-note, #site-footer .newsletter-note, .bg-dark .newsletter-note { color: rgba(255,255,255,.75); }
.consent-check.consent-dark a, .newsletter-note a { color: var(--primary); }
.form-box .consent-check .form-check-label, .form-box .consent-check a { color: var(--dark); }
.form-box .consent-check a { text-decoration: underline; }