/* Mansa Digital additions on top of the Cloudly theme */

/* Logo */
.header-main .header-logo img, .header-main .header-logo-2 img { width: 190px; height: auto; }
.pp-footer-logo img.mansa-logo, .offcanvas__logo img.mansa-logo { width: 190px; height: auto; }
@media (max-width: 470px) { .header-1 .logo img { width: 150px; } }

/* Client logos in the brand slider */
.pp-brand-section .brand-image img { max-height: 54px; width: auto; max-width: 160px; object-fit: contain; filter: grayscale(1); opacity: .7; transition: filter .3s, opacity .3s; }
.pp-brand-section .brand-image:hover img { filter: none; opacity: 1; }

/* Project images keep the theme's card shape */
.pp-project-card-item .pp-project-image img { aspect-ratio: 420 / 570; object-fit: cover; }
.pp-project-card-item .pp-project-content h3 a { color: #fff; }
.pp-news-card-item-2 .pp-news-image img { aspect-ratio: 387 / 216; object-fit: cover; width: 100%; }
.pp-project-details-image img { width: 100%; max-height: 640px; object-fit: cover; }
.pp-instagram-banner-items .pp-banner-image img { aspect-ratio: 1 / 1; object-fit: cover; width: 100%; }
.pp-service-details-image img, .pp-service-details-content .pp-thumb img { width: 100%; object-fit: cover; }

/* Reviews: initials instead of photos */
.pp-client-image .pp-initial { width: 56px; height: 56px; border-radius: 50%; background: linear-gradient(270deg, #A121CA 0%, #7B1FE4 100%); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 20px; font-family: "DM Sans", sans-serif; }
.pp-testimonial-card .pp-stars { color: #FFB800; font-size: 14px; margin-bottom: 14px; letter-spacing: 2px; }
.pp-google-rating { display: inline-flex; align-items: center; gap: 10px; margin-top: 16px; font-weight: 600; color: var(--pp-header); }
.pp-google-rating i { color: #FFB800; }

/* Pricing note */
.pp-pricing-note { text-align: center; color: rgba(255,255,255,.75); margin-top: 40px; font-size: 15px; }
.pp-pricing-section:not(.section-bg-2) .pp-pricing-note { color: var(--pp-text); }
.pp-pricing-header h2 { white-space: nowrap; }
.pp-pricing-header .pp-from { display: block; font-size: 14px; font-weight: 500; color: var(--pp-text); margin-bottom: 4px; }

/* Contact form */
.pp-contact-form-items select.form-select-mansa { width: 100%; border: none; outline: none; background-color: var(--pp-bg); padding: 16px 20px; border-radius: 8px; color: var(--pp-text); font-size: 16px; height: auto; }
.pp-contact-form-items .form-clt.has-error input, .pp-contact-form-items .form-clt.has-error textarea { box-shadow: 0 0 0 2px #e5484d inset; }
.pp-contact-form-items .enq-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.enq-alert { background: #fdecec; color: #8a1c1c; border-radius: 12px; padding: 16px 20px; margin-bottom: 24px; font-size: 15px; }
.enq-note { font-size: 14px; line-height: 1.5; color: var(--pp-text); margin: 0; }
.enq-note a { color: var(--pp-theme); }
.pp-contact-box-item .pp-hours { margin-top: 30px; font-size: 15px; color: var(--pp-text); }
.pp-contact-box-item .pp-next { margin-top: 30px; padding-top: 24px; border-top: 1px solid var(--pp-border); }
.pp-contact-box-item .pp-next h4 { font-size: 20px; margin-bottom: 12px; }
.pp-contact-box-item .pp-next ol { padding-left: 18px; margin: 0; color: var(--pp-text); }
.pp-contact-box-item .pp-next li { margin-bottom: 8px; line-height: 1.5; }
.pp-map-section iframe { width: 100%; height: 450px; display: block; }

/* Simple text pages (privacy, thank you) */
.pp-text-page { max-width: 860px; margin: 0 auto; }
.pp-text-page h2 { font-size: 28px; margin: 34px 0 14px; }
.pp-text-page p, .pp-text-page li { color: var(--pp-text); line-height: 1.7; }
.pp-text-page ul { padding-left: 20px; }

/* Project details: extra info row and live site button */
.pp-details-box .pp-content span a { color: inherit; }
.pp-project-details-content .pp-visit { margin: 10px 0 30px; }
.pp-project-details-content ul.pp-built { padding-left: 0; list-style: none; margin: 0 0 24px; }
.pp-project-details-content ul.pp-built li { position: relative; padding-left: 30px; margin-bottom: 12px; color: var(--pp-text); }
.pp-project-details-content ul.pp-built li i { position: absolute; left: 0; top: 4px; color: var(--pp-theme); }
.pp-details-box .pp-icon i { font-size: 26px; color: #fff; }

/* Offer cards link */
.pp-offer-box-item h3 a { color: inherit; }
.pp-offer-box-item h3 a:hover { color: var(--pp-theme); }
.pp-offer-box-item .pp-offer-icon i { font-size: 26px; color: #fff; }

/* WhatsApp popup */
.wa-chat { position: fixed; right: 24px; bottom: 100px; z-index: 9990; font-family: inherit; }
.wa-chat__btn { width: 58px; height: 58px; border-radius: 50%; border: 0; background: #25D366; color: #fff; font-size: 32px; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 10px 25px rgba(0,0,0,.2); transition: transform .2s ease; }
.wa-chat__btn:hover { transform: scale(1.06); }
.wa-chat__pop { position: absolute; right: 0; bottom: 72px; width: 300px; max-width: calc(100vw - 48px); background: #fff; color: #1b1b1b; border-radius: 18px; padding: 18px; box-shadow: 0 20px 50px rgba(0,0,0,.18); animation: waIn .3s ease; }
.wa-chat__pop[hidden] { display: none; }
@keyframes waIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.wa-chat__close { position: absolute; top: 8px; right: 10px; border: 0; background: none; font-size: 22px; line-height: 1; color: #777; cursor: pointer; padding: 4px; }
.wa-chat__head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.wa-chat__head strong { display: block; font-size: 15px; }
.wa-chat__head span { display: block; font-size: 12px; color: #6b6b6b; }
.wa-chat__head .wa-chat__avatar { position: relative; display: block; width: 44px; height: 44px; flex: none; }
.wa-chat__avatar img { display: block; width: 44px; height: 44px; border-radius: 50%; }
.wa-chat__avatar i { position: absolute; right: -3px; bottom: -3px; width: 20px; height: 20px; border-radius: 50%; background: #25D366; color: #fff; font-size: 12px; display: flex; align-items: center; justify-content: center; border: 2px solid #fff; }
.wa-chat__msg { background: #F0F2F5; border-radius: 0 12px 12px 12px; padding: 12px 14px; font-size: 14px; line-height: 1.5; margin: 0 0 14px; }
.wa-chat__start { display: flex; align-items: center; justify-content: center; gap: 8px; background: #25D366; color: #fff !important; text-decoration: none; border-radius: 30px; padding: 11px 16px; font-weight: 600; font-size: 15px; }
.wa-chat__start:hover { background: #1EBE5A; }
@media (max-width: 767px) { .wa-chat { right: 16px; bottom: 84px; } .wa-chat__btn { width: 52px; height: 52px; font-size: 28px; } }

.pp-contact-info .pp-content h6, .pp-contact-info .pp-content h6 a, .pp-contact-item .pp-content a, .offcanvas__contact-text a { text-transform: none; }
.pp-google-rating .pp-g-stars { font-weight: 400; letter-spacing: 2px; }
.pp-footer-widget-wrapper .pp-footer-widget-items .pp-contact-info .pp-content h6 { color: var(--pp-white); line-height: 170%; }
/* Counters inside the about layout used on inner pages */
.pp-about-wrapper-2 .about-count-item { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin: 30px 0 36px; border-top: 1px solid rgba(204, 203, 209, 0.24); border-bottom: 1px solid rgba(204, 203, 209, 0.24); padding: 24px 0; }
.pp-about-wrapper-2 .about-count-item .count-text h2 { font-size: 40px; font-weight: 700; margin-bottom: 4px; }
.pp-about-wrapper-2 .about-count-item .count-text p { margin: 0; }

.pp-service-details-image img.pp-svc-hero { height: 520px; object-fit: cover; object-position: center 35%; border-radius: 16px; }
@media (max-width: 767px) { .pp-service-details-image img.pp-svc-hero { height: 300px; } }
.pp-pricing-section:not(.section-bg-2) .pricing-two__tab .nav-link { color: var(--pp-header); }

/* Home hero: animated grid squares */
.pp-hero-1 .top-shape { overflow: hidden; border-radius: 48px; }
.pp-grid-glow { position: absolute; inset: 0; pointer-events: none; }
.pp-grid-glow span { position: absolute; opacity: 0; background: linear-gradient(160deg, rgba(255,255,255,.42) 0%, rgba(255,255,255,.18) 60%, rgba(255,255,255,.06) 100%); box-shadow: inset 0 0 0 1px rgba(255,255,255,.35), 0 0 24px rgba(255,255,255,.18); transition: opacity 1.1s ease-in-out; }
.pp-grid-glow span.on { opacity: 1; }
.pp-grid-glow.is-mobile span { background: linear-gradient(160deg, rgba(255,255,255,.5) 0%, rgba(255,255,255,.22) 60%, rgba(255,255,255,.08) 100%); }
@media (max-width: 575px) { .pp-hero-1 .top-shape { border-radius: 24px; } }

/* Home hero: plain purple gradient */
.pp-hero-1::before { background: linear-gradient(270deg, #A121CA 0%, #7B1FE4 100%); }
.pp-hero-1 .top-shape { display: none; }

/* Home hero: three full-page website previews that scroll on hover */
.pp-hero-1 .pp-hero-image .mx-showcase { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; background: linear-gradient(180deg, #FFFFFF 0%, #FBF8FF 45%, #F1E6FF 100%); border: 1px solid rgba(255,255,255,.7); border-radius: 24px; padding: 24px; box-shadow: 0 0 0 10px rgba(255,255,255,.12), 0 30px 70px rgba(60, 15, 120, .22); }
/* Same slide-up reveal as the theme, but it ends without cutting off the soft shadow */
.pp-hero-1 .pp-hero-image.img-custom-anim-bottom { animation-name: mx-anim-bottom; }
@keyframes mx-anim-bottom { 0% { transform: translateY(5%); clip-path: inset(100% -120px -120px -120px); opacity: 0; } 100% { transform: translateY(0); clip-path: inset(-120px -120px -120px -120px); opacity: 1; } }
.mx-shot { position: relative; display: block; aspect-ratio: 3 / 4.6; overflow: hidden; border-radius: 16px; background: #f1f1f4; box-shadow: 0 10px 30px rgba(0,0,0,.12); cursor: pointer; }
.pp-hero-1 .pp-hero-image .mx-shot img { position: absolute; top: 0; left: 0; width: 100%; height: auto; border: 0; border-radius: 0; transform: translateY(0); filter: grayscale(1); transition: transform var(--dur-back, 1.2s) cubic-bezier(.4,0,.2,1), filter .5s ease; will-change: transform; }
.pp-hero-1 .pp-hero-image .mx-shot:hover img, .pp-hero-1 .pp-hero-image .mx-shot.is-scrolling img { transform: translateY(calc(-1 * var(--shift, 0px))); filter: grayscale(0); transition: transform var(--dur, 8s) linear, filter .5s ease; }
.mx-shot__label { position: absolute; left: 14px; bottom: 14px; background: rgba(26,25,46,.85); color: #fff; font-size: 13px; font-weight: 600; padding: 7px 14px; border-radius: 30px; opacity: 0; transform: translateY(6px); transition: opacity .3s, transform .3s; pointer-events: none; }
.mx-shot:hover .mx-shot__label, .mx-shot.is-scrolling .mx-shot__label { opacity: 1; transform: none; }
@media (max-width: 991px) {
    .pp-hero-1 .pp-hero-image .mx-showcase { gap: 14px; padding: 14px; border-radius: 18px; }
}
@media (max-width: 767px) {
    .pp-hero-1 .pp-hero-image .mx-showcase { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
    .pp-hero-1 .pp-hero-image .mx-showcase::-webkit-scrollbar { display: none; }
    .mx-shot-item { flex: 0 0 78%; scroll-snap-align: center; }
    .mx-shot__label { opacity: 1; transform: none; }
}

/* Home about: Mutsh website demo video, blended into the page (no frame) */
.mx-about-video { position: relative; background: transparent; }
.mx-about-video video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; mix-blend-mode: multiply; filter: brightness(1.05) contrast(1.06); -webkit-mask-image: radial-gradient(ellipse 72% 70% at 50% 50%, #000 70%, transparent 100%); mask-image: radial-gradient(ellipse 72% 70% at 50% 50%, #000 70%, transparent 100%); }

/* "How it works" dark section: same animated squares, softer for the dark background */
.pp-how-work-section .top-shape { overflow: hidden; border-radius: 48px; }
.pp-grid-glow.is-dark span { background: linear-gradient(160deg, rgba(255,255,255,.14) 0%, rgba(255,255,255,.06) 60%, rgba(255,255,255,.02) 100%); box-shadow: inset 0 0 0 1px rgba(255,255,255,.12), 0 0 30px rgba(161,33,202,.25); }
.pp-grid-glow.is-dark.is-mobile span { background: linear-gradient(160deg, rgba(255,255,255,.18) 0%, rgba(255,255,255,.07) 60%, rgba(255,255,255,.02) 100%); }
@media (max-width: 575px) { .pp-how-work-section .top-shape { border-radius: 24px; } }

/* Home: soft lavender wash from the bottom of the hero block into the top of the reviews section */
@media (min-width: 1200px) {
    .pp-hero-1::after { content: ""; position: absolute; left: -40px; right: -40px; top: 85%; bottom: 0; z-index: -2; background: linear-gradient(180deg, #FFFFFF 0%, #F6EEFF 100%); pointer-events: none; }
    .pp-hero-1 + .pp-testimonial-section { background: linear-gradient(180deg, #F6EEFF 0%, #FFFFFF 340px); }
}
@media (max-width: 1199px) {
    .pp-hero-1 + .pp-testimonial-section { background: linear-gradient(180deg, #F6EEFF 0%, #FFFFFF 260px); }
}

/* Home key features: browser frame with a full-page site that scrolls on hover */
.mx-feature-browser { position: relative; max-width: 560px; margin: 0 auto; background: linear-gradient(180deg,#FFFFFF 0%,#FBF8FF 55%,#F1E6FF 100%); border: 1px solid #EEE6FA; border-radius: 24px; padding: 0 18px 18px; box-shadow: 0 0 0 10px rgba(123,31,228,.04), 0 30px 70px rgba(60,15,120,.16); }
.mx-feature-browser__bar { display: flex; gap: 7px; padding: 16px 4px 14px; }
.mx-feature-browser__bar span { width: 11px; height: 11px; border-radius: 50%; background: #E3D6F7; }
.mx-feature-browser__bar span:first-child { background: #A121CA; }
.mx-feature-browser__bar span:nth-child(2) { background: #C79BF0; }
.mx-feature-browser .mx-feature-shot { aspect-ratio: 4 / 3.6; border-radius: 14px; }
.mx-feature-browser .mx-feature-shot img { position: absolute; top: 0; left: 0; width: 100%; height: auto; transform: translateY(0); will-change: transform; }
@media (max-width: 575px) { .mx-feature-browser { padding: 0 12px 12px; border-radius: 18px; } }

/* Home CTA: cut-out person that sits on the bottom edge of the purple section */
.mx-cta-person { position: relative; max-width: 470px; margin: -40px auto -120px; }
.mx-cta-person::before { content: ""; position: absolute; left: 6%; right: 6%; top: 12%; bottom: 0; background: radial-gradient(closest-side, rgba(255,255,255,.28), rgba(255,255,255,0)); z-index: 0; pointer-events: none; }
.mx-cta-person img { position: relative; z-index: 1; display: block; width: 100%; height: auto; filter: drop-shadow(0 20px 40px rgba(40,6,90,.35)); }
@media (max-width: 1199px) { .mx-cta-person { margin-bottom: -100px; } }
@media (max-width: 991px) { .mx-cta-person { max-width: 380px; margin: 0 auto -80px; } .pp-cta-section .row > .align-self-end { order: 2; } }
@media (max-width: 575px) { .mx-cta-person { max-width: 300px; } }

/* About: founder photo */
.mx-founder { position: relative; max-width: 500px; margin: 0 auto; }
.mx-founder > img { position: relative; z-index: 1; display: block; width: 100%; height: auto; border-radius: 24px; box-shadow: 0 0 0 10px rgba(123,31,228,.06), 0 30px 70px rgba(60,15,120,.22); }
.mx-founder .pp-blur-shape { z-index: 0; }
.mx-founder__tag { position: absolute; z-index: 2; left: -30px; bottom: 40px; background: #fff; border-radius: 16px; padding: 14px 20px; box-shadow: 0 18px 40px rgba(60,15,120,.18); border-left: 4px solid #7B1FE4; }
.mx-founder__tag strong { display: block; color: #1A192E; font-size: 17px; line-height: 1.3; }
.mx-founder__tag span { display: block; color: #7B1FE4; font-size: 14px; font-weight: 500; }
@media (max-width: 575px) { .mx-founder__tag { left: 12px; bottom: 16px; padding: 10px 14px; } .mx-founder__tag strong { font-size: 15px; } }

/* Services mega menu (desktop) */
@media (min-width: 1200px) {
    .header-1 .header-main { position: relative; }
    .header-main .main-menu ul li.has-mega { position: static; }
    .header-main .main-menu ul li.has-mega > .submenu { display: none !important; }
    .mx-mega { position: absolute; left: 50%; top: 100%; width: min(1180px, calc(100vw - 48px)); transform: translate(-50%, 12px); opacity: 0; visibility: hidden; transition: opacity .3s ease, transform .3s ease, visibility .3s; z-index: 99999; padding-top: 6px; }
    .header-main .main-menu ul li.has-mega:hover > .mx-mega, .header-main .main-menu ul li.has-mega:focus-within > .mx-mega { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
    .mx-mega__inner { display: grid; grid-template-columns: 1fr 340px; background: #fff; border-radius: 22px; overflow: hidden; box-shadow: 0 30px 80px rgba(40,10,90,.18), 0 0 0 1px rgba(123,31,228,.06); border-top: 4px solid #7B1FE4; }
    .mx-mega__main { padding: 30px 32px 22px; }
    .mx-mega__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; }
    .mx-mega__head span { font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #7B1FE4; }
    .header-main .main-menu .mx-mega a { text-transform: none; padding: 0; font-family: inherit; }
    .header-main .main-menu .mx-mega__head a { font-size: 14px; font-weight: 600; color: #1A192E; }
    .mx-mega__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
    .header-main .main-menu .mx-mega a.mx-mega__card { display: flex; gap: 14px; align-items: flex-start; padding: 14px; border-radius: 14px; transition: background .25s, transform .25s; }
    .header-main .main-menu .mx-mega a.mx-mega__card:hover { background: #F6EEFF; transform: translateX(3px); }
    .mx-mega__icon { flex: 0 0 52px; width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: #fff; border: 1px solid #E6D9FA; color: #7B1FE4; transition: background .25s, border-color .25s, color .25s; }
    .header-main .main-menu .mx-mega a.mx-mega__card .mx-mega__icon i { margin: 0; font-size: 22px; --fa-primary-color: #7B1FE4; --fa-secondary-color: #A121CA; --fa-secondary-opacity: .35; }
    .header-main .main-menu .mx-mega a.mx-mega__card:hover .mx-mega__icon { background: linear-gradient(270deg,#A121CA 0%,#7B1FE4 100%); border-color: transparent; color: #fff; }
    .header-main .main-menu .mx-mega a.mx-mega__card:hover .mx-mega__icon i { --fa-primary-color: #fff; --fa-secondary-color: #fff; --fa-secondary-opacity: .45; }
    .mx-mega__txt strong { display: block; font-size: 16px; font-weight: 700; color: #1A192E; line-height: 1.3; margin-bottom: 3px; }
    .mx-mega__txt small { display: block; font-size: 14px; color: #6B6A7B; line-height: 1.45; }
    .mx-mega__foot { display: flex; gap: 26px; margin-top: 16px; padding-top: 16px; border-top: 1px solid #EFE9F7; }
    .header-main .main-menu .mx-mega__foot a { font-size: 14px; font-weight: 500; color: #4A4960; }
    .header-main .main-menu .mx-mega__foot a i { color: #7B1FE4; margin: 0 6px 0 0; }
    .mx-mega__promo { position: relative; padding: 34px 30px; color: #fff; background: radial-gradient(circle at 85% 10%, rgba(255,255,255,.18), transparent 45%), linear-gradient(160deg, #7B1FE4 0%, #A121CA 100%); display: flex; flex-direction: column; justify-content: center; }
    .mx-mega__eyebrow { font-size: 13px; font-weight: 600; opacity: .85; margin-bottom: 8px; }
    .mx-mega__promo strong { font-size: 22px; line-height: 1.25; margin-bottom: 10px; }
    .mx-mega__promo p { font-size: 14px; line-height: 1.55; color: rgba(255,255,255,.85); margin-bottom: 20px; }
    .header-main .main-menu .mx-mega a.mx-mega__btn { display: inline-flex; align-self: flex-start; align-items: center; gap: 8px; background: #fff; color: #1A192E; font-weight: 600; font-size: 15px; padding: 12px 22px; border-radius: 40px; }
    .header-main .main-menu .mx-mega a.mx-mega__btn:hover { color: #7B1FE4 !important; }
    .header-main .main-menu .mx-mega a.mx-mega__wa { margin-top: 14px; font-size: 14px; color: #fff; }
    .header-main .main-menu .mx-mega a.mx-mega__wa:hover { color: #fff !important; text-decoration: underline; }
}
@media (max-width: 1199px) { .mx-mega { display: none !important; } }
.mean-container .mx-mega { display: none !important; }

/* Home hero: middle preview stays in colour and auto scrolls (driven by mansa.js) */
.pp-hero-1 .pp-hero-image .mx-shot.mx-shot--auto img,
.pp-hero-1 .pp-hero-image .mx-shot.mx-shot--auto:hover img,
.pp-hero-1 .pp-hero-image .mx-shot.mx-shot--auto.is-scrolling img { filter: none; transition: none; }

/* Home hero: website address and credit under each preview */
.mx-shot-item { min-width: 0; }
.mx-shot__cap { display: flex; flex-direction: column; align-items: center; gap: 2px; padding-top: 14px; text-align: center; }
.mx-shot__cap a { display: inline-flex; align-items: center; gap: 7px; font-size: 16px; font-weight: 700; color: #1A192E; letter-spacing: .01em; transition: color .25s; }
.mx-shot__cap a i { color: #7B1FE4; font-size: 14px; }
.mx-shot__cap a:hover { color: #7B1FE4; }
.mx-shot__cap span { font-size: 13px; font-weight: 500; color: #7B1FE4; }
@media (max-width: 575px) { .mx-shot__cap a { font-size: 14px; } .mx-shot__cap span { font-size: 12px; } }
.mx-founder__tag a.mx-founder__in { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; font-size: 13px; font-weight: 600; color: #0A66C2; }
.mx-founder__tag a.mx-founder__in i { font-size: 15px; }
.mx-founder__tag a.mx-founder__in:hover { text-decoration: underline; }

/* Space between the dark How It Works block and the dark review section (About page) */
.pp-how-work-section + .pp-testimonial-section { margin-top: 30px; }
@media (max-width: 767px) { .pp-how-work-section + .pp-testimonial-section { margin-top: 16px; } }
/* White gap above the purple call to action block on every page */
.pp-cta-section { margin-top: 30px; }
@media (max-width: 767px) { .pp-cta-section { margin-top: 16px; } }

/* Service cards: Font Awesome icons in the theme's purple tile */
.pp-offer-box-item .mx-offer-icon i { color: #fff; font-size: 30px; line-height: 72px; --fa-primary-color: #fff; --fa-secondary-color: #fff; --fa-secondary-opacity: .5; transition: transform .4s ease-in-out; }
.pp-offer-box-item:hover .mx-offer-icon i { transform: scale(1.08); }

/* Our Work: service filter */
.mx-work-filter { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-bottom: 40px; }
.mx-work-filter button { display: inline-flex; align-items: center; gap: 8px; border: 1px solid #E6D9FA; background: #fff; color: #1A192E; font-weight: 600; font-size: 15px; padding: 10px 18px; border-radius: 40px; transition: all .25s; }
.mx-work-filter button i { color: #7B1FE4; --fa-primary-color: #7B1FE4; --fa-secondary-color: #A121CA; --fa-secondary-opacity: .35; }
.mx-work-filter button span { font-size: 12px; background: #F3EAFE; color: #7B1FE4; border-radius: 20px; padding: 2px 8px; }
.mx-work-filter button:hover { border-color: #7B1FE4; }
.mx-work-filter button.is-active { background: linear-gradient(270deg,#A121CA 0%,#7B1FE4 100%); border-color: transparent; color: #fff; }
.mx-work-filter button.is-active i { color: #fff; --fa-primary-color: #fff; --fa-secondary-color: #fff; --fa-secondary-opacity: .5; }
.mx-work-filter button.is-active span { background: rgba(255,255,255,.2); color: #fff; }
.mx-work-item.is-hidden { display: none; }
@media (max-width: 575px) { .mx-work-filter { justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px; scrollbar-width: none; } .mx-work-filter button { flex: 0 0 auto; font-size: 14px; } }

/* Project page: site preview beside the description */
.mx-case-intro { margin-bottom: 50px; }
.mx-case-intro .mx-feature-browser { max-width: 100%; }
.mx-case-tag { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: #7B1FE4; background: #F6EEFF; border-radius: 30px; padding: 7px 16px; margin-bottom: 16px; }
.mx-case-tag i { --fa-primary-color: #7B1FE4; --fa-secondary-color: #A121CA; --fa-secondary-opacity: .35; }
.mx-case-tag:hover { background: #7B1FE4; color: #fff; }
.mx-case-tag:hover i { --fa-primary-color: #fff; --fa-secondary-color: #fff; color: #fff; }

/* Project cards: browser frame with the real website, scrolls on hover */
.mx-site-card { height: 100%; background: #fff; border: 1px solid #EFE7FA; border-radius: 22px; padding: 14px 14px 22px; box-shadow: 0 18px 50px rgba(60,15,120,.08); transition: box-shadow .3s, transform .3s; }
.mx-site-card:hover { box-shadow: 0 26px 60px rgba(60,15,120,.16); transform: translateY(-4px); }
.mx-site-card__frame { display: block; background: linear-gradient(180deg,#FBF8FF 0%,#F1E6FF 100%); border-radius: 16px; padding: 0 10px 10px; }
.mx-site-card__bar { display: flex; gap: 6px; padding: 11px 2px 10px; }
.mx-site-card__bar span { width: 9px; height: 9px; border-radius: 50%; background: #E3D6F7; }
.mx-site-card__bar span:first-child { background: #A121CA; }
.mx-site-card__bar span:nth-child(2) { background: #C79BF0; }
.mx-site-card .mx-site-card__shot { display: block; aspect-ratio: 4 / 3.3; border-radius: 10px; box-shadow: 0 6px 18px rgba(0,0,0,.08); }
.mx-site-card .mx-site-card__shot img { position: absolute; top: 0; left: 0; width: 100%; height: auto; transform: translateY(0); transition: transform var(--dur-back, 1.2s) cubic-bezier(.4,0,.2,1); will-change: transform; }
.mx-site-card .mx-site-card__frame:hover .mx-site-card__shot img, .mx-site-card .mx-site-card__shot.is-scrolling img { transform: translateY(calc(-1 * var(--shift, 0px))); transition: transform var(--dur, 8s) linear; }
.mx-site-card__body { padding: 18px 8px 0; }
.mx-site-card__body h3 { font-size: 21px; line-height: 1.3; margin: 10px 0 10px; }
.mx-site-card__body h3 a { color: #1A192E; }
.mx-site-card__body h3 a:hover { color: #7B1FE4; }
.mx-site-card__meta { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 14px; color: #6B6A7B; }
.mx-site-card__meta i { color: #7B1FE4; margin-right: 4px; }
.mx-site-card__meta a { font-weight: 600; color: #7B1FE4; }
.mx-site-card__meta a i { margin: 0 0 0 4px; }
.mx-work-cat { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; letter-spacing: .02em; color: #7B1FE4; background: #F6EEFF; border-radius: 20px; padding: 5px 12px; }
.mx-work-cat i { --fa-primary-color: #7B1FE4; --fa-secondary-color: #A121CA; --fa-secondary-opacity: .35; }

/* Project page: full width website preview that auto scrolls */
.mx-wide-browser { background: linear-gradient(180deg,#FFFFFF 0%,#FBF8FF 55%,#F1E6FF 100%); border: 1px solid #EEE6FA; border-radius: 26px; padding: 0 22px 22px; box-shadow: 0 0 0 10px rgba(123,31,228,.04), 0 34px 80px rgba(60,15,120,.16); }
.mx-wide-browser__bar { display: flex; align-items: center; gap: 18px; padding: 16px 4px 15px; }
.mx-wide-browser__dots { display: flex; gap: 8px; }
.mx-wide-browser__dots span { width: 12px; height: 12px; border-radius: 50%; background: #E3D6F7; }
.mx-wide-browser__dots span:first-child { background: #A121CA; }
.mx-wide-browser__dots span:nth-child(2) { background: #C79BF0; }
.mx-wide-browser__url { flex: 0 1 460px; margin: 0 auto; transform: translateX(-30px); text-align: center; font-size: 14px; color: #6B6A7B; background: #fff; border: 1px solid #EDE5F8; border-radius: 30px; padding: 6px 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx-wide-browser__url i { color: #7B1FE4; font-size: 11px; margin-right: 6px; }
.mx-wide-browser .mx-wide-browser__shot { aspect-ratio: 16 / 8.4; border-radius: 14px; box-shadow: 0 8px 24px rgba(0,0,0,.08); cursor: default; }
.mx-wide-browser .mx-wide-browser__shot img { position: absolute; top: 0; left: 0; width: 100%; height: auto; transform: translateY(0); will-change: transform; }
.mx-wide-browser__cap { padding-top: 22px; margin-bottom: 60px; }
.mx-wide-browser__cap a { font-size: 18px; }
.mx-wide-browser__cap span { font-size: 14px; }
@media (max-width: 767px) {
    .mx-wide-browser { padding: 0 10px 10px; border-radius: 18px; }
    .mx-wide-browser__bar { padding: 11px 2px 10px; gap: 10px; }
    .mx-wide-browser__dots span { width: 9px; height: 9px; }
    .mx-wide-browser__url { transform: none; font-size: 12px; padding: 4px 12px; }
    .mx-wide-browser .mx-wide-browser__shot { aspect-ratio: 4 / 4.4; border-radius: 10px; }
    .mx-wide-browser__cap { margin-bottom: 40px; }
}

/* Project page: related projects header */
.mx-related__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; margin-bottom: 40px; }
@media (max-width: 767px) { .mx-related__head { margin-bottom: 28px; } }

/* Service pages: real client website crop in a browser frame */
.mx-svc-shot { background: linear-gradient(180deg,#FFFFFF 0%,#FBF8FF 55%,#F1E6FF 100%); border: 1px solid #EEE6FA; border-radius: 22px; padding: 0 16px 16px; margin: 10px 0 40px; box-shadow: 0 24px 60px rgba(60,15,120,.12); }
.mx-svc-shot .mx-site-card__bar { padding: 13px 2px 12px; }
.mx-svc-shot img { display: block; width: 100%; height: auto; border-radius: 12px; box-shadow: 0 6px 18px rgba(0,0,0,.08); }
.mx-svc-shot__cap { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; font-size: 14px; font-weight: 600; color: #7B1FE4; }
.mx-svc-shot__cap:hover { color: #1A192E; }

/* Project page: laptop mockup beside the project description */
.mx-case-intro.has-mock { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 50px; align-items: center; }
.mx-case-mock { border-radius: 26px; overflow: hidden; box-shadow: 0 0 0 10px rgba(123,31,228,.04), 0 30px 70px rgba(60,15,120,.16); }
.mx-case-mock img { display: block; width: 100%; height: auto; }
@media (max-width: 991px) { .mx-case-intro.has-mock { grid-template-columns: 1fr; gap: 30px; } .mx-case-mock { max-width: 480px; } }

/* Inner page headers: same rounded purple gradient as the home hero, shorter */
.pp-breadcrumb-wrapper.mx-page-banner { margin: 40px 40px 0; border-radius: 48px; background: linear-gradient(270deg, #A121CA 0%, #7B1FE4 100%); background-image: linear-gradient(270deg, #A121CA 0%, #7B1FE4 100%) !important; overflow: hidden; }
.pp-breadcrumb-wrapper.mx-page-banner::before, .pp-breadcrumb-wrapper.mx-page-banner::after { display: none !important; }
.pp-breadcrumb-wrapper.mx-page-banner .pp-page-heading { padding: 130px 0 70px; }
.pp-breadcrumb-wrapper.mx-page-banner .pp-page-heading h1 { font-size: 60px; line-height: 1.1; }
.pp-breadcrumb-wrapper.mx-page-banner .pp-breadcrumb-items li, .pp-breadcrumb-wrapper.mx-page-banner .pp-breadcrumb-items li a { color: rgba(255,255,255,.9); }
.pp-breadcrumb-wrapper.mx-page-banner .pp-breadcrumb-items li a:hover { color: #fff; text-decoration: underline; }
@media (max-width: 1199px) { .pp-breadcrumb-wrapper.mx-page-banner { margin-top: 0; } .pp-breadcrumb-wrapper.mx-page-banner .pp-page-heading { padding: 140px 0 60px; } }
@media (max-width: 767px) { .pp-breadcrumb-wrapper.mx-page-banner { margin: 0 15px; border-radius: 0 0 32px 32px; } .pp-breadcrumb-wrapper.mx-page-banner .pp-page-heading { padding: 120px 0 50px; } .pp-breadcrumb-wrapper.mx-page-banner .pp-page-heading h1 { font-size: 38px; } }

/* Contact page: keep the round icons from squashing next to long text */
.pp-contact-item .pp-icon { flex: 0 0 auto; }

/* Pre-footer CTA: question marks bubbling out of his head */
.mx-qmarks { position: absolute; left: 47%; top: 6%; width: 0; height: 0; z-index: 2; pointer-events: none; }
.mx-qmarks i { position: absolute; left: 0; top: 0; font-style: normal; font-weight: 800; color: #fff; line-height: 1; opacity: 0; text-shadow: 0 4px 16px rgba(60,10,120,.35); animation: mx-qmark 4.2s ease-out infinite; }
.mx-qmarks i:nth-child(1) { font-size: 34px; --dx: -70px; --rot: -18deg; animation-delay: 0s; }
.mx-qmarks i:nth-child(2) { font-size: 26px; --dx: 55px;  --rot: 14deg;  animation-delay: .6s; }
.mx-qmarks i:nth-child(3) { font-size: 42px; --dx: -20px; --rot: -6deg;  animation-delay: 1.2s; }
.mx-qmarks i:nth-child(4) { font-size: 22px; --dx: 95px;  --rot: 22deg;  animation-delay: 1.8s; }
.mx-qmarks i:nth-child(5) { font-size: 30px; --dx: -110px; --rot: -26deg; animation-delay: 2.4s; }
.mx-qmarks i:nth-child(6) { font-size: 38px; --dx: 30px;  --rot: 8deg;   animation-delay: 3s; }
.mx-qmarks i:nth-child(7) { font-size: 24px; --dx: -45px; --rot: -12deg; animation-delay: 3.6s; }
@keyframes mx-qmark {
    0%   { opacity: 0; transform: translate(-50%, 10px) scale(.3) rotate(0deg); }
    15%  { opacity: .95; }
    60%  { opacity: .6; }
    100% { opacity: 0; transform: translate(calc(-50% + var(--dx)), -170px) scale(1.15) rotate(var(--rot)); }
}
@media (max-width: 767px) { .mx-qmarks i { animation-name: mx-qmark-sm; } }
@keyframes mx-qmark-sm {
    0%   { opacity: 0; transform: translate(-50%, 6px) scale(.3); }
    15%  { opacity: .95; }
    100% { opacity: 0; transform: translate(calc(-50% + var(--dx) * .6), -110px) scale(.9) rotate(var(--rot)); }
}
@media (prefers-reduced-motion: reduce) { .mx-qmarks { display: none; } }

/* ===== Company profiles ===== */
/* Home showcase */
.mx-cp-home { background: linear-gradient(180deg, #FFFFFF 0%, #F8F3FF 100%); }
.mx-cp-home__head { display: grid; grid-template-columns: 1.05fr 1fr; gap: 50px; align-items: end; margin-bottom: 34px; }
.mx-cp-home__intro p { font-size: 17px; line-height: 1.7; margin-bottom: 24px; }
.mx-cp-home__btns { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; }
.mx-cp-home__link { font-weight: 600; color: #7B1FE4; }
.mx-cp-home__link i { margin-right: 6px; }
.mx-cp-home__link:hover { color: #1A192E; }
.mx-cp-home__cats { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 44px; }
.mx-cp-home__cats a { display: inline-flex; align-items: center; gap: 8px; background: #fff; border: 1px solid #E6D9FA; border-radius: 40px; padding: 9px 16px; font-size: 14px; font-weight: 600; color: #1A192E; transition: all .25s; }
.mx-cp-home__cats a i { color: #7B1FE4; --fa-primary-color: #7B1FE4; --fa-secondary-color: #A121CA; --fa-secondary-opacity: .35; }
.mx-cp-home__cats a span { font-size: 12px; background: #F3EAFE; color: #7B1FE4; border-radius: 20px; padding: 2px 8px; }
.mx-cp-home__cats a:hover { background: linear-gradient(270deg,#A121CA 0%,#7B1FE4 100%); color: #fff; border-color: transparent; }
.mx-cp-home__cats a:hover i, .mx-cp-home__cats a:hover span { color: #fff; --fa-primary-color: #fff; --fa-secondary-color: #fff; background: transparent; }
.mx-cp-marquee { display: grid; gap: 22px; overflow: hidden; padding: 6px 0 10px; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%); }
.mx-cp-marquee__track { display: flex; gap: 22px; width: max-content; animation: mx-cp-scroll 70s linear infinite; }
.mx-cp-marquee__row.is-reverse .mx-cp-marquee__track { animation-direction: reverse; animation-duration: 80s; }
.mx-cp-marquee:hover .mx-cp-marquee__track { animation-play-state: paused; }
@keyframes mx-cp-scroll { from { transform: translateX(0); } to { transform: translateX(calc(-50% - 11px)); } }
.mx-cp-tile { position: relative; flex: 0 0 auto; width: 390px; border-radius: 20px; overflow: hidden; box-shadow: 0 16px 40px rgba(60,15,120,.12); }
.mx-cp-tile img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.mx-cp-tile__cap { position: absolute; left: 12px; right: 12px; bottom: 12px; display: flex; flex-direction: column; background: rgba(255,255,255,.94); border-radius: 12px; padding: 10px 14px; transform: translateY(14px); opacity: 0; transition: all .35s; }
.mx-cp-tile__cap strong { font-size: 15px; color: #1A192E; line-height: 1.3; }
.mx-cp-tile__cap small { font-size: 12px; color: #7B1FE4; font-weight: 600; }
.mx-cp-tile:hover img { transform: scale(1.06); }
.mx-cp-tile:hover .mx-cp-tile__cap, .mx-cp-tile:focus-visible .mx-cp-tile__cap { transform: none; opacity: 1; }
.mx-cp-home__stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 44px; padding: 26px 30px; background: #fff; border: 1px solid #EFE7FA; border-radius: 22px; box-shadow: 0 18px 50px rgba(60,15,120,.06); }
.mx-cp-home__stats div { text-align: center; }
.mx-cp-home__stats strong { display: block; font-size: 30px; line-height: 1.2; color: #1A192E; }
.mx-cp-home__stats span { font-size: 14px; color: #6B6A7B; }
@media (max-width: 991px) { .mx-cp-home__head { grid-template-columns: 1fr; gap: 20px; } .mx-cp-tile { width: 300px; } .mx-cp-home__stats { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px) { .mx-cp-tile { width: 250px; } .mx-cp-tile__cap { opacity: 1; transform: none; padding: 7px 10px; } .mx-cp-home__stats strong { font-size: 22px; } .mx-cp-home__cats { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px; scrollbar-width: none; } .mx-cp-home__cats a { flex: 0 0 auto; } }
@media (prefers-reduced-motion: reduce) { .mx-cp-marquee__track { animation: none; } .mx-cp-marquee { overflow-x: auto; } }

/* Profile page gallery */
.mx-cp-filter { margin-top: 10px; }
.mx-cp-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.mx-cp-card { appearance: none; border: 0; background: #fff; padding: 12px 12px 20px; border-radius: 22px; text-align: left; cursor: pointer; font: inherit; color: inherit; box-shadow: 0 16px 44px rgba(60,15,120,.08); transition: transform .3s, box-shadow .3s; }
.mx-cp-card:hover { transform: translateY(-4px); box-shadow: 0 24px 60px rgba(60,15,120,.16); }
.mx-cp-card.is-hidden { display: none; }
.mx-cp-card.is-target { box-shadow: 0 0 0 3px #7B1FE4, 0 24px 60px rgba(60,15,120,.18); }
.mx-cp-card__img { position: relative; display: block; border-radius: 14px; overflow: hidden; aspect-ratio: 3 / 2; background: #EEE6FA; }
.mx-cp-card__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.mx-cp-card__img.is-cover { background: linear-gradient(135deg,#7B1FE4,#A121CA); }
.mx-cp-card__img.is-cover img { object-fit: contain; padding: 14px 0; filter: drop-shadow(0 10px 20px rgba(0,0,0,.3)); }
.mx-cp-card:hover .mx-cp-card__img img { transform: scale(1.05); }
.mx-cp-card__open { position: absolute; left: 50%; bottom: 16px; transform: translate(-50%, 14px); opacity: 0; background: #fff; color: #1A192E; font-weight: 600; font-size: 14px; padding: 10px 18px; border-radius: 30px; white-space: nowrap; transition: all .3s; box-shadow: 0 8px 20px rgba(0,0,0,.15); }
.mx-cp-card__open i { color: #7B1FE4; margin-right: 4px; }
.mx-cp-card:hover .mx-cp-card__open, .mx-cp-card:focus-visible .mx-cp-card__open { opacity: 1; transform: translate(-50%, 0); }
.mx-cp-card__badge { position: absolute; top: 12px; left: 12px; background: linear-gradient(270deg,#A121CA 0%,#7B1FE4 100%); color: #fff; font-size: 12px; font-weight: 600; padding: 5px 12px; border-radius: 20px; }
.mx-cp-card__name { display: block; font-size: 19px; font-weight: 700; color: #1A192E; margin: 16px 6px 4px; line-height: 1.3; }
.mx-cp-card__meta { display: block; font-size: 14px; color: #6B6A7B; margin: 0 6px; }
.mx-cp-card__meta i { color: #7B1FE4; margin-right: 4px; --fa-primary-color: #7B1FE4; --fa-secondary-color: #A121CA; --fa-secondary-opacity: .35; }
@media (max-width: 991px) { .mx-cp-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; } }
@media (max-width: 575px) { .mx-cp-grid { grid-template-columns: 1fr; } .mx-cp-card__open { opacity: 1; transform: translate(-50%, 0); } }

/* Image zoom for profiles without a PDF yet */
.mx-zoom { position: fixed; inset: 0; z-index: 100000; background: rgba(16,12,30,.86); display: none; align-items: center; justify-content: center; padding: 30px; cursor: zoom-out; }
.mx-zoom.is-open { display: flex; }
.mx-zoom figure { margin: 0; max-width: 1200px; width: 100%; text-align: center; }
.mx-zoom img { width: 100%; height: auto; max-height: 80vh; object-fit: contain; border-radius: 18px; box-shadow: 0 30px 80px rgba(0,0,0,.5); }
.mx-zoom figcaption { color: #fff; font-weight: 600; font-size: 18px; margin-top: 16px; }
.mx-zoom button { position: absolute; top: 18px; right: 22px; width: 46px; height: 46px; border-radius: 50%; border: 0; background: #fff; color: #1A192E; font-size: 22px; cursor: pointer; }

/* Profiles mega menu */
@media (min-width: 1200px) {
    .mx-mega--profiles .mx-mega__inner { grid-template-columns: 1fr 330px; }
    .mx-mega__cols { display: grid; grid-template-columns: repeat(5, 1fr); gap: 18px; }
    .header-main .main-menu .mx-mega a.mx-mega__colhead { display: flex; flex-direction: column; gap: 10px; padding: 0 0 12px; margin-bottom: 8px; border-bottom: 1px solid #EFE9F7; }
    .mx-mega__colhead .mx-mega__icon { width: 42px; height: 42px; flex-basis: 42px; }
    .header-main .main-menu .mx-mega a.mx-mega__colhead .mx-mega__icon i { margin: 0; font-size: 18px; --fa-primary-color: #7B1FE4; --fa-secondary-color: #A121CA; --fa-secondary-opacity: .35; }
    .mx-mega__colhead strong { font-size: 15px; line-height: 1.3; color: #1A192E; font-weight: 700; }
    .header-main .main-menu .mx-mega a.mx-mega__colhead:hover strong { color: #7B1FE4; }
    .header-main .main-menu .mx-mega ul.mx-mega__list { display: block; padding: 0; margin: 0; }
    .header-main .main-menu .mx-mega ul.mx-mega__list li { display: block; margin: 0 0 7px; }
    .header-main .main-menu .mx-mega ul.mx-mega__list li a { font-size: 14px; font-weight: 500; color: #4A4960; line-height: 1.35; }
    .header-main .main-menu .mx-mega ul.mx-mega__list li a:hover { color: #7B1FE4 !important; }
    .header-main .main-menu .mx-mega ul.mx-mega__list li.mx-mega__more a { color: #7B1FE4; font-weight: 600; }
    .mx-mega__promo--img { justify-content: flex-end; padding: 30px 28px 30px; overflow: hidden; isolation: isolate; background: #7B1FE4; }
    .header-main .main-menu .mx-mega__promo--img img { position: absolute; top: 0; left: 0; z-index: -2; display: block; width: 100%; height: 72%; max-width: none; margin: 0; border-radius: 0; object-fit: cover; object-position: center center; transform-origin: 50% 30%; transform: scale(1.02); transition: transform 6s ease; }
    .header-main .main-menu li:hover .mx-mega__promo--img img { transform: scale(1.08); }
    .mx-mega__promo--img::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(60,12,130,0) 0%, rgba(60,12,130,0) 28%, rgba(74,16,150,.55) 44%, rgba(92,22,190,.93) 60%, #7B1FE4 72%, #8A1FDA 100%); }
    .mx-mega__promo--img strong { font-size: 21px; text-shadow: 0 2px 12px rgba(20,0,50,.35); }
    .mx-mega__promo--img p { color: rgba(255,255,255,.92); }
    .header-main .main-menu > nav > ul > li { margin-inline-end: 28px; }
}
@media (min-width: 1200px) and (max-width: 1499px) { .header-main .main-menu > nav > ul > li { margin-inline-end: 20px; } .header-main .main-menu > nav > ul > li > a { font-size: 15px; } }
@media (min-width: 1200px) and (max-width: 1399px) { .mx-mega__cols { grid-template-columns: repeat(3, 1fr); } .header-main .main-menu > nav > ul > li { margin-inline-end: 15px; } .header-main .main-menu > nav > ul > li > a { font-size: 14px; } .header-1 .header-main .header-right .pp-theme-btn { padding: 16px 22px; } }
/* Theme news cards used for company profiles: keep mockups the same shape */
.pp-news-card-item-2 .pp-news-image img[src*="profiles/"] { aspect-ratio: 3 / 2; object-fit: cover; }
.pp-news-card-item-2 .pp-news-image img[src*="-company-profile-cover"] { object-fit: contain; background: linear-gradient(135deg,#7B1FE4,#A121CA); padding: 12px 0; }
/* Home company profiles: small covers under the flipbook */
.mx-cp-thumbs { margin-top: 36px; position: relative; z-index: 2; }
.mx-cp-thumb { display: block; border-radius: 12px; overflow: hidden; border: 1px solid rgba(255,255,255,.12); opacity: .85; transition: opacity .3s, transform .3s; }
.mx-cp-thumb img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.mx-cp-thumb:hover { opacity: 1; transform: translateY(-3px); }

/* Mega menus: use the theme's DM Sans throughout */
.mx-mega, .mx-mega :not(i) { font-family: "DM Sans", sans-serif; }
.mx-mega__txt strong { font-size: 17px; font-weight: 700; letter-spacing: -.01em; }
.mx-mega__txt small { font-size: 14.5px; font-weight: 400; color: #5E5D70; line-height: 1.5; }
.mx-case-profile-img { max-width: 900px; margin: 0 auto; position: relative; z-index: 2; }
.mx-case-profile-img img { display: block; width: 100%; height: auto; border-radius: 24px; }

/* Desktop menu: Home (logo) and FAQ (footer) only show in the phone menu */
@media (min-width: 1200px) { .header-main .main-menu > nav > ul > li.mx-mobile-only { display: none; } }
@media (min-width: 1200px) and (max-width: 1279px) {
    .header-main .main-menu > nav > ul > li { margin-inline-end: 12px; }
    .header-main .main-menu > nav > ul > li > a { font-size: 13px; }
    .header-1 .header-main .header-right .pp-theme-btn { padding: 14px 18px; font-size: 15px; white-space: nowrap; }
    .header-1 .header-logo img.mansa-logo, .header-1 .header-logo-2 img.mansa-logo { max-width: 170px; }
}
/* Home icon in desktop menu */
.header-main .main-menu .mx-nav-home i { font-size: 18px; line-height: 1; vertical-align: -2px; }
.header-main .main-menu .mx-nav-home__txt { display: none; }
.mean-container .mx-nav-home i { display: none; }
.mean-container .mx-nav-home__txt { display: inline; }
.header-main .main-menu .mx-nav-home i { color: #7B1FE4; }
.header-main .main-menu .mx-nav-home:hover i { color: #A121CA; }
/* Instagram icon beside Get a quote */
.header-right .mx-nav-insta { align-items: center; justify-content: center; display: inline-flex; width: 36px; height: 36px; margin: 0; flex: 0 0 36px; border-radius: 50%; background: #F6EEFF; color: #7B1FE4; font-size: 16px; transition: .25s; }
.header-right .mx-nav-insta:hover { background: #7B1FE4; color: #fff; }
@media (min-width: 1200px) { .header-1 .header-main .header-right { gap: 12px; } }
@media (min-width: 1200px) and (max-width: 1365px) {
    .header-1 .header-main .main-menu > nav > ul > li { margin-inline-end: 10px; }
    .header-1 .header-main .main-menu > nav > ul > li > a { font-size: 12.5px; }
    .header-1 .header-main .header-right .pp-theme-btn { padding: 12px 16px; font-size: 14px; white-space: nowrap; }
}
@media (min-width: 1366px) and (max-width: 1599px) {
    .header-1 .header-main .main-menu > nav > ul > li { margin-inline-end: 16px; }
    .header-1 .header-main .main-menu > nav > ul > li > a { font-size: 14px; }
    .header-1 .header-main .header-right .pp-theme-btn { white-space: nowrap; }
}
.header-right .mx-nav-socials { gap: 6px; align-items: center; }
@media (min-width: 1200px) and (max-width: 1365px) {
    .header-1 .header-main .main-menu > nav > ul > li { margin-inline-end: 8px; }
    .header-1 .header-main .main-menu > nav > ul > li > a { font-size: 12px; }
    .header-1 .header-logo img.mansa-logo, .header-1 .header-logo-2 img.mansa-logo { max-width: 150px; }
    .header-right .mx-nav-insta { width: 32px; height: 32px; flex-basis: 32px; font-size: 14px; }
    .header-right .mx-nav-socials { gap: 4px; }
}
@media (min-width: 1366px) and (max-width: 1599px) {
    .header-1 .header-main .main-menu > nav > ul > li { margin-inline-end: 12px; }
    .header-1 .header-main .main-menu > nav > ul > li > a { font-size: 13.5px; }
}
@media (min-width: 1600px) and (max-width: 1799px) {
    .header-1 .header-main .main-menu > nav > ul > li { margin-inline-end: 22px; }
    .header-1 .header-main .main-menu > nav > ul > li > a { font-size: 15px; }
}
/* WhatsApp chat box form */
.wa-chat__form { display: grid; gap: 8px; margin-top: 4px; }
.wa-chat__form input, .wa-chat__form textarea { width: 100%; border: 1px solid #e3e3e3; border-radius: 12px; padding: 9px 12px; font: 14px/1.4 "Open Sans", sans-serif; color: #1b1b1b; background: #f7f7f7; resize: none; }
.wa-chat__form input:focus, .wa-chat__form textarea:focus { outline: 0; border-color: #25D366; background: #fff; }

/* ===== Mobile app menu ===== */
.mxm-sheet.offcanvas__info { width: 100% !important; max-width: 100%; border-left: 0; background: #F6F4FB; overflow: hidden; padding: 0;
  transform: translateX(100%); opacity: 1; transition: transform .45s cubic-bezier(.22,1,.36,1), visibility .45s; visibility: hidden; }
.mxm-sheet.offcanvas__info.info-open { transform: translateX(0); visibility: visible; }
@media (min-width: 576px) { .mxm-sheet.offcanvas__info { max-width: 440px; box-shadow: -30px 0 80px rgba(30,10,70,.18); } }
.mxm { height: 100%; display: flex; flex-direction: column; font-family: "DM Sans", sans-serif; }
.mxm__top { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px 14px; padding-top: max(18px, env(safe-area-inset-top)); }
.mxm__logo img { height: 34px; width: auto; }
.mxm__close { width: 44px; height: 44px; border-radius: 14px; border: 0; background: #fff; color: #1A192E; font-size: 20px; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 14px rgba(60,20,120,.08); transition: transform .2s, background .2s; }
.mxm__close:active { transform: scale(.92); background: #EFE8FD; }
.mxm__scroll { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 4px 16px 24px; overscroll-behavior: contain; }
.mxm__label { font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #9A96AD; margin: 10px 6px 10px; }
.mxm__list { background: #fff; border-radius: 22px; padding: 6px; box-shadow: 0 10px 30px rgba(60,20,120,.06); }
.mxm__item { display: flex; align-items: center; gap: 14px; width: 100%; border: 0; background: none; text-align: left; padding: 11px 10px; border-radius: 16px; color: #1A192E; font-size: 16px; font-weight: 600; line-height: 1.25; letter-spacing: -.01em; transition: background .2s, transform .15s; -webkit-tap-highlight-color: transparent; }
.mxm__item:hover { color: #1A192E; }
.mxm__item:active { transform: scale(.98); background: #F3EEFC; }
.mxm__item + .mxm__item, .mxm__item + .mxm__group, .mxm__group + .mxm__item, .mxm__group + .mxm__group { margin-top: 2px; }
.mxm__ico { flex: 0 0 42px; width: 42px; height: 42px; border-radius: 13px; background: #F3EEFC; color: #7B1FE4; display: flex; align-items: center; justify-content: center; font-size: 17px; transition: background .25s, color .25s; }
.mxm__txt { flex: 1; }
.mxm__chev { color: #C2BDD3; font-size: 13px; transition: transform .35s cubic-bezier(.22,1,.36,1), color .2s; }
.mxm__item.is-active, .mxm__group.is-active > .mxm__item { color: #7B1FE4; }
.mxm__item.is-active .mxm__ico, .mxm__group.is-active > .mxm__item .mxm__ico, .mxm__group.is-open > .mxm__item .mxm__ico { background: linear-gradient(135deg, #7B1FE4, #A121CA); color: #fff; box-shadow: 0 6px 16px rgba(123,31,228,.32); }
.mxm__group.is-open > .mxm__item .mxm__chev { transform: rotate(180deg); color: #7B1FE4; }
.mxm__panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .4s cubic-bezier(.22,1,.36,1); }
.mxm__group.is-open .mxm__panel { grid-template-rows: 1fr; }
.mxm__panel-in { overflow: hidden; padding: 0 6px; }
.mxm__group.is-open .mxm__panel-in { padding-bottom: 8px; }
.mxm__sub { display: flex; gap: 12px; align-items: flex-start; padding: 10px 8px 10px 12px; margin-left: 20px; border-left: 2px solid #EFE8FD; color: #1A192E; transition: background .2s; border-radius: 0 12px 12px 0; }
.mxm__sub:active { background: #F6F2FD; }
.mxm__sub-ico { flex: 0 0 30px; height: 30px; border-radius: 9px; background: #F8F5FE; color: #7B1FE4; display: flex; align-items: center; justify-content: center; font-size: 14px; margin-top: 1px; }
.mxm__sub strong { display: block; font-size: 15px; font-weight: 600; line-height: 1.3; }
.mxm__sub small { display: block; font-size: 13px; color: #8A879A; line-height: 1.35; margin-top: 2px; }
.mxm__all { display: inline-flex; align-items: center; gap: 8px; margin: 8px 0 4px 34px; font-size: 14px; font-weight: 700; color: #7B1FE4; }
.mxm__quick { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.mxm__tile { background: #fff; border-radius: 18px; padding: 14px 6px 12px; display: flex; flex-direction: column; align-items: center; gap: 8px; color: #1A192E; font-size: 13px; font-weight: 600; box-shadow: 0 10px 30px rgba(60,20,120,.06); transition: transform .15s; }
.mxm__tile:active { transform: scale(.95); }
.mxm__tile i { width: 42px; height: 42px; border-radius: 50%; background: #F3EEFC; color: #7B1FE4; display: flex; align-items: center; justify-content: center; font-size: 18px; }
.mxm__tile--wa i { background: #E7F9EE; color: #1DA851; font-size: 22px; }
.mxm__foot { margin-top: 22px; text-align: center; }
.mxm__social { display: flex; justify-content: center; gap: 12px; margin-bottom: 14px; }
.mxm__social a { width: 40px; height: 40px; border-radius: 50%; background: #fff; color: #7B1FE4; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 14px rgba(60,20,120,.08); }
.mxm__foot p { font-size: 13px; color: #8A879A; margin: 0 0 4px; }
.mxm__foot p i { color: #B7A6E8; margin-right: 4px; }
.mxm__bar { padding: 12px 16px; padding-bottom: max(14px, env(safe-area-inset-bottom)); background: rgba(246,244,251,.85); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-top: 1px solid rgba(123,31,228,.08); }
.mxm__cta { display: flex; align-items: center; justify-content: center; gap: 10px; height: 56px; border-radius: 18px; background: linear-gradient(270deg, #A121CA 0%, #7B1FE4 100%); color: #fff; font-size: 17px; font-weight: 700; box-shadow: 0 12px 28px rgba(123,31,228,.35); transition: transform .15s; }
.mxm__cta:hover { color: #fff; }
.mxm__cta:active { transform: scale(.97); }
/* staggered entrance */
.mxm__list > *, .mxm__quick, .mxm__label, .mxm__foot { opacity: 0; transform: translateY(14px); transition: opacity .45s ease, transform .5s cubic-bezier(.22,1,.36,1); }
.info-open .mxm__list > *, .info-open .mxm__quick, .info-open .mxm__label, .info-open .mxm__foot { opacity: 1; transform: none; }
.info-open .mxm__list > * { transition-delay: calc(.08s + var(--i, 0) * .035s); }
.info-open .mxm__quick, .info-open .mxm__label + .mxm__quick { transition-delay: .38s; }
.info-open .mxm__foot { transition-delay: .45s; }
body.mxm-lock { overflow: hidden; }
@media (hover: none) { .mouseCursor { display: none !important; } }
@media (prefers-reduced-motion: reduce) { .mxm-sheet.offcanvas__info, .mxm__list > *, .mxm__quick, .mxm__label, .mxm__foot, .mxm__panel { transition: none !important; } }

/* Home hero: previews framed as browser windows */
.mx-browser { background: #fff; border-radius: 16px; padding: 0 8px 8px; box-shadow: 0 14px 34px rgba(40,10,90,.14); border: 1px solid #EEE6FA; }
.mx-browser__bar { display: flex; align-items: center; gap: 10px; padding: 10px 4px 9px; }
.mx-browser__dots { display: flex; gap: 6px; flex: 0 0 auto; }
.mx-browser__dots i { width: 10px; height: 10px; border-radius: 50%; background: #E3D6F7; }
.mx-browser__dots i:first-child { background: #A121CA; }
.mx-browser__dots i:nth-child(2) { background: #C79BF0; }
.mx-browser__url { flex: 1; min-width: 0; display: flex; align-items: center; justify-content: center; gap: 6px; height: 26px; border-radius: 20px; background: #F5F1FC; color: #6D6B7B; font-size: 12px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-right: 30px; }
.mx-browser__url i { font-size: 10px; color: #7B1FE4; }
.mx-browser .mx-shot { border-radius: 10px; box-shadow: none; }
@media (max-width: 767px) {
    .pp-hero-1 .pp-hero-image .mx-showcase { display: block; overflow: visible; padding: 12px; }
    .pp-hero-1 .pp-hero-image .mx-shot-item { display: none; }
    .pp-hero-1 .pp-hero-image .mx-shot-item:nth-child(2) { display: block; }
    .pp-hero-1 .pp-hero-image .mx-shot-item:nth-child(2) .mx-shot { aspect-ratio: 4 / 5; }
    .mx-browser__url { margin-right: 0; }
}

/* Home about: floating elastic link above the Mutsh laptop */
.mx-float-link { position: relative; z-index: 3; width: max-content; max-width: 100%; margin: 0 auto 4px; display: flex; flex-direction: column; align-items: center; gap: 8px; text-decoration: none; animation: mxFloat 3.2s ease-in-out infinite; }
.mx-float-link__pill { position: relative; display: inline-flex; align-items: center; gap: 10px; padding: 10px 10px 10px 20px; border-radius: 40px; background: #fff; color: #1A192E; font-family: "DM Sans", sans-serif; font-size: 17px; font-weight: 700; white-space: nowrap; box-shadow: 0 14px 34px rgba(123,31,228,.25), 0 0 0 2px rgba(123,31,228,.12); animation: mxJelly 3.2s ease-in-out infinite; transform-origin: 50% 100%; transition: box-shadow .3s; }
.mx-float-link__pill > i { color: #7B1FE4; }
.mx-float-link__pill::before { content: ""; position: absolute; inset: -2px; border-radius: inherit; border: 2px solid #A121CA; opacity: 0; animation: mxRing 3.2s ease-out infinite; pointer-events: none; }
.mx-float-link__go { width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: linear-gradient(270deg, #A121CA 0%, #7B1FE4 100%); color: #fff; font-size: 13px; transition: transform .35s cubic-bezier(.34,1.8,.5,1); }
.mx-float-link__hint { font-size: 12px; font-weight: 600; color: #7B1FE4; letter-spacing: .02em; background: rgba(255,255,255,.85); padding: 2px 10px; border-radius: 20px; }
.mx-float-link__hint::after { content: ""; display: block; width: 0; height: 0; margin: 4px auto -10px; border: 6px solid transparent; border-top-color: #7B1FE4; animation: mxNudge 1.2s ease-in-out infinite; }
.mx-float-link:hover { animation-play-state: paused; }
.mx-float-link:hover .mx-float-link__pill { animation: mxBoing .7s cubic-bezier(.34,1.8,.5,1); box-shadow: 0 18px 40px rgba(123,31,228,.35), 0 0 0 2px #7B1FE4; color: #7B1FE4; }
.mx-float-link:hover .mx-float-link__go { transform: rotate(45deg) scale(1.1); }
@keyframes mxFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes mxJelly { 0%, 62%, 100% { transform: scale(1, 1); } 66% { transform: scale(1.12, .88); } 70% { transform: scale(.9, 1.1); } 74% { transform: scale(1.05, .95); } 78% { transform: scale(.98, 1.02); } 82% { transform: scale(1, 1); } }
@keyframes mxBoing { 0% { transform: scale(1); } 30% { transform: scale(1.15, .85); } 50% { transform: scale(.92, 1.08); } 70% { transform: scale(1.04, .96); } 100% { transform: scale(1); } }
@keyframes mxRing { 0%, 60% { opacity: 0; transform: scale(1); } 66% { opacity: .8; transform: scale(1); } 100% { opacity: 0; transform: scale(1.35, 1.6); } }
@keyframes mxNudge { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(4px); } }
@media (max-width: 575px) { .mx-float-link__pill { font-size: 15px; padding: 8px 8px 8px 16px; } .mx-float-link__go { width: 28px; height: 28px; } }
@media (prefers-reduced-motion: reduce) { .mx-float-link, .mx-float-link__pill, .mx-float-link__pill::before, .mx-float-link__hint::after { animation: none; } }

/* Reviews section: big faded crown floating slowly in the background */
.mx-crown-bg { position: relative; }
.mx-crown-bg > .container { position: relative; z-index: 1; }
.mx-crown-float { position: absolute; z-index: 0; right: 4%; top: 50%; width: min(560px, 46vw); height: auto; opacity: .07; pointer-events: none; transform: translateY(-50%); animation: mxCrownFloat 14s ease-in-out infinite; will-change: transform; }
@keyframes mxCrownFloat {
    0%, 100% { transform: translateY(-50%) rotate(-3deg); }
    50% { transform: translateY(calc(-50% - 28px)) rotate(3deg); }
}
@media (max-width: 767px) { .mx-crown-float { width: 78vw; right: -12vw; top: 30%; opacity: .06; } }
@media (prefers-reduced-motion: reduce) { .mx-crown-float { animation: none; } }

/* "Who We Are" pill wearing the crown */
.pp-section-title span.pp-style-border.mx-crowned { position: relative; margin-top: 22px; }
.pp-section-title span.pp-style-border.mx-crowned::before { display: block; content: ""; position: absolute; left: 12px; top: -27px; width: 36px; height: 29px; background: url("../img/crown.svg") center / contain no-repeat; transform: rotate(-14deg); transform-origin: 50% 100%; animation: mxCrownTip 4s ease-in-out infinite; }
@keyframes mxCrownTip { 0%, 100% { transform: rotate(-14deg); } 50% { transform: rotate(-6deg) translateY(-2px); } }
@media (prefers-reduced-motion: reduce) { .pp-section-title span.pp-style-border.mx-crowned::before { animation: none; } }

/* Preloader: crown draws itself, logo fades in, gold pixel dots */
.preloader .mx-pre { display: flex; flex-direction: column; align-items: center; text-align: center; }
.mx-pre__crown { position: relative; width: 190px; height: 190px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #F3EEFC; margin-bottom: 30px; }
.mx-pre__crown::after { content: ""; position: absolute; inset: -10px; border-radius: 50%; border: 2px solid #E3D6F7; border-top-color: #7B1FE4; animation: spinner 1.4s linear infinite; }
.mx-pre__crown polygon { stroke-dasharray: 1; stroke-dashoffset: 1; animation: mxDraw 2.2s ease-in-out infinite; }
.mx-pre__crown polygon:nth-child(3) { animation-delay: .15s; }
.mx-pre__crown polygon:nth-child(4), .mx-pre__crown polygon:nth-child(5) { animation-delay: .3s; }
@keyframes mxDraw { 0% { stroke-dashoffset: 1; } 45%, 75% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: -1; } }
.mx-pre__logo { width: 260px; height: auto; opacity: 0; animation: mxPreIn .8s .3s ease forwards; }
@keyframes mxPreIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.mx-pre__dots { display: flex; gap: 8px; margin-top: 22px; }
.mx-pre__dots i { width: 9px; height: 9px; background: #F2B705; animation: mxPix 1.2s ease-in-out infinite; }
.mx-pre__dots i:nth-child(2) { background: #7B1FE4; animation-delay: .15s; }
.mx-pre__dots i:nth-child(3) { background: #A121CA; animation-delay: .3s; }
@keyframes mxPix { 0%, 100% { transform: translateY(0); opacity: .5; } 40% { transform: translateY(-8px); opacity: 1; } }
.mx-pre__txt { margin: 14px 0 0; font: 600 12px "DM Sans", sans-serif; letter-spacing: .4em; text-transform: uppercase; color: #6D6B7B; }
@media (max-width: 575px) { .mx-pre__crown { width: 150px; height: 150px; } .mx-pre__crown svg { width: 115px; height: 92px; } .mx-pre__logo { width: 220px; } }

/* Pricing: popular badge, renewal note, extras */
.pp-pricing-main-item.mx-popular { position: relative; outline: 2px solid #7B1FE4; outline-offset: -2px; border-radius: 20px; }
.mx-popular__badge { position: absolute; top: 16px; right: 16px; z-index: 3; background: linear-gradient(135deg,#7B1FE4,#A121CA); color: #fff; font-size: 13px; font-weight: 700; padding: 6px 16px; border-radius: 30px; white-space: nowrap; box-shadow: 0 8px 20px rgba(123,31,228,.3); }
.mx-popular__badge i { color: #F2B705; margin-right: 4px; }
.pricing__tab-content .col-xl-3 .pp-pricing-header h2 { font-size: 40px; }
.mx-pricing-renew { text-align: center; margin: 34px auto 0; max-width: 720px; padding: 14px 22px; border-radius: 40px; background: rgba(123,31,228,.10); color: var(--pp-header); font-weight: 600; }
.section-bg-2 .mx-pricing-renew { background: rgba(255,255,255,.08); color: #fff; }
.mx-pricing-renew i { color: #F2B705; margin-right: 6px; }
.mx-pricing-extras { margin-top: 50px; }
.mx-pricing-extras__title { text-align: center; margin-bottom: 26px; }
.section-bg-2 .mx-pricing-extras__title { color: #fff; }
.mx-extra { height: 100%; background: #fff; border-radius: 20px; padding: 30px; border: 1px solid #EEE6FA; display: flex; flex-direction: column; }
.mx-extra__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.mx-extra__head h4 { margin: 0; }
.mx-extra__price { font-weight: 800; color: #7B1FE4; font-size: 20px; }
.mx-extra p { color: var(--pp-text); margin-bottom: 14px; }
.mx-extra ul { list-style: none; padding: 0; margin: 0 0 22px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; }
.mx-extra li { font-size: 15px; color: var(--pp-header); }
.mx-extra li i { color: #7B1FE4; margin-right: 6px; }
.mx-extra .pp-theme-btn { margin-top: auto; align-self: flex-start; }
@media (max-width: 575px) { .mx-extra ul { grid-template-columns: 1fr; } }
.pricing__tab-content .row > [class*="col-"] { display: flex; }
.pricing__tab-content .pp-pricing-main-item { display: flex; flex-direction: column; width: 100%; }
.pricing__tab-content .pp-pricing-main-item .pp-pricing-card-item { flex: 1; }


/* Brand bullets (gold pixel squares from the logo) + plan icons */
.mx-bullets li { display: flex; align-items: flex-start; gap: 12px; }
.mx-bullets li img { display: none; }
.mx-bullet { flex: 0 0 auto; width: 10px; height: 10px; margin-top: .5em; background: #F2B705; box-shadow: 3px 3px 0 rgba(123,31,228,.35); }
.mx-bullets li.mx-off .mx-bullet { background: transparent; border: 1.5px solid rgba(123,31,228,.3); box-shadow: none; }
.mx-pricing-renew .mx-bullet { display: inline-block; margin: 0 8px 0 0; vertical-align: 1px; }
.mx-extra ul.mx-bullets { display: grid; }
.mx-plan-icon { display: inline-flex; align-items: center; justify-content: center; width: 58px; height: 58px; border-radius: 16px; margin-bottom: 18px; background: linear-gradient(135deg,#7B1FE4,#A121CA); box-shadow: 0 10px 24px rgba(123,31,228,.28); }
.mx-plan-icon i { font-size: 26px; --fa-primary-color: #fff; --fa-secondary-color: #F2B705; --fa-secondary-opacity: 1; color: #fff; }
.mx-pricing-brief .pp-pricing-list { min-height: 0; }
.mx-view-prices i { margin-left: 8px; }

/* Crown above the PRICING label (pricing page) */
.mx-sub-crown { display: block; width: 44px; height: 35px; margin: 0 auto 8px; background: url("../img/crown.svg") center / contain no-repeat; transform-origin: 50% 100%; animation: mxCrownSway 4s ease-in-out infinite; }
@keyframes mxCrownSway { 0%, 100% { transform: rotate(-7deg); } 50% { transform: rotate(7deg) translateY(-2px); } }
@media (prefers-reduced-motion: reduce) { .mx-sub-crown { animation: none; } }
.section-bg-2 .mx-sub-crown, .mx-dark .mx-sub-crown { background-image: url("../img/crown-white.svg"); }

/* Flipbooks: wooden table runs edge to edge of the browser, book stays in the container */
body .mx-ffb.mx-table, body .cp-flip, body .cp-featured .cp-flip {
    background: transparent !important; border: 0 !important; border-radius: 0 !important;
    overflow: visible !important; position: relative; isolation: isolate;
}
body .mx-ffb.mx-table::before, body .cp-flip::before {
    content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 100vw; margin-left: -50vw; z-index: -1; pointer-events: none;
    background-color: #c9a06c;
    background-image: radial-gradient(ellipse at 50% 45%, rgba(255,240,215,.18) 0%, rgba(0,0,0,0) 55%, rgba(40,20,5,.38) 100%), url("../img/flipbook-table.webp");
    background-size: cover, cover; background-position: center, center;
    box-shadow: inset 0 18px 30px -18px rgba(40,22,5,.45), inset 0 -18px 30px -18px rgba(40,22,5,.45);
}
@media (max-width: 900px) {
    body .mx-ffb.mx-table::before, body .cp-flip::before { background-image: radial-gradient(ellipse at 50% 45%, rgba(255,240,215,.15) 0%, rgba(0,0,0,0) 55%, rgba(40,20,5,.38) 100%), url("../img/flipbook-table-sm.webp"); }
}

/* Flipbook wood reaches the browser edges inside the dark rounded sections too */
body .cp-featured.fix { overflow: visible; }
body .cp-featured .top-shape { border-radius: inherit; overflow: hidden; }
/* Flipbook sections run full width so the dark top meets the wood cleanly */
body .pp-how-work-section.cp-featured { margin-left: 0; margin-right: 0; border-radius: 0; }
/* Keep flipping pages inside the flipbook block (no ghost page below on phones),
   while still letting the wood run to the browser edges */
body .mx-ffb.mx-table, body .cp-flip { clip-path: inset(0 -100vw); }

/* Guides / articles */
.mx-art-meta { font-size: 14px; color: var(--pp-text); margin-bottom: 18px; }
.mx-art-meta span { display: inline-block; background: rgba(123,31,228,.1); color: #7B1FE4; font-weight: 700; border-radius: 30px; padding: 3px 12px; margin-right: 8px; }
.mx-art-hero { width: 100%; height: auto; border-radius: 20px; margin-bottom: 26px; }
.mx-article .pp-text-page h3 { font-size: 21px; margin: 24px 0 10px; }
.mx-article .pp-text-page a:not(.pp-theme-btn) { color: #7B1FE4; text-decoration: underline; text-underline-offset: 3px; }
.mx-article .pp-text-page ol { padding-left: 20px; }
.mx-table-wrap { overflow-x: auto; margin: 18px 0; }
.mx-art-table { width: 100%; border-collapse: collapse; font-size: 15px; }
.mx-art-table th { background: #1A192E; color: #fff; text-align: left; padding: 12px 14px; }
.mx-art-table td { border-bottom: 1px solid #ece8f5; padding: 12px 14px; color: var(--pp-text); }
.mx-art-table tr:nth-child(even) td { background: #faf8ff; }
.mx-art-related { margin-top: 40px; padding: 26px 28px; border-radius: 20px; background: #f6f2ff; }
.mx-art-related h2 { margin-top: 0 !important; font-size: 24px !important; }
.mx-art-hero { aspect-ratio: 16 / 9; object-fit: cover; }
.mx-guides .pp-news-image img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.mx-guides .pp-news-card-item-2 { height: calc(100% - 30px); }
.mx-article .pp-text-page p { margin-bottom: 16px; }
.mx-article .pp-text-page ul, .mx-article .pp-text-page ol { margin-bottom: 18px; }
.mx-sitemap h2 { font-size: 22px !important; margin-top: 0 !important; }
.mx-sitemap a { color: var(--pp-header); }
.mx-sitemap a:hover { color: #7B1FE4; }

/* Company profile shelf: four covers on the wooden table, each opens the popup flipbook */
body .cp-shelf { position: relative; isolation: isolate; padding: 60px 0 50px; margin-top: 30px; clip-path: inset(0 -100vw); }
body .cp-shelf::before {
    content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 100vw; margin-left: -50vw; z-index: -1; pointer-events: none;
    background-color: #c9a06c;
    background-image: radial-gradient(ellipse at 50% 45%, rgba(255,240,215,.18) 0%, rgba(0,0,0,0) 55%, rgba(40,20,5,.38) 100%), url("../img/flipbook-table.webp");
    background-size: cover, cover; background-position: center, center;
    box-shadow: inset 0 18px 30px -18px rgba(40,22,5,.45), inset 0 -18px 30px -18px rgba(40,22,5,.45);
}
.cp-shelf__row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 34px; align-items: start; }
.cp-shelf__book { background: none; border: 0; padding: 0; cursor: pointer; text-align: center; display: flex; flex-direction: column; align-items: center; }
.cp-shelf__cover { position: relative; display: block; width: 100%; aspect-ratio: 210 / 297; overflow: hidden; border-radius: 2px 6px 6px 2px; background: #222;
    box-shadow: 0 2px 3px rgba(40,22,5,.35), 0 18px 30px -8px rgba(40,22,5,.6), inset 6px 0 8px -4px rgba(0,0,0,.35);
    transform: perspective(1200px) rotateY(0deg); transform-origin: left center; transition: transform .45s ease, box-shadow .45s ease; }
.cp-shelf__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cp-shelf__cover::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 10px; background: linear-gradient(90deg, rgba(0,0,0,.35), rgba(255,255,255,.12) 60%, rgba(0,0,0,0)); }
.cp-shelf__open { position: absolute; left: 50%; bottom: 16px; transform: translate(-50%, 10px); opacity: 0; transition: .3s; white-space: nowrap;
    background: #7B1FE4; color: #fff; font-size: 14px; font-weight: 600; padding: 8px 16px; border-radius: 30px; }
.cp-shelf__book:hover .cp-shelf__cover, .cp-shelf__book:focus-visible .cp-shelf__cover { transform: perspective(1200px) rotateY(-14deg) translateY(-6px); box-shadow: 0 2px 3px rgba(40,22,5,.35), 26px 26px 34px -10px rgba(40,22,5,.6); }
.cp-shelf__book:hover .cp-shelf__open, .cp-shelf__book:focus-visible .cp-shelf__open { opacity: 1; transform: translate(-50%, 0); }
.cp-shelf__name { display: inline-block; margin-top: 20px; background: #1d1b38; color: #fff; font-weight: 700; font-size: 16px; padding: 7px 16px; border-radius: 4px; }
.cp-shelf__meta { display: block; margin-top: 6px; font-size: 13px; font-weight: 600; color: #3b2410; }
@media (max-width: 991px) { .cp-shelf__row { grid-template-columns: repeat(2, 1fr); gap: 34px 24px; } }
@media (max-width: 480px) { .cp-shelf__row { gap: 28px 14px; } .cp-shelf__name { font-size: 13px; padding: 6px 8px; } .cp-shelf__meta { font-size: 11.5px; } .cp-shelf { padding: 40px 0 34px; } }
@media (hover: none) { .cp-shelf__open { opacity: 1; transform: translate(-50%, 0); font-size: 12px; padding: 6px 12px; bottom: 10px; } }

/* Popup flipbook fills the whole screen, wood edge to edge */
body .cp-modal { padding: 0; }
body .cp-modal__box { width: 100%; height: 100%; max-height: none; overflow: hidden; display: flex; flex-direction: column; background: #1d1b38; }
body .cp-modal__top { margin: 0; padding: 12px 24px; flex: 0 0 auto; }
body .cp-flip.cp-flip--modal { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; padding: 20px 20px 16px !important; min-height: 0; }
body .cp-flip--modal .cp-flip__stage { width: 100%; max-width: min(100%, calc((100vh - 170px) * 1.414)); margin: 0 auto; }
@media (max-width: 767px) {
    body .cp-modal__top { padding: 10px 14px; }
    body .cp-flip.cp-flip--modal { padding: 14px 8px 12px !important; }
    body .cp-flip--modal .cp-flip__stage { max-width: 100%; }
}

/* Branded flipbook loader */
body .cp-flip.is-loading .cp-flip__stage { min-height: 460px; }
body .cp-flip--modal.is-loading .cp-flip__stage { min-height: calc(100vh - 170px); }
body .cp-flip.is-loading .cp-flip__bar { visibility: hidden; }
body .cp-flip__loading { color: #fff; }
body .cp-flip__loading .mx-ld { display: flex; align-items: center; gap: 44px; width: auto; background: #1d1b38; border-radius: 22px; padding: 34px 44px 34px 40px; box-shadow: 0 30px 60px -20px rgba(30,15,5,.65); border-top: 4px solid #7B1FE4; max-width: calc(100% - 24px); }
body .cp-flip__loading .mx-ld__book { position: relative; width: 140px; height: 198px; flex: 0 0 auto; perspective: 1000px; border-radius: 2px 5px 5px 2px;
    background: repeating-linear-gradient(180deg, #fff 0 14px, #ece9f6 14px 15px); box-shadow: 0 18px 30px -10px rgba(0,0,0,.7), inset 8px 0 10px -6px rgba(0,0,0,.3); }
body .cp-flip__loading .mx-ld__book > img { position: absolute; inset: 0; width: 100% !important; height: 100% !important; object-fit: cover; display: block; border-radius: 2px 5px 5px 2px !important; box-shadow: 2px 0 8px rgba(0,0,0,.35) !important; opacity: 1 !important;
    transform-origin: left center; backface-visibility: hidden; animation: mxLdOpen 3s cubic-bezier(.6,.05,.35,1) infinite; }
@keyframes mxLdOpen { 0%, 18% { transform: rotateY(0deg); } 48%, 62% { transform: rotateY(-155deg); } 92%, 100% { transform: rotateY(0deg); } }
body .cp-flip__loading .mx-ld__page { display: none; }
body .cp-flip__loading .mx-ld__panel { display: flex; flex-direction: column; gap: 16px; width: 260px; }
body .cp-flip__loading .mx-ld__logo { width: 190px !important; height: auto; box-shadow: none !important; border-radius: 0 !important; opacity: 1 !important; }
body .cp-flip__loading .mx-ld__bar { height: 8px; border-radius: 8px; background: #34315e; overflow: hidden; }
body .cp-flip__loading .mx-ld__bar i { display: block; height: 100%; width: 6%; border-radius: 8px; background: linear-gradient(90deg, #7B1FE4, #B565FF 70%, #FFDE59); transition: width .35s ease; position: relative; overflow: hidden; }
body .cp-flip__loading .mx-ld__bar i::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255,255,255,.5), transparent); animation: mxLdShine 1.2s linear infinite; }
@keyframes mxLdShine { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
body .cp-flip__loading .mx-ld__label { font-size: 15px; font-weight: 600; color: #fff; letter-spacing: .2px; }
@media (max-width: 600px) {
    body .cp-flip__loading .mx-ld { flex-direction: column; gap: 22px; padding: 28px 24px; text-align: center; }
    body .cp-flip__loading .mx-ld__book { width: 116px; height: 164px; }
    body .cp-flip__loading .mx-ld__panel { width: 220px; align-items: center; }
    body .cp-flip__loading .mx-ld__bar { width: 100%; }
    body .cp-flip__loading .mx-ld__logo { width: 160px !important; }
}
@media (prefers-reduced-motion: reduce) { body .cp-flip__loading .mx-ld__book > img, body .cp-flip__loading .mx-ld__bar i::after { animation: none; } }

/* Every website preview auto scrolls while in view (driven by mansa.js [data-autoshot]) */
[data-autoshot] > img { transition: filter .5s ease !important; }
.mx-svc-shot .mx-svc-shot__shot { position: relative; display: block; overflow: hidden; aspect-ratio: 1200 / 712; border-radius: 12px; box-shadow: 0 6px 18px rgba(0,0,0,.08); background: #f1f1f4; }
.mx-svc-shot .mx-svc-shot__shot img { position: absolute; top: 0; left: 0; width: 100%; height: auto; border-radius: 0; box-shadow: none; transform: translateY(0); will-change: transform; }
@media (max-width: 575px) { .mx-svc-shot .mx-svc-shot__shot { aspect-ratio: 4 / 4.2; } }

/* WhatsApp chat on phones and tablets only; desktop gets the quick message form */
@media (min-width: 992px) { .wa-chat { display: none !important; } }
.mx-qf { display: none; position: fixed; right: 24px; bottom: 100px; z-index: 9990; }
@media (min-width: 992px) { .mx-qf { display: block; } }
.mx-qf__btn { width: 58px; height: 58px; border-radius: 50%; border: 0; background: linear-gradient(135deg, #7B1FE4, #A121CA); color: #fff; font-size: 24px; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 10px 25px rgba(90,20,170,.35); transition: transform .2s ease; }
.mx-qf__btn:hover { transform: scale(1.06); }
.mx-qf__pop { position: absolute; right: 0; bottom: 72px; width: 340px; background: #fff; color: #1b1b1b; border-radius: 18px; padding: 20px; box-shadow: 0 24px 60px rgba(40,10,90,.22); border-top: 4px solid #7B1FE4; animation: waIn .3s ease; }
.mx-qf__pop[hidden] { display: none; }
.mx-qf__close { position: absolute; top: 10px; right: 12px; border: 0; background: none; font-size: 24px; line-height: 1; color: #8a879c; cursor: pointer; }
.mx-qf__head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.mx-qf__avatar img { width: 44px; height: 44px; border-radius: 50%; display: block; }
.mx-qf__head strong { display: block; font-size: 16px; color: #1A192E; }
.mx-qf__head span { font-size: 12.5px; color: #6B6A7B; }
.mx-qf__msg { font-size: 14px; line-height: 1.5; color: #4b4a5c; margin: 0 0 12px; }
.mx-qf__form input, .mx-qf__form textarea { width: 100%; border: 1px solid #E6DEF3; background: #FAF8FE; border-radius: 10px; padding: 10px 13px; font-size: 14px; margin-bottom: 9px; color: #1b1b1b; outline: none; }
.mx-qf__form input:focus, .mx-qf__form textarea:focus { border-color: #7B1FE4; background: #fff; }
.mx-qf__form textarea { resize: vertical; min-height: 78px; }
.mx-qf__hp { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; opacity: 0; }
.mx-qf__send { width: 100%; border: 0; border-radius: 30px; background: linear-gradient(135deg, #7B1FE4, #A121CA); color: #fff; font-weight: 700; font-size: 15px; padding: 12px; display: flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer; }
.mx-qf__send:disabled { opacity: .7; cursor: wait; }
.mx-qf__note { display: block; margin-top: 8px; font-size: 11.5px; color: #8a879c; text-align: center; }
.mx-qf__err { background: #FDECEC; color: #B3261E; font-size: 13px; border-radius: 8px; padding: 8px 11px; margin-bottom: 9px; }
.mx-qf__err[hidden], .mx-qf__done[hidden], .mx-qf__form[hidden] { display: none; }
.mx-qf__done { text-align: center; padding: 10px 4px 4px; }
.mx-qf__done i { font-size: 42px; color: #2E9E5B; }
.mx-qf__done strong { display: block; font-size: 18px; margin: 10px 0 6px; color: #1A192E; }
.mx-qf__done p { font-size: 14px; line-height: 1.55; color: #4b4a5c; margin: 0; }

/* Services / industries list on phones: below the prices */
.mx-side-mobile { padding: 50px 0 60px; }

/* Flipbooks: allow two-finger pinch zoom on phones (the page-flip library sets pan-y only) */
.stf__parent, .stf__parent *, .stf__wrapper, .stf__block { touch-action: pan-x pan-y pinch-zoom !important; }

/* No glow on buttons and icon tiles: flat, solid colours only */
.wa-chat__btn, .mx-qf__btn, .mxm__cta, .mxm__close, .mxm__social a,
.is-active .mxm__ico, .mxm__group.is-active > .mxm__item .mxm__ico, .mxm__group.is-open > .mxm__item .mxm__ico,
.mx-float-link__pill, .mx-float-link:hover .mx-float-link__pill, .mx-popular__badge, .mx-plan-icon, .mx-cp-card__open,
.cp-shelf__open, .cp-flip__btn, .mx-ffb__btn, .pp-theme-btn, .theme-btn, .scroll-up, .back-to-top, .mx-bullet, .mxm__tile, .mxm__list { box-shadow: none !important; }
.mx-float-link:hover .mx-float-link__pill { box-shadow: 0 0 0 2px #7B1FE4 !important; }
.mx-bullet { box-shadow: none !important; }

/* Company profiles grid: 6 at a time with a "Show more" button */
.mx-cp-card.is-more { display: none; }
.mx-cp-card.is-shown { animation: mxCpIn .45s ease both; }
@keyframes mxCpIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.mx-cp-more { text-align: center; margin-top: 44px; }
.mx-cp-more[hidden] { display: none; }
.mx-cp-more .pp-theme-btn { border: 0; cursor: pointer; }
.mx-cp-more span { opacity: .8; font-weight: 500; margin-left: 4px; }
@media (max-width: 575px) {
    .mx-cp-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 14px !important; }
    .mx-cp-grid .mx-cp-card { padding: 8px 8px 14px; border-radius: 16px; }
    .mx-cp-grid .mx-cp-card__name { font-size: 15px; }
    .mx-cp-grid .mx-cp-card__meta { font-size: 12px; }
    .mx-cp-grid .mx-cp-card__open { font-size: 11px; padding: 5px 10px; white-space: nowrap; }
    .mx-cp-grid .mx-cp-card__badge { font-size: 11px; padding: 3px 9px; }
}

/* ===== Company profile landing page: social proof + quote form ===== */
.cp-lp-hero { padding-top: 170px; }
@media (max-width: 1199px) { .cp-lp-hero { padding-top: 150px; } }
@media (max-width: 767px) { .cp-lp-hero { padding-top: 120px; } }
.cp-lp-hero .cp-hero-h1 { font-size: 48px; line-height: 1.15; margin-top: 14px; }
@media (max-width: 991px) { .cp-lp-hero .cp-hero-h1 { font-size: 38px; } }
@media (max-width: 575px) { .cp-lp-hero .cp-hero-h1 { font-size: 30px; } }
.cp-g-badge { display: inline-flex; align-items: center; gap: 7px; padding: 7px 14px; border: 1px solid #e6dcf7; border-radius: 999px; background: #fff; color: #1b1b2f; font-size: 15px; line-height: 1; }
.cp-g-badge:hover { border-color: #7B1FE4; color: #1b1b2f; }
.cp-g-badge .fa-google { color: #4285F4; }
.cp-g-badge__stars, .cp-quote__g b { color: #F2B705; font-size: 12px; letter-spacing: 1px; }
.cp-g-badge em { color: #5b5b6b; font-style: normal; font-size: 15px; }
.cp-g-badge strong { font-weight: 700; }
.cp-hero-facts { list-style: none; padding: 0; margin: 18px 0 6px; display: flex; flex-wrap: wrap; gap: 8px 10px; }
.cp-hero-facts li { display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px; border-radius: 10px; background: #f5effe; color: #2b2140; font-size: 15px; }
.cp-hero-facts li i { color: #7B1FE4; }
.cp-lp-hero .about-count-item .count-text h2 { white-space: nowrap; }

.cp-trust { padding: 10px 0 60px; }
.cp-trust__label { text-align: center; font-size: 14px; letter-spacing: .08em; text-transform: uppercase; color: #6b6b7b; margin-bottom: 22px; }
.cp-trust__logos { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 22px 38px; }
.cp-trust__logo img { height: 46px; width: auto; max-width: 140px; object-fit: contain; filter: grayscale(1); opacity: .75; transition: filter .2s, opacity .2s; }
.cp-trust__logo:hover img { filter: none; opacity: 1; }
@media (max-width: 575px) { .cp-trust__logos { gap: 16px 22px; } .cp-trust__logo img { height: 34px; max-width: 100px; } }

.cp-quote { background: #f7f3fd; }
.cp-quote__box { display: grid; grid-template-columns: 1fr 1.2fr; gap: 48px; align-items: start; background: #fff; border-radius: 28px; padding: 48px; box-shadow: 0 20px 60px rgba(60, 20, 120, .08); }
@media (max-width: 991px) { .cp-quote__box { grid-template-columns: 1fr; gap: 28px; padding: 30px 22px; } }
.cp-quote__intro h2 { font-size: 36px; line-height: 1.2; margin: 10px 0 14px; }
@media (max-width: 575px) { .cp-quote__intro h2 { font-size: 28px; } }
.cp-quote__points { list-style: none; padding: 0; margin: 20px 0; }
.cp-quote__points li { display: flex; gap: 10px; align-items: center; margin-bottom: 10px; color: #2b2140; }
.cp-quote__points i { color: #7B1FE4; }
.cp-quote__g { display: inline-flex; align-items: center; gap: 6px; color: #2b2140; font-weight: 600; }
.cp-quote__g .fa-google { color: #4285F4; }
.cp-quote__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 575px) { .cp-quote__grid { grid-template-columns: 1fr; } }
.cp-quote__grid label { display: flex; flex-direction: column; gap: 6px; margin: 0; }
.cp-quote__grid label span { font-size: 14px; font-weight: 600; color: #2b2140; }
.cp-quote__full { grid-column: 1 / -1; }
.cp-quote__grid input, .cp-quote__grid select, .cp-quote__grid textarea { width: 100%; border: 1px solid #ddd3ef; border-radius: 12px; padding: 12px 14px; font-size: 15px; background: #fff; color: #1b1b2f; outline: none; }
.cp-quote__grid input:focus, .cp-quote__grid select:focus, .cp-quote__grid textarea:focus { border-color: #7B1FE4; }
.cp-quote__send { margin-top: 18px; width: 100%; justify-content: center; border: 0; }
.cp-quote__note { display: block; margin-top: 10px; color: #77778a; font-size: 13px; }
.cp-quote__form .mx-qf__err { margin-top: 12px; }
.cp-quote__done { text-align: center; padding: 40px 10px; }
.cp-quote__done i { font-size: 48px; color: #25a244; }
.cp-quote__done h3 { margin: 14px 0 8px; }