:root{
    --orange:#ff6518;
    --orange-dark:#e94f00;
    --orange-soft:#fff1e9;
    --navy:#111827;
    --navy-2:#192338;
    --text:#344054;
    --muted:#667085;
    --border:#e5e9f0;
    --light:#f7f8fb;
    --white:#ffffff;
}

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    margin:0;
    font-family:
        Inter,
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
    color:var(--navy);
    background:#fff;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
}

img{
    display:block;
    max-width:100%;
}

a{
    color:inherit;
    text-decoration:none;
}

button,
input,
textarea,
select{
    font:inherit;
}

.container{
    width:min(1200px,calc(100% - 48px));
    margin:auto;
}


/* ANNOUNCEMENT */

.announcement{
    background:var(--navy);
    color:#fff;
    font-size:13px;
}

.announcement-inner{
    min-height:38px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
}

.announcement strong{
    color:#ff9a66;
}

.announcement a{
    color:#fff;
    font-weight:700;
}


/* HEADER */

.site-header{
    position:sticky;
    top:0;
    z-index:1000;
    background:rgba(255,255,255,.95);
    backdrop-filter:blur(16px);
    border-bottom:1px solid rgba(226,232,240,.9);
}

.nav{
    min-height:76px;
    display:flex;
    align-items:center;
    gap:35px;
}

.logo{
    display:inline-flex;
    align-items:center;
    gap:10px;
    font-size:23px;
    font-weight:900;
    letter-spacing:-.7px;
}

.logo-mark{
    width:39px;
    height:39px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:var(--orange);
    color:white;
    font-weight:900;
}

.desktop-nav{
    margin-left:auto;
    display:flex;
    align-items:center;
    gap:30px;
    font-size:14px;
    font-weight:700;
}

.desktop-nav a{
    transition:.2s;
}

.desktop-nav a:hover{
    color:var(--orange);
}

.nav-actions{
    display:flex;
    align-items:center;
    gap:12px;
}

.nav-button{
    background:var(--navy);
    color:#fff;
    padding:12px 19px;
    border-radius:10px;
    font-size:14px;
    font-weight:800;
}

.menu-button{
    display:none;
    width:42px;
    height:42px;
    padding:10px;
    background:#fff;
    border:1px solid var(--border);
    border-radius:10px;
    cursor:pointer;
}

.menu-button span{
    display:block;
    height:2px;
    margin:5px 0;
    background:var(--navy);
}

.mobile-menu{
    display:none;
}


/* HERO */

.hero{
    position:relative;
    overflow:hidden;
    padding:95px 0 110px;
    background:
        linear-gradient(180deg,#fff 0%,#fbfcff 100%);
}

.hero-glow{
    position:absolute;
    width:550px;
    height:550px;
    border-radius:50%;
    filter:blur(90px);
    pointer-events:none;
}

.glow-one{
    right:-230px;
    top:-220px;
    background:rgba(255,101,24,.14);
}

.glow-two{
    left:-300px;
    bottom:-300px;
    background:rgba(42,75,155,.07);
}

.hero-grid{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:.92fr 1.08fr;
    align-items:center;
    gap:75px;
}

.hero-badge{
    display:inline-flex;
    align-items:center;
    gap:9px;
    padding:8px 12px;
    border:1px solid #ffd6c1;
    border-radius:100px;
    background:#fff8f4;
    color:#a74314;
    font-size:12px;
    font-weight:800;
}

.badge-dot{
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--orange);
}

.hero h1{
    margin:22px 0;
    max-width:680px;
    font-size:clamp(50px,5.2vw,76px);
    line-height:.99;
    letter-spacing:-4px;
}

.hero h1 span{
    display:block;
    color:var(--orange);
}

.hero-description{
    max-width:610px;
    margin:0;
    color:var(--muted);
    font-size:20px;
    line-height:1.7;
}

.hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin:30px 0 26px;
}

.primary-button,
.secondary-button{
    display:inline-flex;
    justify-content:center;
    align-items:center;
    border:0;
    border-radius:11px;
    cursor:pointer;
    font-weight:850;
    transition:.2s ease;
}

.primary-button{
    background:var(--orange);
    color:#fff;
    box-shadow:0 12px 28px rgba(255,101,24,.24);
}

.primary-button:hover{
    background:var(--orange-dark);
    transform:translateY(-1px);
}

.secondary-button{
    background:#fff;
    border:1px solid #d7dde6;
    color:var(--navy);
}

.large-button{
    min-height:55px;
    padding:0 23px;
}

.hero-features{
    display:flex;
    flex-wrap:wrap;
    gap:10px 20px;
    color:#4b5565;
    font-size:13px;
    font-weight:700;
}

.hero-features span{
    color:var(--orange);
}

.hero-price{
    display:flex;
    align-items:center;
    gap:22px;
    width:max-content;
    max-width:100%;
    margin-top:31px;
    padding:18px 22px;
    border:1px solid var(--border);
    border-radius:16px;
    background:#fff;
    box-shadow:0 15px 38px rgba(16,24,40,.06);
}

.price-main{
    display:flex;
    flex-direction:column;
}

.price-label{
    color:#8b95a7;
    font-size:9px;
    font-weight:850;
    letter-spacing:.15em;
}

.price-main strong{
    margin-top:2px;
    font-size:43px;
    line-height:1;
    letter-spacing:-2px;
}

.price-divider{
    align-self:stretch;
    width:1px;
    background:#e8ecf2;
}

.price-copy{
    color:#667085;
    font-size:12px;
}

.price-copy strong{
    color:var(--navy);
}


/* HERO SHOWCASE */

.hero-showcase{
    position:relative;
}

.browser-window{
    overflow:hidden;
    border:1px solid #dfe5ed;
    border-radius:24px;
    background:#fff;
    box-shadow:
        0 45px 90px rgba(15,23,42,.18),
        0 8px 25px rgba(15,23,42,.07);
    transform:rotate(1.2deg);
}

.browser-header{
    min-height:53px;
    display:flex;
    align-items:center;
    gap:18px;
    padding:0 17px;
    background:#f7f9fc;
    border-bottom:1px solid #e7ebf1;
}

.browser-dots{
    display:flex;
    gap:7px;
}

.browser-dots span{
    width:9px;
    height:9px;
    border-radius:50%;
    background:#d0d7e2;
}

.browser-url{
    flex:1;
    padding:7px 13px;
    background:#fff;
    border:1px solid #edf0f4;
    border-radius:8px;
    color:#a0a9b8;
    font-size:10px;
}

.browser-page{
    padding:19px;
}

.demo-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:3px 4px 17px;
}

.demo-logo{
    font-size:14px;
    font-weight:900;
    letter-spacing:.05em;
}

.demo-menu{
    color:#7e8999;
    font-size:9px;
}

.demo-hero{
    position:relative;
    min-height:365px;
    overflow:hidden;
    border-radius:18px;
}

.demo-hero img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
}

.demo-hero:after{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(90deg,
        rgba(15,23,42,.88),
        rgba(15,23,42,.48),
        rgba(15,23,42,.10));
}

.demo-overlay{
    position:relative;
    z-index:2;
    max-width:430px;
    padding:55px 39px;
    color:#fff;
}

.demo-overlay span{
    color:#ffae85;
    font-size:9px;
    font-weight:900;
    letter-spacing:.14em;
}

.demo-overlay h2{
    margin:10px 0 11px;
    font-size:45px;
    line-height:1;
    letter-spacing:-2px;
}

.demo-overlay p{
    margin:0;
    max-width:300px;
    color:#e0e5ed;
    font-size:12px;
}

.demo-overlay button{
    margin-top:20px;
    padding:11px 16px;
    border:0;
    border-radius:8px;
    background:var(--orange);
    color:#fff;
    font-size:10px;
    font-weight:850;
}

.demo-services{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
    padding-top:14px;
}

.demo-services div{
    padding:14px;
    border-radius:10px;
    background:#f5f7fa;
}

.demo-services strong,
.demo-services span{
    display:block;
}

.demo-services strong{
    font-size:10px;
}

.demo-services span{
    margin-top:2px;
    color:#98a2b3;
    font-size:8px;
}

.floating-card{
    position:absolute;
    z-index:4;
    display:flex;
    align-items:center;
    gap:11px;
    min-width:215px;
    padding:15px 17px;
    border:1px solid #e9edf2;
    border-radius:15px;
    background:#fff;
    box-shadow:0 20px 50px rgba(15,23,42,.14);
}

.floating-card strong,
.floating-card span{
    display:block;
}

.floating-card strong{
    font-size:13px;
}

.floating-card span{
    margin-top:1px;
    color:#8490a1;
    font-size:10px;
}

.phone-icon,
.seo-icon{
    width:35px;
    height:35px;
    display:grid;
    place-items:center;
    border-radius:10px;
    background:var(--orange-soft);
    color:var(--orange);
    font-weight:900;
}

.floating-mobile{
    left:-35px;
    bottom:-20px;
}

.floating-seo{
    right:-23px;
    top:62px;
}


/* TRUST */

.trust-strip{
    padding:31px 0 34px;
    border-top:1px solid #edf0f4;
    border-bottom:1px solid #edf0f4;
}

.trusted-label{
    margin:0 0 17px;
    color:#a0a8b5;
    text-align:center;
    font-size:10px;
    font-weight:850;
    letter-spacing:.14em;
}

.trust-items{
    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:20px;
    text-align:center;
}

.trust-items span{
    color:#687386;
    font-size:13px;
    font-weight:750;
}


/* SECTIONS */

.section{
    padding:105px 0;
}

.section-label{
    color:var(--orange);
    font-size:11px;
    font-weight:900;
    letter-spacing:.14em;
}

.section-heading{
    margin-bottom:50px;
}

.section-heading h2,
.value-copy h2,
.seo-grid h2,
.contact-copy h2,
.faq-heading h2{
    margin:10px 0 16px;
    font-size:clamp(38px,4.5vw,58px);
    line-height:1.06;
    letter-spacing:-2.6px;
}

.section-heading p,
.value-copy > p,
.seo-grid > div > p,
.contact-copy > p,
.faq-heading p{
    color:var(--muted);
    font-size:17px;
}

.center{
    max-width:760px;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
}

.split-heading{
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:80px;
    align-items:end;
}

.split-heading p{
    margin:0 0 8px;
}


/* SERVICES */

.service-grid{
    display:grid;
    grid-template-columns:1.35fr 1fr 1fr;
    gap:20px;
}

.service-card{
    position:relative;
    min-height:250px;
    padding:29px;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:19px;
    background:#fff;
}

.feature-large{
    grid-row:span 2;
    min-height:520px;
    background:var(--navy);
    color:#fff;
}

.service-number{
    color:#6d7788;
    font-size:13px;
    font-weight:800;
}

.service-card h3{
    margin:18px 0 9px;
    font-size:23px;
    letter-spacing:-.7px;
}

.feature-large h3{
    max-width:370px;
    font-size:34px;
    line-height:1.1;
}

.service-card p{
    margin:0;
    color:#788397;
}

.feature-large p{
    max-width:380px;
    color:#abb5c4;
}

.service-icon{
    width:45px;
    height:45px;
    display:grid;
    place-items:center;
    border-radius:12px;
    background:var(--orange-soft);
    color:var(--orange);
    font-size:18px;
    font-weight:900;
}

.mini-site-preview{
    position:absolute;
    left:30px;
    right:-30px;
    bottom:-28px;
    height:245px;
    padding:13px;
    border-radius:18px 0 0 0;
    background:#fff;
    box-shadow:0 -10px 40px rgba(0,0,0,.18);
}

.mini-site-top{
    width:100%;
    height:20px;
    border-radius:5px;
    background:#eff2f6;
}

.mini-site-main{
    margin-top:11px;
    height:175px;
    padding:22px;
    border-radius:12px;
    background:
        linear-gradient(130deg,#27344b,#162033);
}

.mini-site-main div{
    width:48%;
    height:32px;
    border-radius:6px;
    background:#fff;
    opacity:.95;
}

.mini-site-main span{
    display:block;
    width:65%;
    height:6px;
    margin-top:11px;
    border-radius:10px;
    background:#8793a5;
}

.mini-site-main span:nth-child(3){
    width:52%;
}

.mini-site-main span:nth-child(4){
    width:25%;
    height:24px;
    margin-top:19px;
    background:var(--orange);
}


/* PORTFOLIO */

.portfolio-section{
    padding:110px 0;
    background:var(--light);
}

.portfolio-grid{
    display:grid;
    grid-template-columns:1.35fr 1fr 1fr;
    grid-auto-rows:285px;
    gap:18px;
}

.portfolio-card{
    position:relative;
    overflow:hidden;
    border-radius:20px;
    background:#111827;
}

.large-portfolio{
    grid-row:span 2;
}

.portfolio-card img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .45s ease;
}

.portfolio-card:hover img{
    transform:scale(1.04);
}

.portfolio-card:after{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(180deg,
        transparent 28%,
        rgba(9,14,26,.78) 100%);
}

.portfolio-overlay{
    position:absolute;
    z-index:2;
    left:25px;
    right:25px;
    bottom:23px;
    color:#fff;
}

.portfolio-overlay span{
    color:#ffb38b;
    font-size:9px;
    font-weight:900;
    letter-spacing:.14em;
}

.portfolio-overlay h3{
    margin:7px 0 0;
    font-size:23px;
    line-height:1.1;
}

.large-portfolio .portfolio-overlay h3{
    max-width:450px;
    font-size:38px;
}

.portfolio-overlay p{
    max-width:420px;
    margin:10px 0 0;
    color:#d9dee7;
}


/* PROCESS */

.process-section{
    background:#fff;
}

.process-grid{
    display:grid;
    grid-template-columns:1fr auto 1fr auto 1fr;
    align-items:start;
}

.process-grid article{
    text-align:center;
    padding:10px 25px;
}

.process-number{
    display:grid;
    place-items:center;
    width:57px;
    height:57px;
    margin:0 auto 20px;
    border-radius:50%;
    background:var(--orange-soft);
    color:var(--orange);
    font-weight:900;
}

.process-grid h3{
    font-size:21px;
    margin:0 0 8px;
}

.process-grid p{
    margin:0;
    color:var(--muted);
}

.process-line{
    width:120px;
    height:1px;
    margin-top:38px;
    background:#dce2e9;
}


/* VALUE */

.value-section{
    padding:110px 0;
    background:#f8f9fb;
}

.value-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:85px;
    align-items:center;
}

.value-image{
    position:relative;
}

.value-image img{
    width:100%;
    height:590px;
    object-fit:cover;
    border-radius:22px;
    box-shadow:0 25px 60px rgba(15,23,42,.13);
}

.value-floating{
    position:absolute;
    right:-28px;
    bottom:40px;
    padding:18px 22px;
    border-radius:15px;
    background:#fff;
    box-shadow:0 20px 50px rgba(15,23,42,.15);
}

.value-floating span,
.value-floating strong{
    display:block;
}

.value-floating span{
    color:#7a8495;
    font-size:11px;
}

.value-floating strong{
    margin-top:2px;
    font-size:23px;
}

.value-copy{
    max-width:540px;
}

.value-list{
    margin-top:32px;
    display:grid;
    gap:19px;
}

.value-list > div{
    display:flex;
    gap:14px;
}

.value-list > div > span{
    flex:0 0 32px;
    width:32px;
    height:32px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:var(--orange-soft);
    color:var(--orange);
    font-weight:900;
}

.value-list strong{
    display:block;
}

.value-list p{
    margin:2px 0 0;
    color:var(--muted);
    font-size:14px;
}


/* PRICING */

.pricing-section{
    padding:110px 0;
    background:var(--navy);
    color:#fff;
}

.pricing-heading p{
    color:#aeb8c7;
}

.pricing-wrap{
    display:grid;
    grid-template-columns:1.3fr .7fr;
    max-width:1000px;
    margin:auto;
    gap:20px;
}

.pricing-main,
.pricing-side{
    position:relative;
    padding:40px;
    border-radius:22px;
}

.pricing-main{
    background:#fff;
    color:var(--navy);
}

.pricing-side{
    border:1px solid #344056;
    background:#1b263a;
}

.pricing-popular{
    position:absolute;
    top:-14px;
    left:32px;
    padding:7px 13px;
    border-radius:100px;
    background:var(--orange);
    color:#fff;
    font-size:10px;
    font-weight:900;
    letter-spacing:.1em;
}

.pricing-top{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:30px;
}

.pricing-name{
    color:var(--orange);
    font-size:11px;
    font-weight:900;
    letter-spacing:.12em;
}

.pricing-top h3{
    max-width:390px;
    margin:8px 0;
    font-size:27px;
    line-height:1.15;
}

.pricing-price{
    display:flex;
    align-items:flex-start;
}

.pricing-price span{
    position:relative;
    top:8px;
    font-size:22px;
    font-weight:800;
}

.pricing-price strong{
    font-size:68px;
    line-height:.9;
    letter-spacing:-4px;
}

.pricing-includes{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:13px 25px;
    padding:28px 0;
    margin:23px 0 28px;
    border-top:1px solid var(--border);
    border-bottom:1px solid var(--border);
    color:#465166;
    font-size:14px;
    font-weight:650;
}

.pricing-includes span{
    color:var(--orange);
    margin-right:6px;
}

.pricing-button{
    width:100%;
    min-height:55px;
}

.pricing-side h3{
    margin:10px 0 30px;
    font-size:26px;
    line-height:1.2;
}

.pricing-side h3 strong{
    color:#ff8f56;
}

.price-row{
    display:flex;
    justify-content:space-between;
    padding:14px 0;
    border-bottom:1px solid #344056;
    color:#c9d0dc;
}

.price-row strong{
    color:#fff;
}

.pricing-note{
    max-width:760px;
    margin:27px auto 0;
    color:#8590a1;
    text-align:center;
    font-size:11px;
}


/* SEO */

.seo-section{
    padding:110px 0;
    background:#fff;
}

.seo-grid{
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:80px;
    align-items:center;
}

.seo-panel{
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:20px;
    background:#fff;
    box-shadow:0 18px 55px rgba(15,23,42,.06);
}

.seo-panel > div{
    display:flex;
    align-items:center;
    gap:18px;
    padding:20px 24px;
    border-bottom:1px solid var(--border);
}

.seo-panel > div:last-child{
    border:0;
}

.seo-panel span{
    color:var(--orange);
    font-size:11px;
    font-weight:900;
}


/* FAQ */

.faq-wrap{
    display:grid;
    grid-template-columns:.7fr 1.3fr;
    gap:85px;
}

.faq-heading{
    position:sticky;
    top:130px;
    align-self:start;
}

.faq-list details{
    padding:23px 0;
    border-bottom:1px solid var(--border);
}

.faq-list summary{
    cursor:pointer;
    list-style:none;
    font-size:18px;
    font-weight:800;
}

.faq-list summary::-webkit-details-marker{
    display:none;
}

.faq-list summary:after{
    content:"+";
    float:right;
    color:var(--orange);
    font-size:24px;
}

.faq-list details[open] summary:after{
    content:"–";
}

.faq-list p{
    max-width:650px;
    color:var(--muted);
}


/* CONTACT */

.contact-section{
    padding:110px 0;
    background:
        radial-gradient(circle at 15% 15%,
        rgba(255,101,24,.19),
        transparent 30%),
        var(--navy);
    color:#fff;
}

.contact-grid{
    display:grid;
    grid-template-columns:.8fr 1.2fr;
    gap:80px;
    align-items:start;
}

.light-label{
    color:#ff9d6c;
}

.contact-copy{
    padding-top:35px;
}

.contact-copy > p{
    color:#aeb8c7;
}

.contact-offer{
    margin-top:40px;
    padding:24px;
    border:1px solid #344056;
    border-radius:17px;
    background:rgba(255,255,255,.04);
}

.contact-offer small,
.contact-offer strong,
.contact-offer span{
    display:block;
}

.contact-offer small{
    color:#8f9aae;
    font-size:9px;
    font-weight:900;
    letter-spacing:.13em;
}

.contact-offer strong{
    margin:4px 0;
    color:#fff;
    font-size:52px;
    letter-spacing:-3px;
}

.contact-offer span{
    color:#aeb8c7;
    font-size:12px;
}

.lead-form{
    display:grid;
    gap:17px;
    padding:34px;
    border-radius:22px;
    background:#fff;
    color:var(--navy);
    box-shadow:0 30px 75px rgba(0,0,0,.22);
}

.form-title h3{
    margin:0;
    font-size:26px;
}

.form-title p{
    margin:2px 0 8px;
    color:var(--muted);
}

.form-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px;
}

.lead-form label{
    display:grid;
    gap:7px;
    font-size:12px;
    font-weight:800;
}

.lead-form input,
.lead-form select,
.lead-form textarea{
    width:100%;
    border:1px solid #d8dee7;
    border-radius:10px;
    padding:13px 14px;
    outline:none;
    background:#fff;
}

.lead-form input:focus,
.lead-form select:focus,
.lead-form textarea:focus{
    border-color:var(--orange);
    box-shadow:0 0 0 3px rgba(255,101,24,.10);
}

.full{
    width:100%;
    min-height:53px;
}

.form-note{
    margin:0;
    color:#929cac;
    text-align:center;
    font-size:10px;
}

#formMessage{
    text-align:center;
    color:var(--orange);
    font-size:12px;
    font-weight:750;
}


/* FOOTER */

footer{
    padding:65px 0 26px;
    background:#0c1320;
    color:#fff;
}

.footer-top{
    display:grid;
    grid-template-columns:2fr 1fr 1fr;
    gap:70px;
}

.footer-brand p{
    max-width:320px;
    color:#7e899a;
}

.footer-column{
    display:flex;
    flex-direction:column;
    gap:9px;
    font-size:13px;
    color:#9da7b6;
}

.footer-column strong{
    margin-bottom:8px;
    color:#fff;
}

.footer-bottom{
    display:flex;
    justify-content:space-between;
    gap:30px;
    margin-top:50px;
    padding-top:22px;
    border-top:1px solid #222d40;
    color:#6f7a8c;
    font-size:11px;
}


/* MOBILE STICKY */

.mobile-sticky{
    display:none;
}


/* RESPONSIVE */

@media(max-width:1050px){

    .hero-grid,
    .value-grid,
    .seo-grid,
    .contact-grid{
        grid-template-columns:1fr;
    }

    .hero-grid{
        gap:75px;
    }

    .hero-copy{
        max-width:760px;
    }

    .hero-showcase{
        max-width:750px;
        margin:auto;
    }

    .service-grid{
        grid-template-columns:1fr 1fr;
    }

    .feature-large{
        grid-row:auto;
        grid-column:span 2;
    }

    .portfolio-grid{
        grid-template-columns:1fr 1fr;
    }

    .large-portfolio{
        grid-row:auto;
    }

    .pricing-wrap{
        grid-template-columns:1fr;
    }

    .faq-wrap{
        grid-template-columns:1fr;
    }

    .faq-heading{
        position:static;
    }

}


@media(max-width:850px){

    .desktop-nav{
        display:none;
    }

    .menu-button{
        display:block;
    }

    .mobile-menu{
        padding:12px 24px 22px;
        border-top:1px solid var(--border);
        background:#fff;
    }

    .mobile-menu.open{
        display:grid;
    }

    .mobile-menu a{
        padding:12px 5px;
        border-bottom:1px solid #eef1f5;
        font-weight:700;
    }

    .mobile-menu .mobile-cta{
        margin-top:10px;
        padding:12px 15px;
        border:0;
        border-radius:9px;
        background:var(--orange);
        color:#fff;
        text-align:center;
    }

    .split-heading{
        grid-template-columns:1fr;
        gap:20px;
    }

    .trust-items{
        grid-template-columns:repeat(3,1fr);
    }

    .process-grid{
        grid-template-columns:1fr;
        gap:30px;
    }

    .process-line{
        display:none;
    }

}


