/* ENCAP site-wide motion system — native CSS, no animation framework. */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: encap-site-page-out 180ms ease both; }
::view-transition-new(root) { animation: encap-site-page-in 420ms cubic-bezier(.2, .72, .18, 1) both; }
@keyframes encap-site-page-out { to { opacity: 0; transform: translateY(-6px); } }
@keyframes encap-site-page-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

.site-scroll-progress {
    position: fixed; z-index: 9999; inset-block-start: 0; inset-inline-start: 0;
    width: 100%; height: 3px; pointer-events: none;
    background: linear-gradient(90deg, #d4b24a 0%, #a4bf83 46%, #e8dca4 100%);
    transform: scaleX(var(--site-scroll-progress, 0)); transform-origin: left center;
    box-shadow: 0 0 12px rgba(195, 170, 84, .22); will-change: transform;
}
html[dir="rtl"] .site-scroll-progress { transform-origin: right center; }
html.site-motion-ready { scroll-behavior: smooth; }
body.site-body.site-motion-ready .primary-header { animation: encap-site-header-arrive 560ms cubic-bezier(.2, .7, .2, 1) both; }
@keyframes encap-site-header-arrive { from { opacity: 0; translate: 0 -10px; } to { opacity: 1; translate: 0 0; } }

html.has-site-motion .site-motion-reveal:not(.is-in-view) { opacity: 0; translate: 0 30px; filter: blur(2px); }
.site-motion-reveal {
    transition: opacity 780ms cubic-bezier(.2, .7, .2, 1), translate 820ms cubic-bezier(.2, .7, .2, 1), filter 780ms ease;
    transition-delay: var(--site-motion-delay, 0ms);
}
html.has-site-motion .site-motion-reveal.is-in-view { opacity: 1; translate: 0 0; filter: blur(0); }

/* Oversized line-work moves slowly behind page headings and callouts. */
.page-head::after { transform-origin: center; animation: encap-site-orbit-drift 38s linear infinite; }
.feature-panel::after, .dark-feature::after, .cta::after { transform-origin: center; animation: encap-site-orbit-drift 46s linear infinite; }
@keyframes encap-site-orbit-drift {
    0% { transform: rotate(0deg) scale(1); }
    50% { transform: rotate(180deg) scale(1.025); }
    100% { transform: rotate(360deg) scale(1); }
}

/* Desktop cards use true perspective and limited pointer tilt, with no layout movement. */
html.site-motion-ready body.site-body .site-motion-tilt {
    transform: perspective(1150px) rotateX(var(--site-tilt-x, 0deg)) rotateY(var(--site-tilt-y, 0deg)) translateY(var(--site-lift, 0px));
    transform-style: preserve-3d; backface-visibility: hidden;
    transition: transform 440ms cubic-bezier(.2, .72, .18, 1), box-shadow 440ms cubic-bezier(.2, .72, .18, 1), border-color 260ms ease, opacity 820ms cubic-bezier(.2, .7, .2, 1), translate 880ms cubic-bezier(.2, .7, .2, 1), filter 820ms ease;
    will-change: transform;
}
html.site-motion-ready body.site-body .site-motion-tilt:hover { --site-lift: -5px; }
html.site-motion-ready body.site-body .site-motion-tilt .category-index,
html.site-motion-ready body.site-body .site-motion-tilt .encap-product-count,
html.site-motion-ready body.site-body .site-motion-tilt .encap-service-number,
html.site-motion-ready body.site-body .site-motion-tilt .encap-principle-index { transform: translateZ(18px); }

/* Separate child depth makes the interaction read as 3D instead of a flat card rotation. */
html.site-motion-ready body.site-body .encap-process-row.site-motion-tilt .encap-process-num,
html.site-motion-ready body.site-body .encap-process-row.site-motion-tilt .encap-process-icon,
html.site-motion-ready body.site-body .encap-process-row.site-motion-tilt .encap-process-arrow { translate: 0 0 14px; }
html.site-motion-ready body.site-body .encap-story-art.site-motion-tilt .encap-story-caption { translate: 0 0 18px; }

/* Independent translate/scale properties preserve existing image hover zoom and cropping. */
.site-motion-photo { scale: 1.035; translate: 0 var(--site-photo-offset, 0px); transition: filter 450ms ease; transform-origin: center; backface-visibility: hidden; will-change: translate; }
.category:hover .site-motion-photo, .encap-product-card:hover .site-motion-photo,
.encap-service-card:hover .site-motion-photo, .gallery-card:hover .site-motion-photo,
.product-gallery-thumb:hover .site-motion-photo { filter: saturate(1.08) contrast(1.02); }
.site-motion-magnetic { translate: var(--site-magnet-x, 0px) var(--site-magnet-y, 0px); transition: translate 220ms cubic-bezier(.2, .7, .2, 1); }

.primary-dropdown-panel, .language-menu, .primary-mobile-panel { transform-origin: top center; }
.primary-dropdown[open] > .primary-dropdown-panel { animation: encap-site-menu-in 220ms cubic-bezier(.2, .7, .2, 1) both; }
@keyframes encap-site-menu-in { from { opacity: 0; translate: 0 -5px; scale: .985; } to { opacity: 1; translate: 0 0; scale: 1; } }
.footer-links a { transition: color 220ms ease, translate 220ms ease; }
.footer-links a:hover { translate: 4px 0; }
html[dir="rtl"] .footer-links a:hover { translate: -4px 0; }

@media (max-width: 760px) {
    .site-scroll-progress { height: 2px; }
    .site-motion-photo { scale: 1.015; will-change: auto; }
    html.site-motion-ready body.site-body .site-motion-tilt { transform: none; transition: box-shadow 260ms ease, border-color 260ms ease; will-change: auto; }
    html.site-motion-ready body.site-body .site-motion-tilt:hover { --site-lift: 0px; }
    .site-motion-reveal { transition-duration: 650ms; }
    .page-head::after { animation-duration: 54s; }
}
@media (prefers-reduced-motion: reduce) {
    ::view-transition-old(root), ::view-transition-new(root) { animation: none !important; }
    html, html.site-motion-ready { scroll-behavior: auto !important; }
    .site-scroll-progress { box-shadow: none; }
    body.site-body.site-motion-ready .primary-header, .page-head::after, .feature-panel::after, .dark-feature::after, .cta::after,
    .primary-dropdown[open] > .primary-dropdown-panel { animation: none !important; }
    html.has-site-motion .site-motion-reveal, html.has-site-motion .site-motion-reveal:not(.is-in-view) {
        opacity: 1 !important; translate: none !important; filter: none !important; transition: none !important;
    }
    html.has-reveal .reveal-on-scroll, html.has-reveal .reveal-on-scroll:not(.site-motion-tilt), html.has-reveal .reveal-on-scroll.is-visible {
        opacity: 1 !important; transform: none !important; translate: none !important; filter: none !important; transition: none !important;
    }
    .site-motion-tilt { transform: none !important; transition: none !important; will-change: auto !important; }
    .site-motion-photo { scale: none !important; translate: none !important; will-change: auto !important; }
    .site-motion-magnetic, .footer-links a:hover { translate: none !important; transition: none !important; }
}



/* Product detail gallery: one clear primary image with a single horizontal thumbnail rail. */
.product-detail-media{min-width:0;max-width:100%}
.product-gallery-main{position:relative;isolation:isolate;aspect-ratio:1.16/1;min-height:0;overflow:hidden;border-radius:5px 42px 5px 5px;background:#e9ecde}
.product-gallery-main img{position:absolute;inset:0;display:block;width:100%;height:100%;min-height:0;object-fit:cover;object-position:center;transition:transform .6s cubic-bezier(.2,.65,.2,1),opacity .22s ease}
.product-gallery-main:hover img{transform:scale(1.015)}
.product-gallery-main img.is-gallery-changing{animation:productGalleryReveal .32s ease both}
.product-gallery-counter{position:absolute;inset-inline-end:16px;inset-block-end:16px;z-index:2;display:inline-flex;align-items:center;justify-content:center;min-width:58px;min-height:34px;padding:7px 12px;border:1px solid #ffffff70;border-radius:3px;background:#112f22d9;color:#fff;font-size:11px;font-weight:850;letter-spacing:.08em;direction:ltr;backdrop-filter:blur(10px)}
.product-gallery-meta{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:24px}
.product-gallery-meta>div{display:grid;gap:4px}
.product-gallery-meta>div>span{color:var(--encap-muted,#6e7e70);font-size:9px;font-weight:850;letter-spacing:.13em;text-transform:uppercase}
.product-gallery-meta>div>strong{color:var(--encap-green,#284b38);font:500 clamp(20px,2.5vw,27px)/1.2 Georgia,'Times New Roman',serif}
.product-gallery-total{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-height:31px;padding:6px 10px;border:1px solid #dce4d5;background:#f7f8f2;color:#425b45;font-size:10px;font-weight:800;white-space:nowrap}
.product-gallery-thumbs{display:flex;align-items:stretch;gap:10px;width:100%;margin-top:15px;padding:3px 2px 12px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-inline:contain;scrollbar-width:thin;scrollbar-color:#aab99f #eef0e8}
.product-gallery-thumb{position:relative;display:block;flex:0 0 clamp(82px,16%,120px);min-width:0;aspect-ratio:1.12/1;height:auto;padding:0;overflow:hidden;border:2px solid transparent;border-radius:3px;background:#e8ecdf;cursor:pointer;scroll-snap-align:start;opacity:.78;transition:border-color .2s,opacity .2s,transform .2s,box-shadow .2s}
.product-gallery-thumb img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .3s}
.product-gallery-thumb:hover{opacity:1;transform:translateY(-2px)}
.product-gallery-thumb:hover img{transform:scale(1.04)}
.product-gallery-thumb[aria-pressed=true]{opacity:1;border-color:var(--encap-green,#284b38);box-shadow:0 0 0 2px rgba(40,75,56,.13)}
.product-gallery-thumb-index{position:absolute;inset-inline-end:5px;inset-block-end:5px;display:grid;place-items:center;min-width:23px;height:21px;padding:0 4px;background:#132e22dc;color:#fff;font-size:9px;font-weight:850;letter-spacing:.03em}
.product-gallery-hint{margin:0;color:var(--encap-muted,#6e7e70);font-size:10px;line-height:1.6}
@keyframes productGalleryReveal{from{opacity:.65;transform:scale(1.005)}to{opacity:1;transform:scale(1)}}
@media(max-width:760px){
 .product-gallery-main{aspect-ratio:1.12/1;border-radius:4px 28px 4px 4px}
 .product-gallery-meta{margin-top:18px}
 .product-gallery-meta>div>strong{font-size:22px}
 .product-gallery-thumb{flex-basis:clamp(76px,22vw,108px)}
}
@media(max-width:420px){
 .product-gallery-counter{inset-inline-end:10px;inset-block-end:10px;min-height:30px;font-size:10px}
 .product-gallery-thumbs{gap:8px;margin-top:11px}
 .product-gallery-total{font-size:9px;padding-inline:7px}
}
@media(prefers-reduced-motion:reduce){
 .product-gallery-main img,.product-gallery-thumb,.product-gallery-thumb img{transition:none!important;animation:none!important}
 .product-gallery-main:hover img,.product-gallery-thumb:hover,.product-gallery-thumb:hover img{transform:none!important}
}