/*
 Theme Name:     Divi Child
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    Divi Child Theme
 Author:         Elegant Themes
 Author URI:     https://www.elegantthemes.com
 Template:       Divi
 Version:        1.0.17
*/


/* =Theme customization starts here
------------------------------------------------------- */


/* ==================================================
   SQUEAK – HERO
================================================== */

.squeak-hero {
    position: relative !important;
    overflow: hidden !important;
    background-color: #0b0d0e !important;
    color: #f2efe8;
}


/* ==================================================
   SQUEAK – HERO GRAIN
================================================== */

.squeak-hero::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 9999 !important;
    pointer-events: none !important;

    background-image: url('/wp-content/uploads/2026/08/squeak-noise.png') !important;
    background-repeat: repeat !important;
    background-position: 0 0 !important;
    background-size: 256px 256px !important;

    opacity: .65 !important;
    mix-blend-mode: normal !important;
}



/* ==================================================
   HERO – INNER ROW
================================================== */

.squeak-hero-inner {
    width: 90%;
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
}


/* ==================================================
   HERO – EYEBROW
================================================== */

.squeak-eyebrow {
    display: flex;
    align-items: center;
    gap: 18px;

    max-width: 430px;
    padding-bottom: 14px;

    border-bottom: 1px solid rgba(255, 255, 255, .35);

    font-family: "Barlow Condensed", sans-serif;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #f2efe8;
}

.squeak-eyebrow i {
    display: block;
    flex: 0 0 auto;

    width: 4px;
    height: 4px;

    background: #e51d24;
    border-radius: 50%;
}


/* ==================================================
   HERO – TITLE
================================================== */

.squeak-hero-title h1 {
    margin: 22px 0 20px;
    padding: 0;

    font-family: "Barlow Condensed", sans-serif;
    font-size: clamp(64px, 5.4vw, 88px);
    font-weight: 800;
    line-height: .91;
    letter-spacing: -.02em;
    text-transform: uppercase;

    color: #f2efe8;
}

.squeak-hero-title h1 span {
    color: #e51d24;
}


/* ==================================================
   HERO – INTRO
================================================== */

.squeak-hero-intro {
    max-width: 400px;
}

.squeak-hero-intro p {
    margin: 0;
    padding: 0;

    font-family: "Barlow", sans-serif;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.55;

    color: #b7b8b6;
}


/* ==================================================
   HERO – CTA CONTAINER
================================================== */

.squeak-hero-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 32px;
    margin-top: 30px;
}


/* ==================================================
   HERO – PRIMARY BUTTON
================================================== */

a.squeak-btn-primary {
    font-family: "Barlow Condensed", sans-serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: .02em !important;
    text-transform: uppercase !important;

    color: #ffffff !important;
    background: #e51d24 !important;

    border: 1px solid #e51d24 !important;
    border-radius: 0 !important;

    padding: 17px 22px !important;

    transition: background-color .25s ease,
                border-color .25s ease !important;
}


/* Divi standaard icoon uitschakelen */

a.squeak-btn-primary::after {
    display: none !important;
    content: none !important;
}


/* Primary hover */

a.squeak-btn-primary:hover {
    color: #ffffff !important;
    background: #f1262d !important;
    border-color: #f1262d !important;

    /* voorkomt Divi padding shift */
    padding: 17px 22px !important;
}


/* ==================================================
   HERO – SECONDARY BUTTON
================================================== */

a.squeak-btn-secondary {
    position: relative !important;

    font-family: "Barlow Condensed", sans-serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: .02em !important;
    text-transform: uppercase !important;

    color: #f2efe8 !important;

    background: transparent !important;

    border: 0 !important;
    border-radius: 0 !important;

    padding: 17px 34px 17px 0 !important;

    transition: color .25s ease !important;
}


/* ==================================================
   DIVI'S EIGEN AFTER-ICOON UITSCHAKELEN
================================================== */

a.squeak-btn-secondary::after {
    display: none !important;
    content: none !important;
}


/* ==================================================
   EIGEN PIJL
================================================== */