@media(max-width:620px){

    body{
        padding-bottom:70px;
    }

    .container{
        width:min(100% - 28px,1200px);
    }

    .announcement-inner{
        justify-content:center;
        text-align:center;
    }

    .announcement a{
        display:none;
    }

    .nav{
        min-height:68px;
    }

    .nav-button{
        display:none;
    }

    .hero{
        padding:58px 0 80px;
    }

    .hero h1{
        font-size:46px;
        letter-spacing:-2.5px;
    }

    .hero-description{
        font-size:17px;
    }

    .hero-actions{
        display:grid;
    }

    .hero-actions a{
        width:100%;
    }

    .hero-price{
        width:100%;
    }

    .browser-window{
        border-radius:17px;
    }

    .browser-page{
        padding:11px;
    }

    .demo-menu{
        display:none;
    }

    .demo-hero{
        min-height:280px;
    }

    .demo-overlay{
        padding:38px 22px;
    }

    .demo-overlay h2{
        font-size:34px;
    }

    .demo-services{
        grid-template-columns:1fr;
    }

    .floating-card{
        position:static;
        margin-top:10px;
    }

    .trust-items{
        grid-template-columns:repeat(2,1fr);
    }

    .section,
    .portfolio-section,
    .value-section,
    .pricing-section,
    .seo-section,
    .contact-section{
        padding:78px 0;
    }

    .section-heading h2,
    .value-copy h2,
    .seo-grid h2,
    .contact-copy h2,
    .faq-heading h2{
        font-size:38px;
        letter-spacing:-1.8px;
    }

    .service-grid{
        grid-template-columns:1fr;
    }

    .feature-large{
        grid-column:auto;
        min-height:500px;
    }

    .portfolio-grid{
        grid-template-columns:1fr;
        grid-auto-rows:330px;
    }

    .value-image img{
        height:430px;
    }

    .value-floating{
        right:10px;
        bottom:18px;
    }

    .pricing-main,
    .pricing-side{
        padding:28px 23px;
    }

    .pricing-top{
        display:block;
    }

    .pricing-price{
        margin-top:20px;
    }

    .pricing-includes{
        grid-template-columns:1fr;
    }

    .form-grid{
        grid-template-columns:1fr;
    }

    .lead-form{
        padding:25px 20px;
    }

    .footer-top{
        grid-template-columns:1fr;
        gap:35px;
    }

    .footer-bottom{
        flex-direction:column;
        gap:8px;
    }

    .mobile-sticky{
        position:fixed;
        z-index:2000;
        left:0;
        right:0;
        bottom:0;
        min-height:68px;
        display:flex;
        justify-content:space-between;
        align-items:center;
        padding:10px 15px;
        border-top:1px solid #dde2ea;
        background:rgba(255,255,255,.96);
        backdrop-filter:blur(14px);
        box-shadow:0 -8px 25px rgba(15,23,42,.09);
    }

    .mobile-sticky div{
        display:flex;
        flex-direction:column;
    }

    .mobile-sticky span{
        color:#7b8696;
        font-size:10px;
    }

    .mobile-sticky strong{
        font-size:22px;
        line-height:1;
    }

    .mobile-sticky a{
        padding:11px 18px;
        border-radius:9px;
        background:var(--orange);
        color:#fff;
        font-size:13px;
        font-weight:850;
    }

}


/* ================================================================
   QAMZU — PREMIUM SERVICES SECTION POLISH
   ================================================================ */

#services.section{
    padding-top:88px;
    padding-bottom:105px;
}

#services .section-heading{
    margin-bottom:38px;
}

#services .split-heading{
    align-items:end;
}

#services .split-heading h2{
    max-width:650px;
    margin-bottom:0;
}

#services .split-heading > p{
    max-width:500px;
    justify-self:end;
    padding-bottom:7px;
    line-height:1.75;
}


/* CARDS */

#services .service-grid{
    gap:18px;
}

#services .service-card{
    border-color:#e1e6ee;
    transition:
        transform .22s ease,
        box-shadow .22s ease,
        border-color .22s ease;
}

#services .service-card:not(.feature-large){
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:245px;
    padding:30px;
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #ffffff 68%,
            #fbfcfe 100%
        );
}

#services .service-card:not(.feature-large):hover{
    transform:translateY(-4px);
    border-color:#f0c4ad;
    box-shadow:
        0 20px 45px rgba(16,24,40,.08);
}

#services .service-icon{
    margin-bottom:5px;
    box-shadow:
        inset 0 0 0 1px rgba(255,101,24,.04);
}

#services .service-card:not(.feature-large) h3{
    font-size:22px;
    letter-spacing:-.5px;
}

#services .service-card:not(.feature-large) p{
    max-width:290px;
    line-height:1.75;
}


/* LARGE VISUAL CARD */

#services .feature-large{
    min-height:510px;
    padding:30px;
    isolation:isolate;
    background:
        linear-gradient(
            145deg,
            #111827 0%,
            #182337 100%
        );
}

#services .feature-large:before{
    content:"";
    position:absolute;
    width:230px;
    height:230px;
    right:-100px;
    top:-100px;
    border-radius:50%;
    background:rgba(255,101,24,.16);
    filter:blur(45px);
    pointer-events:none;
}

#services .feature-large .service-number,
#services .feature-large h3,
#services .feature-large > p{
    position:relative;
    z-index:4;
}

#services .feature-large .service-number{
    color:#97a4b8;
}

#services .feature-large h3{
    max-width:390px;
    margin-top:18px;
    font-size:32px;
    line-height:1.08;
    letter-spacing:-1px;
}

#services .feature-large > p{
    max-width:390px;
    font-size:14px;
    line-height:1.75;
}


/* PHOTO AREA */

.service-showcase{
    position:absolute;
    z-index:2;
    left:28px;
    right:28px;
    bottom:0;
    height:235px;
    overflow:hidden;
    border-radius:18px 18px 0 0;
    background:#202c42;
}

.service-showcase > img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
}

.service-showcase:after{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            90deg,
            rgba(15,23,42,.30),
            rgba(15,23,42,.08)
        );
}


/* WEBSITE PREVIEW OVER PHOTO */

.service-browser{
    position:absolute;
    z-index:3;
    right:20px;
    bottom:-1px;
    width:68%;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.7);
    border-radius:14px 14px 0 0;
    background:white;
    box-shadow:
        0 18px 50px rgba(8,15,28,.35);
}

.service-browser-bar{
    display:flex;
    align-items:center;
    gap:5px;
    min-height:34px;
    padding:0 10px;
    background:#f4f6f9;
    border-bottom:1px solid #e4e9f0;
}

.service-browser-bar > span{
    width:6px;
    height:6px;
    border-radius:50%;
    background:#cbd3de;
}

.service-browser-bar > div{
    flex:1;
    margin-left:6px;
    padding:4px 8px;
    border-radius:5px;
    background:#fff;
    color:#9aa4b4;
    font-size:7px;
}

.service-browser-content{
    min-height:150px;
    padding:22px;
    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f7f9fc 100%
        );
}

.service-browser-content small{
    display:block;
    color:#ff6518;
    font-size:6px;
    font-weight:900;
    letter-spacing:.12em;
}

.service-browser-content strong{
    display:block;
    max-width:180px;
    margin:7px 0 12px;
    color:#111827;
    font-size:19px;
    line-height:1.08;
    letter-spacing:-.5px;
}

.browser-line{
    height:5px;
    margin-top:6px;
    border-radius:999px;
    background:#dfe4eb;
}

.browser-line.wide{
    width:72%;
}

.browser-line.medium{
    width:53%;
}

.service-browser-content button{
    margin-top:14px;
    padding:7px 12px;
    border:0;
    border-radius:6px;
    background:#ff6518;
    color:#fff;
    font-size:7px;
    font-weight:850;
}


/* MOBILE */

@media(max-width:1050px){

    #services .feature-large{
        min-height:560px;
    }

    .service-showcase{
        height:275px;
    }

}

@media(max-width:620px){

    #services.section{
        padding-top:70px;
        padding-bottom:75px;
    }

    #services .section-heading{
        margin-bottom:28px;
    }

    #services .feature-large{
        min-height:555px;
        padding:25px;
    }

    #services .feature-large h3{
        font-size:29px;
    }

    .service-showcase{
        left:20px;
        right:20px;
        height:260px;
    }

    .service-browser{
        right:12px;
        width:78%;
    }

    #services .service-card:not(.feature-large){
        min-height:220px;
    }

}

/* =========================================================
   PORTFOLIO → PROCESS TRANSITION POLISH
   ========================================================= */

.portfolio-section{
    padding-top:100px;
    padding-bottom:62px;
}

.portfolio-grid{
    margin-bottom:0;
}

.portfolio-card{
    box-shadow:
        0 12px 30px rgba(15,23,42,.08);
    border:1px solid rgba(255,255,255,.5);
}

.portfolio-card:hover{
    box-shadow:
        0 22px 45px rgba(15,23,42,.14);
}

.process-section{
    padding-top:72px;
}

@media(max-width:620px){

    .portfolio-section{
        padding-top:75px;
        padding-bottom:48px;
    }

    .process-section{
        padding-top:55px;
    }

}

/* =========================================================
   QAMZU — WEBSITE MOCKUP PORTFOLIO
   ========================================================= */

.mockup-portfolio-grid{
    display:grid;
    grid-template-columns:1.25fr 1fr 1fr;
    grid-auto-rows:minmax(315px, auto);
    gap:22px;
    align-items:stretch;
}

.website-card{
    position:relative;
    padding:0;
    overflow:hidden;
    border-radius:24px;
    background:transparent;
    border:none;
    box-shadow:none;
}

.large-site{
    grid-row:span 2;
}

.website-frame{
    height:100%;
    overflow:hidden;
    border:1px solid #dfe5ed;
    border-radius:24px;
    background:#ffffff;
    box-shadow:
        0 22px 55px rgba(15,23,42,.10),
        0 8px 18px rgba(15,23,42,.05);
}

.website-bar{
    min-height:46px;
    display:flex;
    align-items:center;
    gap:12px;
    padding:0 14px;
    background:#f7f9fc;
    border-bottom:1px solid #e7ecf2;
}

.website-dots{
    display:flex;
    gap:6px;
}

.website-dots span{
    width:8px;
    height:8px;
    border-radius:50%;
    background:#d3dae4;
}

.website-url{
    flex:1;
    padding:7px 12px;
    border-radius:8px;
    background:#ffffff;
    color:#98a3b3;
    font-size:11px;
    border:1px solid #edf1f5;
}

.website-body{
    padding:16px;
    background:#ffffff;
}

.website-body.compact{
    padding:14px;
}

.mockup-nav{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    padding:4px 2px 14px;
}

.mockup-nav strong{
    font-size:13px;
    letter-spacing:.08em;
}

.mockup-nav span{
    color:#7e8998;
    font-size:10px;
}

.compact-nav strong{
    font-size:12px;
}

.compact-nav span{
    font-size:9px;
}

.mockup-hero{
    position:relative;
    overflow:hidden;
    border-radius:18px;
    min-height:285px;
    display:flex;
    align-items:flex-end;
    padding:22px;
    background-size:cover;
    background-position:center;
}

.compact-hero{
    min-height:165px;
    padding:18px;
}

.mockup-hero:before{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(180deg,
        rgba(15,23,42,.08) 0%,
        rgba(15,23,42,.76) 100%);
}

.mockup-hero-overlay{
    position:relative;
    z-index:2;
    color:#ffffff;
    max-width:420px;
}

.mockup-hero-overlay small{
    display:block;
    color:#ffb38b;
    font-size:10px;
    font-weight:900;
    letter-spacing:.12em;
}

.mockup-hero-overlay h3{
    margin:10px 0 8px;
    color:#ffffff;
    font-size:42px;
    line-height:1.02;
    letter-spacing:-1.8px;
}

.compact-hero .mockup-hero-overlay h3{
    font-size:22px;
    letter-spacing:-.8px;
    margin-bottom:0;
}

.mockup-hero-overlay p{
    margin:0;
    color:#d8e0ea;
    font-size:13px;
    line-height:1.65;
}

.mockup-hero-overlay button{
    margin-top:16px;
    padding:10px 15px;
    border:0;
    border-radius:8px;
    background:#ff6518;
    color:#ffffff;
    font-size:11px;
    font-weight:850;
    box-shadow:0 10px 18px rgba(255,101,24,.24);
}

.contractor-hero{
    background-image:url("/assets/images/contractor.webp");
}

.restaurant-hero{
    background-image:url("/assets/images/restaurant.webp");
}

.salon-hero{
    background-image:url("/assets/images/salon.webp");
}

.real-estate-hero{
    background-image:url("/assets/images/real-estate.webp");
}

.auto-hero{
    background-image:url("/assets/images/auto.webp");
}

.mockup-feature-row{
    display:grid;
    gap:12px;
    margin-top:14px;
}

.mockup-feature-row.three{
    grid-template-columns:repeat(3,1fr);
}

.mockup-feature-row.two{
    grid-template-columns:repeat(2,1fr);
}

.mockup-feature-row div{
    padding:14px;
    border-radius:14px;
    background:#f5f7fb;
    border:1px solid #eef2f6;
}

.mockup-feature-row strong,
.mockup-feature-row span{
    display:block;
}

.mockup-feature-row strong{
    color:#111827;
    font-size:12px;
}

.mockup-feature-row span{
    margin-top:3px;
    color:#7b8796;
    font-size:10px;
    line-height:1.4;
}

.portfolio-section{
    padding-top:100px;
    padding-bottom:68px;
    background:#f7f8fb;
}

.process-section{
    padding-top:72px;
}

@media(max-width:1050px){

    .mockup-portfolio-grid{
        grid-template-columns:1fr 1fr;
    }

    .large-site{
        grid-row:auto;
        grid-column:span 2;
    }

}

@media(max-width:700px){

    .mockup-portfolio-grid{
        grid-template-columns:1fr;
    }

    .large-site{
        grid-column:auto;
    }

    .mockup-hero{
        min-height:230px;
    }

    .compact-hero{
        min-height:185px;
    }

    .mockup-hero-overlay h3{
        font-size:30px;
        letter-spacing:-1.1px;
    }

    .compact-hero .mockup-hero-overlay h3{
        font-size:24px;
    }

    .mockup-feature-row.three,
    .mockup-feature-row.two{
        grid-template-columns:1fr;
    }

    .website-url{
        font-size:10px;
    }

    .mockup-nav{
        flex-direction:column;
        align-items:flex-start;
    }

    .portfolio-section{
        padding-top:78px;
        padding-bottom:50px;
    }

    .process-section{
        padding-top:56px;
    }

}


/* =========================================================
   QAMZU — PORTFOLIO MOCKUP IMAGE ANIMATION
   ========================================================= */

/*
   The portfolio now uses CSS backgrounds instead of <img>.
   Move the actual photo to a separate animated layer so
   only the image zooms while the website text stays sharp.
*/

.contractor-hero{
    --portfolio-image:url("/assets/images/contractor.webp");
    background-image:none;
}

.restaurant-hero{
    --portfolio-image:url("/assets/images/restaurant.webp");
    background-image:none;
}

.salon-hero{
    --portfolio-image:url("/assets/images/salon.webp");
    background-image:none;
}

.real-estate-hero{
    --portfolio-image:url("/assets/images/real-estate.webp");
    background-image:none;
}

.auto-hero{
    --portfolio-image:url("/assets/images/auto.webp");
    background-image:none;
}


/* PHOTO LAYER */

.mockup-hero::after{
    content:"";
    position:absolute;
    inset:-1px;
    z-index:0;

    background-image:var(--portfolio-image);
    background-size:cover;
    background-position:center;

    transform:scale(1);
    transition:
        transform .65s cubic-bezier(.2,.7,.2,1),
        filter .65s ease;
}


/* DARK GRADIENT ABOVE PHOTO */

.mockup-hero::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;

    background:
        linear-gradient(
            180deg,
            rgba(15,23,42,.04) 0%,
            rgba(15,23,42,.18) 38%,
            rgba(15,23,42,.82) 100%
        );

    transition:
        background .55s ease;
}


/* CONTENT STAYS ABOVE IMAGE */

.mockup-hero-overlay{
    position:relative;
    z-index:3;
}


/* IMAGE ZOOM */

.website-card:hover .mockup-hero::after{
    transform:scale(1.08);
}


/* SUBTLE OVERLAY CHANGE */

.website-card:hover .mockup-hero::before{
    background:
        linear-gradient(
            180deg,
            rgba(15,23,42,.02) 0%,
            rgba(15,23,42,.12) 35%,
            rgba(15,23,42,.78) 100%
        );
}


/* WHOLE WEBSITE CARD LIFT */

.website-frame{
    transition:
        transform .35s cubic-bezier(.2,.7,.2,1),
        box-shadow .35s ease,
        border-color .35s ease;
}

.website-card:hover .website-frame{
    transform:translateY(-5px);

    border-color:#d5dce6;

    box-shadow:
        0 30px 70px rgba(15,23,42,.15),
        0 10px 25px rgba(15,23,42,.07);
}


/* BUTTON REACTION */

.mockup-hero-overlay button{
    transition:
        transform .25s ease,
        box-shadow .25s ease,
        background .25s ease;
}

.website-card:hover .mockup-hero-overlay button{
    transform:translateY(-2px);

    box-shadow:
        0 13px 25px rgba(255,101,24,.34);
}


/* ACCESSIBILITY */

@media (prefers-reduced-motion: reduce){

    .mockup-hero::after,
    .website-frame,
    .mockup-hero-overlay button{
        transition:none;
    }

    .website-card:hover .mockup-hero::after{
        transform:none;
    }

    .website-card:hover .website-frame{
        transform:none;
    }

}

/* =========================================================
   QAMZU — $199 COMPLETE PACKAGE HIGHLIGHT
   ========================================================= */

.hero-package{
    max-width:650px;
    margin-top:32px;
    overflow:hidden;
    border:1px solid #e3e8ef;
    border-radius:20px;
    background:#ffffff;
    box-shadow:
        0 18px 45px rgba(15,23,42,.08);
}

.hero-package-price{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    padding:17px 20px;
    background:#111827;
    color:#ffffff;
}

.hero-package-price span{
    font-size:10px;
    font-weight:900;
    letter-spacing:.14em;
    color:#ffad83;
}

.hero-package-price strong{
    font-size:36px;
    line-height:1;
    letter-spacing:-2px;
}

.hero-package-items{
    display:grid;
    grid-template-columns:repeat(3,1fr);
}

.hero-package-items > div{
    display:flex;
    gap:9px;
    padding:18px 14px;
    border-right:1px solid #edf0f4;
}

.hero-package-items > div:last-child{
    border-right:0;
}

.package-feature{
    background:#fff8f4;
}

.package-check{
    flex:0 0 24px;
    width:24px;
    height:24px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#fff0e8;
    color:#ff6518;
    font-size:12px;
    font-weight:900;
}

.hero-package-items strong,
.hero-package-items small{
    display:block;
}

.hero-package-items strong{
    color:#111827;
    font-size:12px;
    line-height:1.25;
}

.hero-package-items small{
    margin-top:4px;
    color:#7a8495;
    font-size:9px;
    line-height:1.35;
}

.hero-package-footer{
    padding:11px 18px;
    border-top:1px solid #edf0f4;
    background:#fafbfc;
    color:#667085;
    text-align:center;
    font-size:11px;
}

.hero-package-footer strong{
    color:#ff6518;
}


/* =========================================================
   PREMIUM PROCESS
   ========================================================= */

.process-section{
    background:#ffffff;
}

.process-premium-grid{
    display:grid;
    grid-template-columns:1fr 55px 1fr 55px 1fr;
    align-items:center;
    gap:0;
}

.process-premium-card{
    position:relative;
    min-height:455px;
    padding:26px;
    overflow:hidden;
    border:1px solid #e4e9f0;
    border-radius:22px;
    background:#ffffff;
    box-shadow:
        0 12px 32px rgba(15,23,42,.055);
    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}

.process-premium-card:hover{
    transform:translateY(-5px);
    border-color:#f2c4ac;
    box-shadow:
        0 24px 50px rgba(15,23,42,.10);
}

.featured-process{
    border-color:#ffc5a8;
}

.process-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.process-premium-card .process-number{
    width:44px;
    height:44px;
    margin:0;
    display:grid;
    place-items:center;
    border-radius:12px;
    background:#111827;
    color:#ffffff;
    font-size:12px;
}

.process-tag{
    color:#ff6518;
    font-size:9px;
    font-weight:900;
    letter-spacing:.13em;
}

.process-visual{
    height:180px;
    margin:25px 0 24px;
    overflow:hidden;
    border-radius:16px;
    background:#f6f8fb;
    border:1px solid #edf0f4;
}


/* STEP 1 */

.process-info{
    padding:25px;
}

.fake-field{
    width:70%;
    height:12px;
    margin-bottom:12px;
    border-radius:999px;
    background:#dce2ea;
}

.fake-field.long{
    width:100%;
}

.fake-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-top:22px;
}

.fake-row span{
    height:42px;
    border-radius:8px;
    background:#e6eaf0;
}

.fake-button{
    width:42%;
    height:30px;
    margin-top:16px;
    border-radius:7px;
    background:#ff6518;
}


/* STEP 2 */

.process-build{
    padding:17px;
    background:
        linear-gradient(
            145deg,
            #192338,
            #111827
        );
}

.mini-browser{
    overflow:hidden;
    height:100%;
    border-radius:11px;
    background:#ffffff;
    box-shadow:
        0 13px 25px rgba(0,0,0,.22);
}

.mini-browser-top{
    display:flex;
    gap:5px;
    padding:9px 10px;
    background:#f2f4f7;
}

.mini-browser-top span{
    width:6px;
    height:6px;
    border-radius:50%;
    background:#c9d0da;
}

.mini-browser-content{
    padding:19px;
}

.mini-browser-content strong{
    font-size:9px;
}

.mini-title{
    width:72%;
    height:18px;
    margin-top:14px;
    border-radius:5px;
    background:#1a2539;
}

.mini-copy{
    width:83%;
    height:5px;
    margin-top:10px;
    border-radius:999px;
    background:#d9dfe7;
}

.mini-copy.short{
    width:55%;
}

.mini-cta{
    width:31%;
    height:22px;
    margin-top:15px;
    border-radius:6px;
    background:#ff6518;
}


/* STEP 3 */

.process-live{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    text-align:center;
    background:
        radial-gradient(
            circle at 50% 40%,
            #fff5ef,
            #f8f9fb 70%
        );
}

.live-circle{
    width:65px;
    height:65px;
    display:grid;
    place-items:center;
    margin-bottom:14px;
    border-radius:50%;
    background:#ff6518;
    color:#ffffff;
    font-size:25px;
    font-weight:900;
    box-shadow:
        0 12px 30px rgba(255,101,24,.25);
}

.process-live strong{
    font-size:15px;
}

.process-live span{
    margin-top:3px;
    color:#22a06b;
    font-size:11px;
    font-weight:800;
}

.process-premium-card h3{
    margin:0 0 9px;
    font-size:21px;
    letter-spacing:-.5px;
}

.process-premium-card > p{
    margin:0;
    color:#667085;
    font-size:14px;
    line-height:1.7;
}

.process-arrow{
    display:grid;
    place-items:center;
    color:#c8cfd9;
    font-size:30px;
}


/* PACKAGE REMINDER */

.process-package-reminder{
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    gap:30px;
    margin-top:32px;
    padding:20px 24px;
    border:1px solid #ffd3bd;
    border-radius:18px;
    background:
        linear-gradient(
            90deg,
            #fff8f4,
            #ffffff
        );
}

.reminder-label{
    display:block;
    color:#a64c20;
    font-size:8px;
    font-weight:900;
    letter-spacing:.14em;
}

.reminder-price{
    display:block;
    color:#111827;
    font-size:36px;
    line-height:1;
    letter-spacing:-2px;
}

.reminder-benefits{
    display:flex;
    flex-wrap:wrap;
    gap:8px 20px;
    color:#465166;
    font-size:12px;
    font-weight:750;
}

.reminder-benefits span:nth-child(2),
.reminder-benefits span:nth-child(3){
    color:#d9520d;
}

.reminder-button{
    min-height:47px;
    padding:0 19px;
}


/* PRICING HIGHLIGHT */

.pricing-includes .included-highlight{
    padding:9px 11px;
    margin:-3px -6px;
    border-radius:9px;
    background:#fff2ea;
    color:#b8450e;
}

.pricing-includes .included-highlight strong{
    color:#b8450e;
}


/* MOBILE */

@media(max-width:1000px){

    .hero-package-items{
        grid-template-columns:1fr;
    }

    .hero-package-items > div{
        border-right:0;
        border-bottom:1px solid #edf0f4;
    }

    .hero-package-items > div:last-child{
        border-bottom:0;
    }

    .process-premium-grid{
        grid-template-columns:1fr;
        gap:18px;
    }

    .process-arrow{
        transform:rotate(90deg);
        height:30px;
    }

    .process-package-reminder{
        grid-template-columns:1fr;
        text-align:center;
    }

    .reminder-benefits{
        justify-content:center;
    }

    .reminder-button{
        width:100%;
    }

}


@media(max-width:620px){

    .hero-package-price{
        padding:15px 17px;
    }

    .hero-package-price strong{
        font-size:32px;
    }

    .process-premium-card{
        min-height:auto;
    }

    .process-visual{
        height:175px;
    }

    .process-package-reminder{
        padding:20px;
    }

    .reminder-benefits{
        display:grid;
        gap:7px;
    }

}


