:root { color-scheme: light; }

html { scroll-behavior: smooth; }

body {
    font-family: var(--cmt-font-body);
    color: var(--cmt-color-text);
    -webkit-font-smoothing: antialiased;
    min-height: 100dvh;
}

.cement-frame {
    position: relative;
    z-index: 1;
    margin: var(--cmt-space-5);
    min-height: calc(100dvh - calc(var(--cmt-space-5) * 2));
    background: rgb(252 252 252 / 92%);
    backdrop-filter: blur(18px);
    border-radius: var(--cmt-radius-2xl);
}

@media (width <= 640px) {
    .cement-frame {
        margin: var(--cmt-space-3);
        min-height: calc(100dvh - calc(var(--cmt-space-3) * 2));
        border-radius: var(--cmt-radius-lg);
    }
}

#video-bg {
    position: fixed;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
}

::selection {
    background: var(--cmt-color-text);
    color: var(--cmt-color-white);
}

/* Hero word mask */
.hero-word-mask {
    position: relative;
    width: 100%;
    aspect-ratio: 297 / 147;
}

.hero-video-mask {
    position: absolute;
    inset: 0;
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 297 147'%3E%3Cpath d='M 72 0 L 72 72 L 36 72 Q 28.5 72 22 69.2 Q 15.5 66.4 10.55 61.45 Q 5.6 56.5 2.8 50 Q 0 43.5 0 36 Q 0 28.5 2.8 22 Q 5.6 15.5 10.55 10.55 Q 15.5 5.6 22 2.8 Q 28.5 0 36 0 Z'/%3E%3Cpath d='M 147 48 L 147 72 L 75 72 L 75 0 L 147 0 L 147 24 L 141 24 L 141 48 Z'/%3E%3Cpath d='M 222 0 L 222 72 L 150 72 L 150 0 L 173 0 Q 176.6 0 179.55 1.75 Q 182.5 3.5 184.25 6.45 Q 186 9.4 186 13 Q 186 9.4 187.75 6.45 Q 189.5 3.5 192.45 1.75 Q 195.4 0 199 0 Z'/%3E%3Cpath transform='translate(-150 75)' d='M 297 48 L 297 72 L 225 72 L 225 0 L 297 0 L 297 24 L 291 24 L 291 48 Z'/%3E%3Cpath transform='translate(-150 75)' d='M 336 58 L 336 72 L 300 72 L 300 0 L 322 0 Q 325.9 0 329.05 1.9 Q 332.2 3.8 334.1 6.95 Q 336 10.1 336 14 L 336 0 L 372 0 L 372 72 L 350 72 Q 346.2 72 343 70.1 Q 339.8 68.2 337.9 65 Q 336 61.8 336 58 Z'/%3E%3Cpath transform='translate(-150 75)' d='M 441 24 L 441 72 L 381 72 L 381 24 L 375 24 L 375 0 L 447 0 L 447 24 Z'/%3E%3C/svg%3E");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
}

.hero-video-mask video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Signoff checkbox */
input[type="checkbox"].cement-check {
    appearance: none;
    width: 20px;
    height: 20px;
    flex: none;
    border-radius: var(--cmt-radius-full);
    background: #e8e8e8;
    cursor: pointer;
    position: relative;
    top: 0;
    margin-top: 1px;
    transition: background 0.15s, transform 0.1s;
}

input[type="checkbox"].cement-check:hover {
    background: #d4d4d4;
    transform: scale(1.08);
}

input[type="checkbox"].cement-check:checked {
    background: var(--cmt-color-text);
}

input[type="checkbox"].cement-check:checked::after {
    content: "";
    position: absolute;
    left: 7px;
    top: 3.5px;
    width: 5px;
    height: 9px;
    border: solid var(--cmt-color-white);
    border-width: 0 1.5px 1.5px 0;
    transform: rotate(45deg);
}