/* ===================== CANDLE LAND PRODUCTS: STYLES =====================
   Sab kuch .clp-root ke andar scoped hai taake theme par asar na pare.
   Design values original section jaise hi hain.
========================================================================= */
.clp-root{
  --clp-paper:#F4EBE8;
  --clp-ink:#1A1522;
  --clp-ink-mute:#6A5F6B;
  --clp-indigo:#23246B;
  --clp-magenta:#F76FA6;
  --clp-orchid:#E58BE6;
  --clp-ember:#FFB463;
  --clp-line:rgba(26,21,34,.16);
  --clp-display:"Fraunces",Georgia,serif;
  --clp-sans:"Jost",system-ui,-apple-system,"Segoe UI",sans-serif;
  --clp-gut:clamp(20px,5vw,72px);
  --clp-maxw:1440px;
  --clp-ease:cubic-bezier(.22,1,.36,1);
  width:100%;
  overflow-x:clip;
}
.clp-root *,.clp-root *::before,.clp-root *::after{box-sizing:border-box}
.clp-root h2,.clp-root h3,.clp-root p{margin:0;padding:0}
.clp-root a{text-decoration:none!important;box-shadow:none}
.clp-root img{max-width:100%;display:block;border:0;box-shadow:none}

/* section */
.clp-root .clp-shop{
  background:var(--clp-paper);color:var(--clp-ink);
  padding-block:clamp(60px,9vw,120px) clamp(90px,13vw,180px);
  font-family:var(--clp-sans);font-weight:300;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.clp-root .clp-wrap{max-width:var(--clp-maxw);margin-inline:auto;padding-inline:var(--clp-gut)}

/* head */
.clp-root .clp-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;
  margin-bottom:clamp(40px,6vw,80px)}
.clp-root .clp-display,
.clp-root .clp-display *{color:var(--clp-ink)!important}
.clp-root .clp-display{
  font-family:var(--clp-display);font-weight:300;
  font-variation-settings:"SOFT" 40,"WONK" 1,"opsz" 120;
  font-size:clamp(2rem,4.6vw,3.8rem);line-height:.92;letter-spacing:-.022em;
  text-transform:none;max-width:14ch;
}
.clp-root .clp-rv{display:block;overflow:hidden;padding-bottom:.06em}
.clp-root .clp-rv > span{display:block;will-change:transform}

/* button (ink style) */
.clp-root .clp-btn{
  position:relative;display:inline-flex;align-items:center;gap:.85em;
  padding:1.05em 2.1em;border-radius:100px;
  font-family:var(--clp-sans);font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;font-weight:400;line-height:1.6;
  border:1px solid var(--clp-line);background:transparent;
  color:var(--clp-ink)!important;
  overflow:hidden;isolation:isolate;
  transition:color .45s var(--clp-ease),border-color .45s var(--clp-ease);
}
.clp-root .clp-btn::before{
  content:"";position:absolute;inset:0;z-index:-1;background:var(--clp-ink);
  transform:translateY(101%);transition:transform .55s var(--clp-ease);
}
.clp-root .clp-btn:hover,.clp-root .clp-btn:focus-visible{color:var(--clp-paper)!important;border-color:transparent}
.clp-root .clp-btn:hover::before,.clp-root .clp-btn:focus-visible::before{transform:translateY(0)}
.clp-root .clp-dot{width:6px;height:6px;border-radius:50%;background:var(--clp-ember);transition:transform .55s var(--clp-ease)}
.clp-root .clp-btn:hover .clp-dot{transform:scale(2.2)}
.clp-root :focus-visible{outline:2px solid var(--clp-ember);outline-offset:4px;border-radius:2px}

/* grid */
.clp-root .clp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,30px);align-items:start}
.clp-root .clp-card{position:relative;display:grid;gap:0;text-align:left;margin:0}
.clp-root .clp-card:nth-child(even){margin-top:clamp(24px,5vw,72px)}

/* media */
.clp-root .clp-media{
  position:relative;aspect-ratio:3/4;border-radius:3px;overflow:hidden;
  background:radial-gradient(120% 90% at 50% 12%,#2B2C74 0%,#14153F 46%,#0B0A1A 100%);
}
.clp-root .clp-media-link{position:absolute;inset:0;display:grid;place-items:center}
.clp-root .clp-drift{display:grid;place-items:center;width:100%;will-change:transform}  /* JS drift yahan lagta hai */
.clp-root .clp-media img{width:74%;height:auto;object-fit:contain;transition:transform .9s var(--clp-ease)}
.clp-root .clp-media::after{content:"";position:absolute;inset:auto 0 0;height:52%;pointer-events:none;
  background:linear-gradient(transparent,rgba(7,6,12,.72));opacity:0;transition:opacity .6s var(--clp-ease)}
.clp-root .clp-card:hover .clp-media img{transform:scale(1.07) translateY(-1.5%)}
.clp-root .clp-card:hover .clp-media::after{opacity:1}

.clp-root .clp-tag{position:absolute;top:12px;left:12px;z-index:2;
  font-family:var(--clp-sans);font-size:.6rem;letter-spacing:.18em;line-height:1.6;
  text-transform:uppercase;padding:.5em .9em;border-radius:100px;background:rgba(244,235,232,.1);
  border:1px solid rgba(244,235,232,.24);color:var(--clp-paper)!important;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}

.clp-root .clp-add{
  position:absolute;left:12px;right:12px;bottom:12px;z-index:3;
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:.85em 1.2em;border-radius:100px;border:0;
  background:var(--clp-paper)!important;color:var(--clp-ink)!important;
  font-family:var(--clp-sans);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;font-weight:400;line-height:1.6;
  transform:translateY(140%);opacity:0;transition:transform .55s var(--clp-ease),opacity .4s;
}
.clp-root .clp-card:hover .clp-add,.clp-root .clp-card:focus-within .clp-add{transform:translateY(0);opacity:1}
/* WooCommerce ajax: loading / added */
.clp-root .clp-add.loading{opacity:.6!important}
.clp-root .clp-add.added::after{content:none!important}
.clp-root .clp-media .added_to_cart{display:none!important}

/* touch screens par hover nahi hota, is liye button hamesha dikhe */
@media (hover:none){
  .clp-root .clp-add{transform:none;opacity:1}
  .clp-root .clp-media::after{opacity:1}
}

/* body */
.clp-root .clp-body{display:flex;justify-content:space-between;gap:14px;align-items:baseline;
  padding-top:16px;border-top:1px solid var(--clp-line);margin-top:16px}
.clp-root .clp-body h3{font-family:var(--clp-display);font-weight:400;font-size:1.18rem;line-height:1.3;
  font-variation-settings:"SOFT" 50,"WONK" 1;text-transform:none;letter-spacing:normal}
.clp-root .clp-body h3,.clp-root .clp-body h3 a{color:var(--clp-ink)!important}
.clp-root .clp-body p{font-family:var(--clp-sans);font-size:.82rem;margin-top:5px;line-height:1.55;
  color:var(--clp-ink-mute)!important}
.clp-root .clp-price{font-family:var(--clp-display);font-size:1.02rem;white-space:nowrap;
  color:var(--clp-indigo)!important}

@media (prefers-reduced-motion:reduce){
  .clp-root *,.clp-root *::before,.clp-root *::after{animation-duration:.001ms!important;
    animation-iteration-count:1!important;transition-duration:.01ms!important}
}

@media (max-width:1080px){
  .clp-root .clp-grid{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:560px){
  .clp-root .clp-grid{grid-template-columns:1fr;gap:34px}
  .clp-root .clp-card:nth-child(even){margin-top:0}
}