/* =========================================================
   LEAD FORM SECURITY
   ========================================================= */

.form-honeypot{
    position:absolute !important;
    left:-10000px !important;
    top:auto !important;
    width:1px !important;
    height:1px !important;
    overflow:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
}

.lead-form button:disabled{
    opacity:.65;
    cursor:wait;
}


/* =========================================================
   QAMZU — COOKIE / PRIVACY CONSENT
   ========================================================= */

.cookie-banner{
    position:fixed;
    z-index:5000;
    left:20px;
    right:20px;
    bottom:20px;

    opacity:0;
    visibility:hidden;
    transform:translateY(25px);

    transition:
        opacity .3s ease,
        transform .3s ease,
        visibility .3s ease;
}

.cookie-banner.show{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}

.cookie-banner-inner{
    width:min(1180px,100%);
    margin:auto;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;

    padding:22px;

    border:1px solid #dfe4ec;
    border-radius:20px;

    background:rgba(255,255,255,.98);

    box-shadow:
        0 24px 65px rgba(15,23,42,.20);

    backdrop-filter:blur(18px);
}

.cookie-banner-copy{
    display:flex;
    align-items:flex-start;
    gap:15px;
    max-width:700px;
}

.cookie-icon{
    flex:0 0 42px;

    width:42px;
    height:42px;

    display:grid;
    place-items:center;

    border-radius:12px;

    background:#ff6518;
    color:#fff;

    font-weight:900;
}

.cookie-banner-copy strong{
    display:block;
    margin-bottom:3px;

    color:#111827;
    font-size:15px;
}

.cookie-banner-copy p{
    margin:0;

    color:#667085;
    font-size:12px;
    line-height:1.6;
}

.cookie-policy-links{
    display:flex;
    gap:15px;
    margin-top:7px;
}

.cookie-policy-links a{
    color:#475467;
    font-size:11px;
    font-weight:750;
    text-decoration:underline;
}

.cookie-actions{
    display:flex;
    align-items:center;
    gap:9px;

    flex-shrink:0;
}

.cookie-button{
    min-height:43px;

    padding:0 15px;

    border-radius:9px;
    border:1px solid transparent;

    cursor:pointer;

    font-size:11px;
    font-weight:850;
}

.cookie-manage{
    background:#fff;
    color:#344054;
    border-color:#d9dee7;
}

.cookie-reject{
    background:#f2f4f7;
    color:#344054;
}

.cookie-accept{
    background:#ff6518;
    color:#fff;
}

.cookie-accept:hover{
    background:#e94f00;
}


/* PREFERENCE MODAL */

.cookie-preferences-overlay{
    position:fixed;
    z-index:5100;
    inset:0;

    display:grid;
    place-items:center;

    padding:20px;

    background:rgba(12,19,32,.58);

    opacity:0;
    visibility:hidden;

    transition:
        opacity .2s ease,
        visibility .2s ease;
}

.cookie-preferences-overlay.show{
    opacity:1;
    visibility:visible;
}

.cookie-preferences-card{
    width:min(610px,100%);
    max-height:90vh;
    overflow:auto;

    border-radius:22px;

    background:#fff;

    box-shadow:
        0 30px 90px rgba(0,0,0,.30);
}

.cookie-preferences-header{
    padding:27px 28px 19px;

    border-bottom:1px solid #e7ebf1;
}

.cookie-modal-label{
    color:#ff6518;

    font-size:9px;
    font-weight:900;

    letter-spacing:.14em;
}

.cookie-preferences-header h2{
    margin:5px 0 0;

    font-size:29px;
    letter-spacing:-1px;
}

.cookie-preference-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;

    padding:22px 28px;

    border-bottom:1px solid #edf0f4;
}

.cookie-preference-row strong{
    display:block;

    color:#111827;
    font-size:14px;
}

.cookie-preference-row p{
    max-width:410px;

    margin:4px 0 0;

    color:#667085;
    font-size:11px;
    line-height:1.55;
}

.cookie-always-on{
    white-space:nowrap;

    color:#22a06b;

    font-size:10px;
    font-weight:850;
}


/* SWITCH */

.cookie-switch{
    position:relative;

    width:46px;
    height:26px;

    flex:0 0 46px;
}

.cookie-switch input{
    opacity:0;
    width:0;
    height:0;
}

.cookie-switch span{
    position:absolute;
    inset:0;

    border-radius:999px;

    background:#d7dce4;

    cursor:pointer;

    transition:.2s;
}

.cookie-switch span:before{
    content:"";

    position:absolute;

    width:20px;
    height:20px;

    left:3px;
    top:3px;

    border-radius:50%;

    background:#fff;

    box-shadow:
        0 2px 7px rgba(0,0,0,.18);

    transition:.2s;
}

.cookie-switch input:checked + span{
    background:#ff6518;
}

.cookie-switch input:checked + span:before{
    transform:translateX(20px);
}

.cookie-modal-actions{
    display:flex;
    justify-content:flex-end;
    gap:10px;

    padding:20px 28px 26px;
}


/* LEGAL FOOTER */

.legal-links{
    display:flex;
    flex-wrap:wrap;
    gap:18px;

    margin-top:35px;

    color:#8b95a5;
    font-size:11px;
}

.legal-links a:hover{
    color:#fff;
}


/* MOBILE */

@media(max-width:800px){

    .cookie-banner{
        left:12px;
        right:12px;
        bottom:12px;
    }

    .cookie-banner-inner{
        display:block;

        padding:19px;
    }

    .cookie-actions{
        display:grid;
        grid-template-columns:1fr;

        margin-top:16px;
    }

    .cookie-button{
        width:100%;
    }

    .cookie-preference-row{
        align-items:flex-start;

        padding:20px;
    }

    .cookie-preferences-header{
        padding:23px 20px 17px;
    }

    .cookie-modal-actions{
        display:grid;

        padding:17px 20px 22px;
    }

}

/* =========================================================
   QAMZU — COMPACT COOKIE BANNER
   ========================================================= */

.cookie-banner{
    left:24px;
    right:24px;
    bottom:18px;
}

.cookie-banner-inner{
    width:min(1120px,100%);
    padding:16px 18px;
    gap:22px;
    border-radius:17px;
}

.cookie-banner-copy{
    gap:12px;
    max-width:690px;
}

.cookie-icon{
    flex:0 0 38px;
    width:38px;
    height:38px;
    border-radius:10px;
    font-size:13px;
}

.cookie-banner-copy strong{
    font-size:14px;
}

.cookie-banner-copy p{
    font-size:11px;
    line-height:1.5;
}

.cookie-policy-links{
    margin-top:5px;
}

.cookie-policy-links a{
    font-size:10px;
}

.cookie-actions{
    gap:7px;
}

.cookie-button{
    min-height:40px;
    padding:0 13px;
    font-size:10px;
}

@media(max-width:900px){

    .cookie-banner-inner{
        display:block;
    }

    .cookie-actions{
        display:grid;
        grid-template-columns:repeat(3,1fr);
        margin-top:14px;
    }

}

@media(max-width:620px){

    .cookie-banner{
        left:10px;
        right:10px;
        bottom:82px;
    }

    .cookie-banner-inner{
        padding:16px;
    }

    .cookie-actions{
        grid-template-columns:1fr;
    }

}

/* =========================================================
   QAMZU — LARGE PORTFOLIO CARD WHITESPACE FIX
   ========================================================= */

.large-site .website-body{
    display:flex;
    flex-direction:column;
    min-height:calc(100% - 46px);
}

.large-site .mockup-hero{
    min-height:300px;
}

.large-site .mockup-bottom-band{
    display:grid;
    grid-template-columns:1.25fr .95fr;
    gap:12px;
    margin-top:14px;
}

.mockup-proof-card,
.mockup-contact-card{
    padding:16px;
    border-radius:16px;
    background:#f5f7fb;
    border:1px solid #e9eef4;
}

.proof-label{
    display:block;
    margin-bottom:10px;
    color:#ff6518;
    font-size:9px;
    font-weight:900;
    letter-spacing:.13em;
}

.mockup-proof-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
}

.mockup-proof-grid div{
    padding:12px 10px;
    border-radius:12px;
    background:#ffffff;
    border:1px solid #eef2f6;
}

.mockup-proof-grid strong,
.mockup-proof-grid span{
    display:block;
}

.mockup-proof-grid strong{
    color:#111827;
    font-size:12px;
}

.mockup-proof-grid span{
    margin-top:4px;
    color:#7b8796;
    font-size:10px;
    line-height:1.35;
}

.mockup-contact-card{
    display:flex;
    flex-direction:column;
    justify-content:center;
    background:
        linear-gradient(
            135deg,
            #111827 0%,
            #1a2740 100%
        );
    border-color:#1f2d47;
}

.mockup-contact-card strong{
    display:block;
    margin:2px 0 6px;
    color:#ffffff;
    font-size:24px;
    letter-spacing:-.8px;
}

.mockup-contact-card span:last-child{
    color:#cbd5e1;
    font-size:11px;
    line-height:1.55;
}

.large-site .mockup-contact-card .proof-label{
    color:#ffb38b;
}

@media(max-width:1050px){

    .large-site .mockup-bottom-band{
        grid-template-columns:1fr;
    }

}

@media(max-width:700px){

    .large-site .mockup-hero{
        min-height:240px;
    }

    .mockup-proof-grid{
        grid-template-columns:1fr;
    }

}

/* =========================================================
   QAMZU — PORTFOLIO CONVERSION PANEL
   ========================================================= */

.mockup-conversion-card{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:18px;
    border-radius:16px;
    background:
        linear-gradient(
            135deg,
            #111827 0%,
            #1a2740 100%
        );
    border:1px solid #1f2d47;
}

.mockup-conversion-card .proof-label{
    color:#ffb38b;
}

.mockup-conversion-card strong{
    display:block;
    margin:2px 0 7px;
    color:#ffffff;
    font-size:19px;
    line-height:1.15;
    letter-spacing:-.5px;
}

.mockup-conversion-card > span:last-of-type{
    color:#cbd5e1;
    font-size:10px;
    line-height:1.5;
}

.conversion-bars{
    display:grid;
    gap:6px;
    margin-top:14px;
}

.conversion-bars span{
    display:block;
    height:5px;
    border-radius:999px;
    background:rgba(255,255,255,.18);
}

.conversion-bars span:nth-child(1){
    width:100%;
}

.conversion-bars span:nth-child(2){
    width:72%;
}

.conversion-bars span:nth-child(3){
    width:45%;
    background:#ff6518;
}



/* =========================================================
   QAMZU — HOMEPAGE SERVICE NAVIGATION V2
   ========================================================= */

.nav-services{
    position:relative;
}

.nav-services-button{
    display:flex;
    align-items:center;
    gap:5px;

    border:0;
    padding:0;

    background:transparent;
    color:#111827;

    cursor:pointer;

    font:inherit;
    font-size:13px;
    font-weight:800;
}

.nav-services-button span{
    font-size:11px;
    transition:transform .2s ease;
}

.nav-services.open .nav-services-button span{
    transform:rotate(180deg);
}

.nav-services-menu{
    position:absolute;
    z-index:3000;

    top:calc(100% + 20px);
    left:50%;

    width:510px;

    display:grid;
    grid-template-columns:1fr 1fr;
    gap:7px;

    padding:12px;

    border:1px solid #e4e8ef;
    border-radius:18px;

    background:#fff;

    box-shadow:
        0 28px 75px rgba(15,23,42,.17);

    opacity:0;
    visibility:hidden;

    transform:translate(-50%,8px);

    transition:
        opacity .18s ease,
        transform .18s ease,
        visibility .18s ease;
}

.nav-services.open .nav-services-menu,
.nav-services:hover .nav-services-menu{
    opacity:1;
    visibility:visible;
    transform:translate(-50%,0);
}

.nav-services-menu a{
    display:block;

    padding:15px;

    border-radius:12px;

    text-decoration:none;

    transition:
        background .18s ease,
        transform .18s ease;
}

.nav-services-menu a:hover{
    background:#f6f8fb;
    transform:translateY(-1px);
}

.nav-services-menu strong{
    display:block;
    color:#111827;
    font-size:12px;
}

.nav-services-menu span{
    display:block;

    margin-top:4px;

    color:#7b8797;

    font-size:9px;
    line-height:1.45;
}


/* =========================================================
   QAMZU — WHAT WE BUILD
   ========================================================= */

.what-we-build{
    padding:100px 0;

    background:
        radial-gradient(
            circle at 90% 10%,
            rgba(255,101,24,.06),
            transparent 25%
        ),
        #f8fafc;
}

.what-we-build-heading{
    max-width:850px;
}

.what-we-build-eyebrow{
    color:#ff6518;

    font-size:10px;
    font-weight:900;
    letter-spacing:.14em;
}

.what-we-build-heading h2{
    margin:10px 0 15px;

    color:#111827;

    font-size:clamp(38px,4.5vw,57px);
    line-height:1.04;
    letter-spacing:-2.2px;
}

.what-we-build-heading h2 span{
    display:block;
    color:#ff6518;
}

.what-we-build-heading p{
    max-width:760px;

    margin:0;

    color:#667085;

    font-size:16px;
    line-height:1.75;
}

.what-we-build-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;

    margin-top:42px;
}

.build-service-card{
    position:relative;

    min-height:260px;

    padding:28px;

    overflow:hidden;

    border:1px solid #e4e9ef;
    border-radius:20px;

    background:#fff;

    text-decoration:none;

    box-shadow:
        0 10px 35px rgba(15,23,42,.04);

    transition:
        transform .22s ease,
        box-shadow .22s ease,
        border-color .22s ease;
}

.build-service-card:after{
    content:"";

    position:absolute;

    width:150px;
    height:150px;

    right:-55px;
    bottom:-65px;

    border-radius:50%;

    background:rgba(255,101,24,.06);

    transition:transform .25s ease;
}

.build-service-card:hover{
    transform:translateY(-6px);

    border-color:#ffc8ad;

    box-shadow:
        0 25px 60px rgba(15,23,42,.10);
}

.build-service-card:hover:after{
    transform:scale(1.35);
}

.build-service-number{
    width:44px;
    height:44px;

    display:grid;
    place-items:center;

    margin-bottom:27px;

    border-radius:12px;

    background:#fff1ea;
    color:#ff6518;

    font-size:10px;
    font-weight:900;
}

.build-service-card h3{
    margin:0 0 10px;

    color:#111827;

    font-size:19px;
    letter-spacing:-.4px;
}

.build-service-card p{
    margin:0;

    max-width:310px;

    color:#667085;

    font-size:12px;
    line-height:1.7;
}

.build-service-card > span{
    position:absolute;

    z-index:2;

    left:28px;
    bottom:25px;

    color:#ff6518;

    font-size:10px;
    font-weight:850;
}


@media(max-width:1000px){

    .what-we-build-grid{
        grid-template-columns:repeat(2,1fr);
    }

}


@media(max-width:760px){

    .nav-services{
        width:100%;
    }

    .nav-services-button{
        width:100%;
        justify-content:space-between;
    }

    .nav-services-menu{
        position:static;

        width:100%;

        display:none;
        grid-template-columns:1fr;

        margin-top:10px;

        opacity:1;
        visibility:visible;
        transform:none;

        box-shadow:none;
    }

    .nav-services.open .nav-services-menu{
        display:grid;
        transform:none;
    }

}


@media(max-width:620px){

    .what-we-build{
        padding:72px 0;
    }

    .what-we-build-grid{
        grid-template-columns:1fr;
    }

}


/* =========================================================
   QAMZU HOMEPAGE CAPABILITY SYSTEM
   ========================================================= */

.qamzu-capabilities{
    position:relative;
    padding:105px 0;
    overflow:hidden;
    background:
        radial-gradient(
            circle at 90% 10%,
            rgba(255,101,24,.09),
            transparent 25%
        ),
        linear-gradient(
            180deg,
            #f7f9fc 0%,
            #ffffff 42%,
            #f8fafc 100%
        );
}

.qamzu-cap-shell{
    width:min(1180px,calc(100% - 40px));
    margin:0 auto;
}

.qamzu-cap-heading{
    max-width:790px;
    margin-bottom:50px;
}

.qamzu-cap-eyebrow{
    display:inline-flex;
    align-items:center;
    padding:7px 11px;
    border-radius:999px;
    background:#fff0e8;
    color:#e6560e;
    font-size:10px;
    font-weight:900;
    letter-spacing:.12em;
}

.qamzu-cap-heading h2{
    margin:17px 0 17px;
    color:#101828;
    font-size:clamp(42px,5vw,65px);
    line-height:1.01;
    letter-spacing:-3px;
}

.qamzu-cap-heading h2 em{
    color:#ff6518;
    font-style:normal;
}

.qamzu-cap-heading p{
    max-width:720px;
    margin:0;
    color:#667085;
    font-size:16px;
    line-height:1.8;
}


/* TWO PRIMARY PATHS */

.qamzu-path-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:22px;
    margin-bottom:70px;
}

.qamzu-path-card{
    position:relative;
    overflow:hidden;
    padding:38px;
    border:1px solid #e3e8ef;
    border-radius:25px;
    background:#fff;
    box-shadow:
        0 18px 55px rgba(15,23,42,.07);
}

.qamzu-path-starter{
    background:
        radial-gradient(
            circle at 100% 0,
            rgba(255,101,24,.12),
            transparent 35%
        ),
        #fff;
}

.qamzu-path-custom{
    border-color:#263244;
    background:
        radial-gradient(
            circle at 100% 0,
            rgba(255,101,24,.18),
            transparent 35%
        ),
        #111827;
}

.qamzu-path-label{
    display:inline-flex;
    padding:6px 9px;
    border-radius:7px;
    background:#fff1e9;
    color:#dc500d;
    font-size:9px;
    font-weight:900;
    letter-spacing:.11em;
}

.qamzu-path-custom .qamzu-path-label{
    background:rgba(255,101,24,.13);
    color:#ff9a66;
}

.qamzu-path-price{
    display:flex;
    align-items:flex-end;
    gap:7px;
    margin:25px 0 10px;
}

.qamzu-path-price span{
    margin-bottom:8px;
    color:#98a2b3;
    font-size:11px;
    font-weight:700;
}

.qamzu-path-price strong{
    color:#111827;
    font-size:54px;
    line-height:1;
    letter-spacing:-3px;
}

.qamzu-custom-icon{
    display:grid;
    place-items:center;
    width:54px;
    height:54px;
    margin:25px 0 15px;
    border-radius:15px;
    background:#ff6518;
    color:#fff;
    font-size:25px;
    font-weight:950;
}

.qamzu-path-card h3{
    max-width:490px;
    margin:15px 0 13px;
    color:#111827;
    font-size:27px;
    line-height:1.15;
    letter-spacing:-1px;
}

.qamzu-path-custom h3{
    color:#fff;
}

.qamzu-path-card > p{
    max-width:540px;
    margin:0;
    color:#667085;
    font-size:13px;
    line-height:1.75;
}

.qamzu-path-custom > p{
    color:#aab4c3;
}

.qamzu-path-card ul{
    display:grid;
    gap:10px;
    margin:24px 0 29px;
    padding:0;
    list-style:none;
}

.qamzu-path-card li{
    color:#475467;
    font-size:12px;
    font-weight:700;
}

.qamzu-path-custom li{
    color:#d0d5dd;
}

.qamzu-path-card li:before{
    content:"✓";
    margin-right:9px;
    color:#ff6518;
    font-weight:950;
}

.qamzu-path-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:47px;
    padding:0 18px;
    border-radius:10px;
    text-decoration:none;
    font-size:11px;
    font-weight:900;
    transition:
        transform .15s ease,
        box-shadow .15s ease;
}

.qamzu-path-button:hover{
    transform:translateY(-1px);
}

.qamzu-path-primary{
    background:#ff6518;
    color:#fff;
    box-shadow:
        0 10px 25px rgba(255,101,24,.22);
}

.qamzu-path-secondary{
    border:1px solid #3c4657;
    background:#1d2939;
    color:#fff;
}


/* SIX CAPABILITY CARDS */

.qamzu-cap-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;
}

