/*
Theme Name: hello-elementor-child
Template: hello-elementor
Text Domain: hello-elementor-child
Version: 1.0.0
Description: Custom child theme for hello-elementor adding orchestrated scroll-reveal transitions.
*/

/* ------------------------------------------------------------------
   Scroll reveal
   Base state is the FINAL visible state (progressive enhancement).
   Elements are hidden only when html.sr-js is present, which
   scroll-reveal.js adds. No JS = everything visible, no motion.
   ------------------------------------------------------------------ */

.sr,
.sr-group .sr-item {
    opacity: 1;
    transform: none;
    transition: opacity 0.7s cubic-bezier(0.22, 0.61, 0.36, 1),
        transform 0.7s cubic-bezier(0.22, 0.61, 0.36, 1) !important;
    transition-delay: var(--sr-delay, 0s);
    will-change: opacity, transform;
}

html.sr-js body .sr:not(.is-visible),
html.sr-js body .sr-group .sr-item:not(.is-visible) {
    opacity: 0;
    transform: translateY(36px) !important;
}

@media (prefers-reduced-motion: reduce) {
    .sr,
    .sr-group .sr-item {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}

/* ------------------------------------------------------------------
   Floating header
   At the top the bar sits flat; as soon as the page is scrolled (body
   gets .hdr-scrolled) the bar transitions into an elevated floating bar
   that hovers over the content: a soft shadow, a translucent frosted
   background picking up the blur, and a slightly more compact height.
   ------------------------------------------------------------------ */
header .elementor-sticky--active {
    transition: background-color 0.4s ease, box-shadow 0.4s ease,
        border-radius 0.4s ease, top 0.45s ease,
        backdrop-filter 0.45s ease, -webkit-backdrop-filter 0.45s ease;
}

header .e-con-inner {
    transition: padding 0.45s ease;
}

body.hdr-scrolled header .elementor-sticky--active {
    left: 0 !important;
    right: 0 !important;
    top: 16px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: fit-content !important;
    max-width: calc(100% - 32px);
    padding-left: 26px;
    padding-right: 26px;
    border-radius: 999px !important;
    background-color: rgba(245, 245, 245, 0.9) !important;
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.14);
}

body.hdr-scrolled header .e-con-inner {
    padding-top: 10px;
    padding-bottom: 10px;
}

@media (prefers-reduced-motion: reduce) {
    header .elementor-sticky--active,
    header .e-con-inner {
        transition: none;
    }
}

/* ------------------------------------------------------------------
   Footer nav strip (Anasayfa / Kurumsal / Hizmetler …)
   Each label is its own icon-list widget and each " / " is its own
   text-editor widget. The row stretched the "/" boxes, which knocked
   them off the labels' line — force vertical centering so every label
   and separator sits on the same level.
   ------------------------------------------------------------------ */
body .elementor-element-1e37541e {
    align-items: center !important;
}

body .elementor-element-1e37541e .elementor-widget-text-editor {
    align-self: center !important;
    line-height: 1;
}

body .elementor-element-1e37541e .elementor-widget-text-editor p {
    margin: 0;
    line-height: 1;
}

/* Mobile: center the hero's "Verileri" heading within its own full-width row
   so it matches the centred “Karmaşık” / “Stratejik…” words around it. */
@media (max-width: 767px) {
    body .elementor-element-465a440d {
        justify-content: center !important;
    }
}