/* Celine Claire — curated product rows and native review rows.
   Loaded only on a page that actually renders [cc_products] or
   [cc_product_reviews]. Everything is scoped to .cc-cx-row / .cc-rev, so this
   file cannot reach the Shop archive and the Shop archive cannot reach it.
   The card language is the approved Shop card, restated here rather than
   borrowed from shop.css, because shop.css is written against body.cc-shop and
   carries archive-wide layout resets that must not apply to an editorial page. */

.cc-cx-row,.cc-rev{
  --c-paper:#F5F1E8;
  --c-ink:#1B1A17;
  --c-yellow:#F5C518;
  --c-amber:#C9962E;
  --c-muted:#6E6357;
  --c-rule:#E6DFD2;
  --c-rule-2:rgba(27,26,23,.26);
  --c-clay:#C08370;
  --c-ivory:#FBF7EF;
  --c-disp:"Cormorant Garamond",Georgia,serif;
  --c-body:Geist,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --c-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}

/* ------------------------------------------------------------------- grid */
.cc-cx-row ul.products{
  display:grid!important;gap:28px 24px;list-style:none;
  margin:30px 0 0!important;padding:0!important;
}
.cc-cx-row ul.products::before,
.cc-cx-row ul.products::after{display:none!important}
.cc-cx-row ul.products.columns-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.cc-cx-row ul.products.columns-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cc-cx-row ul.products.columns-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.cc-cx-row ul.products li.product{
  width:auto!important;margin:0!important;float:none!important;clear:none!important;
  display:flex;flex-direction:column;font-family:var(--c-body);
}
@media(max-width:1199px){
  .cc-cx-row ul.products.columns-4{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:900px){
  .cc-cx-row ul.products.columns-3,
  .cc-cx-row ul.products.columns-4{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 14px}
}
@media(max-width:560px){
  .cc-cx-row ul.products.columns-2,
  .cc-cx-row ul.products.columns-3,
  .cc-cx-row ul.products.columns-4{grid-template-columns:1fr;gap:26px}
}

/* ------------------------------------------------------------------ media */
.cc-cx-row .cc-pc__media{
  position:relative;background:var(--c-paper);border-radius:2px;overflow:hidden;
  aspect-ratio:1/1;margin-bottom:14px;
}
.cc-cx-row .cc-pc__imglink{position:absolute;inset:0;display:block}
/* A sitewide hover-swap script (the Elementor "cchoverswap" widget) wraps the
   first image of every li.product in a <span class="cc-hov"> at runtime and
   injects its own second image. Inside this card that span is a zero-height
   inline box, which collapses the absolutely positioned image to nothing - the
   card renders as an empty square. The wrapper is made to fill the frame and
   the injected image is dropped; the card already carries its own hover image. */
.cc-cx-row li.product .cc-pc__media .cc-hov{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  display:block!important;overflow:visible!important;border-radius:0!important;
}
.cc-cx-row li.product .cc-pc__media .cc-hov-alt{display:none!important}
.cc-cx-row li.product .cc-pc__media img.cc-pc__img--a,
.cc-cx-row li.product .cc-pc__media img.cc-pc__img--b{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  max-width:none!important;max-height:none!important;aspect-ratio:auto!important;
  margin:0!important;border-radius:0!important;display:block!important;
  transition:opacity .5s ease,transform .6s cubic-bezier(.2,.7,.2,1);
}
.cc-cx-row li.product .cc-pc__media img.cc-pc__img--b{opacity:0}
.cc-cx-row li.product.cc-pc--swap:hover .cc-pc__media img.cc-pc__img--b,
.cc-cx-row li.product.cc-pc--swap:focus-within .cc-pc__media img.cc-pc__img--b{opacity:1}
.cc-cx-row li.product.cc-pc--swap:hover .cc-pc__media img.cc-pc__img--a,
.cc-cx-row li.product.cc-pc--swap:focus-within .cc-pc__media img.cc-pc__img--a{opacity:0}
/* A touch screen has no hover: never hide product information behind it. */
@media(hover:none){
  .cc-cx-row li.product.cc-pc--swap:hover .cc-pc__media img.cc-pc__img--a{opacity:1}
  .cc-cx-row li.product.cc-pc--swap:hover .cc-pc__media img.cc-pc__img--b{opacity:0}
  .cc-cx-row .cc-pc__vizlab{display:none}
}
.cc-cx-row .cc-pc:hover .cc-pc__img,
.cc-cx-row .cc-pc:focus-within .cc-pc__img{transform:scale(1.02)}
.cc-cx-row .cc-pc__noimg{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  text-align:center;padding:12%;
}
.cc-cx-row .cc-pc__noimg-mark{
  font-family:var(--c-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--c-muted);
}
.cc-cx-row .cc-pc__badge{
  position:absolute;top:10px;left:10px;z-index:3;background:var(--c-ink);color:var(--c-ivory);
  font-family:var(--c-mono);font-size:9px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;padding:6px 10px;border-radius:999px;
}
.cc-cx-row .cc-pc__wl{position:absolute;top:10px;right:10px;z-index:3}
.cc-cx-row .cc-pc__vizlab{
  position:absolute;bottom:10px;z-index:3;pointer-events:none;opacity:0;transition:opacity .35s ease;
  max-width:calc(50% - 16px);font-family:var(--c-mono);font-size:8.5px;font-weight:600;line-height:1.2;
  letter-spacing:.1em;text-transform:uppercase;padding:5px 8px;border-radius:999px;
  background:rgba(27,26,23,.74);color:#FBF7EF;
}
.cc-cx-row .cc-pc__vizlab--l{left:10px}
.cc-cx-row .cc-pc__vizlab--r{right:10px;text-align:right}
.cc-cx-row .cc-pc--viz.cc-pc--swap:hover .cc-pc__vizlab,
.cc-cx-row .cc-pc--viz.cc-pc--swap:focus-within .cc-pc__vizlab{opacity:1}

/* ------------------------------------------------------------------- body */
.cc-cx-row .cc-pc__body{display:flex;flex-direction:column;flex:1 1 auto;min-width:0}
.cc-cx-row .cc-pc__name{
  font-family:var(--c-disp);font-weight:400;font-size:20px;line-height:1.2;
  margin:0 0 6px;color:var(--c-ink);text-transform:none;letter-spacing:0;
}
.cc-cx-row .cc-pc__name a{
  color:var(--c-ink);text-decoration:none;
  display:inline-flex;align-items:center;min-height:44px;
}
.cc-cx-row .cc-pc__name a:hover{text-decoration:underline;text-decoration-color:var(--c-yellow);text-underline-offset:4px}
.cc-cx-row .cc-pc__type{
  margin:0 0 10px;font-family:var(--c-mono);font-size:9.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--c-muted);
}
.cc-cx-row .cc-pc__rating{margin:0 0 10px;display:flex;align-items:center;gap:8px;line-height:1}
.cc-cx-row .cc-pc__stars{color:var(--c-amber);font-size:14px;letter-spacing:.08em}
.cc-cx-row .cc-pc__revcount{font-family:var(--c-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--c-muted)}
.cc-cx-row .cc-pc__price{font-size:16px;color:var(--c-ink);font-variant-numeric:tabular-nums;margin:0 0 14px}
.cc-cx-row .cc-pc__price del{color:var(--c-muted);margin-right:6px;opacity:.7}
.cc-cx-row .cc-pc__price ins{text-decoration:none;font-weight:500}
.cc-cx-row .cc-pc__stock{
  margin:-8px 0 12px;font-family:var(--c-mono);font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--c-clay);
}
.cc-cx-row .cc-pc__acts{margin-top:auto;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.cc-cx-row .cc-pc__add{
  display:inline-flex;align-items:center;justify-content:center;width:100%;
  min-height:48px;padding:13px 20px;border-radius:2px;text-decoration:none;cursor:pointer;
  background-color:var(--c-ink)!important;color:var(--c-ivory)!important;
  -webkit-text-fill-color:var(--c-ivory)!important;border:1px solid var(--c-ink)!important;
  font-family:var(--c-body);font-size:15px;font-weight:500;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease,transform .12s ease;
}
.cc-cx-row .cc-pc__add:hover,
.cc-cx-row .cc-pc__add:focus-visible{
  background-color:var(--c-yellow)!important;color:var(--c-ink)!important;
  -webkit-text-fill-color:var(--c-ink)!important;border-color:var(--c-yellow)!important;
}
.cc-cx-row .cc-pc__add:active{transform:scale(.985)}
.cc-cx-row .cc-pc__add.loading{opacity:.7;pointer-events:none}
.cc-cx-row .cc-pc__add.added{background-color:var(--c-yellow)!important;color:var(--c-ink)!important;-webkit-text-fill-color:var(--c-ink)!important}
.cc-cx-row .cc-pc__add--choose{
  background-color:transparent!important;color:var(--c-ink)!important;
  -webkit-text-fill-color:var(--c-ink)!important;border:1px solid var(--c-ink)!important;
}
.cc-cx-row li.product a.added_to_cart{
  display:inline-flex;align-items:center;min-height:44px;font-size:14px;color:var(--c-ink);
  text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--c-rule-2);
}
.cc-cx-row .cc-pc__view{
  font-size:14.5px;color:var(--c-ink);text-decoration:underline;
  text-decoration-color:var(--c-rule-2);text-underline-offset:5px;
  min-height:44px;display:inline-flex;align-items:center;
  transition:text-decoration-color .2s ease;
}
.cc-cx-row .cc-pc__view:hover{text-decoration-color:var(--c-yellow)}
.cc-cx-row .cc-pc--oos .cc-pc__media{opacity:.72}

