/* ==========================================================================
   SMBC Capital — Custom CSS
   Modern, mobile-first overrides.
   ========================================================================== */

:root{
    --smbc-primary: #264653;
    --smbc-primary-dark: #1b343d;
    --smbc-accent: #E9C46A;
    --smbc-accent-2: #F4A261;
    --smbc-muted: #6c7a7f;
    --smbc-bg: #ffffff;
    --smbc-surface: #f7f9fa;
    --smbc-border: rgba(38,70,83,.12);
    --smbc-shadow-sm: 0 4px 14px rgba(10,20,30,.06);
    --smbc-shadow-md: 0 10px 30px rgba(10,20,30,.10);
    --smbc-radius: 14px;
    --smbc-transition: all .35s cubic-bezier(.22,.61,.36,1);
}

/* ---------- Typography ---------- */
body{
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    -webkit-font-smoothing: antialiased;
    color:#1f2d34;
}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{
    font-family: 'Playfair Display', 'DM Serif Text', serif;
    letter-spacing: .2px;
}
p.lead{ font-size: 1.15rem; line-height: 1.7; }

/* ---------- Top bar ---------- */
#top-bar{
    font-size: .85rem;
    padding: 10px 0;
    background: var(--smbc-primary-dark) !important;
}
#top-bar a{ color:#e9eef0 !important; }
#top-bar a:hover{ color: var(--smbc-accent) !important; }
#top-bar .top-links-item{ padding: 0 10px; }
@media (max-width: 991.98px){
    #top-bar{ padding: 8px 0; font-size: .8rem; }
    #top-bar .top-links-container{ justify-content: center; }
    #top-bar .row > div + div{ margin-top: 4px; }
}

/* ---------- Header ---------- */
#header{
    background:#fff;
    box-shadow: 0 1px 0 rgba(0,0,0,.04);
}
#header .menu-link{
    font-weight: 600;
    letter-spacing: .4px;
    text-transform: uppercase;
    font-size: .82rem;
    font-family: 'Manrope', sans-serif;
    transition: var(--smbc-transition);
}
#header .menu-link:hover, #header .menu-link:focus{
    color: var(--smbc-accent-2) !important;
}
#logo img{ max-height: 96px; width:auto; }
#logo{ padding: 10px 0; }
@media (max-width: 768px){
    #logo img{ max-height: 72px; }
}

/* Top-bar: show instantly on page load (no fade/delay) */
#top-bar{
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
    display: block !important;
}
#header, #header-wrap{
    transition: none !important;
    animation: none !important;
}

/* ---------- Hero (homepage) ---------- */
.hero-video-container{
    position: relative;
    width: 100%;
    height: 100vh;
    min-height: 560px;
    overflow: hidden;
}
.hero-video-container video{
    position: absolute;
    top: 50%; left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    transform: translate(-50%, -50%);
    object-fit: cover;
    z-index: 0;
}
.hero-video-mobile{
    position: absolute; inset: 0;
    background-size: cover;
    background-position: center;
    z-index: 0;
}
.hero-video-overlay{
    position: absolute; inset: 0;
    background: linear-gradient(135deg, rgba(10,20,30,.75) 0%, rgba(38,70,83,.55) 100%);
    z-index: 1;
}
.hero-video-text{
    position: absolute;
    top: 50%; left: 50%;
    width: 100%;
    max-width: 1100px;
    z-index: 2;
    transform: translate(-50%, -50%);
    color: #fff;
    text-align: center;
    padding: 0 24px;
}
.hero-headline{
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    font-size: clamp(2.25rem, 6vw, 5.5rem);
    line-height: 1.08;
    margin-bottom: .75rem;
    color: #fff;
    text-shadow: 0 2px 16px rgba(0,0,0,.35);
}
.hero-video-subtext{
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
    font-size: clamp(.95rem, 1.6vw, 1.35rem);
    letter-spacing: .08em;
    color: #dfe7ea;
    text-transform: uppercase;
}
.hero-cta .button{
    font-weight: 600;
    letter-spacing: .05em;
    padding: 14px 28px;
}

@media (max-width: 768px){
    .hero-video-container{ height: 82vh; min-height: 480px; }
    .hero-headline{ font-size: 2.25rem; }
    .hero-video-subtext{ font-size: .85rem; }
    .hero-cta .button{ padding: 12px 22px; font-size: .85rem; }
}

