:root {
    --theme-color: #CDDE4F;
    --neon-cyan: #00f3ff;
    --neon-pink: #ff00ea;
    --bg-dark: #050508;
    --bg-card: rgba(10, 10, 15, 0.7);
    --glass-bg: rgba(0, 243, 255, 0.05);
    --glass-border: rgba(0, 243, 255, 0.3);
    --text-main: #ffffff;
    --text-muted: #b0b0c0;
    --glow-primary: 0 0 15px rgba(205, 222, 79, 0.6), 0 0 30px rgba(205, 222, 79, 0.2);
    --glow-cyan: 0 0 15px rgba(0, 243, 255, 0.6), 0 0 30px rgba(0, 243, 255, 0.2);
    --glow-pink: 0 0 15px rgba(255, 0, 234, 0.6), 0 0 30px rgba(255, 0, 234, 0.2);
    
    /* Cyber grid pattern */
    --cyber-grid: 
        linear-gradient(rgba(0, 243, 255, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 243, 255, 0.05) 1px, transparent 1px);
}

/* ==========================================================================
   Base & Reset
   ========================================================================== */
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { 
    max-width: 100vw;
    overflow-x: hidden; 
}
body { 
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", sans-serif;
    background-color: var(--bg-dark); 
    background-image: var(--cyber-grid);
    background-size: 40px 40px;
    background-attachment: fixed;
    color: var(--text-main); 
    -webkit-font-smoothing: antialiased; 
    position: relative;
}
a { text-decoration: none; color: inherit; transition: 0.3s; }
a:hover { color: var(--neon-cyan); text-shadow: var(--glow-cyan); }
ul { list-style: none; padding: 0; margin: 0; }
img { max-width: 100%; height: auto; }
p { color: var(--text-muted); line-height: 1.8; font-size: 16px; margin-bottom: 15px; }
h1, h2, h3, h4, h5, h6 { color: var(--text-main); font-weight: 700; line-height: 1.2; margin-bottom: 15px; }

/* Utilities */
.gap { padding: 120px 0; }
.no-top { padding-top: 0; }
.no-bottom { padding-bottom: 0; }
.text_invert { color: var(--text-main) !important; text-shadow: var(--glow-cyan); }
.bg-black { background-color: transparent !important; }
.wrapper { background-color: transparent !important; margin-bottom: 0 !important; width: 100%; overflow: hidden; } 

/* ==========================================================================
   Buttons (Cyberpunk Style)
   ========================================================================== */
