:root{--page-title-display:none;}body.elementor-page-13951:not(.elementor-motion-effects-element-type-background), body.elementor-page-13951 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}/* Start custom CSS for html, class: .elementor-element-c2755bc */@import url("https://fonts.googleapis.com/css2?family=Overpass:wght@400;500;600;700;800&display=swap");
:root
{
    --scom-red: #e02228;
    --scom-red-dark: #bd171d;
    --scom-red-light: #fff2f3;
    --scom-purple: #7258b6;
    --scom-purple-dark: #57408d;
    --scom-purple-light: #f4f1ff;
    --scom-blue: #1671b9;
    --scom-blue-dark: #0c538d;
    --scom-blue-light: #eef7ff;
    --scom-dark: #222327;
    --scom-teaxt: #4f5258;
    --scom-muted: #767980;
    --scom-grey-50: #fbfbfb;
    --scom-grey-100: #f5f5f6;
    --scom-grey-200: #e6e7e9;
    --scom-grey-300: #d4d6d9;
    --scom-white: #ffffff;
    --scom-radius-small: 12px;
    --scom-radius: 20px;
    --scom-radius-large: 26px;
}

/* =========================================================
   ALGEMEEN
   ========================================================= */
html
{
    scroll-behavior: smooth;
}

.scom-info-page,
.scom-info-page *
{
    box-sizing: border-box;
}

.scom-info-page
{
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 25px 24px 80px;
    color: var(--scom-text);
    font-family: "Overpass", Arial, sans-serif;
    font-size: 16px;
    line-height: 1.65;
}

.scom-info-page h1,
.scom-info-page h2,
.scom-info-page h3,
.scom-info-page h4,
.scom-info-page p
{
    margin-top: 0;
}

.scom-info-page h1,
.scom-info-page h2,
.scom-info-page h3,
.scom-info-page h4
{
    color: var(--scom-dark);
    line-height: 1.18;
}

.scom-info-page h1
{
    margin-bottom: 14px;
    font-size: clamp(34px, 4vw, 52px);
    font-weight: 800;
    letter-spacing: -1.5px;
}

.scom-info-page h2
{
    margin-bottom: 18px;
    font-size: clamp(29px, 3.2vw, 42px);
    font-weight: 800;
    letter-spacing: -1px;
}

.scom-info-page h3
{
    margin-top: 30px;
    margin-bottom: 16px;
    font-size: 21px;
    font-weight: 700;
}

.scom-info-page p
{
    margin-bottom: 17px;
}

.scom-info-page a
{
    text-decoration: none;
}

/* =========================================================
   HEADER
   ========================================================= */