/* -------------------------------------------------------- native reviews */
.cc-rev{
  list-style:none;margin:26px 0 0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;
}
.cc-rev__item{
  background:#fbf6ec;border:1px solid rgba(27,26,23,.1);border-radius:8px;padding:22px;
  display:flex;flex-direction:column;font-family:var(--c-body);
}
.cc-rev__stars{margin:0 0 10px;color:var(--c-amber);font-size:15px;letter-spacing:.1em;line-height:1}
.cc-rev__text{font-size:13.5px;line-height:1.6;color:rgba(27,26,23,.78);margin:0 0 14px}
.cc-rev__text p{margin:0 0 8px}
.cc-rev__text p:last-child{margin:0}
.cc-rev__meta{
  margin:auto 0 10px;display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  font-family:var(--c-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--c-muted);
}
.cc-rev__who{font-weight:600;color:var(--c-ink)}
.cc-rev__label{border:1px solid var(--c-rule);border-radius:999px;padding:3px 8px}
.cc-rev__label--verified{border-color:#8B4A3A;color:#8B4A3A}
.cc-rev__prod{margin:0;font-size:13px}
.cc-rev__prod a{
  color:#8B4A3A;text-decoration:underline;text-underline-offset:4px;
  text-decoration-color:rgba(139,74,58,.35);min-height:44px;display:inline-flex;align-items:center;
}
.cc-rev__prod a:hover{text-decoration-color:#8B4A3A}

@media(prefers-reduced-motion:reduce){
  .cc-cx-row *,.cc-rev *{transition:none!important;animation:none!important}
  .cc-cx-row .cc-pc:hover .cc-pc__img,.cc-cx-row .cc-pc:focus-within .cc-pc__img{transform:none}
}