.qamzu-cap-card{
    display:block;
    padding:27px;
    border:1px solid #e3e8ef;
    border-radius:18px;
    background:#fff;
    color:inherit;
    text-decoration:none;
    box-shadow:
        0 12px 35px rgba(15,23,42,.045);
    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.qamzu-cap-card:hover{
    transform:translateY(-4px);
    border-color:#ffd0b8;
    box-shadow:
        0 20px 45px rgba(15,23,42,.09);
}

.qamzu-cap-icon{
    display:grid;
    place-items:center;
    width:39px;
    height:39px;
    margin-bottom:22px;
    border-radius:11px;
    background:#fff0e8;
    color:#ff6518;
    font-size:10px;
    font-weight:950;
}

.qamzu-cap-card h3{
    margin:0 0 10px;
    color:#101828;
    font-size:19px;
    letter-spacing:-.5px;
}

.qamzu-cap-card p{
    min-height:68px;
    margin:0 0 20px;
    color:#667085;
    font-size:12px;
    line-height:1.7;
}

.qamzu-cap-card span{
    color:#e6560e;
    font-size:10px;
    font-weight:900;
}


/* GROWTH SYSTEM */

.qamzu-growth{
    margin-top:70px;
    padding:45px;
    border-radius:27px;
    background:
        radial-gradient(
            circle at 100% 0,
            rgba(255,101,24,.15),
            transparent 30%
        ),
        #111827;
    box-shadow:
        0 30px 75px rgba(15,23,42,.13);
}

.qamzu-growth-heading{
    max-width:710px;
}

.qamzu-growth-heading > span{
    color:#ff8d52;
    font-size:9px;
    font-weight:900;
    letter-spacing:.13em;
}

.qamzu-growth-heading h2{
    margin:11px 0 0;
    color:#fff;
    font-size:37px;
    line-height:1.1;
    letter-spacing:-1.5px;
}

.qamzu-growth-track{
    display:grid;
    grid-template-columns:
        1fr auto
        1fr auto
        1fr auto
        1fr auto
        1fr auto
        1fr;
    gap:9px;
    align-items:center;
    margin:39px 0;
}

.qamzu-growth-track div{
    min-height:88px;
    padding:15px;
    border:1px solid #344054;
    border-radius:13px;
    background:#182230;
}

.qamzu-growth-track strong{
    display:block;
    margin-bottom:14px;
    color:#ff7a36;
    font-size:9px;
}

.qamzu-growth-track span{
    color:#fff;
    font-size:11px;
    font-weight:800;
}

.qamzu-growth-track i{
    color:#667085;
    font-style:normal;
}

.qamzu-growth-bottom{
    display:flex;
    justify-content:space-between;
    gap:40px;
    align-items:flex-end;
    padding-top:30px;
    border-top:1px solid #344054;
}

.qamzu-growth-bottom > div{
    max-width:680px;
}

.qamzu-growth-bottom h3{
    margin:0 0 10px;
    color:#fff;
    font-size:21px;
    line-height:1.35;
}

.qamzu-growth-bottom p{
    margin:0;
    color:#98a2b3;
    font-size:12px;
    line-height:1.75;
}

.qamzu-growth-button{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    min-height:48px;
    padding:0 18px;
    border-radius:10px;
    background:#ff6518;
    color:#fff;
    text-decoration:none;
    font-size:11px;
    font-weight:900;
}


/* RESPONSIVE */

@media(max-width:980px){

    .qamzu-path-grid{
        grid-template-columns:1fr;
    }

    .qamzu-cap-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .qamzu-growth-track{
        grid-template-columns:1fr 1fr;
    }

    .qamzu-growth-track i{
        display:none;
    }

}

@media(max-width:680px){

    .qamzu-capabilities{
        padding:72px 0;
    }

    .qamzu-cap-shell{
        width:min(100% - 28px,1180px);
    }

    .qamzu-cap-heading h2{
        font-size:40px;
        letter-spacing:-2px;
    }

    .qamzu-path-card{
        padding:27px 22px;
    }

    .qamzu-cap-grid{
        grid-template-columns:1fr;
    }

    .qamzu-cap-card p{
        min-height:0;
    }

    .qamzu-growth{
        padding:28px 21px;
    }

    .qamzu-growth-heading h2{
        font-size:30px;
    }

    .qamzu-growth-track{
        grid-template-columns:1fr 1fr;
    }

    .qamzu-growth-bottom{
        display:block;
    }

    .qamzu-growth-button{
        margin-top:24px;
    }

}


/* =========================================================
   QAMZU SAFE PROCESS IMAGE STYLES
   ========================================================= */

.process-image-visual{
    padding:0 !important;
    overflow:hidden !important;
    background:#f7f9fc !important;
}

.process-image-visual img{
    width:100%;
    height:100%;
    min-height:168px;
    display:block;
    object-fit:cover;
    object-position:center;
    border-radius:inherit;
    transition:transform .3s ease;
}

.process-premium-card:hover .process-image-visual img{
    transform:scale(1.025);
}

@media(max-width:900px){

    .process-image-visual img{
        min-height:190px;
    }

}

@media(max-width:600px){

    .process-image-visual img{
        min-height:175px;
    }

}


/* =========================================================
   QAMZU FINAL MULTI PRODUCT HERO
   ========================================================= */

.qh-hero{
    position:relative;
    overflow:hidden;
    padding:82px 0 100px;
    background:
        radial-gradient(circle at 88% 13%,rgba(255,101,24,.11),transparent 27%),
        linear-gradient(180deg,#fff 0%,#fafbfd 100%);
}

.qh-shell{
    width:min(1180px,calc(100% - 40px));
    margin:0 auto;
}

.qh-grid{
    display:grid;
    grid-template-columns:minmax(0,.92fr) minmax(520px,1.08fr);
    gap:65px;
    align-items:center;
}

.qh-eyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 12px;
    border:1px solid #ffd9c6;
    border-radius:999px;
    background:#fff5ef;
    color:#dd550f;
    font-size:9px;
    font-weight:900;
    letter-spacing:.1em;
}

.qh-eyebrow span{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#ff6518;
    box-shadow:0 0 0 4px rgba(255,101,24,.10);
}

.qh-copy h1{
    margin:22px 0 22px;
    max-width:650px;
    color:#111827;
    font-size:clamp(52px,5.8vw,78px);
    line-height:.96;
    letter-spacing:-4px;
}

.qh-copy h1 em{
    display:block;
    color:#ff6518;
    font-style:normal;
}

.qh-intro{
    max-width:610px;
    margin:0;
    color:#667085;
    font-size:16px;
    line-height:1.8;
}

.qh-intro strong{
    color:#111827;
}

.qh-actions{
    display:flex;
    flex-wrap:wrap;
    gap:11px;
    margin-top:30px;
}

.qh-primary,
.qh-secondary{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:52px;
    padding:0 20px;
    border-radius:11px;
    text-decoration:none;
    font-size:12px;
    font-weight:900;
    transition:.16s ease;
}

.qh-primary{
    gap:14px;
    background:#ff6518;
    color:#fff;
    box-shadow:0 13px 30px rgba(255,101,24,.25);
}

.qh-secondary{
    border:1px solid #dce2e9;
    background:#fff;
    color:#344054;
}

.qh-primary:hover,
.qh-secondary:hover{
    transform:translateY(-2px);
}

.qh-trust{
    display:flex;
    flex-wrap:wrap;
    gap:18px;
    margin-top:26px;
}

.qh-trust div{
    display:flex;
    align-items:center;
    gap:7px;
    color:#475467;
    font-size:10px;
    font-weight:700;
}

.qh-trust span{
    display:grid;
    place-items:center;
    width:19px;
    height:19px;
    border-radius:50%;
    background:#fff0e8;
    color:#ff6518;
    font-size:9px;
    font-weight:950;
}

.qh-offer{
    display:flex;
    align-items:center;
    gap:17px;
    width:max-content;
    max-width:100%;
    margin-top:27px;
    padding:12px 16px;
    border:1px solid #e3e8ef;
    border-radius:13px;
    background:#fff;
    box-shadow:0 8px 25px rgba(15,23,42,.05);
}

.qh-offer > div{
    display:flex;
    align-items:center;
    gap:9px;
}

.qh-offer small{
    color:#98a2b3;
    font-size:7px;
    font-weight:900;
}

.qh-offer strong{
    color:#ff6518;
    font-size:20px;
}

.qh-offer p{
    margin:0;
    padding-left:16px;
    border-left:1px solid #e5e9ef;
    color:#667085;
    font-size:9px;
}


/* VISUAL */

.qh-visual{
    position:relative;
    min-height:610px;
}

.qh-circle{
    position:absolute;
    border-radius:50%;
}

.qh-circle-one{
    width:470px;
    height:470px;
    top:40px;
    right:20px;
    border:1px solid rgba(255,101,24,.12);
}

.qh-circle-two{
    width:350px;
    height:350px;
    top:100px;
    right:80px;
    border:1px dashed rgba(17,24,39,.10);
}


/* WEBSITE */

.qh-browser{
    position:absolute;
    z-index:2;
    top:35px;
    left:5px;
    width:510px;
    overflow:hidden;
    border:1px solid #dce2e9;
    border-radius:21px;
    background:#fff;
    box-shadow:0 35px 85px rgba(15,23,42,.16);
    transform:rotate(-1.2deg);
}

.qh-browser-bar{
    display:flex;
    align-items:center;
    gap:12px;
    height:42px;
    padding:0 13px;
    border-bottom:1px solid #edf0f4;
    background:#f8fafc;
}

.qh-browser-dots{
    display:flex;
    gap:5px;
}

.qh-browser-dots i{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#d0d5dd;
}

.qh-browser-dots i:first-child{
    background:#ff8c68;
}

.qh-browser-url{
    flex:1;
    padding:7px 10px;
    border:1px solid #edf0f4;
    border-radius:7px;
    background:#fff;
    color:#98a2b3;
    font-size:8px;
}

.qh-site{
    padding:16px;
}

.qh-site-nav{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding-bottom:14px;
}

.qh-site-nav strong{
    font-size:9px;
    color:#111827;
}

.qh-site-nav span{
    color:#98a2b3;
    font-size:7px;
}

.qh-site-body{
    display:grid;
    grid-template-columns:1.12fr .88fr;
    min-height:245px;
    overflow:hidden;
    border-radius:13px;
    background:#111827;
}

.qh-site-copy{
    padding:27px 23px;
}

.qh-site-copy small{
    color:#ff985f;
    font-size:7px;
    font-weight:900;
}

.qh-site-copy h3{
    margin:10px 0;
    color:#fff;
    font-size:24px;
    line-height:1.06;
}

.qh-site-copy p{
    color:#aab4c3;
    font-size:8px;
    line-height:1.6;
}

.qh-site-copy button{
    margin-top:13px;
    padding:8px 11px;
    border:0;
    border-radius:7px;
    background:#ff6518;
    color:#fff;
    font-size:7px;
    font-weight:900;
}

.qh-site-art{
    display:grid;
    place-items:end center;
    padding-top:24px;
    background:linear-gradient(145deg,#354154,#1b2534);
}

.qh-art-card{
    display:flex;
    align-items:flex-end;
    justify-content:center;
    gap:5px;
    width:145px;
    height:180px;
    padding:14px 13px 0;
    border-radius:75px 75px 0 0;
    background:#f5f7fa;
}

.qh-art-card span{
    width:24px;
    border-radius:4px 4px 0 0;
    background:#ff6518;
}

.qh-art-card span:nth-child(1){height:70px}
.qh-art-card span:nth-child(2){height:112px}
.qh-art-card span:nth-child(3){height:88px}


/* DASHBOARD */

.qh-dashboard{
    position:absolute;
    z-index:4;
    left:55px;
    bottom:38px;
    display:grid;
    grid-template-columns:100px 1fr;
    width:390px;
    min-height:205px;
    overflow:hidden;
    border:1px solid #dce2e9;
    border-radius:18px;
    background:#fff;
    box-shadow:0 28px 65px rgba(15,23,42,.19);
    transform:rotate(1deg);
}

.qh-dash-side{
    display:flex;
    flex-direction:column;
    gap:6px;
    padding:14px 10px;
    background:#111827;
}

.qh-dash-q{
    display:grid;
    place-items:center;
    width:29px;
    height:29px;
    margin-bottom:10px;
    border-radius:8px;
    background:#ff6518;
    color:#fff;
    font-weight:950;
}

.qh-dash-side span{
    padding:7px 8px;
    border-radius:6px;
    color:#98a2b3;
    font-size:7px;
}

.qh-dash-side span.active{
    background:#ff6518;
    color:#fff;
}

.qh-dash-content{
    padding:15px;
}

.qh-dash-title{
    display:flex;
    justify-content:space-between;
}

.qh-dash-title small{
    display:block;
    color:#98a2b3;
    font-size:6px;
    font-weight:900;
}

.qh-dash-title strong{
    display:block;
    margin-top:3px;
    color:#111827;
    font-size:11px;
}

.qh-dash-title b{
    height:max-content;
    padding:5px 7px;
    border-radius:999px;
    background:#fff0e8;
    color:#df570f;
    font-size:6px;
}

.qh-stats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:6px;
    margin-top:12px;
}

.qh-stats div{
    padding:8px;
    border-radius:7px;
    background:#f6f8fb;
}

.qh-stats small{
    display:block;
    color:#98a2b3;
    font-size:5px;
}

.qh-stats strong{
    display:block;
    margin-top:3px;
    color:#111827;
    font-size:11px;
}

.qh-bars{
    display:flex;
    align-items:flex-end;
    gap:5px;
    height:66px;
    margin-top:12px;
    padding:8px 8px 0;
    border-radius:7px;
    background:#fafbfc;
}

.qh-bars i{
    flex:1;
    min-height:8px;
    border-radius:3px 3px 0 0;
    background:#ffb48e;
}

.qh-bars i:nth-last-child(-n+3){
    background:#ff6518;
}


/* MOBILE */

.qh-phone{
    position:absolute;
    z-index:6;
    right:0;
    bottom:10px;
    width:145px;
    height:300px;
    padding:7px;
    border:2px solid #202939;
    border-radius:27px;
    background:#111827;
    box-shadow:0 30px 70px rgba(15,23,42,.24);
    transform:rotate(4deg);
}

.qh-notch{
    position:absolute;
    top:7px;
    left:50%;
    width:56px;
    height:13px;
    border-radius:0 0 10px 10px;
    background:#111827;
    transform:translateX(-50%);
}

.qh-phone-screen{
    height:100%;
    box-sizing:border-box;
    padding:25px 12px 12px;
    border-radius:19px;
    background:#fff;
}

.qh-phone-q{
    display:grid;
    place-items:center;
    width:30px;
    height:30px;
    margin-bottom:23px;
    border-radius:9px;
    background:#ff6518;
    color:#fff;
    font-weight:950;
}

.qh-phone-screen > small{
    display:block;
    color:#ff6518;
    font-size:6px;
    font-weight:900;
}

.qh-phone-screen > strong{
    display:block;
    margin-top:5px;
    color:#111827;
    font-size:14px;
    line-height:1.15;
}

.qh-mobile-stat{
    margin:14px 0 11px;
    padding:10px;
    border-radius:9px;
    background:#111827;
}

.qh-mobile-stat span{
    display:block;
    color:#ff955f;
    font-size:5px;
    font-weight:900;
}

.qh-mobile-stat b{
    display:block;
    margin-top:5px;
    color:#fff;
    font-size:11px;
}

.qh-mobile-row{
    display:flex;
    gap:7px;
    align-items:center;
    margin-top:8px;
    padding:7px;
    border-radius:7px;
    background:#f6f8fa;
}

.qh-mobile-row i{
    width:20px;
    height:20px;
    border-radius:6px;
    background:#ffd5c1;
}

.qh-mobile-row div{
    flex:1;
}

.qh-mobile-row span{
    display:block;
    height:4px;
    margin:3px 0;
    border-radius:999px;
    background:#dfe4ea;
}

.qh-mobile-row span:last-child{
    width:65%;
}


/* FLOATING LABELS */

.qh-badge{
    position:absolute;
    z-index:9;
    display:flex;
    gap:9px;
    align-items:center;
    padding:10px 12px;
    border:1px solid #e3e8ef;
    border-radius:12px;
    background:rgba(255,255,255,.97);
    box-shadow:0 14px 35px rgba(15,23,42,.13);
}

.qh-badge > span{
    display:grid;
    place-items:center;
    width:28px;
    height:28px;
    border-radius:8px;
    background:#fff0e8;
    color:#ff6518;
    font-size:10px;
    font-weight:950;
}

.qh-badge small{
    display:block;
    color:#98a2b3;
    font-size:5px;
    font-weight:900;
}

.qh-badge strong{
    display:block;
    margin-top:2px;
    color:#111827;
    font-size:8px;
}

.qh-badge-one{
    top:11px;
    right:12px;
}

.qh-badge-two{
    left:0;
    bottom:3px;
}


/* RESPONSIVE */

@media(max-width:1050px){

    .qh-grid{
        grid-template-columns:1fr;
    }

    .qh-copy{
        max-width:760px;
    }

    .qh-visual{
        width:min(660px,100%);
        margin:0 auto;
    }

}

@media(max-width:680px){

    .qh-hero{
        padding:52px 0 70px;
    }

    .qh-shell{
        width:min(100% - 28px,1180px);
    }

    .qh-copy h1{
        font-size:47px;
        letter-spacing:-2.7px;
    }

    .qh-actions{
        display:grid;
    }

    .qh-primary,
    .qh-secondary{
        width:100%;
        box-sizing:border-box;
    }

    .qh-offer{
        width:100%;
        box-sizing:border-box;
    }

    .qh-visual{
        min-height:505px;
        margin-top:15px;
    }

    .qh-browser{
        top:25px;
        left:0;
        width:94%;
    }

    .qh-site-body{
        grid-template-columns:1fr;
    }

    .qh-site-art{
        display:none;
    }

    .qh-dashboard{
        left:4px;
        bottom:25px;
        width:82%;
    }

    .qh-phone{
        right:0;
        bottom:3px;
        width:118px;
        height:250px;
    }

    .qh-badge{
        display:none;
    }

}


/* =========================================================
   QAMZU GROWTH TRACK IMAGE CARDS
   ========================================================= */

.qamzu-growth-track div{
    overflow:hidden;
    padding:0 !important;
    min-height:150px;
}

.qamzu-growth-image{
    width:100%;
    height:88px;
    min-height:0 !important;
    padding:0 !important;
    margin:0 0 12px !important;
    overflow:hidden;
    border:0 !important;
    border-radius:12px 12px 0 0 !important;
    background:#101828;
}

.qamzu-growth-image img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    object-position:center;
    transition:
        transform .3s ease,
        filter .3s ease;
}

.qamzu-growth-track > div:hover .qamzu-growth-image img{
    transform:scale(1.04);
}

.qamzu-growth-track > div > strong{
    display:block;
    padding:0 14px;
    margin-bottom:8px;
}

.qamzu-growth-track > div > span{
    display:block;
    padding:0 14px 14px;
}


/* DESKTOP — GIVE IMAGE CARDS MORE SPACE */

@media(min-width:981px){

    .qamzu-growth-track{
        align-items:stretch;
    }

    .qamzu-growth-track > div{
        min-height:155px;
    }

}


/* TABLET */

@media(max-width:980px){

    .qamzu-growth-track > div{
        min-height:175px;
    }

    .qamzu-growth-image{
        height:105px;
    }

}


/* MOBILE */

@media(max-width:600px){

    .qamzu-growth-track{
        grid-template-columns:1fr 1fr;
        gap:12px;
    }

    .qamzu-growth-track > div{
        min-height:160px;
    }

    .qamzu-growth-image{
        height:92px;
    }

    .qamzu-growth-track > div > strong{
        padding:0 12px;
    }

    .qamzu-growth-track > div > span{
        padding:0 12px 12px;
    }

}



/* =========================================================
   QAMZU HERO MOTION SHOWCASE
   ========================================================= */

.qh-site-showcase{
    position:relative;
    display:block;
    overflow:hidden;
    min-height:245px;
    padding:0;
    background:
        radial-gradient(
            circle at 70% 30%,
            rgba(255,101,24,.20),
            transparent 40%
        ),
        #172131;
}

.qh-showcase-img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    opacity:0;
    transform:scale(1.06);
    filter:saturate(.94) contrast(1.03);
    animation:
        qhShowcaseFade 12s infinite ease-in-out;
}

.qh-showcase-one{
    animation-delay:0s;
}

.qh-showcase-two{
    animation-delay:4s;
}

.qh-showcase-three{
    animation-delay:8s;
}

.qh-site-showcase::after{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            180deg,
            transparent 50%,
            rgba(8,15,28,.68) 100%
        );
    pointer-events:none;
}

.qh-showcase-label{
    position:absolute;
    z-index:5;
    left:13px;
    bottom:13px;
    display:flex;
    align-items:center;
    gap:7px;
    padding:7px 10px;
    border:1px solid rgba(255,255,255,.22);
    border-radius:999px;
    background:rgba(17,24,39,.82);
    color:#fff;
    font-size:7px;
    font-weight:900;
    backdrop-filter:blur(8px);
}

.qh-showcase-label span{
    width:6px;
    height:6px;
    border-radius:50%;
    background:#ff6518;
    box-shadow:
        0 0 0 4px rgba(255,101,24,.18);
}

@keyframes qhShowcaseFade{

    0%{
        opacity:0;
        transform:scale(1.07);
    }

    7%{
        opacity:1;
    }

    28%{
        opacity:1;
        transform:scale(1);
    }

    35%{
        opacity:0;
        transform:scale(1);
    }

    100%{
        opacity:0;
    }

}


/* FLOATING DEVICE MOTION */

.qh-browser{
    animation:
        qhFloatBrowser 7s ease-in-out infinite;
}

.qh-dashboard{
    animation:
        qhFloatDashboard 6s ease-in-out infinite;
}

.qh-phone{
    animation:
        qhFloatPhone 5s ease-in-out infinite;
}

.qh-badge-one{
    animation:
        qhBadgeFloat 5.5s ease-in-out infinite;
}

.qh-badge-two{
    animation:
        qhBadgeFloat 6.3s ease-in-out infinite reverse;
}

@keyframes qhFloatBrowser{

    0%,100%{
        transform:
            translateY(0)
            rotate(-1.2deg);
    }

    50%{
        transform:
            translateY(-7px)
            rotate(-.7deg);
    }

}

@keyframes qhFloatDashboard{

    0%,100%{
        transform:
            translateY(0)
            rotate(1deg);
    }

    50%{
        transform:
            translateY(-8px)
            rotate(.4deg);
    }

}

@keyframes qhFloatPhone{

    0%,100%{
        transform:
            translateY(0)
            rotate(4deg);
    }

    50%{
        transform:
            translateY(-10px)
            rotate(3deg);
    }

}

@keyframes qhBadgeFloat{

    0%,100%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(-6px);
    }

}


/* MORE PREMIUM GLOW BEHIND VISUAL */

.qh-visual::before{
    content:"";
    position:absolute;
    width:430px;
    height:430px;
    right:25px;
    top:75px;
    border-radius:50%;
    background:
        radial-gradient(
            circle,
            rgba(255,101,24,.16) 0%,
            rgba(255,101,24,.07) 38%,
            transparent 72%
        );
    filter:blur(12px);
    pointer-events:none;
}


/* HOVER DEPTH */

.qh-browser,
.qh-dashboard,
.qh-phone{
    transition:
        box-shadow .3s ease,
        filter .3s ease;
}

.qh-visual:hover .qh-browser{
    box-shadow:
        0 42px 95px rgba(15,23,42,.21);
}

.qh-visual:hover .qh-dashboard{
    box-shadow:
        0 32px 75px rgba(15,23,42,.23);
}

.qh-visual:hover .qh-phone{
    box-shadow:
        0 34px 80px rgba(15,23,42,.28);
}


/* REDUCED MOTION */

@media(prefers-reduced-motion:reduce){

    .qh-showcase-img,
    .qh-browser,
    .qh-dashboard,
    .qh-phone,
    .qh-badge-one,
    .qh-badge-two{
        animation:none !important;
    }

    .qh-showcase-one{
        opacity:1;
    }

}


/* MOBILE */

@media(max-width:680px){

    .qh-site-showcase{
        display:block !important;
        min-height:190px;
    }

    .qh-showcase-label{
        font-size:6px;
        bottom:9px;
        left:9px;
    }

    .qh-browser,
    .qh-dashboard,
    .qh-phone{
        animation-duration:8s;
    }

}



/* =========================================================
   QAMZU LUXURY DARK HERO — APPROVED REFERENCE
   ========================================================= */

.qlux-hero{
    position:relative;
    overflow:hidden;
    min-height:860px;
    padding:42px 0 30px;
    background:
        linear-gradient(
            90deg,
            rgba(4,12,25,.99) 0%,
            rgba(6,15,29,.96) 32%,
            rgba(18,20,24,.82) 58%,
            rgba(30,19,13,.78) 100%
        ),
        radial-gradient(
            circle at 82% 32%,
            rgba(255,105,18,.34),
            transparent 38%
        ),
        #07111f;
    color:#fff;
}

.qlux-hero::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:
        radial-gradient(
            circle at 74% 25%,
            rgba(255,125,34,.16),
            transparent 23%
        ),
        radial-gradient(
            circle at 17% 75%,
            rgba(21,111,71,.13),
            transparent 30%
        );
}

.qlux-hero::after{
    content:"";
    position:absolute;
    inset:0;
    opacity:.15;
    pointer-events:none;
    background-image:
        linear-gradient(
            rgba(255,255,255,.04) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.025) 1px,
            transparent 1px
        );
    background-size:60px 60px;
    mask-image:
        linear-gradient(
            90deg,
            rgba(0,0,0,.2),
            transparent 45%
        );
}

.qlux-bg-glow{
    position:absolute;
    border-radius:50%;
    filter:blur(65px);
    pointer-events:none;
}

.qlux-bg-glow-one{
    width:550px;
    height:550px;
    top:50px;
    right:-100px;
    background:rgba(255,101,24,.18);
}

.qlux-bg-glow-two{
    width:300px;
    height:300px;
    bottom:-80px;
    left:-80px;
    background:rgba(11,87,58,.20);
}

.qlux-shell{
    position:relative;
    z-index:3;
    width:min(1450px,calc(100% - 54px));
    margin:0 auto;
}

.qlux-main{
    display:grid;
    grid-template-columns:
        minmax(410px,.78fr)
        minmax(700px,1.35fr);
    gap:28px;
    align-items:center;
    min-height:640px;
}


/* =========================================================
   COPY
   ========================================================= */

.qlux-copy{
    position:relative;
    z-index:20;
    max-width:530px;
}

.qlux-eyebrow{
    display:inline-flex;
    align-items:center;
    gap:9px;
    padding:8px 13px;
    border:1px solid rgba(255,111,24,.76);
    border-radius:999px;
    background:
        rgba(10,20,32,.70);
    color:#ff6a15;
    font-size:10px;
    font-weight:900;
    letter-spacing:.055em;
    box-shadow:
        inset 0 0 14px rgba(255,101,24,.05);
}

.qlux-eyebrow-dot{
    width:8px;
    height:8px;
    border-radius:50%;
    background:#ff6518;
    box-shadow:
        0 0 0 4px rgba(255,101,24,.16),
        0 0 15px rgba(255,101,24,.75);
}

.qlux-copy h1{
    margin:22px 0 0;
    color:#fff;
    font-size:clamp(59px,5vw,82px);
    line-height:.91;
    letter-spacing:-4.4px;
    font-weight:950;
}

.qlux-copy h1 strong{
    display:inline-block;
    color:#ff5c08;
    font-weight:950;
}

.qlux-title-stroke{
    width:225px;
    height:4px;
    margin:9px 0 22px;
    border-radius:999px;
    background:
        linear-gradient(
            90deg,
            #ff6518,
            #ff6b0b 72%,
            transparent
        );
    transform:rotate(-4deg);
    transform-origin:left;
}

.qlux-description{
    max-width:505px;
    margin:0;
    color:#e2e7ee;
    font-size:15px;
    line-height:1.55;
}

.qlux-description strong{
    color:#ff6a16;
    font-weight:950;
}

.qlux-actions{
    display:flex;
    gap:13px;
    margin-top:23px;
}

