/* Goldika Landing Blocks — v1.0.6 – lux-carousel skin
 * Agents: impeccable + frontend-design + ui-ux-pro-max + transitions.dev + ponytail
 */
:root {
    --gl-bg: #1b1d23;
    --gl-panel: rgba(18,19,25,.55);
    --gl-card: #303747;
    --gl-card-hover: #353d4f;
    --gl-text: #f4f4f5;
    --gl-muted: #b9bcc6;
    --gl-soft: #858995;
    --gl-gold: #c69300;
    --gl-gold-2: #faaf00;
    --gl-gold-light: #ffbf2a;
    --gl-border: rgba(250, 175, 0, .45);
    --gl-gap: 16px;
    --gl-tr: 150ms ease-out;
    --gl-tr-slow: 380ms cubic-bezier(.22,1,.36,1);
    --text-old: #858995;
    --dot-inactive: #5a5e6a;
    --dot-active: #faaf00;
}

.ast-container { max-width: unset !important; }
.home-hero-section{margin-bottom: 120px;}

.mainbox {
    max-width: 1450px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 3em;
    padding-right: 16px;
    padding-left: 16px;
    box-sizing: border-box;
}
.mainbox > section,
.mainbox > .wp-block-goldika-title,
.mainbox > .wp-block-goldika-categories,
.mainbox > .wp-block-goldika-banners,
.mainbox > .wp-block-goldika-benefits,
.mainbox > .wp-block-goldika-rich-accordion,
.mainbox > .wp-block-goldika-product-carousel {
    margin-bottom: 34px;
}

