/* Leoas custom overrides */

/* Contact form alerts */
.contact-form-alert { padding:12px 16px; border-radius:8px; margin-bottom:16px; font-size:14px; }
.contact-form-alert.success { background:#dcfce7; color:#15803d; }
.contact-form-alert.error   { background:#fee2e2; color:#b91c1c; }

/* Language switcher button */
.tj-lang-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid currentColor;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: inherit;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
}
.tj-lang-btn:hover {
    background: var(--tj-color-theme-primary, #191959);
    color: #fff;
    border-color: transparent;
}

/* Coming soon placeholder */
.coming-soon-text {
    opacity: 0.5;
    font-style: italic;
    font-size: 14px;
}

/* Product sidebar widget */
.sidebar-widget {
    background: #f8f8f8;
    border-radius: 8px;
    padding: 24px;
    margin-bottom: 24px;
}
.sidebar-widget .widget-title {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 2px solid #e0e0e0;
}
.sidebar-widget.widget-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.sidebar-widget.widget-nav ul li {
    border-bottom: 1px solid #e8e8e8;
}
.sidebar-widget.widget-nav ul li:last-child {
    border-bottom: none;
}
.sidebar-widget.widget-nav ul li a {
    display: flex;
    align-items: center;
    padding: 10px 0;
    color: inherit;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s;
}
.sidebar-widget.widget-nav ul li a:hover,
.sidebar-widget.widget-nav ul li.active a {
    color: var(--tj-color-theme-primary, #191959);
}

/* Service feature list */
.service-feature-list {
    list-style: none;
    padding: 0;
}
.service-feature-list li {
    padding: 8px 0;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
.service-feature-list li i {
    color: var(--tj-color-theme-primary, #191959);
    margin-top: 3px;
    flex-shrink: 0;
}

/* Fix WOW.js + GSAP ScrollSmoother incompatibility:
   WOW.js hides .wow elements until scroll-detection fires, but ScrollSmoother
   intercepts scroll events so below-fold elements stay hidden.
   Force visibility and let CSS keyframe animations handle the fade-in. */
.wow {
  visibility: visible !important;
}

/* Footer — remove the large top-padding reserved for overlapping CTA sections */
.tj-footer-section {
    padding-top: 0 !important;
}

/* Footer contact widget — remove the 76px left-indent so it aligns with other columns */
.tj-footer-section .widget-contact {
    padding-inline-start: 0 !important;
}

/* Footer contact widget — title & link colors match the light-background footer theme */
.tj-footer-section .widget-contact .title,
.tj-footer-section .footer-contact-info .contact-item a {
    color: var(--tj-color-heading-primary) !important;
}
.tj-footer-section .footer-contact-info .contact-item a:hover {
    color: var(--tj-color-theme-primary) !important;
}

/* Footer contact subtitle labels (Telefon / E-posta) */
.tj-footer-section .footer-contact-info .contact-item span.subtitle {
    color: var(--tj-color-text-body);
    font-size: 13px;
    display: block;
    margin-bottom: 2px;
}

/* Marquee Section (homepage, between hero and applications) */
.leoas-marquee-section {
    position: relative;
    margin-top: 80px;
    padding: 48px 0;
    background: #306095;
    overflow: hidden;
    z-index: 1;
}
@media (max-width: 991px) {
    .leoas-marquee-section { margin-top: 48px; }
}
/* Background pattern shapes (footer style) */
.leoas-marquee-section .bg-shape-1,
.leoas-marquee-section .bg-shape-2 {
    position: absolute;
    top: 0;
    inset-inline-start: 0;
    max-width: 370px;
    width: 100%;
    z-index: -1;
    mix-blend-mode: overlay;
    opacity: 0.4;
    pointer-events: none;
}
.leoas-marquee-section .bg-shape-2 {
    top: inherit;
    inset-inline-start: inherit;
    bottom: 0;
    inset-inline-end: 0;
}
.leoas-marquee-section .footer-marquee {
    border-top: 1px dashed rgba(255, 255, 255, 0.3);
    border-bottom: 1px dashed rgba(255, 255, 255, 0.3);
    padding: 18px 0;
}
/* White text-stroke for visibility on dark blue background */
.leoas-marquee-section .marquee-item .marquee-text {
    -webkit-text-stroke: 2px var(--tj-color-common-white, #fff);
    -webkit-text-fill-color: transparent;
    font-size: 96px;
    opacity: 0.45;
    transition: opacity 0.3s;
}
.leoas-marquee-section .marquee-item .marquee-text:hover {
    opacity: 0.95;
}
/* Marquee images: larger than the text and offset upward */
.leoas-marquee-section .marquee-item .marquee-img {
    height: 130px;
    top: 0;
    align-self: center;
    border-radius: 0;
    box-shadow: none;
}
@media (max-width: 991px) {
    .leoas-marquee-section .marquee-item .marquee-img { height: 88px; }
}
@media (max-width: 575px) {
    .leoas-marquee-section .marquee-item .marquee-img { height: 60px; }
}
@media (max-width: 991px) {
    .leoas-marquee-section .marquee-item .marquee-text { font-size: 64px; }
}
@media (max-width: 575px) {
    .leoas-marquee-section .marquee-item .marquee-text {
        font-size: 44px;
        -webkit-text-stroke: 1px var(--tj-color-common-white, #fff);
    }
}

/* Applications Section */
.tj-applications-section {
    background: #f5f8fc;
}

.leoas-app-card {
    background: #fff;
    border-radius: 12px;
    padding: 24px 20px;
    border: 1px solid #e4eaf3;
    display: flex;
    align-items: flex-start;
    gap: 18px;
    height: 100%;
    transition: box-shadow 0.25s, transform 0.25s;
}
.leoas-app-card:hover {
    box-shadow: 0 8px 28px rgba(48, 96, 149, 0.13);
    transform: translateY(-3px);
}
.app-card-icon {
    flex-shrink: 0;
    width: 72px;
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #edf2fa;
    border-radius: 10px;
    padding: 8px;
}
.app-card-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.app-card-content {
    flex: 1;
    min-width: 0;
}
.app-card-title {
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 8px;
    color: var(--tj-color-heading-primary, #0d1a2b);
    line-height: 1.4;
}
.app-card-desc {
    font-size: 13px;
    line-height: 1.6;
    color: var(--tj-color-text-body, #555);
    margin: 0;
}

/* Products listing — light card grid.
   The template's .tj-service-section is dark and only styles .service-item.style-1
   (an image-overlay card). products.php uses plain .tj-service-item markup, so no
   card styling applied and the title/desc rendered dark-on-dark (invisible).
   Override to a legible light card grid matching the rest of the site. */
.leoas-products-section {
    background-color: #f5f8fc !important;
    border-radius: 0 !important;
}
.leoas-products-section .tj-service-item {
    position: relative;
    height: 100%;
    background: #fff;
    border: 1px solid #e4eaf3;
    border-radius: 12px;
    padding: 32px 28px;
    transition: box-shadow 0.25s, transform 0.25s;
}
.leoas-products-section .tj-service-item:hover {
    box-shadow: 0 10px 30px rgba(48, 96, 149, 0.13);
    transform: translateY(-4px);
}
.leoas-products-section .service-icon {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #edf2fa;
    border-radius: 10px;
    color: var(--tj-color-theme-primary, #306095);
    font-size: 30px;
    margin-bottom: 20px;
}
/* Product photo (from the homepage marquee) in the top-left of each card */
.leoas-products-section .service-icon.has-img {
    width: 84px;
    height: 84px;
    padding: 8px;
    overflow: hidden;
}
.leoas-products-section .service-icon.has-img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.leoas-products-section .service-content .title {
    font-size: 20px;
    margin-bottom: 12px;
}
.leoas-products-section .service-content .title a {
    color: var(--tj-color-heading-primary, #0d1a2b);
    transition: color 0.2s;
}
.leoas-products-section .service-content .title a:hover {
    color: var(--tj-color-theme-primary, #306095);
}
.leoas-products-section .service-content p {
    color: var(--tj-color-text-body, #555);
    font-size: 14px;
    line-height: 1.65;
    margin: 0;
}
.leoas-products-section .service-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    margin-top: 20px;
    border-radius: 50%;
    background: var(--tj-color-theme-primary, #306095);
    color: #fff;
    transition: background 0.2s, transform 0.2s;
}
.leoas-products-section .service-link:hover {
    background: #244b76;
    transform: translateY(-2px);
}

/* Breadcrumb section */
.tj-breadcrumb-section {
    padding-top: 80px;
    padding-bottom: 60px;
    background: #f8f8f8;
}
.tj-breadcrumb-section .title {
    font-size: clamp(28px, 5vw, 48px);
    margin-bottom: 16px;
}
.breadcrumb {
    background: transparent;
    padding: 0;
}
.breadcrumb-item + .breadcrumb-item::before {
    content: "/";
}

/* ── Catalog flipbook ──────────────────────────────────────────────── */
.tj-catalog-section { background: #eef2f7; }

.flipbook-toolbar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-bottom: 28px;
    flex-wrap: wrap;
}
.flipbook-nav {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: none;
    background: var(--tj-color-theme-primary, #306095);
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    transition: background 0.2s, transform 0.2s;
}
.flipbook-nav:hover { background: #244b76; transform: translateY(-2px); }
.flipbook-page-indicator {
    min-width: 70px;
    text-align: center;
    font-weight: 600;
    color: var(--tj-color-heading-primary, #0d1a2b);
}
.flipbook-download {
    margin-inline-start: 8px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border-radius: 6px;
    background: #fff;
    border: 1px solid #d4ddea;
    color: var(--tj-color-theme-primary, #306095);
    font-weight: 600;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
}
.flipbook-download:hover {
    background: var(--tj-color-theme-primary, #306095);
    color: #fff;
    border-color: transparent;
}

.flipbook-stage {
    position: relative;
    min-height: 480px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.flipbook {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
}
.flipbook .stf__parent { margin: 0 auto; }
.flipbook .page img {
    width: 100%;
    height: 100%;
    display: block;
}

.flipbook-loader {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    color: var(--tj-color-text-body, #555);
}
.flipbook-loader .spinner {
    width: 38px;
    height: 38px;
    border: 3px solid #cfd9e6;
    border-top-color: var(--tj-color-theme-primary, #306095);
    border-radius: 50%;
    animation: fb-spin 0.8s linear infinite;
}
@keyframes fb-spin { to { transform: rotate(360deg); } }

@media (max-width: 575px) {
    .flipbook-stage { min-height: 360px; }
}