a.squeak-btn-secondary::before {
    content: "→" !important;

    display: block !important;
    position: absolute !important;

    right: 0 !important;
    left: auto !important;

    top: 50% !important;
    bottom: auto !important;

    width: auto !important;
    height: auto !important;

    margin: 0 !important;

    transform: translateY(-52%) !important;

    font-family: Arial, sans-serif !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    line-height: 1 !important;

    color: #f2efe8 !important;
    background: transparent !important;

    opacity: 1 !important;

    transition: transform .25s ease !important;
}


/* ==================================================
   RODE UNDERLINE
   We gebruiken background-gradient zodat ::before
   vrij blijft voor onze pijl.
================================================== */

a.squeak-btn-secondary {
    background-image:
        linear-gradient(#e51d24, #e51d24) !important;

    background-repeat: no-repeat !important;
    background-position: left bottom 7px !important;
    background-size: 76px 2px !important;

    transition:
        color .25s ease,
        background-size .25s ease !important;
}


/* ==================================================
   SECONDARY HOVER
================================================== */

a.squeak-btn-secondary:hover {
    color: #ffffff !important;

    padding: 17px 34px 17px 0 !important;

    background-color: transparent !important;

    background-image:
        linear-gradient(#e51d24, #e51d24) !important;

    background-repeat: no-repeat !important;
    background-position: left bottom 7px !important;
    background-size: calc(100% - 34px) 2px !important;
}

a.squeak-btn-secondary:hover::before {
    transform: translate(4px, -52%) !important;
}

.squeak-btn-secondary .et_pb_button:hover::before {
    transform: translate(4px, -52%) !important;
}




/* ==================================================
   HERO – TABLET
================================================== */

@media (max-width: 980px) {

    .squeak-hero-title h1 {
        font-size: clamp(54px, 9vw, 74px);
    }

}


/* ==================================================
   HERO – MOBILE
================================================== */

@media (max-width: 767px) {

    .squeak-hero-title h1 {
        font-size: 52px;
    }

    .squeak-eyebrow {
        gap: 11px;
        font-size: 13px;
    }

    .squeak-hero-actions {
        gap: 18px;
    }

}


/* ==================================================
   SQUEAK – SERVICES GRID
================================================== */

.squeak-services-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));

    width: 100%;
    margin: 0;
    padding: 0;

    background: #0b0d0e;
}

.squeak-services-grid {
    width: 100vw;
    max-width: none;
    margin-left: 50%;
    transform: translateX(-50%);
}

/* ==================================================
   SERVICE CARD
================================================== */

.squeak-service-card {
    position: relative;
    min-width: 0;
    min-height: 390px;
    overflow: hidden;

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    border-right: 1px solid rgba(255, 255, 255, .22);

    color: #f2efe8;
}

.squeak-service-card:last-child {
    border-right: 0;
}


/* ==================================================
   SERVICE SHADE / OVERLAY
================================================== */

.squeak-service-shade {
    position: absolute;
    inset: 0;
    z-index: 1;

    pointer-events: none;

    background:
        linear-gradient(
            90deg,
            rgba(8, 10, 11, .90) 0%,
            rgba(8, 10, 11, .67) 42%,
            rgba(8, 10, 11, .18) 100%
        );
}


/* alarm sfeer */

.squeak-service-alarm .squeak-service-shade {
    background:
        linear-gradient(
            90deg,
            rgba(48, 7, 9, .92) 0%,
            rgba(35, 9, 10, .70) 42%,
            rgba(8, 10, 11, .18) 100%
        );
}


/* brand sfeer */

.squeak-service-brand .squeak-service-shade {
    background:
        linear-gradient(
            90deg,
            rgba(44, 24, 10, .92) 0%,
            rgba(30, 18, 11, .70) 42%,
            rgba(8, 10, 11, .18) 100%
        );
}


/* camera sfeer */

.squeak-service-camera .squeak-service-shade {
    background:
        linear-gradient(
            90deg,
            rgba(8, 19, 31, .92) 0%,
            rgba(8, 16, 26, .70) 42%,
            rgba(8, 10, 11, .18) 100%
        );
}


