/* ================================================================
   DESFUR CRAFT PVT. LTD. — Frontend Stylesheet
   Design pattern: rangoli.kitchen
   ================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600;700;800&amp;display=swap');

/* ── Custom scrollbar ─────────────────────────────────────── */
::-webkit-scrollbar { width: 3px; }
::-webkit-scrollbar-track { background: #fefefe; }
::-webkit-scrollbar-thumb { background: #fe8302; }

/* ── Reset & base ─────────────────────────────────────────── */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: 'Manrope', 'Segoe UI', sans-serif; background: #fefefe; overflow-x: hidden; }
h1,h2,h3,h4,h5,h6 { color: #fefefe; margin: 0; line-height: normal; font-weight: 600; }
p { line-height: 1.8; margin-bottom: 1rem; font-size: 16px; overflow: hidden; font-weight: 400; }
p:last-child { margin-bottom: 0; }
img { max-width: 100%; object-fit: cover; object-position: center; }
ul { list-style: none; }
a { text-decoration: none; }
a:hover { text-decoration: none; }

/* ── CSS Variables (Brand palette: #595758 · #fefefe · #000000 · #fe8302) ── */
:root {
    --orange:       #fe8302;   /* Color 4 — brand orange */
    --orange-dark:  #000000;   /* Color 3 — black (hover fill) */
    --orange-light: #fef4e8;   /* light orange tint (near white) */
    --dark:         #595758;   /* Color 1 — dark grey */
    --black:        #000000;   /* Color 3 — black */
    --white:        #fefefe;   /* Color 2 — near white */
    --grey:         #fefefe;   /* Color 2 — near white for bg areas */
    --text-dark:    #000000;   /* Color 3 — black for headings/body */
    --text-muted:   #595758;   /* Color 1 — grey for secondary text */
    --border:       rgba(89,87,88,0.18); /* Color 1 at low opacity */
}

/* ── Page Loader ──────────────────────────────────────────── */
.spinner-fixed {
    width: 100%; height: 100vh;
    position: fixed; top: 0; left: 0;
    display: flex; align-items: center; justify-content: center;
    z-index: 9999;
    background: rgba(0,0,0,0.92);
    transition: opacity 0.5s, visibility 0.5s;
}
.spinner-fixed.hide { opacity: 0; visibility: hidden; pointer-events: none; }
.spinner {
    margin: 0 auto; width: 34px; height: 34px;
    border-radius: 50%;
    background: #c21b22;
    animation: spinnerEase 2s infinite;
}
@keyframes spinnerEase {
    0%   { transform: rotateX(0deg); background: #fefefe; }
    7.5% { background: #fefefe; }
    7.51%{ background: #c21b22; }
    25%  { transform: rotateX(180deg); }
    50%  { transform: rotateZ(180deg); }
    75%  { transform: rotateY(180deg); }
    100% { transform: rotateX(0deg); background: #c21b22; }
}

/* ── Scroll animations ────────────────────────────────────── */
.animated {
    visibility: visible;
    animation-fill-mode: both;
    animation-duration: 1s;
    animation-play-state: running;
}
@keyframes fadeInUp {
    0%  { opacity: 0; transform: translate3d(0,80px,0); }
    to  { opacity: 1; transform: translateZ(0); }
}
.animate__fadeInUp { animation-name: fadeInUp; }

@keyframes fadeUp {
    0%   { transform: translateY(60px); opacity: 0; }
    100% { transform: translateY(0);    opacity: 1; }
}
.animate__fadeUp { animation-name: fadeUp; transform: translateY(0); }

@keyframes fadeIn {
    0%  { opacity: 0; }
    100%{ opacity: 1; }
}
.animate__fadeIn { animation-name: fadeIn; }

/* Elements waiting to animate (before viewport) */
.wow { opacity: 0; }

/* ── Navbar animation ─────────────────────────────────────── */
@keyframes navbarSlideDown {
    0%   { opacity: 0; transform: translateY(-100%); }
    100% { opacity: 1; transform: translateY(0); }
}

/* ── Utility ──────────────────────────────────────────────── */
.pad40  { padding: 40px 0; }
.pad60  { padding: 60px 0; }
.pad80  { padding: 80px 0; }
.padb80 { padding-bottom: 80px; }
.clrwht { color: #fefefe; }
.clrblk { color: #000000; }
.bgblack{ background: #000000; }
.relative { position: relative; }
.max_w800 { max-width: 860px; margin: 0 auto; }
.max_w600 { max-width: 620px; margin: 0 auto; }

/* ── Section headings (dark bg sections) ─────────────────── */
.sec_eyebrow {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: #c21b22;
    margin-bottom: 12px;
}
.sec_hd {
    font-size: 38px;
    font-weight: 700;
    color: #fefefe;
    line-height: 1.2;
    margin-bottom: 16px;
}
.sec_hd span { color: #c21b22; }
.sec_hd_dark {
    font-size: 38px;
    font-weight: 700;
    color: #000000;
    line-height: 1.2;
    margin-bottom: 16px;
}
.sec_hd_dark span { color: #c21b22; }
.sec_sub {
    font-size: 16px;
    color: rgba(255,255,255,0.7);
    line-height: 1.85;
}
.sec_sub_dark {
    font-size: 15px;
    color: #595758;
    line-height: 1.85;
}
.orange_line {
    width: 50px; height: 3px;
    background: #c21b22;
    margin: 16px 0;
    border-radius: 2px;
}
.orange_line.centered { margin: 16px auto; }

/* ── FIXED HEADER WRAPPER ─────────────────────────────────── */
#siteHeader {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 999;
}
/* On scroll: slide top bar up, keep navbar visible */
#siteHeader .top_bar_strip {
    max-height: 44px;
    overflow: hidden;
    transition: max-height 0.4s ease, opacity 0.3s ease, padding 0.3s ease, border 0.3s ease;
    opacity: 1;
}
#siteHeader.scrolled .top_bar_strip {
    max-height: 0;
    opacity: 0;
    padding: 0;
    border: none;
}
#siteHeader.scrolled .navbar {
    box-shadow: 0 3px 20px rgba(0,0,0,0.55);
}

/* ── NAVBAR (white) ───────────────────────────────────────── */
.navbar {
    width: 100%;
    padding: 10px 0;
    background: #fefefe;
    position: relative;
    top: auto;
    border-bottom: 1px solid rgba(89,87,88,0.15);
    box-shadow: 0 2px 12px rgba(0,0,0,0.07);
    transition: box-shadow 0.3s ease;
    z-index: 1;
}
.navbar::after { display: none; }

#siteHeader.scrolled .navbar {
    box-shadow: 0 4px 20px rgba(0,0,0,0.12);
}

/* Logo */
.nav_logo { height: 68px; width: auto; display: block; }

/* Nav items */
.navbar .navbar-nav .nav-item { margin-right: 26px; display: inline-flex; }
.navbar .navbar-nav .nav-item:last-child { margin: 0; }
.navbar .navbar-nav .nav-item .nav-link {
    color: #000000;
    font-size: 13px;
    position: relative;
    padding: 10px 0;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: 600;
    transition: color 0.25s;
}

/* Orange bottom-border slide on hover */
.navbar .navbar-nav .nav-item .nav-link::before {
    content: '';
    position: absolute;
    left: 0; bottom: 5px;
    width: 0;
    height: 2px;
    background: #c21b22;
    border-radius: 2px;
    transition: width 0.4s ease;
}
.navbar .navbar-nav .nav-item .nav-link:hover        { color: #c21b22; }
.navbar .navbar-nav .nav-item .nav-link:hover::before{ width: 100%; }
.navbar .navbar-nav .nav-item .nav-link.active       { color: #c21b22; }
.navbar .navbar-nav .nav-item .nav-link.active::before { width: 100%; }

/* Dropdown — white with orange top border */
.navbar .dropdown-menu {
    background: #fefefe;
    border: none !important;
    border-top: 2px solid #c21b22 !important;
    border-radius: 0 !important;
    padding: 6px 0;
    margin-top: 0;
    box-shadow: 0 8px 24px rgba(0,0,0,0.1);
    min-width: 220px;
}
.navbar .dropdown-item {
    color: #595758;
    font-size: 12px;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    padding: 9px 18px;
    font-weight: 600;
    transition: all 0.2s;
    border-left: 3px solid transparent;
}
.navbar .dropdown-item:hover {
    background: #fefefe;
    color: #c21b22;
    border-left-color: #c21b22;
    padding-left: 22px;
}
.navbar .dropdown-item i { color: #c21b22; }

/* Company Profile CTA button — gradient pill */
.nav_btn {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, #c21b22 0%, #e05f00 100%) !important;
    color: #fefefe !important;
    border: none !important;
    padding: 9px 20px !important;
    font-weight: 700 !important;
    font-size: 12.5px !important;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    border-radius: 30px !important;
    position: relative;
    z-index: 2;
    overflow: hidden;
    box-shadow: 0 6px 18px rgba(254,131,2,0.35);
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}
/* download icon in a visible white chip */
.nav_btn_ic {
    width: 24px; height: 24px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #fefefe;
    color: #c21b22;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    transition: transform 0.3s ease, background 0.3s ease;
}
.nav_btn_ic i { animation: navDlBounce 1.8s ease-in-out infinite; }
@keyframes navDlBounce {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(2px); }
}
/* shine sweep */
.nav_btn::before {
    content: '';
    position: absolute;
    top: 0; left: -120%;
    width: 60%; height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,0.4), transparent);
    transform: skewX(-20deg);
    transition: left 0.6s ease;
    z-index: 1;
}
.nav_btn:hover {
    color: #fefefe !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 26px rgba(254,131,2,0.5) !important;
}
.nav_btn:hover::before { left: 130%; }
.nav_btn:hover .nav_btn_ic { transform: scale(1.15); background: #000000; color: #fefefe; }

/* Mobile toggler — dark bars for white navbar */
.navbar-toggler {
    border: 1px solid rgba(89,87,88,0.2);
    background: transparent !important;
    padding: 6px 9px;
    border-radius: 3px;
}
.navbar-toggler:focus { box-shadow: none; }
.navbar-toggler .icon-bar {
    height: 2px; width: 22px;
    background: #595758;
    border-radius: 1px;
    display: block;
    margin-top: 5px;
    transition: all 0.2s;
}
.navbar-toggler .icon-bar:first-child { margin-top: 0; }
.navbar-toggler .top-bar    { transform: rotate(45deg);  transform-origin: 6% 50%; }
.navbar-toggler .middle-bar { opacity: 0; }
.navbar-toggler .bottom-bar { transform: rotate(-45deg); transform-origin: 7% 90%; }
.navbar-toggler.collapsed .top-bar    { transform: rotate(0); }
.navbar-toggler.collapsed .middle-bar { opacity: 1; }
.navbar-toggler.collapsed .bottom-bar { transform: rotate(0); }

/* ── Top info bar ─────────────────────────────────────────── */
.top_bar_strip {
    background: #000000;
    border-bottom: 2px solid #c21b22;
    padding: 8px 0;
    font-size: 12px;
    color: rgba(255,255,255,0.65);
    letter-spacing: 0.3px;
}

/* Each contact item */
.topbar_item {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0 16px 0 0;
    color: rgba(255,255,255,0.7);
    transition: color 0.25s;
    text-decoration: none;
}
.topbar_item:hover { color: #c21b22; }

/* Icon — plain, visible, orange */
.topbar_icon {
    font-size: 13px;
    color: #c21b22;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
}
.topbar_text { font-size: 12px; font-weight: 500; letter-spacing: 0.3px; }

/* Vertical divider */
.topbar_sep {
    display: inline-block;
    width: 1px;
    height: 14px;
    background: rgba(255,255,255,0.1);
    margin: 0 10px;
    vertical-align: middle;
    flex-shrink: 0;
}

/* Get a Quote pill button (top bar) — animated, attention-grabbing */
.topbar_quote {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    /* animated shifting gradient: brand orange <-> grey */
    background: linear-gradient(270deg, #fe8302, #595758, #fe8302);
    background-size: 300% 300%;
    color: #fefefe !important;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    padding: 5px 16px;
    border-radius: 20px;
    position: relative;
    overflow: hidden;
    text-decoration: none;
    animation: quoteGradient 4s ease infinite, quoteGlow 1.8s ease-in-out infinite;
}
.topbar_quote, .topbar_quote span, .topbar_quote i { color: #fefefe !important; }
.topbar_quote i { font-size: 12px; animation: quotePulse 1.6s ease-in-out infinite; }

/* continuous gradient motion */
@keyframes quoteGradient {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}
/* pulsing glow ring — brand orange */
@keyframes quoteGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(254,131,2,0.55); }
    50%      { box-shadow: 0 0 14px 3px rgba(254,131,2,0.4); }
}
/* icon pulse */
@keyframes quotePulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.2); }
}
/* shine sweep on hover */
.topbar_quote::before {
    content: '';
    position: absolute;
    top: 0; left: -120%;
    width: 55%; height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,0.5), transparent);
    transform: skewX(-20deg);
    transition: left 0.6s ease;
}
.topbar_quote:hover { transform: translateY(-1px) scale(1.04); }
.topbar_quote:hover::before { left: 130%; }

/* Social icons in top bar — white circle, brand color on hover */
.topbar_social {
    width: 26px; height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fefefe;
    border: 1px solid #fefefe;
    border-radius: 50%;
    font-size: 12px;
    transition: all 0.25s;
    text-decoration: none;
}
.topbar_social i { color: #000000; transition: color 0.25s; }
.topbar_social:hover { background: #c21b22; border-color: #c21b22; transform: translateY(-2px); }
.topbar_social:hover i { color: #fefefe; }
/* WhatsApp icon turns green on hover */
.topbar_social.wa:hover { background: #25d366; border-color: #25d366; }

/* ── HERO BANNER ──────────────────────────────────────────── */
.banner {
    width: 100%;
    height: 100vh;
    overflow: hidden;
    position: relative;
}
.video_wrap {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    overflow: hidden;
}
.video_wrap video {
    width: 100%; height: 100%;
    object-fit: cover;
    object-position: center;
}
.video_overlay {
    position: absolute;
    inset: 0;
    /* Balanced: video stays visible, text stays readable.
       Slightly stronger shade behind the centered text via radial vignette,
       paired with text-shadows on the headings. */
    background:
        linear-gradient(to bottom, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.35) 45%, rgba(0,0,0,0.5) 100%),
        radial-gradient(ellipse 70% 60% at center, rgba(0,0,0,0.45) 0%, transparent 75%);
    z-index: 1;
}
.caption_text {
    width: 100%; height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    position: absolute;
    top: 0;
    z-index: 22;
    /* top padding clears the fixed header so content isn't jammed up */
    padding: 130px 20px 70px;
}
.caption_text .container { max-width: 860px; }
.ban_hd {
    font-size: 64px;
    letter-spacing: 1px;
    color: #fefefe;
    font-weight: 800;
    line-height: 1.05;
    margin: 0 0 10px;
    text-shadow: 0 2px 24px rgba(0,0,0,0.45);
}
.ban_hd span { color: #c21b22; }
.ban_hd small {
    display: block;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 2px;
    color: rgba(255,255,255,0.72);
    margin-top: 4px;
}
/* Slogan line under the tagline */
.ban_slogan {
    font-size: 21px;
    font-weight: 600;
    color: rgba(255,255,255,0.92);
    letter-spacing: 0.3px;
    margin: 0 0 14px;
    text-shadow: 0 1px 14px rgba(0,0,0,0.5);
}
.ban_slogan em { color: #c21b22; font-style: italic; }
.ban_sub {
    font-size: 16px;
    color: rgba(255,255,255,0.82);
    font-weight: 400;
    max-width: 600px;
    margin: 0 auto 26px;
    line-height: 1.8;
    text-shadow: 0 1px 12px rgba(0,0,0,0.5);
}
.ban_sub_hl {
    color: #c21b22;
    font-weight: 700;
}
.ban_eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: #c21b22;
    border: 1px solid rgba(254,131,2,0.45);
    background: rgba(254,131,2,0.1);
    padding: 6px 18px;
    border-radius: 30px;
    margin-bottom: 12px;
}
/* tagline under heading */
.ban_tagline {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 14px;
    padding: 7px 20px;
    border-radius: 30px;
    background: linear-gradient(135deg, rgba(254,131,2,0.2), rgba(254,131,2,0.06));
    border: 1px solid rgba(254,131,2,0.4);
}
.ban_tagline i { color: #c21b22; font-size: 14px; }
.ban_tagline span {
    color: #fefefe;
    font-size: 14.5px;
    font-weight: 700;
    letter-spacing: 0.4px;
}

/* Certifications strip at bottom of hero */
.hero_certs {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 12px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid rgba(255,255,255,0.14);
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
}
.hero_certs span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: rgba(255,255,255,0.75);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.5px;
}
.hero_certs span i { color: #c21b22; font-size: 13px; }
.hero_certs .dot { color: rgba(255,255,255,0.3); font-weight: 700; }

/* Scroll indicator */
.scroll_indicator {
    position: absolute;
    bottom: 12px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
    z-index: 23;
    color: rgba(255,255,255,0.85);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 3px;
    text-transform: uppercase;
    text-shadow: 0 1px 8px rgba(0,0,0,0.6);
}
.scroll_mouse {
    width: 24px; height: 38px;
    border: 2px solid rgba(255,255,255,0.7);
    border-radius: 12px;
    display: flex;
    justify-content: center;
    padding-top: 6px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.4);
}
.scroll_dot {
    width: 5px; height: 10px;
    background: #c21b22;
    border-radius: 3px;
    box-shadow: 0 0 8px rgba(254,131,2,0.8);
    animation: scrollDown 1.6s cubic-bezier(0.45,0,0.3,1) infinite;
}
@keyframes scrollDown {
    0%   { transform: translateY(0);    opacity: 0; }
    15%  { opacity: 1; }
    50%  { transform: translateY(14px); opacity: 1; }
    85%  { opacity: 1; }
    100% { transform: translateY(0);    opacity: 0; }
}

/* Hero trust items */
.hero_trust {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 24px;
    margin-top: 28px;
}
.hero_trust_item {
    display: flex;
    align-items: center;
    gap: 6px;
    color: rgba(255,255,255,0.7);
    font-size: 13px;
    font-weight: 500;
}
.hero_trust_item i { color: #c21b22; font-size: 11px; }

/* ── BUTTONS ──────────────────────────────────────────────── */
.linkbtn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: #c21b22;
    border: 1px solid #c21b22;
    letter-spacing: 1.5px;
    position: relative;
    padding: 9px 22px;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 700;
    color: #fefefe;
    transition: color 0.5s ease;
    z-index: 1;
    overflow: hidden;
}
.linkbtn::before {
    position: absolute;
    right: 0; bottom: 0;
    width: 0%; content: '';
    height: 100%;
    background: var(--orange-dark);
    transition: all 0.5s ease;
    z-index: -1;
}
.linkbtn:hover { color: #fefefe; border-color: #c21b22; }
.linkbtn:hover::before { width: 100%; right: unset; left: 0; }

.linkbtn_outline {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: transparent;
    border: 1px solid rgba(255,255,255,0.5);
    letter-spacing: 1.5px;
    position: relative;
    padding: 9px 22px;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 600;
    color: #fefefe;
    transition: all 0.5s ease;
    z-index: 1;
    overflow: hidden;
}
.linkbtn_outline::before {
    position: absolute;
    right: 0; bottom: 0;
    width: 0%; content: '';
    height: 100%;
    background: #c21b22;
    transition: all 0.5s ease;
    z-index: -1;
}
.linkbtn_outline:hover { color: #fefefe; border-color: #c21b22; }
.linkbtn_outline:hover::before { width: 100%; right: unset; left: 0; }

.smplbtn { display: inline-block; }
.smplbtn span { position: relative; display: inline-block; }
.smplbtn span::after {
    content: '';
    width: 0%;
    height: 2px;
    background: #c21b22;
    position: absolute;
    bottom: -1px;
    right: 0;
    transition: all 0.85s ease;
}
.smplbtn span.btns {
    color: #c21b22;
    font-size: 13px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    font-weight: 700;
    padding: 0;
    border-bottom: 1px solid rgba(254,131,2,0.4);
}
.smplbtn span.btns i { font-size: 12px; margin-left: 5px; transition: margin 0.5s; }
.smplbtn:hover span.btns i { margin-left: 10px; }
.smplbtn:hover span::after { width: 100%; right: unset; left: 0; }

/* ── TRUST BADGE BAR ──────────────────────────────────────── */
.trust_bar {
    background: #fefefe;
    border-bottom: 1px solid rgba(89,87,88,0.12);
    padding: 16px 0;
}
.trust_bar_row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 14px 8px;
}
.trust_badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #000000;
    font-size: 13.5px;
    font-weight: 700;
    letter-spacing: 0.2px;
    transition: color 0.25s;
}
.trust_badge i {
    width: 34px; height: 34px;
    flex-shrink: 0;
    border-radius: 50%;
    background: rgba(254,131,2,0.1);
    color: #c21b22;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    transition: all 0.3s;
}
.trust_badge:hover { color: #c21b22; }
.trust_badge:hover i { background: #c21b22; color: #fefefe; transform: translateY(-2px); }

@media (max-width: 991px) {
    .trust_bar_row { justify-content: center; gap: 16px 22px; }
    .trust_badge { font-size: 12.5px; }
}

/* ── CLIENTS STRIP ────────────────────────────────────────── */
.clients_strip {
    background: #fefefe;
    border-top: 1px solid rgba(89,87,88,0.15);
    border-bottom: 1px solid rgba(89,87,88,0.15);
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

/* Orange arrow/chevron label on the left — one line */
.clients_label_box {
    background: #c21b22;
    clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 50%, calc(100% - 20px) 100%, 0 100%);
    padding: 0 44px 0 28px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 70px;
}
.clients_label_text {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: #fefefe;
    white-space: nowrap;
    line-height: 1;
}

.clients_label_divider { display: none; }

/* Scrolling track wrapper */
.clients_track_wrap {
    overflow: hidden;
    flex: 1;
    position: relative;
}
.clients_track_wrap::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 40px;
    background: linear-gradient(90deg, #fefefe, transparent);
    z-index: 2;
    pointer-events: none;
}
.clients_track_wrap::after {
    content: '';
    position: absolute;
    right: 0; top: 0; bottom: 0;
    width: 80px;
    background: linear-gradient(90deg, transparent, #fefefe);
    z-index: 2;
    pointer-events: none;
}

/* The moving row */
.clients_track {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 12px;
    width: max-content;
    animation: marquee 60s linear infinite;
    padding: 10px 16px;
}
.clients_track:hover { animation-play-state: paused; }

@keyframes marquee {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* Individual logo card */
.client_logo_item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fefefe;
    border: 1px solid rgba(89,87,88,0.15);
    border-radius: 8px;
    padding: 12px 24px;
    height: 70px;
    min-width: 140px;
    flex-shrink: 0;
    transition: border-color 0.3s, box-shadow 0.3s, transform 0.3s;
    cursor: default;
}
.client_logo_item:hover {
    border-color: #c21b22;
    box-shadow: 0 4px 16px rgba(254,131,2,0.14);
    transform: translateY(-2px);
}
.client_logo_item img {
    max-height: 40px;
    max-width: 110px;
    width: auto;
    object-fit: contain;
    filter: none;
    transition: filter 0.3s, transform 0.3s;
    display: block;
}
.client_logo_item:hover img {
    transform: scale(1.05);
}
/* Fallback text if logo image fails */
.client_logo_fallback {
    font-size: 11px;
    font-weight: 800;
    color: #595758;
    letter-spacing: 1px;
    text-transform: uppercase;
    align-items: center;
    justify-content: center;
}

/* ── STATS ────────────────────────────────────────────────── */
.stats_wrap {
    background: #000000;
    border-top: 3px solid #c21b22;
    padding: 0;
    position: relative;
    overflow: hidden;
}
/* Subtle diagonal decorative lines in background */
.stats_wrap::before {
    content: '';
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(
        -55deg,
        rgba(254,131,2,0.03) 0px,
        rgba(254,131,2,0.03) 1px,
        transparent 1px,
        transparent 40px
    );
    pointer-events: none;
}
.stat_item {
    text-align: center;
    padding: 52px 24px 44px;
    border-right: 1px solid rgba(254,131,2,0.12);
    position: relative;
    transition: background 0.35s;
    cursor: default;
}
.stat_item:last-child { border-right: none; }
.stat_item:hover { background: rgba(254,131,2,0.04); }

/* Icon circle */
.stat_icon_wrap {
    width: 62px; height: 62px;
    background: rgba(254,131,2,0.08);
    border: 1px solid rgba(254,131,2,0.22);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto 20px;
    font-size: 1.5rem;
    color: #c21b22;
    transition: all 0.35s;
}
.stat_item:hover .stat_icon_wrap {
    background: #c21b22;
    color: #fefefe;
    border-color: #c21b22;
    transform: scale(1.1) rotate(-5deg);
    box-shadow: 0 8px 28px rgba(254,131,2,0.4);
}

/* Counter number */
.stat_num {
    font-size: 3.4rem;
    font-weight: 800;
    color: #c21b22;
    line-height: 1;
    font-family: 'Manrope', sans-serif;
    margin-bottom: 10px;
    letter-spacing: -1px;
}

/* Primary label */
.stat_label {
    color: #fefefe;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin-bottom: 5px;
}

/* Sub description */
.stat_sub {
    color: rgba(254,254,254,0.38);
    font-size: 11px;
    font-weight: 400;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

/* ── PAGE BANNER (inner pages) ────────────────────────────── */
.page_banner {
    position: relative;
    background-size: cover;
    background-position: center;
    padding: 150px 0 70px;
    overflow: hidden;
}
.page_banner_overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, rgba(0,0,0,0.82) 0%, rgba(0,0,0,0.5) 100%);
}
.page_banner_inner { position: relative; z-index: 1; }
.page_banner_hd {
    font-size: 46px;
    font-weight: 800;
    color: #fefefe;
    line-height: 1.15;
    margin: 8px 0 16px;
}
.page_banner_hd span { color: #c21b22; }
.page_breadcrumb {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    list-style: none;
    padding: 0; margin: 0;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.5px;
}
.page_breadcrumb a { color: rgba(254,254,254,0.65); transition: color 0.2s; }
.page_breadcrumb a:hover { color: #c21b22; }
.page_breadcrumb .sep { color: rgba(254,254,254,0.3); }
.page_breadcrumb .active { color: #c21b22; }

/* ── FOUNDER (About) ──────────────────────────────────────── */
.founder_img {
    position: relative;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0,0,0,0.15);
}
.founder_img img {
    width: 100%;
    height: 460px;
    object-fit: cover;
    object-position: top center;
    display: block;
    transition: transform 0.8s ease;
}
.founder_img:hover img { transform: scale(1.05); }
.founder_img_badge {
    position: absolute;
    bottom: 18px; left: 18px;
    background: #c21b22;
    color: #fefefe;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 8px 16px;
    border-radius: 6px;
    box-shadow: 0 8px 20px rgba(254,131,2,0.4);
}
.founder_quote {
    margin-top: 26px;
    background: #fefefe;
    border-left: 4px solid #c21b22;
    border-radius: 0 12px 12px 0;
    padding: 24px 26px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.06);
    position: relative;
}
.founder_quote > i {
    color: #c21b22;
    font-size: 1.6rem;
    opacity: 0.25;
    margin-bottom: 8px;
}
.founder_quote p {
    color: #000000;
    font-size: 15px;
    font-style: italic;
    line-height: 1.8;
    margin-bottom: 16px;
}
.founder_meta strong { display: block; color: #000000; font-size: 15px; font-weight: 700; }
.founder_meta span   { color: #c21b22; font-size: 13px; font-weight: 600; }

/* ── DIFFERENCE CARDS (on parallax band) ──────────────────── */
.diff_card {
    text-align: center;
    padding: 30px 22px;
    background: rgba(254,254,254,0.06);
    border: 1px solid rgba(254,254,254,0.12);
    border-radius: 12px;
    height: 100%;
    transition: all 0.35s;
}
.diff_card:hover {
    background: rgba(254,131,2,0.12);
    border-color: #c21b22;
    transform: translateY(-5px);
}
.diff_icon {
    width: 64px; height: 64px;
    margin: 0 auto 16px;
    border-radius: 12px;
    background: rgba(254,131,2,0.15);
    color: #c21b22;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    transition: all 0.35s;
}
.diff_card:hover .diff_icon { background: #c21b22; color: #fefefe; }
.diff_card h5 { color: #fefefe; font-size: 16px; font-weight: 700; margin-bottom: 8px; }
.diff_card p  { color: rgba(254,254,254,0.65); font-size: 13px; line-height: 1.7; margin: 0; }

/* ── ABOUT BAND — rangoli "Harmonious Marriage" style ─────── */
.about_band { background: #f6f6f6; overflow: hidden; }

.about_band_imgs {
    position: relative;
    padding: 0 30px 50px 0;
}
/* Main tall image (parallax + zoom) */
.about_band_img.main {
    width: 82%;
    height: 480px;
    overflow: hidden;
    border-radius: 14px;
    box-shadow: 0 25px 55px rgba(0,0,0,0.15);
}
.about_band_img.main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scale(1.08);
    will-change: transform;
}
/* Secondary overlapping image */
.about_band_img.sub {
    position: absolute;
    right: 0; bottom: 40px;
    width: 45%;
    height: 230px;
    overflow: hidden;
    border-radius: 12px;
    border: 5px solid #f6f6f6;
    box-shadow: 0 15px 40px rgba(0,0,0,0.18);
}
.about_band_img.sub img {
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.85s ease;
}
.about_band_img.sub:hover img { transform: scale(1.08); }
/* Experience badge */
.about_band_exp {
    position: absolute;
    top: 28px; left: -8px;
    background: #c21b22;
    color: #fefefe;
    padding: 16px 22px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 12px;
    box-shadow: 0 12px 30px rgba(254,131,2,0.4);
    z-index: 3;
}
.about_band_exp .num { font-size: 2.4rem; font-weight: 800; line-height: 1; }
.about_band_exp .txt { font-size: 11px; font-weight: 600; letter-spacing: 0.5px; text-transform: uppercase; line-height: 1.4; }

/* Text side — light heading like rangoli */
.about_band_hd {
    font-size: 36px;
    font-weight: 700;
    color: #000000;
    line-height: 1.25;
    margin-bottom: 14px;
    letter-spacing: 0.3px;
}
.about_band_hd span { color: #c21b22; font-weight: 800; }
.about_band_text {
    font-size: 15px;
    color: #595758;
    line-height: 1.95;
    margin-bottom: 16px;
}

/* ── ABOUT SECTION ────────────────────────────────────────── */
.about_para {
    color: #595758;
    font-size: 15px;
    line-height: 1.95;
    margin-bottom: 16px;
}
.about_para strong { color: #000000; font-weight: 700; }
.about_img_main {
    width: 100%;
    height: 420px;
    overflow: hidden;
    position: relative;
}
.about_img_main img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform 0.85s ease;
}
.about_img_main:hover img { transform: scale(1.05); }

.about_img_sub {
    position: absolute;
    bottom: -30px; right: -20px;
    width: 55%; height: 220px;
    overflow: hidden;
    border: 4px solid #fefefe;
    box-shadow: 0 15px 40px rgba(0,0,0,0.15);
}
.about_img_sub img { width: 100%; height: 100%; object-fit: cover; }
.about_badge {
    position: absolute;
    top: 20px; left: -20px;
    background: #c21b22;
    color: #fefefe;
    padding: 20px 22px;
    text-align: center;
    box-shadow: 0 10px 30px rgba(254,131,2,0.4);
    z-index: 2;
}
.about_badge .num { font-size: 2.5rem; font-weight: 800; line-height: 1; }
.about_badge .lbl { font-size: 11px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; opacity: 0.9; }
.about_feat {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 14px 16px;
    background: var(--grey);
    border-left: 3px solid #c21b22;
    margin-bottom: 10px;
}
.about_feat_icon {
    width: 40px; height: 40px;
    background: rgba(254,131,2,0.1);
    color: #c21b22;
    border-radius: 4px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}
.about_feat h6 { font-size: 14px; font-weight: 700; color: #000000; margin-bottom: 3px; }
.about_feat p { font-size: 12px; color: #595758; line-height: 1.5; }

/* ── OUR EXPERTISE (dark glass band) ──────────────────────── */

.expertise_section {
    padding: 90px 0;
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(6,6,6,0.74) 0%, rgba(15,15,15,0.68) 100%),
        url('../public/img/thumb-1920-1347182.png') center/cover no-repeat;
}

.expertise_glow {
    position: absolute;
    top: -120px; right: -120px;
    width: 480px; height: 480px;
    background: radial-gradient(circle, rgba(254,131,2,0.16) 0%, transparent 70%);
    pointer-events: none;
}

/* second glow bottom-left for depth */
.expertise_section::after {
    content: '';
    position: absolute;
    bottom: -140px; left: -140px;
    width: 460px; height: 460px;
    background: radial-gradient(circle, rgba(254,131,2,0.1) 0%, transparent 70%);
    pointer-events: none;
}
.expertise_section .container { position: relative; z-index: 1; }
.expertise_img {
    position: relative;
    margin-top: 26px;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 25px 55px rgba(0,0,0,0.4);
}
.expertise_img img {
    width: 100%;
    height: 240px;
    object-fit: cover;
    display: block;
    transition: transform 0.8s ease;
}
.expertise_img:hover img { transform: scale(1.06); }
.expertise_img_badge {
    position: absolute;
    left: 16px; bottom: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(0,0,0,0.65);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(254,131,2,0.3);
    border-radius: 10px;
    padding: 12px 16px;
}
.expertise_img_badge i { color: #c21b22; font-size: 1.5rem; }
.expertise_img_badge strong { display: block; color: #fefefe; font-size: 16px; font-weight: 800; line-height: 1; }
.expertise_img_badge span { color: rgba(254,254,254,0.6); font-size: 11px; }
.expertise_card {
    display: flex;
    align-items: center;
    gap: 16px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(254,254,254,0.14);
    border-radius: 14px;
    padding: 18px 20px;
    height: 100%;
    transition: all 0.35s;
    position: relative;
    overflow: hidden;
    box-shadow: 0 8px 30px rgba(0,0,0,0.35);
}
/* glass shine on top edge */
.expertise_card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(254,254,254,0.35), transparent);
}
.expertise_card:hover {
    background: rgba(254,131,2,0.14);
    border-color: rgba(254,131,2,0.5);
    transform: translateY(-5px);
    box-shadow: 0 16px 40px rgba(254,131,2,0.18);
}
.expertise_ic {
    width: 52px; height: 52px;
    flex-shrink: 0;
    border-radius: 10px;
    background: rgba(254,131,2,0.15);
    border: 1px solid rgba(254,131,2,0.25);
    color: #c21b22;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    transition: all 0.35s;
}
.expertise_card:hover .expertise_ic {
    background: #c21b22;
    color: #fefefe;
    transform: rotate(-6deg);
}
.expertise_body { flex: 1; }
.expertise_body h6 { color: #fefefe; font-size: 15px; font-weight: 700; margin-bottom: 3px; }
.expertise_body p  { color: rgba(254,254,254,0.72); font-size: 12.5px; line-height: 1.55; margin: 0; }
.expertise_arrow {
    color: rgba(254,254,254,0.25);
    font-size: 13px;
    flex-shrink: 0;
    transition: all 0.35s;
}
.expertise_card:hover .expertise_arrow { color: #c21b22; transform: translateX(4px); }

/* ── PRODUCTS SECTION ─────────────────────────────────────── */
.prod_section { background: #fefefe; }

/* ── PRODUCT CAROUSEL ARROWS (top-right) ──────────────────── */
.prodx_nav {
    display: inline-flex;
    gap: 10px;
}
.prodx_arrow {
    width: 48px; height: 48px;
    border-radius: 50%;
    border: 1.5px solid rgba(89,87,88,0.3);
    background: transparent;
    color: #000000;
    font-size: 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.34,1.4,0.64,1);
}
.prodx_arrow:hover {
    background: #c21b22;
    border-color: #c21b22;
    color: #fefefe;
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(254,131,2,0.4);
}
.prodx_arrow:active { transform: translateY(0) scale(0.94); }
/* slick adds .slick-disabled when infinite is off; keep usable look */
.prodx_arrow.slick-disabled { opacity: 0.4; cursor: default; }

/* ── PRODUCT CARDS (Details + Catalogue options) ──────────── */
.prodx_card {
    background: #fefefe;
    border: 1px solid rgba(89,87,88,0.12);
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.35s;
    height: 100%;
}
.prodx_card:hover {
    border-color: #c21b22;
    box-shadow: 0 20px 45px rgba(0,0,0,0.13);
    transform: translateY(-6px);
}
.prodx_img {
    position: relative;
    height: 300px;
    overflow: hidden;
}
.prodx_img img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform 0.7s ease;
    display: block;
}
.prodx_card:hover .prodx_img img { transform: scale(1.09); }

.prodx_img_link { display: block; width: 100%; height: 100%; }

/* Animated "Download Catalogue" badge at bottom of image */
.prodx_dl {
    position: absolute;
    left: 12px; bottom: 12px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 5px 13px 5px 5px;
    border-radius: 30px;
    background: linear-gradient(135deg, #c21b22 0%, #e05f00 100%);
    color: #fefefe;
    text-decoration: none;
    overflow: hidden;
    z-index: 2;
    box-shadow: 0 5px 16px rgba(254,131,2,0.45);
    animation: prodxGlow 2s ease-in-out infinite;
}
/* pulsing glow to attract */
@keyframes prodxGlow {
    0%, 100% { box-shadow: 0 8px 22px rgba(254,131,2,0.4); }
    50%      { box-shadow: 0 8px 28px rgba(254,131,2,0.75); }
}
/* shine sweep across the badge */
.prodx_dl::before {
    content: '';
    position: absolute;
    top: 0; left: -130%;
    width: 55%; height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,0.45), transparent);
    transform: skewX(-20deg);
    animation: prodxShine 2.8s ease-in-out infinite;
}
@keyframes prodxShine {
    0%   { left: -130%; }
    55%  { left: 130%; }
    100% { left: 130%; }
}
/* icon chip with bouncing arrow */
.prodx_dl_ic {
    width: 26px; height: 26px;
    flex-shrink: 0;
    border-radius: 50%;
    background: rgba(255,255,255,0.25);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}
.prodx_dl_ic i { animation: prodxBounce 1.6s ease-in-out infinite; }
@keyframes prodxBounce {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(2px); }
}
.prodx_dl_txt {
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
    white-space: nowrap;
}
.prodx_dl:hover { background: #000000; color: #fefefe; transform: translateY(-2px); }
.prodx_dl:hover .prodx_dl_ic { background: rgba(254,131,2,0.9); }

/* Card body */
.prodx_body {
    padding: 18px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.prodx_body strong {
    font-size: 16px;
    font-weight: 700;
    color: #000000;
    line-height: 1.3;
}
.prodx_link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: #c21b22;
    text-decoration: none;
    white-space: nowrap;
    transition: gap 0.3s;
}
.prodx_card:hover .prodx_link { gap: 9px; }

/* ── EXACT rangoli.kitchen .bggrid + .slide_img + .cases_img ── */
.bggrid {
    background: #F6F6F6;
    width: 100%;
    padding: 20px;
    border-radius: 20px;
    display: inline-block;
    transition: box-shadow 0.3s;
    cursor: pointer;
}
.bggrid:hover {
    box-shadow: 0 12px 35px rgba(0,0,0,0.12);
}
.slide_img {
    width: 100%;
    height: 380px;
    position: relative;
    overflow: hidden;
    border-radius: 12px;
}
.slide_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.85s ease;
    transform: scale(1);
    display: block;
}
.bggrid:hover .cases_img img {
    transform: scale(1.08);
}
.bggrid strong {
    display: block;
    font-size: 15px;
    color: #000000;
    margin-top: 16px;
    font-weight: 600;
    font-style: italic;
    letter-spacing: 0.3px;
    transition: color 0.3s;
}
.bggrid:hover strong { color: #c21b22; }

/* ── CASES SLIDER — exact rangoli.kitchen spacing ────────── */
.cases_slider .slick-list { margin: 0; padding-left: 0 !important; }
.cases_slider .slick-slide { margin: 0 15px; }
.cases_slider .slick-dots { margin-top: 24px; }
.cases_slider ul.slick-dots { display: flex !important; align-items: center; justify-content: center; padding: 0; margin-top: 28px; }
.cases_slider ul.slick-dots li { margin: 0 6px; }
.cases_slider ul.slick-dots li button { width: 8px; height: 8px; padding: 0; border: none; border-radius: 50%; background: #595758; opacity: 0.35; text-indent: -9999px; display: block; transition: all 0.3s; }
.cases_slider ul.slick-dots li.slick-active button { background: #c21b22; opacity: 1; width: 24px; border-radius: 4px; }

/* ── PRODUCTS SLIDER (Slick) ──────────────────────────────── */
.prod_slide_wrap { padding: 0 40px; position: relative; }
.prod_card {
    background: #fefefe;
    overflow: hidden;
    position: relative;
}
.prod_img {
    width: 100%;
    height: 260px;
    overflow: hidden;
    position: relative;
}
.prod_img img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform 0.85s ease;
    transform: scale(1);
}
.prod_card:hover .prod_img img { transform: scale(1.08); }
.prod_icon_tag {
    position: absolute;
    top: 14px; left: 14px;
    width: 42px; height: 42px;
    background: #c21b22;
    color: #fefefe;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.1rem;
    z-index: 2;
}
.prod_img_overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.6) 0%, transparent 55%);
    opacity: 0;
    transition: opacity 0.35s;
}
.prod_card:hover .prod_img_overlay { opacity: 1; }
.prod_body {
    padding: 20px;
    border: 1px solid rgba(89,87,88,0.15);
    border-top: 3px solid #c21b22;
}
.prod_body h5 {
    font-size: 16px;
    font-weight: 700;
    color: #000000;
    margin-bottom: 8px;
}
.prod_body p { font-size: 13px; color: #595758; line-height: 1.65; margin-bottom: 14px; }
.prod_link {
    font-size: 12px;
    font-weight: 700;
    color: #c21b22;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: gap 0.3s;
}
.prod_card:hover .prod_link { gap: 10px; }

/* Product showcase slick dots */
.prod_showcase_section .slick-dots { margin-top: 24px; }
.prod_showcase_section .slick-dots li button::before { color: #595758 !important; }
.prod_showcase_section .slick-dots li.slick-active button::before { color: #c21b22 !important; }

/* Slick arrows */
.slick-prev, .slick-next {
    width: 46px; height: 46px;
    background: #c21b22 !important;
    border-radius: 0 !important;
    z-index: 10;
    transition: background 0.3s;
}
.slick-prev:hover, .slick-next:hover { background: #000000 !important; }
.slick-prev { left: -10px !important; }
.slick-next { right: -10px !important; }
.slick-prev::before, .slick-next::before { font-size: 16px !important; opacity: 1 !important; }
.slick-dots li button::before { color: #c21b22 !important; }
.slick-dots li.slick-active button::before { color: #c21b22 !important; }

/* ── SERVICES SECTION ─────────────────────────────────────── */
.services_section { background: #f6f6f6; }

/* Service image cards */
.svc_card {
    display: block;
    background: #fefefe;
    border: 1px solid rgba(89,87,88,0.12);
    border-radius: 14px;
    overflow: hidden;
    text-decoration: none;
    height: 100%;
    transition: all 0.35s;
}
.svc_card:hover {
    border-color: #c21b22;
    transform: translateY(-6px);
    box-shadow: 0 18px 44px rgba(0,0,0,0.12);
}
.svc_card_img { position: relative; height: 200px; overflow: hidden; }
.svc_card_img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.7s ease; }
.svc_card:hover .svc_card_img img { transform: scale(1.08); }
.svc_card_img::after {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.45), transparent 60%);
}
.svc_card_ic {
    position: absolute; bottom: 14px; left: 18px;
    width: 50px; height: 50px;
    background: #c21b22; color: #fefefe;
    border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.35rem;
    z-index: 2;
    box-shadow: 0 8px 20px rgba(254,131,2,0.4);
    transition: all 0.35s;
}
.svc_card:hover .svc_card_ic { transform: translateY(-4px) rotate(-6deg); }
.svc_card_body { padding: 22px 24px 24px; }
.svc_card_body h5 { font-size: 17px; font-weight: 700; color: #000000; margin-bottom: 10px; line-height: 1.35; }
.svc_card_body p { font-size: 13.5px; color: #595758; line-height: 1.7; margin-bottom: 16px; }

/* Image side */
.service_img {
    position: relative;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0,0,0,0.12);
}
.service_img img {
    width: 100%;
    height: 380px;
    object-fit: cover;
    display: block;
    transition: transform 0.8s ease;
}
.service_row:hover .service_img img { transform: scale(1.05); }
/* Orange corner accent on image */
.service_img::after {
    content: '';
    position: absolute;
    left: 0; bottom: 0;
    width: 0; height: 4px;
    background: #c21b22;
    transition: width 0.6s ease;
}
.service_row:hover .service_img::after { width: 100%; }
/* Big watermark number badge on image */
.service_img_num {
    position: absolute;
    top: 18px; left: 18px;
    width: 54px; height: 54px;
    background: #c21b22;
    color: #fefefe;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 800;
    font-family: 'Manrope', sans-serif;
    box-shadow: 0 8px 20px rgba(254,131,2,0.4);
}

/* Text side */
.service_content { padding: 0 10px; }
.service_head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 16px;
}
.service_ic {
    width: 54px; height: 54px;
    border-radius: 12px;
    background: rgba(254,131,2,0.1);
    color: #c21b22;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    flex-shrink: 0;
    transition: all 0.35s;
}
.service_row:hover .service_ic {
    background: #c21b22;
    color: #fefefe;
    transform: rotate(-6deg);
}
.service_step {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #595758;
}
.service_title {
    font-size: 28px;
    font-weight: 700;
    color: #000000;
    line-height: 1.25;
    margin-bottom: 14px;
}
.service_text {
    font-size: 15px;
    color: #595758;
    line-height: 1.85;
    margin-bottom: 20px;
}
.service_points {
    list-style: none;
    margin: 0 0 26px;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 22px;
}
.service_points li {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #000000;
}
.service_points li i {
    width: 20px; height: 20px;
    background: rgba(254,131,2,0.12);
    color: #c21b22;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 9px;
    flex-shrink: 0;
}

/* ── FEATURE CARDS ────────────────────────────────────────── */
.feat_card {
    background: #fefefe;
    padding: 34px 24px;
    border: 1px solid rgba(89,87,88,0.15);
    border-top: 3px solid transparent;
    transition: all 0.35s;
    text-align: center;
    height: 100%;
}
.feat_card:hover { border-top-color: #c21b22; box-shadow: 0 16px 40px rgba(0,0,0,0.1); transform: translateY(-6px); }
.feat_icon {
    width: 78px; height: 78px;
    margin: 0 auto 20px;
    border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.9rem;
    background: rgba(254,131,2,0.1);
    color: #c21b22;
    transition: all 0.35s;
}
.feat_card:hover .feat_icon { background: #c21b22; color: #fefefe; transform: rotate(-6deg); }
.feat_card h5 { font-size: 17px; font-weight: 700; color: #000000; margin-bottom: 10px; }
.feat_card p { font-size: 14px; color: #595758; line-height: 1.75; margin: 0; }

/* ── FIXEDBANNERFULL (CSS Parallax) ───────────────────────── */
.fixedbannerfull {
    width: 100%;
    height: 90vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    background-repeat: no-repeat;
    position: relative;
    overflow: hidden;
}
.fixedbannerfull_overlay {
    position: absolute; inset: 0;
    background: rgba(0,0,0,0.82);
    z-index: 0;
}
/* Lighter variant — shows more of the background image */
.fixedbannerfull.lighter .fixedbannerfull_overlay {
    background: linear-gradient(rgba(0,0,0,0.55), rgba(0,0,0,0.62));
}
.fixedbannerfull .inner {
    position: relative; z-index: 1;
    width: 100%;
}
/* Shorter variant */
.fixedbannerfull.half { height: 60vh; }

/* ── PROCESS FLOW (connected steps, orange circles) ───────── */
.proc_flow {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.proc_step {
    flex: 1;
    min-width: 0;
    text-align: center;
    padding: 0 14px;
    position: relative;
}
/* Icon circle area (holds the connector behind it) */
.proc_top {
    position: relative;
    height: 96px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
}
/* Connector line to the next step */
.proc_connector {
    position: absolute;
    top: 48px;
    left: 50%;
    width: 100%;
    height: 3px;
    background: repeating-linear-gradient(90deg,
        rgba(254,131,2,0.6) 0, rgba(254,131,2,0.6) 8px,
        transparent 8px, transparent 16px);
    z-index: 0;
}
/* Animated arrow travelling along the connector */
.proc_connector::after {
    content: '\f054'; /* fa chevron-right */
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    color: #c21b22;
    font-size: 12px;
    animation: procArrow 2.4s linear infinite;
}
@keyframes procArrow {
    0%   { left: 8%;  opacity: 0; }
    20%  { opacity: 1; }
    80%  { opacity: 1; }
    100% { left: 88%; opacity: 0; }
}
/* The circle — brand orange */
.proc_circle {
    position: relative;
    z-index: 1;
    width: 90px; height: 90px;
    border-radius: 50%;
    background: #c21b22;
    border: 3px solid rgba(254,131,2,0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.9rem;
    color: #fefefe;
    transition: all 0.4s;
    box-shadow: 0 0 0 8px rgba(0,0,0,0.35), 0 8px 24px rgba(254,131,2,0.4);
}
.proc_step:hover .proc_circle {
    transform: translateY(-5px);
    box-shadow: 0 0 0 8px rgba(0,0,0,0.4), 0 14px 34px rgba(254,131,2,0.6);
}
/* Number badge */
.proc_badge {
    position: absolute;
    top: -6px; right: -6px;
    width: 30px; height: 30px;
    border-radius: 50%;
    background: #fefefe;
    color: #c21b22;
    font-size: 13px;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 3px solid #000000;
    transition: all 0.4s;
}
.proc_step:hover .proc_badge { background: #000000; color: #c21b22; }
.proc_step h5 { font-size: 15px; font-weight: 700; color: #fefefe; margin-bottom: 10px; }
.proc_step p  { font-size: 12.5px; color: rgba(255,255,255,0.62); line-height: 1.7; margin: 0; }

/* ── PDF VIEWER MODAL (certifications page) ────────────────── */
.pdf_backdrop {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.75);
    opacity: 0; visibility: hidden;
    transition: all 0.3s;
    z-index: 1100;
}
.pdf_backdrop.active { opacity: 1; visibility: visible; }
.pdf_modal {
    position: fixed;
    top: 50%; left: 50%;
    transform: translate(-50%, -48%) scale(0.97);
    width: 92%; max-width: 900px;
    height: 90vh;
    background: #fefefe;
    border-radius: 14px;
    overflow: hidden;
    z-index: 1101;
    opacity: 0; visibility: hidden;
    transition: all 0.35s cubic-bezier(0.34,1.2,0.64,1);
    box-shadow: 0 30px 80px rgba(0,0,0,0.45);
    display: flex; flex-direction: column;
}
.pdf_modal.active { opacity: 1; visibility: visible; transform: translate(-50%, -50%) scale(1); }
.pdf_modal_head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 12px 16px;
    background: linear-gradient(135deg, #1a1a1a 0%, #2a2a2a 100%);
    flex-shrink: 0;
}
.pdf_modal_head h6 { color: #fefefe; font-size: 15px; font-weight: 700; margin: 0; }
.pdf_modal_head h6 i { color: #c21b22; }
.pdf_modal_actions { display: flex; gap: 8px; }
.pdf_btn {
    width: 36px; height: 36px;
    border-radius: 8px;
    border: none;
    background: rgba(255,255,255,0.12);
    color: #fefefe;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 14px; cursor: pointer; text-decoration: none;
    transition: all 0.25s;
}
.pdf_btn:hover { background: #c21b22; color: #fefefe; }
.pdf_close:hover { background: #e0392b; }
.pdf_frame_wrap { flex: 1; background: #525659; }
.pdf_frame_wrap iframe { width: 100%; height: 100%; border: 0; display: block; }
@media (max-width: 576px) {
    .pdf_modal { width: 96%; height: 88vh; }
}

/* ── CERTIFICATION CARDS — real inline PDF viewers (certifications page) ── */
.certpdf_card {
    background: #fefefe;
    border: 1px solid rgba(89,87,88,0.18);
    border-radius: 8px;
    overflow: hidden;
    /* uniform height for every card */
    height: 520px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.10);
    transition: box-shadow 0.3s, transform 0.3s;
}
@media (max-width: 991px) { .certpdf_card { height: 560px; } }
@media (max-width: 575px) { .certpdf_card { height: 600px; } }
.certpdf_card:hover {
    box-shadow: 0 16px 40px rgba(254,131,2,0.18);
    transform: translateY(-4px);
}
.certpdf_card iframe {
    width: 100%; height: 100%;
    border: 0; display: block;
}

/* ── CERTIFICATIONS — each cert framed like a wall certificate ─ */
.cert_section { background: #f6f6f6; }

/* outer frame (the "frame moulding") */
.cert_card {
    position: relative;
    background: #fefefe;
    padding: 16px;                       /* moulding thickness */
    border: 2px solid #c21b22;
    border-radius: 6px;
    text-align: center;
    height: 100%;
    box-shadow: 0 10px 28px rgba(0,0,0,0.08);
    transition: all 0.35s cubic-bezier(0.22,1,0.36,1);
}
/* inner mat / matting line */
.cert_card::before {
    content: '';
    position: absolute;
    inset: 8px;
    border: 1px solid rgba(89,87,88,0.25);
    border-radius: 3px;
    pointer-events: none;
    z-index: 0;
}
/* gold corner accents (revealed on hover) */
.cert_card::after {
    content: '';
    position: absolute;
    inset: 8px;
    border-radius: 3px;
    pointer-events: none;
    z-index: 0;
    background:
        linear-gradient(#c21b22,#c21b22) left  6px top    6px/16px 2px no-repeat,
        linear-gradient(#c21b22,#c21b22) left  6px top    6px/2px 16px no-repeat,
        linear-gradient(#c21b22,#c21b22) right 6px top    6px/16px 2px no-repeat,
        linear-gradient(#c21b22,#c21b22) right 6px top    6px/2px 16px no-repeat,
        linear-gradient(#c21b22,#c21b22) left  6px bottom 6px/16px 2px no-repeat,
        linear-gradient(#c21b22,#c21b22) left  6px bottom 6px/2px 16px no-repeat,
        linear-gradient(#c21b22,#c21b22) right 6px bottom 6px/16px 2px no-repeat,
        linear-gradient(#c21b22,#c21b22) right 6px bottom 6px/2px 16px no-repeat;
    opacity: 0;
    transition: opacity 0.35s;
}
.cert_card:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(254,131,2,0.22); }
.cert_card:hover::after { opacity: 1; }
/* keep content above the mat/corner layers */
.cert_card .cert_img,
.cert_card h6,
.cert_card p { position: relative; z-index: 1; }
.cert_card .cert_img { margin-top: 8px; }
.cert_card h6 { padding: 0 8px; }
.cert_card p  { padding: 0 12px 6px; }
.cert_icon {
    width: 68px; height: 68px;
    border-radius: 50%;
    background: rgba(254,131,2,0.1);
    color: #c21b22;
    border: 2px solid rgba(254,131,2,0.2);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.7rem;
    margin: 0 auto 14px;
    transition: all 0.35s;
}
.cert_card:hover .cert_icon { background: #c21b22; color: #fefefe; border-color: #c21b22; }

/* Certification logo image */
.cert_img {
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 18px;
}
.cert_img img {
    max-height: 90px;
    max-width: 130px;
    width: auto;
    object-fit: contain;
    transition: transform 0.35s;
}
.cert_card:hover .cert_img img { transform: scale(1.08); }

.cert_card h6 { font-size: 15px; font-weight: 700; color: #000000; margin-bottom: 4px; }
.cert_card p { font-size: 12px; color: #595758; margin: 0; line-height: 1.6; }

/* ── GALLERY GRID ─────────────────────────────────────────── */
.gallery_item {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    cursor: pointer;
}
.gallery_item img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform 0.85s ease;
    display: block;
}
.gallery_item:hover img { transform: scale(1.08); }

/* Overlay — gradient ALWAYS visible, deepens on hover */
.gallery_overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top,
        rgba(0,0,0,0.85) 0%,
        rgba(0,0,0,0.30) 45%,
        rgba(0,0,0,0) 75%);
    transition: background 0.4s;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 22px 20px;
}
.gallery_item:hover .gallery_overlay {
    background: linear-gradient(to top,
        rgba(0,0,0,0.92) 0%,
        rgba(0,0,0,0.55) 50%,
        rgba(0,0,0,0.20) 100%);
}

/* Title + description — ALWAYS visible */
.gallery_overlay_top { margin-bottom: 0; transition: margin-bottom 0.35s; }
.gallery_item:hover .gallery_overlay_top { margin-bottom: 14px; }
.gallery_label {
    color: #fefefe;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 4px;
}
.gallery_label::before {
    content: '';
    display: block;
    width: 28px; height: 3px;
    background: #c21b22;
    border-radius: 2px;
    margin-bottom: 10px;
}
.gallery_desc  { color: rgba(254,254,254,0.7); font-size: 12px; line-height: 1.5; }

/* Action buttons — slide up + fade in on hover */
.gallery_actions {
    display: flex;
    gap: 10px;
    flex-shrink: 0;
    max-height: 60px;
    opacity: 1;
    transform: translateY(0);
    transition: transform 0.35s ease;
}
.gallery_item:hover .gallery_actions { transform: translateY(-2px); }
.gal_btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 11px;
    border: none;
    border-radius: 4px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.25s;
    text-decoration: none;
}
.gal_btn i { font-size: 11px; }
.gal_btn_photo {
    background: #fefefe;
    color: #000000;
}
.gal_btn_photo:hover {
    background: #c21b22;
    color: #fefefe;
}
.gal_btn_video {
    background: #ff0000;
    color: #fefefe;
}
.gal_btn_video:hover {
    background: #cc0000;
    color: #fefefe;
    transform: scale(1.05);
}

/* ── LIGHTBOX MODAL ───────────────────────────────────────── */
.lightbox_backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.92);
    z-index: 9000;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s;
}
.lightbox_backdrop.active { opacity: 1; visibility: visible; }

.lightbox_modal {
    position: fixed;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%) scale(0.92);
    z-index: 9001;
    width: 90vw;
    max-width: 1000px;
    background: #000000;
    border-radius: 10px;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transition: all 0.35s cubic-bezier(0.34,1.56,0.64,1);
}
.lightbox_modal.active {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, -50%) scale(1);
}

.lb_img_wrap {
    position: relative;
    width: 100%;
    max-height: 72vh;
    background: #0a0a0a;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.lb_img_wrap img {
    width: 100%;
    max-height: 72vh;
    object-fit: contain;
    display: block;
    transition: opacity 0.3s;
}
.lb_loader {
    position: absolute;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: #c21b22;
}

.lb_caption {
    padding: 18px 24px;
    background: #000000;
    border-top: 1px solid rgba(254,254,254,0.08);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}
.lb_caption h5 { color: #fefefe; font-size: 16px; font-weight: 700; margin: 0; }
.lb_caption p  { color: #595758; font-size: 13px; margin: 4px 0 0; }
.lb_counter    { color: #c21b22; font-size: 13px; font-weight: 700; white-space: nowrap; }

/* Thumbnail strip */
.lb_thumbs {
    display: flex;
    gap: 6px;
    padding: 10px 18px 14px;
    background: #000000;
    overflow-x: auto;
    scrollbar-width: thin;
    scrollbar-color: #c21b22 #1a1a1a;
}
.lb_thumb {
    width: 68px;
    height: 48px;
    flex-shrink: 0;
    border-radius: 4px;
    background-size: cover;
    background-position: center;
    cursor: pointer;
    opacity: 0.45;
    border: 2px solid transparent;
    transition: opacity 0.25s, border-color 0.25s, transform 0.25s;
}
.lb_thumb:hover  { opacity: 0.8; transform: scale(1.06); }
.lb_thumb.active { opacity: 1; border-color: #c21b22; }

/* Close button */
.lb_close {
    position: absolute;
    top: 14px; right: 14px;
    width: 38px; height: 38px;
    background: rgba(0,0,0,0.7);
    border: 1px solid rgba(254,254,254,0.2);
    border-radius: 50%;
    color: #fefefe;
    font-size: 16px;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    z-index: 2;
    transition: background 0.2s;
}
.lb_close:hover { background: #c21b22; border-color: #c21b22; }

/* Prev / Next buttons */
.lb_prev, .lb_next {
    position: absolute;
    top: 50%; transform: translateY(-50%);
    width: 44px; height: 44px;
    background: rgba(0,0,0,0.6);
    border: 1px solid rgba(254,254,254,0.2);
    border-radius: 50%;
    color: #fefefe;
    font-size: 16px;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    z-index: 2;
    transition: background 0.2s, transform 0.2s;
}
.lb_prev { left: 14px; }
.lb_next { right: 14px; }
.lb_prev:hover { background: #c21b22; border-color: #c21b22; transform: translateY(-50%) scale(1.1); }
.lb_next:hover { background: #c21b22; border-color: #c21b22; transform: translateY(-50%) scale(1.1); }

/* ── TESTIMONIALS SLIDER ──────────────────────────────────── */
.testi_slide_wrap { padding: 0 40px; position: relative; }
.testi_card {
    background: #fefefe;
    padding: 30px 26px;
    border: 1px solid rgba(89,87,88,0.15);
    border-top: 3px solid #c21b22;
    position: relative;
    height: 100%;
    margin: 4px;
}
.testi_card::before {
    content: '\201C';
    position: absolute;
    top: 12px; left: 18px;
    font-size: 5rem;
    font-family: Georgia, serif;
    color: #c21b22;
    opacity: 0.12;
    line-height: 0.8;
}
.testi_company { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: #c21b22; margin-bottom: 12px; }
.testi_stars { color: #c21b22; font-size: 13px; margin-bottom: 12px; }
.testi_text { font-size: 14px; color: #595758; line-height: 1.8; font-style: italic; margin-bottom: 20px; }
.testi_avatar { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; border: 2px solid rgba(254,131,2,0.3); }
.testi_name { font-size: 15px; font-weight: 700; color: #000000; }
.testi_role { font-size: 12px; color: #595758; }

/* ── CTA BOX SECTION (interio style) ──────────────────────── */
.cta_box_section {
    position: relative;
    padding: 90px 0;
    overflow: hidden;
}
.cta_box_bg {
    position: absolute;
    top: -15%; left: 0; right: 0; bottom: -15%;
    background-size: cover;
    background-position: center;
    z-index: 0;
    will-change: transform;
}
.cta_box_tint {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0.05) 0%, rgba(0,0,0,0.10) 60%, rgba(0,0,0,0.20) 100%);
    z-index: 1;
}

/* Glass box card — light frosted glass, image shows through clearly */
.cta_glass_box {
    position: relative;
    z-index: 2;
    background: rgba(15,15,15,0.22);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(254,254,254,0.18);
    border-radius: 18px;
    padding: 48px 44px;
    box-shadow: 0 30px 70px rgba(0,0,0,0.25);
}

/* Left text */
.cta_eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #c21b22;
    background: rgba(254,131,2,0.12);
    border: 1px solid rgba(254,131,2,0.3);
    padding: 6px 16px;
    border-radius: 30px;
    margin-bottom: 18px;
}
.cta_box_hd {
    font-size: 36px;
    font-weight: 800;
    color: #fefefe;
    line-height: 1.2;
    margin-bottom: 16px;
    text-shadow: 0 2px 14px rgba(0,0,0,0.5);
}
.cta_box_hd span { color: #c21b22; }
.cta_box_text {
    font-size: 15px;
    color: rgba(254,254,254,0.9);
    line-height: 1.85;
    max-width: 480px;
    margin-bottom: 24px;
    text-shadow: 0 1px 10px rgba(0,0,0,0.5);
}

/* Trust badges */
.cta_badges {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.cta_badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
    color: rgba(254,254,254,0.8);
    background: rgba(254,254,254,0.08);
    border: 1px solid rgba(254,254,254,0.14);
    padding: 6px 13px;
    border-radius: 30px;
}
.cta_badge i { color: #c21b22; font-size: 11px; }

/* Right: transparent CTA buttons */
.cta_btn_stack {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.cta_glass_btn {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    background: rgba(254,254,254,0.06);
    border: 1px solid rgba(254,254,254,0.18);
    border-radius: 12px;
    text-decoration: none;
    transition: all 0.3s;
    position: relative;
    overflow: hidden;
}
.cta_glass_btn.primary {
    background: #c21b22;
    border-color: #c21b22;
}
.cta_glass_btn:hover {
    background: rgba(254,131,2,0.85);
    border-color: #c21b22;
    transform: translateX(5px);
}
.cta_glass_btn.primary:hover {
    background: #000000;
    border-color: #000000;
}
.cta_btn_ic {
    width: 46px; height: 46px;
    flex-shrink: 0;
    border-radius: 10px;
    background: rgba(254,254,254,0.14);
    color: #fefefe;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    transition: all 0.3s;
}
.cta_glass_btn.primary .cta_btn_ic { background: rgba(0,0,0,0.18); }
.cta_btn_txt { flex: 1; display: flex; flex-direction: column; line-height: 1.3; }
.cta_btn_txt strong { color: #fefefe; font-size: 15px; font-weight: 700; }
.cta_btn_txt small  { color: rgba(254,254,254,0.7); font-size: 12px; }
.cta_btn_arrow {
    color: rgba(254,254,254,0.6);
    font-size: 13px;
    transition: transform 0.3s, color 0.3s;
}
.cta_glass_btn:hover .cta_btn_arrow { color: #fefefe; transform: translateX(4px); }

/* ════════════════════════════════════════════════════════════
   INNER PAGES — Contact, Products, Services, Projects, Clients, Blog
   ════════════════════════════════════════════════════════════ */

/* ── Contact info cards ───────────────────────────────────── */
.contact_info_card {
    display: block;
    text-align: center;
    background: #fefefe;
    border: 1px solid rgba(89,87,88,0.12);
    border-radius: 12px;
    padding: 32px 22px;
    height: 100%;
    text-decoration: none;
    transition: all 0.35s;
}
.contact_info_card:hover { border-color: #c21b22; transform: translateY(-5px); box-shadow: 0 16px 38px rgba(0,0,0,0.1); }
.contact_info_icon {
    width: 60px; height: 60px;
    margin: 0 auto 16px;
    border-radius: 50%;
    background: rgba(254,131,2,0.1);
    color: #c21b22;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.4rem;
    transition: all 0.35s;
}
.contact_info_card:hover .contact_info_icon { background: #c21b22; color: #fefefe; }
.contact_info_card h6 { font-size: 16px; font-weight: 700; color: #000000; margin-bottom: 8px; }
.contact_info_card p  { font-size: 13px; color: #595758; line-height: 1.7; margin: 0; }

/* Contact form + map */
.contact_split { box-shadow: 0 20px 50px rgba(0,0,0,0.08); border-radius: 14px; overflow: hidden; }
.contact_form_box { background: #fefefe; padding: 44px 40px; height: 100%; }
.contact_form_title { font-size: 24px; font-weight: 700; color: #000000; margin-bottom: 6px; }
.contact_form_sub { font-size: 14px; color: #595758; margin-bottom: 24px; }
.cf_input {
    width: 100%;
    background: #f6f6f6;
    border: 1px solid rgba(89,87,88,0.15);
    border-radius: 8px;
    padding: 13px 16px;
    font-size: 14px;
    color: #000000;
    font-family: 'Manrope', sans-serif;
    transition: border-color 0.25s, background 0.25s;
}
.cf_input::placeholder { color: #595758; }
.cf_input:focus { outline: none; border-color: #c21b22; background: #fefefe; }
textarea.cf_input { resize: vertical; }
.contact_alert {
    background: rgba(37,211,102,0.12);
    border: 1px solid rgba(37,211,102,0.4);
    color: #1da851;
    border-radius: 8px;
    padding: 12px 16px;
    font-size: 14px;
    margin-bottom: 18px;
}
.contact_map { height: 100%; min-height: 520px; }
.contact_map iframe { display: block; width: 100%; height: 100%; filter: grayscale(20%); }

/* WhatsApp strip */
.contact_wa_strip { background: #000000; padding: 40px 0; }
.contact_wa_strip h3 { color: #fefefe; font-size: 22px; font-weight: 700; margin-bottom: 4px; }
.contact_wa_strip p { color: rgba(254,254,254,0.6); font-size: 14px; margin: 0; }
.contact_wa_btn {
    display: inline-flex; align-items: center; gap: 8px;
    background: #25d366; color: #fefefe;
    font-size: 14px; font-weight: 700;
    padding: 13px 26px; border-radius: 8px;
    transition: all 0.3s;
}
.contact_wa_btn:hover { background: #1da851; color: #fefefe; transform: translateY(-2px); }

/* ── Product / category cards (listing) ───────────────────── */
.bggrid_card {
    display: block;
    background: #fefefe;
    border: 1px solid rgba(89,87,88,0.12);
    border-radius: 14px;
    overflow: hidden;
    text-decoration: none;
    transition: all 0.35s;
    height: 100%;
}
.bggrid_card:hover { border-color: #c21b22; transform: translateY(-6px); box-shadow: 0 18px 44px rgba(0,0,0,0.12); }
.bggrid_card_img { position: relative; height: 240px; overflow: hidden; }
.bggrid_card_img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.7s ease; }
.bggrid_card:hover .bggrid_card_img img { transform: scale(1.08); }
.bggrid_card_ic {
    position: absolute; top: 14px; left: 14px;
    width: 44px; height: 44px;
    background: #c21b22; color: #fefefe;
    border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.1rem;
}
.bggrid_card_over {
    position: absolute; inset: 0;
    background: rgba(0,0,0,0.55);
    display: flex; align-items: center; justify-content: center;
    opacity: 0; transition: opacity 0.35s;
}
.bggrid_card:hover .bggrid_card_over { opacity: 1; }
.bggrid_card_over span {
    background: #c21b22; color: #fefefe;
    font-size: 12px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase;
    padding: 10px 20px; border-radius: 4px;
}
.bggrid_card_body { padding: 22px; }
.bggrid_card_body h5 { font-size: 17px; font-weight: 700; color: #000000; margin-bottom: 8px; }
.bggrid_card_body p { font-size: 13px; color: #595758; line-height: 1.7; margin: 0; }

/* ── Product detail gallery ───────────────────────────────── */
.pd_main_img { border-radius: 14px; overflow: hidden; box-shadow: 0 20px 50px rgba(0,0,0,0.12); margin-bottom: 14px; }
.pd_main_img img { width: 100%; height: 440px; object-fit: cover; display: block; }
.pd_thumbs { display: flex; gap: 10px; flex-wrap: wrap; }
.pd_thumb {
    width: 90px; height: 64px;
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer; opacity: 0.55;
    border: 2px solid transparent;
    transition: all 0.25s;
}
.pd_thumb:hover { opacity: 0.85; }
.pd_thumb.active { opacity: 1; border-color: #c21b22; }
.pd_thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pd_subhead { font-size: 14px; font-weight: 700; color: #000000; margin: 4px 0 12px; letter-spacing: 0.3px; }
/* Download catalogue highlight (product detail) */
.pd_catalogue {
    display: flex;
    align-items: center;
    gap: 16px;
    background: linear-gradient(135deg, #1a1a1a 0%, #2a2a2a 100%);
    border: 1px solid rgba(254,131,2,0.4);
    border-radius: 12px;
    padding: 16px 20px;
    text-decoration: none;
    margin: 4px 0 4px;
    transition: all 0.3s;
    position: relative;
    overflow: hidden;
}
.pd_catalogue::before {
    content: '';
    position: absolute;
    top: 0; left: -120%;
    width: 60%; height: 100%;
    background: linear-gradient(120deg, transparent, rgba(254,131,2,0.25), transparent);
    transform: skewX(-20deg);
    transition: left 0.6s ease;
}
.pd_catalogue:hover { border-color: #c21b22; transform: translateY(-2px); box-shadow: 0 12px 30px rgba(0,0,0,0.18); }
.pd_catalogue:hover::before { left: 130%; }
.pd_catalogue_ic {
    width: 48px; height: 48px;
    flex-shrink: 0;
    border-radius: 10px;
    background: #c21b22;
    color: #fefefe;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.3rem;
}
.pd_catalogue_txt { flex: 1; display: flex; flex-direction: column; line-height: 1.3; }
.pd_catalogue_txt strong { color: #fefefe; font-size: 15px; font-weight: 700; }
.pd_catalogue_txt small { color: rgba(254,254,254,0.6); font-size: 12px; }
.pd_catalogue_arrow { color: #c21b22; font-size: 16px; animation: pdDlBounce 1.6s ease-in-out infinite; }
@keyframes pdDlBounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(4px); } }

/* Smaller, equal-sized buttons in the product action row */
.pd_actions .linkbtn,
.pd_actions .linkbtn_outline,
.pd_actions .pd_cat_btn {
    padding: 7px 15px;
    font-size: 10.5px;
    letter-spacing: 1px;
    gap: 6px;
}
.pd_actions .linkbtn i,
.pd_actions .linkbtn_outline i,
.pd_actions .pd_cat_btn i { font-size: 12px; }

/* Inline animated catalogue button (in the action row) */
.pd_cat_btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    position: relative;
    overflow: hidden;
    padding: 7px 15px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #fefefe;
    background: linear-gradient(135deg, #1a1a1a 0%, #2a2a2a 100%);
    border: 1px solid #c21b22;
    text-decoration: none;
    z-index: 1;
    animation: pdCatGlow 2.2s ease-in-out infinite;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.pd_cat_btn::before {
    content: '';
    position: absolute;
    top: 0; left: -130%;
    width: 55%; height: 100%;
    background: linear-gradient(120deg, transparent, rgba(254,131,2,0.45), transparent);
    transform: skewX(-20deg);
    animation: pdCatShine 2.8s ease-in-out infinite;
    z-index: -1;
}
.pd_cat_btn i.fa-file-pdf { color: #c21b22; font-size: 14px; }
.pd_cat_btn .pd_cat_dl { color: #c21b22; animation: pdDlBounce 1.4s ease-in-out infinite; }
.pd_cat_btn:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(254,131,2,0.45); }
@keyframes pdCatShine { 0% { left: -130%; } 55%, 100% { left: 130%; } }
@keyframes pdCatGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(254,131,2,0); }
    50%      { box-shadow: 0 0 18px 0 rgba(254,131,2,0.5); }
}

/* ── Product variants — detailed rows (product detail) ────── */
.variant_row { padding: 36px 0; border-bottom: 1px dashed rgba(89,87,88,0.2); }
.variant_row:last-child { border-bottom: none; }
.variant_img {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0,0,0,0.12);
}
.variant_img img { width: 100%; height: 320px; object-fit: cover; display: block; transition: transform 0.7s ease; }
.variant_img:hover img { transform: scale(1.05); }
.variant_model_tag {
    position: absolute; top: 16px; left: 16px;
    background: #c21b22;
    color: #fefefe;
    font-size: 12px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase;
    padding: 6px 16px;
    border-radius: 30px;
    box-shadow: 0 6px 16px rgba(254,131,2,0.4);
}
.variant_title { font-size: 16px; font-weight: 700; color: #000000; line-height: 1.4; margin: 5px 0 0; }
.variant_features { list-style: none; margin: 0 0 16px; padding: 0; }
.variant_features li {
    display: flex; align-items: flex-start; gap: 9px;
    font-size: 12px; color: #595758; line-height: 1.5; padding: 4px 0;
    border-bottom: 1px solid rgba(89,87,88,0.08);
}
.variant_features li:last-child { border-bottom: none; }
.variant_features li i { color: #c21b22; font-size: 15px; margin-top: 3px; flex-shrink: 0; }
.variant_features li strong { color: #000000; font-weight: 700; }
.variant_row .about_para { font-size: 13px; line-height: 1.65; }
.variant_row .sec_eyebrow { font-size: 11px; }
.variant_row .pd_subhead { font-size: 12.5px; }
/* smaller per-model enquire button */
.variant_row .pd_actions .linkbtn { padding: 6px 13px; font-size: 9.5px; letter-spacing: 0.5px; }
.variant_row .pd_actions .linkbtn i { font-size: 11px; }
@media (max-width: 991px) {
    .variant_img img { height: 260px; }
    .variant_title { font-size: 15px; }
}

.pd_points { list-style: none; margin: 0 0 24px; padding: 0; }
.pd_points li { display: flex; align-items: center; gap: 10px; font-size: 14px; color: #000000; font-weight: 500; padding: 6px 0; }
.pd_points li i { width: 20px; height: 20px; background: rgba(254,131,2,0.12); color: #c21b22; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 9px; flex-shrink: 0; }

/* ── Wide service cards (services listing) ────────────────── */
.service_wide_card {
    display: flex;
    gap: 20px;
    background: #fefefe;
    border: 1px solid rgba(89,87,88,0.12);
    border-radius: 14px;
    padding: 30px 28px;
    text-decoration: none;
    height: 100%;
    position: relative;
    overflow: hidden;
    transition: all 0.35s;
}
.service_wide_card:hover { border-color: #c21b22; transform: translateY(-5px); box-shadow: 0 16px 40px rgba(0,0,0,0.1); }
.service_wide_num {
    position: absolute; top: 16px; right: 22px;
    font-size: 42px; font-weight: 800;
    color: rgba(89,87,88,0.07);
    transition: color 0.35s;
}
.service_wide_card:hover .service_wide_num { color: rgba(254,131,2,0.15); }
.service_wide_ic {
    width: 60px; height: 60px; flex-shrink: 0;
    border-radius: 12px;
    background: rgba(254,131,2,0.1); color: #c21b22;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.5rem;
    transition: all 0.35s;
}
.service_wide_card:hover .service_wide_ic { background: #c21b22; color: #fefefe; transform: rotate(-6deg); }
.service_wide_body h5 { font-size: 18px; font-weight: 700; color: #000000; margin-bottom: 8px; }
.service_wide_body p { font-size: 14px; color: #595758; line-height: 1.7; margin-bottom: 14px; }

/* ── Portfolio filters ────────────────────────────────────── */
.portfolio_filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin: 28px 0 38px;
}
.pf_btn {
    background: transparent;
    border: 1px solid rgba(89,87,88,0.25);
    color: #595758;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    padding: 9px 22px;
    border-radius: 30px;
    cursor: pointer;
    transition: all 0.3s;
}
.pf_btn:hover { border-color: #c21b22; color: #c21b22; }
.pf_btn.active {
    background: #c21b22;
    border-color: #c21b22;
    color: #fefefe;
}
/* fade-in on filter */
.portfolio_item.pf_show .project_card { animation: pfFade 0.5s ease both; }
@keyframes pfFade {
    0%   { opacity: 0; transform: scale(0.94); }
    100% { opacity: 1; transform: scale(1); }
}
.portfolio_empty {
    text-align: center;
    padding: 50px 0;
    color: #595758;
}
.portfolio_empty i { font-size: 2.5rem; color: rgba(89,87,88,0.3); margin-bottom: 14px; display: block; }
.portfolio_empty p { font-size: 15px; margin: 0; }

/* ── Project cards ────────────────────────────────────────── */
.project_card {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    height: 300px;
    cursor: pointer;
}
.project_card img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.7s ease; }
.project_card:hover img { transform: scale(1.1); }
.project_card_over {
    position: absolute; inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.1) 60%, transparent 100%);
    display: flex; flex-direction: column; justify-content: flex-end;
    padding: 22px;
    transform: translateY(12px);
    transition: transform 0.35s;
}
.project_card:hover .project_card_over { transform: translateY(0); }
.project_tag {
    align-self: flex-start;
    background: #c21b22; color: #fefefe;
    font-size: 11px; font-weight: 700; letter-spacing: 0.5px;
    padding: 4px 12px; border-radius: 20px; margin-bottom: 10px;
}
.project_card_over h5 { color: #fefefe; font-size: 17px; font-weight: 700; margin-bottom: 4px; }
.project_card_over p { color: rgba(254,254,254,0.7); font-size: 13px; margin: 0; }

/* ── Client grid ──────────────────────────────────────────── */
.client_grid_item {
    background: #fefefe;
    border: 1px solid #c21b22;
    border-radius: 10px;
    height: 100px;
    display: flex; align-items: center; justify-content: center;
    padding: 18px;
    box-shadow: 0 8px 22px rgba(254,131,2,0.12);
    transition: all 0.3s;
}
.client_grid_item:hover { box-shadow: 0 12px 28px rgba(254,131,2,0.2); transform: translateY(-3px); }
.client_grid_item img { max-height: 50px; max-width: 100%; object-fit: contain; filter: grayscale(0%) opacity(1); }

/* ── Blog cards ───────────────────────────────────────────── */
.blog_card {
    display: block;
    background: #fefefe;
    border: 1px solid rgba(89,87,88,0.12);
    border-radius: 14px;
    overflow: hidden;
    text-decoration: none;
    height: 100%;
    transition: all 0.35s;
}
.blog_card:hover { border-color: #c21b22; transform: translateY(-6px); box-shadow: 0 18px 44px rgba(0,0,0,0.12); }
.blog_card_img { position: relative; height: 210px; overflow: hidden; }
.blog_card_img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.7s ease; }
.blog_card:hover .blog_card_img img { transform: scale(1.08); }
.blog_tag {
    position: absolute; top: 14px; left: 14px;
    background: #c21b22; color: #fefefe;
    font-size: 11px; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase;
    padding: 5px 12px; border-radius: 4px;
}
.blog_card_body { padding: 22px; }
.blog_date { font-size: 12px; color: #595758; display: block; margin-bottom: 8px; }
.blog_card_body h5 { font-size: 17px; font-weight: 700; color: #000000; line-height: 1.4; margin-bottom: 10px; }
.blog_card_body p { font-size: 13px; color: #595758; line-height: 1.7; margin-bottom: 14px; }

/* ── CTA 2 — clean dark split ─────────────────────────────── */
.cta2 { padding: 80px 0; background: #f6f6f6; }
.cta2_inner {
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 25px 60px rgba(0,0,0,0.18);
}
/* Left — dark with a faint wood texture blended in for warmth */
.cta2_left {
    padding: 52px 48px;
    height: 100%;
    position: relative;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(20,14,8,0.78) 0%, rgba(32,22,13,0.74) 100%),
        url('../images/wooden-texture.png') center/cover no-repeat;
}
.cta2_left::before {
    content: '';
    position: absolute;
    top: -100px; right: -100px;
    width: 320px; height: 320px;
    background: radial-gradient(circle, rgba(254,131,2,0.2) 0%, transparent 70%);
    pointer-events: none;
}
.cta2_eyebrow {
    display: inline-block;
    font-size: 12px; font-weight: 700;
    letter-spacing: 3px; text-transform: uppercase;
    color: #c21b22;
    margin-bottom: 14px;
}
.cta2_hd {
    font-size: 34px; font-weight: 800;
    color: #fefefe; line-height: 1.2;
    margin-bottom: 16px;
    text-shadow: 0 2px 16px rgba(0,0,0,0.6);
}
.cta2_hd span { color: #c21b22; }
.cta2_text {
    font-size: 15px; color: rgba(254,254,254,0.85);
    line-height: 1.85; margin-bottom: 26px;
    max-width: 460px;
    text-shadow: 0 1px 10px rgba(0,0,0,0.5);
}
.cta2_stats {
    display: flex; flex-wrap: wrap; gap: 28px;
    margin-bottom: 30px;
}
.cta2_stat strong { display: block; font-size: 1.8rem; font-weight: 800; color: #c21b22; line-height: 1; }
.cta2_stat span { font-size: 12px; color: rgba(254,254,254,0.55); letter-spacing: 0.5px; }
.cta2_main_btn {
    display: inline-flex; align-items: center; gap: 8px;
    background: #c21b22; color: #fefefe;
    font-size: 13px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase;
    padding: 14px 30px; border-radius: 6px;
    transition: all 0.3s;
}
.cta2_main_btn:hover { background: #fefefe; color: #000000; transform: translateY(-2px); }

/* Right — dark with a faint wood texture blended in */
.cta2_right {
    padding: 44px 36px;
    height: 100%;
    border-left: 3px solid #c21b22;
    background:
        linear-gradient(135deg, rgba(28,20,12,0.76) 0%, rgba(44,30,18,0.72) 100%),
        url('../images/wooden-texture.png') center/cover no-repeat;
}
.cta2_right h4 {
    color: #fefefe; font-size: 19px; font-weight: 700;
    margin-bottom: 22px;
}
.cta2_contact {
    display: flex; align-items: center; gap: 14px;
    padding: 13px 0;
    border-bottom: 1px solid rgba(254,254,254,0.1);
    transition: all 0.3s;
}
.cta2_contact:last-child { border-bottom: none; }
.cta2_contact:hover { padding-left: 8px; }
.cta2_contact_ic {
    width: 44px; height: 44px; flex-shrink: 0;
    border-radius: 10px;
    background: rgba(254,131,2,0.12); color: #c21b22;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.1rem;
    transition: all 0.3s;
}
.cta2_contact:hover .cta2_contact_ic { background: #c21b22; color: #fefefe; }
.cta2_contact.wa:hover .cta2_contact_ic { background: #25d366; }
.cta2_contact small { display: block; font-size: 11px; color: rgba(254,254,254,0.5); letter-spacing: 0.5px; text-transform: uppercase; }
.cta2_contact strong { display: block; font-size: 14.5px; color: #fefefe; font-weight: 600; }

/* ── MANUFACTURING / INFRASTRUCTURE ───────────────────────── */
.infra_section { background: #f6f6f6; }
.infra_img {
    position: relative;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 25px 55px rgba(0,0,0,0.15);
}
.infra_img img {
    width: 100%;
    /* height: 440px; */
    object-fit: cover;
    display: block;
    transition: transform 0.8s ease;
}
.infra_img:hover img { transform: scale(1.05); }
.infra_img_badge {
    position: absolute;
    left: 18px; bottom: 18px;
    background: #c21b22;
    color: #fefefe;
    border-radius: 12px;
    padding: 14px 20px;
    text-align: center;
    box-shadow: 0 10px 26px rgba(254,131,2,0.45);
}
.infra_img_badge strong { display: block; font-size: 2rem; font-weight: 800; line-height: 1; }
.infra_img_badge span { font-size: 11px; font-weight: 600; letter-spacing: 0.5px; text-transform: uppercase; }
.infra_feat {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 16px;
    background: #fefefe;
    border: 1px solid rgba(89,87,88,0.1);
    border-radius: 12px;
    height: 100%;
    transition: all 0.3s;
}
.infra_feat:hover { border-color: #c21b22; box-shadow: 0 10px 26px rgba(0,0,0,0.07); transform: translateY(-3px); }
.infra_feat_ic {
    width: 44px; height: 44px;
    flex-shrink: 0;
    border-radius: 10px;
    background: rgba(254,131,2,0.1);
    color: #c21b22;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.15rem;
    transition: all 0.3s;
}
.infra_feat:hover .infra_feat_ic { background: #c21b22; color: #fefefe; }
.infra_feat h6 { font-size: 14px; font-weight: 700; color: #000000; margin-bottom: 3px; }
.infra_feat p { font-size: 12px; color: #595758; line-height: 1.55; margin: 0; }

/* ── MATERIALS & QUALITY ──────────────────────────────────── */
.material_card {
    background: #fefefe;
    border: 1px solid rgba(89,87,88,0.12);
    border-radius: 14px;
    padding: 32px 24px;
    text-align: center;
    height: 100%;
    transition: all 0.35s;
}
.material_card:hover {
    border-color: #c21b22;
    transform: translateY(-6px);
    box-shadow: 0 16px 40px rgba(0,0,0,0.1);
}
.material_ic {
    width: 70px; height: 70px;
    margin: 0 auto 18px;
    border-radius: 50%;
    background: rgba(254,131,2,0.1);
    color: #c21b22;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.7rem;
    transition: all 0.35s;
}
.material_card:hover .material_ic { background: #c21b22; color: #fefefe; transform: rotate(-6deg); }
.material_card h5 { font-size: 16px; font-weight: 700; color: #000000; margin-bottom: 10px; }
.material_card p { font-size: 13px; color: #595758; line-height: 1.7; margin: 0; }

/* Finish swatches */
.material_finishes {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    justify-content: center;
    margin-top: 44px;
    padding: 20px 26px;
    background: #fefefe;
    border: 1px solid rgba(89,87,88,0.12);
    border-radius: 50px;
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
}
.material_finishes_label { font-size: 13px; font-weight: 700; color: #000000; letter-spacing: 0.3px; }
.swatch {
    width: 30px; height: 30px;
    border-radius: 50%;
    border: 2px solid #fefefe;
    box-shadow: 0 0 0 1px rgba(89,87,88,0.2);
    cursor: pointer;
    transition: transform 0.25s;
}
.swatch:hover { transform: scale(1.2); }
.material_finishes_note { font-size: 12px; color: #595758; font-style: italic; margin-left: 4px; }

/* ── FOOTER ───────────────────────────────────────────────── */
footer { width: 100%; background: #000000; position: relative; }
footer .footer_logo img { height: 64px; width: auto; }
footer .footer_desc { font-size: 13px; color: rgba(255,255,255,0.55); line-height: 1.9; max-width: 320px; margin-bottom: 20px; }
.foot_sect_title { color: #fefefe; font-size: 15px; font-weight: 700; letter-spacing: 0.5px; margin-bottom: 20px; }
.foot_nav_link ul { margin: 0; padding: 0; width: 100%; }
.foot_nav_link ul li { display: block; width: 100%; margin-bottom: 12px; }
.foot_nav_link ul li a {
    color: rgba(255,255,255,0.55);
    font-size: 13px;
    display: inline-block;
    position: relative;
    transition: color 0.3s;
    letter-spacing: 0.3px;
}
.foot_nav_link ul li a::before {
    content: '';
    position: absolute;
    right: 0; bottom: 0;
    width: 0; height: 0.5px;
    background: #c21b22;
    transition: all 0.5s ease;
}
.foot_nav_link ul li a:hover { color: #fefefe; }
.foot_nav_link ul li a:hover::before { width: 100%; right: unset; left: 0; }
.footer_contact_item {
    display: flex; gap: 12px;
    align-items: flex-start;
    font-size: 13px;
    color: rgba(255,255,255,0.55);
    padding: 5px 0;
}
.footer_contact_item i { color: #c21b22; margin-top: 2px; flex-shrink: 0; }
.footer_contact_item a { color: rgba(255,255,255,0.55); transition: color 0.2s; }
.footer_contact_item a:hover { color: #c21b22; }
.mediaicon { margin-top: 22px; }
.mediaicon a {
    width: 30px; height: 30px;
    margin-right: 6px;
    background: transparent;
    border: 1px solid rgba(255,255,255,0.3);
    border-radius: 100px;
    display: inline-flex;
    justify-content: center; align-items: center;
    transition: all 0.4s;
}
.mediaicon a i { font-size: 12px; color: rgba(255,255,255,0.6); transition: color 0.3s; }
.mediaicon a:hover { background: #c21b22; border-color: #c21b22; }
.mediaicon a:hover i { color: #fefefe; }
.foot_cert_badge {
    display: inline-flex; align-items: center; gap: 5px;
    background: rgba(254,131,2,0.1);
    border: 1px solid rgba(254,131,2,0.2);
    color: #c21b22;
    font-size: 11px; font-weight: 700;
    letter-spacing: 0.5px;
    padding: 4px 10px;
    border-radius: 2px;
    margin: 2px;
}
.copyright_wrap {
    width: 100%;
    border-top: 1px solid rgba(255,255,255,0.1);
    padding: 14px 0;
    background: #000000;
    margin-top: 0;
}
.copyright_wrap .copyright_text {
    display: flex;
    justify-content: space-between;
    align-items: center !important;
    flex-wrap: wrap;
    gap: 8px;
}
.copyright_wrap .copyright_text p { color: rgba(255,255,255,0.4); font-size: 12px; margin: 0; }
.copyright_wrap .copyright_text a { color: rgba(255,255,255,0.4); font-size: 12px; transition: color 0.2s; }
.copyright_wrap .copyright_text a:hover { color: #c21b22; }

/* ── FLOATING ACTION BUTTONS (expandable pills) ───────────── */
.float_btn {
    position: fixed;
    right: 22px;
    height: 50px;
    width: 50px;               /* collapsed = circle */
    border-radius: 25px;
    display: flex;
    align-items: center;
    overflow: hidden;
    z-index: 998;
    text-decoration: none;
    color: #fefefe;
    white-space: nowrap;
    border: none;
    cursor: pointer;
    padding: 0;
    transition: width 0.35s cubic-bezier(0.34,1.3,0.64,1), box-shadow 0.25s;
}
.float_btn > i {
    width: 50px;
    flex-shrink: 0;
    text-align: center;
    font-size: 21px;
    line-height: 50px;
}
.float_label {
    opacity: 0;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.4px;
    transition: opacity 0.25s;
    padding-right: 18px;
}
.float_btn:hover { width: 162px; }
.float_btn:hover .float_label { opacity: 1; }

/* WhatsApp (green, lowest) */
.float_whatsapp { bottom: 82px; background: #25d366; box-shadow: 0 4px 16px rgba(37,211,102,0.5); }
.float_whatsapp:hover { color: #fefefe; box-shadow: 0 6px 22px rgba(37,211,102,0.6); }

/* Call (grey, middle) — gentle bob + ringing icon */
.float_call { bottom: 142px; background: #595758; box-shadow: 0 4px 16px rgba(89,87,88,0.5); animation: floatBob 2.6s ease-in-out infinite; }
.float_call:hover { color: #fefefe; box-shadow: 0 6px 22px rgba(89,87,88,0.6); }
.float_call > i { animation: ringShake 1.8s ease-in-out infinite; transform-origin: 50% 55%; }

/* WhatsApp — gentle bob (offset) + glow pulse */
.float_whatsapp { animation: floatBob 2.6s ease-in-out 0.4s infinite, waGlow 2.2s ease-in-out infinite; }

/* Get a Quote (orange, top) — glow pulse + heartbeat */
.float_quote { bottom: 202px; background: #c21b22; box-shadow: 0 4px 16px rgba(254,131,2,0.5); animation: floatQuotePulse 2.2s ease-in-out infinite, floatBeat 2.6s ease-in-out 0.2s infinite; }
.float_quote:hover { color: #fefefe; box-shadow: 0 6px 22px rgba(254,131,2,0.6); animation: none; }

@keyframes floatQuotePulse {
    0%, 100% { box-shadow: 0 4px 16px rgba(254,131,2,0.5); }
    50%      { box-shadow: 0 4px 26px rgba(254,131,2,0.95); }
}
@keyframes waGlow {
    0%, 100% { box-shadow: 0 4px 16px rgba(37,211,102,0.5); }
    50%      { box-shadow: 0 4px 24px rgba(37,211,102,0.9); }
}
@keyframes floatBob {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-6px); }
}
@keyframes floatBeat {
    0%, 100%      { transform: scale(1); }
    15%           { transform: scale(1.1); }
    30%           { transform: scale(1); }
}
@keyframes ringShake {
    0%, 55%, 100% { transform: rotate(0); }
    5%            { transform: rotate(-15deg); }
    10%           { transform: rotate(13deg); }
    15%           { transform: rotate(-11deg); }
    20%           { transform: rotate(9deg); }
    25%           { transform: rotate(-5deg); }
    30%           { transform: rotate(0); }
}

/* ── MOBILE STICKY ACTION BAR ────────────────────────────── */
.mobile_action_bar { display: none; }

/* ── GET A QUOTE MODAL ───────────────────────────────────── */
.quote_backdrop {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.6);
    opacity: 0; visibility: hidden;
    transition: all 0.3s;
    z-index: 1100;
}
.quote_backdrop.active { opacity: 1; visibility: visible; }
.quote_modal {
    position: fixed;
    top: 50%; left: 50%;
    transform: translate(-50%, -46%) scale(0.96);
    width: 92%; max-width: 480px;
    max-height: 92vh; overflow-y: auto;
    background: #fefefe;
    border-radius: 16px;
    border-top: 4px solid #c21b22;
    padding: 32px 28px 26px;
    z-index: 1101;
    opacity: 0; visibility: hidden;
    transition: all 0.35s cubic-bezier(0.34,1.3,0.64,1);
    box-shadow: 0 30px 70px rgba(0,0,0,0.3);
}
.quote_modal.active { opacity: 1; visibility: visible; transform: translate(-50%, -50%) scale(1); }
.quote_close {
    position: absolute; top: 14px; right: 14px;
    width: 34px; height: 34px; border-radius: 50%;
    border: none; background: #f0f0f0; color: #000000;
    cursor: pointer; font-size: 15px;
    display: flex; align-items: center; justify-content: center;
    transition: all 0.25s;
}
.quote_close:hover { background: #c21b22; color: #fefefe; transform: rotate(90deg); }
.quote_modal_head { text-align: center; margin-bottom: 20px; }
.quote_eyebrow { color: #c21b22; font-size: 12px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; }
.quote_modal_head h4 { font-size: 24px; font-weight: 800; color: #000000; margin: 6px 0 8px; }
.quote_modal_head p { font-size: 13.5px; color: #595758; margin: 0; line-height: 1.5; }
.quote_form input, .quote_form select, .quote_form textarea {
    width: 100%;
    padding: 11px 14px;
    margin-bottom: 12px;
    border: 1px solid rgba(89,87,88,0.25);
    border-radius: 8px;
    font-size: 14px;
    font-family: inherit;
    color: #000000;
    background: #fefefe;
    transition: border-color 0.25s;
}
.quote_form input:focus, .quote_form select:focus, .quote_form textarea:focus { outline: none; border-color: #c21b22; }
.quote_form textarea { resize: vertical; }
.qf_row { display: flex; gap: 12px; }
.qf_row > * { flex: 1; }
.quote_form_note { text-align: center; font-size: 11.5px; color: #999; margin: 12px 0 0; }
.quote_form_note i { color: #c21b22; margin-right: 4px; }
@media (max-width: 480px) { .qf_row { display: block; } }

/* ── GO TO TOP ────────────────────────────────────────────── */
.go_top {
    position: fixed;
    bottom: 30px; right: 25px;
    width: 42px; height: 42px;
    background: #c21b22;
    color: #fefefe;
    border: none;
    display: none;
    align-items: center; justify-content: center;
    font-size: 18px;
    cursor: pointer;
    z-index: 999;
    transition: background 0.3s;
}
.go_top:hover { background: #000000; color: #c21b22; }
.go_top.visible { display: flex; }

/* ── RESPONSIVE ───────────────────────────────────────────── */
@media (max-width: 991px) {
    .ban_hd { font-size: 50px; }
    .ban_hd small { font-size: 16px; }
    .ban_slogan { font-size: 20px; }
    .fixedbannerfull { background-attachment: scroll; height: auto; min-height: 500px; padding: 80px 0; }
    .sec_hd, .sec_hd_dark { font-size: 28px; }
    .stat_item { border-right: 1px solid rgba(254,131,2,0.12); border-bottom: 1px solid rgba(254,131,2,0.12); }
    .stat_item:nth-child(even) { border-right: none; }
    .stat_item:nth-last-child(-n+2) { border-bottom: none; }
    .proc_flow { gap: 36px 0; }
    .proc_step { flex: 0 0 50%; }
    .proc_connector { display: none; }
    .prod_slide_wrap, .testi_slide_wrap { padding: 0 20px; }
    .service_title { font-size: 24px; }
    .service_img img { height: 300px; }
    .service_content { padding: 0; }
    .cta_box_hd { font-size: 30px; }
    .cta_btn_stack { margin-top: 24px; }
}
@media (max-width: 767px) {
    /* Hide the floating vertical stack, show sticky bottom bar */
    .float_btn { display: none; }
    .go_top { bottom: 70px; right: 14px; z-index: 1000; }
    body { padding-bottom: 60px; }
    .mobile_action_bar {
        display: flex;
        position: fixed;
        left: 0; right: 0; bottom: 0;
        z-index: 999;
        background: #fefefe;
        box-shadow: 0 -4px 20px rgba(0,0,0,0.15);
        border-top: 1px solid rgba(0,0,0,0.07);
    }
    .mab_btn {
        flex: 1;
        display: flex; flex-direction: column;
        align-items: center; justify-content: center;
        gap: 3px;
        padding: 9px 4px;
        font-size: 11px; font-weight: 700;
        text-decoration: none; border: none; background: transparent;
        cursor: pointer;
        border-right: 1px solid rgba(0,0,0,0.06);
    }
    .mab_btn:last-child { border-right: none; }
    .mab_btn i { font-size: 18px; }
    .mab_call { color: #595758; }
    .mab_call i { animation: ringShake 1.8s ease-in-out infinite; transform-origin: 50% 55%; }
    .mab_whatsapp { color: #25d366; }
    .mab_whatsapp i { animation: floatBeat 2.4s ease-in-out infinite; }
    .mab_quote { background: #c21b22; color: #fefefe; animation: mabQuoteGlow 2s ease-in-out infinite; }
    .mab_quote i { animation: floatBeat 2.2s ease-in-out 0.2s infinite; }
    @keyframes mabQuoteGlow {
        0%, 100% { background: #c21b22; }
        50%      { background: #ff9624; }
    }

    .banner { height: 100svh; }
    .caption_text { height: 100svh; }
    .ban_hd { font-size: 38px; }
    .ban_hd small { font-size: 13px; letter-spacing: 3px; }
    .ban_slogan { font-size: 17px; }
    .ban_sub { font-size: 15px; }
    .pad80 { padding: 55px 0; }
    .pad60 { padding: 40px 0; }
    .sec_hd, .sec_hd_dark { font-size: 24px; }
    .stat_num { font-size: 2.6rem; }
    .stat_item { padding: 36px 16px 30px; }
    /* Compact top bar on mobile: phone + email | Get Quote + socials (wraps if needed) */
    .top_bar_strip { padding: 7px 0; }
    .top_bar_strip .container > .d-flex { justify-content: center !important; flex-wrap: wrap; gap: 6px 10px; }
    .topbar_quote { display: inline-flex !important; padding: 3px 10px; font-size: 10px; gap: 5px; }
    .topbar_quote .d-sm-inline { display: inline !important; }  /* show "Get a Quote" text */
    .topbar_quote i { font-size: 10px; }
    .topbar_text { font-size: 10.5px; }
    .topbar_item { padding-right: 0; }
    .top_bar_strip .topbar_sep { margin: 0 5px; }
    .topbar_social { width: 22px; height: 22px; font-size: 10px; }
    .top_bar_strip .gap-2 { gap: 4px !important; }
    .hero_trust { gap: 14px; }
    .hero_trust_item { font-size: 12px; }
    .proc_step { flex: 0 0 100%; }
    .proc_circle { width: 80px; height: 80px; font-size: 1.7rem; }
    .service_img img { height: 250px; }
    .service_title { font-size: 22px; }
    .service_row { margin-bottom: 36px !important; }
    .cta2 { padding: 50px 0; background-attachment: scroll; }
    .cta2_left, .cta2_right { padding: 34px 26px; }
    .cta2_hd { font-size: 26px; }
    .cta2_stats { gap: 20px; }
    .material_finishes { border-radius: 16px; }
    .cta_box_section { padding: 55px 0; }
    .cta_glass_box { padding: 30px 22px; }
    .cta_box_hd { font-size: 26px; }
    .cta_btn_stack { margin-top: 10px; }
    .page_banner { padding: 120px 0 50px; }
    .page_banner_hd { font-size: 30px; }
    .founder_img img { height: 340px; }
    .about_band_hd { font-size: 26px; }
    .about_band_img.main { width: 100%; height: 320px; }
    .about_band_img.sub { width: 48%; height: 180px; right: 0; bottom: 20px; }
    .about_band_imgs { padding: 0 0 40px 0; margin-bottom: 20px; }
}
@media (max-width: 576px) {
    .ban_hd { font-size: 32px; }
    .ban_slogan { font-size: 15px; }
    .linkbtn, .linkbtn_outline { padding: 10px 20px; font-size: 12px; }
}