.qlux-primary,
.qlux-secondary{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:52px;
    padding:0 25px;
    border-radius:10px;
    text-decoration:none;
    font-size:13px;
    font-weight:900;
    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.qlux-primary{
    gap:22px;
    background:
        linear-gradient(
            135deg,
            #ff6819,
            #ff4f00
        );
    color:#fff;
    box-shadow:
        0 13px 32px rgba(255,85,0,.29),
        inset 0 1px 0 rgba(255,255,255,.26);
}

.qlux-primary:hover{
    transform:translateY(-2px);
    box-shadow:
        0 18px 42px rgba(255,85,0,.37);
}

.qlux-secondary{
    border:1px solid rgba(255,255,255,.42);
    background:
        rgba(12,20,32,.42);
    color:#fff;
    backdrop-filter:blur(9px);
}

.qlux-secondary:hover{
    transform:translateY(-2px);
    border-color:#ff761e;
}

.qlux-benefits{
    display:flex;
    gap:34px;
    margin-top:20px;
}

.qlux-benefits > div{
    display:flex;
    align-items:center;
    gap:9px;
}

.qlux-benefit-icon{
    display:grid;
    place-items:center;
    width:31px;
    height:31px;
    border-radius:50%;
    background:#ff6518;
    color:#fff;
    font-size:12px;
    box-shadow:
        0 7px 18px rgba(255,101,24,.25);
}

.qlux-benefits p{
    margin:0;
}

.qlux-benefits strong,
.qlux-benefits small{
    display:block;
}

.qlux-benefits strong{
    color:#fff;
    font-size:10px;
}

.qlux-benefits small{
    margin-top:2px;
    color:#c6ced8;
    font-size:9px;
}

.qlux-price-card{
    display:flex;
    align-items:center;
    width:min(100%,410px);
    min-height:63px;
    margin-top:20px;
    padding:7px 10px;
    border:1px solid rgba(255,255,255,.23);
    border-radius:10px;
    background:
        linear-gradient(
            120deg,
            rgba(18,30,44,.95),
            rgba(26,25,29,.74)
        );
    color:#fff;
    text-decoration:none;
    box-shadow:
        0 15px 35px rgba(0,0,0,.14),
        inset 0 1px 0 rgba(255,255,255,.08);
    transition:.2s ease;
}

.qlux-price-card:hover{
    border-color:rgba(255,101,24,.65);
    transform:translateY(-2px);
}

.qlux-price-icon{
    display:grid;
    place-items:center;
    width:43px;
    height:43px;
    margin-right:10px;
    border:1px solid #ff6518;
    border-radius:9px;
    color:#ff6518;
    font-size:21px;
}

.qlux-price-main small{
    display:block;
    color:#e1e6ec;
    font-size:7px;
    font-weight:900;
}

.qlux-price-main strong{
    display:block;
    margin-top:2px;
    color:#ff6518;
    font-size:24px;
    line-height:1;
}

.qlux-price-divider{
    width:1px;
    height:38px;
    margin:0 14px;
    background:rgba(255,255,255,.25);
}

.qlux-price-card p{
    flex:1;
    margin:0;
    color:#d6dce4;
    font-size:9px;
    line-height:1.45;
}

.qlux-price-arrow{
    display:grid;
    place-items:center;
    width:33px;
    height:33px;
    border:1px solid #ff6518;
    border-radius:50%;
    color:#ff6518;
    font-size:22px;
}


/* =========================================================
   STAGE
   ========================================================= */

.qlux-stage{
    position:relative;
    min-height:650px;
    perspective:1400px;
}

.qlux-orbit{
    position:absolute;
    z-index:1;
    border-radius:50%;
    pointer-events:none;
}

.qlux-orbit-one{
    width:590px;
    height:440px;
    top:52px;
    right:18px;
    border:
        2px solid rgba(255,115,24,.67);
    transform:rotate(12deg);
    box-shadow:
        0 0 28px rgba(255,101,24,.12);
}

.qlux-orbit-two{
    width:460px;
    height:320px;
    top:112px;
    right:78px;
    border:
        1px solid rgba(255,167,79,.38);
    transform:rotate(-8deg);
}

.qlux-node{
    position:absolute;
    z-index:3;
    width:9px;
    height:9px;
    border-radius:50%;
    background:#ff6518;
    box-shadow:
        0 0 0 4px rgba(255,101,24,.18),
        0 0 20px rgba(255,101,24,.95);
}

.qlux-node-one{
    top:100px;
    left:48%;
}

.qlux-node-two{
    top:155px;
    right:23%;
}

.qlux-node-three{
    top:235px;
    right:2%;
}


/* =========================================================
   FLOATING CARDS
   ========================================================= */

.qlux-float{
    position:absolute;
    z-index:22;
    display:flex;
    align-items:center;
    gap:11px;
    min-width:185px;
    padding:12px 14px;
    border:1px solid rgba(255,155,89,.55);
    border-radius:12px;
    background:
        linear-gradient(
            135deg,
            rgba(28,28,30,.92),
            rgba(56,36,24,.82)
        );
    box-shadow:
        0 16px 38px rgba(0,0,0,.27),
        inset 0 1px 0 rgba(255,255,255,.12);
    backdrop-filter:blur(14px);
    animation:
        qluxFloatCard 5.5s ease-in-out infinite;
}

.qlux-float-icon{
    color:#ff6518;
    font-size:28px;
    line-height:1;
}

.qlux-float strong,
.qlux-float small{
    display:block;
}

.qlux-float strong{
    color:#fff;
    font-size:10px;
}

.qlux-float small{
    margin-top:3px;
    color:#d1d4da;
    font-size:8px;
}

.qlux-float-responsive{
    top:45px;
    left:170px;
    transform:rotate(-5deg);
}

.qlux-float-workflow{
    top:35px;
    right:165px;
    animation-delay:-1.3s;
}

.qlux-float-systems{
    top:86px;
    right:-15px;
    animation-delay:-2.6s;
}

@keyframes qluxFloatCard{
    0%,100%{
        translate:0 0;
    }
    50%{
        translate:0 -8px;
    }
}


/* =========================================================
   LAPTOP
   ========================================================= */

.qlux-laptop{
    position:absolute;
    z-index:7;
    width:620px;
    top:120px;
    right:36px;
    transform:
        rotate(2.7deg);
    filter:
        drop-shadow(0 30px 42px rgba(0,0,0,.37));
}

.qlux-laptop-shell{
    position:relative;
    padding:10px 10px 12px;
    border-radius:18px 18px 10px 10px;
    background:
        linear-gradient(
            145deg,
            #1d242b,
            #06090c 42%,
            #2b3238
        );
    box-shadow:
        inset 0 0 0 2px rgba(255,255,255,.09);
}

.qlux-laptop-camera{
    position:absolute;
    z-index:3;
    top:5px;
    left:50%;
    width:5px;
    height:5px;
    border-radius:50%;
    background:#0c0f13;
    transform:translateX(-50%);
}

.qlux-laptop-screen{
    overflow:hidden;
    border-radius:10px;
    background:#fff;
}

.qlux-site-window{
    height:355px;
    background:#fff;
}

.qlux-site-topbar{
    display:flex;
    align-items:center;
    height:39px;
    padding:0 16px;
    background:#fff;
}

.qlux-demo-logo{
    color:#0f172a;
    font-size:10px;
    font-weight:950;
}

.qlux-demo-logo::before{
    content:"Q";
    display:inline-grid;
    place-items:center;
    width:18px;
    height:18px;
    margin-right:5px;
    border-radius:5px;
    background:#ff6518;
    color:#fff;
    font-size:10px;
}

.qlux-demo-menu{
    display:flex;
    gap:12px;
    margin-left:auto;
    color:#536071;
    font-size:5.5px;
}

.qlux-site-topbar button{
    margin-left:14px;
    padding:7px 11px;
    border:0;
    border-radius:6px;
    background:#ff6518;
    color:#fff;
    font-size:6px;
    font-weight:800;
}

.qlux-site-photo{
    position:relative;
    height:316px;
    overflow:hidden;
}

.qlux-site-photo img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
}

.qlux-site-overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            90deg,
            rgba(7,20,38,.78) 0%,
            rgba(8,22,40,.47) 47%,
            rgba(8,15,24,.07) 100%
        );
}

.qlux-site-photo-copy{
    position:absolute;
    z-index:3;
    top:50px;
    left:34px;
}

.qlux-site-photo-copy small{
    color:#ff9b55;
    font-size:7px;
    font-weight:900;
    letter-spacing:.16em;
}

.qlux-site-photo-copy h3{
    margin:8px 0 8px;
    color:#fff;
    font-size:29px;
    line-height:1;
    letter-spacing:-1px;
}

.qlux-site-photo-copy p{
    width:220px;
    margin:0;
    color:#e4e8ec;
    font-size:7px;
    line-height:1.5;
}

.qlux-site-photo-copy span{
    display:inline-block;
    margin-top:12px;
    padding:8px 11px;
    border-radius:6px;
    background:#ff6518;
    color:#fff;
    font-size:6px;
    font-weight:900;
}

.qlux-laptop-base{
    width:105%;
    height:16px;
    margin-left:-2.5%;
    border-radius:2px 2px 16px 16px;
    background:
        linear-gradient(
            180deg,
            #3f474e,
            #13171b
        );
    box-shadow:
        0 5px 10px rgba(0,0,0,.4);
}

.qlux-laptop-foot{
    width:55%;
    height:5px;
    margin:0 auto;
    border-radius:0 0 20px 20px;
    background:#20252a;
}


/* =========================================================
   DASHBOARD
   ========================================================= */

.qlux-dashboard{
    position:absolute;
    z-index:14;
    width:530px;
    left:20px;
    bottom:26px;
    transform:
        rotate(3.1deg);
    filter:
        drop-shadow(0 25px 34px rgba(0,0,0,.39));
}

.qlux-dashboard-frame{
    display:grid;
    grid-template-columns:120px 1fr;
    overflow:hidden;
    min-height:290px;
    border:8px solid #161c22;
    border-radius:18px;
    background:#fff;
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.15);
}

.qlux-dash-sidebar{
    padding:15px 10px;
    background:
        linear-gradient(
            180deg,
            #122132,
            #0a1523
        );
}

.qlux-dash-brand{
    display:flex;
    align-items:center;
    gap:6px;
    margin-bottom:15px;
    color:#fff;
    font-size:9px;
    font-weight:900;
}

.qlux-dash-brand span{
    display:grid;
    place-items:center;
    width:22px;
    height:22px;
    border-radius:6px;
    background:#ff6518;
}

.qlux-dash-link{
    display:flex;
    align-items:center;
    gap:7px;
    margin-bottom:5px;
    padding:7px 8px;
    border-radius:6px;
    color:#c7d0dc;
    font-size:6px;
}

.qlux-dash-link.active{
    background:#ff6518;
    color:#fff;
}

.qlux-dash-body{
    padding:19px 17px;
    background:#f7f9fc;
}

.qlux-dash-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.qlux-dash-head strong{
    color:#101828;
    font-size:11px;
}

.qlux-dash-head span{
    padding:5px 8px;
    border:1px solid #dfe5ec;
    border-radius:6px;
    background:#fff;
    color:#667085;
    font-size:5px;
}

.qlux-dash-stats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:8px;
    margin-top:14px;
}

.qlux-dash-stats article{
    padding:11px;
    border:1px solid #e8edf2;
    border-radius:8px;
    background:#fff;
}

.qlux-dash-stats small{
    display:block;
    color:#8090a4;
    font-size:5px;
}

.qlux-dash-stats strong{
    display:block;
    margin-top:5px;
    color:#101828;
    font-size:16px;
}

.qlux-dash-stats em{
    display:block;
    margin-top:3px;
    color:#1fb851;
    font-size:5px;
    font-style:normal;
    font-weight:800;
}

.qlux-dash-stats em.orange{
    color:#ff6518;
}

.qlux-chart-head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-top:16px;
}

.qlux-chart-head strong{
    color:#101828;
    font-size:8px;
}

.qlux-chart-head span{
    color:#7b8795;
    font-size:5px;
}

.qlux-chart{
    display:flex;
    align-items:flex-end;
    gap:7px;
    height:90px;
    margin-top:10px;
    padding:10px 8px 0;
    border-bottom:1px solid #dfe5ec;
    background:
        repeating-linear-gradient(
            to bottom,
            transparent,
            transparent 21px,
            #e8edf2 22px
        );
}

.qlux-chart div{
    flex:1;
    min-height:6px;
    border-radius:2px 2px 0 0;
    background:
        linear-gradient(
            180deg,
            #5a8fff,
            #9eb9fb
        );
}


/* =========================================================
   PHONE
   ========================================================= */

.qlux-phone{
    position:absolute;
    z-index:18;
    width:180px;
    right:-5px;
    bottom:18px;
    transform:
        rotate(3.5deg);
    filter:
        drop-shadow(0 26px 35px rgba(0,0,0,.42));
}

.qlux-phone-shell{
    padding:7px;
    border-radius:30px;
    background:
        linear-gradient(
            145deg,
            #11171d,
            #020406
        );
    box-shadow:
        inset 0 0 0 2px rgba(255,255,255,.18);
}

.qlux-phone-screen{
    position:relative;
    overflow:hidden;
    min-height:365px;
    border-radius:23px;
    background:#f5f7fa;
}

.qlux-phone-notch{
    position:absolute;
    z-index:6;
    top:7px;
    left:50%;
    width:70px;
    height:18px;
    border-radius:0 0 12px 12px;
    background:#080b0e;
    transform:translateX(-50%);
}

.qlux-phone-hero{
    position:relative;
    height:145px;
    overflow:hidden;
}

.qlux-phone-hero img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.qlux-phone-shade{
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            180deg,
            rgba(0,0,0,.12),
            rgba(0,0,0,.63)
        );
}

.qlux-phone-title{
    position:absolute;
    z-index:3;
    inset:14px 12px 10px;
    color:#fff;
}

.qlux-phone-title > small{
    display:block;
    text-align:left;
    font-size:5px;
}

.qlux-phone-title strong{
    display:block;
    margin-top:30px;
    font-size:16px;
    line-height:1.05;
}

.qlux-phone-title span{
    display:block;
    margin-top:5px;
    font-size:6px;
}

.qlux-phone-search{
    margin:10px;
    padding:8px 9px;
    border-radius:8px;
    background:#fff;
    color:#8b96a6;
    font-size:6px;
    box-shadow:
        0 2px 7px rgba(15,23,42,.08);
}

.qlux-phone-icons{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:5px;
    padding:0 10px;
}

.qlux-phone-icons span{
    display:grid;
    place-items:center;
    height:32px;
    border-radius:8px;
    background:#fff;
    font-size:13px;
}

.qlux-phone-section-title{
    display:block;
    padding:12px 10px 6px;
    color:#101828;
    font-size:7px;
}

.qlux-phone-food-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:6px;
    padding:0 10px;
}

.qlux-phone-food-row div{
    height:72px;
    overflow:hidden;
    border-radius:8px;
    background:#fff;
}

.qlux-phone-food-row img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.qlux-mobile-label{
    position:absolute;
    z-index:25;
    right:-25px;
    bottom:29px;
    display:flex;
    align-items:center;
    gap:9px;
    padding:9px 12px;
    border-radius:10px;
    background:#fff;
    color:#111827;
    box-shadow:
        0 12px 28px rgba(0,0,0,.24);
}

.qlux-mobile-label > span{
    color:#ff6518;
    font-size:23px;
}

.qlux-mobile-label strong,
.qlux-mobile-label small{
    display:block;
}

.qlux-mobile-label strong{
    font-size:8px;
}

.qlux-mobile-label small{
    margin-top:2px;
    color:#7a8492;
    font-size:6px;
}


/* =========================================================
   SERVICES STRIP
   ========================================================= */

.qlux-service-strip{
    position:relative;
    z-index:30;
    display:grid;
    grid-template-columns:repeat(5,1fr);
    margin-top:0;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.22);
    border-radius:18px;
    background:
        linear-gradient(
            120deg,
            rgba(16,28,42,.96),
            rgba(29,26,31,.91)
        );
    box-shadow:
        0 24px 55px rgba(0,0,0,.24),
        inset 0 1px 0 rgba(255,255,255,.08);
    backdrop-filter:blur(14px);
}

.qlux-service{
    position:relative;
    display:flex;
    min-height:110px;
    gap:13px;
    padding:20px 17px;
    border-right:1px solid rgba(255,255,255,.15);
    color:#fff;
    text-decoration:none;
    transition:
        background .2s ease,
        transform .2s ease;
}

.qlux-service:last-child{
    border-right:0;
}

.qlux-service:hover{
    background:
        rgba(255,255,255,.055);
}

.qlux-service-icon{
    flex:0 0 auto;
    font-size:30px;
    line-height:1;
}

