@media (max-width:900px){.container{width:min(calc(100% - 40px),var(--max))}.header-actions{margin-left:auto}.header-actions .button{display:none}.primary-nav{position:absolute;top:84px;left:0;right:0;background:rgba(9,9,12,.97);border-bottom:1px solid var(--line);padding:18px 20px;display:none}.primary-nav.is-open{display:block}.nav-list,.nav-list ul{flex-direction:column;align-items:flex-start;gap:18px}.nav-list a{font-size:16px}.menu-toggle{display:block;margin-left:auto;background:transparent;border:0;padding:4px;width:34px}.menu-toggle span:not(.sr-only){display:block;height:1px;background:var(--ink);margin:6px 0}.hero-layout,.split-layout,.contact-layout{grid-template-columns:1fr;gap:45px}.hero{padding-top:70px}.hero-visual{min-height:340px}.card-grid{grid-template-columns:repeat(2,1fr)}.process-list{grid-template-columns:repeat(3,1fr)}.process-item:nth-child(3){border-right:0}.portfolio-grid,.pricing-grid{grid-template-columns:1fr 1fr}.tech-band{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}}@media (max-width:600px){.container{width:calc(100% - 32px)}.section{padding:85px 0}.hero{min-height:auto;padding:72px 0 45px}.hero h1,h2{font-size:47px}.hero-text,.lead{font-size:16px}.hero-actions{flex-direction:column;align-items:stretch}.hero-visual{min-height:270px}.hero-card{padding:20px}.hero-meta{display:grid;gap:8px;margin-top:30px;font-size:9px}.card-grid,.portfolio-grid,.pricing-grid,.footer-grid{grid-template-columns:1fr}.process-list{grid-template-columns:1fr 1fr;margin-top:40px}.process-item:nth-child(2n){border-right:0}.process-item h3{margin-top:28px}.project-thumb{height:250px}.tech-band{padding:28px}.form-row{grid-template-columns:1fr;gap:0}.contact-form{padding:20px}.footer-grid>div:first-child{grid-column:auto}.footer-bottom{display:grid;gap:8px;margin-top:38px}.modal-panel{padding:32px 22px}}

@media (max-width:900px){.hero-visual{min-height:460px}.hero-window{width:min(100%,560px)}.hero-orbit{right:2%;width:400px;height:400px}.portfolio-modal .modal-panel{height:90vh}.portfolio-modal-header{padding-right:55px}}
@media (max-width:600px){.hero-visual{min-height:340px;margin-top:5px}.hero-window{min-height:245px;transform:rotate(2deg)}.window-body{min-height:203px}.window-code{padding:22px 20px}.window-code .code-lines{padding:20px 0 0}.window-sidebar{padding:22px 14px}.hero-orbit{width:300px;height:300px;right:-5%;top:14%}.hero-badge{font-size:9px;padding:8px 9px}.hero-badge b{margin-left:7px}.badge-wordpress{top:2%;left:0}.badge-php{top:23%;right:-1%}.badge-security{bottom:11%;left:0}.badge-js{bottom:1%;right:1%}.portfolio-modal .modal-panel{height:92vh}.portfolio-modal-header{padding:20px 52px 15px 20px}.portfolio-modal-header h2{font-size:25px}.portfolio-preview{height:calc(100% - 79px)}.preview-site .preview-hero{padding:45px 8%;min-height:330px}.preview-site .preview-block{padding:30px 8%;height:210px}}

@media (max-width:1100px){.hero-composition{grid-template-columns:minmax(220px,.9fr) minmax(320px,1.1fr) 220px;gap:22px}.hero-composition .hero-visual{min-height:470px}.hero-expertise{padding-left:14px}.expertise-card{font-size:10px;padding:11px 8px}}
@media (max-width:900px){.hero-composition{grid-template-columns:1fr 1fr;gap:30px;min-height:auto}.hero-composition .hero-copy{grid-column:1/-1;max-width:680px}.hero-composition .hero-visual{min-height:450px}.hero-expertise{padding-left:18px}.hero-cta-row{margin-top:15px}.hero-meta{margin-top:38px}}
@media (max-width:600px){.hero-composition{display:flex;flex-direction:column;align-items:stretch;gap:25px}.hero-composition .hero-copy{order:1;max-width:none}.hero-composition .hero-visual{order:2;min-height:340px}.hero-expertise{order:3;border-left:0;border-top:1px solid var(--line);padding:20px 0 0}.expertise-list{grid-template-columns:1fr 1fr}.expertise-card{font-size:9px;min-height:48px}.expertise-card b{display:none}.expertise-note{margin-top:14px}.hero-cta-row{order:4;margin-top:0}.hero-cta-row .hero-actions{flex-direction:column;align-items:stretch;width:100%}.hero-meta{margin-top:30px}}

@media (max-width:1100px){body{overflow-x:hidden}.hero-meta{flex-wrap:wrap;gap:8px 24px}.hero-cta-row{width:100%;justify-content:center}.hero-cta-row .hero-actions{margin-left:auto;margin-right:auto}}