/* Reusable title block – kept for Gutenberg title block */
.gl-title-block { display:flex; align-items:center; gap:10px; }
.gl-title-icon { width:30px; height:30px; display:grid; place-items:center; color:var(--gl-gold-2); flex:0 0 auto; }
.gl-title-icon img { width:100%; height:100%; object-fit:contain; display:block; }
.gl-title-block :where(h1,h2,h3,h4,h5,h6){ margin:0; color:#fff; font-size:clamp(18px,2.2vw,25px); font-weight:900; line-height:1.35 }

/* ── Category block – ponytail luxe, no scale ── */
.gl-category-cards { display:grid; grid-template-columns:repeat(var(--gl-desktop-columns, 4), minmax(0,1fr)); gap:var(--gl-gap); }
.gl-category-card {
  position:relative; min-height:210px; border-radius:16px; overflow:hidden; isolation:isolate;
  background:#15171d; box-shadow:0 10px 30px rgba(0,0,0,.22);
  text-decoration:none; color:#fff;
  border:1px solid rgba(255,255,255,.06);
  transition:border-color var(--gl-tr);
}
.gl-category-card img { width:100%; height:100%; object-fit:cover; display:block; }
.gl-category-card::after { content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(0,0,0,0) 38%, rgba(0,0,0,.58)); }
.gl-category-card:hover, .gl-category-card:focus-visible { border-color:rgba(250,175,0,.38); outline:none }
.gl-cat-title { position:absolute; right:18px; bottom:18px; z-index:2; color:#fff; font-size:22px; font-weight:950; text-shadow:0 2px 12px rgba(0,0,0,.5) }
.gl-cat-arrow { position:absolute; left:16px; bottom:14px; z-index:2; width:42px; height:42px; border-radius:50%; display:grid; place-items:center; border:2px solid rgba(255,255,255,.78); color:#fff; background:rgba(255,255,255,.08) }
.gl-cat-arrow svg { display:block; width:16px; height:26px }

/* ── Banners – opacity fade, no drop-shadow ── */
.gl-banner-grid { display:grid; grid-template-columns:repeat(var(--gl-desktop-columns, 2), minmax(0,1fr)); gap:var(--gl-gap); }
.gl-banner-card { width:100%; display:flex; text-decoration:none; cursor:pointer; background:transparent; border:0; border-radius:0; overflow:visible; transition:opacity var(--gl-tr) }
.gl-banner-card img { width:100%; height:auto; display:flex; object-fit:contain }
.gl-banner-card:hover, .gl-banner-card:focus-visible { opacity:.92; outline:none }

/* ══════════════════════════════════════════
   Product Carousel – lux-carousel
   Agent: transitions.dev + impeccable + ui-ux-pro-max
   ══════════════════════════════════════════ */
.lux-carousel,
.gl-product-block {
  position:relative; direction:rtl;
  border:1.5px solid rgba(250, 175, 0, .45);
  border:1.5px solid var(--gl-border, rgba(250, 175, 0, .45));
  border-radius:20px;
  background:rgba(18,19,25,.55);
  background:var(--gl-panel, rgba(18,19,25,.55));
  padding:22px;
  overflow:hidden;
  box-shadow:0 8px 24px rgba(0,0,0,.18);
}

/* topbar */
.topbar,
.gl-product-block-head {
  display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:18px;
}
.title,
.gl-section-title {
  margin:0; color:#fff; font-size:clamp(18px,2.2vw,25px); font-weight:900; line-height:1.35; text-align:right;
}
.nav,
.gl-product-controls { display:flex; gap:8px; flex:0 0 auto }
.nav-btn,
.gl-nav-btn {
  width:34px; height:34px; border-radius:50%;
  border:1.5px solid rgba(255,255,255,.68);
  background:transparent; color:#fff;
  display:grid; place-items:center; cursor:pointer; padding:0;
  transition:border-color var(--gl-tr), color var(--gl-tr);
}
.nav-btn:hover, .nav-btn:focus-visible,
.gl-nav-btn:hover, .gl-nav-btn:focus-visible {
  color:var(--gl-gold-2); border-color:var(--gl-gold-2); outline:none;
}
.nav-btn:disabled,
.gl-nav-btn:disabled { opacity:.28; cursor:default }
.nav-btn svg,
.gl-nav-btn svg { width:13px; height:22px; display:block; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round }

/* content row */
.content-row,
.gl-product-layout {
  display:flex; gap:18px; align-items:stretch;
  transition:opacity .3s ease;
}
.content-row.fading { opacity:0 }

.slider-shell,
.gl-product-carousel-shell {
  flex:1; min-width:0; position:relative; overflow:hidden;
  cursor:grab; user-select:none; -webkit-user-select:none;
  touch-action: pan-y;
}
.slider-shell .card,
.slider-shell .gl-product-card {
  -webkit-user-drag: none;
}
.slider-shell.dragging,
.gl-product-carousel-shell.is-dragging { cursor:grabbing }

/* featured = titleImage – static */
.featured,
.gl-product-title-image {
  width:150px; flex-shrink:0;
  min-height:210px;
  display:flex; align-items:flex-end; justify-content:center;
  position:relative; overflow:hidden;
  border-radius:18px; background:transparent;
}
.featured img,
.gl-product-title-image img {
  width:100%; object-fit:contain; display:block;
  user-select:none; -webkit-user-drag:none; pointer-events:none;
  max-height:280px;
}

/* track – RTL transform */
.track,
.gl-product-track {
  display:flex; gap:16px; will-change:transform;
  direction:rtl;
  transition:transform var(--gl-tr-slow);
}
.track.no-transition { transition:none !important }

/* ── Card – .card = .gl-product-card ── */
.card,
.gl-product-card {
  flex:0 0 195px; width:195px;
  background:#303747;
  background:var(--gl-card, #303747);
  border-radius:28px;
  padding:10px 10px 12px;
  border:1px solid rgba(255,255,255,.04);
  box-shadow:0 8px 24px rgba(0,0,0,.18);
  color:#fff; text-decoration:none;
  transition:border-color 150ms ease-out, background-color 150ms ease-out;
  transition:border-color var(--gl-tr, 150ms ease-out), background-color var(--gl-tr, 150ms ease-out);
  display:flex; flex-direction:column;
}
.card:hover, .card:focus-visible,
.gl-product-card:hover, .gl-product-card:focus-visible {
  background:#353d4f;
  background:var(--gl-card-hover, #353d4f);
  border-color:rgba(250,175,0,.28);
  outline:none;
}
.card:focus-visible,
.gl-product-card:focus-visible { outline:2px solid var(--gl-gold-2); outline-offset:2px }

/* thumb */
.thumb,
.gl-product-img {
  aspect-ratio:1/1;
  background:#111;
  border-radius:23px;
  overflow:hidden;
  margin-bottom:14px;
  position:relative;
  display:block;
}

.card-end .thumb{
    aspect-ratio: auto;
    margin-bottom: 0;
    z-index: 0;
}
.thumb img,
.gl-product-img img {
  width:100%; height:100%; object-fit:cover; display:block;
  pointer-events:none; -webkit-user-drag:none;
}
/* second image swap – impeccable */
.thumb .img-primary,
.gl-product-img .gl-product-image {
  position:relative; z-index:1; opacity:1; transition:opacity .18s ease-out;
}
.thumb .img-hover,
.gl-img-hover {
  position:absolute; inset:0; z-index:2; opacity:0; transition:opacity .18s ease-out;
}
.card.has-hover-image:hover .img-hover,
.card.has-hover-image:focus-visible .img-hover,
.card.has-hover-image:active .img-hover,
.card.has-hover-image.is-pressed .img-hover,
.gl-product-card.has-hover-image:hover .gl-img-hover,
.gl-product-card.has-hover-image:focus-visible .gl-img-hover { opacity:1 }
.card.has-hover-image:hover .img-primary,
.card.has-hover-image:focus-visible .img-primary,
.card.has-hover-image:active .img-primary,
.card.has-hover-image.is-pressed .img-primary,
.gl-product-card.has-hover-image:hover .gl-product-image.gl-img-primary,
.gl-product-card.has-hover-image:focus-visible .gl-product-image.gl-img-primary { opacity:0 }

/* card text */
.name,
.gl-product-name {
  font-size:15px; font-weight:500; line-height:1.5;
  color:#fff; margin-bottom:3px;
  display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden;
  transition:color var(--gl-tr);
}
.card:hover .name,
.gl-product-card:hover .gl-product-name { color:#fff9ec }
.sku,
.gl-product-code { color:var(--gl-muted); font-size:12px; direction:ltr; margin-bottom:10px; display:block }

/* price */
.old,
.gl-price-old { color:var(--text-old); font-size:13px; text-decoration:line-through; margin-bottom:3px; min-height:16px }
.price,
.gl-price-area {
  color:#fff; font-size:15px; font-weight:800;
  display:flex; align-items:flex-end; justify-content:space-between; gap:8px; margin-top:auto;
}
.price .now-val,
.gl-price-now { font-weight:800 }
.price span.cur,
.gl-price-now .woocommerce-Price-currencySymbol { font-weight:400; font-size:12px; color:var(--gl-gold-2); margin-right:4px }
.price-wrap,
.gl-price-stack { flex:1; min-width:0; text-align:right; display:flex; flex-direction:column; align-items:flex-start }
.discount-chip,
.gl-discount-chip {
  width:34px; height:34px; border-radius:50%; background:#d69a00; color:#24242a;
  font-size:13px; font-weight:900; display:grid; place-items:center; flex:0 0 auto;
}

/* OOS – ponytail fix: NO img filter leak */
.card.is-oos,
.gl-product-card.is-oos { opacity:.72 }
.card.is-oos .thumb img,
.card.is-oos img,
.gl-product-card.is-oos .gl-product-img img,
.gl-product-card.is-oos img {filter: grayscale(.8) brightness(0.65);}
.unavailable,
.gl-unavailable {
  flex:1; display:flex; justify-content:center; align-items:center;
  min-height:34px; color:var(--gl-muted);
  border:1px dashed rgba(255,255,255,.14); border-radius:10px; font-size:13px;
}

/* pill */
.card-pill,
.gl-card-pill {
  position:absolute; top:8px; right:8px; z-index:3;
  padding:4px 12px; border-radius:999px;
  background:#303747b3; color:#fff; font-size:12px; font-weight:900;
}

/* end card / view-all */
.card-end,
.gl-product-view-all {
  display:flex; flex-direction:column; align-items:center; justify-content:flex-end;
  position:relative; overflow:hidden; background:#c69300; background:var(--gl-gold, #c69300);
  align-self:stretch; height:100%; min-height:100%;
}
.card-end .thumb,
.gl-view-all-image {
  position:absolute; inset:10px 10px 52px; border-radius:23px; overflow:hidden; z-index:0;
}
.card-end .thumb img,
.gl-view-all-image img {
  width:100%; height:100%; object-fit:cover;
  transition:opacity var(--gl-tr, 150ms ease-out); display:block;
  position:relative; z-index:0;
}
.card-end:hover .thumb img,
.gl-product-view-all:hover .gl-view-all-image img { opacity:.88 }
.card-end::after,
.gl-product-view-all::after {
  content: "";
  position: absolute;
  inset: 1px;
  background: linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(0, 0, 0, .72));
  z-index: 1;
  pointer-events: none;
  border-radius: 24px;
}
.card-end,
a.card-end {
  text-decoration:none;
  color:inherit;
}
.view-all-btn,
.gl-view-all-label {
  position: relative;
    z-index: 2;
    width: calc(100%);
    padding: 10px 8px;
    background: #c69300;
    background: var(--gl-gold, #c69300);
    color: #1a1d24;
    border: none;
    border-radius: 16px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: background var(--gl-tr);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}
.card-end:hover .view-all-btn,
.card-end:focus-visible .view-all-btn { background:#ffbf2a; background:var(--gl-gold-light, #ffbf2a) }
.gl-view-all-label {
  background:transparent; color:#fff; font-size:18px; font-weight:900;
  padding:0 8px 6px; margin:0; width:100%;
}
.gl-view-all-chevron {
  width:38px; height:38px; border-radius:50%;
  border:2px solid rgba(255,255,255,.72);
  display:grid; place-items:center;
}
.gl-view-all-chevron svg { width:13px; height:22px; display:block }

/* ── Skeleton ── */
@keyframes shimmer { 0% { background-position:200% 0 } 100% { background-position:-200% 0 } }
.shimmer {
  background:linear-gradient(90deg, #1b1f29 25%, #2a3040 50%, #1b1f29 75%);
  background-size:400px 100%; animation:shimmer 1.4s ease-in-out infinite;
}
.skeleton .thumb { background:transparent }
.skeleton .thumb.shimmer { border-radius:23px }
.skel-line { border-radius:5px; margin:0 6px 7px }
.featured-shimmer { width:100%; height:100%; border-radius:18px; min-height:210px }

/* skeleton card matches .card sizing */
.card.skeleton,
.gl-skeleton-card {
  flex:0 0 195px; width:195px;
  background:#232836; border-radius:28px; padding:10px;
  border:1px solid rgba(255,255,255,.03);
}

/* ── Dots ── */
.dots,
.gl-dots {
  display:flex; justify-content:center; gap:6px; margin-top:14px; direction:ltr;
}
.dot,
.gl-dots button {
  width:5px; height:5px; border-radius:999px;
  background:var(--dot-inactive); opacity:.7;
  transition:.2s ease; cursor:pointer; border:0; padding:0;
}
.dot.active,
.gl-dots button.is-active {
  width:16px; background:var(--dot-active); opacity:1; border-radius:3px;
}
.dot:hover:not(.active),
.gl-dots button:hover:not(.is-active) { opacity:1; background:#5a5e6a }

/* rubber-band */
.track.is-overscroll,
.gl-product-track.is-overscroll {
  transition:transform 320ms cubic-bezier(.34,1.56,.64,1) !important;
}

/* ── Benefits ── */
.gl-benefits-section { width:100% !important }
.gl-benefits-header { margin:0 auto 40px auto; text-align:right; display:flex; align-items:center; gap:8px }
.gl-title-text { color:#fff; font-weight:bold; margin:0 }
.gl-title-text span { color:#ffa600; font-weight:bold }
.gl-benefits-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:48px; margin:0 auto }
.gl-benefit-unit { display:flex; flex-direction:column; align-items:center; gap:30px; height:100% }
.gl-benefit-box { aspect-ratio:1/1; display:flex; justify-content:center; align-items:center }
.gl-benefit-box img { width:100%; height:100%; max-width:180px; object-fit:contain }
.gl-benefit-desc { color:#fff; margin:0; font-size:1.8em; text-align:center; font-weight:400 }
@media (min-width:1024px){
  .gl-title-text{font-size:40px} .gl-header-icon{width:40px;height:auto}
  .gl-benefit-box{width:100%;background:#232836;border:1px solid #f6c042;border-radius:16px;padding:24px;box-sizing:border-box;transition:border-color var(--gl-tr)}
  .gl-benefit-box:hover{border-color:#ffbf2a}
}
@media (max-width:1024px){
  .gl-benefit-box{width:100%}.gl-benefits-grid{gap:24px}.gl-benefit-desc{font-size:1.1rem}
}
@media (max-width:1024px) and (min-width:767px){
  .gl-benefit-box img{padding-inline:16px}.gl-title-text{font-size:28px}.gl-header-icon{width:28px;height:auto}
}
@media (max-width:767px){
  .gl-benefit-box{padding:0;border-radius:12px;margin:auto;width:100%;max-height:180px}
  .gl-benefit-box img{width:100%;height:auto}
  .gl-benefits-grid{grid-template-columns:repeat(2,1fr);gap:16px}
}

/* ── Rich accordion ── */
.gl-rich-accordion{color:var(--gl-muted)}
.gl-rich-accordion h2{color:#fff;margin:0 0 10px;font-size:24px}
.gl-rich-accordion p,.gl-rich-accordion li{color:var(--gl-muted)}
.gl-rich-hidden{height:0;overflow:hidden;transition:height .45s cubic-bezier(.22,1,.36,1)}
.gl-rich-toggle{display:flex;align-items:center;justify-content:center;gap:6px;margin:18px auto 0;border:0;background:transparent;color:var(--gl-gold-2);cursor:pointer;padding:8px 18px;border-radius:8px}
.gl-rich-toggle:hover{color:var(--gl-gold-2);background:rgba(250,175,0,.06)}
.gl-rich-toggle:focus-visible{outline:2px solid var(--gl-gold-2);outline-offset:4px}
.gl-rich-toggle svg{width:18px;height:18px;fill:currentColor;transform:rotate(180deg);transition:transform .15s ease-out}
.gl-rich-toggle[aria-expanded="true"] svg{transform:rotate(0)}

/* editor placeholder */
.gl-editor-placeholder{padding:18px;border:1px dashed rgba(250,175,0,.45);border-radius:14px;background:rgba(15,16,21,.35);color:var(--gl-muted)}
.gl-editor-placeholder strong{color:#fff}
.gl-editor-placeholder p{margin:6px 0 0}

/* ── Responsive ── */
@media (max-width:1024px){
  .featured, .gl-product-title-image{width:120px;flex-basis:120px}
  .card,.gl-product-card,.card.skeleton{flex-basis:170px;width:170px}
  .gl-category-cards{grid-template-columns:repeat(var(--gl-tablet-columns,3), minmax(0,1fr))}
  .gl-product-block-head .gl-section-title, .title{font-size:20px}
}
@media (max-width:767px){
  .mainbox{padding-right:10px;padding-left:10px}
  .lux-carousel, .gl-product-block{padding:16px 14px}
  .content-row, .gl-product-layout{display:block}
  .featured, .gl-product-title-image{display:none !important}
  .track, .gl-product-track{gap:10px}
  .card,.gl-product-card,.card.skeleton{flex-basis:155px;width:155px;border-radius:18px;padding:8px}
  .thumb, .gl-product-img{border-radius:15px;margin-bottom:10px}
  .name, .gl-product-name{font-size:13px}
  .sku, .gl-product-code{font-size:12px}
  .discount-chip, .gl-discount-chip{width:28px;height:28px;font-size:12px}
  .gl-category-cards, .gl-banner-grid{grid-template-columns:repeat(var(--gl-mobile-columns,2), minmax(0,1fr))}
}
@media (max-width:520px){
  .gl-category-card{min-height:150px}
  .gl-cat-title{font-size:18px}
  .gl-cat-arrow{width:36px;height:36px}
  .gl-banner-grid{grid-template-columns:repeat(var(--gl-mobile-columns,1), minmax(0,1fr))}
  .card,.gl-product-card,.card.skeleton{flex-basis:145px;width:145px}
}

/* Embla structure — official padding-gap. Do not restyle .card chrome. */
.slider-shell {
  --rail-slide: 211px;
  --rail-gap: 16px;
  overflow: hidden;
  touch-action: pan-y pinch-zoom;
}
.slider-shell .track,
.slider-shell .track.embla-track {
  display: flex;
  align-items: stretch;
  gap: 0 !important;
  transition: none !important;
  direction: rtl;
  touch-action: pan-y pinch-zoom;
  overflow: visible;
  will-change: transform;
  margin-inline-start: calc(var(--rail-gap, 16px) * -1);
}
.rail-slide {
  box-sizing: border-box;
  flex: 0 0 var(--rail-slide, 211px);
  min-width: 0;
  padding-inline-start: var(--rail-gap, 16px);
  will-change: transform;
  display: flex;
  align-items: stretch;
}
.rail-slide > .card {
  width: 100%;
  flex: 1 1 auto;
  max-width: none;
  height: 100%;
  min-height: 100%;
  box-sizing: border-box;
}
.track.embla-track.is-dragging .rail-slide > .card {
  transform: none !important;
}
/* Same padding-gap recipe as .rail-slide — never CSS gap */
.rail-skeleton {
  position: absolute;
  inset: 0;
  z-index: 5;
  display: flex;
  direction: rtl;
  gap: 0;
  pointer-events: none;
  margin-inline-start: calc(var(--rail-gap, 16px) * -1);
}
.rail-skeleton .skel {
  box-sizing: border-box;
  flex: 0 0 var(--rail-slide, 211px);
  padding-inline-start: var(--rail-gap, 16px);
  min-height: 280px;
  background: transparent;
  position: relative;
  overflow: hidden;
}
.rail-skeleton .skel::before {
  content: "";
  display: block;
  height: 100%;
  min-height: 280px;
  border-radius: 28px;
  background: #232836;
}
.rail-skeleton .skel::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.08), transparent);
  transform: translateX(-100%);
  animation: goldika-sweep 1.25s infinite;
}
@keyframes goldika-sweep { 100% { transform: translateX(100%); } }
.slider-shell.is-ready .rail-skeleton { display: none; }
.lux-carousel > .dots,
.gl-product-block > .dots { display: none !important; }
@media (max-width:1024px){ .slider-shell { --rail-slide: 186px; } }
@media (max-width:767px){ .slider-shell { --rail-slide: 171px; --rail-gap: 10px; } }

@media (prefers-reduced-motion:reduce){
  .card,.nav-btn,.thumb .img-primary,.thumb .img-hover,
  .gl-product-card,.gl-nav-btn,.gl-product-img .gl-product-image,
  .gl-banner-card,.gl-benefit-box,
  .track,.gl-rich-hidden,.gl-rich-toggle svg,.shimmer{
    transition:none !important; animation:none !important;
  }
}