.qlux-orange{color:#ff6518}
.qlux-blue{color:#4687ff}
.qlux-green{color:#24c15c}
.qlux-purple{color:#a440ed}
.qlux-red{color:#f14b43}

.qlux-service strong{
    display:block;
    color:#fff;
    font-size:11px;
}

.qlux-service small{
    display:block;
    margin-top:6px;
    min-height:30px;
    color:#c3ccd7;
    font-size:8px;
    line-height:1.4;
}

.qlux-service b{
    display:grid;
    place-items:center;
    width:28px;
    height:28px;
    margin-top:10px;
    border:1px solid #ff6518;
    border-radius:50%;
    color:#ff6518;
    font-size:18px;
    transition:.2s ease;
}

.qlux-service:hover b{
    background:#ff6518;
    color:#fff;
}


/* =========================================================
   MICRO MOTION
   ========================================================= */

.qlux-laptop{
    animation:
        qluxLaptopFloat 7s ease-in-out infinite;
}

.qlux-dashboard{
    animation:
        qluxDashboardFloat 6s ease-in-out infinite;
}

.qlux-phone{
    animation:
        qluxPhoneFloat 5.6s ease-in-out infinite;
}

@keyframes qluxLaptopFloat{
    0%,100%{
        translate:0 0;
    }
    50%{
        translate:0 -6px;
    }
}

@keyframes qluxDashboardFloat{
    0%,100%{
        translate:0 0;
    }
    50%{
        translate:0 -9px;
    }
}

@keyframes qluxPhoneFloat{
    0%,100%{
        translate:0 0;
    }
    50%{
        translate:0 -11px;
    }
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1250px){

    .qlux-main{
        grid-template-columns:
            minmax(380px,.85fr)
            minmax(590px,1.15fr);
    }

    .qlux-copy h1{
        font-size:60px;
    }

    .qlux-laptop{
        width:540px;
    }

    .qlux-dashboard{
        width:470px;
    }

    .qlux-phone{
        width:155px;
    }

    .qlux-service small{
        font-size:7px;
    }

}


/* =========================================================
   SMALL TABLET
   ========================================================= */

@media(max-width:1050px){

    .qlux-hero{
        padding-top:55px;
    }

    .qlux-main{
        display:block;
    }

    .qlux-copy{
        max-width:650px;
    }

    .qlux-copy h1{
        font-size:72px;
    }

    .qlux-stage{
        width:min(780px,100%);
        margin:20px auto 0;
        min-height:650px;
    }

    .qlux-service-strip{
        grid-template-columns:repeat(2,1fr);
    }

    .qlux-service{
        border-bottom:1px solid rgba(255,255,255,.12);
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:700px){

    .qlux-hero{
        min-height:0;
        padding:34px 0 24px;
    }

    .qlux-shell{
        width:min(100% - 26px,1450px);
    }

    .qlux-copy h1{
        font-size:51px;
        letter-spacing:-3px;
    }

    .qlux-title-stroke{
        width:170px;
    }

    .qlux-description{
        font-size:14px;
    }

    .qlux-actions{
        display:grid;
    }

    .qlux-primary,
    .qlux-secondary{
        width:100%;
        box-sizing:border-box;
    }

    .qlux-benefits{
        gap:15px;
        justify-content:space-between;
    }

    .qlux-price-card{
        width:100%;
        box-sizing:border-box;
    }

    .qlux-price-card p{
        font-size:8px;
    }

    .qlux-stage{
        min-height:500px;
        margin-top:30px;
    }

    .qlux-orbit{
        display:none;
    }

    .qlux-node{
        display:none;
    }

    .qlux-float{
        display:none;
    }

    .qlux-laptop{
        width:88%;
        top:65px;
        right:2%;
    }

    .qlux-site-window{
        height:250px;
    }

    .qlux-site-photo{
        height:213px;
    }

    .qlux-demo-menu{
        display:none;
    }

    .qlux-dashboard{
        width:82%;
        left:0;
        bottom:22px;
    }

    .qlux-dashboard-frame{
        grid-template-columns:82px 1fr;
        min-height:230px;
    }

    .qlux-dash-sidebar{
        padding:10px 7px;
    }

    .qlux-dash-link{
        font-size:5px;
        padding:5px;
    }

    .qlux-dash-body{
        padding:12px 9px;
    }

    .qlux-dash-stats article{
        padding:6px;
    }

    .qlux-dash-stats strong{
        font-size:11px;
    }

    .qlux-chart{
        height:60px;
        gap:3px;
    }

    .qlux-phone{
        width:110px;
        right:0;
        bottom:10px;
    }

    .qlux-phone-screen{
        min-height:260px;
    }

    .qlux-phone-hero{
        height:110px;
    }

    .qlux-phone-title strong{
        margin-top:18px;
        font-size:11px;
    }

    .qlux-phone-icons{
        gap:3px;
        padding:0 6px;
    }

    .qlux-phone-icons span{
        height:22px;
        font-size:9px;
    }

    .qlux-phone-food-row{
        padding:0 6px;
    }

    .qlux-phone-food-row div{
        height:40px;
    }

    .qlux-mobile-label{
        display:none;
    }

    .qlux-service-strip{
        grid-template-columns:1fr;
    }

    .qlux-service{
        min-height:0;
        border-right:0;
        padding:15px;
    }

    .qlux-service small{
        min-height:0;
    }

}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

@media(prefers-reduced-motion:reduce){

    .qlux-laptop,
    .qlux-dashboard,
    .qlux-phone,
    .qlux-float{
        animation:none !important;
    }

}


/* =========================================================
   QAMZU WEBSITE OFFER FOCUS FIXED
   ========================================================= */

.qlux-sameday{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin:11px 0 3px;
    padding:8px 14px;
    border:1px solid rgba(255,119,34,.65);
    border-radius:999px;
    background:rgba(255,102,24,.11);
    color:#ff924d;
    font-size:11px;
    font-weight:900;
    letter-spacing:.04em;
    box-shadow:
        0 0 24px rgba(255,101,24,.13);
}

.qlux-copy h1 strong{
    color:#ff5f0b;
    text-shadow:
        0 8px 28px rgba(255,90,0,.26);
}

.qlux-description{
    font-size:16px;
    max-width:535px;
}

.qlux-description strong{
    color:#ff761c;
    font-size:1.12em;
}

.qlux-price-card{
    border-color:rgba(255,112,31,.60);
    box-shadow:
        0 17px 40px rgba(0,0,0,.23),
        0 0 24px rgba(255,101,24,.06),
        inset 0 1px 0 rgba(255,255,255,.09);
}

.qlux-price-main strong{
    font-size:31px;
}

.qlux-primary{
    box-shadow:
        0 18px 40px rgba(255,90,0,.34),
        inset 0 1px 0 rgba(255,255,255,.25);
}


/* =========================================================
   QAMZU LUXURY HEADER UPGRADE
   ========================================================= */

header,
.site-header,
.qlux-header,
.top-header {
    position: sticky;
    top: 0;
    z-index: 9999;
    background: rgba(255,255,255,0.88);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow:
        0 10px 30px rgba(15, 23, 42, 0.06),
        0 1px 0 rgba(255,255,255,0.8) inset;
}

header::after,
.site-header::after,
.qlux-header::after,
.top-header::after {
    content: "";
    display: block;
    height: 1px;
    background: linear-gradient(
        90deg,
        rgba(255,255,255,0),
        rgba(255,102,24,0.35),
        rgba(255,255,255,0)
    );
}

/* inner row */
header .container,
header .wrapper,
header .inner,
header .nav-inner,
.site-header .container,
.site-header .wrapper,
.site-header .inner,
.site-header .nav-inner,
.qlux-header .container,
.qlux-header .wrapper,
.qlux-header .inner,
.qlux-header .nav-inner,
.top-header .container,
.top-header .wrapper,
.top-header .inner,
.top-header .nav-inner {
    min-height: 92px;
    display: flex;
    align-items: center;
}

/* logo */
header .logo,
header .brand,
header .site-logo,
.site-header .logo,
.site-header .brand,
.site-header .site-logo,
.qlux-header .logo,
.qlux-header .brand,
.qlux-header .site-logo,
.top-header .logo,
.top-header .brand,
.top-header .site-logo {
    display: flex;
    align-items: center;
    gap: 14px;
    text-decoration: none;
}

header .logo img,
header .brand img,
header .site-logo img,
.site-header .logo img,
.site-header .brand img,
.site-header .site-logo img,
.qlux-header .logo img,
.qlux-header .brand img,
.qlux-header .site-logo img,
.top-header .logo img,
.top-header .brand img,
.top-header .site-logo img {
    transition: transform .25s ease, filter .25s ease;
}

header .logo:hover img,
header .brand:hover img,
header .site-logo:hover img,
.site-header .logo:hover img,
.site-header .brand:hover img,
.site-header .site-logo:hover img,
.qlux-header .logo:hover img,
.qlux-header .brand:hover img,
.qlux-header .site-logo:hover img,
.top-header .logo:hover img,
.top-header .brand:hover img,
.top-header .site-logo:hover img {
    transform: translateY(-1px) scale(1.02);
    filter: drop-shadow(0 8px 18px rgba(255,102,24,0.18));
}

/* nav links container */
header nav,
.site-header nav,
.qlux-header nav,
.top-header nav {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* links */
header nav a,
.site-header nav a,
.qlux-header nav a,
.top-header nav a {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 12px 14px;
    border-radius: 999px;
    color: #0f172a;
    text-decoration: none;
    font-weight: 700;
    font-size: 16px;
    letter-spacing: -0.01em;
    transition:
        color .22s ease,
        background-color .22s ease,
        transform .22s ease,
        box-shadow .22s ease;
}

header nav a:hover,
.site-header nav a:hover,
.qlux-header nav a:hover,
.top-header nav a:hover {
    color: #ff6618;
    background: rgba(255,102,24,0.08);
    transform: translateY(-1px);
}

header nav a::after,
.site-header nav a::after,
.qlux-header nav a::after,
.top-header nav a::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 7px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, #ff6618, #ff9a57);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform .22s ease;
}

header nav a:hover::after,
.site-header nav a:hover::after,
.qlux-header nav a:hover::after,
.top-header nav a:hover::after {
    transform: scaleX(1);
}

/* active/current link */
header nav a.active,
header nav a[aria-current="page"],
.site-header nav a.active,
.site-header nav a[aria-current="page"],
.qlux-header nav a.active,
.qlux-header nav a[aria-current="page"],
.top-header nav a.active,
.top-header nav a[aria-current="page"] {
    color: #ff6618;
    background: rgba(255,102,24,0.10);
    box-shadow: inset 0 0 0 1px rgba(255,102,24,0.12);
}

header nav a.active::after,
header nav a[aria-current="page"]::after,
.site-header nav a.active::after,
.site-header nav a[aria-current="page"]::after,
.qlux-header nav a.active::after,
.qlux-header nav a[aria-current="page"]::after,
.top-header nav a.active::after,
.top-header nav a[aria-current="page"]::after {
    transform: scaleX(1);
}

/* CTA button */
header .header-cta,
header .nav-cta,
header .cta-button,
header .primary-button,
.site-header .header-cta,
.site-header .nav-cta,
.site-header .cta-button,
.site-header .primary-button,
.qlux-header .header-cta,
.qlux-header .nav-cta,
.qlux-header .cta-button,
.qlux-header .primary-button,
.top-header .header-cta,
.top-header .nav-cta,
.top-header .cta-button,
.top-header .primary-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 0 28px;
    border-radius: 16px;
    background: linear-gradient(135deg, #0f172a 0%, #111c34 55%, #1e293b 100%);
    color: #ffffff !important;
    font-weight: 800;
    font-size: 16px;
    letter-spacing: -0.01em;
    text-decoration: none;
    box-shadow:
        0 14px 30px rgba(15,23,42,0.16),
        inset 0 1px 0 rgba(255,255,255,0.10);
    transition:
        transform .22s ease,
        box-shadow .22s ease,
        background .22s ease;
}

header .header-cta:hover,
header .nav-cta:hover,
header .cta-button:hover,
header .primary-button:hover,
.site-header .header-cta:hover,
.site-header .nav-cta:hover,
.site-header .cta-button:hover,
.site-header .primary-button:hover,
.qlux-header .header-cta:hover,
.qlux-header .nav-cta:hover,
.qlux-header .cta-button:hover,
.qlux-header .primary-button:hover,
.top-header .header-cta:hover,
.top-header .nav-cta:hover,
.top-header .cta-button:hover,
.top-header .primary-button:hover {
    transform: translateY(-2px);
    box-shadow:
        0 18px 36px rgba(15,23,42,0.22),
        0 6px 18px rgba(255,102,24,0.14),
        inset 0 1px 0 rgba(255,255,255,0.12);
    background: linear-gradient(135deg, #111827 0%, #18243f 50%, #0f172a 100%);
}

/* if there is a top strip above header */
.topbar,
.header-topbar,
.notice-bar {
    background: linear-gradient(90deg, #081225 0%, #0c1630 60%, #1a233b 100%);
    color: #f8fafc;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

/* mobile */
@media (max-width: 991px) {
    header .container,
    header .wrapper,
    header .inner,
    header .nav-inner,
    .site-header .container,
    .site-header .wrapper,
    .site-header .inner,
    .site-header .nav-inner,
    .qlux-header .container,
    .qlux-header .wrapper,
    .qlux-header .inner,
    .qlux-header .nav-inner,
    .top-header .container,
    .top-header .wrapper,
    .top-header .inner,
    .top-header .nav-inner {
        min-height: 82px;
    }

    header nav a,
    .site-header nav a,
    .qlux-header nav a,
    .top-header nav a {
        font-size: 15px;
        padding: 10px 12px;
    }

    header .header-cta,
    header .nav-cta,
    header .cta-button,
    header .primary-button,
    .site-header .header-cta,
    .site-header .nav-cta,
    .site-header .cta-button,
    .site-header .primary-button,
    .qlux-header .header-cta,
    .qlux-header .nav-cta,
    .qlux-header .cta-button,
    .qlux-header .primary-button,
    .top-header .header-cta,
    .top-header .nav-cta,
    .top-header .cta-button,
    .top-header .primary-button {
        min-height: 50px;
        padding: 0 22px;
        border-radius: 14px;
    }
}



/* =========================================================
   QAMZU — PREMIUM HERO SERVICE STRIP V2
   ========================================================= */

.qlux-service-strip{
    position:relative;
    z-index:30;

    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:10px;

    margin-top:0;
    padding:10px;

    overflow:visible;

    border:1px solid rgba(255,255,255,.12);
    border-radius:22px;

    background:
        radial-gradient(
            circle at 8% 0%,
            rgba(255,101,24,.11),
            transparent 27%
        ),
        linear-gradient(
            120deg,
            rgba(9,20,35,.97),
            rgba(12,20,34,.96) 55%,
            rgba(24,20,25,.95)
        );

    box-shadow:
        0 30px 70px rgba(0,0,0,.27),
        inset 0 1px 0 rgba(255,255,255,.07);

    backdrop-filter:blur(18px);
}


/* subtle luxury glow */
.qlux-service-strip::before{
    content:"";
    position:absolute;

    top:-1px;
    left:6%;
    width:28%;
    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,101,24,.85),
            rgba(255,177,105,.46),
            transparent
        );

    box-shadow:
        0 0 22px rgba(255,101,24,.32);

    pointer-events:none;
}


/* individual premium service card */
.qlux-service{
    position:relative;

    display:grid;
    grid-template-columns:48px minmax(0,1fr);
    align-items:start;

    min-height:140px;
    gap:14px;

    padding:20px 18px 17px;

    overflow:hidden;

    border:1px solid rgba(255,255,255,.075);
    border-right:1px solid rgba(255,255,255,.075) !important;
    border-radius:15px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.045),
            rgba(255,255,255,.012)
        );

    color:#fff;
    text-decoration:none;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035);

    transition:
        transform .28s ease,
        border-color .28s ease,
        background .28s ease,
        box-shadow .28s ease;
}


/* soft internal highlight */
.qlux-service::before{
    content:"";
    position:absolute;
    inset:0;

    opacity:0;

    background:
        radial-gradient(
            circle at 15% 0%,
            rgba(255,101,24,.12),
            transparent 42%
        );

    transition:opacity .28s ease;

    pointer-events:none;
}


/* premium orange line */
.qlux-service::after{
    content:"";
    position:absolute;

    left:18px;
    right:18px;
    bottom:0;

    height:1px;

    opacity:.22;

    background:
        linear-gradient(
            90deg,
            #ff6518,
            rgba(255,101,24,.25),
            transparent
        );

    transition:
        opacity .28s ease,
        right .28s ease;
}


/* hover */
.qlux-service:hover{
    transform:translateY(-4px);

    border-color:rgba(255,101,24,.34);

    background:
        linear-gradient(
            145deg,
            rgba(255,101,24,.075),
            rgba(255,255,255,.024)
        );

    box-shadow:
        0 18px 38px rgba(0,0,0,.22),
        0 0 28px rgba(255,101,24,.055),
        inset 0 1px 0 rgba(255,255,255,.07);
}

.qlux-service:hover::before{
    opacity:1;
}

.qlux-service:hover::after{
    opacity:1;
    right:42px;
}


/* first service gets a slightly stronger website accent */
.qlux-service:first-child{
    border-color:rgba(255,101,24,.18);

    background:
        linear-gradient(
            145deg,
            rgba(255,101,24,.065),
            rgba(255,255,255,.018)
        );
}


/* icon container */
.qlux-service-icon{
    position:relative;
    z-index:2;

    display:grid;
    place-items:center;

    width:46px;
    height:46px;

    border:1px solid rgba(255,101,24,.30);
    border-radius:13px;

    background:
        linear-gradient(
            145deg,
            rgba(255,101,24,.11),
            rgba(255,255,255,.025)
        );

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.07),
        0 9px 24px rgba(0,0,0,.18);

    font-size:25px;
    line-height:1;

    transition:
        transform .28s ease,
        border-color .28s ease,
        box-shadow .28s ease;
}


/* unify colors into luxury Qamzu palette */
.qlux-orange,
.qlux-blue,
.qlux-green,
.qlux-purple,
.qlux-red{
    color:#ff7b38;
}


/* tiny secondary variation without rainbow colors */
.qlux-service:nth-child(2) .qlux-service-icon{
    color:#ff9256;
}

.qlux-service:nth-child(3) .qlux-service-icon{
    color:#ffab72;
}

.qlux-service:nth-child(4) .qlux-service-icon{
    color:#ff8445;
}

.qlux-service:nth-child(5) .qlux-service-icon{
    color:#ff6b25;
}


.qlux-service:hover .qlux-service-icon{
    transform:translateY(-2px) scale(1.03);

    border-color:rgba(255,101,24,.65);

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.10),
        0 10px 30px rgba(255,101,24,.13);
}


/* text area */
.qlux-service > div{
    position:relative;
    z-index:2;

    display:flex;
    flex-direction:column;

    min-width:0;
    height:100%;
}


/* title */
.qlux-service strong{
    display:block;

    margin-top:2px;

    color:#f8f6f1;

    font-size:13px;
    font-weight:850;
    line-height:1.25;

    letter-spacing:-.15px;

    transition:color .25s ease;
}

.qlux-service:hover strong{
    color:#ffffff;
}


/* description */
.qlux-service small{
    display:block;

    margin-top:7px;
    min-height:0;

    color:#9ea8b6;

    font-size:9px;
    font-weight:500;
    line-height:1.55;

    transition:color .25s ease;
}

.qlux-service:hover small{
    color:#c8d0da;
}


/* arrow */
.qlux-service b{
    display:grid;
    place-items:center;

    width:31px;
    height:31px;

    margin-top:auto;
    padding:0;

    border:1px solid rgba(255,101,24,.62);
    border-radius:50%;

    background:rgba(7,17,31,.60);

    color:#ff792f;

    font-size:20px;
    font-weight:400;
    line-height:1;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05);

    transition:
        transform .25s ease,
        background .25s ease,
        color .25s ease,
        border-color .25s ease,
        box-shadow .25s ease;
}


.qlux-service:hover b{
    transform:translateX(3px);

    border-color:#ff6518;

    background:#ff6518;
    color:#fff;

    box-shadow:
        0 8px 24px rgba(255,101,24,.25);
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1050px){

    .qlux-service-strip{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:9px;
    }

    .qlux-service{
        min-height:132px;

        border-bottom:
            1px solid rgba(255,255,255,.075);
    }

    .qlux-service:last-child{
        grid-column:1 / -1;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:700px){

    .qlux-service-strip{
        display:grid;
        grid-template-columns:1fr;

        gap:8px;

        padding:8px;

        border-radius:18px;
    }

    .qlux-service{
        grid-template-columns:44px minmax(0,1fr);

        min-height:112px;

        gap:13px;

        padding:16px;

        border-right:
            1px solid rgba(255,255,255,.075) !important;
        border-bottom:
            1px solid rgba(255,255,255,.075);

        border-radius:13px;
    }

    .qlux-service:last-child{
        grid-column:auto;
    }

    .qlux-service-icon{
        width:42px;
        height:42px;

        border-radius:11px;

        font-size:22px;
    }

    .qlux-service strong{
        font-size:13px;
    }

    .qlux-service small{
        max-width:285px;

        font-size:9px;
        line-height:1.5;
    }

    .qlux-service b{
        width:29px;
        height:29px;

        margin-top:11px;

        font-size:18px;
    }

    .qlux-service:hover{
        transform:none;
    }
}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media(prefers-reduced-motion:reduce){

    .qlux-service,
    .qlux-service-icon,
    .qlux-service b{
        transition:none;
    }

    .qlux-service:hover{
        transform:none;
    }
}



/* =========================================================
   QAMZU — SERVICE ARROW COLOR UPGRADE
   ONLY affects the circular arrows
   ========================================================= */

.qlux-service b{
    width:42px;
    height:42px;

    margin-top:12px;

    border-width:1.5px;

    font-size:27px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.04),
            rgba(255,255,255,.01)
        );

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05),
        0 8px 18px rgba(0,0,0,.16);
}


/* Websites */
.qlux-service:nth-child(1) b{
    border-color:#ff6518;
    color:#ff6518;
}

.qlux-service:nth-child(1):hover b{
    background:#ff6518;
    color:#fff;
    box-shadow:0 8px 24px rgba(255,101,24,.32);
}


/* Business Portals */
.qlux-service:nth-child(2) b{
    border-color:#4687ff;
    color:#4687ff;
}

.qlux-service:nth-child(2):hover b{
    background:#4687ff;
    color:#fff;
    box-shadow:0 8px 24px rgba(70,135,255,.30);
}


/* Mobile Apps */
.qlux-service:nth-child(3) b{
    border-color:#24c15c;
    color:#24c15c;
}

.qlux-service:nth-child(3):hover b{
    background:#24c15c;
    color:#fff;
    box-shadow:0 8px 24px rgba(36,193,92,.28);
}


/* Custom Development */
.qlux-service:nth-child(4) b{
    border-color:#a440ed;
    color:#a440ed;
}

.qlux-service:nth-child(4):hover b{
    background:#a440ed;
    color:#fff;
    box-shadow:0 8px 24px rgba(164,64,237,.30);
}


/* Complete Solutions */
.qlux-service:nth-child(5) b{
    border-color:#f14b43;
    color:#f14b43;
}

.qlux-service:nth-child(5):hover b{
    background:#f14b43;
    color:#fff;
    box-shadow:0 8px 24px rgba(241,75,67,.30);
}


@media(max-width:700px){

    .qlux-service b{
        width:39px;
        height:39px;

        font-size:24px;
    }

}



/* =========================================================
   QAMZU — LUXURY INDUSTRY IMAGE CARDS V2
   ========================================================= */

.trust-strip{
    position:relative;

    padding:38px 0 48px;

    overflow:hidden;

    border-top:
        1px solid rgba(255,255,255,.07);

    border-bottom:
        1px solid rgba(255,255,255,.07);

    background:
        radial-gradient(
            circle at 12% -20%,
            rgba(255,101,24,.16),
            transparent 31%
        ),
        linear-gradient(
            135deg,
            #07111f 0%,
            #0b1424 52%,
            #121018 100%
        );
}


.trusted-label{
    margin:0 0 25px;

    color:#cdd3dc;

    text-align:center;

    font-size:10px;
    font-weight:900;

    letter-spacing:.19em;
}


.trust-items.qamzu-industry-grid{
    display:grid;

    grid-template-columns:
        repeat(6,minmax(0,1fr));

    gap:12px;

    text-align:left;
}


/* CARD */

.qamzu-industry-card{
    position:relative;

    display:block;

    height:220px;

    overflow:hidden;

    border:
        1px solid rgba(255,255,255,.13);

    border-radius:18px;

    background:#0b1424;

    text-decoration:none;

    box-shadow:
        0 18px 38px rgba(0,0,0,.30),
        inset 0 1px 0 rgba(255,255,255,.06);

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}


/* IMAGE */

.qamzu-industry-card img{
    position:absolute;
    inset:0;

    width:100%;
    height:100%;

    object-fit:cover;

    transform:scale(1.015);

    filter:
        brightness(.78)
        saturate(.9)
        contrast(1.05);

    transition:
        transform .6s ease,
        filter .4s ease;
}


/* DARK CINEMATIC OVERLAY */

.qamzu-industry-overlay{
    position:absolute;
    inset:0;

    background:
        linear-gradient(
            180deg,
            rgba(5,10,18,.02) 12%,
            rgba(5,10,18,.13) 35%,
            rgba(5,10,18,.90) 100%
        ),
        linear-gradient(
            120deg,
            rgba(255,101,24,.10),
            transparent 45%
        );
}


/* ORANGE LUXURY TOP LINE */

.qamzu-industry-card::before{
    content:"";

    position:absolute;
    z-index:4;

    top:0;
    left:18px;

    width:55px;
    height:2px;

    background:
        linear-gradient(
            90deg,
            #ff6518,
            #ffac76,
            transparent
        );

    box-shadow:
        0 0 16px rgba(255,101,24,.45);

    transition:width .35s ease;
}


/* CONTENT */

.qamzu-industry-copy{
    position:absolute;
    z-index:5;

    left:18px;
    right:18px;
    bottom:18px;

    display:flex;
    flex-direction:column;
}


.qamzu-industry-copy small{
    margin-bottom:6px;

    color:#ff9863;

    font-size:7px;
    font-weight:900;

    letter-spacing:.18em;
}


.qamzu-industry-copy strong{
    color:#ffffff;

    font-size:17px;
    font-weight:850;

    line-height:1.15;

    letter-spacing:-.35px;
}


.qamzu-industry-copy em{
    display:flex;

    align-items:center;

    gap:7px;

    max-height:0;

    margin-top:0;

    overflow:hidden;

    opacity:0;

    color:#cbd2dc;

    font-size:9px;
    font-style:normal;
    font-weight:650;

    transition:
        opacity .3s ease,
        margin-top .3s ease,
        max-height .3s ease;
}


.qamzu-industry-copy b{
    color:#ff6518;

    font-size:16px;

    transition:
        transform .3s ease;
}


/* HOVER */

.qamzu-industry-card:hover{
    transform:
        translateY(-7px);

    border-color:
        rgba(255,115,46,.52);

    box-shadow:
        0 28px 60px rgba(0,0,0,.38),
        0 0 32px rgba(255,101,24,.11),
        inset 0 1px 0 rgba(255,255,255,.09);
}


.qamzu-industry-card:hover img{
    transform:
        scale(1.09);

    filter:
        brightness(.90)
        saturate(1.03)
        contrast(1.06);
}


.qamzu-industry-card:hover::before{
    width:calc(100% - 36px);
}


.qamzu-industry-card:hover
.qamzu-industry-copy em{
    max-height:25px;

    margin-top:9px;

    opacity:1;
}


.qamzu-industry-card:hover
.qamzu-industry-copy b{
    transform:
        translateX(4px);
}


/* TABLET */

@media(max-width:1100px){

    .trust-items.qamzu-industry-grid{
        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }

    .qamzu-industry-card{
        height:235px;
    }

}


/* MOBILE */

@media(max-width:620px){

    .trust-strip{
        padding:
            32px 0 38px;
    }

    .trust-items.qamzu-industry-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap:9px;
    }

    .qamzu-industry-card{
        height:185px;

        border-radius:14px;
    }

    .qamzu-industry-copy{
        left:14px;
        right:14px;
        bottom:14px;
    }

    .qamzu-industry-copy strong{
        font-size:14px;
    }

    .qamzu-industry-copy em{
        display:none;
    }

    .qamzu-industry-card:hover{
        transform:none;
    }

}


/* EXTRA SMALL MOBILE */

@media(max-width:390px){

    .trust-items.qamzu-industry-grid{
        grid-template-columns:1fr;
    }

    .qamzu-industry-card{
        height:215px;
    }

}



/* =========================================================
   QAMZU — LUXURY CATEGORY STRIP POLISH V3
   Keeps current images, upgrades only the area styling
   ========================================================= */

.trust-strip{
    position:relative;
    padding:42px 0 56px !important;
    overflow:hidden;

    border-top:1px solid rgba(255,255,255,.06);
    border-bottom:1px solid rgba(255,255,255,.06);

    background:
        radial-gradient(
            circle at 12% -10%,
            rgba(255,101,24,.14),
            transparent 28%
        ),
        radial-gradient(
            circle at 88% 110%,
            rgba(255,165,84,.07),
            transparent 26%
        ),
        linear-gradient(
            135deg,
            #07111F 0%,
            #0B1424 54%,
            #121018 100%
        );
}

.trust-strip::before{
    content:"";
    position:absolute;
    top:0;
    left:10%;
    right:10%;
    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,101,24,.75),
            rgba(255,190,120,.35),
            transparent
        );

    box-shadow:
        0 0 20px rgba(255,101,24,.22);
}

.trust-strip .container{
    width:min(100% - 34px, 1550px) !important;
}

.trusted-label{
    margin:0 0 24px !important;

    color:#cfd5df !important;

    text-align:center !important;

    font-size:11px !important;
    font-weight:900 !important;
    letter-spacing:.17em !important;
    line-height:1.5 !important;
    text-transform:uppercase !important;
}


/* =========================================================
   GRID
   ========================================================= */

.trust-strip .trust-items.qamzu-industry-grid{
    display:grid !important;
    grid-template-columns:repeat(6, minmax(0,1fr)) !important;
    gap:16px !important;

    margin:0 !important;
    padding:0 !important;

    text-align:left !important;
}


/* =========================================================
   CARD
   ========================================================= */

.trust-strip .qamzu-industry-card{
    position:relative !important;
    display:block !important;

    min-width:0 !important;
    min-height:255px !important;

    overflow:hidden !important;

    border:1px solid rgba(255,255,255,.12) !important;
    border-radius:18px !important;

    background:#0b1424 !important;

    text-decoration:none !important;

    box-shadow:
        0 18px 42px rgba(0,0,0,.28),
        inset 0 1px 0 rgba(255,255,255,.06) !important;

    isolation:isolate !important;

    transition:
        transform .32s ease,
        border-color .32s ease,
        box-shadow .32s ease !important;
}

.trust-strip .qamzu-industry-card::before{
    content:"";
    position:absolute;
    z-index:4;

    top:0;
    left:18px;
    width:62px;
    height:2px;

    background:
        linear-gradient(
            90deg,
            #ff6518,
            rgba(255,190,120,.72),
            transparent
        );

    box-shadow:
        0 0 16px rgba(255,101,24,.32);

    transition:
        width .32s ease !important;
}

.trust-strip .qamzu-industry-card::after{
    content:"";
    position:absolute;
    z-index:1;

    right:-42px;
    bottom:-48px;
    width:120px;
    height:120px;

    border-radius:50%;

    background:rgba(255,101,24,.18);
    filter:blur(34px);
    opacity:.35;

    transition:opacity .32s ease !important;
}


/* =========================================================
   IMAGE
   ========================================================= */

.trust-strip .qamzu-industry-card img{
    position:absolute !important;
    inset:0 !important;

    display:block !important;
    width:100% !important;
    height:100% !important;

    object-fit:cover !important;

    transform:scale(1.02) !important;

    filter:
        brightness(.80)
        saturate(.95)
        contrast(1.05) !important;

    transition:
        transform .6s ease,
        filter .35s ease !important;
}


/* =========================================================
   OVERLAY
   ========================================================= */

.trust-strip .qamzu-industry-overlay{
    position:absolute !important;
    inset:0 !important;
    z-index:2 !important;

    background:
        linear-gradient(
            180deg,
            rgba(5,10,18,.02) 8%,
            rgba(5,10,18,.12) 32%,
            rgba(5,10,18,.92) 100%
        ),
        linear-gradient(
            120deg,
            rgba(255,101,24,.10),
            transparent 46%
        ) !important;
}


/* =========================================================
   COPY
   ========================================================= */

.trust-strip .qamzu-industry-copy{
    position:absolute !important;
    z-index:5 !important;

    left:18px !important;
    right:18px !important;
    bottom:18px !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
}

.trust-strip .qamzu-industry-copy small{
    display:block !important;

    margin:0 0 7px !important;

    color:#ff9b69 !important;

    font-size:8px !important;
    font-weight:900 !important;
    letter-spacing:.18em !important;
    line-height:1.4 !important;
    text-transform:uppercase !important;
}

.trust-strip .qamzu-industry-copy strong{
    display:block !important;

    color:#ffffff !important;

    font-size:19px !important;
    font-weight:850 !important;
    line-height:1.14 !important;
    letter-spacing:-.4px !important;
}

