:root {
    --white: #ffffff;
    --black: #000000;
    --ec-black: #323232;
    --orange: #ff9900;
    --bg-blue: linear-gradient(73.63deg, #54C4C6 0%, #54C5C7 59.69%, #8CECEE 100%);
    --bg-dark-blue: #162154;
    --bg-dark-blue1: #313F7A;
    --bg-pc-blue: #5E8BC8;
    --bg-white: #ffffff;
    --bg-light-gray: #EDEDED;
    --bg-gray: #F0F0F0;
    --pc-card-01: #3DB8A1;
    --pc-card-02: #FFA655;
    --pc-card-03: #A2E246;
    --pc-card-04: #4492FF;
    --pc-card-05: #504DF1;
    --pc-card-06: #42BFE7;
    --pc-card-07: #EFE73C;
    --pc-card-08: #AD5DEB;
    --pc-card-bg: #CDE1FD;
    --orange-button: #ff9900;
    --orange-button-hover: #ee8f00;
    --blue-button: #030479;
    --blue-button-hover: #020358;
    --checked-list-item: #8AC03A;
    --social-circle-link: #667;
    --social-circle-link-hover: #DEDEDE;
    --fa-facebook: #1877F2;
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 5px 0 rgba(0, 0, 0, .2);
    --tw-shadow-colored: 0 0 #0000; 
    --bg-blue-sand: linear-gradient(73.63deg, #54C4C6 0%, #54C5C7 59.69%, #8CECEE 100%);
    --bg-light-blue: #54C4C6;
}

h1 {
  font-weight: bold;
  margin-bottom: 20px;
}



/* ─── Jumbotron layout tokens ──────────────────────────────────────────────
   Change these two values to resize the trustbar / banner offset globally.
   ──────────────────────────────────────────────────────────────────────── */
#registreren {
  --trustbar-height: 120px;   /* must match .trustbar { height } */
  --regi-banner-offset: 35px; /* gap between wrapper-top and form-top (= banner overlap space) */
}

#registreren #header {
    background: linear-gradient(278.14deg, #FFDFB4 -11.02%, #C5E2E3 26%, #A5DDDF 40.28%, #68C4C5 70.31%, #C5E2E3 107.84%)!important;
    margin-top:70px;
}
#header .header-text {
  margin-top: 0px;
}

header .jumbotron {
  margin-top: 0;
  margin-bottom: 0;
}

