/*
VeloraWeb modern base — loaded after every client-site theme.
Additive: it fixes and refines, it does not restyle a theme's identity.
Colours come from each site's own variables (--main-color-one, ...).
*/
:root {
    --vw-radius: 12px;
    --vw-shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 4px 12px rgba(16, 24, 40, .06);
    --vw-shadow-hover: 0 10px 28px rgba(16, 24, 40, .12);
    --vw-ease: cubic-bezier(.2, .7, .2, 1);
    --vw-focus: var(--main-color-one, #346EB6);
}

/* 1. Content is visible at once: entry animations never hide text or images. */
.wow {
    visibility: visible !important;
    animation-name: none !important;
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}

/* 2. Text rendering and reading comfort. */
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}
h1, h2, h3 {
    text-wrap: balance;
}
p {
    text-wrap: pretty;
}
::selection {
    background: rgba(var(--main-color-one-rgb, 52, 110, 182), .2);
}
html {
    scroll-padding-top: 96px;
}

/* 3. Buttons and links: smooth, clear hover, visible keyboard focus. */
a, button, .btn, .btn-wrapper a, input[type="submit"] {
    transition: color .2s var(--vw-ease), background-color .2s var(--vw-ease),
                border-color .2s var(--vw-ease), box-shadow .2s var(--vw-ease), transform .2s var(--vw-ease);
}
.btn:hover, .btn-wrapper a:hover, button[type="submit"]:hover, input[type="submit"]:hover {
    transform: translateY(-1px);
    box-shadow: var(--vw-shadow-hover);
}
.btn:active, .btn-wrapper a:active, button[type="submit"]:active {
    transform: translateY(0);
    box-shadow: none;
}
a:focus-visible, button:focus-visible, .btn:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
    outline: 3px solid var(--vw-focus);
    outline-offset: 2px;
    box-shadow: none;
}

/* 4. Forms: comfortable fields, coloured focus ring, readable placeholders. */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="submit"]):not([type="button"]),
select, textarea {
    border-radius: var(--vw-radius);
    transition: border-color .2s var(--vw-ease), box-shadow .2s var(--vw-ease);
}
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus,
select:focus, textarea:focus {
    border-color: var(--main-color-one, #346EB6) !important;
    box-shadow: 0 0 0 4px rgba(var(--main-color-one-rgb, 52, 110, 182), .15) !important;
}
::placeholder {
    opacity: .7;
}

/* 5. Images: never overflow on small screens; soft corners on content images. */
img {
    max-width: 100%;
}
.blog-single img, .blog_details img, .page-content img, article img {
    border-radius: var(--vw-radius);
}

/* 6. Tap targets on phones. */
@media (max-width: 767px) {
    .btn, .btn-wrapper a, button[type="submit"] {
        min-height: 44px;
    }
}