.trust-strip .qamzu-industry-copy em{
    display:flex !important;
    align-items:center !important;
    gap:7px !important;

    margin-top:11px !important;

    color:#d8dde6 !important;

    font-size:11px !important;
    font-style:normal !important;
    font-weight:650 !important;
    line-height:1.3 !important;
    opacity:.95 !important;
}

.trust-strip .qamzu-industry-copy b{
    color:#ff6518 !important;
    font-size:17px !important;
    font-weight:600 !important;

    transition:
        transform .28s ease !important;
}


/* =========================================================
   HOVER
   ========================================================= */

.trust-strip .qamzu-industry-card:hover{
    transform:translateY(-7px) !important;

    border-color:rgba(255,125,56,.48) !important;

    box-shadow:
        0 28px 58px rgba(0,0,0,.34),
        0 0 26px rgba(255,101,24,.10),
        inset 0 1px 0 rgba(255,255,255,.09) !important;
}

.trust-strip .qamzu-industry-card:hover::before{
    width:calc(100% - 36px) !important;
}

.trust-strip .qamzu-industry-card:hover::after{
    opacity:.72 !important;
}

.trust-strip .qamzu-industry-card:hover img{
    transform:scale(1.08) !important;

    filter:
        brightness(.91)
        saturate(1.03)
        contrast(1.06) !important;
}

.trust-strip .qamzu-industry-card:hover .qamzu-industry-copy b{
    transform:translateX(4px) !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1180px){

    .trust-strip .trust-items.qamzu-industry-grid{
        grid-template-columns:repeat(3, minmax(0,1fr)) !important;
    }

    .trust-strip .qamzu-industry-card{
        min-height:250px !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:700px){

    .trust-strip{
        padding:32px 0 40px !important;
    }

    .trusted-label{
        margin-bottom:18px !important;
        font-size:10px !important;
    }

    .trust-strip .trust-items.qamzu-industry-grid{
        grid-template-columns:repeat(2, minmax(0,1fr)) !important;
        gap:10px !important;
    }

    .trust-strip .qamzu-industry-card{
        min-height:185px !important;
        border-radius:15px !important;
    }

    .trust-strip .qamzu-industry-copy{
        left:14px !important;
        right:14px !important;
        bottom:14px !important;
    }

    .trust-strip .qamzu-industry-copy small{
        font-size:7px !important;
        margin-bottom:5px !important;
    }

    .trust-strip .qamzu-industry-copy strong{
        font-size:15px !important;
    }

    .trust-strip .qamzu-industry-copy em{
        margin-top:8px !important;
        font-size:10px !important;
    }

    .trust-strip .qamzu-industry-card:hover{
        transform:none !important;
    }

}


/* =========================================================
   EXTRA SMALL
   ========================================================= */

@media(max-width:420px){

    .trust-strip .trust-items.qamzu-industry-grid{
        grid-template-columns:1fr !important;
    }

    .trust-strip .qamzu-industry-card{
        min-height:210px !important;
    }

}



/* =========================================================
   QAMZU — SERVICES LUXURY DARK MATCH V1
   Matches the luxury category strip above
   ========================================================= */

#services.section{
    position:relative;

    padding-top:92px !important;
    padding-bottom:110px !important;

    overflow:hidden;

    background:
        radial-gradient(
            circle at 12% 4%,
            rgba(255,101,24,.12),
            transparent 27%
        ),
        radial-gradient(
            circle at 86% 92%,
            rgba(255,166,91,.06),
            transparent 27%
        ),
        linear-gradient(
            135deg,
            #07111F 0%,
            #0B1424 54%,
            #111019 100%
        ) !important;

    color:#fff;
}


/* subtle divider glow from previous section */
#services.section::before{
    content:"";

    position:absolute;

    top:0;
    left:12%;
    right:12%;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,101,24,.58),
            rgba(255,190,120,.28),
            transparent
        );

    box-shadow:
        0 0 22px rgba(255,101,24,.14);
}


/* =========================================================
   HEADING
   ========================================================= */

#services .section-label{
    color:#ff8b50 !important;
}

#services .section-heading h2{
    color:#f8f6f1 !important;

    text-shadow:
        0 1px 0 rgba(255,255,255,.02);
}

#services .split-heading > p{
    color:#aeb7c5 !important;
}


/* =========================================================
   GRID
   ========================================================= */

#services .service-grid{
    gap:18px !important;
}


/* =========================================================
   ALL CARDS
   ========================================================= */

#services .service-card{
    border:
        1px solid rgba(255,255,255,.10) !important;

    border-radius:20px !important;

    box-shadow:
        0 18px 42px rgba(0,0,0,.24),
        inset 0 1px 0 rgba(255,255,255,.04);

    transition:
        transform .28s ease,
        border-color .28s ease,
        box-shadow .28s ease,
        background .28s ease !important;
}


/* =========================================================
   LARGE FEATURE CARD
   ========================================================= */

#services .feature-large{
    position:relative;

    min-height:520px !important;

    border-color:
        rgba(255,101,24,.16) !important;

    background:
        radial-gradient(
            circle at 92% 5%,
            rgba(255,101,24,.15),
            transparent 28%
        ),
        linear-gradient(
            145deg,
            #0c1626 0%,
            #111a2b 58%,
            #17131a 100%
        ) !important;

    box-shadow:
        0 24px 60px rgba(0,0,0,.30),
        inset 0 1px 0 rgba(255,255,255,.06) !important;
}

#services .feature-large::before{
    width:250px !important;
    height:250px !important;

    right:-95px !important;
    top:-105px !important;

    background:
        rgba(255,101,24,.20) !important;

    filter:blur(55px) !important;
}


/* luxury top line */
#services .feature-large::after{
    content:"";

    position:absolute;
    z-index:4;

    top:0;
    left:28px;

    width:95px;
    height:2px;

    background:
        linear-gradient(
            90deg,
            #ff6518,
            rgba(255,186,112,.65),
            transparent
        );

    box-shadow:
        0 0 18px rgba(255,101,24,.28);
}


/* feature typography */
#services .feature-large .service-number{
    color:#ff9a67 !important;
}

#services .feature-large h3{
    color:#ffffff !important;
}

#services .feature-large > p{
    color:#b6bfcc !important;
}


/* showcase frame */
#services .service-showcase{
    border:
        1px solid rgba(255,255,255,.10);

    box-shadow:
        0 -14px 38px rgba(0,0,0,.20),
        inset 0 1px 0 rgba(255,255,255,.04);

    background:#111b2b !important;
}


/* =========================================================
   SMALL CARDS
   ========================================================= */

#services .service-card:not(.feature-large){
    position:relative;

    justify-content:center !important;

    min-height:245px !important;

    padding:30px !important;

    overflow:hidden;

    border-color:
        rgba(255,255,255,.09) !important;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.045) 0%,
            rgba(255,255,255,.018) 100%
        ) !important;

    backdrop-filter:blur(12px);
}


/* subtle glow in each card */
#services .service-card:not(.feature-large)::before{
    content:"";

    position:absolute;

    width:145px;
    height:145px;

    right:-58px;
    bottom:-65px;

    border-radius:50%;

    background:
        rgba(255,101,24,.11);

    filter:blur(40px);

    opacity:.55;

    pointer-events:none;
}


/* orange top detail */
#services .service-card:not(.feature-large)::after{
    content:"";

    position:absolute;

    top:0;
    left:29px;

    width:45px;
    height:1px;

    background:
        linear-gradient(
            90deg,
            #ff6518,
            rgba(255,101,24,.12)
        );

    opacity:.65;

    transition:
        width .28s ease,
        opacity .28s ease;
}


/* =========================================================
   SMALL CARD ICON
   ========================================================= */

#services .service-icon{
    position:relative;
    z-index:2;

    width:48px !important;
    height:48px !important;

    margin-bottom:8px !important;

    border:
        1px solid rgba(255,101,24,.24);

    border-radius:13px !important;

    background:
        linear-gradient(
            145deg,
            rgba(255,101,24,.13),
            rgba(255,255,255,.025)
        ) !important;

    color:#ff7a36 !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.06),
        0 10px 24px rgba(0,0,0,.16) !important;
}


/* =========================================================
   SMALL CARD TYPOGRAPHY
   ========================================================= */

#services .service-card:not(.feature-large) h3{
    position:relative;
    z-index:2;

    color:#f7f5f0 !important;

    font-size:22px !important;
}

#services .service-card:not(.feature-large) p{
    position:relative;
    z-index:2;

    max-width:310px !important;

    color:#aeb7c5 !important;

    line-height:1.72 !important;
}


/* =========================================================
   HOVER
   ========================================================= */

#services .service-card:not(.feature-large):hover{
    transform:translateY(-6px) !important;

    border-color:
        rgba(255,101,24,.35) !important;

    background:
        linear-gradient(
            145deg,
            rgba(255,101,24,.075),
            rgba(255,255,255,.025)
        ) !important;

    box-shadow:
        0 26px 58px rgba(0,0,0,.31),
        0 0 28px rgba(255,101,24,.07),
        inset 0 1px 0 rgba(255,255,255,.065) !important;
}

#services .service-card:not(.feature-large):hover::after{
    width:calc(100% - 58px);
    opacity:1;
}

#services .service-card:not(.feature-large):hover .service-icon{
    border-color:
        rgba(255,101,24,.52);

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.08),
        0 12px 30px rgba(255,101,24,.12) !important;
}


/* =========================================================
   WEBSITE PREVIEW INSIDE LARGE CARD
   Keep preview readable/light
   ========================================================= */

#services .service-browser{
    box-shadow:
        0 18px 48px rgba(0,0,0,.28) !important;

    border:
        1px solid rgba(255,255,255,.16);
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1050px){

    #services.section{
        padding-top:80px !important;
    }

    #services .feature-large{
        min-height:560px !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:620px){

    #services.section{
        padding-top:68px !important;
        padding-bottom:78px !important;
    }

    #services .section-heading{
        margin-bottom:30px !important;
    }

    #services .feature-large{
        min-height:555px !important;

        padding:25px !important;

        border-radius:18px !important;
    }

    #services .service-card:not(.feature-large){
        min-height:210px !important;

        padding:25px !important;

        border-radius:17px !important;
    }

    #services .service-card:not(.feature-large):hover{
        transform:none !important;
    }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media(prefers-reduced-motion:reduce){

    #services .service-card{
        transition:none !important;
    }

}



/* =========================================================
   QAMZU — SERVICE MINI VISUALS V1
   ========================================================= */

#services .service-card:not(.feature-large){
    justify-content:flex-start !important;
    padding-bottom:18px !important;
}


/* visual panel */
#services .service-mini-visual{
    position:relative;

    width:100%;
    height:112px;

    margin-top:auto;
    padding-top:18px;

    overflow:hidden;
}


/* framed image */
#services .service-mini-visual img{
    display:block;

    width:100%;
    height:100%;

    object-fit:cover;

    border:
        1px solid rgba(255,255,255,.10);

    border-radius:13px;

    filter:
        brightness(.88)
        saturate(.95)
        contrast(1.04);

    box-shadow:
        0 12px 28px rgba(0,0,0,.24),
        inset 0 1px 0 rgba(255,255,255,.05);

    transition:
        transform .35s ease,
        filter .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}


/* subtle orange edge glow */
#services .service-mini-visual::before{
    content:"";

    position:absolute;
    z-index:2;

    top:18px;
    left:16px;

    width:55px;
    height:1px;

    background:
        linear-gradient(
            90deg,
            #ff6518,
            rgba(255,182,110,.55),
            transparent
        );

    box-shadow:
        0 0 12px rgba(255,101,24,.28);

    pointer-events:none;
}


/* hover */
#services .service-card:not(.feature-large):hover
.service-mini-visual img{
    transform:scale(1.025);

    filter:
        brightness(.98)
        saturate(1.02)
        contrast(1.04);

    border-color:
        rgba(255,101,24,.28);

    box-shadow:
        0 16px 34px rgba(0,0,0,.30),
        0 0 22px rgba(255,101,24,.08);
}


/* desktop height balance */
#services .service-card:not(.feature-large){
    min-height:315px !important;
}


/* tablet */
@media(max-width:1050px){

    #services .service-mini-visual{
        height:125px;
    }

}


/* mobile */
@media(max-width:620px){

    #services .service-card:not(.feature-large){
        min-height:290px !important;
    }

    #services .service-mini-visual{
        height:120px;
        padding-top:15px;
    }

    #services .service-mini-visual::before{
        top:15px;
    }

}



/* =========================================================
   QAMZU — SERVICE MINI IMAGE FIT FIX V2
   Full image visible, no aggressive cropping
   ========================================================= */

#services .service-mini-visual{
    height:150px !important;

    padding-top:18px !important;

    overflow:visible !important;
}


/* create a proper framed viewport */
#services .service-mini-visual img{
    width:100% !important;
    height:132px !important;

    object-fit:contain !important;
    object-position:center center !important;

    padding:6px !important;

    box-sizing:border-box !important;

    border:
        1px solid rgba(255,255,255,.10) !important;

    border-radius:14px !important;

    background:
        radial-gradient(
            circle at 50% 45%,
            rgba(255,101,24,.07),
            transparent 48%
        ),
        #090f19 !important;

    filter:none !important;

    transform:none !important;

    box-shadow:
        0 14px 30px rgba(0,0,0,.28),
        inset 0 1px 0 rgba(255,255,255,.045) !important;
}


/* keep hover elegant without zoom/cropping */
#services .service-card:not(.feature-large):hover
.service-mini-visual img{
    transform:translateY(-2px) !important;

    filter:none !important;

    border-color:
        rgba(255,101,24,.30) !important;

    box-shadow:
        0 18px 38px rgba(0,0,0,.32),
        0 0 22px rgba(255,101,24,.08),
        inset 0 1px 0 rgba(255,255,255,.06) !important;
}


/* cards slightly taller to give images breathing room */
#services .service-card:not(.feature-large){
    min-height:345px !important;
}


/* tablet */
@media(max-width:1050px){

    #services .service-mini-visual{
        height:158px !important;
    }

    #services .service-mini-visual img{
        height:140px !important;
    }

}


/* mobile */
@media(max-width:620px){

    #services .service-card:not(.feature-large){
        min-height:325px !important;
    }

    #services .service-mini-visual{
        height:145px !important;
        padding-top:15px !important;
    }

    #services .service-mini-visual img{
        height:130px !important;
        padding:5px !important;
    }

}



/* =========================================================
   QAMZU — COMPACT SERVICE CARDS V3
   Remove icons + reduce wasted vertical space
   ========================================================= */


/* REMOVE ICONS FROM THE FOUR SMALL CARDS ONLY */
#services .service-card:not(.feature-large) .service-icon{
    display:none !important;
}


/* SHORTER, CLEANER CARDS */
#services .service-card:not(.feature-large){
    min-height:255px !important;

    padding:
        24px 24px 18px !important;

    justify-content:flex-start !important;
}


/* TITLE MOVES UP */
#services .service-card:not(.feature-large) h3{
    margin:
        0 0 10px !important;

    font-size:22px !important;
    line-height:1.2 !important;
}


/* DESCRIPTION */
#services .service-card:not(.feature-large) p{
    margin:0 !important;

    max-width:100% !important;

    font-size:14px !important;
    line-height:1.55 !important;
}


/* COMPACT IMAGE AREA */
#services .service-mini-visual{
    width:100% !important;
    height:112px !important;

    margin-top:auto !important;
    padding-top:14px !important;

    overflow:visible !important;
}


/* KEEP FULL GENERATED IMAGE VISIBLE */
#services .service-mini-visual img{
    width:100% !important;
    height:98px !important;

    padding:5px !important;

    object-fit:contain !important;
    object-position:center !important;

    box-sizing:border-box !important;

    border-radius:12px !important;
}


/* MOVE ORANGE IMAGE ACCENT TO NEW POSITION */
#services .service-mini-visual::before{
    top:14px !important;
}


/* CLEANER TOP ACCENT */
#services .service-card:not(.feature-large)::after{
    left:24px !important;

    width:52px !important;
}


/* HOVER ACCENT */
#services .service-card:not(.feature-large):hover::after{
    width:calc(100% - 48px) !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1050px){

    #services .service-card:not(.feature-large){
        min-height:260px !important;
    }

    #services .service-mini-visual{
        height:116px !important;
    }

    #services .service-mini-visual img{
        height:102px !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:620px){

    #services .service-card:not(.feature-large){
        min-height:245px !important;

        padding:
            21px 20px 16px !important;
    }

    #services .service-card:not(.feature-large) h3{
        font-size:20px !important;
    }

    #services .service-card:not(.feature-large) p{
        font-size:13px !important;
    }

    #services .service-mini-visual{
        height:105px !important;

        padding-top:12px !important;
    }

    #services .service-mini-visual img{
        height:93px !important;
    }

    #services .service-mini-visual::before{
        top:12px !important;
    }

}



/* =========================================================
   QAMZU — SMALL SERVICE CARD LAYOUT POLISH V4
   ========================================================= */

#services .service-card:not(.feature-large){
    display:grid !important;

    grid-template-rows:
        auto
        auto
        minmax(0,1fr) !important;

    align-content:start !important;

    min-height:285px !important;

    padding:
        24px 24px 18px !important;
}


/* TITLE */
#services .service-card:not(.feature-large) h3{
    margin:
        0 0 8px !important;

    max-width:90% !important;

    color:#f8f6f1 !important;

    font-size:21px !important;
    font-weight:850 !important;
    line-height:1.15 !important;

    letter-spacing:-.35px !important;
}


/* DESCRIPTION */
#services .service-card:not(.feature-large) p{
    margin:0 !important;

    max-width:92% !important;

    color:#aeb7c5 !important;

    font-size:13px !important;
    line-height:1.5 !important;
}


/* IMAGE AREA GETS ITS OWN SPACE */
#services .service-mini-visual{
    align-self:end !important;

    width:100% !important;
    height:125px !important;

    margin-top:18px !important;
    padding-top:0 !important;
}


/* IMAGE */
#services .service-mini-visual img{
    width:100% !important;
    height:125px !important;

    padding:5px !important;

    object-fit:contain !important;
    object-position:center center !important;

    border-radius:13px !important;

    background:
        radial-gradient(
            circle at 50% 45%,
            rgba(255,101,24,.055),
            transparent 50%
        ),
        #080f18 !important;
}


/* MOVE MINI ACCENT TO IMAGE TOP */
#services .service-mini-visual::before{
    top:0 !important;

    left:18px !important;

    width:52px !important;
}


/* =========================================================
   INDIVIDUAL TEXT WIDTH TUNING
   ========================================================= */

#services .service-card:nth-child(2) p{
    max-width:88% !important;
}

#services .service-card:nth-child(3) p{
    max-width:90% !important;
}

#services .service-card:nth-child(4) p{
    max-width:86% !important;
}

#services .service-card:nth-child(5) p{
    max-width:82% !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1050px){

    #services .service-card:not(.feature-large){
        min-height:300px !important;
    }

    #services .service-mini-visual{
        height:135px !important;
    }

    #services .service-mini-visual img{
        height:135px !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:620px){

    #services .service-card:not(.feature-large){
        min-height:270px !important;

        padding:
            21px 20px 16px !important;
    }

    #services .service-card:not(.feature-large) h3{
        font-size:19px !important;
    }

    #services .service-card:not(.feature-large) p{
        max-width:100% !important;

        font-size:13px !important;
        line-height:1.45 !important;
    }

    #services .service-mini-visual{
        height:120px !important;

        margin-top:15px !important;
    }

    #services .service-mini-visual img{
        height:120px !important;
    }

}



/* =========================================================
   QAMZU — LUXURY WEBSITE EXAMPLES V1
   ========================================================= */

#portfolio.portfolio-section{
    position:relative;

    padding-top:100px !important;
    padding-bottom:90px !important;

    overflow:hidden;

    background:
        radial-gradient(
            circle at 10% 0%,
            rgba(255,101,24,.12),
            transparent 28%
        ),
        radial-gradient(
            circle at 92% 85%,
            rgba(255,151,72,.065),
            transparent 27%
        ),
        linear-gradient(
            135deg,
            #07111f 0%,
            #0b1424 54%,
            #111019 100%
        ) !important;
}


/* luxury divider */
#portfolio.portfolio-section::before{
    content:"";

    position:absolute;
    top:0;
    left:10%;
    right:10%;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,101,24,.72),
            rgba(255,190,120,.34),
            transparent
        );

    box-shadow:
        0 0 24px rgba(255,101,24,.17);
}


/* soft ambient glow */
#portfolio.portfolio-section::after{
    content:"";

    position:absolute;

    width:520px;
    height:520px;

    right:-220px;
    top:120px;

    border-radius:50%;

    background:
        rgba(255,101,24,.055);

    filter:blur(90px);

    pointer-events:none;
}


/* =========================================================
   SECTION HEADING
   ========================================================= */

#portfolio .section-heading{
    position:relative;
    z-index:2;

    margin-bottom:48px !important;
}


#portfolio .section-label{
    color:#ff8c52 !important;
}


#portfolio .section-heading h2{
    color:#f8f6f1 !important;

    max-width:780px;

    margin-left:auto;
    margin-right:auto;
}


#portfolio .section-heading p{
    color:#aeb7c5 !important;

    max-width:680px;

    margin-left:auto;
    margin-right:auto;

    line-height:1.7;
}


/* =========================================================
   MOCKUP GRID
   ========================================================= */

#portfolio .mockup-portfolio-grid{
    position:relative;
    z-index:2;

    gap:20px !important;
}


/* =========================================================
   OUTER CARD
   ========================================================= */

#portfolio .website-card{
    position:relative;

    border-radius:24px !important;

    transition:
        transform .34s ease,
        filter .34s ease !important;
}


/* very subtle outer glow */
#portfolio .website-card::before{
    content:"";

    position:absolute;
    z-index:-1;

    inset:10px;

    border-radius:24px;

    background:
        rgba(255,101,24,.10);

    filter:blur(28px);

    opacity:0;

    transition:
        opacity .34s ease;
}


#portfolio .website-card:hover::before{
    opacity:.50;
}


/* =========================================================
   PREMIUM BROWSER FRAME
   ========================================================= */

#portfolio .website-frame{
    position:relative;

    border:
        1px solid rgba(255,255,255,.13) !important;

    border-radius:22px !important;

    background:#0c1421 !important;

    box-shadow:
        0 26px 60px rgba(0,0,0,.32),
        0 8px 22px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.06) !important;
}


/* warm premium top accent */
#portfolio .website-frame::before{
    content:"";

    position:absolute;
    z-index:8;

    top:0;
    left:24px;

    width:78px;
    height:1px;

    background:
        linear-gradient(
            90deg,
            #ff6518,
            rgba(255,185,109,.65),
            transparent
        );

    box-shadow:
        0 0 14px rgba(255,101,24,.28);

    pointer-events:none;

    transition:
        width .35s ease;
}


#portfolio .website-card:hover .website-frame::before{
    width:calc(100% - 48px);
}


/* =========================================================
   BROWSER BAR
   ========================================================= */

#portfolio .website-bar{
    min-height:46px !important;

    background:
        linear-gradient(
            180deg,
            #111a29,
            #0d1624
        ) !important;

    border-bottom:
        1px solid rgba(255,255,255,.08) !important;
}


#portfolio .website-dots span{
    background:#556071 !important;
}


#portfolio .website-dots span:first-child{
    background:#ff6518 !important;
}


#portfolio .website-dots span:nth-child(2){
    background:#d9944e !important;
}


#portfolio .website-dots span:nth-child(3){
    background:#6f7a89 !important;
}


/* browser URL */
#portfolio .website-url{
    border:
        1px solid rgba(255,255,255,.08) !important;

    background:
        rgba(255,255,255,.045) !important;

    color:#8f9aaa !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.025);
}


/* =========================================================
   WEBSITE CONTENT AREA
   Keep the actual demo readable
   ========================================================= */

#portfolio .website-body{
    background:#f7f8fb !important;
}


/* =========================================================
   MOCKUP NAV
   ========================================================= */

#portfolio .mockup-nav{
    padding:
        5px 3px 14px !important;
}


#portfolio .mockup-nav strong{
    color:#121a28 !important;
}


#portfolio .mockup-nav span{
    color:#778295 !important;
}


/* =========================================================
   HERO IMAGE
   ========================================================= */

#portfolio .mockup-hero{
    border:
        1px solid rgba(15,23,42,.08);

    box-shadow:
        0 14px 32px rgba(15,23,42,.10);
}


/* warmer luxury overlay */
#portfolio .mockup-hero::before{
    background:
        linear-gradient(
            180deg,
            rgba(7,17,31,.02) 0%,
            rgba(7,17,31,.15) 38%,
            rgba(7,17,31,.88) 100%
        ) !important;
}