.jumbotron:before, .jumbotron-layer--items {
    background-color: unset;
    background-image: url("data:image/svg+xml,%3Csvg width='1401' height='668' viewBox='0 0 1401 668' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg opacity='0.4'%3E%3Cpath d='M417.714 3.46402L416.214 2.59802V4.33002V21.4185V23.1505L417.714 22.2845L432.513 13.7403L434.013 12.8742L432.513 12.0082L417.714 3.46402Z' stroke='white' stroke-width='3'/%3E%3Cpath d='M11.1734 11.9416L10.1101 10.5743L9.45771 12.1788L3.02061 28.0085L2.36816 29.6129L4.0839 29.3757L21.0113 27.0356L22.7271 26.7984L21.6638 25.4311L11.1734 11.9416Z' stroke='white' stroke-width='3'/%3E%3Cpath d='M25.2128 101.215L24.5921 99.5981L23.5021 100.944L12.7478 114.224L11.6577 115.57L13.3684 115.841L30.2464 118.515L31.9571 118.786L31.3365 117.169L25.2128 101.215Z' stroke='white' stroke-width='3'/%3E%3Cpath d='M647.637 495.215L647.016 493.598L645.926 494.944L621.749 524.8L620.658 526.146L622.369 526.417L660.314 532.428L662.025 532.699L661.404 531.082L647.637 495.215Z' stroke='white' stroke-width='3'/%3E%3Cpath d='M232.637 628.215L232.016 626.598L230.926 627.944L206.749 657.8L205.658 659.146L207.369 659.417L245.314 665.428L247.025 665.699L246.404 664.082L232.637 628.215Z' stroke='white' stroke-width='3'/%3E%3Cpath d='M1387.71 608.617L1388.35 605.606L1386.07 607.666L1379.53 613.556L1371.9 609.155L1369.24 607.616L1370.49 610.427L1374.07 618.469L1367.53 624.359L1365.24 626.419L1368.3 626.097L1377.06 625.177L1380.64 633.219L1381.89 636.03L1382.53 633.02L1384.36 624.409L1393.11 623.489L1396.17 623.168L1393.51 621.629L1385.88 617.227L1387.71 608.617Z' stroke='white' stroke-width='3'/%3E%3Cpath d='M49.5054 330.949L26.243 339.646C23.3899 340.713 21.9418 343.891 23.0085 346.744L31.7063 370.006C32.7731 372.859 35.9508 374.308 38.8039 373.241L62.0663 364.543C64.9193 363.476 66.3673 360.299 65.3003 357.445L56.6033 334.183C55.5363 331.33 52.3583 329.882 49.5054 330.949Z' stroke='white' stroke-width='3'/%3E%3Cpath d='M33.1812 350.616L38.5842 348.596L37.8969 346.757C37.8217 346.781 37.7604 346.797 37.7012 346.819C35.3392 347.702 32.9772 348.585 30.6156 349.469C30.5708 349.485 30.529 349.51 30.4856 349.531L35.6505 363.344C35.7386 363.306 35.825 363.263 35.9151 363.229C38.2087 362.371 40.5028 361.513 42.7966 360.655L43.0584 360.557L42.3614 358.693L36.9572 360.714L35.3907 356.524L40.7957 354.504L40.1016 352.647L34.6964 354.668L33.1811 350.615L33.1812 350.616Z' fill='white'/%3E%3Cpath d='M49.5642 355.899C51.6922 355.746 53.1132 354.565 53.9682 352.657C54.0652 352.441 54.1822 352.312 54.4072 352.233C55.0392 352.014 55.6622 351.77 56.2882 351.536C56.3612 351.509 56.4362 351.488 56.5172 351.462C56.4312 352.273 56.1682 353.111 55.7442 353.904C54.8122 355.645 53.0972 357.169 50.7382 357.722C49.2337 358.075 47.6887 357.92 46.3002 357.367C44.3869 356.606 42.7705 355.088 41.9697 353.09C40.5569 349.566 41.8667 345.636 45.0998 343.714C48.1477 341.902 51.9192 342.492 54.0402 344.54C53.9462 344.575 53.8682 344.605 53.7892 344.634C53.1552 344.871 52.5192 345.103 51.8892 345.349C51.7322 345.41 51.6102 345.404 51.4612 345.324C50.3242 344.717 49.1231 344.443 47.8441 344.72C45.2814 345.273 43.5253 347.47 43.5263 350.093C43.5275 353.409 46.3355 356.132 49.5642 355.899Z' fill='white'/%3E%3Cpath d='M1199.26 49.8514C1206.4 49.8514 1212.26 44.2946 1212.26 37.3514C1212.26 30.4082 1206.4 24.8514 1199.26 24.8514C1192.12 24.8514 1186.26 30.4082 1186.26 37.3514C1186.26 44.2946 1192.12 49.8514 1199.26 49.8514Z' stroke='white' stroke-width='3'/%3E%3Cpath d='M1045.66 663.439C1057.76 663.439 1067.66 654.082 1067.66 642.439C1067.66 630.796 1057.76 621.439 1045.66 621.439C1033.55 621.439 1023.66 630.796 1023.66 642.439C1023.66 654.082 1033.55 663.439 1045.66 663.439Z' stroke='white' stroke-width='3'/%3E%3Cpath d='M1095.79 350.15L1082.37 335.439L1067.66 348.863L1081.08 363.574L1095.79 350.15Z' stroke='white' stroke-width='3'/%3E%3Cpath d='M511.734 122.077C513.399 122.018 514.663 122.388 515.526 123.186C516.342 123.943 516.798 125.074 516.893 126.579L516.905 126.834L517.518 144.165C517.575 145.8 517.202 147.043 516.398 147.894C515.637 148.701 514.489 149.152 512.954 149.247L512.694 149.26L485.289 150.228C483.623 150.287 482.359 149.92 481.497 149.128C480.68 148.376 480.225 147.247 480.13 145.742L480.118 145.488L479.505 128.156C479.447 126.511 479.82 125.263 480.624 124.411C481.386 123.604 482.534 123.153 484.069 123.058L484.328 123.046L511.734 122.077ZM482.675 145.253C482.704 146.081 482.938 146.697 483.377 147.101C483.784 147.474 484.341 147.663 485.049 147.668L485.231 147.665L497.93 147.215L497.632 138.781L497.521 138.785C497.285 139.611 496.896 140.406 496.354 141.169C495.813 141.931 495.185 142.627 494.483 143.243C493.821 143.831 493.097 144.346 492.323 144.777C491.588 145.18 490.92 145.44 490.318 145.557C489.865 145.636 489.504 145.548 489.234 145.292C488.964 145.036 488.823 144.733 488.811 144.383C488.797 144.001 488.898 143.687 489.112 143.44C489.3 143.224 489.559 143.081 489.89 143.011L490.037 142.985C490.587 142.903 491.168 142.678 491.781 142.31C492.418 141.926 493.013 141.478 493.559 140.973C494.111 140.468 494.62 139.917 495.078 139.326C495.464 138.824 495.765 138.352 495.979 137.909L496.065 137.721L482.426 138.203L482.675 145.253ZM514.701 137.062L501.062 137.544C501.313 138.024 501.679 138.535 502.16 139.075C502.659 139.633 503.205 140.147 503.792 140.611C504.399 141.095 505.018 141.498 505.651 141.82C506.214 142.107 506.745 142.284 507.245 142.351L507.432 142.37C507.847 142.398 508.17 142.528 508.401 142.758C508.633 142.99 508.755 143.296 508.768 143.678C508.781 144.028 508.662 144.34 508.411 144.614C508.161 144.889 507.806 145.002 507.348 144.955C506.729 144.881 506.041 144.669 505.285 144.319C504.486 143.941 503.73 143.479 503.03 142.941C502.282 142.372 501.611 141.726 501.017 141.004C500.509 140.393 500.095 139.709 499.789 138.976L499.685 138.709L499.558 138.713L499.856 147.147L512.572 146.698C513.357 146.67 513.957 146.44 514.372 146.006C514.755 145.604 514.949 145.036 514.953 144.3L514.95 144.113L514.701 137.062ZM511.971 124.638L511.792 124.64L499.076 125.09L499.269 130.549C499.577 129.886 499.988 129.277 500.488 128.745C500.952 128.251 501.503 127.846 502.112 127.549C502.699 127.264 503.339 127.105 503.991 127.083C505.137 127.043 506.103 127.389 506.888 128.12C507.673 128.852 508.087 129.802 508.128 130.969C508.152 131.637 508.031 132.266 507.765 132.854C507.489 133.455 507.1 133.996 506.618 134.448C506.167 134.874 505.661 135.238 505.114 135.53L504.868 135.657L514.639 135.312L514.347 127.068C514.318 126.24 514.081 125.622 513.637 125.213C513.227 124.834 512.671 124.642 511.971 124.638ZM497.151 125.158L484.451 125.607C483.655 125.635 483.052 125.868 482.643 126.308C482.264 126.714 482.073 127.285 482.07 128.021L482.073 128.209L482.364 136.452L492.12 136.108C491.465 135.838 490.853 135.473 490.305 135.024C489.791 134.607 489.361 134.095 489.041 133.516C488.727 132.947 488.554 132.31 488.537 131.661C488.495 130.494 488.843 129.518 489.58 128.732C490.318 127.946 491.254 127.533 492.389 127.493C493.057 127.47 493.699 127.58 494.313 127.824C494.941 128.078 495.519 128.443 496.016 128.903C496.482 129.331 496.882 129.826 497.203 130.371L497.344 130.617L497.151 125.158ZM492.597 129.749C492.024 129.769 491.574 129.958 491.246 130.314C490.919 130.671 490.767 131.152 490.788 131.757C490.806 132.256 490.977 132.746 491.302 133.228C491.627 133.711 492.067 134.141 492.622 134.52C493.206 134.912 493.844 135.215 494.517 135.418C495.137 135.609 495.787 135.706 496.465 135.71L496.758 135.705L497.235 135.688L497.22 135.242C497.198 134.506 497.054 133.779 496.793 133.09C496.551 132.446 496.201 131.846 495.758 131.318C495.326 130.808 494.839 130.413 494.298 130.135C493.773 129.861 493.187 129.728 492.596 129.749M503.943 129.348C503.356 129.369 502.786 129.543 502.287 129.852C501.767 130.168 501.31 130.596 500.915 131.136C500.51 131.695 500.201 132.317 500 132.977C499.81 133.59 499.714 134.228 499.714 134.869L499.718 135.154L499.734 135.6L500.212 135.583C500.975 135.561 501.729 135.411 502.443 135.137C503.098 134.889 503.711 134.542 504.262 134.109C504.784 133.692 505.19 133.231 505.481 132.727C505.771 132.223 505.908 131.722 505.89 131.223C505.868 130.618 505.684 130.15 505.338 129.816C504.991 129.483 504.526 129.327 503.943 129.348Z' fill='white'/%3E%3Cpath d='M1289.42 319.794C1291.85 318.839 1293.91 318.727 1295.6 319.457C1297.2 320.151 1298.47 321.586 1299.39 323.763L1299.54 324.132L1309.48 349.438C1310.42 351.825 1310.51 353.856 1309.77 355.534C1309.06 357.125 1307.6 358.39 1305.38 359.329L1305 359.483L1264.99 375.194C1262.55 376.148 1260.49 376.264 1258.81 375.542C1257.21 374.855 1255.95 373.424 1255.02 371.248L1254.87 370.879L1244.94 345.572C1243.99 343.17 1243.89 341.13 1244.64 339.453C1245.34 337.863 1246.81 336.598 1249.03 335.658L1249.4 335.504L1289.42 319.794ZM1258.53 369.2C1259 370.409 1259.67 371.197 1260.53 371.566C1261.33 371.905 1262.25 371.894 1263.3 371.533L1263.56 371.434L1282.11 364.153L1277.27 351.838L1277.11 351.902C1277.19 353.246 1277.03 354.624 1276.63 356.035C1276.22 357.443 1275.66 358.799 1274.94 360.075C1274.27 361.29 1273.47 362.429 1272.55 363.469C1271.67 364.448 1270.82 365.18 1269.99 365.667C1269.36 366.02 1268.78 366.078 1268.25 365.84C1267.72 365.602 1267.35 365.228 1267.15 364.716C1266.93 364.158 1266.91 363.642 1267.1 363.166C1267.27 362.748 1267.58 362.402 1268.03 362.126L1268.23 362.011C1269 361.602 1269.74 360.967 1270.46 360.104C1271.2 359.205 1271.85 358.232 1272.39 357.2C1272.95 356.166 1273.41 355.087 1273.78 353.974C1274.09 353.031 1274.29 352.176 1274.37 351.409L1274.4 351.087L1254.49 358.905L1258.53 369.2ZM1301.61 340.404L1281.7 348.222C1282.32 348.801 1283.13 349.365 1284.12 349.914C1285.15 350.478 1286.22 350.953 1287.33 351.334C1288.48 351.733 1289.61 352.006 1290.71 352.153C1291.69 352.284 1292.57 352.268 1293.35 352.107L1293.63 352.039C1294.26 351.864 1294.8 351.887 1295.27 352.107C1295.73 352.329 1296.07 352.718 1296.29 353.276C1296.49 353.787 1296.48 354.311 1296.25 354.847C1296.02 355.383 1295.56 355.735 1294.85 355.905C1293.9 356.118 1292.77 356.162 1291.47 356.038C1290.09 355.897 1288.74 355.607 1287.42 355.176C1286.02 354.724 1284.69 354.119 1283.44 353.36C1282.37 352.721 1281.4 351.927 1280.56 351.002L1280.27 350.662L1280.08 350.734L1284.92 363.049L1303.49 355.76C1304.63 355.31 1305.4 354.656 1305.79 353.798C1306.14 353.005 1306.13 352.063 1305.76 350.974L1305.66 350.698L1301.61 340.404ZM1291.1 323.456L1290.84 323.553L1272.27 330.842L1275.4 338.813C1275.51 337.674 1275.8 336.559 1276.27 335.512C1276.7 334.539 1277.3 333.653 1278.04 332.896C1278.76 332.169 1279.63 331.601 1280.58 331.23C1282.25 330.573 1283.86 330.581 1285.4 331.253C1286.95 331.926 1288.05 333.114 1288.72 334.818C1289.1 335.794 1289.25 336.787 1289.17 337.795C1289.07 338.827 1288.78 339.83 1288.3 340.75C1287.85 341.614 1287.3 342.415 1286.64 343.132L1286.34 343.449L1300.61 337.848L1295.88 325.811C1295.41 324.602 1294.74 323.811 1293.87 323.438C1293.06 323.092 1292.14 323.098 1291.1 323.456ZM1269.46 331.946L1250.92 339.227C1249.76 339.683 1248.99 340.342 1248.61 341.205C1248.26 342.003 1248.28 342.947 1248.66 344.037L1248.76 344.313L1253.48 356.349L1267.73 350.757C1266.62 350.699 1265.53 350.478 1264.48 350.101C1263.5 349.752 1262.6 349.218 1261.83 348.529C1261.07 347.851 1260.48 347.001 1260.11 346.049C1259.45 344.345 1259.45 342.721 1260.13 341.175C1260.81 339.629 1261.98 338.531 1263.64 337.881C1264.61 337.497 1265.62 337.326 1266.66 337.367C1267.72 337.415 1268.76 337.654 1269.74 338.075C1270.65 338.465 1271.5 338.988 1272.26 339.627L1272.59 339.917L1269.46 331.946ZM1265.12 341.107C1264.29 341.435 1263.72 341.948 1263.42 342.647C1263.12 343.345 1263.15 344.135 1263.49 345.018C1263.78 345.746 1264.29 346.382 1265.02 346.926C1265.75 347.47 1266.63 347.878 1267.65 348.149C1268.71 348.424 1269.81 348.538 1270.91 348.488C1271.93 348.448 1272.94 348.253 1273.95 347.905L1274.38 347.745L1275.07 347.471L1274.82 346.82C1274.4 345.743 1273.81 344.743 1273.07 343.861C1272.37 343.034 1271.54 342.331 1270.61 341.78C1269.71 341.251 1268.78 340.921 1267.84 340.791C1266.92 340.659 1265.98 340.768 1265.12 341.107M1281.69 334.603C1280.83 334.94 1280.08 335.494 1279.5 336.211C1278.9 336.949 1278.45 337.821 1278.14 338.824C1277.84 339.862 1277.7 340.942 1277.75 342.023C1277.79 343.028 1277.98 344.021 1278.31 344.97L1278.47 345.388L1278.72 346.039L1279.42 345.765C1280.54 345.336 1281.57 344.72 1282.49 343.944C1283.33 343.236 1284.05 342.403 1284.64 341.476C1285.19 340.587 1285.56 339.695 1285.72 338.798C1285.89 337.901 1285.83 337.089 1285.54 336.361C1285.2 335.478 1284.68 334.881 1283.99 334.569C1283.31 334.257 1282.54 334.268 1281.69 334.603Z' fill='white'/%3E%3Cpath d='M1292.92 368.481C1292.77 368.98 1292.25 369.262 1291.75 369.112L1262.72 360.354C1262.22 360.203 1261.94 359.677 1262.09 359.178L1263.87 353.275C1264.02 352.777 1263.73 352.25 1263.24 352.1L1263.04 352.04C1260.9 351.394 1259.3 350.095 1258.26 348.144C1257.21 346.192 1257.01 344.146 1257.65 342.005C1258.3 339.864 1259.6 338.27 1261.55 337.223C1263.5 336.176 1265.55 335.976 1267.69 336.622L1267.89 336.681C1268.39 336.832 1268.91 336.55 1269.06 336.051L1270.84 330.148C1270.99 329.649 1271.52 329.367 1272.02 329.517L1301.05 338.275C1301.55 338.425 1301.83 338.952 1301.68 339.45L1292.92 368.481ZM1290.21 366.244C1290.71 366.395 1291.23 366.113 1291.38 365.614L1298.81 340.989C1298.96 340.49 1298.68 339.964 1298.18 339.813L1273.56 332.384C1273.06 332.234 1272.53 332.516 1272.38 333.015L1271.27 336.715C1271.12 337.214 1271.4 337.74 1271.9 337.891L1276.7 339.339C1277.2 339.49 1277.48 340.016 1277.33 340.515L1277.21 340.911C1277.06 341.41 1276.53 341.692 1276.03 341.542L1271.23 340.093C1270.73 339.943 1270.21 340.225 1270.06 340.724L1267.28 349.931C1267.13 350.43 1267.41 350.956 1267.91 351.106L1272.71 352.555C1273.21 352.706 1273.49 353.232 1273.34 353.731L1273.22 354.127C1273.07 354.626 1272.55 354.908 1272.05 354.758L1267.24 353.309C1266.75 353.159 1266.22 353.441 1266.07 353.94L1264.95 357.64C1264.8 358.139 1265.09 358.665 1265.58 358.816L1290.21 366.244ZM1263.9 349.897C1264.4 350.048 1264.93 349.765 1265.08 349.267L1267.85 340.06C1268 339.561 1267.72 339.035 1267.22 338.884L1267.02 338.824C1265.47 338.357 1264.01 338.493 1262.63 339.233C1261.25 339.974 1260.32 341.119 1259.86 342.67C1259.39 344.22 1259.53 345.686 1260.27 347.066C1261.01 348.446 1262.15 349.37 1263.7 349.837L1263.9 349.897Z' fill='white' fill-opacity='0.11'/%3E%3C/g%3E%3C/svg%3E%0A");
    background-attachment: scroll;
    background-size: auto 100%;
    padding-bottom: 0px;
    background-repeat: repeat-x;
    height: 100%;
    content: "";
    position: absolute;
    z-index: -2;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    opacity: 1;
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown;
    -webkit-animation-duration: 3s;
    animation-duration: 3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    transition-timing-function: cubic-bezier(.17, .67, .83, .67);
}
.jumbotron {
    background-color: unset;
    background-image: unset;
    background-size: cover;
    /* Reserve exactly the trustbar height at the bottom so content never slides under it */
    padding-bottom: var(--trustbar-height, 120px);
    padding-top: 64px;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    overflow: hidden;
    z-index: 1;
}