@media (min-width:1400px){.hero-copy-inner{max-width:560px}.hero-title-wrap h1{font-size:82px}.hero-composition{grid-template-columns:minmax(300px,1fr) minmax(430px,1.2fr) minmax(270px,.82fr);gap:48px}.hero-cta-inner{padding-top:24px}}
@media (max-width:900px){.hero-copy-inner{max-width:620px}.hero-title-wrap h1{font-size:clamp(48px,7vw,70px)}.hero-cta-inner{grid-template-columns:1fr auto 1fr;gap:12px}.hero-cta-caption{font-size:9px}.hero-cta-inner .hero-actions{gap:10px}}
@media (max-width:600px){.hero-copy-inner{max-width:none}.hero-label-row{margin-bottom:20px}.hero-title-wrap h1{font-size:clamp(43px,12vw,60px);line-height:.97;margin-bottom:22px}.hero-message{padding-left:14px}.hero-proof{gap:10px 14px;margin-top:23px}.hero-proof span{font-size:9px}.hero-cta-inner{display:flex;flex-direction:column;align-items:stretch;border-top:1px solid var(--line);padding-top:19px;gap:12px}.hero-cta-inner .hero-actions{width:100%;display:flex;flex-direction:column;gap:9px;order:2}.hero-cta-inner .button{width:100%;min-height:50px}.hero-cta-caption{order:1;text-align:center;font-size:9px}.hero-cta-caption-right{order:3;text-align:center}.hero-meta{margin-top:28px}}

@media (max-width:1100px){.service-grid{grid-template-columns:repeat(2,1fr)}.process-track{grid-template-columns:repeat(3,1fr);row-gap:35px}.process-track:before{top:28px;left:2%;right:2%}.process-card:nth-child(3){border-right:0}.process-card:nth-child(n+4){border-top:1px solid var(--line);padding-top:22px}.process-card:nth-child(n+4) .process-card-top{height:35px}.process-card:nth-child(n+4) .process-dot{margin-top:2px}}
@media (max-width:600px){.section-intro{font-size:14px}.service-grid{grid-template-columns:1fr;gap:12px}.service-trigger{padding:22px}.service-icon{margin:24px 0 14px}.service-open{padding-top:22px}.service-modal .modal-panel{padding:35px 22px}.service-features ul{grid-template-columns:1fr}.process-intro{grid-template-columns:1fr;gap:18px}.process-intro .section-heading h2{margin-bottom:0}.process-track{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;margin-top:45px}.process-track:before{top:28px;left:0;right:0}.process-card{min-height:210px;padding:0 0 22px;border-right:0;border-bottom:1px solid var(--line)}.process-card:nth-child(n+3){border-top:0;padding-top:22px}.process-card:nth-child(n+3) .process-card-top{height:35px}.process-card:nth-child(n+3) .process-dot{margin-top:2px}.process-card:nth-child(2n){padding-left:13px;border-left:1px solid var(--line)}.process-card:first-child{padding-left:0}.process-card-body h3{font-size:17px;margin-top:28px}.process-card-body p{font-size:12px}.process-footer{display:grid;grid-template-columns:1fr;gap:12px;margin-top:30px}.process-footer-line{width:100%}}

@media (max-width:600px){.service-icon{width:42px;height:42px}.process-icon{width:38px;height:38px;padding:10px}.process-card-body h3{margin-top:18px}.process-card{min-height:225px}.service-modal-icon{width:58px;height:58px;padding:14px}}

/* =========================================
   MOBILE HEADER — HAMBURGER
   ========================================= */

@media (max-width: 900px) {

    .header-inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .primary-nav {
        margin-left: auto;
    }

    .menu-toggle {
        display:block;
        margin-left:auto;
        margin-right:0;
        width:42px;
        height:42px;
        padding:8px;
        background:transparent;
        border:1px solid transparent;
        border-radius:6px;
        cursor:pointer;
        transition:.25s ease;
    }

    .menu-toggle:hover {
        background: var(--violet);
        border-color: var(--violet);
        color: #0b0910;
        transform: translateY(-2px);
    }

    .menu-toggle:focus-visible {
        outline: 2px solid var(--violet-2);
        outline-offset: 3px;
    }

    .menu-toggle span {
        transition: transform .25s ease, opacity .25s ease;
    }

    .menu-toggle:hover span {
        transform: scale(1.08);
    }

    .header-actions {
        margin-left: auto;
    }
}


/* =========================================
   MOBILE HEADER
   ========================================= */