/* ==================================================
   SERVICE CONTENT
================================================== */

.squeak-service-content {
    position: relative;
    z-index: 3;

    display: flex;
    flex-direction: column;
    justify-content: flex-end;

    height: 100%;
    min-height: 390px;

    padding: 44px 34px 38px;
}


/* ==================================================
   NUMBER
================================================== */

.squeak-service-number {
    margin: 0 0 8px;

    font-family: "Barlow Condensed", sans-serif;
    font-size: 64px;
    font-weight: 800;
    line-height: .85;
    letter-spacing: -.02em;

    color: #f2efe8;
}


/* ==================================================
   TITLE
================================================== */

.squeak-service-content h2 {
    margin: 0 0 18px !important;
    padding: 0 !important;

    font-family: "Barlow Condensed", sans-serif !important;
    font-size: 46px !important;
    font-weight: 800 !important;
    line-height: .9 !important;
    letter-spacing: -.01em !important;
    text-transform: uppercase !important;

    color: #e51d24 !important;
}


/* Camera krijgt blauwgrijze titel zoals mockup */

.squeak-service-camera .squeak-service-content h2 {
    color: #9da9b8 !important;
}


/* ==================================================
   DESCRIPTION
================================================== */

.squeak-service-content p {
    max-width: 220px;

    margin: 0 0 28px !important;
    padding: 0 !important;

    font-family: "Barlow", sans-serif !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;

    color: #f2efe8 !important;
}


/* ==================================================
   LINK
================================================== */

.squeak-service-link {
    display: inline-flex;
    align-items: center;
    gap: 11px;

    width: max-content;

    padding: 0 0 8px;

    font-family: "Barlow Condensed", sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .03em;
    text-transform: uppercase;

    color: #f2efe8 !important;
    text-decoration: none !important;

    background-image: linear-gradient(#e51d24, #e51d24);
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 74px 2px;

    transition:
        gap .25s ease,
        background-size .25s ease;
}


/* De pijl staat al in de plugin, dus NIET nog eens via ::after toevoegen */

.squeak-service-link span {
    display: inline-block;

    font-family: Arial, sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 1;

    transition: transform .25s ease;
}

.squeak-service-link:hover {
    color: #ffffff !important;
    gap: 15px;

    background-size: 100% 2px;
}

.squeak-service-link:hover span {
    transform: translateX(4px);
}


/* ==================================================
   HUD CORNERS
================================================== */

.squeak-service-corner {
    position: absolute;
    z-index: 4;

    width: 28px;
    height: 28px;

    pointer-events: none;
}

.squeak-service-corner-tl {
    top: 20px;
    left: 20px;

    border-top: 2px solid #e51d24;
    border-left: 2px solid #e51d24;
}

.squeak-service-corner-br {
    right: 20px;
    bottom: 20px;

    border-right: 2px solid #e51d24;
    border-bottom: 2px solid #e51d24;
}

.squeak-service-brand .squeak-service-corner {
    border-color: #b86a37;
}

.squeak-service-camera .squeak-service-corner {
    border-color: #8794a4;
}


/* ==================================================
   TABLET
================================================== */

@media (max-width: 980px) {

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

    .squeak-service-card {
        min-height: 340px;

        border-right: 0;
        border-bottom: 1px solid rgba(255,255,255,.20);
    }

    .squeak-service-card:last-child {
        border-bottom: 0;
    }

    .squeak-service-content {
        min-height: 340px;
    }

}


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

@media (max-width: 767px) {

    .squeak-service-card,
    .squeak-service-content {
        min-height: 320px;
    }

    .squeak-service-content {
        padding: 38px 24px 30px;
    }

    .squeak-service-number {
        font-size: 52px;
    }

    .squeak-service-content h2 {
        font-size: 40px !important;
    }

    .squeak-service-content p {
        max-width: 240px;
        font-size: 14px !important;
    }

}


/* ==================================================
   SQUEAK – TEAM SECTION
================================================== */

.squeak-team-block {
    position: relative;
    overflow: hidden;

    display: grid;
    grid-template-columns: 38% 62%;
    align-items: end;

    min-height: 500px;

    background: #f1eee7;
    color: #111315;
}


/* ==================================================
   TEAM – SUBTLE BACKGROUND TEXTURE
================================================== */

.squeak-team-block::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;

    background-image:
        radial-gradient(
            circle at 10% 30%,
            rgba(17, 19, 21, .035) 0,
            rgba(17, 19, 21, .035) 1px,
            transparent 1px
        );
    background-size: 8px 8px;

    opacity: .35;
}