#registreren .jumbotron::before,
#registreren .jumbotron::after {
  content: none;
}

.jumbotron-layers {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}

.jumbotron-layer {
  position: absolute;
  inset: 0;
}

.jumbotron-layer--items {
  z-index: 0;
  opacity: 0;
  transform: translateY(-72px);
  will-change: transform, opacity;
  animation: none;
  -webkit-animation: none;
  /* Fix: gebruik vaste hoogte zodat de achtergrond-SVG niet schaalt
     wanneer de jumbotron groeit door de terms-animatie. */
  background-size: auto 668px;
}

.jumbotron-layer--lines {
  z-index: 0;
  overflow: hidden;
  width: 48%;
  right: auto;  /* pin to left side only */
  -webkit-mask-image: linear-gradient(to right, white 55%, transparent 100%);
  mask-image: linear-gradient(to right, white 55%, transparent 100%);
}

.jumbotron-lines-svg {
  position: absolute;
  left: 0;
  pointer-events: none;
  flex-shrink: 0;
}

.jumbotron-lines-svg--1 {
  top: -150px;
  width: 544px;
  height: 388px;
}

.jumbotron-lines-svg--2 {
  top: 350px;
  width: 918px;
  height: 474px;
}

.jumbotron-line {
  fill: none;
  stroke: rgba(255, 255, 255, 0.35);
  stroke-width: 5;
  stroke-linecap: round;
  opacity: 0;
}