.scom-info-hero
{
    width: 100%;
    padding: 34px 0 38px;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.scom-info-eyebrow
{
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 13px;
    color: var(--scom-red);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.7px;
    text-transform: uppercase;
}

.scom-info-eyebrow::before
{
    width: 25px;
    height: 2px;
    border-radius: 20px;
    background: var(--scom-red);
    content: "";
}

.scom-info-hero h1
{
    width: 100%;
    max-width: none;
}

.scom-info-hero > p
{
    width: 100%;
    max-width: none;
    margin-bottom: 0;
    color: var(--scom-text);
    font-size: 17px;
    line-height: 1.65;
    white-space: normal;
    overflow-wrap: anywhere;
}

/* =========================================================
   NAVIGATIE
   ========================================================= */
.scom-service-navigation
{
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 9px;
    margin: 0 0 60px;
    padding: 9px;
    border: 1px solid var(--scom-grey-200);
    border-radius: 16px;
    background: var(--scom-white);
}

.scom-service-navigation__item
{
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 56px;
    padding: 11px 14px;
    border-radius: 11px;
    color: var(--scom-dark);
    font-size: 14px;
    font-weight: 700;
    transition: color 0.2s ease,
        background-color 0.2s ease;
}

.scom-service-navigation__item:hover,
.scom-service-navigation__item.is-active
{
    color: var(--scom-red);
    background: var(--scom-red-light);
}

.scom-service-navigation__number
{
    color: var(--scom-red);
    font-size: 11px;
    font-weight: 800;
}

/* =========================================================
   PREPAIDKAARTEN
   ========================================================= */
.scom-prepaid-section
{
    padding: 10px 0 58px;
    border-bottom: 1px solid var(--scom-grey-200);
    scroll-margin-top: 25px;
}

.scom-prepaid-section__heading
{
    max-width: 920px;
    margin-bottom: 34px;
}

.scom-prepaid-section__heading p
{
    margin-bottom: 0;
    color: var(--scom-muted);
    font-size: 16px;
}

.scom-card-family + .scom-card-family
{
    margin-top: 42px;
}

.scom-card-family__header
{
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

.scom-card-family__header h3
{
    margin: 3px 0 0;
    font-size: 24px;
}

.scom-card-family__title
{
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
}

.scom-card-family__logo
{
    display: block !important;
    flex: 0 0 auto !important;
    width: 92px !important;
    max-width: 92px !important;
    height: 34px !important;
    max-height: 34px !important;
    margin: 0 !important;
    object-fit: contain !important;
    object-position: center !important;
}

.scom-card-family__logo--mc
{
    width: 92px !important;
    max-width: 92px !important;
    height: 34px !important;
    max-height: 34px !important;
}

.scom-card-family__logo--upi
{
    width: 108px !important;
    max-width: 108px !important;
    height: 38px !important;
    max-height: 38px !important;
}

.scom-card-family__eyebrow
{
    color: var(--scom-red);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

.scom-card-family__count
{
    flex: 0 0 auto;
    padding: 7px 11px;
    border-radius: 999px;
    color: var(--scom-muted);
    background: var(--scom-grey-100);
    font-size: 11px;
    font-weight: 700;
}

.scom-prepaid-grid
{
    display: grid;
    gap: 16px;
    align-items: stretch;
}

.scom-prepaid-grid--mastercard
{
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.scom-prepaid-grid--upi
{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 850px;
    margin: 0 auto;
}

.scom-prepaid-card
{
    display: flex;
    overflow: hidden;
    flex-direction: column;
    min-width: 0;
    border: 1px solid var(--scom-grey-200);
    border-radius: 20px;
    background: var(--scom-white);
    box-shadow: none;
    transition: transform 0.25s ease,
        border-color 0.25s ease;
}

.scom-prepaid-card:hover
{
    border-color: #d8dadd;
    box-shadow: none;
    transform: translateY(-4px);
}

.scom-prepaid-card__visual
{
    position: relative;
    min-height: 165px;
    margin: 14px 14px 0;
    overflow: hidden;
    padding: 22px;
    border-radius: 15px;
    color: var(--scom-white);
    isolation: isolate;
}

.scom-prepaid-card__visual--image
{
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 190px;
    padding: 20px;
    background: #ffffff;
    background-image: none;
}

.scom-prepaid-card__visual--image img
{
    display: block;
    width: 100%;
    max-width: 255px;
    height: auto;
    max-height: 165px;
    object-fit: contain;
    filter: none;
    transition: transform 0.28s ease;
}

.scom-prepaid-card:hover
.scom-prepaid-card__visual--image img
{
    transform: translateY(-3px) scale(1.015);
}

.scom-prepaid-card__body
{
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 20px;
}

.scom-prepaid-card__title-row
{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 13px;
}

.scom-prepaid-card__title-row h4
{
    margin: 0;
    color: var(--scom-dark);
    font-size: 18px;
    line-height: 1.25;
}

.scom-network-label
{
    flex: 0 0 auto;
    padding: 5px 7px;
    border-radius: 7px;
    color: #c5161d;
    background: #fff0f1;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 0.5px;
}

.scom-network-label--upi
{
    color: #7f5700;
    background: #fff7db;
}

.scom-prepaid-card__benefits
{
    display: grid;
    gap: 7px;
    margin: 0 0 17px;
    padding: 0;
    list-style: none;
}

.scom-prepaid-card__benefits li
{
    position: relative;
    padding-left: 18px;
    color: var(--scom-text);
    font-size: 12px;
    line-height: 1.45;
}

.scom-prepaid-card__benefits li::before
{
    position: absolute;
    top: 7px;
    left: 2px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--scom-red);
    content: "";
}

.scom-prepaid-card__audience
{
    margin-bottom: 18px;
    padding: 12px 13px;
    border-radius: 11px;
    background: var(--scom-grey-100);
}

.scom-prepaid-card__audience span
{
    display: block;
    margin-bottom: 4px;
    color: var(--scom-muted);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 0.7px;
    text-transform: uppercase;
}

.scom-prepaid-card__audience p
{
    margin: 0;
    color: var(--scom-dark);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.45;
}

.scom-prepaid-card__specs
{
    display: grid;
    gap: 0;
    margin: auto 0 18px;
}

.scom-prepaid-card__specs > div
{
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid var(--scom-grey-200);
}

.scom-prepaid-card__specs > div:first-child
{
    border-top: 1px solid var(--scom-grey-200);
}

.scom-prepaid-card__specs dt,
.scom-prepaid-card__specs dd
{
    margin: 0;
    font-size: 11px;
}

.scom-prepaid-card__specs dt
{
    color: var(--scom-muted);
}

.scom-prepaid-card__specs dd
{
    color: var(--scom-dark);
    font-weight: 700;
    text-align: right;
}

.scom-apply-button
{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 45px;
    padding: 11px 14px;
    border-radius: 11px;
    color: var(--scom-white);
    background: var(--scom-red);
    font-size: 12px;
    font-weight: 800;
    transition: background-color 0.2s ease,
        transform 0.2s ease;
}

.scom-apply-button:hover
{
    color: var(--scom-white);
    background: var(--scom-red-dark);
    transform: translateY(-1px);
}

.scom-apply-button span
{
    font-size: 16px;
    line-height: 1;
}

/* =========================================================
   SERVICESECTIES
   ========================================================= */
.scom-service-section
{
    display: grid;
    grid-template-columns: minmax(320px, 0.9fr)
        minmax(0, 1.1fr);
    gap: 28px;
    align-items: stretch;
    padding: 55px 0;
    border-bottom: 1px solid var(--scom-grey-200);
    scroll-margin-top: 25px;
}

.scom-service-section--reverse
.scom-service-card--visual
{
    order: 2;
}

.scom-service-section--reverse
.scom-service-card--content
{
    order: 1;
}

.scom-service-card
{
    width: 100%;
    height: 100%;
    border: 1px solid var(--scom-grey-200);
    border-radius: var(--scom-radius-large);
    background: var(--scom-white);
}

.scom-service-card--visual
{
    overflow: hidden;
}

.scom-service-card--content
{
    display: flex;
    flex-direction: column;
    padding: 38px;
}

/* =========================================================
   EIGEN LOGO'S EN TELEFOONAFBEELDINGEN
   ========================================================= */
.scom-product-visual
{
    position: relative;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    height: 100%;
    min-height: 100%;
    overflow: hidden;
    padding: 42px 28px 30px;
    isolation: isolate;
}

.scom-product-visual::before
{
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: -1;
    width: 430px;
    height: 430px;
    border-radius: 50%;
    content: "";
    opacity: 0.68;
    transform: translate(-50%, -43%);
}

.scom-product-visual::after
{
    position: absolute;
    right: -90px;
    bottom: -115px;
    z-index: -1;
    width: 260px;
    height: 260px;
    border: 45px solid rgba(255, 255, 255, 0.25);
    border-radius: 50%;
    content: "";
}

/* PAYSEND */
.scom-product-visual--paysend
{
    background: linear-gradient(
            145deg,
            #faf8ff 0%,
            #eee9fb 52%,
            #e4ddf6 100%
        );
}

.scom-product-visual--paysend::before
{
    background: radial-gradient(
            circle,
            rgba(114, 88, 182, 0.18) 0%,
            rgba(114, 88, 182, 0.06) 48%,
            transparent 72%
        );
}

/* UNI5PAY+ */
.scom-product-visual--uni5pay
{
    background: linear-gradient(
            145deg,
            #fffafa 0%,
            #fbedee 52%,
            #f4dfe1 100%
        );
}

.scom-product-visual--uni5pay::before
{
    background: radial-gradient(
            circle,
            rgba(224, 34, 40, 0.17) 0%,
            rgba(224, 34, 40, 0.05) 48%,
            transparent 72%
        );
}

/* PAYPAL */
.scom-product-visual--paypal
{
    background: linear-gradient(
            145deg,
            #f9fcff 0%,
            #e9f4fd 52%,
            #dceefa 100%
        );
}

.scom-product-visual--paypal::before
{
    background: radial-gradient(
            circle,
            rgba(22, 113, 185, 0.17) 0%,
            rgba(22, 113, 185, 0.05) 48%,
            transparent 72%
        );
}

/* LOGO BOVEN TELEFOON */
.scom-product-visual__brand
{
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 52px;
    margin-bottom: 24px;
}

.scom-product-visual__brand img
{
    display: block !important;
    width: auto !important;
    max-width: 185px !important;
    height: auto !important;
    max-height: 54px !important;
    margin: 0 auto !important;
    object-fit: contain !important;
    object-position: center !important;
}

.scom-product-visual--paysend
.scom-product-visual__brand img
{
    max-width: 175px !important;
    max-height: 48px !important;
}

.scom-product-visual--uni5pay
.scom-product-visual__brand img
{
    max-width: 180px !important;
    max-height: 52px !important;
}

.scom-product-visual--paypal
.scom-product-visual__brand img
{
    max-width: 155px !important;
    max-height: 48px !important;
}

/* TELEFOONAFBEELDING */
.scom-product-visual__phone
{
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 390px;
    min-height: 390px;
    margin: 0 auto;
}

.scom-product-visual__phone img
{
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 490px !important;
    margin: 0 auto !important;
    object-fit: contain !important;
    object-position: center !important;
    filter: drop-shadow(
        0 24px 24px rgba(26, 28, 34, 0.15)
    );
    transition: transform 0.3s ease,
        filter 0.3s ease;
}

.scom-service-card--visual:hover
.scom-product-visual__phone img
{
    filter: drop-shadow(
        0 28px 28px rgba(26, 28, 34, 0.18)
    );
    transform: translateY(-5px);
}

.scom-product-visual__caption
{
    position: relative;
    z-index: 3;
    width: 100%;
    max-width: 340px;
    margin: 24px auto 0 !important;
    color: var(--scom-muted);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.55;
    text-align: center;
}

/* =========================================================
   MERKKOPPEN
   ========================================================= */
.scom-brand-heading
{
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 18px;
}

.scom-section-number
{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    color: var(--scom-white);
    font-size: 11px;
    font-weight: 800;
}

.scom-brand-name
{
    font-size: 24px;
    font-weight: 800;
    letter-spacing: -0.6px;
}

.scom-brand-heading--paysend
.scom-brand-name
{
    color: var(--scom-purple);
}

.scom-brand-heading--paysend
.scom-section-number
{
    background: var(--scom-purple);
}

.scom-brand-heading--uni5pay
.scom-brand-name
{
    color: var(--scom-red);
}

.scom-brand-heading--uni5pay
.scom-section-number
{
    background: var(--scom-red);
}

.scom-brand-heading--paypal
.scom-brand-name
{
    color: var(--scom-blue);
}

.scom-brand-heading--paypal
.scom-section-number
{
    background: var(--scom-blue);
}

.scom-introduction
{
    margin-bottom: 24px !important;
    font-size: 17px;
}

/* =========================================================
   HIGHLIGHTBLOKKEN
   ========================================================= */
.scom-highlight-box
{
    margin: 23px 0;
    padding: 18px 20px;
    border-left: 4px solid;
    border-radius: 0 13px 13px 0;
    font-size: 14px;
}

.scom-highlight-box strong
{
    color: var(--scom-dark);
}

.scom-highlight-box--purple
{
    border-color: var(--scom-purple);
    background: var(--scom-purple-light);
}

.scom-highlight-box--blue
{
    border-color: var(--scom-blue);
    background: var(--scom-blue-light);
}

/* =========================================================
   STAPPEN
   ========================================================= */
.scom-step-list
{
    display: grid;
    gap: 11px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.scom-step-list li
{
    display: grid;
    grid-template-columns: 39px 1fr;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--scom-grey-200);
    border-radius: 14px;
    background: var(--scom-white);
}

.scom-step-list__number
{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    color: var(--scom-red);
    background: var(--scom-red-light);
    font-size: 13px;
    font-weight: 800;
}

.scom-step-list strong
{
    display: block;
    margin-bottom: 2px;
    color: var(--scom-dark);
    font-size: 15px;
}

.scom-step-list p
{
    margin: 0;
    color: var(--scom-muted);
    font-size: 13px;
}

/* =========================================================
   KLEINE INFOBLOKKEN
   ========================================================= */
.scom-small-info-grid
{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 22px;
}

.scom-small-info-grid > div
{
    padding: 14px;
    border-radius: 12px;
    background: var(--scom-grey-100);
}

.scom-small-info-grid span
{
    display: block;
    margin-bottom: 4px;
    color: var(--scom-muted);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.7px;
    text-transform: uppercase;
}

.scom-small-info-grid strong
{
    display: block;
    color: var(--scom-dark);
    font-size: 12px;
    line-height: 1.4;
}

/* =========================================================
   FEATURE LABELS
   ========================================================= */
.scom-feature-pills
{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 22px 0;
}

.scom-feature-pills span
{
    padding: 8px 12px;
    border: 1px solid #ffd2d4;
    border-radius: 999px;
    color: var(--scom-red);
    background: var(--scom-red-light);
    font-size: 11px;
    font-weight: 700;
}

/* =========================================================
   ACCORDION
   ========================================================= */
.scom-accordion-group
{
    display: grid;
    gap: 10px;
    margin-top: 25px;
}

.scom-accordion
{
    overflow: hidden;
    border: 1px solid var(--scom-grey-200);
    border-radius: 14px;
    background: var(--scom-white);
}

.scom-accordion__button
{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    width: 100%;
    padding: 17px;
    border: 0;
    color: var(--scom-dark);
    background: transparent;
    font: inherit;
    font-size: 15px;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
}

.scom-accordion__button small
{
    display: block;
    margin-bottom: 2px;
    color: var(--scom-red);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.9px;
    text-transform: uppercase;
}

.scom-accordion__icon
{
    position: relative;
    flex: 0 0 auto;
    width: 27px;
    height: 27px;
    border-radius: 50%;
    background: var(--scom-grey-100);
}

.scom-accordion__icon::before,
.scom-accordion__icon::after
{
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 2px;
    border-radius: 20px;
    background: var(--scom-dark);
    content: "";
    transform: translate(-50%, -50%);
    transition: transform 0.2s ease;
}

.scom-accordion__icon::after
{
    transform: translate(-50%, -50%)
        rotate(90deg);
}

.scom-accordion.is-open
.scom-accordion__icon::after
{
    transform: translate(-50%, -50%)
        rotate(0deg);
}

.scom-accordion__content
{
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease;
}

.scom-accordion__inner
{
    padding: 0 18px 19px;
    border-top: 1px solid var(--scom-grey-200);
}

.scom-numbered-list,
.scom-check-list
{
    margin: 18px 0 0;
    padding-left: 21px;
}

.scom-numbered-list li,
.scom-check-list li
{
    margin-bottom: 9px;
    font-size: 14px;
}

.scom-check-list
{
    padding: 0;
    list-style: none;
}

.scom-check-list li
{
    position: relative;
    padding-left: 27px;
}

.scom-check-list li::before
{
    position: absolute;
    top: 3px;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    color: var(--scom-white);
    background: var(--scom-red);
    content: "✓";
    font-size: 10px;
    font-weight: 800;
}

.scom-inline-notice
{
    margin-top: 18px;
    padding: 13px 15px;
    border-radius: 11px;
    color: var(--scom-dark);
    background: var(--scom-grey-100);
    font-size: 13px;
}

/* =========================================================
   APP STORE BUTTONS
   ========================================================= */
.scom-download-buttons
{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: auto;
    padding-top: 22px;
}

.scom-store-button
{
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 170px;
    min-height: 57px;
    padding: 10px 17px;
    border-radius: 11px;
    color: var(--scom-white);
    background: var(--scom-dark);
    transition: transform 0.2s ease;
}

.scom-store-button:hover
{
    color: var(--scom-white);
    transform: translateY(-2px);
}

.scom-store-button span
{
    font-size: 9px;
    line-height: 1.2;
}

.scom-store-button strong
{
    font-size: 16px;
    line-height: 1.2;
}

/* =========================================================
   BELANGRIJKE INFORMATIE
   ========================================================= */
.scom-important-section
{
    margin-top: 55px;
    padding: 45px 0 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    scroll-margin-top: 25px;
}

.scom-important-section__heading
{
    width: 100%;
    max-width: 900px;
    margin-bottom: 28px;
}

.scom-important-section__heading h2
{
    margin-bottom: 0;
}

.scom-important-grid
{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    align-items: stretch;
}

.scom-important-card
{
    display: flex;
    flex-direction: column;
    min-height: 245px;
    padding: 24px;
    border: 1px solid var(--scom-grey-200);
    border-radius: 16px;
    background: var(--scom-white);
    box-shadow: none;
}

.scom-important-card__icon
{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    min-width: 58px;
    min-height: 42px;
    margin-bottom: 22px;
    padding: 8px 12px;
    border-radius: 10px;
    color: var(--scom-red);
    background: var(--scom-red-light);
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
}

.scom-important-card h3
{
    margin: 0 0 11px;
    color: var(--scom-dark);
    font-size: 18px;
    line-height: 1.3;
}

.scom-important-card p
{
    margin: 0;
    color: var(--scom-muted);
    font-size: 14px;
    line-height: 1.55;
}

.scom-important-card strong
{
    color: var(--scom-dark);
    font-weight: 800;
}

/* =========================================================
   VEILIGHEID
   ========================================================= */
.scom-security-section
{
    display: grid;
    grid-template-columns: 55px 1fr;
    gap: 20px;
    align-items: start;
    margin-top: 22px;
    padding: 24px;
    border: 1px solid #ffd3d5;
    border-radius: 16px;
    background: var(--scom-red-light);
}

.scom-security-section__icon
{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 49px;
    height: 49px;
    border-radius: 14px;
    color: var(--scom-white);
    background: var(--scom-red);
    font-size: 20px;
    font-weight: 800;
}

.scom-security-section h2
{
    margin: 1px 0 7px;
    font-size: 21px;
}

.scom-security-section p
{
    margin: 0;
    font-size: 13px;
}

/* =========================================================
   TABLET
   ========================================================= */
@media (max-width: 1180px)
{
    .scom-prepaid-grid--mastercard
    {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 1050px)
{
    .scom-service-navigation
    {
        grid-template-columns: repeat(3, 1fr);
    }

    .scom-important-grid
    {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .scom-service-card--content
    {
        padding: 31px;
    }

    .scom-product-visual
    {
        padding: 38px 22px 27px;
    }

    .scom-product-visual__phone
    {
        max-width: 350px;
        min-height: 330px;
    }

    .scom-product-visual__phone img
    {
        max-height: 455px !important;
    }

}

/* =========================================================
   MOBIELE LAYOUT
   ========================================================= */
@media (max-width: 850px)
{
    .scom-service-navigation
    {
        grid-template-columns: repeat(2, 1fr);
    }

    .scom-prepaid-grid--upi
    {
        grid-template-columns: 1fr;
        max-width: 560px;
    }

    .scom-info-hero > p
    {
        white-space: normal;
    }

    .scom-info-page
    {
        padding-right: 18px;
        padding-left: 18px;
    }

    .scom-info-hero
    {
        padding: 25px 0 32px;
    }

    .scom-service-section
    {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 45px 0;
    }

    .scom-service-section--reverse
        .scom-service-card--visual,
    .scom-service-section--reverse
        .scom-service-card--content
    {
        order: initial;
    }

    .scom-service-card
    {
        min-height: auto !important;
    }

    .scom-product-visual
    {
        min-height: 520px;
    }

    .scom-product-visual__phone
    {
        min-height: 350px;
    }

    .scom-small-info-grid
    {
        grid-template-columns: 1fr;
    }

    .scom-important-section
    {
        padding-top: 35px;
    }

}

@media (max-width: 600px)
{
    .scom-card-family__title
    {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }

    .scom-card-family__logo
    {
        max-width: 96px !important;
        height: 36px !important;
    }

    .scom-card-family__logo--upi
    {
        max-width: 108px !important;
        height: 38px !important;
    }

    .scom-card-family__header
    {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .scom-prepaid-grid--mastercard,
    .scom-prepaid-grid--upi
    {
        grid-template-columns: 1fr;
    }

    .scom-prepaid-card__visual
    {
        min-height: 180px;
    }

    .scom-info-page
    {
        padding-top: 14px;
    }

    .scom-info-page h1
    {
        font-size: 35px;
        letter-spacing: -1px;
    }

    .scom-info-page h2
    {
        font-size: 29px;
    }

    .scom-info-hero
    {
        padding: 20px 0 28px;
    }

    .scom-info-hero > p
    {
        font-size: 15px;
    }

    .scom-service-navigation
    {
        grid-template-columns: 1fr;
        margin-bottom: 35px;
    }

    .scom-service-card
    {
        border-radius: 20px;
    }

    .scom-service-card--content
    {
        padding: 26px 20px;
    }

    .scom-product-visual
    {
        min-height: 470px;
        padding: 30px 18px 24px;
    }

    .scom-product-visual::before
    {
        width: 330px;
        height: 330px;
    }

    .scom-product-visual__brand
    {
        min-height: 42px;
        margin-bottom: 18px;
    }

    .scom-product-visual__brand img
    {
        max-width: 145px !important;
        max-height: 43px !important;
    }

    .scom-product-visual--paysend
        .scom-product-visual__brand img
    {
        max-width: 145px !important;
    }

    .scom-product-visual--uni5pay
        .scom-product-visual__brand img
    {
        max-width: 150px !important;
    }

    .scom-product-visual--paypal
        .scom-product-visual__brand img
    {
        max-width: 130px !important;
    }

    .scom-product-visual__phone
    {
        max-width: 290px;
        min-height: 310px;
    }

    .scom-product-visual__phone img
    {
        max-height: 390px !important;
    }

    .scom-product-visual__caption
    {
        margin-top: 18px !important;
        font-size: 11px;
    }

    .scom-step-list li
    {
        grid-template-columns: 34px 1fr;
        gap: 11px;
        padding: 14px;
    }

    .scom-step-list__number
    {
        width: 33px;
        height: 33px;
    }

    .scom-download-buttons
    {
        display: grid;
        grid-template-columns: 1fr;
    }

    .scom-store-button
    {
        width: 100%;
    }

    .scom-important-section
    {
        margin-top: 35px;
        padding-top: 25px;
    }

    .scom-important-grid
    {
        grid-template-columns: 1fr;
    }

    .scom-security-section
    {
        grid-template-columns: 1fr;
    }

}

/* =========================================================
   2026 COMPACTE KAARTEN + SERVICE OVERRIDES
   ========================================================= */
/* Geen aantallen rechts van de kaartfamilie */
.scom-card-family__count
{
    display: none !important;
}

/* Vier gelijke kolommen voor beide kaartnetwerken */
.scom-prepaid-grid--mastercard,
.scom-prepaid-grid--upi
{
    grid-template-columns: repeat(4, minmax(0, 1fr));
    max-width: none;
    margin: 0;
    align-items: stretch;
}

.scom-prepaid-card
{
    height: 100%;
}

.scom-prepaid-card__visual--image
{
    position: relative;
    min-height: 175px;
    margin: 12px 12px 0;
    padding: 26px 16px 18px;
}

.scom-prepaid-card__visual--image img
{
    max-width: 225px;
    max-height: 145px;
}

.scom-prepaid-card__body
{
    padding: 18px;
}

.scom-prepaid-card__body > h4
{
    min-height: 44px;
    margin: 8px 0 12px;
    font-size: 17px;
}

.scom-prepaid-card__meta-row
{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 30px;
}

.scom-card-type
{
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 5px 9px;
    border: 1px solid var(--scom-grey-200);
    border-radius: 999px;
    color: var(--scom-text);
    background: var(--scom-grey-50);
    font-size: 9px;
    font-weight: 800;
    line-height: 1.2;
}

.scom-network-logo
{
    display: block !important;
    flex: 0 0 auto;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    object-fit: contain !important;
}

.scom-network-logo--mc
{
    max-width: 54px !important;
    max-height: 22px !important;
}

.scom-network-logo--upi
{
    max-width: 62px !important;
    max-height: 25px !important;
}

.scom-feature-badge,
.scom-currency-badge
{
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 9px;
    font-weight: 800;
    line-height: 1;
}

.scom-feature-badge
{
    color: #fff;
    background: var(--scom-red);
    box-shadow: 0 8px 20px rgba(224, 34, 40, .18);
}

.scom-currency-badge
{
    color: #fff;
    background: #202124;
}

.scom-currency-badge--eur
{
    background: #0060a0;
}

/* Normale bullets, zonder custom rode dots */
.scom-prepaid-card__benefits
{
    display: block;
    min-height: 110px;
    margin: 0 0 14px;
    padding-left: 18px;
    list-style: disc;
}

.scom-prepaid-card__benefits li
{
    padding-left: 1px;
    margin-bottom: 6px;
    font-size: 11px;
    line-height: 1.45;
}

.scom-prepaid-card__benefits li::before
{
    display: none !important;
}

.scom-prepaid-card__specs
{
    width: 100%;
    margin: auto 0 15px;
}

.scom-prepaid-card__specs > div
{
    min-height: 35px;
    padding: 7px 0;
}

.scom-prepaid-card__specs dt,
.scom-prepaid-card__specs dd
{
    font-size: 10.5px;
}

/* Serviceblokken compacter: minder scrollen, geen kunstmatige gelijke hoogte */
.scom-service-section
{
    grid-template-columns: minmax(250px, .72fr) minmax(0, 1.28fr);
    gap: 18px;
    align-items: start;
    padding: 34px 0;
}

.scom-service-section--reverse .scom-service-card--visual
{
    order: 2;
}

.scom-service-section--reverse .scom-service-card--content
{
    order: 1;
}

.scom-service-card
{
    height: auto;
    min-height: 0 !important;
    border-radius: 20px;
}

.scom-service-card--content
{
    padding: 26px 28px;
}

.scom-service-card--content h2
{
    margin-bottom: 12px;
    font-size: clamp(25px, 2.4vw, 34px);
}

.scom-product-visual
{
    height: auto;
    min-height: 390px;
    padding: 24px 22px 20px;
}

.scom-product-visual::before
{
    width: 330px;
    height: 330px;
}

.scom-product-visual__brand
{
    min-height: 40px;
    margin-bottom: 12px;
}

.scom-product-visual__brand img
{
    max-width: 145px !important;
    max-height: 40px !important;
}

.scom-product-visual__phone
{
    max-width: 265px;
    min-height: 245px;
}

.scom-product-visual__phone img
{
    max-height: 300px !important;
}

.scom-product-visual__caption
{
    margin-top: 8px;
}

.scom-step-list
{
    gap: 8px;
    margin-top: 14px;
}

.scom-step-list li
{
    gap: 12px;
    padding: 11px 0;
}

.scom-step-list__number
{
    width: 28px;
    height: 28px;
    font-size: 10px;
}

.scom-step-list strong
{
    font-size: 13px;
}

.scom-step-list p
{
    margin-top: 2px;
    font-size: 12px;
    line-height: 1.5;
}

.scom-accordion-group
{
    margin-top: 14px;
}

.scom-accordion__button
{
    padding: 14px 16px;
}

.scom-accordion__inner
{
    padding: 0 16px 16px;
}

@media (max-width: 1120px)
{
    .scom-prepaid-grid--mastercard,
    .scom-prepaid-grid--upi
    {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .scom-prepaid-card__benefits
    {
        min-height: 88px;
    }

}

@media (max-width: 850px)
{
    .scom-service-section,
    .scom-service-section--reverse
    {
        grid-template-columns: 1fr;
        gap: 14px;
        padding: 28px 0;
    }

    .scom-service-section--reverse .scom-service-card--visual,
    .scom-service-section--reverse .scom-service-card--content
    {
        order: initial;
    }

    .scom-product-visual
    {
        min-height: 330px;
    }

}

@media (max-width: 620px)
{
    .scom-prepaid-grid--mastercard,
    .scom-prepaid-grid--upi
    {
        grid-template-columns: 1fr;
    }

    .scom-prepaid-card__benefits
    {
        min-height: 0;
    }

    .scom-prepaid-card__body > h4
    {
        min-height: 0;
    }

    .scom-service-card--content
    {
        padding: 22px 20px;
    }

    .scom-product-visual
    {
        min-height: 300px;
    }

    .scom-product-visual__phone
    {
        max-width: 225px;
        min-height: 210px;
    }

    .scom-product-visual__phone img
    {
        max-height: 255px !important;
    }

}

/* =========================================================
   LAATSTE AANPASSINGEN — KAARTINFO + SERVICE LAYOUT
   ========================================================= */
/* EUR-tag bewust zwart, net als USD */
.scom-currency-badge--eur
{
    color: #fff !important;
    background: #202124 !important;
}

/* Grijze doelgroep-card terug in elke prepaidkaart */
.scom-prepaid-card__audience
{
    display: block;
    min-height: 82px;
    margin: 0 0 15px;
    padding: 12px 13px;
    border: 0;
    border-radius: 11px;
    background: #f1f1f2;
}

.scom-prepaid-card__audience span
{
    display: block;
    margin-bottom: 5px;
    color: #222327;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.35;
    text-transform: none;
}

.scom-prepaid-card__audience p
{
    margin: 0;
    color: #4f5258;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.42;
}

/* Laat benefits en doelgroepblokken netjes op dezelfde lijn eindigen */
.scom-prepaid-card__benefits
{
    min-height: 104px;
}

/* =========================================================
   PAYSEND / UNI5PAY / PAYPAL
   Boven: afbeelding + korte uitleg
   Onder: detailblok over volledige breedte
   ========================================================= */
.scom-service-section,
.scom-service-section--reverse
{
    display: grid;
    grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr);
    gap: 18px;
    align-items: stretch;
    padding: 38px 0;
    border-bottom: 1px solid var(--scom-grey-200);
    scroll-margin-top: 25px;
}

.scom-service-section .scom-service-card--visual,
.scom-service-section--reverse .scom-service-card--visual
{
    order: initial !important;
    grid-column: 1;
    grid-row: 1;
}

.scom-service-card--summary
{
    grid-column: 2;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 28px 30px;
}

.scom-service-card--detail
{
    grid-column: 1 / -1;
    grid-row: 2;
    padding: 26px 30px 28px;
}

.scom-service-card--summary h2
{
    margin-bottom: 12px;
    font-size: clamp(25px, 2.4vw, 34px);
}

.scom-service-card--summary .scom-introduction
{
    margin-bottom: 14px !important;
    font-size: 15px;
    line-height: 1.65;
}

.scom-service-card--summary .scom-highlight-box
{
    margin: 12px 0 0;
    padding: 14px 16px;
    font-size: 12px;
    line-height: 1.55;
}

.scom-service-card--summary .scom-feature-pills
{
    margin: 12px 0 0;
}

.scom-service-card--detail > h3
{
    margin: 0 0 17px;
    font-size: 20px;
}

/* Visual blijft compact en hoeft niet de hoogte van alle uitleg te volgen */
.scom-service-section .scom-product-visual
{
    height: 100%;
    min-height: 365px;
    padding: 24px 20px 20px;
}

.scom-service-section .scom-product-visual__brand
{
    min-height: 38px;
    margin-bottom: 10px;
}

.scom-service-section .scom-product-visual__phone
{
    max-width: 255px;
    min-height: 230px;
}

.scom-service-section .scom-product-visual__phone img
{
    max-height: 285px !important;
}

.scom-service-section .scom-product-visual__caption
{
    margin-top: 8px !important;
}

/* Paysend en PayPal: stappen naast elkaar in het brede onderste vlak */
#paysend .scom-service-card--detail .scom-step-list,
#paypal .scom-service-card--detail .scom-step-list
{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 12px;
    margin: 0;
}

#paysend .scom-service-card--detail .scom-step-list li,
#paypal .scom-service-card--detail .scom-step-list li
{
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 11px;
    min-height: 94px;
    padding: 14px;
    border: 1px solid var(--scom-grey-200);
    border-radius: 13px;
    background: #fff;
}

#paysend .scom-service-card--detail .scom-step-list li:last-child,
#paypal .scom-service-card--detail .scom-step-list li:last-child
{
    grid-column: 1 / -1;
    min-height: 0;
}

.scom-service-card--detail .scom-step-list__number
{
    width: 30px;
    height: 30px;
}

.scom-service-card--detail .scom-step-list strong
{
    font-size: 13px;
}

.scom-service-card--detail .scom-step-list p
{
    font-size: 11.5px;
    line-height: 1.5;
}

/* Kleine Paysend-info blijft onder de stappen, maar compact */
#paysend .scom-small-info-grid
{
    margin-top: 14px;
}

/* Uni5Pay gebruikt het brede onderste vlak optimaal */
#uni5pay .scom-accordion-group
{
    margin-top: 0;
}

#uni5pay .scom-download-buttons
{
    margin-top: 16px;
    padding-top: 0;
}

/* Geen JS-height trucjes nodig */
.scom-service-card
{
    min-height: 0 !important;
    height: auto !important;
}

@media (max-width: 1120px)
{
    .scom-prepaid-card__benefits
    {
        min-height: 88px;
    }

    .scom-prepaid-card__audience
    {
        min-height: 72px;
    }

}

@media (max-width: 850px)
{
    .scom-service-section,
    .scom-service-section--reverse
    {
        grid-template-columns: 1fr;
        gap: 14px;
        padding: 30px 0;
    }

    .scom-service-section .scom-service-card--visual,
    .scom-service-card--summary,
    .scom-service-card--detail
    {
        grid-column: 1;
        grid-row: auto;
    }

    .scom-service-section .scom-product-visual
    {
        min-height: 320px;
    }

    #paysend .scom-service-card--detail .scom-step-list,
    #paypal .scom-service-card--detail .scom-step-list
    {
        grid-template-columns: 1fr;
    }

    #paysend .scom-service-card--detail .scom-step-list li:last-child,
    #paypal .scom-service-card--detail .scom-step-list li:last-child
    {
        grid-column: auto;
    }

}

@media (max-width: 620px)
{
    .scom-prepaid-card__benefits,
    .scom-prepaid-card__audience
    {
        min-height: 0;
    }

    .scom-service-card--summary,
    .scom-service-card--detail
    {
        padding: 22px 20px;
    }

    .scom-service-section .scom-product-visual
    {
        min-height: 290px;
    }

}

/* =========================================================
   HEADLINES — VOLLEDIGE BREEDTE OP ÉÉN REGEL
   Alleen de weergave van headlines is aangepast.
   ========================================================= */
@media (min-width: 851px)
{
    .scom-info-hero h1,
    .scom-prepaid-section__heading h2,
    .scom-card-family__header h3,
    .scom-service-card--summary h2,
    .scom-service-card--detail > h3,
    .scom-important-section__heading h2,
    .scom-security-section h2
    {
        width: 100%;
        max-width: none;
        white-space: nowrap;
        overflow-wrap: normal;
        word-break: normal;
    }

    /* Lange service-headlines blijven op één regel binnen hun kaart */
    .scom-service-card--summary h2
    {
        font-size: clamp(24px, 2.15vw, 32px);
        letter-spacing: -0.7px;
    }

    /* De lange UnionPay-headline gebruikt de volledige paginabreedte */
    .scom-important-section__heading
    {
        max-width: none;
    }

    .scom-important-section__heading h2
    {
        font-size: clamp(28px, 3vw, 40px);
    }

}

/* Op tablet/mobiel mag tekst weer natuurlijk afbreken */
@media (max-width: 850px)
{
    .scom-info-hero h1,
    .scom-prepaid-section__heading h2,
    .scom-card-family__header h3,
    .scom-service-card--summary h2,
    .scom-service-card--detail > h3,
    .scom-important-section__heading h2,
    .scom-security-section h2
    {
        white-space: normal;
        overflow-wrap: normal;
        word-break: normal;
    }

}

/* =========================================================
   CLEAN PREPAID CARD DESIGN — JULI 2026
   Geïnspireerd op de aangeleverde referentie:
   - witte kaarten
   - dunne border
   - geen shadow
   - rustige info-/tabelrijen
   - subtiele grijze doelgroepblokken
   ========================================================= */
/* Kaartfamilies iets rustiger uit elkaar */
.scom-card-family + .scom-card-family
{
    margin-top: 52px;
}

.scom-card-family__header
{
    margin-bottom: 20px;
}

/* Hoofdgrid */
.scom-prepaid-grid--mastercard,
.scom-prepaid-grid--upi
{
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    max-width: none;
    margin: 0;
    align-items: stretch;
}

/* Basiskaart: volledig flat */
.scom-prepaid-card,
.scom-prepaid-card:hover
{
    overflow: hidden;
    height: 100%;
    border: 1px solid #dedfe2;
    border-radius: 20px;
    background: #fff;
    box-shadow: none !important;
    transform: none !important;
}

.scom-prepaid-card
{
    transition: border-color .2s ease;
}

.scom-prepaid-card:hover
{
    border-color: #cfd1d5;
}

/* Kaartafbeelding: volledig clean, zonder gradientvlak */
.scom-prepaid-card__visual,
.scom-prepaid-card__visual--image
{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 184px;
    margin: 0;
    padding: 38px 18px 18px;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: #fff !important;
}

.scom-prepaid-card__visual--image::before,
.scom-prepaid-card__visual--image::after
{
    display: none !important;
}

.scom-prepaid-card__visual--image img,
.scom-prepaid-card:hover .scom-prepaid-card__visual--image img
{
    width: auto;
    max-width: 82%;
    height: auto;
    max-height: 128px;
    filter: none !important;
    transform: none !important;
}

/* Badge bovenaan, klein en zakelijk */
.scom-feature-badge,
.scom-currency-badge
{
    top: 16px;
    left: 18px;
    min-height: 22px;
    padding: 5px 8px;
    border-radius: 999px;
    box-shadow: none;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .6px;
    line-height: 1;
}

.scom-feature-badge
{
    color: var(--scom-red);
    background: #fff1f2;
}

.scom-currency-badge,
.scom-currency-badge--eur
{
    color: #6c6f75 !important;
    background: transparent !important;
    left: auto;
    right: 18px;
    padding-right: 0;
    padding-left: 0;
    border-radius: 0;
    letter-spacing: 1.1px;
}

/* Body */
.scom-prepaid-card__body
{
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 8px 17px 17px;
}

/* Meta: netwerk + kaarttype als rustige bovenregel */
.scom-prepaid-card__meta-row
{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 25px;
    margin-bottom: 8px;
}

.scom-prepaid-card__meta-row .scom-network-logo
{
    order: -1;
}

.scom-network-logo--mc
{
    max-width: 36px !important;
    max-height: 18px !important;
}

.scom-network-logo--upi
{
    max-width: 42px !important;
    max-height: 20px !important;
}

.scom-card-type
{
    min-height: auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    color: #85888e;
    background: transparent;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .75px;
    line-height: 1.25;
    text-align: right;
    text-transform: uppercase;
}

/* Titel */
.scom-prepaid-card__body > h4
{
    min-height: 46px;
    margin: 0 0 13px;
    color: #101114;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -.2px;
}

/* Benefits: rustig, compact, geen opvallende rode dots */
.scom-prepaid-card__benefits
{
    display: block;
    min-height: 108px;
    margin: 0 0 15px;
    padding: 0;
    list-style: none;
}

.scom-prepaid-card__benefits li
{
    position: relative;
    margin: 0 0 6px;
    padding: 0 0 0 12px;
    color: #555960;
    font-size: 11px;
    line-height: 1.48;
}

.scom-prepaid-card__benefits li::before
{
    position: absolute;
    top: .68em;
    left: 0;
    display: block !important;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #aeb1b6;
    content: "";
}

/* Doelgroepvlak zoals referentie */
.scom-prepaid-card__audience
{
    display: block;
    min-height: 76px;
    margin: 0 0 15px;
    padding: 11px 12px;
    border: 0;
    border-radius: 11px;
    background: #f5f5f6;
}

.scom-prepaid-card__audience span
{
    display: block;
    margin-bottom: 5px;
    color: #8a8d92;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: 1px;
    line-height: 1.3;
    text-transform: uppercase;
}

.scom-prepaid-card__audience p
{
    margin: 0;
    color: #1b1c1f;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1.45;
}

/* Specs als zeer cleane tabel */
.scom-prepaid-card__specs
{
    display: grid;
    width: 100%;
    gap: 0;
    margin: auto 0 14px;
    border-top: 1px solid #e5e6e8;
}

.scom-prepaid-card__specs > div,
.scom-prepaid-card__specs > div:first-child
{
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 39px;
    padding: 9px 0;
    border-top: 0;
    border-bottom: 1px solid #e5e6e8;
    background: transparent;
}

.scom-prepaid-card__specs dt,
.scom-prepaid-card__specs dd
{
    margin: 0;
    font-size: 10px;
    line-height: 1.35;
}

.scom-prepaid-card__specs dt
{
    color: #7b7e84;
    font-weight: 500;
}

.scom-prepaid-card__specs dd
{
    color: #151619;
    font-weight: 800;
    text-align: right;
}

/* CTA onderaan: clean maar SCOM-rood behouden */
.scom-apply-button
{
    min-height: 42px;
    padding: 10px 12px;
    border-radius: 10px;
    box-shadow: none !important;
    font-size: 11px;
    transition: background-color .2s ease;
}

.scom-apply-button:hover
{
    box-shadow: none !important;
    transform: none !important;
}

/* Belangrijke informatie ook platter / tabelachtig */
.scom-important-card,
.scom-important-card:hover
{
    border: 1px solid #dedfe2;
    border-radius: 16px;
    background: #fff;
    box-shadow: none !important;
    transform: none !important;
}

.scom-important-card__icon
{
    box-shadow: none;
}

/* Servicekaarten eveneens zonder shadows */
.scom-service-card,
.scom-service-card:hover,
.scom-accordion,
.scom-store-button
{
    box-shadow: none !important;
}

/* Responsive */
@media (max-width: 1120px)
{
    .scom-prepaid-grid--mastercard,
    .scom-prepaid-grid--upi
    {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .scom-prepaid-card__benefits,
    .scom-prepaid-card__body > h4,
    .scom-prepaid-card__audience
    {
        min-height: 0;
    }

}

@media (max-width: 620px)
{
    .scom-prepaid-grid--mastercard,
    .scom-prepaid-grid--upi
    {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .scom-prepaid-card__visual,
    .scom-prepaid-card__visual--image
    {
        min-height: 190px;
    }

    .scom-prepaid-card__visual--image img
    {
        max-width: 76%;
        max-height: 140px;
    }

    .scom-prepaid-card__body
    {
        padding: 10px 17px 17px;
    }

}

/* =========================================================
   PREPAID KAARTEN — GELDIGHEID + KOSTEN/LIMIETEN DROPDOWNS
   ========================================================= */
.scom-prepaid-card__details
{
    width: 100%;
    margin: auto 0 15px;
}

.scom-card-validity-row
{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 44px;
    margin-bottom: 12px;
    padding: 10px 0;
    border-top: 1px solid var(--scom-grey-200);
    border-bottom: 1px solid var(--scom-grey-200);
}

.scom-card-validity-row__label
{
    color: var(--scom-muted);
    font-size: 10.5px;
    line-height: 1.4;
}

.scom-card-validity-row__value
{
    color: var(--scom-dark);
    font-size: 10.5px;
    font-weight: 800;
    line-height: 1.4;
    text-align: right;
}

.scom-card-dropdown + .scom-card-dropdown
{
    margin-top: 8px;
}

.scom-card-dropdown
{
    overflow: hidden;
    border-radius: 11px;
    background: #f5f5f6;
}

.scom-card-dropdown__button
{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    width: 100%;
    min-height: 42px;
    padding: 11px 13px;
    border: 0;
    border-radius: 11px;
    color: var(--scom-dark);
    background: transparent;
    font: inherit;
    font-size: 10.5px;
    font-weight: 800;
    line-height: 1.3;
    text-align: left;
    cursor: pointer;
}

.scom-card-dropdown__button:hover
{
    background: #f0f0f1;
}

.scom-card-dropdown__icon
{
    position: relative;
    flex: 0 0 auto;
    width: 14px;
    height: 14px;
}

.scom-card-dropdown__icon::before,
.scom-card-dropdown__icon::after
{
    position: absolute;
    top: 50%;
    left: 50%;
    width: 7px;
    height: 1.5px;
    border-radius: 999px;
    background: var(--scom-dark);
    content: "";
    transition: transform .2s ease;
}

.scom-card-dropdown__icon::before
{
    transform: translate(-78%, -50%) rotate(45deg);
}

.scom-card-dropdown__icon::after
{
    transform: translate(-22%, -50%) rotate(-45deg);
}

.scom-card-dropdown.is-open .scom-card-dropdown__icon::before
{
    transform: translate(-78%, -50%) rotate(-45deg);
}

.scom-card-dropdown.is-open .scom-card-dropdown__icon::after
{
    transform: translate(-22%, -50%) rotate(45deg);
}

.scom-card-dropdown__content
{
    max-height: 0;
    overflow: hidden;
    transition: max-height .28s ease;
}

.scom-card-dropdown__inner
{
    padding: 0 13px 11px;
}

.scom-card-dropdown__list
{
    margin: 0;
    padding: 0;
}

.scom-card-dropdown__list > div
{
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    padding: 8px 0;
    border-top: 1px solid #e4e4e6;
}

.scom-card-dropdown__list dt,
.scom-card-dropdown__list dd
{
    margin: 0;
    font-size: 10px;
    line-height: 1.4;
}

.scom-card-dropdown__list dt
{
    color: var(--scom-muted);
}

.scom-card-dropdown__list dd
{
    color: var(--scom-dark);
    font-weight: 800;
    text-align: right;
}

/* Oude specs zijn vervangen door bovenstaande details. */
.scom-prepaid-card__specs
{
    display: none !important;
}

/* =========================================================
   VISUALS — ALLEEN GRADIENT, GEEN DECORATIEVE CIRKELS
   ========================================================= */
.scom-product-visual::before,
.scom-product-visual::after
{
    display: none !important;
    content: none !important;
}

.scom-prepaid-card__visual--image
{
    background: linear-gradient(145deg, #ffffff 0%, #f7f7f8 100%) !important;
}

.scom-product-visual--paysend
{
    background: linear-gradient(145deg, #faf8ff 0%, #eee9fb 52%, #e4ddf6 100%) !important;
}

.scom-product-visual--uni5pay
{
    background: linear-gradient(145deg, #fffafa 0%, #fbedee 52%, #f4dfe1 100%) !important;
}

.scom-product-visual--paypal
{
    background: linear-gradient(145deg, #f9fcff 0%, #e9f4fd 52%, #dceefa 100%) !important;
}

/* =========================================================
   DEFINITIEF — ALLE SHADOWS VAN KAARTEN VERWIJDERD
   ========================================================= */
/* Prepaidkaart-containers volledig vlak */
.scom-prepaid-card,
.scom-prepaid-card:hover,
.scom-prepaid-card:focus-within
{
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
}

/* Geen schaduw achter de kaartafbeeldingen zelf */
.scom-prepaid-card__visual,
.scom-prepaid-card__visual--image,
.scom-prepaid-card__visual--image img,
.scom-prepaid-card:hover .scom-prepaid-card__visual--image img
{
    box-shadow: none !important;
    filter: none !important;
    text-shadow: none !important;
    transform: none !important;
}

/* Ook badges en knoppen volledig vlak */
.scom-feature-badge,
.scom-currency-badge,
.scom-card-type,
.scom-apply-button,
.scom-apply-button:hover,
.scom-card-dropdown,
.scom-card-dropdown__button,
.scom-card-dropdown__content
{
    box-shadow: none !important;
    filter: none !important;
}

/* Servicekaarten / belangrijke info eveneens zonder shadow */
.scom-service-card,
.scom-service-card:hover,
.scom-important-card,
.scom-important-card:hover,
.scom-accordion,
.scom-store-button,
.scom-service-navigation
{
    box-shadow: none !important;
}

/* Telefoonvisuals: ook geen drop-shadow */
.scom-product-visual__phone img,
.scom-service-card--visual:hover .scom-product-visual__phone img
{
    filter: none !important;
    box-shadow: none !important;
}

/* =========================================================
   FINAL OVERRIDE — WITTE ACHTERGROND ACHTER PREPAIDKAARTEN
   ========================================================= */
.scom-info-page .scom-prepaid-card__visual--image
{
    background: #ffffff !important;
    background-image: none !important;
}

/* =========================================================
   LAATSTE AANPASSINGEN — HOVER, STORE BADGES, SPACING
   Alleen deze drie punten zijn aangepast.
   ========================================================= */
/* Geen roze/andere hoverkleur op de Uni5Pay+ accordionknoppen */
.scom-info-page .scom-accordion__button,
.scom-info-page .scom-accordion__button:hover,
.scom-info-page .scom-accordion__button:focus,
.scom-info-page .scom-accordion__button:active,
.scom-info-page .scom-accordion.is-open .scom-accordion__button
{
    color: var(--scom-dark) !important;
    background: #ffffff !important;
    box-shadow: none !important;
    outline: none;
}

/* Officiële Google Play / App Store badges */
.scom-download-buttons
{
    align-items: center;
    gap: 12px;
}

.scom-store-button,
.scom-store-button:hover,
.scom-store-button:focus,
.scom-store-button:active
{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    min-width: 0;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    color: inherit;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
}

.scom-store-button__badge
{
    display: block;
    width: auto;
    height: 52px;
    max-width: 180px;
    object-fit: contain;
}

.scom-store-button__badge--apple
{
    height: 52px;
}

/* Bestaande teksten blijven in de HTML staan, maar het officiële badgebeeld is zichtbaar. */
.scom-store-button__text
{
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Minder witruimte vóór Belangrijke informatie */
.scom-important-section
{
    margin-top: 20px;
    padding-top: 20px;
}

@media (max-width: 600px)
{
    .scom-download-buttons
    {
        display: flex;
        flex-wrap: wrap;
    }

    .scom-store-button
    {
        width: auto;
    }

    .scom-store-button__badge,
    .scom-store-button__badge--apple
    {
        height: 48px;
        max-width: 165px;
    }

    .scom-important-section
    {
        margin-top: 16px;
        padding-top: 16px;
    }

}

/* =========================================================
   APP STORE / GOOGLE PLAY BADGES — GELIJKE GROOTTE
   ========================================================= */
.scom-download-buttons
{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.scom-store-button
{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    min-width: 0;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
}

.scom-store-button:hover,
.scom-store-button:focus,
.scom-store-button:active
{
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
}

.scom-store-button img
{
    display: block;
    width: auto !important;
    height: 46px !important;
    max-width: none !important;
    max-height: 46px !important;
    object-fit: contain;
}

/* Tekst blijft in HTML maar wordt niet getoond */
.scom-store-button > span,
.scom-store-button > strong
{
    display: none;
}

@media (max-width: 600px)
{
    .scom-download-buttons
    {
        display: flex;
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
        gap: 10px;
    }

    .scom-store-button
    {
        width: auto;
    }

    .scom-store-button img
    {
        height: 42px !important;
        max-height: 42px !important;
    }

}

@media (min-width: 851px)
{
    .scom-prepaid-section__heading
    {
        max-width: none !important;
        width: 100% !important;
    }

    .scom-prepaid-section__heading p
    {
        width: 100% !important;
        max-width: none !important;
        white-space: nowrap !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
    }

}

/* =========================================================
   FINAL OVERRIDE — DROPDOWNS ALTIJD LICHTGRIJS, ZWARTE TEKST
   Geen roze hover/open-state meer.
   ========================================================= */
.scom-info-page .scom-card-dropdown,
.scom-info-page .scom-card-dropdown:hover,
.scom-info-page .scom-card-dropdown:focus-within,
.scom-info-page .scom-card-dropdown.is-open
{
    background: #f5f5f6 !important;
    box-shadow: none !important;
    filter: none !important;
}

.scom-info-page .scom-card-dropdown__button,
.scom-info-page .scom-card-dropdown__button:hover,
.scom-info-page .scom-card-dropdown__button:focus,
.scom-info-page .scom-card-dropdown__button:active,
.scom-info-page .scom-card-dropdown.is-open .scom-card-dropdown__button
{
    color: var(--scom-dark) !important;
    background: #f5f5f6 !important;
    box-shadow: none !important;
    filter: none !important;
    outline: none !important;
}

.scom-info-page .scom-card-dropdown__button span,
.scom-info-page .scom-card-dropdown__button:hover span,
.scom-info-page .scom-card-dropdown__button:focus span,
.scom-info-page .scom-card-dropdown__button:active span,
.scom-info-page .scom-card-dropdown.is-open .scom-card-dropdown__button span
{
    color: var(--scom-dark) !important;
}

.scom-info-page .scom-card-dropdown__icon::before,
.scom-info-page .scom-card-dropdown__icon::after,
.scom-info-page .scom-card-dropdown:hover .scom-card-dropdown__icon::before,
.scom-info-page .scom-card-dropdown:hover .scom-card-dropdown__icon::after,
.scom-info-page .scom-card-dropdown.is-open .scom-card-dropdown__icon::before,
.scom-info-page .scom-card-dropdown.is-open .scom-card-dropdown__icon::after
{
    background: var(--scom-dark) !important;
}

/* =========================================================
   WAT ONTVANGT U BIJ UW KAART?
   COMPACTE INTERACTIEVE ANIMATIE
   ========================================================= */
.scom-envelope-section
{
    padding: 24px 0 54px;
    border-bottom: 1px solid var(--scom-grey-200);
}

.scom-envelope-heading
{
    max-width: 860px;
    margin-bottom: 26px;
}

.scom-envelope-heading h1
{
    margin-bottom: 12px;
}

.scom-envelope-heading > p
{
    max-width: 760px;
    margin-bottom: 0;
    font-size: 16px;
}

.scom-envelope-flow
{
    overflow: hidden;
    border: 1px solid var(--scom-grey-200);
    border-radius: 22px;
    background: #ffffff;
}

.scom-envelope-flow__tabs
{
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-bottom: 1px solid var(--scom-grey-200);
    background: #f7f7f8;
}

.scom-envelope-flow__tab
{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 58px;
    padding: 12px;
    border: 0;
    border-right: 1px solid var(--scom-grey-200);
    color: var(--scom-muted);
    background: transparent;
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}

.scom-envelope-flow__tab:last-child
{
    border-right: 0;
}

.scom-envelope-flow__tab span
{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 1px solid var(--scom-grey-300);
    border-radius: 50%;
    background: #ffffff;
    font-size: 9px;
}

.scom-envelope-flow__tab.is-active
{
    color: var(--scom-red);
    background: #ffffff;
}

.scom-envelope-flow__tab.is-active span
{
    border-color: var(--scom-red);
    color: #ffffff;
    background: var(--scom-red);
}

.scom-envelope-flow__content
{
    display: grid;
    grid-template-columns: minmax(0, 1.06fr) minmax(340px, .94fr);
    align-items: stretch;
}

.scom-envelope-flow__visual
{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 330px;
    padding: 18px 20px;
    overflow: hidden;
    background: linear-gradient(145deg, #fafafa 0%, #f0f0f2 100%);
}

.scom-envelope-stack
{
    position: relative;
    width: min(100%, 700px);
    height: 330px;
    perspective: 1200px;
}

.scom-envelope-stack__item
{
    position: absolute;
    inset: 50% auto auto 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 96%;
    height: 92%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    transform-style: preserve-3d;
    transition: transform .62s cubic-bezier(.2, .75, .2, 1),
        opacity .45s ease,
        filter .45s ease;
}

.scom-envelope-stack__item img
{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    transform: scale(1.08);
}

.scom-envelope-stack__item.is-active
{
    z-index: 3;
    opacity: 1;
    transform: translate(-50%, -50%)
        translateY(0)
        rotateZ(0deg)
        scale(1);
}

.scom-envelope-stack__item.is-before
{
    z-index: 1;
    opacity: .24;
    filter: grayscale(.2);
    transform: translate(-50%, -50%)
        translate(-72px, 26px)
        rotateZ(-6deg)
        scale(.90);
}

.scom-envelope-stack__item.is-after
{
    z-index: 2;
    opacity: .42;
    transform: translate(-50%, -50%)
        translate(72px, 22px)
        rotateZ(5deg)
        scale(.92);
}

.scom-envelope-stack__item:hover.is-active,
.scom-envelope-stack__item:focus.is-active
{
    transform: translate(-50%, -50%)
        translateY(-8px)
        rotateZ(0deg)
        scale(1.02);
}

.scom-envelope-stack__item:focus
{
    outline: none;
}

.scom-envelope-stack__pulse
{
    position: absolute;
    right: 18%;
    bottom: 10%;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(224, 34, 40, .35);
    border-radius: 50%;
    animation: scomEnvelopePulse 1.8s ease-out infinite;
    pointer-events: none;
}

@keyframes scomEnvelopePulse
{
    0%
    {
        opacity: .75;
        transform: scale(.7);
    }

    100%
    {
        opacity: 0;
        transform: scale(1.7);
    }

}

.scom-envelope-flow__info
{
    position: relative;
    display: flex;
    align-items: center;
    padding: 38px;
    background: #ffffff;
}

.scom-envelope-flow__panel
{
    width: 100%;
    opacity: 0;
    transform: translateX(24px);
}

.scom-envelope-flow__panel.is-active
{
    animation: scomEnvelopePanelIn .46s cubic-bezier(.2, .75, .2, 1) forwards;
}

@keyframes scomEnvelopePanelIn
{
    to
    {
        opacity: 1;
        transform: translateX(0);
    }

}

.scom-envelope-flow__number
{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 26px;
    margin-bottom: 14px;
    padding: 0 9px;
    border-radius: 999px;
    color: var(--scom-red);
    background: var(--scom-red-light);
    font-size: 9px;
    font-weight: 800;
}

.scom-envelope-flow__panel h2
{
    margin-bottom: 12px;
    font-size: clamp(27px, 2.7vw, 38px);
}

.scom-envelope-flow__panel > p
{
    margin-bottom: 20px;
    color: var(--scom-text);
    font-size: 15px;
    line-height: 1.65;
}

.scom-envelope-flow__callout
{
    margin: 0 0 20px;
    padding: 14px 16px;
    border-left: 4px solid var(--scom-red);
    border-radius: 0 11px 11px 0;
    background: var(--scom-red-light);
    font-size: 12px;
    line-height: 1.55;
}

.scom-envelope-flow__callout strong
{
    color: var(--scom-dark);
}

.scom-envelope-flow__list
{
    display: grid;
    gap: 8px;
    margin: 0 0 20px;
    padding: 0;
    list-style: none;
}

.scom-envelope-flow__list li
{
    position: relative;
    padding-left: 25px;
    font-size: 13px;
}

.scom-envelope-flow__list li::before
{
    position: absolute;
    top: 2px;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    color: #ffffff;
    background: var(--scom-red);
    content: "✓";
    font-size: 9px;
    font-weight: 800;
}

.scom-envelope-flow__actions
{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.scom-envelope-flow__button
{
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 45px;
    padding: 11px 14px;
    border: 1px solid var(--scom-red);
    border-radius: 10px;
    color: #ffffff;
    background: var(--scom-red);
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}

.scom-envelope-flow__button:hover,
.scom-envelope-flow__button:focus
{
    color: #ffffff;
    background: var(--scom-red-dark);
}

.scom-envelope-flow__button--light
{
    border-color: var(--scom-grey-200);
    color: var(--scom-dark);
    background: #f6f6f7;
}

.scom-envelope-flow__button--light:hover,
.scom-envelope-flow__button--light:focus
{
    color: var(--scom-dark);
    background: #ececee;
}

@media (prefers-reduced-motion: reduce)
{
    .scom-envelope-stack__item,
    .scom-envelope-flow__panel
    {
        transition: none;
        animation: none !important;
    }

    .scom-envelope-flow__panel.is-active
    {
        opacity: 1;
        transform: none;
    }

    .scom-envelope-stack__pulse
    {
        display: none;
    }

}

@media (max-width: 900px)
{
    .scom-envelope-flow__content
    {
        grid-template-columns: 1fr;
    }

    .scom-envelope-flow__visual
    {
        min-height: 330px;
    }

    .scom-envelope-flow__info
    {
        padding: 30px;
    }

}

@media (max-width: 620px)
{
    .scom-envelope-flow__tabs
    {
        grid-template-columns: 1fr;
    }

    .scom-envelope-flow__tab
    {
        justify-content: flex-start;
        border-right: 0;
        border-bottom: 1px solid var(--scom-grey-200);
    }

    .scom-envelope-flow__tab:last-child
    {
        border-bottom: 0;
    }

    .scom-envelope-flow__visual
    {
        min-height: 270px;
        padding: 12px 8px;
    }

    .scom-envelope-stack
    {
        height: 245px;
    }

    .scom-envelope-stack__item
    {
        width: 98%;
        height: 94%;
    }

    .scom-envelope-flow__info
    {
        padding: 24px 20px 26px;
    }

    .scom-envelope-flow__panel h2
    {
        font-size: 27px;
    }

    .scom-envelope-flow__actions
    {
        display: grid;
        grid-template-columns: 1fr;
    }

    .scom-envelope-flow__button
    {
        width: 100%;
    }

}

/* =========================================================
   DEFINITIEVE VOLGORDE + PAYSEND CTA + GEEN ROZE HOVER
   ========================================================= */
/* Geen kleurvlak, roze achtergrond of theme-hover op de animatieknoppen */
.scom-info-page .scom-envelope-stack__item,
.scom-info-page .scom-envelope-stack__item:hover,
.scom-info-page .scom-envelope-stack__item:focus,
.scom-info-page .scom-envelope-stack__item:active,
.scom-info-page .scom-envelope-stack__item:focus-visible
{
    padding: 0 !important;
    border: 0 !important;
    outline: none !important;
    color: inherit !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    filter: none !important;
}

.scom-info-page .scom-envelope-stack__item::before,
.scom-info-page .scom-envelope-stack__item::after
{
    display: none !important;
    content: none !important;
}

.scom-info-page .scom-envelope-stack__item img,
.scom-info-page .scom-envelope-stack__item:hover img,
.scom-info-page .scom-envelope-stack__item:focus img,
.scom-info-page .scom-envelope-stack__item:active img
{
    background: transparent !important;
    box-shadow: none !important;
    filter: none !important;
}

/* Paysend: direct door naar de uitgebreide pagina */
.scom-paysend-readmore
{
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    width: fit-content !important;
    min-width: 210px !important;
    min-height: 46px !important;
    margin: 18px 0 0 !important;
    padding: 11px 14px !important;
    border: 1px solid var(--scom-purple) !important;
    border-radius: 11px !important;
    color: #ffffff !important;
    background: var(--scom-purple) !important;
    box-shadow: none !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    text-decoration: none !important;
}

.scom-paysend-readmore:hover,
.scom-paysend-readmore:focus,
.scom-paysend-readmore:active
{
    border-color: var(--scom-purple-dark) !important;
    color: #ffffff !important;
    background: var(--scom-purple-dark) !important;
    box-shadow: none !important;
    transform: none !important;
}

/* Paysend bestaat nu alleen uit visual + samenvatting */
#paysend.scom-service-section
{
    grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr) !important;
    align-items: stretch !important;
}

#paysend .scom-service-card--visual
{
    grid-column: 1 !important;
    grid-row: 1 !important;
}

#paysend .scom-service-card--summary
{
    grid-column: 2 !important;
    grid-row: 1 !important;
}

@media (max-width: 850px)
{
    #paysend.scom-service-section
    {
        grid-template-columns: 1fr !important;
    }

    #paysend .scom-service-card--visual,
    #paysend .scom-service-card--summary
    {
        grid-column: 1 !important;
        grid-row: auto !important;
    }

}

@media (max-width: 620px)
{
    .scom-paysend-readmore
    {
        width: 100% !important;
        min-width: 0 !important;
    }

}

/* =========================================================
   PAYPAL-STAPPEN EN PREPAIDKAARTEN INKLAPBAAR
   ========================================================= */
.scom-info-page [hidden]
{
    display: none !important;
}

.scom-section-reveal
{
    margin-top: 18px;
}

.scom-section-reveal__button,
.scom-card-family__toggle
{
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    width: 100% !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 12px 15px !important;
    border: 1px solid var(--scom-grey-200) !important;
    border-radius: 11px !important;
    color: var(--scom-dark) !important;
    background: #f5f5f6 !important;
    box-shadow: none !important;
    font: inherit !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    text-align: left !important;
    cursor: pointer !important;
}

.scom-section-reveal__button:hover,
.scom-section-reveal__button:focus,
.scom-section-reveal__button:active,
.scom-card-family__toggle:hover,
.scom-card-family__toggle:focus,
.scom-card-family__toggle:active
{
    border-color: var(--scom-grey-300) !important;
    color: var(--scom-dark) !important;
    background: #f5f5f6 !important;
    box-shadow: none !important;
    outline: none !important;
}

.scom-section-reveal__icon,
.scom-card-family__toggle-icon
{
    position: relative;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    border: 1px solid var(--scom-grey-300);
    border-radius: 50%;
    background: #ffffff;
}

.scom-section-reveal__icon::before,
.scom-section-reveal__icon::after,
.scom-card-family__toggle-icon::before,
.scom-card-family__toggle-icon::after
{
    position: absolute;
    top: 50%;
    left: 50%;
    width: 9px;
    height: 1.5px;
    border-radius: 999px;
    background: var(--scom-dark);
    content: "";
    transform: translate(-50%, -50%);
    transition: transform .2s ease;
}

.scom-section-reveal__icon::after,
.scom-card-family__toggle-icon::after
{
    transform: translate(-50%, -50%) rotate(90deg);
}

.scom-section-reveal__button[aria-expanded="true"] .scom-section-reveal__icon::after,
.scom-card-family__toggle[aria-expanded="true"] .scom-card-family__toggle-icon::after
{
    transform: translate(-50%, -50%) rotate(0deg);
}

#paypal .scom-collapsible-panel
{
    grid-column: 1 / -1;
    scroll-margin-top: 24px;
}

#paypal .scom-collapsible-panel.is-open,
.scom-card-family__panel.is-open
{
    animation: scomRevealPanel .35s ease both;
}

.scom-card-family__actions
{
    margin: 0 0 16px;
}

.scom-card-family__toggle
{
    max-width: 330px !important;
}

.scom-card-family__panel
{
    width: 100%;
    scroll-margin-top: 24px;
}

@keyframes scomRevealPanel
{
    from
    {
        opacity: 0;
        transform: translateY(-8px);
    }

    to
    {
        opacity: 1;
        transform: translateY(0);
    }

}

.scom-card-family + .scom-card-family
{
    margin-top: 30px;
}

.scom-card-family__header
{
    margin-bottom: 12px;
}

@media (max-width: 620px)
{
    .scom-section-reveal__button,
    .scom-card-family__toggle
    {
        max-width: none !important;
        width: 100% !important;
    }

}

/* =========================================================
   MASTERCARD EN UNIONPAY NAAST ELKAAR
   De gekozen kaarten openen over de volledige breedte
   ========================================================= */
.scom-card-family-.elementor-13951 .elementor-element.elementor-element-c2755bc-grid
{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 18px;
}

.scom-card-family-.elementor-13951 .elementor-element.elementor-element-c2755bc
{
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--scom-grey-200);
    border-radius: 16px;
    background: #ffffff;
}

.scom-card-family-.elementor-13951 .elementor-element.elementor-element-c2755bc .scom-card-family__header
{
    margin: 0 0 15px;
}

.scom-card-family-.elementor-13951 .elementor-element.elementor-element-c2755bc .scom-card-family__actions
{
    margin: auto 0 0;
}

.scom-card-family-.elementor-13951 .elementor-element.elementor-element-c2755bc .scom-card-family__toggle
{
    width: 100% !important;
    max-width: none !important;
}

.scom-prepaid-section > .scom-card-family__panel
{
    width: 100%;
    margin: 0 0 22px;
    padding-top: 2px;
}

.scom-prepaid-section > .scom-card-family__panel.is-open
{
    animation: scomRevealPanel .35s ease both;
}

@media (max-width: 760px)
{
    .scom-card-family-.elementor-13951 .elementor-element.elementor-element-c2755bc-grid
    {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .scom-card-family-.elementor-13951 .elementor-element.elementor-element-c2755bc
    {
        padding: 16px;
    }

}

/* =========================================================
   DEFINITIEVE FIX — MASTERCARD EN UNIONPAY ECHT NAAST ELKAAR
   Overschrijft eventuele WordPress/Elementor article-stijlen.
   ========================================================= */
#prepaidkaarten .scom-card-family-.elementor-13951 .elementor-element.elementor-element-c2755bc-grid
{
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    gap: 16px !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
}

#prepaidkaarten .scom-card-family-.elementor-13951 .elementor-element.elementor-element-c2755bc-grid > .scom-card-family-.elementor-13951 .elementor-element.elementor-element-c2755bc
{
    display: flex !important;
    flex: 1 1 0 !important;
    flex-direction: column !important;
    width: calc(50% - 8px) !important;
    min-width: 0 !important;
    max-width: calc(50% - 8px) !important;
    margin: 0 !important;
    padding: 18px !important;
    float: none !important;
    clear: none !important;
    position: relative !important;
    border: 1px solid var(--scom-grey-200) !important;
    border-radius: 16px !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

#prepaidkaarten .scom-card-family-.elementor-13951 .elementor-element.elementor-element-c2755bc
.scom-card-family__header
{
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 0 15px !important;
}

#prepaidkaarten .scom-card-family-.elementor-13951 .elementor-element.elementor-element-c2755bc
.scom-card-family__actions
{
    display: block !important;
    width: 100% !important;
    margin: auto 0 0 !important;
}

#prepaidkaarten .scom-card-family-.elementor-13951 .elementor-element.elementor-element-c2755bc
.scom-card-family__toggle
{
    display: flex !important;
    width: 100% !important;
    max-width: none !important;
}

/* Geopende kaarten altijd onder beide keuzeblokken */
#prepaidkaarten > .scom-card-family__panel
{
    display: block;
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 22px !important;
    padding: 2px 0 0 !important;
    clear: both !important;
}

#prepaidkaarten > .scom-card-family__panel[hidden]
{
    display: none !important;
}

@media (max-width: 760px)
{
    #prepaidkaarten .scom-card-family-.elementor-13951 .elementor-element.elementor-element-c2755bc-grid
    {
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        gap: 12px !important;
    }

    #prepaidkaarten .scom-card-family-.elementor-13951 .elementor-element.elementor-element-c2755bc-grid
        > .scom-card-family-.elementor-13951 .elementor-element.elementor-element-c2755bc
    {
        flex: 1 1 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 16px !important;
    }

}

/* =========================================================
   NIEUWE KAARTNETWERK-KEUZE
   Eén compacte balk met Mastercard en UnionPay naast elkaar
   ========================================================= */
#prepaidkaarten .scom-card-network-switcher
{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0 !important;
    width: 100% !important;
    max-width: 760px !important;
    margin: 0 0 20px !important;
    padding: 5px !important;
    border: 1px solid var(--scom-grey-200) !important;
    border-radius: 16px !important;
    background: #f5f5f6 !important;
}

#prepaidkaarten .scom-card-network-tab
{
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) 30px !important;
    align-items: center !important;
    gap: 13px !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 72px !important;
    margin: 0 !important;
    padding: 13px 15px !important;
    border: 0 !important;
    border-radius: 12px !important;
    color: var(--scom-dark) !important;
    background: transparent !important;
    box-shadow: none !important;
    font: inherit !important;
    text-align: left !important;
    cursor: pointer !important;
}

#prepaidkaarten .scom-card-network-tab:hover,
#prepaidkaarten .scom-card-network-tab:focus,
#prepaidkaarten .scom-card-network-tab:active
{
    color: var(--scom-dark) !important;
    background: #ffffff !important;
    box-shadow: none !important;
    outline: none !important;
}

#prepaidkaarten .scom-card-network-tab.is-active
{
    background: #ffffff !important;
    box-shadow: inset 0 0 0 1px var(--scom-grey-200) !important;
}

#prepaidkaarten .scom-card-network-tab + .scom-card-network-tab
{
    border-left: 1px solid var(--scom-grey-200) !important;
}

#prepaidkaarten .scom-card-network-tab.is-active
+ .scom-card-network-tab,
#prepaidkaarten .scom-card-network-tab
+ .scom-card-network-tab.is-active
{
    border-left-color: transparent !important;
}

#prepaidkaarten .scom-card-network-tab__logo
{
    display: block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    object-fit: contain !important;
}

#prepaidkaarten .scom-card-network-tab__logo--mc
{
    width: 52px !important;
    max-width: 52px !important;
    max-height: 30px !important;
}

#prepaidkaarten .scom-card-network-tab__logo--upi
{
    width: 58px !important;
    max-width: 58px !important;
    max-height: 31px !important;
}

#prepaidkaarten .scom-card-network-tab__text
{
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    gap: 3px !important;
}

#prepaidkaarten .scom-card-network-tab__text strong
{
    color: var(--scom-dark) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
}

#prepaidkaarten .scom-card-network-tab__text small
{
    color: var(--scom-muted) !important;
    font-size: 10px !important;
    line-height: 1.35 !important;
}

#prepaidkaarten .scom-card-network-tab__icon
{
    position: relative !important;
    display: block !important;
    width: 28px !important;
    height: 28px !important;
    border: 1px solid var(--scom-grey-300) !important;
    border-radius: 50% !important;
    background: #ffffff !important;
}

#prepaidkaarten .scom-card-network-tab__icon::before,
#prepaidkaarten .scom-card-network-tab__icon::after
{
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 9px !important;
    height: 1.5px !important;
    border-radius: 999px !important;
    background: var(--scom-dark) !important;
    content: "" !important;
    transform: translate(-50%, -50%) !important;
    transition: transform .2s ease !important;
}

#prepaidkaarten .scom-card-network-tab__icon::after
{
    transform: translate(-50%, -50%) rotate(90deg) !important;
}

#prepaidkaarten .scom-card-network-tab[aria-expanded="true"]
.scom-card-network-tab__icon::after
{
    transform: translate(-50%, -50%) rotate(0deg) !important;
}

#prepaidkaarten > .scom-card-family__panel
{
    width: 100% !important;
    margin: 0 0 22px !important;
}

#prepaidkaarten > .scom-card-family__panel[hidden]
{
    display: none !important;
}

@media (max-width: 700px)
{
    #prepaidkaarten .scom-card-network-switcher
    {
        grid-template-columns: 1fr !important;
        max-width: none !important;
    }

    #prepaidkaarten .scom-card-network-tab + .scom-card-network-tab
    {
        border-top: 1px solid var(--scom-grey-200) !important;
        border-left: 0 !important;
    }

}

/* =========================================================
   LAATSTE AANPASSINGEN
   - Kaartnetwerk-keuze over volledige breedte
   - Grotere subtekst
   - Uni5Pay accordions starten gesloten
   ========================================================= */
#prepaidkaarten .scom-card-network-switcher
{
    width: 100% !important;
    max-width: none !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
}

#prepaidkaarten .scom-card-network-tab
{
    min-height: 82px !important;
    padding: 15px 18px !important;
}

#prepaidkaarten .scom-card-network-tab__text small
{
    font-size: 12px !important;
    line-height: 1.45 !important;
}

/* Zorgt dat Uni5Pay onderdeel 1 niet direct openstaat */
#uni5pay .scom-accordion:not(.is-open) .scom-accordion__content
{
    max-height: 0 !important;
}

#uni5pay .scom-accordion:not(.is-open) .scom-accordion__button
{
    background: #ffffff !important;
}

@media (max-width: 700px)
{
    #prepaidkaarten .scom-card-network-tab__text small
    {
        font-size: 11px !important;
    }

}

/* =========================================================
   KAARTPAKKET INTRO + PINMAILER UITLEG
   ========================================================= */
/* Introductietekst gebruikt de volledige breedte en heeft geen kunstmatige regelafbreking */
.scom-envelope-heading
{
    width: 100%;
    max-width: none;
}

.scom-envelope-heading > p
{
    width: 100%;
    max-width: none;
    margin-bottom: 0;
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
}

/* Merkgebonden uitleg bij het gebruik van de pincode */
.scom-pin-usage-grid
{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 0 0 20px;
}

.scom-pin-usage-card
{
    min-width: 0;
    padding: 14px 15px;
    border: 1px solid var(--scom-grey-200);
    border-radius: 12px;
    background: #f7f7f8;
}

.scom-pin-usage-card__head
{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.scom-pin-usage-card__head strong
{
    color: var(--scom-dark);
    font-size: 13px;
    font-weight: 800;
    line-height: 1.3;
}

.scom-pin-usage-card__logo
{
    display: block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    object-fit: contain !important;
}

.scom-pin-usage-card__logo--mc
{
    width: 42px !important;
    max-width: 42px !important;
    max-height: 24px !important;
}

.scom-pin-usage-card__logo--upi
{
    width: 46px !important;
    max-width: 46px !important;
    max-height: 25px !important;
}

.scom-pin-usage-card p
{
    margin: 0 !important;
    color: var(--scom-text);
    font-size: 12px;
    line-height: 1.55;
}

@media (max-width: 620px)
{
    .scom-pin-usage-grid
    {
        grid-template-columns: 1fr;
    }

}

/* =========================================================
   PREPAIDKAARTEN — GROTERE LABELS EN BETER LEESBARE TEKST
   ========================================================= */
/* Opvallender label voor de kaart zonder jaarlijkse kaartkosten */
.scom-info-page .scom-feature-badge
{
    top: 14px !important;
    left: 16px !important;
    min-height: 30px !important;
    padding: 7px 11px !important;
    border: 1px solid var(--scom-red) !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    background: var(--scom-red) !important;
    box-shadow: none !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .15px !important;
    line-height: 1.2 !important;
    text-transform: none !important;
}

/* Naamloze kaart / Kaart op naam: rood label met witte letters */
.scom-info-page .scom-card-type
{
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 29px !important;
    padding: 7px 10px !important;
    border: 1px solid var(--scom-red) !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    background: var(--scom-red) !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    letter-spacing: .1px !important;
    line-height: 1.15 !important;
    text-align: center !important;
    text-transform: none !important;
    white-space: nowrap !important;
}

/* Meta-rij iets ruimer vanwege de grotere labels */
.scom-info-page .scom-prepaid-card__meta-row
{
    min-height: 34px !important;
    margin-bottom: 11px !important;
}

/* Kaarttitel iets groter */
.scom-info-page .scom-prepaid-card__body > h4
{
    min-height: 48px !important;
    margin-bottom: 14px !important;
    font-size: 19px !important;
    line-height: 1.28 !important;
}

/* Eerste niveau subteksten: bullets onder de kaarttitel */
.scom-info-page .scom-prepaid-card__benefits li
{
    margin-bottom: 7px !important;
    padding-left: 14px !important;
    color: #4f535a !important;
    font-size: 12.5px !important;
    line-height: 1.5 !important;
}

/* Doelgroep-label en doelgroep-uitleg groter */
.scom-info-page .scom-prepaid-card__audience
{
    min-height: 88px !important;
    padding: 13px 14px !important;
}

.scom-info-page .scom-prepaid-card__audience span
{
    margin-bottom: 6px !important;
    color: #74777d !important;
    font-size: 9.5px !important;
    letter-spacing: .65px !important;
    line-height: 1.35 !important;
}

.scom-info-page .scom-prepaid-card__audience p
{
    color: #1d1e21 !important;
    font-size: 12px !important;
    font-weight: 650 !important;
    line-height: 1.5 !important;
}

/* Geldigheidsduur groter en beter leesbaar */
.scom-info-page .scom-card-validity-row
{
    min-height: 48px !important;
    padding: 11px 0 !important;
}

.scom-info-page .scom-card-validity-row__label,
.scom-info-page .scom-card-validity-row__value
{
    font-size: 12px !important;
    line-height: 1.4 !important;
}

/* Dropdowntitels Kosten en Limieten groter */
.scom-info-page .scom-card-dropdown__button
{
    min-height: 46px !important;
    padding: 12px 14px !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
}

/* Sub-subteksten en bedragen binnen Kosten/Limieten groter */
.scom-info-page .scom-card-dropdown__list dt,
.scom-info-page .scom-card-dropdown__list dd
{
    font-size: 11.5px !important;
    line-height: 1.45 !important;
}

.scom-info-page .scom-card-dropdown__list > div
{
    min-height: 38px !important;
    align-items: center !important;
    padding: 9px 0 !important;
}

/* Jaarlijkse kosten als duidelijke highlight binnen de dropdown */
.scom-info-page .scom-card-dropdown__list > .scom-annual-fee-row
{
    margin-top: 4px !important;
    padding: 10px 11px !important;
    border-top: 0 !important;
    border-radius: 9px !important;
    background: #fff0f1 !important;
}

.scom-info-page .scom-card-dropdown__list > .scom-annual-fee-row dt,
.scom-info-page .scom-card-dropdown__list > .scom-annual-fee-row dd
{
    color: var(--scom-red-dark) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

/* Netwerkkeuze en overige kleine begeleidende teksten groter */
.scom-info-page .scom-card-network-tab__text small
{
    font-size: 13px !important;
    line-height: 1.45 !important;
}

.scom-info-page .scom-product-visual__caption
{
    font-size: 13px !important;
    line-height: 1.55 !important;
}

.scom-info-page .scom-step-list p,
.scom-info-page .scom-service-card--detail .scom-step-list p
{
    font-size: 13px !important;
    line-height: 1.55 !important;
}

.scom-info-page .scom-step-list strong,
.scom-info-page .scom-service-card--detail .scom-step-list strong
{
    font-size: 14px !important;
}

.scom-info-page .scom-accordion__button small
{
    font-size: 10.5px !important;
}

.scom-info-page .scom-numbered-list li,
.scom-info-page .scom-check-list li,
.scom-info-page .scom-inline-notice
{
    font-size: 14px !important;
    line-height: 1.55 !important;
}

/* Houd de labels bruikbaar op kleinere schermen */
@media (max-width: 620px)
{
    .scom-info-page .scom-feature-badge
    {
        max-width: calc(100% - 32px) !important;
        white-space: normal !important;
    }

    .scom-info-page .scom-card-type
    {
        font-size: 10px !important;
        white-space: normal !important;
    }

    .scom-info-page .scom-prepaid-card__benefits li
    {
        font-size: 12px !important;
    }

    .scom-info-page .scom-card-network-tab__text small
    {
        font-size: 12px !important;
    }

}

/* =========================================================
   AUGUSTUS 2026 — FIRST STEPS / AAN DE SLAG
   ========================================================= */
.scom-get-started-section
{
    padding: 0 0 52px;
    border-bottom: 1px solid var(--scom-grey-200);
    scroll-margin-top: 25px;
}

.scom-get-started-heading
{
    width: 100%;
    margin-bottom: 24px;
}

.scom-get-started-heading h2
{
    margin-bottom: 12px;
}

.scom-get-started-heading p
{
    max-width: 920px;
    margin-bottom: 0;
    color: var(--scom-text);
    font-size: 16px;
}

.scom-start-topic
{
    display: grid;
    grid-template-columns: minmax(250px, .75fr) minmax(0, 1.25fr);
    gap: 28px;
    align-items: start;
    padding: 28px 0;
    border-top: 1px solid var(--scom-grey-200);
}

.scom-start-topic:first-of-type
{
    border-top: 0;
}

.scom-start-topic__intro
{
    max-width: 420px;
}

.scom-start-topic__label
{
    display: inline-flex;
    align-items: center;
    min-height: 27px;
    margin-bottom: 10px;
    padding: 6px 10px;
    border-radius: 999px;
    color: var(--scom-red);
    background: var(--scom-red-light);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .45px;
    text-transform: uppercase;
}

.scom-start-topic h3
{
    margin: 0 0 10px;
    font-size: clamp(22px, 2vw, 28px);
}

.scom-start-topic__intro p,
.scom-start-topic__travel-copy p
{
    margin: 0;
    color: var(--scom-muted);
    font-size: 14px;
    line-height: 1.6;
}

.scom-topup-choice-grid
{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.scom-topup-choice
{
    display: flex;
    flex-direction: column;
    min-height: 220px;
    padding: 20px;
    border: 1px solid var(--scom-grey-200);
    border-radius: 16px;
    background: #ffffff;
}

.scom-topup-choice__icon
{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    margin-bottom: 18px;
    border-radius: 11px;
    color: var(--scom-red);
    background: var(--scom-red-light);
    font-size: 18px;
    font-weight: 800;
}

.scom-topup-choice h4
{
    margin: 0 0 7px;
    font-size: 16px;
}

.scom-topup-choice p
{
    margin: 0 0 18px;
    color: var(--scom-muted);
    font-size: 13px;
    line-height: 1.55;
}

.scom-topic-button
{
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    width: fit-content;
    min-height: 44px;
    margin-top: auto;
    padding: 10px 13px;
    border: 1px solid var(--scom-red);
    border-radius: 10px;
    color: #ffffff !important;
    background: var(--scom-red);
    box-shadow: none !important;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.35;
}

.scom-topic-button:hover,
.scom-topic-button:focus
{
    border-color: var(--scom-red-dark);
    color: #ffffff !important;
    background: var(--scom-red-dark);
    box-shadow: none !important;
    transform: none !important;
}

.scom-pin-change-layout
{
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(230px, .75fr);
    gap: 14px;
}

.scom-pin-change-steps
{
    padding: 20px 22px;
    border: 1px solid var(--scom-grey-200);
    border-radius: 16px;
    background: #ffffff;
}

.scom-pin-change-steps ol
{
    display: grid;
    gap: 10px;
    margin: 0;
    padding-left: 22px;
}

.scom-pin-change-steps li
{
    padding-left: 4px;
    color: var(--scom-text);
    font-size: 13px;
    line-height: 1.55;
}

.scom-pin-change-note
{
    padding: 20px;
    border-radius: 16px;
    background: var(--scom-red-light);
}

.scom-pin-change-note strong
{
    display: block;
    margin-bottom: 8px;
    color: var(--scom-dark);
    font-size: 13px;
}

.scom-pin-change-note p
{
    margin: 0;
    color: var(--scom-text);
    font-size: 12.5px;
    line-height: 1.6;
}

.scom-start-topic--travel
{
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    padding-bottom: 4px;
}

.scom-start-topic__travel-copy
{
    max-width: 760px;
}

.scom-topic-button--travel
{
    min-width: 205px;
    margin-top: 0;
}

/* Geen genummerde cirkel meer in de servicekoppen */
.scom-brand-heading .scom-section-number
{
    display: none !important;
}

.scom-brand-heading
{
    gap: 0;
}

@media (max-width: 850px)
{
    .scom-start-topic,
    .scom-start-topic--travel
    {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .scom-start-topic__intro
    {
        max-width: none;
    }

    .scom-pin-change-layout
    {
        grid-template-columns: 1fr;
    }

    .scom-topic-button--travel
    {
        margin-top: 0;
    }

}

@media (max-width: 620px)
{
    .scom-get-started-section
    {
        padding-bottom: 38px;
    }

    .scom-topup-choice-grid
    {
        grid-template-columns: 1fr;
    }

    .scom-topup-choice
    {
        min-height: 0;
    }

    .scom-topic-button,
    .scom-topic-button--travel
    {
        width: 100%;
        min-width: 0;
    }

}


/* =========================================================
   SEPTEMBER 2026 — NAVIGATIE / UNI5PAY / PAYSEND UPDATES
   ========================================================= */

/* Bovenste navigatie zonder nummering */
.scom-service-navigation {
    grid-template-columns: repeat(6, 1fr);
}

.scom-service-navigation__number {
    display: none !important;
}

.scom-service-navigation__item {
    justify-content: center;
    padding: 14px 16px;
    gap: 0;
    text-align: center;
}

/* Aan de slag heading strakker uitgelijnd */
.scom-get-started-heading {
    max-width: 920px;
    margin-bottom: 18px;
}

.scom-get-started-heading h2 {
    margin-bottom: 10px;
}

.scom-get-started-heading p {
    max-width: 860px;
    line-height: 1.65;
}

/* Reizen zonder label, met Nederland-badge */
.scom-travel-flag {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    margin-bottom: 10px;
    padding: 6px 11px;
    border: 1px solid var(--scom-grey-200);
    border-radius: 999px;
    color: var(--scom-dark);
    background: #ffffff;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
}

.scom-start-topic__travel-copy h3 {
    margin-top: 0;
}

/* Uni5Pay labels/pills weg */
#uni5pay .scom-feature-pills {
    display: none !important;
}

/* Downloadbuttons boven de reveal/dropdown */
#uni5pay .scom-service-card--summary .scom-download-buttons {
    margin-top: 18px;
    padding-top: 0;
}

#uni5pay .scom-service-card--detail .scom-download-buttons {
    display: none !important;
}

/* Reveal button in Uni5Pay en Paysend */
#uni5pay .scom-section-reveal,
#paysend .scom-section-reveal {
    margin-top: 18px;
}

/* Geen kleine 'Onderdeel' labels in Uni5Pay accordions */
#uni5pay .scom-accordion__button small {
    display: none !important;
}

/* Paysend detailpanel krijgt dezelfde opmaak als PayPal */
#paysend .scom-service-card--detail {
    grid-column: 1 / -1;
    scroll-margin-top: 24px;
}

/* Summary iets netter uitlijnen */
#uni5pay .scom-service-card--summary,
#paysend .scom-service-card--summary,
#paypal .scom-service-card--summary {
    align-items: flex-start;
}

/* Brand labels optisch rustiger */
#paysend .scom-brand-heading,
#paypal .scom-brand-heading,
#uni5pay .scom-brand-heading {
    margin-bottom: 14px;
}

/* Tablet */
@media (max-width: 1050px) {
    .scom-service-navigation {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 700px) {
    .scom-service-navigation {
        grid-template-columns: repeat(2, 1fr);
    }

    .scom-service-navigation__item {
        justify-content: flex-start;
        text-align: left;
    }
}

@media (max-width: 600px) {
    .scom-service-navigation {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   SEPTEMBER 2026 — OPGERUIMDE AAN DE SLAG SECTIE
   ========================================================= */

.scom-get-started-section {
    padding-bottom: 44px;
}

.scom-get-started-heading {
    max-width: 760px;
    margin-bottom: 28px;
}

.scom-get-started-heading h2 {
    margin-bottom: 12px;
}

.scom-get-started-heading p {
    max-width: 720px;
    margin-bottom: 0;
    font-size: 15px;
    line-height: 1.7;
}

.scom-start-topic {
    grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
    gap: 26px;
    align-items: start;
    padding: 24px 0 28px;
}

.scom-start-topic__intro,
.scom-start-topic__travel-copy {
    max-width: 320px;
}

.scom-start-topic h3 {
    margin-bottom: 10px;
    line-height: 1.25;
}

.scom-start-topic__intro p,
.scom-start-topic__travel-copy p {
    font-size: 13px;
    line-height: 1.65;
}

.scom-topup-choice-grid {
    gap: 12px;
    align-items: stretch;
}

.scom-topup-choice {
    min-height: 0;
    padding: 18px 18px 16px;
    border-radius: 14px;
}

.scom-topup-choice h4 {
    margin-bottom: 6px;
    font-size: 15px;
}

.scom-topup-choice p {
    margin-bottom: 16px;
    font-size: 12.5px;
    line-height: 1.55;
}

.scom-topic-button {
    min-height: 42px;
    padding: 10px 12px;
    font-size: 11.5px;
}

.scom-pin-change-layout {
    grid-template-columns: minmax(0, 1.15fr) minmax(220px, .85fr);
    gap: 12px;
    align-items: stretch;
}

.scom-pin-change-steps,
.scom-pin-change-note {
    height: 100%;
    padding: 18px;
    border-radius: 14px;
}

.scom-pin-change-steps li {
    font-size: 12.5px;
    line-height: 1.55;
}

.scom-pin-change-note strong {
    font-size: 12.5px;
}

.scom-pin-change-note p {
    font-size: 12.5px;
    line-height: 1.6;
}

.scom-start-topic--travel {
    grid-template-columns: minmax(260px, 1fr) auto;
    gap: 26px;
    align-items: center;
}

.scom-start-topic--travel .scom-topic-button--travel {
    align-self: center;
}

.scom-travel-flag {
    display: none !important;
}

/* Paysend back to direct button */
#paysend .scom-paysend-readmore {
    margin-top: 16px !important;
}

#paysend .scom-service-card--detail {
    display: none !important;
}

/* Better layout on tablet/mobile */
@media (max-width: 900px) {
    .scom-start-topic {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .scom-start-topic__intro,
    .scom-start-topic__travel-copy,
    .scom-get-started-heading,
    .scom-get-started-heading p {
        max-width: none;
    }

    .scom-pin-change-layout {
        grid-template-columns: 1fr;
    }

    .scom-start-topic--travel {
        grid-template-columns: 1fr;
        gap: 16px;
        align-items: start;
    }

    .scom-start-topic--travel .scom-topic-button--travel {
        align-self: start;
    }
}

@media (max-width: 620px) {
    .scom-get-started-heading {
        margin-bottom: 22px;
    }

    .scom-start-topic {
        padding: 20px 0 24px;
    }

    .scom-topup-choice-grid {
        grid-template-columns: 1fr;
    }

    .scom-topic-button,
    .scom-topic-button--travel {
        width: fit-content;
        min-width: 0;
    }
}


/* =========================================================
   SEPTEMBER 2026 — FINAL LAYOUT TWEAKS
   ========================================================= */

/* Geen subtekst onder "Aan de slag met uw kaart" */
.scom-get-started-heading {
    max-width: none;
    margin-bottom: 24px;
}

.scom-get-started-heading p {
    display: none !important;
}

/* Labels boven Opwaarderen / Uni5Pay verwijderen */
.scom-start-topic__label {
    display: none !important;
}

.scom-start-topic__intro,
.scom-start-topic__travel-copy {
    max-width: 340px;
}

.scom-start-topic h3 {
    margin-top: 0;
}

/* Overmaking kaart donkergrijs, contant storten wit */
.scom-topup-choice:first-child {
    border-color: #2e3138 !important;
    background: #2e3138 !important;
}

.scom-topup-choice:first-child h4,
.scom-topup-choice:first-child p {
    color: #ffffff !important;
}

.scom-topup-choice:first-child .scom-topup-choice__icon {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.12) !important;
}

.scom-topup-choice:first-child .scom-topic-button {
    border-color: #ffffff !important;
    color: #2e3138 !important;
    background: #ffffff !important;
}

.scom-topup-choice:first-child .scom-topic-button:hover,
.scom-topup-choice:first-child .scom-topic-button:focus {
    background: #f0f0f0 !important;
    color: #2e3138 !important;
}

/* Reizen naar Nederland: tekst over gehele breedte, knop netjes eronder */
.scom-start-topic--travel {
    display: block !important;
    padding-top: 22px;
}

.scom-start-topic__travel-copy {
    width: 100%;
    max-width: none !important;
    margin-bottom: 18px;
}

.scom-start-topic__travel-copy p {
    width: 100%;
    max-width: none !important;
}

.scom-topic-button--travel {
    display: inline-flex;
    margin-top: 0;
}

/* Paysend volledig in #B75EFF */
.scom-brand-heading--paysend .scom-brand-name {
    color: #B75EFF !important;
}

.scom-product-visual--paysend {
    background: linear-gradient(145deg, #fbf7ff 0%, #f2e7ff 52%, #ead9ff 100%) !important;
}

.scom-highlight-box--purple {
    border-color: #B75EFF !important;
    background: #f6efff !important;
}

.scom-paysend-readmore {
    border-color: #B75EFF !important;
    background: #B75EFF !important;
}

.scom-paysend-readmore:hover,
.scom-paysend-readmore:focus,
.scom-paysend-readmore:active {
    border-color: #9f46ee !important;
    background: #9f46ee !important;
}

/* Onderste veiligheidsblok verwijderen */
.scom-security-section {
    display: none !important;
}

/* Mobile */
@media (max-width: 620px) {
    .scom-start-topic__intro,
    .scom-start-topic__travel-copy {
        max-width: none;
    }

    .scom-topic-button--travel {
        width: fit-content;
    }
}


/* =========================================================
   AUGUSTUS 2026 — BANKOVERMAKING / TRAVEL / VOLGORDE / HOVER
   ========================================================= */

/* Bankovermaking-card blijft donker, maar icon en button SCOM-rood */
.scom-topup-choice:first-child .scom-topup-choice__icon {
    color: #ffffff !important;
    background: var(--scom-red) !important;
}

.scom-topup-choice:first-child .scom-topic-button,
.scom-topup-choice:first-child .scom-topic-button:hover,
.scom-topup-choice:first-child .scom-topic-button:focus,
.scom-topup-choice:first-child .scom-topic-button:active {
    border-color: var(--scom-red) !important;
    color: #ffffff !important;
    background: var(--scom-red) !important;
}

.scom-topup-choice:first-child .scom-topic-button:hover,
.scom-topup-choice:first-child .scom-topic-button:focus {
    background: var(--scom-red-dark) !important;
    border-color: var(--scom-red-dark) !important;
}

/* Travel nu onder Belangrijke informatie voor UnionPay gebruikers */
.scom-important-grid--upi {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.scom-important-card--travel {
    justify-content: flex-start;
}

.scom-important-card--travel .scom-important-card__icon {
    color: #ffffff;
    background: var(--scom-red);
}

.scom-important-travel-button {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    min-height: 42px;
    margin-top: auto;
    padding: 10px 12px;
    border: 1px solid var(--scom-red);
    border-radius: 10px;
    color: #ffffff !important;
    background: var(--scom-red);
    font-size: 11.5px;
    font-weight: 800;
}

.scom-important-travel-button:hover,
.scom-important-travel-button:focus {
    color: #ffffff !important;
    background: var(--scom-red-dark);
    border-color: var(--scom-red-dark);
}

/* Belangrijke informatie staat nu vóór Onze prepaidkaarten */
.scom-important-section {
    margin-top: 34px;
    padding: 34px 0 46px;
    border-bottom: 1px solid var(--scom-grey-200);
}

.scom-prepaid-section {
    padding-top: 46px;
}

/* Envelop-tabs: geen roze theme-hover meer */
.scom-info-page .scom-envelope-flow__tab,
.scom-info-page .scom-envelope-flow__tab:hover,
.scom-info-page .scom-envelope-flow__tab:focus,
.scom-info-page .scom-envelope-flow__tab:active {
    color: var(--scom-muted) !important;
    background: #f7f7f8 !important;
    box-shadow: none !important;
    outline: none !important;
}

.scom-info-page .scom-envelope-flow__tab.is-active,
.scom-info-page .scom-envelope-flow__tab.is-active:hover,
.scom-info-page .scom-envelope-flow__tab.is-active:focus,
.scom-info-page .scom-envelope-flow__tab.is-active:active {
    color: var(--scom-red) !important;
    background: #ffffff !important;
}

.scom-info-page .scom-envelope-flow__tab span,
.scom-info-page .scom-envelope-flow__tab:hover span,
.scom-info-page .scom-envelope-flow__tab:focus span,
.scom-info-page .scom-envelope-flow__tab:active span {
    color: var(--scom-muted) !important;
    background: #ffffff !important;
    border-color: var(--scom-grey-300) !important;
}

.scom-info-page .scom-envelope-flow__tab.is-active span,
.scom-info-page .scom-envelope-flow__tab.is-active:hover span,
.scom-info-page .scom-envelope-flow__tab.is-active:focus span,
.scom-info-page .scom-envelope-flow__tab.is-active:active span {
    color: #ffffff !important;
    background: var(--scom-red) !important;
    border-color: var(--scom-red) !important;
}

@media (max-width: 1100px) {
    .scom-important-grid--upi {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .scom-important-grid--upi {
        grid-template-columns: 1fr;
    }
}


/* =========================================================
   AUGUSTUS 2026 — ICON FIXES
   ========================================================= */

/* Bankovermaking-icon: transparant/soft zoals contant storten */
.scom-topup-choice:first-child .scom-topup-choice__icon {
    color: var(--scom-red) !important;
    background: rgba(224, 34, 40, 0.10) !important;
}

/* Nederland-vlag in plaats van NL blok */
.scom-important-card--travel .scom-important-card__icon {
    min-width: 58px;
    min-height: 42px;
    padding: 6px 10px;
    color: inherit !important;
    background: #ffffff !important;
    border: 1px solid var(--scom-grey-200);
    font-size: 24px;
    line-height: 1;
}


/* =========================================================
   AUGUSTUS 2026 — BANKOVERMAKING ICON WIT TRANSPARANT
   ========================================================= */

.scom-topup-choice:first-child .scom-topup-choice__icon {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.12) !important;
}

/* Button blijft SCOM-rood */
.scom-topup-choice:first-child .scom-topic-button,
.scom-topup-choice:first-child .scom-topic-button:hover,
.scom-topup-choice:first-child .scom-topic-button:focus,
.scom-topup-choice:first-child .scom-topic-button:active {
    border-color: var(--scom-red) !important;
    color: #ffffff !important;
    background: var(--scom-red) !important;
}

.scom-topup-choice:first-child .scom-topic-button:hover,
.scom-topup-choice:first-child .scom-topic-button:focus {
    border-color: var(--scom-red-dark) !important;
    background: var(--scom-red-dark) !important;
}


/* =========================================================
   AUGUSTUS 2026 — PREMIUM KAARTPAKKET
   Sleeker, rustiger en meer premium banking
   ========================================================= */

/* Sectie iets luchtiger */
.scom-envelope-section {
    padding: 28px 0 58px !important;
    border-bottom: 1px solid #ececef !important;
}

/* Intro */
.scom-envelope-heading {
    margin-bottom: 24px !important;
}

.scom-envelope-heading h1 {
    max-width: 820px;
    margin-bottom: 10px !important;
}

.scom-envelope-heading > p {
    max-width: 900px !important;
    color: #666a70 !important;
    font-size: 15px !important;
    line-height: 1.7 !important;
}

/* Grote hoofdcontainer */
.scom-envelope-flow {
    overflow: hidden !important;
    border: 1px solid #e2e3e6 !important;
    border-radius: 24px !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

/* ---------------------------------------------------------
   Premium segmented tabs
   --------------------------------------------------------- */

.scom-envelope-flow__tabs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
    padding: 8px !important;
    border-bottom: 1px solid #ececef !important;
    background: #f7f7f8 !important;
}

.scom-info-page .scom-envelope-flow__tab,
.scom-info-page .scom-envelope-flow__tab:hover,
.scom-info-page .scom-envelope-flow__tab:focus,
.scom-info-page .scom-envelope-flow__tab:active {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    min-height: 52px !important;
    padding: 10px 16px !important;
    border: 1px solid transparent !important;
    border-radius: 14px !important;
    color: #74777d !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    transition:
        background-color .2s ease,
        color .2s ease,
        border-color .2s ease !important;
}

.scom-info-page .scom-envelope-flow__tab.is-active,
.scom-info-page .scom-envelope-flow__tab.is-active:hover,
.scom-info-page .scom-envelope-flow__tab.is-active:focus,
.scom-info-page .scom-envelope-flow__tab.is-active:active {
    color: #17181b !important;
    background: #ffffff !important;
    border-color: #e0e1e4 !important;
}

/* Kleine stapcirkel */
.scom-info-page .scom-envelope-flow__tab span,
.scom-info-page .scom-envelope-flow__tab:hover span,
.scom-info-page .scom-envelope-flow__tab:focus span,
.scom-info-page .scom-envelope-flow__tab:active span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    border: 1px solid #d8dade !important;
    border-radius: 50% !important;
    color: #7b7e84 !important;
    background: #ffffff !important;
    font-size: 9px !important;
    font-weight: 800 !important;
}

.scom-info-page .scom-envelope-flow__tab.is-active span,
.scom-info-page .scom-envelope-flow__tab.is-active:hover span,
.scom-info-page .scom-envelope-flow__tab.is-active:focus span,
.scom-info-page .scom-envelope-flow__tab.is-active:active span {
    border-color: var(--scom-red) !important;
    color: #ffffff !important;
    background: var(--scom-red) !important;
}

/* ---------------------------------------------------------
   Content split
   --------------------------------------------------------- */

.scom-envelope-flow__content {
    display: grid !important;
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr) !important;
    min-height: 430px !important;
}

/* Visual pane */
.scom-envelope-flow__visual {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 430px !important;
    padding: 30px 30px 26px !important;
    overflow: hidden !important;
    border-right: 1px solid #ececef !important;
    background:
        radial-gradient(circle at 52% 44%, rgba(255,255,255,.95) 0%, rgba(255,255,255,.65) 30%, transparent 58%),
        linear-gradient(145deg, #f8f8f9 0%, #f1f1f3 100%) !important;
}

/* heel subtiele studio-vloer */
.scom-envelope-flow__visual::after {
    position: absolute !important;
    right: 12% !important;
    bottom: 30px !important;
    left: 12% !important;
    height: 34px !important;
    border-radius: 50% !important;
    background: rgba(20, 22, 28, .08) !important;
    filter: blur(18px) !important;
    content: "" !important;
    pointer-events: none !important;
}

/* Visual groter / cleaner */
.scom-envelope-stack {
    position: relative !important;
    z-index: 2 !important;
    width: min(100%, 760px) !important;
    height: 370px !important;
}

.scom-envelope-stack__item {
    width: 100% !important;
    height: 100% !important;
}

.scom-envelope-stack__item img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    transform: scale(1.07) !important;
}

/* Minder "waaier", meer productfocus */
.scom-envelope-stack__item.is-active {
    transform:
        translate(-50%, -50%)
        translateY(0)
        rotateZ(0deg)
        scale(1) !important;
}

.scom-envelope-stack__item.is-before {
    opacity: .08 !important;
    transform:
        translate(-50%, -50%)
        translate(-32px, 18px)
        rotateZ(-2deg)
        scale(.96) !important;
}

.scom-envelope-stack__item.is-after {
    opacity: .12 !important;
    transform:
        translate(-50%, -50%)
        translate(34px, 14px)
        rotateZ(2deg)
        scale(.96) !important;
}

.scom-envelope-stack__item:hover.is-active,
.scom-envelope-stack__item:focus.is-active {
    transform:
        translate(-50%, -50%)
        translateY(-4px)
        scale(1.008) !important;
}

/* Oude pulsering weg voor premium rust */
.scom-envelope-stack__pulse {
    display: none !important;
}

/* ---------------------------------------------------------
   Rechter tekstpaneel
   --------------------------------------------------------- */

.scom-envelope-flow__info {
    display: flex !important;
    align-items: center !important;
    min-height: 430px !important;
    padding: 46px 48px !important;
    background: #ffffff !important;
}

.scom-envelope-flow__panel {
    max-width: 520px !important;
}

/* Nummer in tekstpaneel subtieler */
.scom-envelope-flow__number {
    min-width: 0 !important;
    height: auto !important;
    margin-bottom: 16px !important;
    padding: 0 !important;
    border-radius: 0 !important;
    color: var(--scom-red) !important;
    background: transparent !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: 1.1px !important;
}

/* Headline editorial/premium */
.scom-envelope-flow__panel h2 {
    max-width: 500px !important;
    margin-bottom: 18px !important;
    color: #17181b !important;
    font-size: clamp(30px, 3vw, 42px) !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    letter-spacing: -1.1px !important;
}

.scom-envelope-flow__panel > p {
    max-width: 500px !important;
    margin-bottom: 26px !important;
    color: #5e6269 !important;
    font-size: 14px !important;
    line-height: 1.75 !important;
}

/* CTA */
.scom-envelope-flow__button {
    min-height: 44px !important;
    padding: 11px 16px !important;
    border: 1px solid var(--scom-red) !important;
    border-radius: 10px !important;
    color: #ffffff !important;
    background: var(--scom-red) !important;
    box-shadow: none !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    transition:
        background-color .2s ease,
        border-color .2s ease !important;
}

.scom-envelope-flow__button:hover,
.scom-envelope-flow__button:focus {
    border-color: var(--scom-red-dark) !important;
    color: #ffffff !important;
    background: var(--scom-red-dark) !important;
    transform: none !important;
}

.scom-envelope-flow__button--light {
    border-color: #e0e1e4 !important;
    color: #202126 !important;
    background: #f6f6f7 !important;
}

.scom-envelope-flow__button--light:hover,
.scom-envelope-flow__button--light:focus {
    border-color: #d7d8dc !important;
    color: #202126 !important;
    background: #eeeeef !important;
}

/* Pinmailer info cards iets rustiger */
.scom-pin-usage-card {
    border-color: #e3e4e7 !important;
    background: #f8f8f9 !important;
}

.scom-envelope-flow__callout {
    border-left-width: 3px !important;
    background: #fff7f7 !important;
}

/* ---------------------------------------------------------
   Responsive
   --------------------------------------------------------- */

@media (max-width: 980px) {
    .scom-envelope-flow__content {
        grid-template-columns: 1fr !important;
    }

    .scom-envelope-flow__visual {
        min-height: 380px !important;
        border-right: 0 !important;
        border-bottom: 1px solid #ececef !important;
    }

    .scom-envelope-flow__info {
        min-height: 0 !important;
        padding: 34px 32px 38px !important;
    }

    .scom-envelope-flow__panel {
        max-width: none !important;
    }
}

@media (max-width: 620px) {
    .scom-envelope-flow {
        border-radius: 18px !important;
    }

    .scom-envelope-flow__tabs {
        grid-template-columns: 1fr !important;
        gap: 4px !important;
    }

    .scom-info-page .scom-envelope-flow__tab {
        justify-content: flex-start !important;
        min-height: 48px !important;
    }

    .scom-envelope-flow__visual {
        min-height: 300px !important;
        padding: 20px 14px !important;
    }

    .scom-envelope-stack {
        height: 270px !important;
    }

    .scom-envelope-flow__info {
        padding: 28px 22px 30px !important;
    }

    .scom-envelope-flow__panel h2 {
        font-size: 29px !important;
        letter-spacing: -.7px !important;
    }
}


/* =========================================================
   AUGUSTUS 2026 — OPTIE B
   Moderne banklook: compacte tabs + één grote card
   Visual bewust niet te groot
   ========================================================= */

/* Hoofdcontainer: één rustige premium card */
.scom-envelope-flow {
    overflow: hidden !important;
    border: 1px solid #e1e2e5 !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

/* Tabs compacter en geïntegreerd in de card */
.scom-envelope-flow__tabs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0 !important;
    padding: 0 !important;
    border-bottom: 1px solid #e8e9ec !important;
    background: #f7f7f8 !important;
}

.scom-info-page .scom-envelope-flow__tab,
.scom-info-page .scom-envelope-flow__tab:hover,
.scom-info-page .scom-envelope-flow__tab:focus,
.scom-info-page .scom-envelope-flow__tab:active {
    min-height: 54px !important;
    padding: 10px 16px !important;
    border: 0 !important;
    border-right: 1px solid #e8e9ec !important;
    border-radius: 0 !important;
    color: #777a80 !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}

.scom-info-page .scom-envelope-flow__tab:last-child {
    border-right: 0 !important;
}

.scom-info-page .scom-envelope-flow__tab.is-active,
.scom-info-page .scom-envelope-flow__tab.is-active:hover,
.scom-info-page .scom-envelope-flow__tab.is-active:focus,
.scom-info-page .scom-envelope-flow__tab.is-active:active {
    color: #17181b !important;
    background: #ffffff !important;
}

/* Rode actieve onderlijn */
.scom-info-page .scom-envelope-flow__tab.is-active::after {
    position: absolute !important;
    right: 24px !important;
    bottom: 0 !important;
    left: 24px !important;
    height: 2px !important;
    border-radius: 999px 999px 0 0 !important;
    background: var(--scom-red) !important;
    content: "" !important;
}

.scom-info-page .scom-envelope-flow__tab {
    position: relative !important;
}

/* Nummering rustiger */
.scom-info-page .scom-envelope-flow__tab span {
    width: 26px !important;
    height: 26px !important;
    border: 1px solid #d9dade !important;
    color: #777a80 !important;
    background: #ffffff !important;
    font-size: 8.5px !important;
}

.scom-info-page .scom-envelope-flow__tab.is-active span {
    border-color: var(--scom-red) !important;
    color: #ffffff !important;
    background: var(--scom-red) !important;
}

/* Content: modern split zonder overdreven grote visual */
.scom-envelope-flow__content {
    display: grid !important;
    grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr) !important;
    min-height: 360px !important;
}

/* Linkerkant: lichte gradient */
.scom-envelope-flow__visual {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 360px !important;
    padding: 28px 30px !important;
    border-right: 1px solid #ececef !important;
    background: linear-gradient(
        145deg,
        #fafafa 0%,
        #f3f3f5 52%,
        #eeeeF1 100%
    ) !important;
}

/* Geen extra glow/pulse */
.scom-envelope-flow__visual::after,
.scom-envelope-stack__pulse {
    display: none !important;
}

/* Visual bewust compact */
.scom-envelope-stack {
    width: min(100%, 560px) !important;
    height: 285px !important;
}

.scom-envelope-stack__item {
    width: 96% !important;
    height: 92% !important;
}

.scom-envelope-stack__item img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    transform: scale(.98) !important;
}

/* Heel subtiel stapel-effect */
.scom-envelope-stack__item.is-active {
    transform:
        translate(-50%, -50%)
        scale(1) !important;
}

.scom-envelope-stack__item.is-before {
    opacity: .07 !important;
    transform:
        translate(-50%, -50%)
        translate(-22px, 10px)
        scale(.97) !important;
}

.scom-envelope-stack__item.is-after {
    opacity: .10 !important;
    transform:
        translate(-50%, -50%)
        translate(22px, 10px)
        scale(.97) !important;
}

.scom-envelope-stack__item:hover.is-active,
.scom-envelope-stack__item:focus.is-active {
    transform:
        translate(-50%, -50%)
        translateY(-2px)
        scale(1.005) !important;
}

/* Rechterkant: rustig wit contentvlak */
.scom-envelope-flow__info {
    display: flex !important;
    align-items: center !important;
    min-height: 360px !important;
    padding: 38px 42px !important;
    background: #ffffff !important;
}

.scom-envelope-flow__panel {
    max-width: 540px !important;
}

/* Nummer als klein rood tekstlabel */
.scom-envelope-flow__number {
    margin-bottom: 13px !important;
    padding: 0 !important;
    color: var(--scom-red) !important;
    background: transparent !important;
    font-size: 9px !important;
    letter-spacing: 1px !important;
}

/* Headline iets compacter dan optie A */
.scom-envelope-flow__panel h2 {
    max-width: 500px !important;
    margin-bottom: 15px !important;
    font-size: clamp(28px, 2.6vw, 36px) !important;
    line-height: 1.13 !important;
    letter-spacing: -.8px !important;
}

.scom-envelope-flow__panel > p {
    max-width: 500px !important;
    margin-bottom: 22px !important;
    color: #5f636a !important;
    font-size: 13.5px !important;
    line-height: 1.7 !important;
}

/* CTA compact */
.scom-envelope-flow__button {
    min-height: 42px !important;
    padding: 10px 15px !important;
    border-radius: 10px !important;
    font-size: 11px !important;
}

/* Pinmailer info blijft compact */
.scom-pin-usage-grid {
    gap: 10px !important;
}

.scom-pin-usage-card {
    padding: 13px 14px !important;
}

/* Responsive */
@media (max-width: 900px) {
    .scom-envelope-flow__content {
        grid-template-columns: 1fr !important;
    }

    .scom-envelope-flow__visual {
        min-height: 310px !important;
        border-right: 0 !important;
        border-bottom: 1px solid #ececef !important;
    }

    .scom-envelope-stack {
        width: min(100%, 520px) !important;
        height: 255px !important;
    }

    .scom-envelope-flow__info {
        min-height: 0 !important;
        padding: 32px 30px 36px !important;
    }
}

@media (max-width: 620px) {
    .scom-envelope-flow {
        border-radius: 18px !important;
    }

    .scom-envelope-flow__tabs {
        grid-template-columns: 1fr !important;
    }

    .scom-info-page .scom-envelope-flow__tab {
        justify-content: flex-start !important;
        min-height: 48px !important;
        border-right: 0 !important;
        border-bottom: 1px solid #e8e9ec !important;
    }

    .scom-info-page .scom-envelope-flow__tab:last-child {
        border-bottom: 0 !important;
    }

    .scom-info-page .scom-envelope-flow__tab.is-active::after {
        top: 8px !important;
        right: auto !important;
        bottom: 8px !important;
        left: 0 !important;
        width: 2px !important;
        height: auto !important;
    }

    .scom-envelope-flow__visual {
        min-height: 255px !important;
        padding: 18px 12px !important;
    }

    .scom-envelope-stack {
        height: 220px !important;
    }

    .scom-envelope-flow__info {
        padding: 26px 22px 30px !important;
    }

    .scom-envelope-flow__panel h2 {
        font-size: 28px !important;
    }
}

.scom-envelope-heading h1 {
    white-space: nowrap !important;
}

/* =========================================================
   AUGUSTUS 2026 — MOBILE HEADLINE + PINMAILER UNI5PAY+
   ========================================================= */

/* Desktop: headline blijft op één regel waar ruimte is */
.scom-envelope-heading h1 {
    width: 100% !important;
    max-width: none !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}

/* Compacte verwijzing vanuit de pinmailer naar PIN wijzigen */
.scom-pinmailer-note {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 12px;
    margin: 0 0 18px;
    padding: 14px 15px;
    border: 1px solid var(--scom-grey-200);
    border-radius: 12px;
    background: #f7f7f8;
}

.scom-pinmailer-note__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    color: var(--scom-red);
    background: var(--scom-red-light);
    font-size: 18px;
    font-weight: 800;
    line-height: 1;
}

.scom-pinmailer-note strong {
    display: block;
    margin-bottom: 3px;
    color: var(--scom-dark);
    font-size: 13px;
    font-weight: 800;
    line-height: 1.4;
}

.scom-pinmailer-note p {
    margin: 0 0 7px !important;
    color: var(--scom-muted);
    font-size: 12px !important;
    line-height: 1.5 !important;
}

.scom-pinmailer-note a,
.scom-pinmailer-note a:hover,
.scom-pinmailer-note a:focus {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--scom-red) !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 11.5px;
    font-weight: 800;
    line-height: 1.4;
    text-decoration: none !important;
}

.scom-pinmailer-note a:hover,
.scom-pinmailer-note a:focus {
    color: var(--scom-red-dark) !important;
}

#pincode-wijzigen {
    scroll-margin-top: 24px;
}

/* Mobiel: headline mag gecontroleerd afbreken en blijft binnen viewport */
@media (max-width: 620px) {
    .scom-envelope-heading {
        width: 100% !important;
        max-width: 100% !important;
    }

    .scom-envelope-heading h1 {
        width: 100% !important;
        max-width: 100% !important;
        margin-bottom: 10px !important;
        font-size: clamp(28px, 8.2vw, 34px) !important;
        line-height: 1.08 !important;
        letter-spacing: -0.9px !important;
        white-space: normal !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
    }

    .scom-envelope-heading > p {
        width: 100% !important;
        max-width: 100% !important;
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    .scom-pinmailer-note {
        grid-template-columns: 34px minmax(0, 1fr);
        gap: 10px;
        padding: 13px;
    }

    .scom-pinmailer-note__icon {
        width: 34px;
        height: 34px;
        font-size: 16px;
    }
}

@media (max-width: 390px) {
    .scom-envelope-heading h1 {
        font-size: 28px !important;
        line-height: 1.1 !important;
        letter-spacing: -0.7px !important;
    }
}/* End custom CSS */