/* ==================================================
   TEAM – CONTENT
================================================== */

.squeak-team-content {
    position: relative;
    z-index: 3;

    align-self: center;

    padding: 70px 30px 70px 8vw;
}


/* ==================================================
   TEAM – EYEBROW
================================================== */

.squeak-team-eyebrow {
    display: block;
    margin-bottom: 14px;

    font-family: "Barlow Condensed", sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .05em;
    text-transform: uppercase;

    color: #e51d24;
}


/* ==================================================
   TEAM – TITLE
================================================== */

.squeak-team-content h2 {
    margin: 0 0 22px !important;
    padding: 0 !important;

    font-family: "Barlow Condensed", sans-serif !important;
    font-size: 58px !important;
    font-weight: 800 !important;
    line-height: .88 !important;
    letter-spacing: -.02em !important;
    text-transform: uppercase !important;

    color: #111315 !important;
}

.squeak-team-content h2 span {
    color: #e51d24 !important;
}

/* ==================================================
   TEAM – INTRO
================================================== */

.squeak-team-intro {
    max-width: 420px;
    margin: 0 0 28px;
}

.squeak-team-intro p {
    margin: 0;
    padding: 0;

    font-family: "Barlow", sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.55;

    color: #2b2d2f;
}


/* ==================================================
   TEAM – BUTTON
================================================== */

.squeak-team-button {
    display: inline-flex;
    align-items: center;
    gap: 12px;

    width: max-content;

    padding: 15px 20px;

    font-family: "Barlow Condensed", sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .03em;
    text-transform: uppercase;

    color: #f2efe8 !important;
    background: #101214;

    border: 1px solid #101214;

    text-decoration: none !important;

    transition:
        background-color .25s ease,
        color .25s ease,
        gap .25s ease;
}


.squeak-team-button:hover {
    gap: 17px;

    color: #ffffff !important;
    background: #e51d24;
    border-color: #e51d24;
}

.squeak-team-button span {
    display: inline-block;
    transition: transform .25s ease;
}

.squeak-team-button:hover span {
    transform: translateX(4px);
}



/* ==================================================
   TEAM – VISUAL
================================================== */

.squeak-team-visual {
    position: relative;
    z-index: 2;

    align-self: end;

    display: flex;
    align-items: flex-end;
    justify-content: center;

    min-height: 500px;

    padding: 20px 4vw 0 0;
}

.squeak-team-visual img {
    display: block;

    width: 100%;
    max-width: 900px;
    height: auto;

    margin: 0;
}


/* ==================================================
   TEAM – RED BRUSH / ENERGY ACCENT
   subtiel achter de illustratie
================================================== */

.squeak-team-visual::before {
    content: "";
    position: absolute;

    left: 3%;
    right: 7%;
    top: 34%;
    height: 36%;

    z-index: -1;

    transform: rotate(-3deg);

    background:
        linear-gradient(
            100deg,
            transparent 0%,
            rgba(229, 29, 36, .00) 7%,
            rgba(229, 29, 36, .92) 16%,
            rgba(229, 29, 36, .88) 80%,
            rgba(229, 29, 36, .00) 96%
        );

    clip-path: polygon(
        0 42%,
        8% 35%,
        15% 43%,
        24% 27%,
        38% 39%,
        52% 22%,
        68% 35%,
        80% 18%,
        100% 30%,
        96% 67%,
        81% 61%,
        72% 75%,
        58% 63%,
        43% 78%,
        29% 66%,
        15% 78%,
        4% 65%
    );

    opacity: .95;
}