.jumbotron-layer--coins {
  z-index: 1;
}

.jumbotron-coin {
  position: absolute;
  display: block;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: center;
  will-change: transform;
}

.jumbotron-coin--a1,
.jumbotron-coin--a2 {
  width: 54.93px;
  height: 58.16px;
  background-image: url("https://img.euroclix.nl/images/euroclix/registreren/coin1.svg");
}

.jumbotron-coin--c1 {
  width: 72px;
  height: 76.24px;
  background-image: url("https://img.euroclix.nl/images/euroclix/registreren/coin3.svg");
}

.jumbotron-coin--b1,
.jumbotron-coin--b2 {
  width: 63px;
  height: 33.01px;
  background-image: url("https://img.euroclix.nl/images/euroclix/registreren/coin2.svg");
}

/* Coins follow the content container (max 991px centered).
   calc(50% - 510px) ≈ left/right edge of container; max() keeps them
   from going off-screen on narrow viewports. */
.jumbotron-coin--a1 { left: max(8px, calc(47% - 510px)); top: 59%; }
.jumbotron-coin--a2 { right: max(8px, calc(50% - 510px)); top: 9%; }
.jumbotron-coin--c1 { right: max(8px, calc(50% - 510px)); top: 70%; }
.jumbotron-coin--b1 { left: max(8px, calc(48% - 510px)); top: 28%; }
.jumbotron-coin--b2 { left: 49%; top: 3%; }