#portfolio .mockup-hero-overlay small{
    color:#ff9a67 !important;
}


#portfolio .mockup-hero-overlay button{
    border:
        1px solid rgba(255,255,255,.08) !important;

    background:
        linear-gradient(
            135deg,
            #ff6518,
            #e9530e
        ) !important;

    box-shadow:
        0 10px 25px rgba(255,101,24,.26) !important;
}


/* =========================================================
   FEATURE ROWS INSIDE EXAMPLES
   ========================================================= */

#portfolio .mockup-feature-row div{
    border:
        1px solid #e8edf3 !important;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f5f7fa
        ) !important;

    box-shadow:
        0 7px 18px rgba(15,23,42,.045);
}


/* =========================================================
   LARGE CONTRACTOR BOTTOM PANELS
   ========================================================= */

#portfolio .mockup-bottom-band{
    gap:12px;
}


#portfolio .mockup-proof-card,
#portfolio .mockup-conversion-card{
    border:
        1px solid #e7ecf2;

    box-shadow:
        0 7px 20px rgba(15,23,42,.045);
}


/* =========================================================
   HOVER
   ========================================================= */

#portfolio .website-card:hover .website-frame{
    transform:
        translateY(-7px) !important;

    border-color:
        rgba(255,120,52,.35) !important;

    box-shadow:
        0 34px 75px rgba(0,0,0,.38),
        0 0 30px rgba(255,101,24,.065),
        inset 0 1px 0 rgba(255,255,255,.075) !important;
}


#portfolio .website-card:hover .mockup-hero::after{
    transform:
        scale(1.065) !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1050px){

    #portfolio.portfolio-section{
        padding-top:85px !important;
        padding-bottom:75px !important;
    }

    #portfolio .mockup-portfolio-grid{
        gap:18px !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:700px){

    #portfolio.portfolio-section{
        padding-top:70px !important;
        padding-bottom:58px !important;
    }

    #portfolio .section-heading{
        margin-bottom:34px !important;
    }

    #portfolio .website-frame{
        border-radius:18px !important;
    }

    #portfolio .website-card:hover .website-frame{
        transform:none !important;
    }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media(prefers-reduced-motion:reduce){

    #portfolio .website-frame,
    #portfolio .website-card::before,
    #portfolio .website-frame::before{
        transition:none !important;
    }

}



/* =========================================================
   QAMZU — WHAT WE BUILD LUXURY V1
   ========================================================= */

#what-we-build.what-we-build{
    position:relative;

    padding:100px 0 110px !important;

    overflow:hidden;

    background:
        radial-gradient(
            circle at 10% 0%,
            rgba(255,101,24,.12),
            transparent 27%
        ),
        radial-gradient(
            circle at 90% 100%,
            rgba(255,166,91,.06),
            transparent 28%
        ),
        linear-gradient(
            135deg,
            #07111f 0%,
            #0b1424 55%,
            #111019 100%
        ) !important;

    color:#fff;
}


#what-we-build.what-we-build::before{
    content:"";

    position:absolute;
    top:0;
    left:10%;
    right:10%;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,101,24,.70),
            rgba(255,190,120,.30),
            transparent
        );

    box-shadow:
        0 0 22px rgba(255,101,24,.17);
}


/* =========================================================
   HEADING
   ========================================================= */

#what-we-build .what-we-build-heading{
    position:relative;
    z-index:2;

    max-width:900px;

    margin-bottom:48px;
}


#what-we-build .what-we-build-eyebrow{
    color:#ff8c52 !important;

    font-size:11px;
    font-weight:900;
    letter-spacing:.16em;
}


#what-we-build .what-we-build-heading h2{
    margin:12px 0 18px;

    color:#f8f6f1 !important;

    font-size:clamp(42px,5vw,68px);
    line-height:1.02;
    letter-spacing:-3px;
}


#what-we-build .what-we-build-heading h2 > span{
    display:block;

    color:#ff6518 !important;

    text-shadow:
        0 8px 28px rgba(255,101,24,.12);
}


#what-we-build .what-we-build-heading p{
    max-width:760px;

    margin:0;

    color:#aeb7c5 !important;

    font-size:17px;
    line-height:1.75;
}


/* =========================================================
   GRID
   ========================================================= */

#what-we-build .what-we-build-grid{
    position:relative;
    z-index:2;

    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;

    gap:18px !important;
}


/* =========================================================
   CARDS
   ========================================================= */

#what-we-build .build-service-card{
    position:relative;

    display:flex !important;
    flex-direction:column;

    min-height:245px;

    padding:28px !important;

    overflow:hidden;

    border:
        1px solid rgba(255,255,255,.10) !important;

    border-radius:20px !important;

    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(255,101,24,.08),
            transparent 32%
        ),
        linear-gradient(
            145deg,
            rgba(255,255,255,.045),
            rgba(255,255,255,.015)
        ) !important;

    color:#fff !important;
    text-decoration:none;

    box-shadow:
        0 20px 45px rgba(0,0,0,.22),
        inset 0 1px 0 rgba(255,255,255,.05);

    transition:
        transform .28s ease,
        border-color .28s ease,
        box-shadow .28s ease,
        background .28s ease !important;
}


/* orange top line */
#what-we-build .build-service-card::before{
    content:"";

    position:absolute;

    top:0;
    left:28px;

    width:58px;
    height:1px;

    background:
        linear-gradient(
            90deg,
            #ff6518,
            rgba(255,185,109,.62),
            transparent
        );

    box-shadow:
        0 0 15px rgba(255,101,24,.24);

    transition:
        width .28s ease;
}


/* subtle glow */
#what-we-build .build-service-card::after{
    content:"";

    position:absolute;

    width:150px;
    height:150px;

    right:-65px;
    bottom:-70px;

    border-radius:50%;

    background:
        rgba(255,101,24,.10);

    filter:blur(40px);

    pointer-events:none;
}


/* =========================================================
   NUMBER
   ========================================================= */

#what-we-build .build-service-number{
    display:grid;
    place-items:center;

    width:48px;
    height:48px;

    margin-bottom:30px;

    border:
        1px solid rgba(255,101,24,.24);

    border-radius:13px;

    background:
        linear-gradient(
            145deg,
            rgba(255,101,24,.14),
            rgba(255,255,255,.025)
        );

    color:#ff7a36 !important;

    font-size:11px;
    font-weight:900;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05),
        0 8px 18px rgba(0,0,0,.14);
}


/* =========================================================
   TEXT
   ========================================================= */

#what-we-build .build-service-card h3{
    margin:0 0 10px !important;

    color:#f8f6f1 !important;

    font-size:21px !important;
    line-height:1.2;
    letter-spacing:-.45px;
}


#what-we-build .build-service-card p{
    margin:0 0 25px !important;

    max-width:95%;

    color:#aeb7c5 !important;

    font-size:13px;
    line-height:1.65;
}


#what-we-build .build-service-card > span{
    display:inline-flex;
    align-items:center;

    margin-top:auto !important;

    color:#ff7a36 !important;

    font-size:12px;
    font-weight:800;

    transition:
        transform .25s ease,
        color .25s ease;
}


/* =========================================================
   HOVER
   ========================================================= */

#what-we-build .build-service-card:hover{
    transform:translateY(-6px);

    border-color:
        rgba(255,101,24,.36) !important;

    background:
        radial-gradient(
            circle at 100% 100%,
            rgba(255,101,24,.13),
            transparent 34%
        ),
        linear-gradient(
            145deg,
            rgba(255,101,24,.075),
            rgba(255,255,255,.022)
        ) !important;

    box-shadow:
        0 30px 65px rgba(0,0,0,.30),
        0 0 26px rgba(255,101,24,.07),
        inset 0 1px 0 rgba(255,255,255,.07);
}


#what-we-build .build-service-card:hover::before{
    width:calc(100% - 56px);
}


#what-we-build .build-service-card:hover > span{
    transform:translateX(5px);

    color:#ff985f !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1050px){

    #what-we-build .what-we-build-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:620px){

    #what-we-build.what-we-build{
        padding:72px 0 !important;
    }

    #what-we-build .what-we-build-heading{
        margin-bottom:34px;
    }

    #what-we-build .what-we-build-heading h2{
        font-size:42px;
        letter-spacing:-2px;
    }

    #what-we-build .what-we-build-heading p{
        font-size:14px;
    }

    #what-we-build .what-we-build-grid{
        grid-template-columns:1fr !important;
    }

    #what-we-build .build-service-card{
        min-height:220px;
        padding:24px !important;
    }

    #what-we-build .build-service-number{
        margin-bottom:24px;
    }

    #what-we-build .build-service-card:hover{
        transform:none;
    }

}



/* =========================================================
   QAMZU — VALUE SECTION LUXURY V1
   ========================================================= */

.value-section{
    position:relative;

    padding:105px 0 !important;

    overflow:hidden;

    background:
        radial-gradient(
            circle at 10% 12%,
            rgba(255,101,24,.12),
            transparent 27%
        ),
        radial-gradient(
            circle at 92% 88%,
            rgba(255,166,91,.06),
            transparent 28%
        ),
        linear-gradient(
            135deg,
            #07111f 0%,
            #0b1424 55%,
            #111019 100%
        ) !important;

    color:#fff;
}


/* premium top divider */
.value-section::before{
    content:"";

    position:absolute;
    top:0;
    left:10%;
    right:10%;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,101,24,.68),
            rgba(255,190,120,.30),
            transparent
        );

    box-shadow:
        0 0 22px rgba(255,101,24,.16);
}


/* ambient glow */
.value-section::after{
    content:"";

    position:absolute;

    width:500px;
    height:500px;

    right:-220px;
    bottom:-220px;

    border-radius:50%;

    background:
        rgba(255,101,24,.055);

    filter:blur(90px);

    pointer-events:none;
}


/* =========================================================
   GRID
   ========================================================= */

.value-section .value-grid{
    position:relative;
    z-index:2;

    grid-template-columns:
        1.05fr .95fr !important;

    gap:78px !important;

    align-items:center !important;
}


/* =========================================================
   IMAGE SIDE
   ========================================================= */

.value-section .value-image{
    position:relative;

    padding:10px;
}


/* luxury outer frame */
.value-section .value-image::before{
    content:"";

    position:absolute;
    inset:0;

    border:
        1px solid rgba(255,255,255,.10);

    border-radius:26px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.045),
            rgba(255,255,255,.012)
        );

    box-shadow:
        0 30px 70px rgba(0,0,0,.28),
        inset 0 1px 0 rgba(255,255,255,.05);

    pointer-events:none;
}


/* orange accent line */
.value-section .value-image::after{
    content:"";

    position:absolute;
    z-index:3;

    top:10px;
    left:35px;

    width:90px;
    height:2px;

    background:
        linear-gradient(
            90deg,
            #ff6518,
            rgba(255,190,120,.62),
            transparent
        );

    box-shadow:
        0 0 16px rgba(255,101,24,.30);
}


/* image itself */
.value-section .value-image img{
    position:relative;
    z-index:1;

    width:100% !important;
    height:560px !important;

    object-fit:cover !important;

    border-radius:20px !important;

    filter:
        brightness(.83)
        saturate(.92)
        contrast(1.04);

    box-shadow:
        0 24px 55px rgba(0,0,0,.30) !important;

    transition:
        transform .5s ease,
        filter .4s ease;
}


.value-section .value-image:hover img{
    transform:scale(1.012);

    filter:
        brightness(.90)
        saturate(1)
        contrast(1.04);
}


/* =========================================================
   FLOATING "OPEN 24/7" GLASS CARD
   ========================================================= */

.value-section .value-floating{
    z-index:4;

    right:-24px !important;
    bottom:34px !important;

    min-width:175px;

    padding:
        17px 20px !important;

    border:
        1px solid rgba(255,101,24,.26);

    border-radius:16px !important;

    background:
        linear-gradient(
            145deg,
            rgba(14,24,40,.94),
            rgba(10,18,31,.88)
        ) !important;

    backdrop-filter:
        blur(18px);

    box-shadow:
        0 20px 48px rgba(0,0,0,.34),
        0 0 28px rgba(255,101,24,.08),
        inset 0 1px 0 rgba(255,255,255,.06) !important;
}


.value-section .value-floating span{
    color:#9fa9b7 !important;

    font-size:10px !important;
    font-weight:700;

    text-transform:uppercase;
    letter-spacing:.10em;
}


.value-section .value-floating strong{
    margin-top:4px !important;

    color:#f8f6f1 !important;

    font-size:23px !important;
    font-weight:850;
}


/* subtle orange dot */
.value-section .value-floating::before{
    content:"";

    display:inline-block;

    width:7px;
    height:7px;

    margin-right:7px;

    border-radius:50%;

    background:#ff6518;

    box-shadow:
        0 0 12px rgba(255,101,24,.55);
}


/* =========================================================
   COPY SIDE
   ========================================================= */

.value-section .value-copy{
    max-width:560px !important;
}


.value-section .value-copy .section-label{
    color:#ff8c52 !important;
}


.value-section .value-copy h2{
    margin:
        12px 0 18px !important;

    color:#f8f6f1 !important;

    font-size:
        clamp(40px,4.5vw,58px) !important;

    line-height:1.04 !important;

    letter-spacing:-2.5px !important;
}


.value-section .value-copy > p{
    margin:0;

    color:#aeb7c5 !important;

    font-size:16px !important;

    line-height:1.75 !important;
}


/* =========================================================
   VALUE LIST
   ========================================================= */

.value-section .value-list{
    margin-top:32px !important;

    gap:12px !important;
}


/* each benefit becomes premium row */
.value-section .value-list > div{
    position:relative;

    display:flex !important;
    align-items:center;

    gap:14px !important;

    padding:
        15px 16px !important;

    border:
        1px solid rgba(255,255,255,.085);

    border-radius:14px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.035),
            rgba(255,255,255,.012)
        );

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035);

    transition:
        transform .25s ease,
        border-color .25s ease,
        background .25s ease;
}


.value-section .value-list > div:hover{
    transform:translateX(4px);

    border-color:
        rgba(255,101,24,.28);

    background:
        linear-gradient(
            145deg,
            rgba(255,101,24,.06),
            rgba(255,255,255,.015)
        );
}


/* check icon */
.value-section .value-list > div > span{
    flex:0 0 36px !important;

    width:36px !important;
    height:36px !important;

    border:
        1px solid rgba(255,101,24,.25);

    border-radius:11px !important;

    background:
        linear-gradient(
            145deg,
            rgba(255,101,24,.15),
            rgba(255,255,255,.02)
        ) !important;

    color:#ff7a36 !important;

    font-weight:900;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.04);
}


/* benefit title */
.value-section .value-list strong{
    color:#f7f5f0 !important;

    font-size:15px;
    font-weight:800;
}


/* benefit description */
.value-section .value-list p{
    margin:3px 0 0 !important;

    color:#98a3b2 !important;

    font-size:13px !important;

    line-height:1.45;
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1050px){

    .value-section .value-grid{
        grid-template-columns:1fr !important;

        gap:55px !important;
    }

    .value-section .value-image{
        max-width:760px;
        margin:auto;
    }

    .value-section .value-copy{
        max-width:760px !important;
        margin:auto;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:850px){

    .value-section{
        padding:
            78px 0 !important;
    }

    .value-section .value-image img{
        height:430px !important;
    }

}


@media(max-width:620px){

    .value-section{
        padding:
            68px 0 !important;
    }

    .value-section .value-grid{
        gap:42px !important;
    }

    .value-section .value-image{
        padding:7px;
    }

    .value-section .value-image img{
        height:370px !important;

        border-radius:17px !important;
    }

    .value-section .value-image::before{
        border-radius:21px;
    }

    .value-section .value-floating{
        right:10px !important;
        bottom:18px !important;

        min-width:145px;

        padding:
            14px 16px !important;
    }

    .value-section .value-floating strong{
        font-size:20px !important;
    }

    .value-section .value-copy h2{
        font-size:38px !important;

        letter-spacing:-1.8px !important;
    }

    .value-section .value-copy > p{
        font-size:14px !important;
    }

    .value-section .value-list > div{
        padding:
            14px !important;
    }

    .value-section .value-list > div:hover{
        transform:none;
    }

}



/* =========================================================
   QAMZU — PROCESS SECTION LUXURY V1
   ========================================================= */

#process.process-section{
    position:relative;

    padding-top:92px !important;
    padding-bottom:100px !important;

    overflow:hidden;

    background:
        radial-gradient(
            circle at 12% 0%,
            rgba(255,101,24,.11),
            transparent 27%
        ),
        radial-gradient(
            circle at 88% 100%,
            rgba(255,173,92,.055),
            transparent 28%
        ),
        linear-gradient(
            135deg,
            #07111f 0%,
            #0b1424 55%,
            #111019 100%
        ) !important;

    color:#fff;
}


/* top luxury divider */
#process.process-section::before{
    content:"";

    position:absolute;
    top:0;
    left:10%;
    right:10%;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,101,24,.68),
            rgba(255,190,120,.30),
            transparent
        );

    box-shadow:
        0 0 22px rgba(255,101,24,.15);
}


/* =========================================================
   HEADING
   ========================================================= */

#process .section-heading{
    position:relative;
    z-index:2;

    margin-bottom:46px !important;
}


#process .section-label{
    color:#ff8c52 !important;
}


#process .section-heading h2{
    color:#f8f6f1 !important;

    max-width:760px;

    margin-left:auto;
    margin-right:auto;
}


#process .section-heading p{
    color:#aeb7c5 !important;

    max-width:680px;

    margin-left:auto;
    margin-right:auto;
}


/* =========================================================
   GRID
   ========================================================= */

#process .process-premium-grid{
    position:relative;
    z-index:2;

    display:grid !important;

    grid-template-columns:
        minmax(0,1fr)
        54px
        minmax(0,1fr)
        54px
        minmax(0,1fr) !important;

    gap:0 !important;

    align-items:center !important;
}


/* =========================================================
   PROCESS CARDS
   ========================================================= */

#process .process-premium-card{
    position:relative;

    min-height:500px;

    padding:26px !important;

    overflow:hidden;

    border:
        1px solid rgba(255,255,255,.10) !important;

    border-radius:22px !important;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(255,101,24,.07),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            rgba(255,255,255,.045),
            rgba(255,255,255,.015)
        ) !important;

    box-shadow:
        0 24px 55px rgba(0,0,0,.25),
        inset 0 1px 0 rgba(255,255,255,.05);

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease !important;
}


/* featured middle card */
#process .featured-process{
    border-color:
        rgba(255,101,24,.30) !important;

    background:
        radial-gradient(
            circle at 90% 0%,
            rgba(255,101,24,.12),
            transparent 31%
        ),
        linear-gradient(
            145deg,
            rgba(255,101,24,.055),
            rgba(255,255,255,.018)
        ) !important;
}


/* top orange accent */
#process .process-premium-card::before{
    content:"";

    position:absolute;
    top:0;
    left:26px;

    width:70px;
    height:2px;

    background:
        linear-gradient(
            90deg,
            #ff6518,
            rgba(255,185,109,.65),
            transparent
        );

    box-shadow:
        0 0 16px rgba(255,101,24,.25);

    transition:width .3s ease;
}


/* =========================================================
   TOP ROW
   ========================================================= */

#process .process-top{
    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:14px;

    margin-bottom:22px;
}


#process .process-number{
    display:grid;
    place-items:center;

    width:46px;
    height:46px;

    border:
        1px solid rgba(255,101,24,.25);

    border-radius:13px;

    background:
        linear-gradient(
            145deg,
            rgba(255,101,24,.14),
            rgba(255,255,255,.025)
        ) !important;

    color:#ff7a36 !important;

    font-size:11px;
    font-weight:900;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05);
}


#process .process-tag{
    color:#ff8d52 !important;

    font-size:8px !important;
    font-weight:900 !important;

    letter-spacing:.16em !important;
}


/* =========================================================
   IMAGE
   ========================================================= */

#process .process-visual{
    margin-bottom:23px;

    overflow:hidden;

    border:
        1px solid rgba(255,255,255,.10);

    border-radius:16px;

    background:#09111d;

    box-shadow:
        0 16px 36px rgba(0,0,0,.24);
}


#process .process-image-visual img{
    display:block;

    width:100%;
    height:200px;

    object-fit:cover;

    filter:
        brightness(.88)
        saturate(.94)
        contrast(1.03);

    transition:
        transform .5s ease,
        filter .4s ease;
}


#process .process-premium-card:hover
.process-image-visual img{
    transform:scale(1.035);

    filter:
        brightness(.96)
        saturate(1)
        contrast(1.03);
}


/* =========================================================
   CARD TEXT
   ========================================================= */

#process .process-premium-card h3{
    margin:
        0 0 10px !important;

    color:#f8f6f1 !important;

    font-size:21px !important;

    line-height:1.2;
    letter-spacing:-.45px !important;
}


#process .process-premium-card > p{
    margin:0 !important;

    color:#aeb7c5 !important;

    font-size:13px !important;

    line-height:1.65 !important;
}


/* =========================================================
   ARROWS BETWEEN CARDS
   ========================================================= */

#process .process-arrow{
    display:grid !important;
    place-items:center;

    width:42px;
    height:42px;

    margin:auto;

    border:
        1px solid rgba(255,101,24,.32);

    border-radius:50%;

    background:
        rgba(255,101,24,.07);

    color:#ff7a36 !important;

    font-size:24px !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.04),
        0 8px 20px rgba(0,0,0,.18);
}


/* =========================================================
   CARD HOVER
   ========================================================= */

#process .process-premium-card:hover{
    transform:translateY(-6px);

    border-color:
        rgba(255,101,24,.34) !important;

    box-shadow:
        0 32px 68px rgba(0,0,0,.31),
        0 0 28px rgba(255,101,24,.065),
        inset 0 1px 0 rgba(255,255,255,.07);
}


#process .process-premium-card:hover::before{
    width:calc(100% - 52px);
}


/* =========================================================
   $199 PACKAGE REMINDER
   ========================================================= */

#process .process-package-reminder{
    position:relative;
    z-index:2;

    margin-top:28px !important;

    display:grid !important;

    grid-template-columns:
        auto
        1fr
        auto !important;

    align-items:center;

    gap:28px !important;

    padding:
        20px 24px !important;

    border:
        1px solid rgba(255,101,24,.25) !important;

    border-radius:18px !important;

    background:
        radial-gradient(
            circle at 0% 50%,
            rgba(255,101,24,.10),
            transparent 26%
        ),
        linear-gradient(
            135deg,
            rgba(255,255,255,.045),
            rgba(255,255,255,.018)
        ) !important;

    box-shadow:
        0 20px 44px rgba(0,0,0,.23),
        inset 0 1px 0 rgba(255,255,255,.05);
}


#process .reminder-label{
    color:#ff9360 !important;

    font-size:8px !important;

    letter-spacing:.14em;
}


#process .reminder-price{
    display:block;

    margin-top:3px;

    color:#ffffff !important;

    font-size:30px !important;

    letter-spacing:-1px;
}


#process .reminder-benefits{
    display:flex;

    justify-content:center;

    gap:18px !important;

    flex-wrap:wrap;
}


#process .reminder-benefits span{
    color:#c4ccd8 !important;

    font-size:11px;

    white-space:nowrap;
}


#process .reminder-benefits span::first-letter{
    color:#ff6518;
}


/* CTA */
#process .reminder-button{
    border:
        1px solid rgba(255,255,255,.08);

    background:
        linear-gradient(
            135deg,
            #ff6518,
            #e9530e
        ) !important;

    color:#fff !important;

    box-shadow:
        0 12px 28px rgba(255,101,24,.25);

    transition:
        transform .25s ease,
        box-shadow .25s ease;
}


#process .reminder-button:hover{
    transform:translateY(-2px);

    box-shadow:
        0 16px 34px rgba(255,101,24,.32);
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1050px){

    #process .process-premium-grid{
        grid-template-columns:1fr !important;

        gap:16px !important;
    }

    #process .process-premium-card{
        min-height:auto;
    }

    #process .process-arrow{
        transform:rotate(90deg);

        margin:0 auto;
    }

    #process .process-package-reminder{
        grid-template-columns:1fr !important;

        text-align:center;
    }

    #process .reminder-benefits{
        justify-content:center;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:620px){

    #process.process-section{
        padding:
            68px 0 72px !important;
    }

    #process .section-heading{
        margin-bottom:34px !important;
    }

    #process .process-premium-card{
        padding:21px !important;

        border-radius:18px !important;
    }

    #process .process-image-visual img{
        height:190px;
    }

    #process .process-package-reminder{
        margin-top:22px !important;

        padding:
            18px !important;
    }

    #process .reminder-button{
        width:100%;
    }

    #process .process-premium-card:hover{
        transform:none;
    }

}