/* ==================================================
   TEAM – FINGERPRINT / TECH DETAIL
================================================== */

.squeak-team-block::after {
    content: "";
    position: absolute;

    left: -80px;
    top: 20px;

    width: 360px;
    height: 360px;

    z-index: 1;

    border-radius: 50%;

    background:
        repeating-radial-gradient(
            ellipse at center,
            rgba(17, 19, 21, .055) 0,
            rgba(17, 19, 21, .055) 2px,
            transparent 2px,
            transparent 13px
        );

    transform: scaleX(.75) rotate(-18deg);

    opacity: .7;
}


/* ==================================================
   TABLET
================================================== */

@media (max-width: 980px) {

    .squeak-team-block {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .squeak-team-content {
        padding: 60px 8vw 20px;
    }

    .squeak-team-visual {
        min-height: 380px;
        padding: 0 4vw;
    }

    .squeak-team-visual img {
        max-width: 720px;
    }

    .squeak-team-visual::before {
        left: 10%;
        right: 10%;
        top: 30%;
    }

}


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

@media (max-width: 767px) {

    .squeak-team-content {
        padding: 48px 24px 20px;
    }

    .squeak-team-title {
        font-size: 50px;
    }

    .squeak-team-intro p {
        font-size: 15px;
    }

    .squeak-team-visual {
        min-height: 280px;
        padding: 0 10px;
    }

    .squeak-team-visual img {
        max-width: 520px;
    }

    .squeak-team-block::after {
        width: 260px;
        height: 260px;

        left: -120px;
        top: 30px;
    }

}


/* ==================================================
   SQUEAK – TRUST / CERTIFICERING
================================================== */

.squeak-trust-section {
    position: relative;
    overflow: hidden;

    width: 100%;
    min-height: 300px;

    background-color: #0b0d0e;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    color: #f2efe8;
}


/* ==================================================
   DARK OVERLAY
================================================== */

.squeak-trust-section::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;

    pointer-events: none;

    background: rgba(5, 7, 8, .76);
}


/* ==================================================
   GRID
================================================== */

.squeak-trust-grid {
    position: relative;
    z-index: 3;

    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    width: min(92%, 1500px);
    margin: 0 auto;

    padding: 38px 0;
}


/* ==================================================
   ITEM
================================================== */

.squeak-trust-item {
    position: relative;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    min-width: 0;
    min-height: 220px;

    padding: 10px 42px;

    text-align: center;
}


/* korte scheidingslijn tussen de items */

.squeak-trust-item:not(:last-child)::after {
    content: "";
    position: absolute;

    top: 18px;
    right: 0;
    bottom: 18px;

    width: 1px;

    background: rgba(255,255,255,.28);
}


/* ==================================================
   ICON
================================================== */

.squeak-trust-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    height: 64px;

    margin-bottom: 16px;
}

.squeak-trust-icon img {
    display: block;

    width: auto;
    max-width: 62px;
    max-height: 62px;

    object-fit: contain;
}


/* ==================================================
   BIG VALUE
================================================== */

.squeak-trust-value {
    margin: 0 0 8px;

    font-family: "Barlow Condensed", sans-serif;
    font-size: 54px;
    font-weight: 800;
    line-height: .9;
    letter-spacing: -.02em;
    text-transform: uppercase;

    color: #f2efe8;
}

.squeak-trust-item:nth-child(3) .squeak-trust-value,
.squeak-trust-item:nth-child(4) .squeak-trust-value {
    font-size: 48px;
}


/* ==================================================
   LABEL
================================================== */

.squeak-trust-label {
    margin: 0 0 12px;

    font-family: "Barlow Condensed", sans-serif;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: .02em;
    text-transform: uppercase;

    color: #f2efe8;
}


/* ==================================================
   DESCRIPTION
================================================== */

.squeak-trust-description {
    max-width: 240px;

    margin: 0 auto;

    font-family: "Barlow", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;

    text-align: center;

    color: rgba(242,239,232,.82);
}