.jumbotron-content {
  position: relative;
  z-index: 2;
}

.header-text > div {
  font-size: 22px;
}

/* temporary hidden because app isn't ready yet */
.store-btns {
  display: none;
}

.trustbar {
  position: absolute;
  display: block;
  bottom: 0;
  background-color: var(--bg-light-blue);
  height: 120px;
  color: #fff;
  width: 100%;
  text-align: center;
  min-height: unset;
  margin: 0;
  padding: 0;
  box-shadow: unset;
  z-index: 2;
}



/* --- ROBUUSTE FLEX FIX VOOR LOGIN BUTTON IN NAVBAR --- */

.navbar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 64px;
}

/* --- EINDE FLEX FIX --- */

.registratie-formulier-banner {
    width: 100%;
    border-radius: 16px 16px 0 0;
    font-size:14px;
}
.registratie-formulier {
    width: 100%;
    border-radius: 16px 16px 0 0;
    padding: 0 30px 20px 30px;
}

.registration-form-banner, .registration-form {
  left: 0;
  right: 0;
  margin: 0 auto;
}
.registration-form {
  padding: 0 30px 20px 30px;
  position: relative;
  top: 35px;
  border-radius: 7px;
  background-color: rgba(255, 255, 255, 1);
  z-index: 2;
  max-width: 417px;
}

/* Make .container just a width/centering wrapper; apply flex to .row so
   Bootstrap columns become equal-height flex items on desktop. */
.jumbotron-content > .container > .row {
    display: flex;
    flex-wrap: wrap;        /* stacks on mobile, side-by-side on desktop */
    align-items: stretch;   /* both columns share the same height */
}

@media (min-width: 768px) {
  .jumbotron-content > .container {
    margin: 0 auto;
    width: 100%;
    max-width: 991px;
  }
}

/* Right column: push the form wrapper to the bottom so it always
   touches the trustbar, regardless of how tall the left column is. */
#registreren .registratie-container {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

/* Wrapper that groups the banner + form together.
   position:relative lets the banner use absolute placement
   relative to the wrapper (not the whole column). */
#registreren .regi-form-wrapper {
  position: relative;
}

/* Fix: was `top: 35px` (visual-only shift that overflowed into the trustbar).
   Using margin-top instead so the height properly contributes to the layout. */
#registreren .registratie-formulier {
  top: 0;
  margin-top: var(--regi-banner-offset, 35px);
}

@media (min-width: 768px) and (max-width: 893px) {
  h1 {
    font-size: 30px;
  }
}

@media (max-width: 767px) {
  .jumbotron-coin--a1 { left: -2%; top: 57%; }
  .jumbotron-coin--a2 { right: 3%; top: 5%; }
  .jumbotron-coin--c1 { right: -7%; top: 68%; }
  .jumbotron-coin--b1 { left: -6%; top: 30%; }
  .jumbotron-coin--b2 { left: 3%; top: 5%; }
}

/* style2.css pushes the container right on small screens — undo it and center the form */
@media screen and (max-width: 500px) {
  #registreren .registratie-container {
    margin-right: 0;
    align-items: center;
  }
}

/* Email icon input wrapper */
.regi-email-input {
  display: flex;
  align-items: center;
  border: 1px solid #ced4da;
  border-radius: 4px;
  background: #fff;
  padding: 0 12px;
  height: 42px;
  transition: border-color 120ms ease, box-shadow 120ms ease;
}

.regi-email-input:focus-within {
  border-color: #ff9900;
  box-shadow: 0 2px 6px rgba(50, 50, 50, 0.15);
}

.regi-email-icon {
  width: 20px;
  height: 20px;
  background: url("https://img.euroclix.nl/images/euroclix/registreren/email-icon.svg") center / contain no-repeat;
  flex-shrink: 0;
  margin-right: 8px;
}

.regi-email-input .form-control {
  border: 0;
  box-shadow: none;
  padding: 0;
  height: auto;
  flex: 1;
  background: transparent;
}

.regi-email-input .form-control:focus {
  outline: 0;
  box-shadow: none;
}

.review-widget-container {
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin: 10px 0 20px 0;
  margin-top: 10px;
  padding: 2px 0;
  margin-top: 24px;
}

.tooltip-grey {
  width: 14px;
  vertical-align: top;
  padding-top: 3px;
}