@media (max-width: 900px) {

    .header-inner {
        position: relative;
    }

    /* Hamburger at the far right */
    .menu-toggle {
        display: block;
        margin-left: auto;
        margin-right: 0;
        position: relative;
        z-index: 5;
        width: 42px;
        height: 42px;
        padding: 8px;
        background: transparent;
        border: 1px solid transparent;
        border-radius: 6px;
        cursor: pointer;
        transition: .25s ease;
    }

    .menu-toggle:hover {
        border-color: var(--line);
        background: rgba(155,108,255,.10);
        transform: translateY(-1px);
    }

    .menu-toggle:active {
        transform: scale(.94);
    }

    .menu-toggle:focus-visible {
        outline: 2px solid var(--violet);
        outline-offset: 2px;
    }

    .menu-toggle span:not(.sr-only) {
        display: block;
        height: 1px;
        background: var(--ink);
        margin: 6px 0;
        transition: .25s ease;
    }

    .menu-toggle:hover span:not(.sr-only) {
        background: var(--violet-2);
    }

    /* Mobile dropdown */
    .primary-nav {
        position: absolute;
        top: 84px;
        left: 0;
        right: 0;
        background: rgba(9,9,12,.98);
        border-bottom: 1px solid var(--line);
        padding: 22px 20px;
        display: none;
        z-index: 10;
        backdrop-filter: blur(18px);
    }

    .primary-nav.is-open {
        display: block;
    }

    .nav-list {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 18px;
        width: 100%;
    }

    .nav-list a {
        font-size: 16px;
    }

    /* Start a project inside hamburger menu */
    .header-actions .button {
        display: none;
    }
}

@media (max-width: 600px) {

    .header-inner {
        min-height: 84px;
    }

    .primary-nav {
        top: 84px;
    }
}


/* =========================================
   FINAL MOBILE HEADER
   ========================================= */

@media (max-width: 900px) {

    .header-inner {
        position: relative;
    }

    /* Languages centered in the header */
    .header-language {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        z-index: 2;
        white-space: nowrap;
    }

    /* Hamburger firmly on the right */
    .menu-toggle {
        display:block;
        margin-left:auto;
        margin-right:0;
        position:relative;
        z-index:20;
        width:42px;
        height:42px;
        padding:8px;
        background:transparent;
        border:1px solid transparent;
        border-radius:6px;
        cursor:pointer;
        transition:
            background .25s ease,
            border-color .25s ease,
            transform .25s ease;
    }

    .menu-toggle:hover {
        background:rgba(155,108,255,.10);
        border-color:var(--line);
        transform:translateY(-1px);
    }

    .menu-toggle:active {
        transform:scale(.94);
    }

    .menu-toggle:focus-visible {
        outline:2px solid var(--violet);
        outline-offset:2px;
    }

    .menu-toggle span:not(.sr-only) {
        display:block;
        height:1px;
        background:var(--ink);
        margin:6px 0;
        transition:.25s ease;
    }

    .menu-toggle:hover span:not(.sr-only) {
        background:var(--violet-2);
    }

    /* Dropdown */
    .primary-nav {
        position:absolute;
        top:84px;
        left:0;
        right:0;
        background:rgba(9,9,12,.98);
        border-bottom:1px solid var(--line);
        padding:22px 20px 24px;
        display:none;
        z-index:15;
        backdrop-filter:blur(18px);
    }

    .primary-nav.is-open {
        display:block;
    }

    .nav-list {
        display:flex;
        flex-direction:column;
        align-items:flex-start;
        gap:18px;
        width:100%;
    }

    .nav-list a {
        font-size:16px;
    }

    /* Hide desktop CTA inside header on mobile */
    .header-actions .button {
        display:none;
    }
}

@media (max-width:600px) {

    .header-inner {
        min-height:84px;
    }

    .primary-nav {
        top:84px;
    }
}



/* FINAL FIX — MOBILE HAMBURGER RIGHT ALIGNMENT */
@media (max-width: 900px) {
    .header-inner {
        display: flex;
        align-items: center;
    }

    .brand {
        margin-right: 0;
    }

    .menu-toggle {
        display: flex !important;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        margin-left: auto !important;
        margin-right: 0 !important;
        flex: 0 0 42px;
        width: 42px !important;
        height: 42px !important;
        position: relative;
        left: auto !important;
        right: auto !important;
    }
}


/* =====================================================
   HAMBURGER — FINAL MOBILE POSITION
   ===================================================== */

@media (max-width: 900px) {
    .site-header .header-inner {
        position: relative;
        display: flex;
        align-items: center;
        width: min(calc(100% - 40px), var(--max));
        margin-left: auto;
        margin-right: auto;
    }

    .site-header .menu-toggle {
        display: flex !important;
        position: absolute !important;
        right: 0 !important;
        left: auto !important;
        top: 50%;
        transform: translateY(-50%);
        width: 42px !important;
        height: 42px !important;
        margin: 0 !important;
        padding: 8px !important;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background: transparent;
        border: 1px solid transparent;
        border-radius: 6px;
        z-index: 50;
        cursor: pointer;
    }

    .site-header .menu-toggle:hover {
        background: rgba(155,108,255,.10);
        border-color: var(--line);
        transform: translateY(-50%);
    }

    .site-header .menu-toggle:active {
        transform: translateY(-50%) scale(.94);
    }

    .site-header .menu-toggle span:not(.sr-only) {
        display: block !important;
        width: 20px;
        height: 1px;
        margin: 3px 0;
        background: var(--ink);
    }
}

@media (max-width: 600px) {
    .site-header .header-inner {
        width: calc(100% - 32px);
    }

    .site-header .menu-toggle {
        right: 0 !important;
    }
}
