/* Shared values for the homepage, plans and order form. They mirror css/style-v4.css. */
:root {
    --vc-coral: #ff8a73;
    --vc-coral-hover: #ff9d8a;
    --vc-coral-strong: #c94530; /* Behind white text: 4.8:1 contrast. */
    --vc-coral-large: #e8634c; /* Large text such as prices: 3:1 contrast. */
    --vc-gradient: linear-gradient(142deg, #ffd474 0%, #ff8c8c 100%);
    --vc-navy: #222d39;
    --vc-text: #66718f; /* A shade darker than the theme's #677294 so it clears 4.5:1 on --vc-tint. */
    --vc-tint: #f4f9fe;
    --vc-border: rgba(112, 112, 112, 0.2);
    --vc-border-strong: #c9d1de;
    --vc-shadow-hover: 0 0 80px 0 rgba(192, 188, 240, 0.25);
    --vc-radius: 5px;
    --vc-radius-panel: 18px;
    --vc-error: #b3273b;
    --vc-error-tint: #fff4f5;
    --vc-focus: #222d39;
}

/* Bordered white card in the style of the theme's pricing cards. */
.vc-card {
    background: #fff;
    border: 1px solid var(--vc-border);
    border-radius: var(--vc-radius);
    transition: box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out;
}
.vc-card:hover { box-shadow: var(--vc-shadow-hover); border-color: transparent; }

/* Text link with a coral arrow. */
.vc-link {
    color: var(--vc-navy);
    font-family: "Montserrat", "Montserrat Fallback", sans-serif;
    font-size: 15px;
    font-weight: 700;
    text-decoration: underline;
    text-decoration-color: rgba(34, 45, 57, 0.3);
    text-underline-offset: 4px;
}
.vc-link:hover, .vc-link:focus { color: var(--vc-coral); text-decoration-color: currentColor; }
.vc-link span[aria-hidden] { color: var(--vc-coral); margin-left: 2px; }

/* Coral numbered or icon badge. */
.vc-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--vc-gradient);
    color: #fff;
    font-family: "Montserrat", "Montserrat Fallback", sans-serif;
    font-weight: 700;
    font-size: 17px;
}

.vc-card a:focus-visible, .vc-link:focus-visible {
    outline: 2px solid var(--vc-focus);
    outline-offset: 3px;
}