.squeak-trust-description p {
    margin: 0;
    padding: 0;
}


/* ==================================================
   TABLET
================================================== */

@media (max-width: 1100px) {

    .squeak-trust-grid {
        grid-template-columns: repeat(2, 1fr);
        width: 100%;
        padding: 0;
    }

    .squeak-trust-item {
        min-height: 250px;
        padding: 35px 28px;
    }

    .squeak-trust-item::after {
        display: none;
    }

    .squeak-trust-item:nth-child(odd) {
        border-right: 1px solid rgba(255,255,255,.20);
    }

    .squeak-trust-item:nth-child(-n+2) {
        border-bottom: 1px solid rgba(255,255,255,.20);
    }

}


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

@media (max-width: 640px) {

    .squeak-trust-grid {
        grid-template-columns: 1fr;
    }

    .squeak-trust-item {
        min-height: auto;
        padding: 38px 24px;

        border-right: 0 !important;
        border-bottom: 1px solid rgba(255,255,255,.18);
    }

    .squeak-trust-item:last-child {
        border-bottom: 0;
    }

    .squeak-trust-value {
        font-size: 48px;
    }

    .squeak-trust-item:nth-child(3) .squeak-trust-value,
    .squeak-trust-item:nth-child(4) .squeak-trust-value {
        font-size: 44px;
    }

}

/* ==================================================
   SQUEAK – QUALITY
================================================== */

.squeak-quality {
    position: relative;
    overflow: hidden;
    width: 100%;
    min-height: 430px;

    background-color: #0b0d0e;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    color: #f2efe8;
}

.squeak-quality-shade {
    position: absolute;
    inset: 0;
    z-index: 1;

    background:
        linear-gradient(
            90deg,
            rgba(7, 9, 10, .97) 0%,
            rgba(7, 9, 10, .88) 35%,
            rgba(7, 9, 10, .45) 62%,
            rgba(7, 9, 10, .12) 100%
        );

    pointer-events: none;
}

.squeak-quality-inner {
    position: relative;
    z-index: 3;

    display: grid;
    grid-template-columns: 38% 62%;
    align-items: center;

    width: min(92%, 1500px);
    min-height: 430px;

    margin: 0 auto;
}

.squeak-quality-content {
    padding: 55px 40px 55px 0;
}

.squeak-quality-eyebrow {
    margin-bottom: 12px;

    font-family: "Barlow Condensed", sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .05em;
    text-transform: uppercase;

    color: #e51d24;
}

.squeak-quality-title h2 {
    margin: 0 0 20px !important;
    padding: 0 !important;

    font-family: "Barlow Condensed", sans-serif !important;
    font-size: 58px !important;
    font-weight: 800 !important;
    line-height: .88 !important;
    letter-spacing: -.02em !important;
    text-transform: uppercase !important;

    color: #f2efe8 !important;
}

.squeak-quality-title h2 span {
    color: #e51d24 !important;
}

.squeak-quality-intro {
    max-width: 390px;
    margin-bottom: 28px;
}

.squeak-quality-intro p {
    margin: 0 !important;

    font-family: "Barlow", sans-serif !important;
    font-size: 15px !important;
    line-height: 1.55 !important;

    color: rgba(242, 239, 232, .82) !important;
}

a.squeak-quality-button {
    display: inline-flex;
    align-items: center;
    gap: 14px;

    padding: 15px 20px;

    font-family: "Barlow Condensed", sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .03em;
    text-transform: uppercase;

    color: #f2efe8 !important;
    background: transparent !important;

    border: 1px solid rgba(255,255,255,.45) !important;

    text-decoration: none !important;

    transition:
        border-color .25s ease,
        background-color .25s ease,
        gap .25s ease;
}

a.squeak-quality-button:hover {
    gap: 19px;

    color: #ffffff !important;
    background: #e51d24 !important;
    border-color: #e51d24 !important;
}

.squeak-quality-visual {
    position: relative;

    display: flex;
    align-items: flex-end;
    justify-content: flex-end;

    height: 100%;
    min-height: 430px;
}

