/* SECURIX Frontend Core v28 — Swiper integration only. */
:root{--sx-swiper-accent:#e99b19;--sx-swiper-ink:#17191d}

/* Home hero */
.home-hero-slider{position:relative;width:100%;margin:8px 0 0;overflow:hidden;border-radius:22px;background:#081017;box-shadow:0 10px 28px rgba(16,24,40,.05)}
.home-hero-swiper{width:100%;overflow:hidden}
.home-hero-slide{width:100%;height:auto;background:#081017}
.home-hero-slide>a,.home-hero-slide picture,.home-hero-slide img{display:block;width:100%;height:100%}
.home-hero-slide>a{aspect-ratio:1920/560;overflow:hidden}
.home-hero-slide img{object-fit:contain;object-position:center;background:#081017}
.home-hero-nav{position:absolute;z-index:12;top:50%;display:grid;width:42px;height:42px;margin-top:-21px;place-items:center;border:1px solid rgba(255,255,255,.55);border-radius:50%;background:rgba(255,255,255,.88);color:#17191d;box-shadow:0 8px 24px rgba(0,0,0,.12);backdrop-filter:blur(10px);cursor:pointer;transition:opacity .18s,transform .18s,background .18s}
.home-hero-nav:hover{background:#fff;transform:scale(1.04)}
.home-hero-nav.swiper-button-disabled{opacity:.35;pointer-events:none}
.home-hero-prev{left:14px}.home-hero-next{right:14px}
.home-hero-prev svg{transform:rotate(180deg)}
.home-hero-nav svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9}
.home-hero-pagination{position:absolute!important;z-index:12!important;left:50%!important;bottom:13px!important;width:auto!important;transform:translateX(-50%);display:flex;gap:7px;padding:6px 8px;border-radius:99px;background:rgba(7,12,18,.34);backdrop-filter:blur(8px)}
.home-hero-pagination .swiper-pagination-bullet{width:7px;height:7px;margin:0!important;background:#fff;opacity:.42}
.home-hero-pagination .swiper-pagination-bullet-active{width:22px;border-radius:99px;opacity:1;background:#f5a000}
.home-hero-progress{position:absolute;z-index:12;left:18px;right:18px;bottom:0;height:2px;overflow:hidden;background:rgba(255,255,255,.18)}
.home-hero-progress>span{display:block;width:100%;height:100%;transform:scaleX(0);transform-origin:left center;background:#f5a000;will-change:transform}
@media(max-width:720px){
  .home-hero-slider{margin-top:7px;border-radius:16px}
  .home-hero-slide>a{aspect-ratio:1080/450}
  .home-hero-nav{display:none}
  .home-hero-pagination{bottom:9px!important;padding:5px 7px}
  .home-hero-progress{left:12px;right:12px}
}

/* Product media */
.sx-gallery-swiper-layout{display:grid;grid-template-columns:76px minmax(0,1fr);gap:12px;min-width:0}
.sx-product-thumbs-swiper{width:76px;height:560px;min-width:0}
.sx-product-thumbs-swiper .swiper-wrapper{align-items:flex-start}
.sx-product-thumb-slide{width:72px!important;height:72px!important;opacity:.62;transition:opacity .18s ease,transform .18s ease}
.sx-product-thumb-slide button{position:relative;display:grid;width:72px;height:72px;place-items:center;overflow:hidden;border:1px solid #e6e9ed;border-radius:15px;background:#fff;padding:6px;cursor:pointer;transition:border-color .18s,box-shadow .18s,background .18s}
.sx-product-thumb-slide img{display:block;width:100%;height:100%;object-fit:contain}
.sx-product-thumb-slide:hover,.sx-product-thumb-slide.swiper-slide-thumb-active{opacity:1}
.sx-product-thumb-slide.swiper-slide-thumb-active button{border-color:#e9a12f;box-shadow:0 0 0 2px rgba(233,161,47,.12);background:#fffaf2}
.sx-product-thumb-slide.is-video button{background:#f6f7f8}
.sx-video-thumb-icon{position:absolute;inset:auto 50% 50% auto;display:grid;width:30px;height:30px;place-items:center;transform:translate(50%,50%);border-radius:50%;background:rgba(20,24,29,.88);color:#fff;box-shadow:0 5px 16px rgba(0,0,0,.18)}
.sx-video-thumb-icon svg{width:16px;height:16px;fill:currentColor}
.sx-gallery-main-v28{min-height:560px;min-width:0}
.sx-product-media-swiper{width:100%;height:560px;min-width:0}
.sx-product-media-slide{display:flex!important;align-items:center;justify-content:center;height:100%;padding:36px 46px 42px;background:transparent}
.sx-product-media-slide .swiper-zoom-container{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.sx-product-media-slide picture{display:flex;width:100%;height:100%;align-items:center;justify-content:center}
.sx-product-media-slide img{display:block;max-width:90%;max-height:500px;width:auto;height:auto;object-fit:contain;filter:none!important;user-select:none;-webkit-user-drag:none}
.sx-product-video-slide{padding:48px 54px!important}
.sx-product-video-slide iframe,.sx-product-video-slide video{display:block;width:min(100%,920px);aspect-ratio:16/9;max-height:470px;border:0;border-radius:16px;background:#080b0f;box-shadow:0 18px 45px rgba(10,14,20,.12)}
.sx-swiper-nav{position:absolute;z-index:18;top:50%;display:grid;width:42px;height:42px;margin-top:-21px;place-items:center;border:1px solid rgba(225,229,234,.95);border-radius:50%;background:rgba(255,255,255,.9);color:#20242a;font-size:30px;line-height:1;box-shadow:0 8px 22px rgba(20,25,32,.08);backdrop-filter:blur(10px);cursor:pointer;transition:border-color .18s,opacity .18s,transform .18s}
.sx-swiper-nav:hover{border-color:#e9a12f;transform:scale(1.04)}
.sx-swiper-nav.swiper-button-disabled{opacity:.28;pointer-events:none}
.sx-swiper-prev{left:12px}.sx-swiper-next{right:12px}
.sx-product-media-pagination{bottom:12px!important}
.sx-product-media-pagination .swiper-pagination-bullet{width:6px;height:6px;background:#89909a;opacity:.35}
.sx-product-media-pagination .swiper-pagination-bullet-active{width:18px;border-radius:99px;background:#e99b19;opacity:1}
.sx-gallery-fullscreen{display:grid;width:40px;height:40px;place-items:center;border:1px solid rgba(255,255,255,.8);border-radius:50%;background:rgba(255,255,255,.82);color:#555d66;box-shadow:0 8px 24px rgba(17,24,39,.08);backdrop-filter:blur(12px);cursor:pointer;transition:border-color .18s,color .18s,transform .18s}
.sx-gallery-fullscreen:hover{border-color:#e9a12f;color:#a96409;transform:translateY(-1px)}
.sx-gallery-fullscreen svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}
.sx-gallery-hint-v28{position:absolute!important;z-index:12;bottom:12px!important;left:50%!important;display:flex!important;align-items:center;gap:6px;transform:translateX(-50%);white-space:nowrap;border:1px solid rgba(255,255,255,.9);border-radius:99px;background:rgba(255,255,255,.84);padding:7px 10px;color:#7b828b;font-size:10px;font-weight:700;box-shadow:0 5px 18px rgba(20,24,30,.06);backdrop-filter:blur(8px)}
.sx-gallery-hint-v28 svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8}
.sx-product-media-empty{display:flex;min-height:560px;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#b8bec6}.sx-product-media-empty svg{width:58px;height:58px;fill:none;stroke:currentColor;stroke-width:1.3}.sx-product-media-empty strong{font-size:12px;color:#9ca3ac}

/* Fullscreen viewer */
.sx-product-lightbox-v28{padding:18px}
.sx-lightbox-dialog-v28{width:min(1320px,96vw);height:min(900px,94vh);background:rgba(248,249,250,.98)}
.sx-lightbox-swiper{width:100%;height:100%}
.sx-lightbox-swiper .sx-product-media-slide{padding:56px 70px 62px}
.sx-lightbox-swiper .sx-product-media-slide img{max-width:94%;max-height:80vh}
.sx-lightbox-swiper .sx-product-video-slide iframe,.sx-lightbox-swiper .sx-product-video-slide video{width:min(1080px,90vw);max-height:78vh}
.sx-lightbox-pagination{position:absolute!important;bottom:16px!important;color:#626a74;font-size:11px;font-weight:800}
.sx-lightbox-prev,.sx-lightbox-next{z-index:5}

/* Native fallback if CDN cannot load. */
.sx-swiper-fallback .sx-product-media-slide[hidden]{display:none!important}
.sx-swiper-fallback .swiper-wrapper{display:block!important;height:100%}
.sx-swiper-fallback .sx-product-media-slide{height:100%}

/* Render less work below the fold without changing layout. */
.home-section,.home-service-grid,.home-order-section,.home-faq-section,.sx-product-bundle,.sx-compatible-section,.sx-recently-viewed{content-visibility:auto;contain-intrinsic-size:auto 420px}

@media(max-width:1023px){
  .sx-gallery-swiper-layout{display:flex;flex-direction:column;gap:8px}
  .sx-gallery-main-v28{order:1;min-height:470px}
  .sx-product-media-swiper{height:470px}
  .sx-product-thumbs-swiper{order:2;width:100%;height:74px}
  .sx-product-thumbs-swiper .swiper-wrapper{align-items:center}
  .sx-product-thumb-slide{width:66px!important;height:66px!important}
  .sx-product-thumb-slide button{width:64px;height:64px;border-radius:14px}
  .sx-product-media-slide{padding:32px 42px 40px}
  .sx-product-media-slide img{max-height:410px}
}
@media(max-width:639px){
  .sx-gallery-main-v28{min-height:310px;border-radius:17px!important}
  .sx-product-media-swiper{height:310px}
  .sx-product-media-slide{padding:38px 24px 34px}
  .sx-product-media-slide img{max-width:88%;max-height:245px}
  .sx-product-video-slide{padding:48px 12px 34px!important}
  .sx-product-video-slide iframe,.sx-product-video-slide video{width:100%;max-height:220px;border-radius:12px}
  .sx-product-thumbs-swiper{height:64px}
  .sx-product-thumb-slide{width:58px!important;height:58px!important}
  .sx-product-thumb-slide button{width:56px;height:56px;padding:4px;border-radius:12px}
  .sx-swiper-nav{display:grid;width:36px;height:36px;margin-top:-18px;font-size:26px;background:rgba(255,255,255,.94)}
  .sx-swiper-prev{left:7px}.sx-swiper-next{right:7px}
  .sx-gallery-hint-v28{display:none!important}
  .sx-gallery-fullscreen{width:38px;height:38px}
  .sx-lightbox-dialog-v28{width:100%;height:88vh;border-radius:18px}
  .sx-lightbox-swiper .sx-product-media-slide{padding:54px 12px 50px}
  .sx-lightbox-swiper .sx-product-media-slide img{max-width:94%;max-height:72vh}
  .sx-lightbox-swiper .sx-product-video-slide iframe,.sx-lightbox-swiper .sx-product-video-slide video{width:100%;max-height:66vh}
}
@media(prefers-reduced-motion:reduce){.swiper-wrapper,.home-hero-nav,.sx-swiper-nav,.sx-product-thumb-slide{transition-duration:0s!important}}

/* Minimal local fallback so a CDN outage never stacks every slide vertically. */
.home-hero-swiper,.sx-product-media-swiper,.sx-product-thumbs-swiper{overflow:hidden}
.home-hero-swiper>.swiper-wrapper,.sx-product-media-swiper>.swiper-wrapper,.sx-product-thumbs-swiper>.swiper-wrapper{display:flex;min-width:0}
.home-hero-swiper>.swiper-wrapper>.swiper-slide,.sx-product-media-swiper>.swiper-wrapper>.swiper-slide{flex:0 0 100%;min-width:0}
.sx-product-thumbs-swiper>.swiper-wrapper>.swiper-slide{flex:0 0 auto}
.sx-product-media-swiper.sx-swiper-fallback>.swiper-wrapper{display:block}
.sx-product-media-swiper.sx-swiper-fallback>.swiper-wrapper>.swiper-slide{display:none}
.sx-product-media-swiper.sx-swiper-fallback>.swiper-wrapper>.swiper-slide.is-active{display:flex}

/* v30.7 — stable mobile gestures.
   Swiper is the only gesture owner when loaded. Horizontal carousel gestures
   stay available while normal vertical page scrolling remains native. */
.home-hero-swiper,
.sx-product-media-swiper{
  touch-action:pan-y;
  -webkit-user-select:none;
  user-select:none;
}
.sx-product-media-swiper img{
  -webkit-touch-callout:none;
}

/* Local fallback is only activated when Swiper itself is unavailable. */
.sx-home-swiper-fallback>.swiper-wrapper{display:block!important;height:100%}
.sx-home-swiper-fallback>.swiper-wrapper>.swiper-slide[hidden]{display:none!important}
.sx-home-swiper-fallback>.swiper-wrapper>.swiper-slide:not([hidden]){display:block!important}
.sx-home-swiper-fallback .home-hero-nav.swiper-button-disabled{opacity:1;pointer-events:auto}