@media screen and (max-width: 767px) {
  .jumbotron {
      padding-bottom:0;
  }
  .header-text {
      text-align: center;
      margin-bottom: 20px;
  }
  .header-text > div {
      font-size:22px;
  }
  .jumbotron-subtitle {
      display: none;
  }
  h1 {
      font-size: 28px;
  }
}

.container.trustbar-container {
  width: 100%;
  max-width: 920px;
}


.text-center{
  text-align: center;
  margin-top: 0;  /* overwrite style.css someone added margin-top */
}

.main {
  overflow-x: hidden;
}

.block {
    padding: 64px 0;
}


/* Alternating section backgrounds — no need to set a class per block */
.main>.block:nth-child(odd) {
  background: #fff;
}

.main>.block:nth-child(even) {
  background: #f2f2f2;
}

/* Cards: equal row heights, varying widths (60/40 split), image clip */
.cards {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: stretch;
}

.cards__item {
  display: flex;
  flex-direction: column;
}

.cards__item--large {
  flex: 0 0 calc(52% - 10px);
}

.cards__item--small {
  flex: 0 0 calc(48% - 10px);
}

.cards__box {
  border-radius: 16px;
  padding: 28px 24px;
  display: flex;
  flex: 1;
  overflow: hidden;
}

.cards__box--blue {
  background: #e0ecff;
}

.cards__box--green {
  background: #dff5e3;
}

.cards__box--yellow {
  background: #fff4d6;
}

.cards__box--pink {
  background: #ffecec;
}

.cards__box-content {
  display: flex;
  align-items: stretch;
  width: 100%;
  gap: 0;
}

.cards__box-text {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-right: 24px;
  /* padding-right: 3px; */
}

.cards__box-title {
  font-size: 20px;
  font-weight: 700;
  margin: 0 0 10px;
  color: #1a1a1a;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Fixed 3-line height so button always aligns: 14px * 1.5 * 3 lines = 63px */
.cards__box-desc {
  font-size: 16px; /* explicit — don't inherit body's 12px on mobile */
  color: #444;
  margin: 0 0 16px;
  line-height: 1.5;
  height: calc(16px * 1.5 * 3);
  overflow: hidden;
}

.cards__box-btn {
  display: inline-block;
  background: #f5a100;
  color: #fff;
  font-weight: 700;
  font-size: 15px;
  padding: 10px 24px;
  border-radius: 8px;
  text-decoration: none;
  align-self: flex-start;
  margin-bottom: 0;
}

.cards__box-btn:hover,
.cards__box-btn:focus {
  background: #d98e00;
  color: #fff;
  text-decoration: none;
}

/* Uniform image container: 241px (= widest exported image) for large cards, 160px for small.
   Left margin is the text-to-image gap; right/top/bottom bleed to card edges. */
.cards__box-image {
  flex-shrink: 0;
  width: 200px;
  align-self: stretch;
  margin: -28px -24px -28px 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cards__item--small .cards__box-image {
  width: 200px;
}

/* Image fills container; min-width intentionally wider than container on mobile
   so the image clips on the right (overflow:hidden on container handles this). */
.cards__box-image img {
  width: 100%;
  height: auto;
  display: block;
  min-width: 174px;
}

@media(max-width:991px) {
  .cards__item--1 {
    order: 2; /* Komt op de 2e plek */
  }
  .cards__item--2 {
    order: 1; /* Komt op de 1e plek */
  }
  .cards__item--3 {
    order: 3; /* Blijft op de 3e plek */
  }
  .cards__item--4 {
    order: 4; /* Blijft op de 4e plek */
  }
}

/* Tablet (769px–991px): full-width cards so text area stays wide; image keeps desktop size */
@media(min-width:769px) and (max-width:991px) {
  .cards__item--large,
  .cards__item--small {
    flex: 0 0 100%;
  }

  /* --small cards no longer need a narrower image; restore to desktop width */
  .cards__item--small .cards__box-image {
    width: 200px;
  }

  .cards__box-desc {
    font-size: 16px;
    color: #444;
    margin: 0 0 16px;
    line-height: 1.5;
    height: unset;
    overflow: hidden;
  }
  
}

/* Mobile (≤768px): earn-pages layout — stacked, contained image with right-clip */
@media (max-width:768px) {
  .jumbotron {
      /* padding-top: 40px; */
  }  
  .block {
      padding: 40px 0;
  }  
  .cards__item--large,
  .cards__item--small {
    flex: 0 0 100%;
  }

  .cards__box {
    padding: 28px 24px;
  }

  .cards__box-text {
    padding-right: 12px;
  }

  .cards__box-desc {
    font-size: 14px;
    height: auto;
    flex: 1;
  }

  .cards__box-image {
    width: 140px;
    margin: -28px -24px -28px 16px;
    overflow: hidden;
    display: block;
    align-content: center;
  }

  .cards__item--small .cards__box-image {
    width: 140px;
  }
}

/* Small mobile (≤576px): earn-pages small-mobile values */
@media(max-width:576px) {
  .cards__box {
    padding: 20px 16px;
  }

  .cards__box-text {
    padding-right: 12px;
  }

  .cards__box-image {
    width: 130px;
    margin: -20px -16px -20px 12px;
  }

  .cards__item--small .cards__box-image {
    width: 130px;
  }
}

@media(max-width:390px) {
  .cards__box-title {
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 10px;
    color: #1a1a1a;
    line-height: 1.3;
    display: block;
    -webkit-line-clamp: unset;
    overflow: visible;
  }
}

/* === HOW IT WORKS SLIDER === */
.slider__heading {
  font-size: 28px;
  font-weight: 700;
  color: #f5a100;
  margin: 0 0 40px;
}

.slider {
  display: flex;
  align-items: stretch;
  gap: 40px;
}

.slider__steps {
  flex: 0 0 42%;
  display: flex;
  flex-direction: column;
}

.slider__step {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  cursor: pointer;
  padding-bottom: 40px;
  position: relative;
}

.slider__step:last-child {
  padding-bottom: 0;
}

.slider__step:not(:last-child)::after {
  content: '';
  position: absolute;
  left: 27px;
  top: 68px;
  bottom: 12px;
  width: 2px;
  background: #d0d0d0;
}

.slider__step-icon {
  flex: 0 0 56px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #d8d8d8;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  transition: background .35s, color .35s;
  position: relative;
  z-index: 1;
}

.slider__step.active .slider__step-icon {
  background: #54C4C6;
  color: #fff;
}

.slider__step-body {
  flex: 1;
  min-width: 0;
}

.slider__step-title {
  font-size: 25px;
  font-weight: 700;
  color: #aaa;
  margin: 10px 0 6px;
  transition: color .35s;
}

.slider__step.active .slider__step-title {
  font-weight: 700;
  color: #222;
}

.slider__step-desc {
  font-size: 18px;
  font-weight: 400;
  color: #bbb;
  margin: 0;
  transition: color .35s;
}

.slider__step.active .slider__step-desc {
  color: #555;
}

.slider__visual {
  flex: 1;
  min-width: 0;
  position: relative;
  height: 468px;
  overflow: hidden;
}

.slider__image {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 440px;
  border-radius: 12px;
  opacity: 0;
  pointer-events: none;
}

.slider__image.active {
  opacity: 1;
  pointer-events: auto;
  animation: sliderImageIn .65s cubic-bezier(.34, 1.3, .64, 1) both;
}

@keyframes sliderImageIn {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(.94);
  }

  60% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1.02);
  }

  100% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}