.squeak-quality-image {
    display: block;

    width: 100%;
    max-width: 900px;
    height: auto;

    margin-left: auto;
}

.squeak-quality-corner {
    position: absolute;
    z-index: 4;

    top: 25px;
    left: 25px;

    width: 30px;
    height: 30px;

    border-top: 2px solid #f2efe8;
    border-left: 2px solid #f2efe8;

    opacity: .8;
}


/* ==================================================
   SQUEAK – HOME CTA
================================================== */

.squeak-home-cta {
    position: relative;
    overflow: hidden;

    width: 100%;

    background:
        linear-gradient(
            100deg,
            #de1119 0%,
            #ed1c24 50%,
            #d80d15 100%
        );

    color: #ffffff;
}

.squeak-home-cta::before {
    content: "";
    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        url('https://squeak.giraphic.be/wp-content/uploads/2026/08/squeak-noise.png');
    background-repeat: repeat;
    background-size: 256px 256px;

    opacity: .16;
}

.squeak-home-cta-inner {
    position: relative;
    z-index: 2;

    display: grid;
    grid-template-columns: 120px 1fr auto;
    align-items: center;
    gap: 35px;

    width: min(92%, 1500px);

    margin: 0 auto;
    padding: 38px 0;
}

.squeak-home-cta-icon-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
}

.squeak-home-cta-icon {
    display: block;

    width: auto;
    max-width: 82px;
    max-height: 82px;
}

.squeak-home-cta-copy h2 {
    margin: 0 0 8px !important;
    padding: 0 !important;

    font-family: "Barlow Condensed", sans-serif !important;
    font-size: 38px !important;
    font-weight: 700 !important;
    line-height: .95 !important;
    text-transform: uppercase !important;

    color: #ffffff !important;
}

.squeak-home-cta-copy p {
    margin: 0 !important;

    font-family: "Barlow", sans-serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;

    color: #ffffff !important;
}

.squeak-home-cta-actions {
    display: flex;
    align-items: stretch;
    gap: 28px;
}

a.squeak-home-cta-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 16px;

    min-width: 245px;

    padding: 20px 24px;

    font-family: "Barlow Condensed", sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;

    color: #ffffff !important;
    background: #101214 !important;

    text-decoration: none !important;

    transition:
        background-color .25s ease,
        gap .25s ease;
}

a.squeak-home-cta-primary:hover {
    gap: 21px;

    background: #000000 !important;
}

a.squeak-home-cta-secondary {
    display: flex;
    flex-direction: column;
    justify-content: center;

    min-width: 280px;

    padding: 14px 20px;

    color: #ffffff !important;
    background: transparent !important;

    border: 1px solid rgba(255,255,255,.70) !important;

    text-decoration: none !important;

    transition: background-color .25s ease;
}

