/* VARGA WEBDESIGN – GLOBALE STYLES */

/* VARGA WEBDESIGN – ZUSÄTZLICHES CSS */

/* 01 – DESIGN-TOKENS & GRUNDLAGEN */

:root {
    --vw-color-primary: #087bd3;
    --vw-color-primary-dark: #066bb9;
    --vw-color-primary-soft: #edf7fd;
    --vw-color-heading: #101827;
    --vw-color-heading-soft: #25384d;
    --vw-color-text: #4e5d6c;
    --vw-color-text-soft: #536477;
    --vw-color-muted: #748293;
    --vw-color-background: #e2edf7;
    --vw-color-surface: #fff;
    --vw-color-field: #f6fafd;
    --vw-color-border: #e3eaf1;
    --vw-color-border-accent: #d1e6f4;
    --vw-shadow-card: 0 18px 46px rgb(16 24 39 / 6%);
    --vw-shadow-card-hover: 0 28px 66px rgb(16 24 39 / 11%);
    --vw-shadow-cta: 0 14px 30px rgb(8 123 211 / 20%);
    --vw-shadow-cta-hover: 0 18px 38px rgb(8 123 211 / 28%);
    --vw-shadow-contact: 0 20px 50px rgb(29 65 99 / 8%);
    --vw-ease-enter: cubic-bezier(0.22, 0.61, 0.36, 1);
    --vw-ease-soft: cubic-bezier(0.22, 1, 0.36, 1);
    --vw-color-surface-soft: #f9fcfe;
    --vw-color-border-strong: #d5dee8;
    --vw-ease-luxury: cubic-bezier(0.16, 1, 0.3, 1);
}

/* GEMEINSAME BASIS */

.vw-home, .vw-home *, .vw-home-cta, .vw-home-cta *, .vwl-services, .vwl-services *, .vwfaq, .vwfaq *, .vabout3, .vabout3 * {
    box-sizing: border-box;
}
.vw-button,
.vw-home-cta__button,
.vwl-contact__button,
.vwfaq__contact-button,
.vabout3__button,
.vabout3__contact-button,
.vabout3__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    text-decoration: none !important;
}
.vw-home-cta__button-arrow,
.vwl-contact__arrow,
.vwfaq__contact-arrow,
.vabout3__button > span:last-child,
.vabout3__contact-button > span:last-child,
.vabout3__link > span:last-child {
    line-height: 1;
    transition: transform 180ms ease;
}
.vw-home-cta__button:hover .vw-home-cta__button-arrow,
.vw-home-cta__button:focus-visible .vw-home-cta__button-arrow,
.vwl-contact__button:hover .vwl-contact__arrow,
.vwl-contact__button:focus-visible .vwl-contact__arrow,
.vwfaq__contact-button:hover .vwfaq__contact-arrow,
.vwfaq__contact-button:focus-visible .vwfaq__contact-arrow,
.vabout3__button:hover > span:last-child,
.vabout3__button:focus-visible > span:last-child,
.vabout3__contact-button:hover > span:last-child,
.vabout3__contact-button:focus-visible > span:last-child,
.vabout3__link:hover > span:last-child,
.vabout3__link:focus-visible > span:last-child {
    transform: translateX(4px);
}

/* GEMEINSAME KOMPONENTEN */

.vwl-services, .vwfaq { width: 100%; margin: 0; color: var(--vw-color-heading); font-family: inherit; }
.vwl-services__section, .vwfaq {
    background: radial-gradient(circle at 6% 5%, rgb(8 123 211 / 6.5%), transparent 24%), var(--vw-color-background);
}
.vwl-services__shell, .vwfaq__shell { width: 100%; margin: 0; }
.vw-info-card, .vw-service-card, .vwl-services .vwl-card, .vwfaq__item, .vabout3__value {
    position: relative;
    border: 1px solid var(--vw-color-border);
    overflow: hidden;
    transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}