.slider__mobile-content {
  display: none;
}

@media(max-width:768px) {
  .slider {
    flex-direction: column;
    gap: 24px;
  }

  .slider__visual {
    order: 1;
    width: 100%;
    height: 280px;
    flex: 0 0 280px; /* prevent flex from collapsing the fixed-height image area */
    aspect-ratio: unset;
  }

  .slider__image {
    max-height: 280px; /* match container height so images fit within the 280px block */
  }

  .slider__mobile-content {
    order: 2;
    display: block;
    text-align: center;
    padding: 0 8px;
    min-height: 80px;
  }

  .slider__mobile-title {
    font-size: 20px;
    font-weight: 700;
    color: #222;
    margin: 0 0 8px;
  }

  .slider__mobile-desc {
    /* font-size: 15px; */
    color: #555;
    margin: 0;
  }

  .slider__steps {
    order: 3;
    flex-direction: row;
    justify-content: center;
    gap: 32px;
  }

  .slider__step {
    flex-direction: column;
    align-items: center;
    padding-bottom: 0;
    gap: 0;
  }

  .slider__step::after {
    display: none;
  }

  .slider__step:not(:last-child)::after {
    display: block;
    top: 27px;
    left: 64px;
    width: 16px;
    height: 2px;
    bottom: auto;
  }

  .slider__step-body {
    display: none;
  }
}

/* === REVIEWS SECTION === */
.reviews__heading {
  font-size: 28px;
  font-weight: 700;
  color: #333;
  margin: 0 0 36px;
}

.reviews__subtitle {
  font-size: 14px;
  color: #999;
  margin: -20px auto 32px;
  text-align: center;
}

.reviews-wrapper {
  display: flex;
  align-items: center;
  gap: 12px;
}

.reviews__viewport {
  flex: 1;
  overflow: hidden;
  padding: 14px 6px;
  margin: -14px -6px;
}

.reviews__track {
  display: flex;
  transition: transform .55s cubic-bezier(.4, 0, .2, 1);
}

.reviews__item {
  flex-shrink: 0;
  min-width: 0;
  box-sizing: border-box;
}

.review {
  background: #fff;
  border: 1px solid #e8e8e8;
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .08);
  height: 100%;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

.review__header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 8px;
}

.review__avatar {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 15px;
  color: #fff;
  flex-shrink: 0;
  line-height: 1;
}

.review__avatar--1 {
  background: #54C4C6;
}

.review__avatar--2 {
  background: #f5a100;
}

.review__avatar--3 {
  background: #5bb96d;
}

.review__avatar--4 {
  background: #3d8bcd;
}

.review__avatar--5 {
  background: #9b59b6;
}

.review__meta {
  flex: 1;
  min-width: 0;
}

.review__name {
  font-weight: 700;
  font-size: 15px;
  color: #222;
  display: block;
  margin-bottom: 5px;
}

.review__stars {
  color: #FECD3D;
  font-size: 26px;
  white-space: nowrap;
  display: block;
  margin-bottom: 10px;
}

.review__stars .fa-star {
  margin-right: 1px;
}

.review__text {
  font-size: 14px;
  line-height: 1.65;
  color: #555;
  margin: 0;
  flex: 1;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 8;
  -webkit-box-orient: vertical;
}

.reviews__nav {
  flex-shrink: 0;
  background: #fff;
  border: 2px solid #ddd;
  border-radius: 50%;
  width: 46px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #555;
  font-size: 16px;
  transition: background .2s, border-color .2s, color .2s;
  padding: 0;
}

.reviews__nav:hover:not([disabled]) {
  background: #54C4C6;
  border-color: #54C4C6;
  color: #fff;
}

.reviews__nav[disabled] {
  opacity: .35;
  cursor: not-allowed;
}

.reviews__nav{
  margin: 0 10px 20px 10px;
}

.reviews__dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 20px;
}

.reviews__dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #d8d8d8;
  border: none;
  padding: 0;
  cursor: pointer;
  transition: background .25s, transform .25s;
  flex-shrink: 0;
}

.reviews__dot.active {
  background: var(--orange);
  transform: scale(1.25);
}

@media(max-width:768px) {
  .reviews-wrapper {
    gap: 6px;
  }

  .reviews__nav {
    width: 36px;
    height: 36px;
    font-size: 13px;
  }
}

#howItWorksSlider {
  margin-top: 0px;
  margin-bottom: 0px;
}