/* ---------- Inner page hero ---------- */
.page-hero{
    min-height: 46vh;
    padding: 120px 0 80px 0 !important;
    display: flex;
    align-items: center;
    position: relative;
}
.page-hero .hero-title{
    color: #fff;
    font-family: 'Playfair Display', serif;
    font-weight: 700;
    letter-spacing: .3px;
    text-shadow: 0 2px 14px rgba(0,0,0,.35);
}
.page-hero .lead,
.page-hero p.lead,
.page-hero .text-white-50{
    color: #ffffff !important;
    opacity: .95;
    text-shadow: 0 1px 10px rgba(0,0,0,.4);
}
.page-breadcrumb .breadcrumb{
    background: transparent;
    padding: 0 0 10px 0;
    margin: 0 0 8px 0;
    font-size: .82rem;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.page-breadcrumb .breadcrumb-item,
.page-breadcrumb .breadcrumb-item a{ color: rgba(255,255,255,.78); }
.page-breadcrumb .breadcrumb-item a:hover{ color: var(--smbc-accent); }
.page-breadcrumb .breadcrumb-item.active{ color: #fff; }
.page-breadcrumb .breadcrumb-item + .breadcrumb-item::before{ color: rgba(255,255,255,.5); }
@media (max-width: 768px){
    .page-hero{ min-height: 38vh; padding: 100px 0 60px 0 !important; }
    .page-hero .hero-title{ font-size: 2rem !important; }
    .page-hero .lead{ font-size: .95rem; }
}

/* ---------- Services grid on homepage ---------- */
.services-grid .feature-box{
    padding: 42px 30px;
    border-radius: var(--smbc-radius);
    color:#fff;
    background-size: cover !important;
    background-position: center !important;
    min-height: 340px;
    transition: var(--smbc-transition);
    overflow: hidden;
    position: relative;
}
.services-grid .feature-box:hover{
    transform: translateY(-6px);
    box-shadow: var(--smbc-shadow-md);
}
.services-grid .feature-box .fbox-icon i{
    font-size: 2rem;
}
.services-grid .feature-box,
.services-grid .feature-box *{
    color:#ffffff !important;
}
.services-grid .feature-box h1,
.services-grid .feature-box h2,
.services-grid .feature-box h3,
.services-grid .feature-box h4,
.services-grid .feature-box h5{
    color:#ffffff !important;
}
.services-grid .feature-box p{
    color: #ffffff !important;
    font-size: .95rem;
    line-height: 1.7;
    opacity: .95;
}
.services-grid .feature-box .fbox-content p{
    color: #ffffff !important;
}
.services-grid .feature-box.dark,
.services-grid .feature-box.dark *{
    color:#ffffff !important;
}
.services-grid .feature-box .hover-button,
.services-grid .feature-box .hover-button u{
    color: var(--smbc-accent) !important;
}
.services-grid .feature-box .hover-button{
    display: inline-flex; align-items: center; gap: 6px;
    color: var(--smbc-accent); font-weight: 600;
    margin-top: 10px;
}
.services-grid .feature-box .hover-button i{ transition: transform .3s ease; }
.services-grid .feature-box:hover .hover-button i{ transform: translateX(4px); }

/* Services listing page — card text readable */
.media-box.fbox-bg{
    background: #264653 !important;
}
.media-box.fbox-bg .fbox-content{
    background: #264653 !important;
    color: #fff !important;
}
.media-box.fbox-bg .fbox-content h3,
.media-box.fbox-bg .fbox-content h4,
.media-box.fbox-bg .fbox-content p{
    color: #ffffff !important;
}
.media-box.fbox-bg:hover .fbox-content{
    background: #1b343d !important;
}
.media-box.fbox-bg:hover .fbox-content h3{
    color: var(--smbc-accent) !important;
}

/* Homepage CTA strip — force white text */
.section.bg-color.dark,
.bg-color.dark{
    background: var(--smbc-primary) !important;
    color: #ffffff !important;
}
.section.bg-color.dark h1,
.section.bg-color.dark h2,
.section.bg-color.dark h3,
.section.bg-color.dark h4,
.section.bg-color.dark p,
.bg-color.dark h1,
.bg-color.dark h2,
.bg-color.dark h3,
.bg-color.dark h4,
.bg-color.dark p{
    color: #ffffff !important;
    opacity: 1 !important;
}
.section.bg-color.dark .opacity-75{
    opacity: .92 !important;
    color: #eaf1f3 !important;
}

/* ---------- Content ---------- */
#content p{
    font-size: 1.02rem;
    line-height: 1.85;
    color:#374151;
}
#content .iconlist li{
    padding: 8px 0;
    font-size: 1rem;
    line-height: 1.6;
}
#content .iconlist li i{ margin-right: .6rem; }