.vw-info-card::before, .vw-service-card::before, .vwl-card::before, .vwfaq__item::before, .vabout3__value::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 4px;
    content: "";
    transform-origin: left;
}
.vw-info-card:hover::before,
.vw-service-card:hover::before,
.vwl-card:hover::before,
.vwfaq__item[open]::before,
.vabout3__value:hover::before {
    transform: scaleX(1);
}
.vw-info-card__number,
.vw-service-card__icon,
.vw-process-card__number,
.vwa-about-feature__icon,
.vwa-about-info-row__icon,
.vwl-card__number,
.vwl-card__icon,
.vwfaq__number,
.vwfaq__toggle,
.vabout3__study-icon,
.vabout3__value-number,
.vw-contact-step-number,
.vw-contact-response-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.vwl-card.vwl-card-enter, .vwfaq__item.vwfaq-item-enter, .vabout3__value.vabout3-value-visible {
    transform-origin: center bottom;
    backface-visibility: hidden;
    will-change: opacity, transform;
}
.vwl-contact.vwl-contact-enter, .vwfaq__contact.vwfaq-contact-enter {
    transition: opacity 1400ms var(--vw-ease-enter), transform 1650ms var(--vw-ease-enter);
    will-change: opacity, transform;
}
.vwl-contact.vwl-contact-enter.vwl-contact-enter--visible {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
}
.vwl-contact.vwl-contact-enter.vwl-contact-enter--visible .vwl-contact__content,
.vwl-contact.vwl-contact-enter.vwl-contact-enter--visible .vwl-contact__button {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}
.vwl-contact.vwl-contact-enter.vwl-contact-enter--visible .vwl-contact__button:hover,
.vwl-contact.vwl-contact-enter.vwl-contact-enter--visible .vwl-contact__button:focus-visible {
    transform: translateY(-3px);
}
.vw-home { --vw-page-edge: clamp(72px, 6vw, 118px); font-family: inherit; }
.vw-home img { display: block; max-width: 100%; }

/* 03 – HEADER */

.main-navigation .primary-menu-container > ul > li.menu-item > a { position: relative; transition: color 200ms ease; }
.main-navigation .primary-menu-container > ul > li.menu-item > a:hover,
.main-navigation .primary-menu-container > ul > li.current-menu-item > a {
    color: var(--vw-color-primary) !important;
}
.main-navigation .primary-menu-container > ul > li.menu-item > a::after {
    position: absolute;
    right: 18px;
    bottom: 14px;
    left: 18px;
    height: 2px;
    border-radius: 999px;
    background: var(--vw-color-primary);
    content: "";
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 250ms ease;
}
.main-navigation .primary-menu-container > ul > li.menu-item > a:hover::after,
.main-navigation .primary-menu-container > ul > li.current-menu-item > a::after {
    transform: scaleX(1);
}

/* 09 – FOOTER */

