body {
            padding-top: var(--nav-h);
        }


        /* ── Hero ── */
        .oo-hero {
            padding: 80px 32px 96px;
            max-width: 1280px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1fr 460px;
            gap: 64px;
            align-items: center;
        }

        .oo-hero-tag {
            margin-bottom: 28px;
        }

        .oo-h1 {
            font-family: var(--font-display);
            font-weight: 700;
            font-size: clamp(36px, 5vw, 72px);
            line-height: 1.0;
            color: var(--c-navy);
            margin-bottom: 24px;
        }

        .oo-sub {
            font-size: 22px;
            line-height: 1.5;
            color: var(--c-text);
            margin-bottom: 36px;
        }

        .oo-img-wrap {
            position: relative;
            border-radius: var(--radius-xl) 0 var(--radius-xl) 0;
            box-shadow: var(--shadow-lg);
            aspect-ratio: 4/5;
            overflow: visible;
        }

        .oo-img-wrap img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: var(--radius-xl) 0 var(--radius-xl) 0
        }

        .oo-quote-card {
            position: absolute;
            bottom: -32px;
            left: -36px;
            background: rgba(255, 255, 255, 0.75);
            backdrop-filter: blur(24px);
            border: 1px solid rgba(255, 255, 255, 0.4);
            border-radius: var(--radius-xl);
            padding: 28px 32px;
            max-width: 300px;
            box-shadow: var(--shadow-sm);
        }

        .oo-quote {
            font-size: 16px;
            font-style: italic;
            font-weight: 700;
            color: var(--c-blue);
            line-height: 1.55;
            margin-bottom: 10px;
        }

        .oo-quote-author {
            font-size: 13px;
            color: var(--c-text);
        }

        .oo-acc {
            position: absolute;
            top: -36px;
            right: -36px;
            width: 100px;
            height: 100px;
            border-radius: 12px;
            background: rgba(108, 235, 255, 0.08);
            pointer-events: none;
        }

        /* ── Wat Doet Section ── */
        .wat-doet {
            background: var(--c-bg-alt);
            padding: 96px 32px;
        }

        .wat-doet-inner {
            position: relative;
            max-width: 1280px;
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 80px;
            align-items: center;
        }

        .wd-img-wrap {
            border-radius: var(--radius-xl);
            overflow: hidden;
            box-shadow: var(--shadow-xs);
            background: var(--c-white);
            padding: 16px;
            position: relative;
        }

        .wd-img-wrap img {
            width: 100%;
            border-radius: var(--radius-lg);
            aspect-ratio: 1;
            object-fit: cover;
        }

        .wd-acc {
            position: absolute;
            top: -72px;
            left: 420px;
            width: 250px;
            height: 250px;
            border-radius: 50%;
            background: radial-gradient(#6cebff61 30%, #00ffec00, var(--c-bg));
            pointer-events: none;
        }

        .wd-h2 {
            font-family: var(--font-display);
            font-weight: 700;
            font-size: clamp(24px, 2.5vw, 36px);
            color: var(--c-navy);
            margin-bottom: 28px;
        }

        .wd-p {
            font-size: 17px;
            line-height: 1.75;
            color: var(--c-text);
            margin-bottom: 20px;
        }

        .wd-p p {
            font-size: inherit;
            line-height: inherit;
            color: inherit;
            margin-bottom: 16px;
        }

        .wd-p p:last-child {
            margin-bottom: 0;
        }

        .wd-list {
            display: flex;
            flex-direction: column;
            gap: 14px;
            padding-top: 8px;
        }

        .wd-item {
            display: flex;
            align-items: center;
            gap: 12px;
            font-size: 15px;
            color: var(--c-text);
        }

        .wd-check {
            width: 22px;
            height: 22px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
        }

        .wd-check svg {
            width: 15px;
            height: 15px;
            color: var(--c-blue);
        }

        /* ── Wie is Doorwerkgever ── */
        .wie {
            padding: 96px 32px;
        }

        .wie-card {
            max-width: 1216px;
            margin: 0 auto;
            background: var(--c-blue-mid);
            border-radius: var(--radius-xl);
            padding: 80px;
            position: relative;
            overflow: hidden;
        }

        .wie-acc {
            position: absolute;
            right: -60px;
            bottom: -60px;
            width: 400px;
            height: 400px;
            opacity: 0.08;
            font-family: serif;
            font-size: 400px;
            line-height: 1;
            color: #fff;
            pointer-events: none;
            user-select: none;
        }

        .wie-inner {
            max-width: 720px;
            position: relative;
        }

        .wie-h2 {
            font-family: var(--font-display);
            font-weight: 700;
            font-size: clamp(26px, 2.5vw, 36px);
            color: #fff;
            margin-bottom: 28px;
        }

        .wie-p {
            font-size: 18px;
            line-height: 1.8;
            color: rgba(255, 255, 255, 0.9);
            margin-bottom: 20px;
        }

        .wie-p p {
            font-size: inherit;
            line-height: inherit;
            color: inherit;
            margin-bottom: 16px;
        }

        .wie-p p:last-child {
            margin-bottom: 0;
        }

        .wie-stats {
            display: flex;
            gap: 48px;
            margin-top: 40px;
            padding-top: 40px;
            border-top: 1px solid rgba(255, 255, 255, 0.2);
        }

        .wie-stat-num {
            font-family: var(--font-display);
            font-weight: 700;
            font-size: 36px;
            color: #fff;
            line-height: 1.1;
        }

        .wie-stat-label {
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 1.4px;
            color: rgba(255, 255, 255, 0.75);
            text-transform: uppercase;
            margin-top: 4px;
        }

        /* ── CTA ── */
        .cta-section {
            padding: 96px 32px;
            text-align: center;
        }

        .cta-h2 {
            font-family: var(--font-display);
            font-weight: 700;
            font-size: clamp(24px, 2.5vw, 36px);
            color: var(--c-navy);
            margin-bottom: 16px;
        }

        .cta-sub {
            font-size: 18px;
            color: var(--c-text);
            margin-bottom: 40px;
        }

        .cta-btns {
            display: flex;
            gap: 20px;
            justify-content: center;
            flex-wrap: wrap;
        }

        /* ── Responsive ── */
        @media (max-width: 900px) {
            .oo-hero {
                grid-template-columns: 1fr;
                padding: 48px 20px;
            }

            .oo-img-wrap {
                aspect-ratio: 4/3;
            }

            .oo-quote-card {
                left: 0;
                bottom: 16px;
                max-width: 260px;
            }

            .wat-doet-inner {
                grid-template-columns: 1fr;
            }

            .wie-card {
                padding: 48px 32px;
            }

            .wie-stats {
                gap: 32px;
            }
        }

        @media (min-width: 600px) {
            .bg-circle {
                display: none;
            }
            .nav-hamburger{
                display: none;
            }
        }
        @media (max-width: 600px) {
            .nav-inner .nav-actions {
                display: none;
            }
            .oo-quote-card {
                display: none;
            }

            .oo-img-wrap img, .oo-img-wrap {
                border-radius: var(--radius-xl);
            }

            .wd-img-wrap {
                display: none;
            }

            .oo-hero-text .oo-hero-tag {
                display: none;
            }

            .oo-hero-text {
                order: 2;
                display: flex;
                flex-direction: column;
            }

            .wat-doet-inner div .wd-p {
                display: none;
            }

            .wat-doet-inner div .wd-list .wd-item {
                border-radius: var(--radius-lg);
                background-color: white;
                padding: 20px;
            }
            .oo-h1{
                font-size:2em;
            }
            .oo-sub{
                font-size: 16px;
            }
            .oo-hero-text a{
                justify-content: center;
            }
            .wd-h2{
                font-size:22px;
            }
            .wie{
                padding:0;
            }
            .wie-card{
                background: var(--c-white);
            }
            .wie-h2{
                color: var(--c-text);
                font-size:1.5em;
            }
            .wie-p{
                color: var(--c-text);
                font-size: 16px;
            }
            .wie-stat-num {
                color: var(--c-text);
            }
            .wie-stat-label {
                color: var(--c-text);
            }
            .cta-btns .btn-dark{
                width: 100%;
                justify-content: center;
                font-size: 12px;
            }
            .wd-acc{
                display:none;
            }

        }