.fancy-title h2{
    font-weight: 700;
    font-family: 'Playfair Display', serif;
}

/* ---------- Buttons ---------- */
.button{
    font-family: 'Manrope', sans-serif;
    font-weight: 600;
    letter-spacing: .05em;
    border-radius: 999px;
    transition: var(--smbc-transition);
}
.button:hover{
    transform: translateY(-2px);
    box-shadow: var(--smbc-shadow-md);
}

/* ---------- Team cards ---------- */
.team{
    border-radius: var(--smbc-radius) !important;
    overflow: hidden;
    background:#fff;
}
.team img{ transition: transform .5s ease; }
.team:hover img{ transform: scale(1.05); }
.team-desc{ padding: 20px 16px; }

/* ---------- Footer ---------- */
#footer.dark{
    background: var(--smbc-primary-dark);
    color: #cfd6d9;
}
#footer h4{
    color: #fff;
    font-family: 'Manrope', sans-serif;
    font-weight: 700;
}
#footer .footer-links li{ margin-bottom: .55rem; }
#footer .footer-links a{
    color: #cfd6d9;
    text-decoration: none;
    transition: var(--smbc-transition);
    font-size: .93rem;
}
#footer .footer-links a:hover{ color: var(--smbc-accent); padding-left: 4px; }
#footer .text-muted{ color: #9fb0b6 !important; }
#footer address{ color: #cfd6d9; font-style: normal; }
#footer a{ color: #cfd6d9; }
#footer a:hover{ color: var(--smbc-accent); }
#copyrights{
    background: rgba(0,0,0,.25);
    color: #9fb0b6;
    padding: 22px 0;
    border-top: 1px solid rgba(255,255,255,.06);
    font-size: .85rem;
}
#copyrights a{ color: #cfd6d9; }
#copyrights a:hover{ color: var(--smbc-accent); }

/* ---------- Contact map (full-width horizontal) ---------- */
.smbc-map-fullwidth{
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    overflow: hidden;
}
.smbc-map-fullwidth iframe{
    width: 100%;
    height: 280px;
    display: block;
}
@media (max-width: 768px){
    .smbc-map-fullwidth iframe{ height: 260px; }
}

/* ---------- Utility ---------- */
.rounded-4{ border-radius: var(--smbc-radius) !important; }
.not-italic{ font-style: normal; }
.shadow-sm{ box-shadow: var(--smbc-shadow-sm) !important; }

/* ---------- Mobile adjustments ---------- */
@media (max-width: 991.98px){
    .primary-menu ul.menu-container{ padding: 10px 0; }
    .primary-menu .menu-item{ border-bottom: 1px solid rgba(0,0,0,.05); }
    .primary-menu .menu-link{ padding: 14px 0; font-size: .9rem; }
    .services-grid .feature-box{ min-height: auto; padding: 32px 24px; }
    #footer .row > [class*="col-"]{ margin-bottom: 1.5rem; }
    #footer address{ font-size: .9rem; }
    .content-wrap{ padding-top: 60px; padding-bottom: 60px; }
}

@media (max-width: 575.98px){
    .page-hero .hero-title{ font-size: 1.75rem !important; }
    .hero-cta .button{ display:block; width:100%; margin-bottom: 10px !important; }
}

/* ---------- Accessibility ---------- */
a:focus-visible, button:focus-visible, .menu-link:focus-visible{
    outline: 2px solid var(--smbc-accent);
    outline-offset: 3px;
    border-radius: 4px;
}
img{ max-width: 100%; height: auto; }

/* ---------- Reduce motion ---------- */
@media (prefers-reduced-motion: reduce){
    *,*::before,*::after{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}