.site-footer, .site-footer-wrap, .site-middle-footer-wrap, .site-middle-footer-wrap .site-footer-row-container-inner {
    background: #111827 !important;
}
.site-footer { font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important; }
.site-middle-footer-wrap, .site-middle-footer-wrap .site-footer-row-container-inner {
    min-height: auto !important;
    padding-top: 42px !important;
    padding-bottom: 34px !important;
}
.site-middle-footer-inner-wrap, .site-middle-footer-wrap .site-container {
    max-width: 1240px !important;
    margin-inline: auto !important;
}
.site-middle-footer-inner-wrap .site-footer-row { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
.site-middle-footer-inner-wrap .site-footer-section {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
}
.site-middle-footer-inner-wrap .site-footer-section > * {
    width: 100% !important;
    max-width: 330px !important;
    margin-inline: 0 !important;
}
.site-middle-footer-inner-wrap .widget, .site-middle-footer-inner-wrap .widget * { text-align: left !important; }
.site-footer, .site-footer p, .site-footer li, .site-footer span, .site-footer div { color: #d1d5db !important; }
.varga-footer-brand strong, .varga-footer-links strong, .site-footer strong {
    display: block !important;
    margin-bottom: 12px !important;
    color: var(--vw-color-surface) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.varga-footer-brand p {
    max-width: 330px;
    margin: 0 !important;
    color: #d1d5db !important;
    font-size: 14.5px !important;
    line-height: 1.65 !important;
}
.varga-footer-links { display: flex !important; flex-direction: column !important; gap: 7px !important; }
.varga-footer-links a, .site-footer a {
    display: block;
    color: #d1d5db !important;
    font-size: 14.5px !important;
    line-height: 1.55 !important;
    text-decoration: none !important;
    transition: color 200ms ease;
}
.varga-footer-links a:hover, .site-footer a:hover { color: #3b9cff !important; }
.site-footer .widget { margin-bottom: 0 !important; }
.site-bottom-footer-wrap, .site-bottom-footer-wrap .site-footer-row-container-inner {
    min-height: auto !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    color: #9ca3af !important;
    background: #0b1220 !important;
}
.site-bottom-footer-wrap, .site-bottom-footer-wrap p, .site-bottom-footer-wrap span, .site-bottom-footer-wrap a {
    color: #9ca3af !important;
    font-size: 13.5px !important;
    text-align: center !important;
}

/* 10 – ANIMATIONEN */

@keyframes vwFadeUp {
    from { opacity: 0; transform: translateY(24px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes vwFadeInVisual {
    from { opacity: 0; transform: translateX(28px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes vwCtaCircle {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(-18px, 14px, 0); }
}
.vw-scroll-reveal {
    opacity: 0;
    filter: blur(7px);
    transform: translate3d(0, 30px, 0);
    transition: opacity 850ms var(--vw-ease-soft), transform 950ms var(--vw-ease-soft), filter 850ms var(--vw-ease-soft);
    transition-delay: var(--vw-reveal-delay, 0ms);
    will-change: opacity, transform, filter;
}
.vw-scroll-reveal.vw-is-visible { opacity: 1; filter: blur(0); transform: translate3d(0, 0, 0); }
.vw-info-card.vw-scroll-reveal,
.vw-service-card.vw-scroll-reveal,
.vw-process-card.vw-scroll-reveal,
.vwa-about-visual.vw-scroll-reveal {
    filter: blur(4px);
    transform: translate3d(0, 22px, 0);
}
.vw-info-card.vw-scroll-reveal.vw-is-visible,
.vw-service-card.vw-scroll-reveal.vw-is-visible,
.vw-process-card.vw-scroll-reveal.vw-is-visible,
.vwa-about-visual.vw-scroll-reveal.vw-is-visible {
    filter: blur(0);
    transform: translate3d(0, 0, 0);
}

/* GEMEINSAMER CTA: LEISTUNGEN & FAQ */

.vwl-contact, .vwfaq__contact {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 42px;
    margin-top: clamp(46px, 5vw, 72px);
    padding: clamp(34px, 3.5vw, 50px) clamp(30px, 4vw, 58px);
    border: 1px solid rgb(8 123 211 / 14%);
    border-radius: 20px;
    background: radial-gradient(circle at 10% 30%, rgb(8 123 211 / 7.5%), transparent 31%), linear-gradient(135deg, var(--vw-color-primary-soft) 0%, var(--vw-color-surface) 72%);
    box-shadow: var(--vw-shadow-card);
}
.vwl-contact__content, .vwfaq__contact-content { min-width: 0; }
.vwl-contact__eyebrow, .vwfaq__contact-eyebrow {
    margin: 0 0 17px !important;
    color: var(--vw-color-primary);
    font-size: 11px;
    font-weight: 800;
    line-height: 1.4;
    letter-spacing: 1.8px;
    text-transform: uppercase;
}
.vwl-contact__title, .vwfaq__contact-title {
    margin: 0 !important;
    color: var(--vw-color-heading);
    font-size: clamp(28px, 2.25vw, 40px);
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -0.035em;
}
.vwl-contact__text, .vwfaq__contact-text {
    max-width: 760px;
    margin: 14px 0 0 !important;
    color: var(--vw-color-text);
    font-size: 16px;
    line-height: 1.65;
}
.vwl-contact__button, .vwfaq__contact-button {
    min-height: 56px;
    gap: 16px;
    padding: 15px 24px;
    border: 1px solid transparent;
    border-radius: 9px;
    background: var(--vw-color-primary);
    color: var(--vw-color-surface) !important;
    box-shadow: var(--vw-shadow-cta);
    font-size: 15px;
    font-weight: 800;
    line-height: 1.3;
    white-space: nowrap;
    transition: transform 180ms ease, background-color 180ms ease, box-shadow 180ms ease;
}
.vwl-contact__arrow, .vwfaq__contact-arrow { font-size: 19px; }
.vwl-contact__button:hover,
.vwl-contact__button:focus-visible,
.vwfaq__contact-button:hover,
.vwfaq__contact-button:focus-visible {
    background: var(--vw-color-primary-dark);
    color: var(--vw-color-surface) !important;
    box-shadow: var(--vw-shadow-cta-hover);
    transform: translateY(-3px);
}
.vwl-contact__button:focus-visible, .vwfaq__contact-button:focus-visible {
    outline: 3px solid rgb(8 123 211 / 22%);
    outline-offset: 4px;
}
/* =========================================
   RECHTLICHE SEITEN – GLOBALER HINTERGRUND
========================================= */

body:has(.vw-imprint) #primary,
body:has(.vw-imprint) .content-area,
body:has(.vw-imprint) .site-main,
body:has(.vw-imprint) .entry-content,
body:has(.vw-imprint) .entry-content-wrap,

body:has(.vw-privacy) #primary,
body:has(.vw-privacy) .content-area,
body:has(.vw-privacy) .site-main,
body:has(.vw-privacy) .entry-content,
body:has(.vw-privacy) .entry-content-wrap {
    background-color: var(--vw-color-background) !important;
    background-image: none !important;
}
/* Verhindert seitliches Springen beim Seitenwechsel */
html {
    scrollbar-gutter: stable;
}

/* Responsive Regeln liegen zentral in assets/css/responsive.css. */
