/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */
@layer properties;

.com-contact__form .control-group {
    margin-bottom: calc(var(--spacing, 0.25rem) * 4);
}

.com-contact__form .control-label {
    margin-bottom: calc(var(--spacing, 0.25rem) * 1);
    display: block;
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    --tw-font-weight: var(--font-weight-medium, 500);
    font-weight: var(--font-weight-medium, 500);
    color: var(--color-gray-700, oklch(37.3% 0.034 259.733));
}

.com-contact__form .controls {
    position: relative;
}

.com-contact__form input[type="text"], .com-contact__form input[type="email"], .com-contact__form input[type="url"], .com-contact__form input[type="tel"], .com-contact__form textarea, .com-contact__form select {
    display: block;
    width: 100%;
    border-radius: var(--radius-md, 0.375rem);
    border-style: var(--tw-border-style);
    border-width: 1px;
    border-color: var(--color-gray-300, oklch(87.2% 0.01 258.338));
    padding-inline: calc(var(--spacing, 0.25rem) * 4);
    padding-block: calc(var(--spacing, 0.25rem) * 2);
    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);

    &:focus {
        border-color: var(--color-blue-500, oklch(62.3% 0.214 259.815));
    }

    &:focus {
        --tw-ring-color: var(--color-blue-500, oklch(62.3% 0.214 259.815));
    }

    @media (width >= 40rem) {
        font-size: var(--text-sm, 0.875rem);
        line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    }
}

.com-contact__form textarea {
    min-height: 100px;
}

.com-contact__form .invalid {
    border-color: var(--color-red-500, oklch(63.7% 0.237 25.331));
    background-color: var(--color-red-50, oklch(97.1% 0.013 17.38));
}

.com-contact__form .help-block {
    margin-top: calc(var(--spacing, 0.25rem) * 1);
    font-size: var(--text-sm, 0.875rem);
    line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
    color: var(--color-red-600, oklch(57.7% 0.245 27.325));
}

.com-contact__form .form-check-input {
    height: calc(var(--spacing, 0.25rem) * 4);
    width: calc(var(--spacing, 0.25rem) * 4);
    border-radius: 0.25rem;
    border-color: var(--color-gray-300, oklch(87.2% 0.01 258.338));
    color: var(--color-blue-600, oklch(54.6% 0.245 262.881));

    &:focus {
        --tw-ring-color: var(--color-blue-500, oklch(62.3% 0.214 259.815));
    }
}

@property --tw-font-weight {
    syntax: "*";
    inherits: false;
}

@property --tw-border-style {
    syntax: "*";
    inherits: false;
    initial-value: solid;
}

@property --tw-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000;
}

@property --tw-shadow-color {
    syntax: "*";
    inherits: false;
}

@property --tw-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%;
}

@property --tw-inset-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000;
}

@property --tw-inset-shadow-color {
    syntax: "*";
    inherits: false;
}

@property --tw-inset-shadow-alpha {
    syntax: "<percentage>";
    inherits: false;
    initial-value: 100%;
}

@property --tw-ring-color {
    syntax: "*";
    inherits: false;
}

@property --tw-ring-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000;
}

@property --tw-inset-ring-color {
    syntax: "*";
    inherits: false;
}

@property --tw-inset-ring-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000;
}

@property --tw-ring-inset {
    syntax: "*";
    inherits: false;
}

@property --tw-ring-offset-width {
    syntax: "<length>";
    inherits: false;
    initial-value: 0px;
}

@property --tw-ring-offset-color {
    syntax: "*";
    inherits: false;
    initial-value: #fff;
}

@property --tw-ring-offset-shadow {
    syntax: "*";
    inherits: false;
    initial-value: 0 0 #0000;
}

@layer properties {
    @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
        *, ::before, ::after, ::backdrop {
            --tw-font-weight: initial;
            --tw-border-style: solid;
            --tw-shadow: 0 0 #0000;
            --tw-shadow-color: initial;
            --tw-shadow-alpha: 100%;
            --tw-inset-shadow: 0 0 #0000;
            --tw-inset-shadow-color: initial;
            --tw-inset-shadow-alpha: 100%;
            --tw-ring-color: initial;
            --tw-ring-shadow: 0 0 #0000;
            --tw-inset-ring-color: initial;
            --tw-inset-ring-shadow: 0 0 #0000;
            --tw-ring-inset: initial;
            --tw-ring-offset-width: 0px;
            --tw-ring-offset-color: #fff;
            --tw-ring-offset-shadow: 0 0 #0000;
        }
    }
}