a.squeak-home-cta-secondary strong {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

    font-family: "Barlow Condensed", sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

a.squeak-home-cta-secondary small {
    display: block;

    margin-top: 6px;

    font-family: "Barlow", sans-serif;
    font-size: 12px;
    line-height: 1.2;

    opacity: .85;
}

a.squeak-home-cta-secondary:hover {
    background: rgba(0,0,0,.12) !important;
}


/* ==================================================
   QUALITY / CTA – TABLET
================================================== */

@media (max-width: 980px) {

    .squeak-quality-inner {
        grid-template-columns: 1fr;
    }

    .squeak-quality-content {
        padding: 55px 0 20px;
    }

    .squeak-quality-visual {
        min-height: 320px;
        justify-content: center;
    }

    .squeak-quality-image {
        max-width: 760px;
        margin: 0 auto;
    }

    .squeak-home-cta-inner {
        grid-template-columns: 90px 1fr;
    }

    .squeak-home-cta-actions {
        grid-column: 1 / -1;
        justify-content: center;
    }

}


/* ==================================================
   QUALITY / CTA – MOBILE
================================================== */

@media (max-width: 640px) {

    .squeak-quality-inner {
        width: calc(100% - 48px);
    }

    .squeak-quality-title h2 {
        font-size: 46px !important;
    }

    .squeak-quality-visual {
        min-height: 250px;
    }

    .squeak-home-cta-inner {
        grid-template-columns: 1fr;
        gap: 20px;

        width: calc(100% - 48px);

        text-align: center;
    }

    .squeak-home-cta-icon-wrap {
        justify-content: center;
    }

    .squeak-home-cta-actions {
        grid-column: auto;

        flex-direction: column;
        gap: 12px;
    }

    a.squeak-home-cta-primary,
    a.squeak-home-cta-secondary {
        width: 100%;
        min-width: 0;
    }

}
/* ==================================================
   SQUEAK v0.11 – CROSS-PAGE HERO CONSISTENCY
================================================== */

/* Brand / Camera / Over Squeak: dezelfde eyebrow-look als Alarm.
   Home behoudt zijn eigen 3-item eyebrow. */
.squeak-service-eyebrow,
.squeak-about-eyebrow {
    display: inline-flex !important;
    align-items: center !important;
    width: auto !important;
    max-width: none !important;
    padding: 0 48px 11px 0 !important;
    margin: 0 0 22px !important;
    border-bottom: 1px solid rgba(255,255,255,.35) !important;
    font-family: "Barlow Condensed", sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    color: #f2efe8 !important;
}

.squeak-service-eyebrow::after,
.squeak-about-eyebrow::after {
    content: "" !important;
    display: block !important;
    flex: 0 0 4px !important;
    width: 4px !important;
    height: 4px !important;
    margin-left: 18px !important;
    background: #e51d24 !important;
    border-radius: 50% !important;
}

/* Nooit woorden zoals BRAND-BEVEILIGING midden in het woord afbreken. */
.squeak-alarm-hero-title h1,
.squeak-service-hero h1,
.squeak-about-hero h1 {
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}

/* Lange servicewoorden iets flexibeler schalen op desktop/tablet. */
.squeak-service-hero h1 {
    font-size: clamp(50px, 4.1vw, 68px) !important;
}

.squeak-alarm-hero-title h1 {
    font-size: clamp(50px, 4.4vw, 76px) !important;
}

/* Services en Alarm vroeger stacken: anders wordt de tekstkolom rond tabletbreedtes
   te smal voor lange Nederlandse woorden. */
@media (max-width: 1180px) {
    .squeak-service-hero-inner,
    .squeak-alarm-hero-inner {
        grid-template-columns: minmax(0, 1fr) !important;
        width: calc(100% - 48px) !important;
        max-width: 900px !important;
    }

    .squeak-service-hero-copy,
    .squeak-service-hero-visual,
    .squeak-alarm-hero-copy,
    .squeak-alarm-hero-visual {
        width: 100% !important;
        min-width: 0 !important;
    }

    .squeak-service-hero-copy,
    .squeak-alarm-hero-copy {
        padding-right: 0 !important;
    }

    .squeak-service-hero-visual,
    .squeak-alarm-hero-visual {
        min-height: 380px !important;
    }
}

@media (max-width: 767px) {
    .squeak-service-hero h1,
    .squeak-alarm-hero-title h1 {
        font-size: clamp(36px, 10vw, 46px) !important;
        line-height: .94 !important;
    }

    .squeak-about-hero h1 {
        font-size: clamp(38px, 10vw, 46px) !important;
        line-height: .94 !important;
    }

    .squeak-service-eyebrow,
    .squeak-about-eyebrow {
        max-width: 100% !important;
    }
}

/* Squeak child build: v0.12 */


/* Squeak v0.17.4 – larger header logo + uniform fluid mobile navigation */
.squeak-mobile-menu-inner { width: min(92%, 1100px); }
.squeak-mobile-links a,
.squeak-mobile-links a.squeak-menu-label-long {
    padding: 26px 0 !important;
    font-size: clamp(28px, 8vw, 60px);
    line-height: .95;
    letter-spacing: -.02em;
    white-space: nowrap;
}
@media (max-width: 700px) {
}