/* === FONT OVERRIDE: Ubuntu === */
body,
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6,
p, .navbar, .brand, a, .td-name, td {
  font-family: 'Ubuntu', sans-serif;
}

.trustbar .row.d-flex {
  justify-content: center;
}

#faq.block {
  padding-bottom: 60px;
}

/* ─── Modern FAQ accordion ──────────────────────────────────────────────── */

#faq .panel-group {
  margin-bottom: 0;
}

#faq .panel.panel-default {
  background: #fff;
  border: none;
  border-radius: 12px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.07);
  margin-bottom: 10px;
  overflow: hidden;
}

#faq .panel.panel-default + .panel.panel-default {
  margin-top: 0;
}

#faq .panel-heading {
  background: #fff !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 0;
  cursor: pointer;
  transition: background 180ms ease;
}

#faq .panel-heading:hover {
  background: #f7fafa !important;
}

/* Question row: flex so chevron sits on the right */
#faq .panel-heading .faq-margin {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 22px;
  margin: 0;
  font-size: 15px;
  color: #1a1a2e;
  line-height: 1.4;
  gap: 12px;
}

#faq .panel-heading .faq-margin strong {
  font-weight: 600;
  flex: 1;
}

/* Chevron via ::after on .faq-margin — mask approach so var(--orange) works */
#faq .panel-heading .faq-margin::after {
  content: '';
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  background-color: var(--orange);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") center / contain no-repeat;
  transition: transform 250ms ease;
}

/* Rotate chevron when open */
#faq .panel-heading:not(.collapsed) .faq-margin::after {
  transform: rotate(180deg);
}

/* Hide Bootstrap's empty h4 */
#faq .panel-title {
  display: none;
}

/* Answer body */
#faq .panel-body {
  padding: 0 22px 20px 22px;
  font-size: 16px;
  color: #555;
  line-height: 1.65;
  border-top: 1px solid #f0f0f0;
  margin: 0 22px;
  padding-top: 16px;
}

/* Left/right column gap on desktop */
@media (min-width: 768px) {
  #faq #accordion.row {
    gap: 0;
  }
}

/* quickfix */
footer {
  margin-top: 0;
  height:auto;
}

.terms,
.privacy {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  pointer-events: none;
}

.privacy a {
  color: var(--orange)!important;
}
.privacy a, .privacy span.privacy-text {
  line-height: 1.2;
  font-size: 12px;
}

.privacy span.privacy-text {
  margin-bottom: 5px;
}

#namegoogle{
    display: none;
}

.carousel-indicators li, .carousel-indicators li.active {
  margin-right: 8px;
  margin-left: 8px;
}

/* Tooltip styling from ct-paper */
.tooltip {
  font-size: 14px;
  font-weight: 400;
}
.tooltip.top {
  margin-top: -11px;
  padding: 0;
}
.tooltip.top .tooltip-inner:after {
  border-top: 11px solid #FFFFFF;
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  bottom: -10px;
}
.tooltip.top .tooltip-inner:before {
  border-top: 11px solid rgba(0, 0, 0, 0.2);
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  bottom: -11px;
}
.tooltip.bottom {
  margin-top: 11px;
  padding: 0;
}
.tooltip.bottom .tooltip-inner:after {
  border-bottom: 11px solid #FFFFFF;
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  top: -10px;
}
.tooltip.bottom .tooltip-inner:before {
  border-bottom: 11px solid rgba(0, 0, 0, 0.2);
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  top: -11px;
}
.tooltip.left {
  margin-left: -11px;
  padding: 0;
}
.tooltip.left .tooltip-inner:after {
  border-left: 11px solid #FFFFFF;
  border-top: 11px solid transparent;
  border-bottom: 11px solid transparent;
  right: -10px;
  left: auto;
  margin-left: 0;
}
.tooltip.left .tooltip-inner:before {
  border-left: 11px solid rgba(0, 0, 0, 0.2);
  border-top: 11px solid transparent;
  border-bottom: 11px solid transparent;
  right: -11px;
  left: auto;
  margin-left: 0;
}
.tooltip.right {
  margin-left: 11px;
  padding: 0;
}
.tooltip.right .tooltip-inner:after {
  border-right: 11px solid #FFFFFF;
  border-top: 11px solid transparent;
  border-bottom: 11px solid transparent;
  left: -10px;
  top: 10px;
  margin-left: 0;
}
.tooltip.right .tooltip-inner:before {
  border-right: 11px solid rgba(0, 0, 0, 0.2);
  border-top: 11px solid transparent;
  border-bottom: 11px solid transparent;
  left: -11px;
  top: 11px;
  margin-left: 0;
}

.tooltip-arrow {
  display: none;
  opacity: 0;
}

.tooltip-inner {
  background-color: #FFFFFF;
  border-radius: 8px;
  box-shadow: 0 1px 13px rgba(0, 0, 0, 0.14), 0 0 0 1px rgba(115, 71, 38, 0.23);
  color: #66615B;
  max-width: 200px;
  padding: 10px 10px;
  text-align: center;
  text-decoration: none;
}

.tooltip-inner:after {
  content: "";
  display: inline-block;
  left: 100%;
  margin-left: -60%;
  position: absolute;
}

.tooltip-inner:before {
  content: "";
  display: inline-block;
  left: 100%;
  margin-left: -60%;
  position: absolute;
}

/* ─── Banner: vertraagd na de formulier-content ──────────────────────────── */
/* De globale .animate-up heeft delay 0.5s; hier overschrijven we dat zodat
   de banner pas verschijnt nadat de social-btns (klaar op ~1.2s) zijn ingevlogen. */
#registreren .registratie-formulier-banner.animate-up {
    animation-delay: 1.4s;
}

/* ─── Social buttons fade-in ─────────────────────────────────────────────── */
@keyframes socialFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0);   }
}

.row.social-btns #google {
  opacity: 0;
  animation: socialFadeIn 0.5s ease-out 0.3s forwards;
}

.row.social-btns #facebook {
  opacity: 0;
  animation: socialFadeIn 0.5s ease-out 0.7s forwards;
}