.button-wrapper { display: inline-flex; align-items: center; gap: 0; position: relative; border-radius: 50px; background: transparent; transition: 0.3s; z-index: 1;}
.button-arrow-wrapper { width: 50px; height: 50px; background: var(--neon-cyan); box-shadow: var(--glow-cyan); border-radius: 50%; display: flex; align-items: center; justify-content: center; z-index: 2; transition: 0.3s; }
.button-arrow-wrapper svg { width: 16px; height: 16px; fill: #000; transition: 0.3s; }
.button-main { background: var(--neon-cyan); box-shadow: var(--glow-cyan); color: #000; padding: 0 30px; height: 50px; display: flex; align-items: center; justify-content: center; border-radius: 0 50px 50px 0; font-weight: 700; font-size: 15px; transform: translateX(-20px); z-index: 1; transition: 0.3s; text-transform: uppercase; letter-spacing: 1px;}
.button-wrapper:hover .button-arrow-wrapper { background: var(--neon-pink); box-shadow: var(--glow-pink); transform: translateX(5px); }
.button-wrapper:hover .button-main { background: var(--neon-pink); box-shadow: var(--glow-pink); color: #fff;}

/* ==========================================================================
   Header & Navigation
   ========================================================================== */
header { position: fixed; top: 20px; left: 0; right: 0; width: 100%; max-width: 100vw; z-index: 1000; transition: 0.4s; }
.top-bar { position: relative; background: var(--glass-bg); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border: 1px solid var(--glass-border); border-bottom: 2px solid var(--neon-cyan); box-shadow: 0 5px 15px rgba(0,243,255,0.1); border-radius: 100px; padding: 10px 25px; display: flex; align-items: center; justify-content: space-between; margin: 0 15px;}
.logo img { max-height: 60px; width: auto; filter: drop-shadow(0 0 10px rgba(255,255,255,0.5));}
.header-left { display: flex; align-items: center; }
.header-left nav ul { display: flex; gap: 35px; }
.header-left nav ul li a { font-size: 15px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--text-main); text-shadow: 0 0 5px rgba(255,255,255,0.3);}
.header-left nav ul li a:hover { color: var(--neon-cyan); text-shadow: var(--glow-cyan); }
.header-btn { margin-left: 40px; }
.mobile-nav-toggle { display: none; flex-direction: column; gap: 6px; background: none; border: none; cursor: pointer; z-index: 1001; }
.mobile-nav-toggle span { width: 30px; height: 2px; background: var(--neon-cyan); box-shadow: var(--glow-cyan); transition: 0.3s; display: block; border-radius: 2px;}
.mobile-nav-toggle.active span:nth-child(1) { transform: rotate(45deg) translate(5px, 6px); }
.mobile-nav-toggle.active span:nth-child(2) { opacity: 0; }
.mobile-nav-toggle.active span:nth-child(3) { transform: rotate(-45deg) translate(5px, -6px); }

/* ==========================================================================
   Hero Section
   ========================================================================== */
.hero-section { position: relative; padding: 220px 0 120px; background: radial-gradient(circle at 50% 0%, rgba(0, 243, 255, 0.1) 0%, transparent 60%); }
.hero-text h1 { font-size: 72px; font-weight: 800; letter-spacing: -1px; max-width: 900px; line-height: 1.1; margin-bottom: 40px; text-shadow: 0 0 20px rgba(255,255,255,0.3); }
.hero-text h1 span { color: var(--neon-cyan); text-shadow: var(--glow-cyan); }
.bottom-style { margin-top: 50px; }
.tet-style { display: flex; align-items: center; gap: 20px; border-left: 3px solid var(--neon-pink); box-shadow: -5px 0 15px rgba(255,0,234,0.3); padding-left: 20px; max-width: 500px; }
.tet-style img { width: 50px; animation: spin 5s linear infinite; filter: drop-shadow(0 0 10px rgba(255,255,255,0.8));}
.hero-shap img { position: absolute; z-index: -1; filter: drop-shadow(0 0 15px var(--theme-color)) hue-rotate(90deg); opacity: 0.8;}
.shap-one { top: 5%; right: -5%; width: 400px; animation: float 4s ease-in-out infinite; }
.shap-two { top: 30%; left: -5%; width: 300px; animation: float 6s ease-in-out infinite reverse; filter: drop-shadow(0 0 20px var(--neon-pink)) hue-rotate(270deg) !important;}
.shap-three { bottom: 10%; right: 20%; width: 150px; animation: spin 10s linear infinite; filter: drop-shadow(0 0 15px var(--neon-cyan)) !important;}

/* ==========================================================================
   Common Card Styles & Grids
   ========================================================================== */
.branding-style, .services-style, .workflow, .experience, .project-style, .project-img { 
    background: var(--bg-card); 
    border: 1px solid var(--glass-border); 
    border-radius: 24px; 
    padding: 40px; 
    transition: 0.4s; 
    position: relative; 
    overflow: hidden; 
    height: 100%;
}
.branding-style:hover, .services-style:hover, .workflow:hover { 
    border-color: var(--neon-cyan); 
    box-shadow: var(--glow-cyan); 
    transform: translateY(-10px); 
}
.heading { margin-bottom: 60px; max-width: 700px; position: relative;}
.heading h2 { font-size: 48px; text-shadow: var(--glow-cyan);}
.heading img { position: absolute; right: 0; bottom: 0; opacity: 0.5; max-width: 100px; animation: spin 10s linear infinite; filter: drop-shadow(0 0 5px var(--neon-pink));}

/* Branding */
.branding-style { display: flex; flex-direction: column; justify-content: space-between; gap: 20px; }
.branding-style i svg { fill: var(--neon-cyan); width: 46px; height: 46px; filter: drop-shadow(0 0 8px rgba(0,243,255,0.5)); }
.branding-style h2 { font-size: 28px; margin-bottom: 10px; }
.branding-style span { position: absolute; top: 20px; right: 30px; font-size: 80px; font-weight: 800; color: rgba(255,255,255,0.15); text-shadow: 0 0 10px rgba(0,243,255,0.2); pointer-events: none; line-height: 1;}
.branding-style.mb-0 { margin-bottom: 0; }

/* About / Who We Are */
.who-we-are { background: transparent; }
.mission, .vision { margin-bottom: 40px; }
.mission h3, .vision h3 { color: var(--neon-pink); text-shadow: var(--glow-pink); text-transform: uppercase; font-size: 18px; letter-spacing: 2px; margin-bottom: 15px;}
.theme-list li { position: relative; padding-left: 20px; margin-bottom: 10px; color: var(--text-muted); }
.theme-list li::before { content: ""; position: absolute; left: 0; top: 10px; width: 6px; height: 6px; background: var(--neon-cyan); border-radius: 50%; box-shadow: var(--glow-cyan); }
.experience { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 25px 30px; height: auto !important; margin-top: 20px; }
.experience h3 { font-size: 72px; color: var(--text-main); margin: 0; line-height: 1; text-shadow: var(--glow-primary);}
.experience h3 span { color: var(--theme-color); }
.about-img img { border-radius: 24px; border: 1px solid var(--neon-cyan); box-shadow: var(--glow-cyan); width: 100%;}

/* Recommended / Marquee */
.recommended-companies { text-align: center; margin-bottom: 50px; position: relative;}
.recommended-companies h2 { font-size: 48px; text-shadow: var(--glow-pink); }
.recommended-companies .shap-3 { position: absolute; left: -100px; top: -50px; opacity: 0.6; animation: float 3s ease-in-out infinite; filter: drop-shadow(0 0 10px var(--neon-cyan));}
.recommended-companies .shap-4 { position: absolute; right: -100px; bottom: -50px; opacity: 0.6; animation: spin 10s linear infinite; filter: drop-shadow(0 0 10px var(--neon-pink));}
.marquee-icon { display: flex; overflow: hidden; white-space: nowrap; position: relative; mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent); -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent); width: 100%;}
.marquee-content { display: flex; align-items: center; min-width: max-content; animation: scroll 30s linear infinite; flex-shrink: 0; }
.marquee-item { padding: 0 60px; display: flex; align-items: center; justify-content: center; height: 100px; flex-shrink: 0; }
.marquee-item img { height: 65px; width: auto; max-width: 180px; object-fit: contain; filter: brightness(0) invert(1) opacity(0.6); transition: 0.3s; padding: 0 10px; }
.marquee-item img:hover { filter: brightness(0) invert(1) opacity(1) drop-shadow(0 0 15px var(--neon-cyan)); }
.text-logo-partner { font-family: 'Fraunces', serif; font-size: 32px; font-weight: 700; color: rgba(255,255,255,0.6); text-transform: capitalize; white-space: nowrap; transition: 0.3s; letter-spacing: 0px;}
.text-logo-partner:hover { color: #fff; text-shadow: var(--glow-cyan); }

/* Workflow */
.workflow-section { position: relative; }
.workflow-section .shap-3, .workflow-section .shap-4 { position: absolute; z-index: -1; opacity: 0.5; filter: drop-shadow(0 0 10px var(--neon-cyan));}
.workflow-section .shap-3 { left: 0; bottom: 0; animation: float 4s infinite alternate;}
.workflow-section .shap-4 { right: 0; top: 0; animation: float 5s infinite alternate-reverse;}
.workflow { text-align: center; padding: 50px 30px; }
.workflow img { max-height: 80px; margin-bottom: 25px; filter: drop-shadow(0 0 10px rgba(255,255,255,0.5)); transition: 0.3s; }
.workflow:hover img { filter: drop-shadow(0 0 20px var(--neon-cyan)); transform: scale(1.1);}
.workflow h3 { font-size: 24px; }

/* Services */
.services-style { display: flex; flex-direction: column; }
.services-style .icon-box { width: 80px; height: 80px; background: rgba(0,243,255,0.1); display: inline-flex; align-items: center; justify-content: center; border-radius: 20px; margin-bottom: 25px; transition: 0.3s; box-shadow: inset 0 0 15px rgba(0,243,255,0.2);}
.services-style .icon-box i { color: var(--neon-cyan); transition: 0.3s; filter: drop-shadow(0 0 5px rgba(0,243,255,0.5));}
.services-style:hover .icon-box { background: var(--neon-cyan); box-shadow: var(--glow-cyan); }
.services-style:hover .icon-box i { color: #000; filter: none; }
.services-style h3 a { color: var(--text-main); font-size: 24px; }
.services-style h3 a:hover { color: var(--neon-pink); text-shadow: var(--glow-pink); }

/* Have a Project */
.project-style { border-radius: 24px 0 0 24px; display: flex; flex-direction: column; justify-content: center; padding: 80px; border-right: none;}
.project-style h2 { font-size: 48px; text-shadow: var(--glow-cyan);}
.project-img { border-radius: 0 24px 24px 0; border-left: none; position: relative;}
.project-img img { width: 80%; position: relative; z-index: 2; filter: drop-shadow(0 0 20px rgba(0,243,255,0.4));}
.project-img .shap-3 { position: absolute; right: 0; top: 0; opacity: 0.5; z-index: 1; animation: spin 10s linear infinite; filter: drop-shadow(0 0 10px var(--neon-pink));}

/* Pricing */
.pricing-table { background: var(--bg-card); border: 1px solid var(--glass-border); border-radius: 32px; padding: 50px 40px; transition: 0.4s; position: relative; z-index: 1;}
.pricing-table:hover { border-color: var(--neon-pink); transform: translateY(-10px); box-shadow: var(--glow-pink); }
.pricing-table.two { border-color: var(--neon-cyan); box-shadow: var(--glow-cyan); transform: scale(1.05); z-index: 2; }
.pricing-table.two:hover { transform: scale(1.05) translateY(-10px); }
.pricing-top { border-bottom: 1px solid var(--glass-border); margin-bottom: 30px; padding-bottom: 20px; }
.pricing-top span { color: var(--neon-pink); font-weight: 700; font-size: 16px; text-transform: uppercase; letter-spacing: 2px; display: block; margin-bottom: 10px; text-shadow: var(--glow-pink);}
.pricing-top h3 { font-size: 42px; margin: 0 0 15px 0; text-shadow: var(--glow-primary);}
.pricing-top h3 span { font-size: 16px; color: var(--text-muted); font-weight: 400; text-transform: lowercase; letter-spacing: 0; text-shadow: none;}
.pricing-table ul { margin-bottom: 40px; }
.pricing-table ul li { color: var(--text-main); margin-bottom: 15px; display: flex; align-items: center; gap: 12px; font-weight: 500;}
.pricing-table ul li i { color: var(--neon-cyan); font-size: 18px; filter: drop-shadow(0 0 5px rgba(0,243,255,0.5));}

/* Footer & Contact */
#contact { background: transparent; padding: 80px 0; }
.footer-contact { display: flex; align-items: center; gap: 20px; margin-bottom: 20px;}
.footer-contact i { width: 70px; height: 70px; background: rgba(255,0,234,0.05); border: 1px solid var(--neon-pink); box-shadow: var(--glow-pink); border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.footer-contact i svg { width: 30px; height: 30px; filter: drop-shadow(0 0 5px rgba(255,0,234,0.5));}
.footer-contact i svg path { stroke: var(--neon-pink); fill: none; }
.footer-contact span { color: var(--text-muted); font-size: 14px; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 5px; display: block;}
.footer-contact h4, .footer-contact h4 a { color: var(--text-main); font-size: 18px; font-weight: 600; margin: 0;}
.footer-contact h4 a:hover { color: var(--neon-cyan); text-shadow: var(--glow-cyan);}

footer.webilte-footer { background: transparent; padding-top: 80px; position: relative;}
.footer-fixed footer.webilte-footer { position: relative !important; }
.footer-left h2 { font-size: 36px; margin-bottom: 30px; text-shadow: var(--glow-cyan);}
.footer-left p { margin-bottom: 15px; color: var(--neon-pink); text-shadow: var(--glow-pink); font-weight: 600; text-transform: uppercase; letter-spacing: 1px;}
.footer-center p { margin-bottom: 30px; }
.footer-center ul { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.footer-center ul li { position: relative; padding-left: 15px; }
.footer-center ul li::before { content: ""; position: absolute; left: 0; top: 10px; width: 6px; height: 6px; background: var(--neon-cyan); border-radius: 50%; box-shadow: var(--glow-cyan);}
.footer-center ul li a { color: var(--text-muted); transition: 0.3s; }
.footer-center ul li a:hover { color: var(--neon-cyan); text-shadow: var(--glow-cyan);}
.footer-link li { margin-bottom: 15px; }
.footer-link li a { display: flex; align-items: center; gap: 15px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 1px; font-weight: 600; transition: 0.3s;}
.footer-link li a i { width: 30px; color: var(--text-muted); opacity: 0.5; transition: 0.3s; display: flex; justify-content: center; }
.footer-link li a:hover { color: var(--neon-pink); text-shadow: var(--glow-pink);}
.footer-link li a:hover i { color: var(--neon-cyan); opacity: 1; filter: drop-shadow(0 0 5px rgba(0,243,255,0.5)); }

.footer-bottom { border-top: 1px solid var(--glass-border); margin-top: 60px; padding: 30px 0; }
.footer-bottom-style { display: flex; justify-content: space-between; align-items: center; }
.footer-bottom-style p { margin: 0; font-size: 14px; color: var(--text-muted); }
.footer-bottom-style ul { display: flex; gap: 20px; }
.footer-bottom-style ul li a { color: var(--text-muted); font-size: 14px; }
.footer-bottom-style ul li a:hover { color: var(--neon-cyan); text-shadow: var(--glow-cyan);}

/* Apple inspired refinement: calm surfaces, clear hierarchy, and restrained motion. */
:root {
    --theme-color: #CDDE4F;
    --neon-cyan: #CDDE4F;
    --neon-pink: #CDDE4F;
    --bg-dark: #10110f;
    --bg-card: rgba(255, 255, 255, 0.045);
    --glass-bg: rgba(24, 25, 23, 0.82);
    --glass-border: rgba(255, 255, 255, 0.12);
    --text-main: #f5f5f2;
    --text-muted: #b4b5ae;
    --glow-primary: none;
    --glow-cyan: none;
    --glow-pink: none;
    --cyber-grid: none;
}

html { scroll-behavior: smooth; scroll-padding-top: 112px; }
body {
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", sans-serif;
    background-color: var(--bg-dark);
    background-image: radial-gradient(ellipse at 50% -20%, rgba(205, 222, 79, .09), transparent 58%);
    background-attachment: scroll;
    letter-spacing: -0.01em;
}
p { color: var(--text-muted); line-height: 1.65; font-size: 17px; }
h1, h2, h3, h4, h5, h6 { letter-spacing: -0.035em; }
.gap { padding: clamp(76px, 9vw, 112px) 0; }
.text_invert, .hero-text h1, .heading h2, .recommended-companies h2,
.project-style h2, .footer-left h2, .mission h3, .vision h3,
.experience h3, .pricing-top h3 { text-shadow: none !important; }

header { top: 16px; }
.top-bar {
    background: rgba(24, 25, 23, .84);
    border: 1px solid rgba(255, 255, 255, .12);
    box-shadow: 0 8px 30px rgba(0, 0, 0, .16);
    padding: 8px 22px;
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
}
.logo img { filter: none; }
.header-left nav ul { gap: clamp(16px, 2.2vw, 30px); }
.header-left nav ul li a {
    font-size: 14px; font-weight: 500; letter-spacing: 0;
    text-transform: none; text-shadow: none; color: #e8e9e4;
}
.header-left nav ul li a:hover { color: var(--theme-color); text-shadow: none; }
.header-btn { margin-left: 28px; }

.button-wrapper { background: var(--theme-color); color: #171812; box-shadow: none; transition: transform .2s ease, background-color .2s ease; }
.button-arrow-wrapper { width: 48px; height: 48px; background: transparent; box-shadow: none; }
.button-main {
    height: 48px; padding: 0 24px 0 8px; transform: none; background: transparent;
    box-shadow: none; color: #171812; font-size: 15px; font-weight: 600;
    letter-spacing: 0; text-transform: none;
}
.button-wrapper:hover { color: #171812; background: #dce995; transform: translateY(-1px); }
.button-wrapper:hover .button-arrow-wrapper, .button-wrapper:hover .button-main { color: #171812; background: transparent; box-shadow: none; transform: none; }

.hero-section { padding: clamp(170px, 19vw, 220px) 0 88px; background: none; }
.hero-text h1 { max-width: 850px; font-size: clamp(44px, 6.2vw, 76px); font-weight: 650; letter-spacing: -.055em; line-height: 1.04; margin-bottom: 30px; }
.hero-text h1 span { color: var(--theme-color); text-shadow: none; }
.bottom-style { margin-top: 38px; }
.tet-style { border-left: 2px solid rgba(205, 222, 79, .75); box-shadow: none; padding-left: 18px; max-width: 560px; gap: 16px; }
.tet-style img { width: 38px; animation: none; filter: none; }
.tet-style p { margin: 0; }
.hero-shap { opacity: .24; }
.hero-shap img { filter: none !important; }
.shap-one, .shap-two { animation: none; }
.shap-three { animation: none; }

.branding-style, .services-style, .workflow, .experience, .project-style, .project-img,
.pricing-table, .whitelabel-card {
    background: rgba(255, 255, 255, .045);
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 22px;
    box-shadow: none;
}
.branding-style, .services-style, .workflow { padding: 32px; }
.branding-style:hover, .services-style:hover, .workflow:hover,
.pricing-table:hover, .whitelabel-card:hover {
    border-color: rgba(205, 222, 79, .45); box-shadow: 0 14px 36px rgba(0, 0, 0, .18); transform: translateY(-4px);
}
.heading { margin-bottom: 44px; }
.heading h2, .recommended-companies h2 { font-size: clamp(34px, 4.2vw, 48px); }
.heading img, .recommended-companies .shap-3, .recommended-companies .shap-4,
.workflow-section .shap-3, .workflow-section .shap-4 { animation: none; filter: none; }
.branding-style span { color: rgba(255,255,255,.08); text-shadow: none; }
.branding-style i svg, .services-style .icon-box i, .pricing-table ul li i { color: var(--theme-color); filter: none; }
.services-style .icon-box { background: rgba(205, 222, 79, .1); box-shadow: none; border-radius: 18px; }
.services-style:hover .icon-box { background: var(--theme-color); box-shadow: none; }
.mission h3, .vision h3 { color: var(--theme-color); letter-spacing: .04em; }
.theme-list li::before { background: var(--theme-color); box-shadow: none; }
.about-img img { border-color: rgba(255,255,255,.12); box-shadow: none; }
.experience h3 span { color: var(--theme-color); }
.marquee-item img { filter: brightness(0) invert(1) opacity(.52); }
.workflow img, .workflow:hover img { filter: none; transform: none; }
.project-style { border-radius: 22px 0 0 22px; }
.project-img { border-radius: 0 22px 22px 0; }
.project-img img { filter: none; }
.pricing-table { padding: 38px 32px; }
.pricing-table.two { border-color: rgba(205, 222, 79, .55); box-shadow: 0 12px 36px rgba(0,0,0,.2); }
.pricing-table.two:hover { transform: scale(1.05) translateY(-4px); }
.pricing-top span { color: var(--theme-color); text-shadow: none; }
.pricing-table ul li i { color: var(--theme-color); }
.footer-contact i { background: rgba(205, 222, 79, .08); border-color: rgba(205, 222, 79, .4); box-shadow: none; }
.footer-contact i svg { filter: none; }
.footer-contact i svg path { stroke: var(--theme-color); }
.footer-left p { color: var(--theme-color); text-shadow: none; }
.footer-center ul li::before { background: var(--theme-color); box-shadow: none; }
.footer-bottom { border-color: rgba(255,255,255,.12); }

a, button, .branding-style, .services-style, .workflow, .pricing-table, .whitelabel-card {
    transition-duration: .2s;
}
a:focus-visible, button:focus-visible {
    outline: 3px solid var(--theme-color); outline-offset: 4px; border-radius: 6px;
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Finish the system across embedded and inline-styled landing page components. */
::selection { background: rgba(205, 222, 79, .32); color: #fff; }
:focus-visible { outline: 3px solid var(--theme-color); outline-offset: 4px; }
.whitelabel-card { background: rgba(255,255,255,.045) !important; border-color: rgba(255,255,255,.1) !important; padding: clamp(24px, 3vw, 36px) !important; border-radius: 22px !important; }
.whitelabel-card::before { display: none; }
.whitelabel-card:hover { border-color: rgba(205,222,79,.45) !important; box-shadow: 0 14px 36px rgba(0,0,0,.18) !important; }
.whitelabel-card .button-main, .whitelabel-card .button-arrow-wrapper { box-shadow: none !important; }
.whitelabel-card .icon-box { color: var(--theme-color) !important; background: rgba(205,222,79,.1) !important; border-radius: 16px !important; }
.whitelabel-card h3 { color: var(--text-main) !important; font-weight: 650 !important; }
.whitelabel-card p { color: var(--text-muted) !important; }
.whitelabel-card > div > div[style*="display: flex"] { gap: 10px !important; }
.whitelabel-card a.button-wrapper { min-height: 44px; border: 0 !important; border-radius: 999px !important; background: var(--theme-color) !important; color: #171812 !important; }
.whitelabel-card a.button-wrapper .button-arrow-wrapper { background: transparent !important; }
.whitelabel-card a.button-wrapper .button-main { height: 44px; padding: 0 18px 0 4px !important; border: 0 !important; border-radius: 0 999px 999px 0 !important; background: transparent !important; color: #171812 !important; font-size: 14px !important; }
.whitelabel-card a.button-wrapper[href*="wa.me"] { background: #dfe8bd !important; }
.whitelabel-card a.button-wrapper[href*="wa.me"] .button-main { background: transparent !important; color: #171812 !important; }
.contact-form {
    background: rgba(255,255,255,.045) !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    border-radius: 22px !important;
    padding: clamp(22px, 4vw, 40px) !important;
    backdrop-filter: blur(18px) !important;
}
.contact-form .form-control {
    min-height: 50px;
    background: rgba(255,255,255,.055) !important;
    border: 1px solid rgba(255,255,255,.13) !important;
    border-radius: 12px !important;
    color: var(--text-main) !important;
    box-shadow: none !important;
}
.contact-form textarea.form-control { min-height: 140px; }
.contact-form .form-control::placeholder { color: #92948c; }
.contact-form .form-control:focus { border-color: rgba(205,222,79,.7) !important; box-shadow: 0 0 0 4px rgba(205,222,79,.12) !important; }
.contact-form label { color: #e7e8e2; margin-bottom: 9px; }
.contact-form .button-main { background: transparent !important; color: #171812 !important; border-radius: 0 999px 999px 0 !important; }
.contact-form .button-arrow-wrapper { background: var(--theme-color) !important; }
.scroll-to-top { filter: none !important; }
.scroll-to-top .scroll-top-inner { background: rgba(24,25,23,.9); border: 1px solid rgba(255,255,255,.12); border-radius: 999px; }
@media (max-width: 767px) {
    .hero-section { padding-top: 150px; }
    .hero-text h1 { font-size: clamp(36px, 10vw, 48px); }
    .gap { padding: 72px 0; }
    .contact-form { padding: 22px !important; }
    .project-style, .project-img { border-radius: 20px !important; border: 1px solid rgba(255,255,255,.1) !important; }
}

/* Misc Utilities */
.preloader { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: var(--bg-dark); z-index: 99999; display: flex; align-items: center; justify-content: center; transition: opacity 0.5s ease, visibility 0.5s ease; }
.page-loaded .preloader { opacity: 0; visibility: hidden; pointer-events: none; }
.loader { width: 48px; height: 48px; border: 5px solid var(--glass-border); border-bottom-color: var(--neon-cyan); border-radius: 50%; display: inline-block; box-sizing: border-box; animation: spin 1s linear infinite; box-shadow: var(--glow-cyan); }
.scroll-to-top { position: fixed; right: 30px; bottom: 30px; width: 50px; height: 50px; background: var(--neon-pink); box-shadow: var(--glow-pink); border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 999; opacity: 0; visibility: hidden; transition: 0.3s; transform: translateY(20px); }
.scroll-to-top.visible { opacity: 1; visibility: visible; transform: translateY(0); }
.scroll-to-top .scroll-bar-text { display: none; }
.scroll-to-top .scroll-bar { display: none; }
.scroll-to-top::after { content: "↑"; color: #fff; font-weight: 800; font-size: 20px; }

/* Splitting.js Fixes */
.splitting .word { display: inline-block; }

/* Animations */
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
@keyframes float { 0% { transform: translateY(0px); } 50% { transform: translateY(-20px); } 100% { transform: translateY(0px); } }
@keyframes scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

/* Fix generic bootstrap row spacing overriding layout */
.row { margin-left: -15px; margin-right: -15px; }
[class*="col-"] { padding-left: 15px; padding-right: 15px; margin-bottom: 30px; }

/* Page composition, icon language, and footer finish. */
.container { width: min(100% - 40px, 1160px); max-width: 1160px; }
.heading { max-width: 760px; margin-bottom: clamp(32px, 5vw, 52px); }
.heading p, .recommended-companies > p { max-width: 650px; }
.recommended-companies { max-width: 760px; margin: 0 auto 42px; }
.recommended-companies > p { margin-inline: auto; }
.hero-section { padding-bottom: 76px; }
.hero-section > .container { position: relative; z-index: 1; }
.hero-shap { opacity: .09 !important; pointer-events: none; }
.heading img, .recommended-companies .shap-3, .recommended-companies .shap-4,
.workflow-section > .shap-3, .workflow-section > .shap-4,
#whitelabel-apps > .shap-3, .services > .shap-3 { opacity: .05 !important; pointer-events: none; }

.branding { padding: 34px 0 0; }
.branding .row { row-gap: 14px; }
.branding-style, .services-style, .workflow { text-align: left; }
.branding-style { flex-direction: row; align-items: flex-start; justify-content: flex-start; gap: 18px; }
.branding-style > .icon-box, .services-style > .icon-box, .whitelabel-card .icon-box {
    width: 48px !important; height: 48px !important; min-width: 48px;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(205,222,79,.1) !important; border: 1px solid rgba(205,222,79,.14);
    border-radius: 15px !important; box-shadow: none !important;
}
.branding-style > .icon-box i, .services-style > .icon-box i, .whitelabel-card .icon-box i {
    color: var(--theme-color) !important; font-size: 19px !important; filter: none !important;
}
.branding-style h2 { font-size: 21px; font-weight: 600; }
.branding-style span { font-size: 54px; top: 18px; right: 22px; }
.about-img figure { overflow: hidden; border-radius: 24px; }
.about-img img { display: block; object-fit: cover; aspect-ratio: 1.45; }
.mission, .vision { padding: 22px 0; border-bottom: 1px solid rgba(255,255,255,.09); }
.mission h3, .vision h3 { font-size: 13px; font-weight: 650; text-transform: uppercase; letter-spacing: .12em; }
.experience { display: inline-flex; min-width: 190px; padding: 20px 22px; border-radius: 18px; }
.experience h3 { font-size: 52px; }
.marquee { padding: 6px 0; }
.marquee-content { animation-duration: 38s; }
.marquee-item { padding-inline: 38px; }
.marquee-item img { max-width: 150px; height: 54px; object-fit: contain; }
.text-logo-partner { font-family: inherit; font-size: 22px; font-weight: 600; color: rgba(255,255,255,.58); }
.marquee-icon:hover .marquee-content { animation-play-state: paused; }
.workflow-section .row { --bs-gutter-x: 18px; }
.workflow { min-height: 250px; padding: 30px !important; }
.workflow img { width: 54px; height: 54px; object-fit: contain; margin-bottom: 28px; filter: grayscale(1) opacity(.7) !important; }
.workflow h3 { font-size: 20px; font-weight: 600; }
.services .row .row { --bs-gutter-x: 18px; }
.services-style { min-height: 240px; padding: 30px !important; }
.services-style h3 { font-size: 20px; font-weight: 600; margin: 0 0 10px; }
.services-style h3 a { font-size: inherit; }
.services-style .icon-box { width: 48px; height: 48px; border-radius: 15px; margin-bottom: 22px; }
.services-style:hover .icon-box { background: rgba(205,222,79,.14); }
.pricing-table { height: 100%; padding: 32px 28px; border-radius: 22px; }
.pricing-table { display: flex; flex-direction: column; }
.pricing-table.two, .pricing-table.two:hover { transform: none; }
.pricing-top { min-height: 142px; }
.pricing-top span { font-size: 12px; letter-spacing: .1em; }
.pricing-top h3 { font-size: clamp(30px, 3vw, 38px); }
.pricing-table ul { margin-bottom: 30px; }
.pricing-table ul { flex: 1 0 auto; }
.pricing-table ul li { font-size: 15px; font-weight: 450; align-items: flex-start; }
.pricing-table ul li i { margin-top: 3px; font-size: 15px; }

#contact { padding: 92px 0 !important; border-top: 1px solid rgba(255,255,255,.08); }
#contact .heading { margin-inline: auto; margin-bottom: 38px !important; }
#contact .heading h2 { font-size: clamp(34px, 4.5vw, 48px) !important; font-weight: 650 !important; }
#contact .heading p { margin-top: 12px !important; }
#contact .col-lg-8 { max-width: 760px; }
.contact-form .row { --bs-gutter-x: 18px; }
.contact-form .form-group { margin: 0; }
.contact-form .form-control { padding: 13px 16px !important; }
.contact-form button.button-wrapper { min-height: 48px; padding: 0 !important; border: 0; border-radius: 999px; background: var(--theme-color) !important; }
.contact-form button .button-arrow-wrapper { width: 48px; height: 48px; }
.contact-form button .button-main { height: 48px; padding: 0 24px 0 8px !important; font-size: 15px !important; }

footer.webilte-footer { margin-top: 0; padding: 72px 0 0 !important; background: #151613; border-top: 1px solid rgba(255,255,255,.08); }
footer.webilte-footer > .container > .row { align-items: flex-start; --bs-gutter-x: 34px; }
.footer-left h2 { max-width: 360px; font-size: clamp(28px, 3.4vw, 40px); line-height: 1.1; font-weight: 650; margin-bottom: 24px; }
.footer-left .button-wrapper { min-height: 46px; background: var(--theme-color); border-radius: 999px; }
.footer-left .button-arrow-wrapper { width: 46px; height: 46px; }
.footer-left .button-main { height: 46px; padding: 0 22px 0 4px; }
.footer-center { padding-top: 8px; }
.footer-center ul { display: flex; flex-direction: column; grid-template-columns: none; gap: 0; }
.footer-center ul li { padding: 0; }
.footer-center ul li::before { display: none; }
.footer-center ul li a { display: inline-flex; padding: 9px 0; color: #c4c5bd; font-size: 15px; }
.footer-center ul li a:hover { color: var(--theme-color); }
.footer-link { display: flex; flex-direction: column; gap: 5px; padding-top: 8px; }
.footer-link li { margin: 0; }
.footer-link li a { min-height: 42px; gap: 12px; color: #c4c5bd; text-transform: none; letter-spacing: 0; font-size: 15px; font-weight: 500; }
.footer-link li a i { width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; background: rgba(255,255,255,.06); color: #dedfd8; opacity: 1; filter: none; font-size: 15px; }
.footer-link li a:hover, .footer-link li a:hover i { color: var(--theme-color); text-shadow: none; filter: none; }
.footer-bottom { margin-top: 46px; padding: 22px 0; }
.footer-bottom-style { gap: 20px; }
.footer-bottom-style > a img { width: 78px; height: auto; object-fit: contain; }
.footer-bottom-style p { font-size: 13px; }
.footer-contact { align-items: flex-start; }
.footer-contact i { width: 44px; height: 44px; flex: 0 0 44px; border-radius: 14px; background: rgba(205,222,79,.1); border: 1px solid rgba(205,222,79,.16); }
.scroll-to-top { width: 46px; height: 46px; right: 24px; bottom: 24px; background: rgba(28,29,25,.94) !important; border: 1px solid rgba(255,255,255,.14); box-shadow: 0 8px 26px rgba(0,0,0,.28) !important; }
.scroll-to-top::after { color: var(--theme-color); font-size: 18px; font-weight: 500; }

@media (max-width: 991px) {
    .container { width: min(100% - 36px, 760px); }
    .branding .col-lg-4 { width: 50%; }
    .branding .col-lg-4:last-child { width: 100%; }
    footer.webilte-footer > .container > .row { --bs-gutter-x: 24px; }
}
@media (max-width: 767px) {
    .container { width: min(100% - 32px, 560px); }
    .branding { padding-top: 22px; }
    .branding .col-lg-4, .branding .col-lg-4:last-child { width: 100%; }
    .branding-style { min-height: 0; }
    .about-img img { aspect-ratio: 1.15; }
    .workflow { min-height: 0; }
.pricing-top { min-height: 0; }
    .pricing-table { min-height: 0; }
    #contact { padding: 72px 0 !important; }
    footer.webilte-footer { padding-top: 54px !important; }
    footer.webilte-footer > .container > .row { row-gap: 12px; }
    .footer-left h2 { max-width: 420px; }
    .footer-center, .footer-link { padding-top: 0; }
    .footer-bottom { margin-top: 24px; }
    .footer-bottom-style { flex-direction: column; align-items: flex-start; text-align: left; gap: 10px; }
    .footer-bottom-style ul { flex-wrap: wrap; }
    .scroll-to-top { right: 16px; bottom: 16px; }
}
@media (prefers-reduced-motion: reduce) {
    .marquee-content { animation: none !important; }
}

/* Light liquid-glass theme */
:root {
    color-scheme: light;
    --bg-dark: #f4f5f1;
    --bg-card: rgba(255,255,255,.68);
    --glass-bg: rgba(255,255,255,.68);
    --glass-border: rgba(30,32,24,.1);
    --text-main: #1d1e1a;
    --text-muted: #686b63;
    --theme-color: #a9bd35;
    --neon-cyan: #a9bd35;
    --neon-pink: #a9bd35;
    --glow-primary: none;
    --glow-cyan: none;
    --glow-pink: none;
}
body {
    color: var(--text-main) !important;
    background-color: #f4f5f1 !important;
    background-image:
        radial-gradient(ellipse at 8% 0%, rgba(205,222,79,.22), transparent 35%),
        radial-gradient(ellipse at 92% 22%, rgba(255,255,255,.9), transparent 38%),
        linear-gradient(180deg, #f8f9f6 0%, #f0f1ed 100%) !important;
}
p { color: var(--text-muted) !important; }
h1, h2, h3, h4, h5, h6 { color: var(--text-main); }
.wrapper, .bg-black, .who-we-are, #contact { background-color: transparent !important; }
.hero-section { background: transparent !important; }
.hero-text h1, .hero-text h1 span, .heading h2, .recommended-companies h2,
.project-style h2, .footer-left h2, .branding-style h2, .workflow h3,
.services-style h3, .services-style h3 a, .pricing-top h3, .pricing-table ul li,
.experience h3 { color: var(--text-main) !important; }
.hero-text h1 span, .experience h3 span, .mission h3, .vision h3,
.pricing-top span, .footer-left p { color: #748516 !important; }
.top-bar {
    background: rgba(255,255,255,.68) !important;
    border: 1px solid rgba(255,255,255,.82) !important;
    border-bottom-color: rgba(30,32,24,.08) !important;
    box-shadow: 0 12px 36px rgba(40,45,28,.09), inset 0 1px 0 rgba(255,255,255,.9) !important;
}
.header-left nav ul li a { color: #42443d !important; }
.header-left nav ul li a:hover, .header-left nav ul li a:focus-visible { color: #657515 !important; }
.mobile-nav-toggle span { background: #5d6d17 !important; box-shadow: none !important; }
.button-wrapper { color: #fff !important; background: #25271f !important; box-shadow: 0 5px 14px rgba(25,28,17,.12) !important; }
.button-arrow-wrapper, .button-main { background: transparent !important; box-shadow: none !important; color: #fff !important; }
.button-wrapper:hover { background: #3b402b !important; color: #fff !important; box-shadow: 0 8px 20px rgba(25,28,17,.16) !important; }
.button-wrapper:hover .button-arrow-wrapper, .button-wrapper:hover .button-main { color: #fff !important; }
.button-arrow-wrapper svg { fill: currentColor; }
.branding-style, .services-style, .workflow, .experience, .project-style, .project-img,
.pricing-table, .whitelabel-card, .contact-form {
    color: var(--text-main) !important;
    background: rgba(255,255,255,.62) !important;
    border: 1px solid rgba(255,255,255,.88) !important;
    box-shadow: 0 12px 34px rgba(44,48,33,.07), inset 0 1px 0 rgba(255,255,255,.95) !important;
    backdrop-filter: blur(24px) saturate(150%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(150%) !important;
}
.branding-style:hover, .services-style:hover, .workflow:hover,
.pricing-table:hover, .whitelabel-card:hover {
    border-color: rgba(169,189,53,.45) !important;
    box-shadow: 0 18px 42px rgba(44,48,33,.11), inset 0 1px 0 rgba(255,255,255,.96) !important;
}
.branding-style span { color: rgba(33,36,26,.07) !important; }
.branding-style > .icon-box, .services-style > .icon-box, .whitelabel-card .icon-box {
    background: rgba(205,222,79,.2) !important;
    border-color: rgba(133,151,40,.12) !important;
}
.branding-style > .icon-box i, .services-style > .icon-box i,
.whitelabel-card .icon-box i, .branding-style i { color: #657515 !important; }
.workflow img { filter: grayscale(1) opacity(.65) !important; }
.about-img img { border-color: rgba(255,255,255,.9) !important; box-shadow: 0 18px 44px rgba(35,38,28,.12) !important; }
.theme-list li { color: var(--text-muted) !important; }
.theme-list li::before { background: #879a24 !important; }
.marquee-item img { filter: grayscale(1) opacity(.56) !important; }
.text-logo-partner { color: rgba(30,32,24,.58) !important; }
.pricing-table.two { border-color: rgba(169,189,53,.42) !important; }
.pricing-top { border-color: rgba(30,32,24,.1) !important; }
.pricing-table ul li i { color: #748516 !important; }
#contact { border-color: rgba(30,32,24,.08) !important; }
.contact-form label { color: #44463e !important; }
.contact-form .form-control {
    color: #25271f !important;
    background: rgba(255,255,255,.72) !important;
    border-color: rgba(30,32,24,.12) !important;
}
.contact-form .form-control::placeholder { color: #85877f !important; }
.contact-form .form-control:focus { border-color: rgba(125,145,28,.55) !important; box-shadow: 0 0 0 4px rgba(169,189,53,.16) !important; }
.whitelabel-card h3 { color: var(--text-main) !important; }
.whitelabel-card p { color: var(--text-muted) !important; }
.whitelabel-card a.button-wrapper[href*="wa.me"] { background: #e8edda !important; color: #34401a !important; }
.whitelabel-card a.button-wrapper[href*="wa.me"] .button-main { color: #34401a !important; }
.whitelabel-card a.button-wrapper[href*="wa.me"] .button-arrow-wrapper { color: #34401a !important; }
footer.webilte-footer { background: rgba(255,255,255,.5) !important; border-color: rgba(30,32,24,.08) !important; }
.footer-center ul li a, .footer-link li a { color: #55574f !important; }
.footer-center ul li a:hover, .footer-link li a:hover { color: #657515 !important; }
.footer-link li a i { color: #55574f !important; background: rgba(255,255,255,.76) !important; border: 1px solid rgba(30,32,24,.07); box-shadow: 0 3px 12px rgba(40,45,28,.06); }
.footer-link li a:hover i { color: #657515 !important; }
.footer-bottom { border-color: rgba(30,32,24,.1) !important; }
.footer-bottom-style p, .footer-bottom-style ul li a { color: #777970 !important; }
.footer-contact i { color: #657515 !important; background: rgba(255,255,255,.78) !important; border-color: rgba(30,32,24,.08) !important; box-shadow: 0 6px 18px rgba(40,45,28,.07) !important; }
.footer-contact i svg path { stroke: #657515 !important; }
.scroll-to-top { background: rgba(255,255,255,.76) !important; border-color: rgba(255,255,255,.94) !important; box-shadow: 0 10px 28px rgba(36,40,26,.16), inset 0 1px 0 #fff !important; backdrop-filter: blur(16px); }
.scroll-to-top::after { color: #566516 !important; }
.preloader { background: #f4f5f1 !important; }
.loader { border-color: rgba(30,32,24,.1) !important; border-bottom-color: #879a24 !important; box-shadow: none !important; }
.header-left { color: var(--text-main); }
@media (max-width: 1199px) {
    .header-left { background: rgba(255,255,255,.86) !important; border: 1px solid rgba(255,255,255,.92) !important; box-shadow: 0 18px 44px rgba(40,45,28,.14) !important; backdrop-filter: blur(24px); }
    .header-left.active { box-shadow: 0 18px 44px rgba(40,45,28,.14) !important; }
    .header-left nav ul li a { color: #3f4139 !important; }
}
body { background: #f7f7f5 !important; background-image: none !important; }
.hero-shap, .heading img, .recommended-companies .shap-3, .recommended-companies .shap-4,
.workflow-section > .shap-3, .workflow-section > .shap-4,
#whitelabel-apps > .shap-3, .services > .shap-3 { display: none !important; }

/* Give the first screen a clear product story and a deliberate visual anchor. */
.logo img { filter: brightness(0) saturate(100%) opacity(.78) !important; }
.footer-bottom-style > a img { filter: brightness(0) saturate(100%) opacity(.72); }
.hero-section { padding: clamp(96px, 7vw, 112px) 0 56px !important; }
.hero-section > .container > .row { align-items: center; }
.hero-copy { z-index: 1; }
.hero-eyebrow {
    display: inline-flex; align-items: center; gap: 10px; margin: 0 0 20px;
    color: #66751c !important; font-size: 12px; font-weight: 700; letter-spacing: .14em;
}
.hero-eyebrow span { width: 8px; height: 8px; border-radius: 50%; background: #91a526; box-shadow: 0 0 0 5px rgba(169,189,53,.14); }
.hero-text h1 { max-width: 690px; font-size: clamp(46px, 5.1vw, 68px); line-height: 1.04; letter-spacing: -.06em; }
.hero-text h1 span { color: #70821d !important; }
.bottom-style { margin-top: 28px; }
.tet-style { max-width: 470px; border-color: rgba(135,154,36,.42); padding-left: 16px; }
.tet-style img { width: 34px; opacity: .72; }
.tet-style p { font-size: 16px; }
.hero-visual { position: relative; padding: 22px 24px 34px 10px; }
.showcase-window {
    position: relative; z-index: 1; overflow: hidden; width: 100%; max-width: 460px; margin: 0 auto;
    background: #fff; border: 1px solid rgba(255,255,255,.95); border-radius: 24px;
    box-shadow: 0 28px 70px rgba(41,45,28,.14), 0 5px 16px rgba(41,45,28,.06);
    transform: rotate(1.2deg);
}
.showcase-browser-bar { height: 43px; display: flex; align-items: center; gap: 12px; padding: 0 16px; border-bottom: 1px solid #eceee8; }
.showcase-dots { display: flex; gap: 5px; }
.showcase-dots span { width: 7px; height: 7px; background: #d7d9d0; border-radius: 50%; }
.showcase-address { flex: 1; text-align: center; color: #96998e; font-size: 10px; letter-spacing: .02em; }
.showcase-browser-bar > i { color: #898c80; font-size: 11px; }
.showcase-content { position: relative; min-height: 405px; padding: 34px 34px 0; overflow: hidden; }
.showcase-kicker { margin-bottom: 12px; color: #74851e; font-size: 9px; font-weight: 750; letter-spacing: .15em; }
.showcase-content h2 { position: relative; z-index: 1; margin: 0; color: #20221b; font-size: clamp(31px, 3vw, 40px); line-height: 1.03; letter-spacing: -.055em; font-weight: 700; }
.showcase-content h2 span { color: #879a24; }
.showcase-content > p { position: relative; z-index: 1; max-width: 255px; margin: 13px 0 17px; color: #73766b !important; font-size: 12px; line-height: 1.55; }
.showcase-cta { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 10px; color: #292c20; font-size: 11px; font-weight: 650; }
.showcase-cta i { display: grid; width: 23px; height: 23px; place-items: center; background: #dfe8b2; border-radius: 50%; font-size: 9px; }
.showcase-art { position: absolute; left: 18px; right: 18px; bottom: 18px; height: 142px; overflow: hidden; background: #e8edd5; border-radius: 16px; }
.showcase-art::before { content: ""; position: absolute; width: 180px; height: 180px; top: 20px; left: 50%; background: #c8d58a; border-radius: 50%; transform: translateX(-50%); }
.showcase-art-orb { position: absolute; top: 32px; left: 46%; width: 116px; height: 116px; border: 1px solid rgba(255,255,255,.65); border-radius: 50%; transform: translateX(-50%); }
.showcase-art-card { position: absolute; top: 20px; right: 17px; width: 112px; padding: 12px; display: grid; gap: 5px; color: #333728; background: rgba(255,255,255,.82); border: 1px solid rgba(255,255,255,.9); border-radius: 12px; box-shadow: 0 8px 22px rgba(57,66,28,.12); }
.showcase-art-card i { color: #77891f; font-size: 12px; }
.showcase-art-card span { color: #76796e; font-size: 8px; }
.showcase-art-card b { font-size: 17px; letter-spacing: -.04em; }
.showcase-art-caption { position: absolute; left: 14px; bottom: 12px; color: rgba(40,44,30,.57); font-size: 8px; font-weight: 700; letter-spacing: .13em; }
.showcase-note {
    position: absolute; z-index: 2; left: -8px; bottom: 2px; display: flex; align-items: center; gap: 10px;
    padding: 12px 16px 12px 12px; background: rgba(255,255,255,.82); border: 1px solid rgba(255,255,255,.95);
    border-radius: 15px; box-shadow: 0 12px 30px rgba(41,45,28,.12); backdrop-filter: blur(18px);
}
.showcase-note-icon { display: grid; width: 34px; height: 34px; place-items: center; color: #697a1d; background: #edf2d8; border-radius: 11px; }
.showcase-note b, .showcase-note small { display: block; }
.showcase-note b { color: #34362f; font-size: 11px; }
.showcase-note small { margin-top: 3px; color: #77796f; font-size: 9px; }
.branding { padding-top: 10px; }
.branding-style { min-height: 190px; }
.branding-style > div:last-child { max-width: 240px; }
.branding-style h2 { position: relative; z-index: 1; }
.branding-style p { position: relative; z-index: 1; font-size: 15px; }
@media (max-width: 991px) {
    .hero-section { padding-top: 98px !important; }
    .hero-text h1 { max-width: 650px; font-size: clamp(44px, 7vw, 62px); }
    .hero-visual { max-width: 560px; margin: 24px auto 0; padding-left: 24px; }
    .showcase-window { max-width: 500px; }
    .showcase-note { left: 0; }
    .branding { padding-top: 28px; }
}
@media (max-width: 575px) {
    .hero-section { padding-top: 88px !important; }
    .hero-text h1 { font-size: clamp(40px, 11vw, 52px); }
    .hero-eyebrow { margin-bottom: 15px; font-size: 10px; }
    .hero-visual { padding: 12px 8px 28px; margin-top: 32px; }
    .showcase-window { border-radius: 20px; transform: none; }
    .showcase-content { min-height: 360px; padding: 28px 25px 0; }
    .showcase-content h2 { font-size: 35px; }
    .showcase-art { height: 126px; }
    .showcase-art-card { right: 12px; width: 100px; }
    .showcase-note { left: 0; bottom: 0; padding: 10px 12px 10px 10px; }
    .branding-style { min-height: 150px; }
}

/* About section: compact story cards and a purpose-made editorial illustration panel. */
#about { scroll-margin-top: 126px; }
#about .heading { max-width: 790px; margin-bottom: 30px; }
#about .heading .section-eyebrow { margin: 0 0 12px; color: #73841e !important; font-size: 11px; font-weight: 750; letter-spacing: .15em; }
#about .heading h2 { margin-bottom: 14px; color: #24261f !important; font-size: clamp(36px, 4vw, 48px); letter-spacing: -.055em; }
#about .heading > p:last-of-type { max-width: 720px; font-size: 17px; line-height: 1.7; }
#about .row { align-items: stretch; }
.about-copy { display: flex; flex-direction: column; gap: 14px; }
.mission, .vision {
    position: relative; margin: 0 !important; padding: 22px 24px !important;
    background: rgba(255,255,255,.67); border: 1px solid rgba(255,255,255,.92);
    border-radius: 20px; box-shadow: 0 12px 30px rgba(44,48,33,.06), inset 0 1px 0 rgba(255,255,255,.95);
    backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
}
.about-card-index { display: block; margin-bottom: 10px; color: #899641; font-size: 9px; font-weight: 750; letter-spacing: .14em; }
.mission h3, .vision h3 { margin-bottom: 8px !important; color: #282a23 !important; font-size: 21px !important; letter-spacing: -.035em !important; text-transform: none !important; }
.mission p { margin: 0; font-size: 14px; line-height: 1.65; }
.vision { flex: 1; }
.vision .theme-list { display: grid; gap: 8px; }
.vision .theme-list li { margin: 0; padding-left: 17px; font-size: 13px; line-height: 1.5; }
.vision .theme-list li::before { top: 7px; width: 6px; height: 6px; background: #91a526 !important; box-shadow: none; }
.experience { align-self: flex-start; display: flex; flex-direction: row; align-items: center; gap: 14px; min-width: 0; margin-top: 0 !important; padding: 14px 20px !important; background: rgba(231,237,207,.68) !important; border: 1px solid rgba(169,189,53,.17) !important; border-radius: 16px !important; }
.experience h3 { color: #25271f !important; font-size: 38px !important; }
.experience h3 span { color: #77891f !important; }
.experience p { margin: 0; color: #676b58 !important; font-size: 12px; }
.about-img { position: relative; height: 100%; min-height: 480px; padding: 8px 10px 20px; }
.about-img figure {
    position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;
    height: 100%; min-height: 450px; margin: 0; padding: 52px 28px 72px; overflow: hidden;
    background: linear-gradient(145deg, #eef1e4 0%, #e2e8d2 100%);
    border: 1px solid rgba(255,255,255,.95); border-radius: 28px;
    box-shadow: 0 22px 55px rgba(48,55,30,.1), inset 0 1px 0 rgba(255,255,255,.9);
}
.about-img figure::before { content: ""; position: absolute; width: 340px; height: 340px; right: -55px; bottom: -145px; border: 1px solid rgba(127,146,44,.15); border-radius: 50%; box-shadow: 0 0 0 28px rgba(255,255,255,.14), 0 0 0 58px rgba(255,255,255,.1); }
.about-visual-top { position: absolute; top: 22px; left: 26px; right: 26px; z-index: 1; display: flex; justify-content: space-between; color: #70775a; font-size: 9px; font-weight: 750; letter-spacing: .13em; }
.about-img img {
    position: relative; z-index: 1; display: block; width: min(88%, 520px); max-height: 330px; height: auto;
    margin: auto; object-fit: contain; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
    filter: grayscale(1) contrast(1.12) opacity(.76);
}
.about-img figcaption { position: absolute; z-index: 1; left: 28px; bottom: 23px; color: #626750; font-size: 12px; line-height: 1.45; }
.about-img figcaption strong { color: #303328; font-size: 15px; font-weight: 650; }
.about-floating-note { position: absolute; z-index: 2; right: -8px; bottom: 4px; display: flex; align-items: center; gap: 10px; padding: 12px 15px 12px 12px; background: rgba(255,255,255,.84); border: 1px solid rgba(255,255,255,.96); border-radius: 15px; box-shadow: 0 12px 30px rgba(44,48,33,.12); backdrop-filter: blur(18px); }
.about-floating-icon { display: grid; width: 34px; height: 34px; place-items: center; color: #71831e; background: #edf1dc; border-radius: 11px; }
.about-floating-note b, .about-floating-note small { display: block; }
.about-floating-note b { color: #34362f; font-size: 11px; }
.about-floating-note small { margin-top: 3px; color: #77796f; font-size: 9px; }
@media (max-width: 991px) {
    .about-copy { margin-bottom: 6px; }
    .about-img { min-height: 420px; }
    .about-img figure { min-height: 400px; }
}
@media (max-width: 575px) {
    #about .heading { margin-bottom: 24px; }
    .mission, .vision { padding: 19px 20px !important; }
    .about-img { min-height: 350px; padding: 0 4px 20px; }
    .about-img figure { min-height: 330px; padding: 42px 18px 65px; border-radius: 22px; }
    .about-img img { width: 100%; max-height: 230px; }
    .about-visual-top { left: 18px; right: 18px; }
    .about-img figcaption { left: 20px; bottom: 18px; }
    .about-floating-note { right: 0; bottom: 0; }
}

/* Partner showcase: tighter section rhythm and legible logo tiles. */
.partner-section { padding: 70px 0 !important; }
.partner-section .recommended-companies { max-width: 800px; margin: 0 auto 32px; }
.partner-section .recommended-companies .section-eyebrow { margin: 0 0 10px; color: #7b8c27 !important; font-size: 10px; font-weight: 750; letter-spacing: .16em; }
.partner-section .recommended-companies .section-eyebrow { display: block; width: 100%; max-width: none; margin: 0 auto 10px !important; text-align: center; }
.partner-section .recommended-companies h2 { margin-bottom: 12px; color: #24261f !important; font-size: clamp(34px, 4vw, 46px); letter-spacing: -.05em; }
.partner-section .recommended-companies > p:last-of-type { max-width: 640px; margin: 0 auto; color: #707269 !important; font-size: 16px; line-height: 1.65; }
.partner-section .marquee { padding: 6px 0; }
.partner-section .marquee-icon { gap: 0; mask-image: linear-gradient(to right, transparent, #000 5%, #000 95%, transparent); -webkit-mask-image: linear-gradient(to right, transparent, #000 5%, #000 95%, transparent); }
.partner-section .marquee-content { gap: 12px; padding: 6px 0; }
.partner-section .marquee-item { height: auto; padding: 0 6px; }
.partner-section .marquee-item > a,
.partner-section .marquee-item > img,
.partner-section .marquee-item > span {
    display: flex; align-items: center; justify-content: center; min-width: 170px; height: 78px;
    padding: 14px 20px; background: rgba(255,255,255,.82); border: 1px solid rgba(255,255,255,.98);
    border-radius: 17px; box-shadow: 0 8px 24px rgba(44,48,33,.07), inset 0 1px 0 #fff;
}
.partner-section .marquee-item > a { transition: transform .2s ease, box-shadow .2s ease; }
.partner-section .marquee-item > a:hover { transform: translateY(-3px); box-shadow: 0 13px 28px rgba(44,48,33,.12), inset 0 1px 0 #fff; }
.partner-section .marquee-item img {
    width: auto; max-width: 138px; height: 43px; padding: 0; object-fit: contain;
    filter: grayscale(1) brightness(.42) opacity(.8) !important;
}
.partner-section .marquee-item > a img { min-width: 0; height: 43px; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
.partner-section .marquee-item img:hover { filter: grayscale(1) brightness(.28) opacity(.92) !important; }
.partner-section .text-logo-partner { color: #505248 !important; font-size: 17px; font-weight: 650; letter-spacing: -.025em; }
.partner-section .marquee-item > img { width: auto; max-width: 170px; height: 78px; padding: 14px 20px; }
@media (max-width: 767px) {
    .partner-section { padding: 54px 0 !important; }
    .partner-section .recommended-companies { margin-bottom: 24px; }
    .partner-section .recommended-companies > p:last-of-type { font-size: 14px; }
    .partner-section .marquee-item > a, .partner-section .marquee-item > img,
    .partner-section .marquee-item > span { min-width: 145px; height: 68px; padding: 12px 16px; }
    .partner-section .marquee-item img, .partner-section .marquee-item > a img { height: 38px; }
    .partner-section .marquee-item > img { height: 68px; padding: 12px 16px; }
    .partner-section .text-logo-partner { font-size: 15px; }
}

/* A clear three-step process with consistent icon sizing and card rhythm. */
.workflow-section { padding: 82px 0 !important; }
.workflow-section .heading { margin-bottom: 30px; }
.workflow-section .heading h2 { color: #24261f !important; }
.workflow-section .heading p { color: #707269 !important; }
.workflow-section .row { --bs-gutter-x: 18px; }
.workflow-section .col-lg-4 { display: flex; }
.workflow {
    display: flex; flex-direction: column; width: 100%; min-height: 260px; height: auto;
    padding: 26px !important; text-align: left; background: rgba(255,255,255,.76) !important;
    border: 1px solid rgba(255,255,255,.97) !important; border-radius: 22px !important;
    box-shadow: 0 12px 32px rgba(44,48,33,.065), inset 0 1px 0 #fff !important;
    backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
}
.workflow:hover { transform: translateY(-4px) !important; border-color: rgba(169,189,53,.35) !important; box-shadow: 0 18px 38px rgba(44,48,33,.1), inset 0 1px 0 #fff !important; }
.workflow-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 30px; }
.workflow-step { color: #85877d; font-size: 10px; font-weight: 700; letter-spacing: .13em; }
.workflow-icon { display: grid; width: 48px; height: 48px; place-items: center; color: #68791c; background: #f0f3e6; border: 1px solid rgba(124,145,34,.1); border-radius: 15px; font-size: 18px; }
.workflow h3 { margin: 0 0 10px; color: #25271f !important; font-size: 20px; font-weight: 650; letter-spacing: -.035em; }
.workflow p { max-width: 310px; margin: 0; color: #707269 !important; font-size: 15px; line-height: 1.6; }
@media (max-width: 767px) {
    .workflow-section { padding: 64px 0 !important; }
    .workflow { min-height: 0; padding: 22px !important; }
    .workflow-header { margin-bottom: 22px; }
}

/* Service cards: enough detail to explain the offer without crowding the page. */
#services { padding-top: 82px !important; padding-bottom: 66px !important; }
#services .heading { margin-bottom: 30px; }
#services .heading h2 { color: #24261f !important; }
#services .heading p { color: #707269 !important; }
#services > .container > .row > .col-lg-12 { padding: 0; }
#services .services-style {
    min-height: 246px; height: 100%; padding: 24px 26px !important;
    background: rgba(255,255,255,.76) !important; border: 1px solid rgba(255,255,255,.97) !important;
    border-radius: 21px !important; box-shadow: 0 12px 32px rgba(44,48,33,.065), inset 0 1px 0 #fff !important;
    backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
}
#services .services-style:hover { transform: translateY(-4px) !important; border-color: rgba(169,189,53,.35) !important; box-shadow: 0 18px 38px rgba(44,48,33,.1), inset 0 1px 0 #fff !important; }
.service-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; }
#services .service-card-top .icon-box { width: 46px; height: 46px; margin: 0; display: grid; place-items: center; color: #68791c !important; background: #f0f3e6 !important; border: 1px solid rgba(124,145,34,.1); border-radius: 14px !important; box-shadow: none !important; }
#services .service-card-top .icon-box i { color: #68791c !important; font-size: 17px !important; filter: none !important; }
.service-card-top > span { color: rgba(35,37,29,.15); font-size: 24px; font-weight: 700; letter-spacing: -.06em; }
#services .services-style h3 { margin: 0 0 9px; font-size: 19px; font-weight: 650; }
#services .services-style h3 a { color: #262820 !important; font-size: inherit; }
#services .services-style p { max-width: 470px; margin: 0; color: #707269 !important; font-size: 14px; line-height: 1.65; }
@media (max-width: 767px) {
    #services { padding-top: 62px !important; padding-bottom: 54px !important; }
    #services .services-style { min-height: 0; padding: 22px !important; }
    .service-card-top { margin-bottom: 20px; }
}

/* Pricing comparison: clear annual price, highlighted recommendation, direct CTA. */
#pricing { padding-top: 82px !important; padding-bottom: 82px !important; }
#pricing .heading { max-width: 760px; margin: 0 auto 34px; text-align: center; }
#pricing .heading h2 { color: #24261f !important; }
#pricing .heading p { margin: 0 auto; color: #707269 !important; }
#pricing .row { align-items: stretch; --bs-gutter-x: 18px; }
#pricing .row > .col-lg-4 { display: flex; }
#pricing .pricing-table {
    position: relative; display: flex; flex-direction: column; width: 100%; height: 100%;
    padding: 30px 28px 26px !important; background: rgba(255,255,255,.78) !important;
    border: 1px solid rgba(255,255,255,.98) !important; border-radius: 23px !important;
    box-shadow: 0 12px 34px rgba(44,48,33,.075), inset 0 1px 0 #fff !important;
    backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px);
}
#pricing .pricing-table.two {
    background: linear-gradient(155deg, rgba(246,248,237,.96), rgba(255,255,255,.88)) !important;
    border-color: rgba(147,167,51,.4) !important;
    box-shadow: 0 18px 42px rgba(87,102,36,.13), inset 0 1px 0 #fff !important;
}
.pricing-featured-badge {
    position: absolute; top: 16px; right: 20px; display: inline-flex !important; align-items: center; gap: 6px;
    padding: 7px 10px; color: #637318 !important; background: rgba(226,235,190,.65);
    border: 1px solid rgba(139,157,51,.13); border-radius: 999px; font-size: 9px !important;
    font-weight: 750 !important; letter-spacing: .04em !important; line-height: 1 !important; text-transform: none !important;
}
.pricing-featured-badge i { font-size: 9px; }
#pricing .pricing-top { min-height: 153px; margin-bottom: 20px; padding-bottom: 19px; border-color: rgba(40,42,32,.1) !important; }
#pricing .pricing-top > span:not(.price-period) { margin: 0 0 10px; color: #71831e !important; font-size: 11px; letter-spacing: .13em; }
#pricing .pricing-top h3 { margin: 0 0 9px; color: #20211c !important; font-size: clamp(29px, 2.5vw, 36px); letter-spacing: -.055em; white-space: nowrap; }
#pricing .pricing-top h3 .price-period { display: inline; margin-left: 5px; color: #77796f !important; font-size: 13px; font-weight: 500; letter-spacing: 0; vertical-align: baseline; }
#pricing .pricing-top p { margin: 0; color: #707269 !important; font-size: 14px; }
#pricing .pricing-table ul { flex: 1 0 auto; margin: 0 0 26px; padding: 0; }
#pricing .pricing-table ul li { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 13px; color: #373930 !important; font-size: 13px; font-weight: 450; line-height: 1.5; }
#pricing .pricing-table ul li:last-child { margin-bottom: 0; }
#pricing .pricing-table ul li i { flex: 0 0 15px; margin-top: 2px; color: #74881e !important; font-size: 14px; }
#pricing .pricing-table > .button-wrapper { align-self: flex-start; min-height: 44px; margin-top: auto; padding: 0 16px 0 2px; background: #292b24 !important; border-radius: 999px; }
#pricing .pricing-table > .button-wrapper .button-arrow-wrapper { width: 42px; height: 42px; color: #fff !important; }
#pricing .pricing-table > .button-wrapper .button-main { height: 42px; padding: 0 6px 0 2px; color: #fff !important; font-size: 13px; font-weight: 600; }
#pricing .pricing-table > .button-wrapper:hover { background: #444936 !important; }
@media (max-width: 991px) {
    #pricing .pricing-table { padding: 28px 22px 24px !important; }
    #pricing .pricing-top h3 { font-size: clamp(27px, 4vw, 34px); }
}
@media (max-width: 767px) {
    #pricing { padding-top: 62px !important; padding-bottom: 62px !important; }
    #pricing .heading { margin-bottom: 26px; text-align: left; }
    #pricing .pricing-table { min-height: 0; padding: 27px 22px 22px !important; }
    #pricing .pricing-top { min-height: 0; padding-top: 22px; }
    #pricing .pricing-table.two .pricing-top { padding-top: 25px; }
    .pricing-featured-badge { top: 12px; right: 14px; }
}

/* Contact section: give the form context and a second direct contact path. */
#contact { padding: 82px 0 !important; border-top: 1px solid rgba(40,42,32,.08) !important; }
#contact .contact-layout { align-items: center; --bs-gutter-x: clamp(28px, 5vw, 68px); }
#contact .contact-intro { max-width: 430px; padding: 14px 0; }
#contact .contact-intro .section-eyebrow { margin: 0 0 14px; color: #7b8c27 !important; font-size: 10px; font-weight: 750; letter-spacing: .16em; }
#contact .contact-intro h2 { margin: 0 0 15px; color: #24261f !important; font-size: clamp(38px, 4vw, 50px); font-weight: 650; line-height: 1.04; letter-spacing: -.055em; }
#contact .contact-intro-copy { margin: 0; color: #707269 !important; font-size: 16px; line-height: 1.7; }
.contact-steps { display: grid; gap: 17px; margin: 30px 0 25px; }
.contact-step { display: flex; align-items: flex-start; gap: 13px; }
.contact-step > span { display: grid; width: 30px; height: 30px; flex: 0 0 30px; place-items: center; color: #70801f; background: #edf1dc; border: 1px solid rgba(124,145,34,.1); border-radius: 10px; font-size: 10px; font-weight: 700; }
.contact-step b, .contact-step small { display: block; }
.contact-step b { margin: 1px 0 3px; color: #34362f; font-size: 13px; font-weight: 650; }
.contact-step small { color: #77796f; font-size: 12px; line-height: 1.5; }
.contact-whatsapp { display: inline-flex; align-items: center; gap: 11px; min-height: 46px; padding: 0 15px; color: #38431b !important; background: rgba(231,237,207,.76); border: 1px solid rgba(169,189,53,.19); border-radius: 999px; font-size: 13px; font-weight: 650; }
.contact-whatsapp > i:first-child { color: #71831e; font-size: 17px; }
.contact-whatsapp > i:last-child { margin-left: 4px; color: #7a8460; font-size: 11px; }
.contact-whatsapp:hover { color: #27300f !important; background: #e3eabc; transform: translateY(-1px); }
#contact .contact-form-column { min-width: 0; }
#contact .contact-form { width: 100%; }
#contact .contact-form button.button-wrapper { box-shadow: 0 7px 18px rgba(112,132,30,.18) !important; }
@media (max-width: 991px) {
    #contact .contact-intro { max-width: 640px; margin-bottom: 14px; }
    #contact .contact-layout { align-items: stretch; }
}
@media (max-width: 767px) {
    #contact { padding: 64px 0 !important; }
    #contact .contact-intro { padding: 0; margin-bottom: 10px; }
    #contact .contact-intro h2 { font-size: 38px !important; }
    .contact-steps { gap: 13px; margin: 22px 0; }
    #contact .contact-form { padding: 22px !important; }
}

/* Footer finish: a calm closing surface with complete navigation. */
footer.webilte-footer {
    padding-top: 62px !important;
    background: rgba(237,240,228,.58) !important;
    border-top: 1px solid rgba(117,132,59,.12) !important;
    backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px);
}
footer.webilte-footer > .container > .row { align-items: flex-start; padding-bottom: 14px; }
.footer-left h2 { max-width: 390px; margin-bottom: 14px; font-size: clamp(30px, 3.1vw, 38px); }
.footer-left p.footer-note { max-width: 340px; margin: 0 0 20px; color: #707269 !important; font-size: 14px; font-weight: 400; line-height: 1.6; letter-spacing: 0; text-transform: none; }
.footer-column-title { margin: 6px 0 13px; color: #85877d !important; font-size: 10px; font-weight: 750; letter-spacing: .14em; }
.footer-center { padding-top: 0; }
.footer-center ul { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 2px 22px; }
.footer-center ul li a { min-height: 36px; padding: 7px 0; font-size: 14px; }
.footer-link { padding-top: 0; gap: 4px; }
.footer-link li a { min-height: 38px; font-size: 14px; }
.footer-link li a i { width: 34px; height: 34px; }
.footer-bottom { margin-top: 26px; padding: 19px 0; border-color: rgba(40,42,32,.1) !important; }
.footer-bottom-style > a { display: inline-flex; align-items: center; }
.footer-bottom-style p { color: #77796f !important; }
@media (max-width: 767px) {
    footer.webilte-footer { padding-top: 48px !important; }
    footer.webilte-footer > .container > .row { padding-bottom: 0; }
    .footer-column-title { margin-top: 6px; }
    .footer-center ul { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .footer-bottom { margin-top: 20px; }
}

/* Whitelabel product cards: stronger product hierarchy and distinct actions. */
#whitelabel-apps { padding: 78px 0 !important; }
#whitelabel-apps .heading { margin-bottom: 32px; }
#whitelabel-apps .heading .section-eyebrow { margin: 0 0 10px; color: #7b8c27 !important; font-size: 10px; font-weight: 750; letter-spacing: .15em; }
#whitelabel-apps .heading h2 { color: #24261f !important; }
#whitelabel-apps .heading > p:last-of-type { color: #707269 !important; }
#whitelabel-apps .row { align-items: stretch; --bs-gutter-x: 18px; }
#whitelabel-apps .row > .col-lg-6 { display: flex; }
.whitelabel-card {
    min-height: 100%; gap: 26px; padding: 28px !important;
    background: rgba(255,255,255,.78) !important; border: 1px solid rgba(255,255,255,.98) !important;
    border-radius: 22px !important; box-shadow: 0 12px 34px rgba(44,48,33,.075), inset 0 1px 0 #fff !important;
    backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px);
}
.whitelabel-card:hover { transform: translateY(-3px); border-color: rgba(169,189,53,.3) !important; box-shadow: 0 18px 40px rgba(44,48,33,.11), inset 0 1px 0 #fff !important; }
.whitelabel-card-body { flex: 1; }
.whitelabel-card-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 23px; }
.whitelabel-card-head .icon-box { width: 48px !important; height: 48px !important; min-width: 48px; margin: 0 !important; color: #68791c !important; background: #f0f3e6 !important; border: 1px solid rgba(124,145,34,.1); border-radius: 14px !important; }
.whitelabel-card-head .icon-box i { color: #68791c !important; font-size: 17px !important; }
.whitelabel-card-label { padding: 7px 10px; color: #7b842f; background: #f5f6ef; border-radius: 999px; font-size: 9px; font-weight: 750; letter-spacing: .1em; }
.whitelabel-card h3 { margin: 0 0 11px !important; color: #25271f !important; font-size: 23px !important; font-weight: 650 !important; letter-spacing: -.035em; }
.whitelabel-card p { margin: 0 !important; color: #707269 !important; font-size: 14px !important; line-height: 1.7 !important; }
.whitelabel-card-actions { display: flex; align-items: center; gap: 10px; margin-top: auto; flex-wrap: wrap; }
.whitelabel-card a.button-wrapper.whitelabel-demo,
.whitelabel-card a.button-wrapper.whitelabel-order {
    min-height: 44px; padding: 0 15px 0 2px !important; border-radius: 999px !important;
    box-shadow: none !important; transform: none;
}
.whitelabel-card a.button-wrapper.whitelabel-demo { color: #44473c !important; background: rgba(255,255,255,.88) !important; border: 1px solid rgba(40,42,32,.12) !important; }
.whitelabel-card a.button-wrapper.whitelabel-order { color: #fff !important; background: #2c3023 !important; border: 1px solid #2c3023 !important; }
.whitelabel-card a.button-wrapper.whitelabel-demo .button-arrow-wrapper,
.whitelabel-card a.button-wrapper.whitelabel-order .button-arrow-wrapper { display: grid; width: 40px; height: 40px; place-items: center; background: transparent !important; color: inherit !important; }
.whitelabel-card a.button-wrapper.whitelabel-demo .button-arrow-wrapper i { color: #68791c !important; font-size: 12px; }
.whitelabel-card a.button-wrapper.whitelabel-order .button-arrow-wrapper i { color: #fff !important; font-size: 17px; }
.whitelabel-card a.button-wrapper.whitelabel-demo .button-main,
.whitelabel-card a.button-wrapper.whitelabel-order .button-main { height: 40px; padding: 0 2px !important; color: inherit !important; background: transparent !important; font-size: 13px !important; font-weight: 600; }
.whitelabel-card a.button-wrapper.whitelabel-demo:hover { background: #f4f5ef !important; }
.whitelabel-card a.button-wrapper.whitelabel-order:hover { background: #424936 !important; }
@media (max-width: 767px) {
    #whitelabel-apps { padding: 60px 0 !important; }
    .whitelabel-card { padding: 23px !important; }
    .whitelabel-card-head { margin-bottom: 18px; }
}