/* ═══════════════════════════════════════════════════════════════
   CHURIBAZAAR — main.css
   Ivory ground, deep jade chrome, antique gold accent.
   Fraunces (display) + Archivo (UI/body).
   Breakpoints: mobile ≤767 · tablet 768–1023 · desktop ≥1024
   ═══════════════════════════════════════════════════════════════ */

:root{
  --ivory:   #f4efe6;
  --ivory-2: #ebe3d3;
  --ivory-3: #e2d9c5;
  --jade:    #12261e;
  --jade-2:  #1b3329;
  --ink:     #1c1a16;
  --mute:    #6b6558;
  --gold:    #a8811f;
  --gold-2:  #e0b44c;
  --ruby:    #8e2a35;
  --ok:      #2f6b45;
  --line:    rgba(28,26,22,.14);
  --line-d:  rgba(244,239,230,.16);

  --serif:"Fraunces", Georgia, serif;
  --sans:"Archivo", Arial, sans-serif;
  --ease:cubic-bezier(.22,.9,.28,1);
  --pad:clamp(1.1rem, 4vw, 3.5rem);
  --max:1360px;
  --r:4px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--ivory);color:var(--ink);
  font-family:var(--sans);font-size:1rem;line-height:1.6;
  overflow-x:hidden;
}
img{display:block;max-width:100%;height:auto}
picture{display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,select,textarea{font:inherit;color:inherit}
ul,ol{list-style:none}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}
[hidden]{display:none !important}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ── type ───────────────────────────────────── */
h1,h2,h3,.h1,.h2,.h3{font-family:var(--serif);font-weight:500;line-height:1.08;letter-spacing:-.01em}
.h1{font-size:clamp(2.4rem,1.6rem+3.4vw,4.4rem);font-weight:400}
.h2{font-size:clamp(1.8rem,1.3rem+2vw,3rem);font-weight:400}
.h3{font-size:clamp(1.25rem,1.1rem+.6vw,1.6rem)}
.kicker{font-family:var(--serif);font-style:italic;color:var(--gold);font-size:1.05rem}
.lede{font-size:1.08rem;color:var(--mute);max-width:56ch;line-height:1.65}
.small{font-size:.86rem;color:var(--mute)}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.section{padding:clamp(3.5rem,7vw,6.5rem) 0}
.section--tight{padding:clamp(2.5rem,5vw,4rem) 0}
.head{display:flex;justify-content:space-between;align-items:end;gap:1.5rem;flex-wrap:wrap;margin-bottom:clamp(1.6rem,3.5vw,2.8rem)}
.head .lede{margin-top:.5rem}
.link{border-bottom:1px solid currentColor;padding-bottom:1px;transition:color .2s}
.link:hover{color:var(--gold)}

/* ── buttons ────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  min-height:48px;padding:.75rem 1.5rem;border-radius:var(--r);
  font-weight:600;font-size:.92rem;letter-spacing:.01em;
  background:var(--jade);color:var(--ivory);border:1px solid var(--jade);
  transition:background .25s var(--ease),color .25s,transform .25s var(--ease),border-color .25s;
  white-space:nowrap;
}
.btn:hover{background:var(--jade-2);transform:translateY(-1px)}
.btn--gold{background:var(--gold-2);border-color:var(--gold-2);color:var(--jade)}
.btn--gold:hover{background:#ebc35f}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn--ghost:hover{background:var(--ink);color:var(--ivory)}
.btn--light{background:transparent;color:var(--ivory);border-color:var(--ivory)}
.btn--light:hover{background:var(--ivory);color:var(--jade)}

.btn--sm{min-height:40px;padding:.5rem 1.1rem;font-size:.84rem}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}

/* ── announcement + header ──────────────────── */
.bar{
  background:var(--jade);color:var(--ivory);
  font-size:.8rem;text-align:center;padding:.5rem var(--pad);
  border-bottom:1px solid var(--line-d);
}
.bar em{color:var(--gold-2);font-style:italic;font-family:var(--serif);font-size:.95em}
.hdr{
  position:sticky;top:0;z-index:60;
  background:var(--ivory);border-bottom:1px solid var(--line);
}
.hdr__in{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  gap:0.5rem;min-height:74px;
}
.logo{display:inline-flex;align-items:center;gap:.6rem;justify-self:start}
.logo__mark{width:34px;height:34px;flex:0 0 auto}
.logo__word{font-family:var(--serif);font-weight:500;font-size:1.45rem;letter-spacing:-.01em;line-height:1}
.logo__word i{color:var(--gold);font-style:italic;font-weight:400}
.nav{display:flex;gap:2rem;justify-content:center}
.nav a{font-size:.9rem;font-weight:500;padding:.4rem 0;position:relative;color:var(--ink)}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.nav a:hover::after,.nav a.is-active::after{transform:scaleX(1)}
.hdr__acts{display:flex;justify-content:end;align-items:center;gap:.25rem}
.ibtn{
  position:relative;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;
  border-radius:50%;transition:background .2s;
}
.ibtn:hover{background:var(--ivory-2)}
.ibtn svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ibtn__count{
  position:absolute;top:4px;right:2px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;
  background:var(--gold);color:var(--jade);font-size:.68rem;font-weight:700;
  display:flex;align-items:center;justify-content:center;
  transform:scale(0);transition:transform .25s var(--ease);
}
.ibtn__count.is-on{transform:scale(1)}
.burger{display:none}
@media (max-width:1023px){
  .hdr__in{grid-template-columns:auto 1fr auto}
  .nav{display:none}
  .burger{display:inline-flex}
  .logo{justify-self:center}
}

/* mobile drawer nav */
.mnav{
  position:fixed;inset:0;z-index:80;visibility:hidden;
}
.mnav__bg{position:absolute;inset:0;background:rgba(18,38,30,.55);opacity:0;transition:opacity .35s}
.mnav__panel{
  position:absolute;top:0;bottom:0;left:0;width:min(88vw,360px);
  background:var(--ivory);padding:1.5rem var(--pad);
  transform:translateX(-100%);transition:transform .4s var(--ease);
  display:flex;flex-direction:column;gap:2rem;overflow-y:auto;
}
.mnav.is-open{visibility:visible}
.mnav.is-open .mnav__bg{opacity:1}
.mnav.is-open .mnav__panel{transform:none}
.mnav__list a{display:block;font-family:var(--serif);font-size:1.6rem;padding:.55rem 0;border-bottom:1px solid var(--line)}
.mnav__sub a{display:block;padding:.35rem 0;color:var(--mute)}
.mnav__close{align-self:flex-end}

/* ── cart drawer ────────────────────────────── */
.cdrawer{position:fixed;inset:0;z-index:90;visibility:hidden}
.cdrawer__bg{position:absolute;inset:0;background:rgba(18,38,30,.55);opacity:0;transition:opacity .35s}
.cdrawer__panel{
  position:absolute;top:0;bottom:0;right:0;width:min(92vw,440px);
  background:var(--ivory);display:flex;flex-direction:column;
  transform:translateX(100%);transition:transform .4s var(--ease);
  box-shadow:-20px 0 60px rgba(0,0,0,.2);
}
.cdrawer.is-open{visibility:visible}
.cdrawer.is-open .cdrawer__bg{opacity:1}
.cdrawer.is-open .cdrawer__panel{transform:none}
.cdrawer__head{display:flex;justify-content:space-between;align-items:center;padding:1.2rem 1.4rem;border-bottom:1px solid var(--line)}
.cdrawer__head h2{font-size:1.4rem}
.cdrawer__body{flex:1;overflow-y:auto;padding:.5rem 1.4rem}
.cdrawer__foot{padding:1.2rem 1.4rem;border-top:1px solid var(--line);display:grid;gap:.8rem}
.cdrawer__ship{font-size:.84rem;color:var(--mute)}
.cdrawer__ship b{color:var(--ok)}
.progress{height:4px;background:var(--ivory-3);border-radius:2px;overflow:hidden;margin-top:.4rem}
.progress i{display:block;height:100%;background:var(--gold);width:0;transition:width .5s var(--ease)}
.cempty{text-align:center;padding:3rem 1rem;color:var(--mute)}
.cempty .h3{color:var(--ink);margin-bottom:.4rem}

/* line item (shared drawer + cart page) */
.line{display:grid;grid-template-columns:84px 1fr auto;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line);align-items:start}
.line__img{aspect-ratio:1;object-fit:cover;border-radius:var(--r);background:var(--jade)}
.line__name{font-family:var(--serif);font-size:1.08rem;line-height:1.25}
.line__meta{font-size:.82rem;color:var(--mute);margin-top:.15rem}
.line__price{font-weight:600;text-align:right}
.line__rm{font-size:.8rem;color:var(--mute);text-decoration:underline;margin-top:.5rem;display:inline-block;margin-left: 15px}
.line__rm:hover{color:var(--ruby)}
.qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:var(--r);margin-top:.6rem}
.qty button{width:34px;height:34px;font-size:1.05rem;line-height:1}
.qty button:hover{background:var(--ivory-2)}
.qty input{width:38px;height:34px;text-align:center;border:0;background:transparent;-moz-appearance:textfield}
.qty input::-webkit-outer-spin-button,.qty input::-webkit-inner-spin-button{-webkit-appearance:none}
.qty--lg button{width:44px;height:46px}
.qty--lg input{width:48px;height:46px}

/* ── toast ──────────────────────────────────── */
.toast{
  position:fixed;left:50%;bottom:1.5rem;z-index:100;
  transform:translate(-50%,20px);opacity:0;pointer-events:none;
  background:var(--jade);color:var(--ivory);padding:.8rem 1.2rem;border-radius:var(--r);
  font-size:.9rem;box-shadow:0 10px 30px rgba(0,0,0,.25);
  transition:transform .3s var(--ease),opacity .3s;
  display:flex;gap:.8rem;align-items:center;
}
.toast.is-on{transform:translate(-50%,0);opacity:1;pointer-events:auto}
.toast a{color:var(--gold-2);text-decoration:underline}

/* ── hero (home) ────────────────────────────── */
.hero{
  background:var(--jade);color:var(--ivory);position:relative;overflow:hidden;
}
.hero__in{
  display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:clamp(2rem,5vw,5rem);
  min-height:min(86vh,760px);padding-top:clamp(2.5rem,5vw,4rem);padding-bottom:clamp(2.5rem,5vw,4rem);
}
.hero__copy{max-width:36rem}
.hero .h1{color:var(--ivory)}
.hero .h1 i{font-style:italic;color:var(--gold-2);font-weight:300}
.hero__lede{margin-top:1.4rem;font-size:1.1rem;color:rgba(244,239,230,.78);max-width:44ch}
.hero__cta{display:flex;gap:.8rem;margin-top:2rem}
.hero__media{position:relative}
.hero__media video,.hero__media img{width:100%;aspect-ratio:5/4.2;object-fit:cover;border-radius:var(--r)}
.hero__media::before{
  content:"";position:absolute;inset:-14px;border:1px solid rgba(224,180,76,.35);border-radius:6px;pointer-events:none;
}
.hero__note{display:block;color:var(--ivory);
  position:absolute;left:1.2rem;bottom:1.2rem;background:rgba(18,38,30,.82);backdrop-filter:blur(6px);
  padding:.7rem .95rem;border-radius:var(--r);font-size:.84rem;max-width:22rem;line-height:1.4;
}
.hero__note b{display:block;font-family:var(--serif);font-weight:500;font-size:1.05rem}

@media (max-width:1023px){.hero__in{grid-template-columns:1fr;min-height:0}.hero__media{order:-1}.hero__media video,.hero__media img{aspect-ratio:16/11}}

/* ── category tiles ─────────────────────────── */
.cats{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem}
.cat{position:relative;display:block;overflow:hidden;border-radius:var(--r);background:var(--jade)}
.cat img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform .7s var(--ease);opacity:.92}
.cat:hover img{transform:scale(1.05);opacity:1}
.cat__lbl{
  position:absolute;left:0;right:0;bottom:0;padding:1.6rem 1rem .9rem;color:var(--ivory);
  background:linear-gradient(transparent,rgba(18,38,30,.9));
}
.cat__lbl b{display:block;font-family:var(--serif);font-weight:500;font-size:1.25rem}
.cat__lbl span{font-size:.78rem;opacity:.8}
@media (max-width:1023px){.cats{grid-template-columns:repeat(3,1fr)}}
@media (max-width:767px){.cats{grid-template-columns:repeat(2,1fr);gap:.7rem}.cats .cat:last-child:nth-child(odd){grid-column:1/-1}.cats .cat:last-child:nth-child(odd) img{aspect-ratio:2/1}.cat__lbl{padding:1.2rem .7rem .7rem}.cat__lbl b{font-size:1.05rem}}

/* ── product card + grid ────────────────────── */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2vw,1.8rem) clamp(.9rem,1.6vw,1.4rem)}
@media (max-width:1023px){.grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:767px){.grid{grid-template-columns:repeat(2,1fr)}}
.card{position:relative;display:flex;flex-direction:column}
.card__media{position:relative;overflow:hidden;border-radius:var(--r);background:var(--jade);aspect-ratio:1}
.card__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .5s var(--ease),transform .7s var(--ease)}
.card__alt{opacity:0}
.card:hover .card__alt{opacity:1}
.card:hover .card__media img{transform:scale(1.04)}
.badge{
  position:absolute;top:.7rem;left:.7rem;z-index:2;
  font-size:.7rem;font-weight:700;letter-spacing:.04em;padding:.28rem .55rem;border-radius:3px;
  background:var(--ivory);color:var(--ink);
}
.badge--sale{background:var(--ruby);color:#fff}
.badge--new{background:var(--gold-2);color:var(--jade)}
.card__quick{
  position:absolute;left:.7rem;right:.7rem;bottom:.7rem;z-index:2;
  transform:translateY(8px);opacity:0;transition:transform .3s var(--ease),opacity .3s;
}
.card:hover .card__quick{transform:none;opacity:1}
@media (hover:none){.card__quick{opacity:1;transform:none}}
.card__icons{
  position:absolute;top:.6rem;right:.6rem;z-index:3;display:flex;flex-direction:column;gap:.4rem;
  transform:translateX(6px);opacity:0;transition:transform .3s var(--ease),opacity .3s;
}
.card:hover .card__icons{transform:none;opacity:1}
@media (hover:none){.card__icons{opacity:1;transform:none}}
.card__icon-btn{
  width:34px;height:34px;border-radius:50%;background:#fff;border:none;display:flex;align-items:center;justify-content:center;
  cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.15);color:var(--ink);transition:background .15s,color .15s;
}
.card__icon-btn:hover{background:var(--gold-2);color:var(--jade)}
.card__icon-btn.is-active{background:var(--ruby);color:#fff}
.card__icon-btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.9}
.card__icon-btn.is-active svg{fill:currentColor}

/* ── quick view modal ───────────────────────── */
.qv{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:1.2rem;opacity:0;pointer-events:none;transition:opacity .25s}
.qv.is-open{opacity:1;pointer-events:auto}
.qv__bg{position:absolute;inset:0;background:rgba(20,18,15,.55)}
.qv__panel{position:relative;background:#fff;border-radius:12px;max-width:780px;width:100%;max-height:88vh;overflow:auto;display:grid;grid-template-columns:1fr 1fr;gap:0;transform:translateY(12px);transition:transform .25s}
.qv.is-open .qv__panel{transform:none}
.qv__img{aspect-ratio:1;overflow:hidden;background:var(--jade)}
.qv__img img{width:100%;height:100%;object-fit:cover}
.qv__body{padding:1.6rem;position:relative}
.qv__close{position:absolute;top:.8rem;right:.8rem;width:32px;height:32px;border-radius:50%;background:var(--ivory);border:none;display:flex;align-items:center;justify-content:center;cursor:pointer}
.qv__close svg{width:16px;height:16px;stroke:var(--ink);fill:none;stroke-width:2}
@media (max-width:640px){.qv__panel{grid-template-columns:1fr}.qv__img{aspect-ratio:4/3}}
.card__body{padding:.85rem .1rem 0}
.card__name{font-family:var(--serif);font-size:1.08rem;font-weight:500;line-height:1.25}
.card__name a::after{content:"";position:absolute;inset:0;z-index:1}
.card__cat{font-size:.8rem;color:var(--mute);margin-top:.1rem}
.price{display:flex;gap:.55rem;align-items:baseline;margin-top:.35rem;font-weight:600}
.price s{color:var(--mute);font-weight:400;font-size:.9em}
.price .is-sale{color:var(--ruby)}

/* ── home: values band ──────────────────────── */
.band{background:var(--jade);color:var(--ivory)}
.band__in{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;padding:clamp(2rem,4vw,3rem) 50px}
.band__item{display:flex;gap:.9rem;align-items:flex-start}
.band__item svg{width:28px;height:28px;flex:0 0 auto;stroke:var(--gold-2);fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.band__item b{display:block;font-family:var(--serif);font-weight:500;font-size:1.08rem}
.band__item span{font-size:.84rem;color:rgba(244,239,230,.72)}
@media (max-width:1023px){.band__in{grid-template-columns:repeat(2,1fr)}}
@media (max-width:767px){.band__in{grid-template-columns:1fr;padding:clamp(2rem,4vw,3rem) 20px}}

/* ── home: story split ──────────────────────── */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.split__img img{width:100%;aspect-ratio:6/5;object-fit:cover;border-radius:var(--r)}
.split__img--sq img{aspect-ratio:1}
.split .h2{margin-bottom:1rem}
.split p+p{margin-top:1rem}
.split .btn{margin-top:1.6rem}
.ticks{margin-top:1.4rem;display:grid;gap:.45rem}
.ticks li{padding-left:1.4rem;position:relative;color:var(--ink)}
.ticks li::before{content:"";position:absolute;left:0;top:.55em;width:9px;height:9px;border:2px solid var(--gold);border-radius:50%}
@media (max-width:1023px){.split{grid-template-columns:1fr}}

/* ── home: bangle-size promo ────────────────── */
.promo{background:var(--ivory-2);border-radius:var(--r);padding:clamp(1.8rem,4vw,3.5rem);display:grid;grid-template-columns:1.2fr .8fr;gap:2rem;align-items:center}
.promo__rings{display:flex;justify-content:center;gap:.6rem;align-items:center}
.promo__rings i{display:block;border:3px solid var(--gold);border-radius:50%;position:relative}
.promo__rings i::after{content:attr(data-s);position:absolute;bottom:-1.8rem;left:50%;transform:translateX(-50%);font-size:.8rem;color:var(--mute);font-style:normal}
@media (max-width:767px){.promo{grid-template-columns:1fr}.promo__rings{margin-top:1rem;margin-bottom:2rem}}

/* ── reviews ────────────────────────────────── */
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.review{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.5rem}
.stars{color:var(--gold);letter-spacing:.1em;font-size:.9rem}
.review p{font-family:var(--serif);font-size:1.1rem;line-height:1.45;margin:.7rem 0 .9rem}
.review cite{font-style:normal;font-size:.84rem;color:var(--mute)}
@media (max-width:767px){.reviews{grid-template-columns:1fr}}

/* ── newsletter ─────────────────────────────── */
.news{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.news__in{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center;padding:clamp(2rem,4vw,3rem) 55px}
.news form{display:flex;gap:.6rem}
.news input{flex:1}
@media (max-width:767px){.news__in{grid-template-columns:1fr;padding:clamp(2rem,4vw,3rem) 20px}.news form{flex-direction:column}}

/* ── forms ──────────────────────────────────── */
.field{display:grid;gap:.35rem}
.field label{font-size:.86rem;font-weight:600}
.field label small{font-weight:400;color:var(--mute)}
input[type=text],input[type=email],input[type=tel],input[type=number],input[type=password],input[type=search],input[type=date],input[type=url],select,textarea{
  width:100%;min-height:48px;padding:.65rem .9rem;border:1px solid var(--line);border-radius:0px;
  background:#fff;transition:border-color .2s,box-shadow .2s;
  font-family:inherit;font-size:.95rem;color:var(--ink);
  -webkit-appearance:none;appearance:none;
}
.field--pw{position:relative}
.field--pw input[type=password],.field--pw input[type=text]{padding-right:2.8rem}
.field__eye{position:absolute;right:.7rem;top:38px;background:none;border:none;padding:.3rem;cursor:pointer;color:var(--mute);display:flex}
.field--pw:has(label)+.field--pw .field__eye,.field--pw .field__eye{top:38px}
.field__eye svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8}
.field__eye .eye-off{display:none}
.field--pw.is-visible .eye-on{display:none}
.field--pw.is-visible .eye-off{display:block}
select{
  background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%237a7266' stroke-width='2'%3E%3Cpath d='M5 8l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .8rem center;background-size:16px;
  padding-right:2.4rem;cursor:pointer;
}
.qty input[type=number]{
  max-width: 50px;
  min-height: 40px;
  background: transparent;
      border-top: none;
    border-bottom: none;
}
textarea{min-height:130px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--gold);box-shadow:0 0 0 3px rgba(168,129,31,.18)}
.field.is-err input,.field.is-err select,.field.is-err textarea{border-color:var(--ruby)}
.field__err{font-size:.8rem;color:var(--ruby);display:none}
#sizeErr{display:block}
.field.is-err .field__err{display:block}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media (max-width:600px){.frow{grid-template-columns:1fr}}
.check{display:flex;gap:.6rem;align-items:flex-start;font-size:.9rem}
.check input{margin-top:.3rem;accent-color:var(--jade)}
.radio-card{
  display:flex;gap:.8rem;align-items:flex-start;padding:.9rem 1rem;border:1px solid var(--line);border-radius:var(--r);
  background:#fff;cursor:pointer;transition:border-color .2s,box-shadow .2s;
}
.radio-card:has(input:checked){border-color:var(--jade);box-shadow:0 0 0 1px var(--jade)}
.radio-card input{margin-top:.3rem;accent-color:var(--jade)}
.radio-card b{display:block;font-weight:600}
.radio-card span{font-size:.84rem;color:var(--mute)}
.radio-card .rc-price{margin-left:auto;font-weight:600;white-space:nowrap}
@media (max-width:480px){.radio-card{flex-wrap:wrap}.radio-card .rc-price{flex-basis:100%;margin-left:0;padding-left:1.7rem;white-space:normal;font-size:.86rem}}

/* ── page head / breadcrumb ─────────────────── */
.phead{padding:clamp(2.2rem,5vw,4rem) 0 clamp(1.5rem,3vw,2.5rem)}
.crumbs{display:flex;gap:.5rem;font-size:.82rem;color:var(--mute);margin-bottom:.9rem;flex-wrap:wrap}
.crumbs a:hover{color:var(--ink)}
.crumbs span::before{content:"/";margin-right:.5rem;opacity:.5}
.phead--dark{background:var(--jade);color:var(--ivory)}
.phead--dark .crumbs{color:rgba(244,239,230,.6)}
.phead--dark .lede{color:rgba(244,239,230,.75)}

/* ── shop ───────────────────────────────────── */
.shop{display:grid;grid-template-columns:230px 1fr;gap:clamp(1.5rem,3.5vw,3.5rem);align-items:start}
.filters{position:sticky;top:96px}
.filters h3{font-size:1rem;font-family:var(--sans);font-weight:600;margin-bottom:.6rem}
.filters+.filters,.filters__grp+.filters__grp{margin-top:1.6rem}
.filters__grp{margin-top:1.6rem}
.fl{display:flex;flex-direction:column;gap:.15rem}
.fl button,.fl label{display:flex;justify-content:space-between;align-items:center;padding:.4rem 0;font-size:.92rem;color:var(--mute);cursor:pointer;text-align:left;width:100%}
.fl button:hover,.fl button.is-active,.fl label:hover{color:var(--ink)}
.fl button.is-active{font-weight:600}
.fl button.is-active::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold)}
.fl label input{accent-color:var(--jade)}
.fl label span{margin-right:auto;margin-left:.5rem}
.shop__bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.2rem;flex-wrap:wrap}
.shop__bar select{min-height:40px;width:auto;padding:.4rem 2rem .4rem .8rem}
.fbtn{display:none}
.empty{padding:4rem 1rem;text-align:center;color:var(--mute);grid-column:1/-1}
@media (max-width:1023px){
  .shop{grid-template-columns:1fr}
  .filters{position:fixed;inset:0;z-index:80;background:var(--ivory);padding:1.5rem var(--pad);overflow-y:auto;transform:translateX(-100%);transition:transform .35s var(--ease);top:0}
  .filters.is-open{transform:none}
  .fbtn{display:inline-flex}
  .filters__close{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}
}
@media (min-width:1024px){.filters__close{display:none}}

/* ── product page ───────────────────────────── */
.pdp{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,4.5vw,4.5rem);align-items:start}
.gal{display:grid;grid-template-columns:76px 1fr;gap:.8rem;position:sticky;top:96px}
.gal__thumbs{display:flex;flex-direction:column;gap:.6rem}
.gal__thumbs button{border-radius:var(--r);overflow:hidden;border:2px solid transparent;transition:border-color .2s;background:var(--jade)}
.gal__thumbs button.is-active{border-color:var(--gold)}
.gal__thumbs img{aspect-ratio:1;object-fit:cover}
.gal__main{border-radius:var(--r);overflow:hidden;background:var(--jade);position:relative}
.gal__main img{width:100%;aspect-ratio:1;object-fit:cover;transition:opacity .3s}
.pdp__cat{font-family:var(--serif);font-style:italic;color:var(--gold);margin-bottom:.4rem}
.pdp .h1{font-size:clamp(2rem,1.5rem+2vw,3.1rem)}
.pdp .price{font-size:1.5rem;margin-top:.8rem;font-weight:500}
.pdp__stock{font-size:.86rem;margin-top:.5rem}
.pdp__stock b{color:var(--ok)}
.pdp__stock.is-low b{color:var(--ruby)}
.pdp__desc{margin-top:1.4rem;color:var(--mute);line-height:1.65}
.opt{margin-top:1.5rem}
.opt__lbl{display:flex;justify-content:space-between;font-size:.88rem;font-weight:600;margin-bottom:.55rem}
.opt__lbl a{font-weight:400;color:var(--mute);text-decoration:underline}
.chips{display:flex;gap:.5rem;flex-wrap:wrap}
.chip{min-width:52px;height:42px;padding:0 .9rem;border:1px solid var(--line);border-radius:var(--r);background:#fff;transition:all .2s}
.chip:hover{border-color:var(--ink)}
.chip.is-active{background:var(--jade);color:var(--ivory);border-color:var(--jade)}
.chip--sw{display:inline-flex;align-items:center;gap:.5rem}
.chip--sw i{width:14px;height:14px;border-radius:50%;display:inline-block;border:1px solid rgba(0,0,0,.2)}
.colorset{display:flex;gap:.55rem;flex-wrap:wrap}
.colorset__sw{width:34px;height:34px;border-radius:50%;border:2px solid rgba(0,0,0,.12);cursor:pointer;padding:0;transition:all .2s}
.colorset__sw:hover{transform:scale(1.08)}
.colorset__sw.is-active{border-color:var(--ink);box-shadow:0 0 0 2px #fff inset,0 0 0 3px var(--ink)}
.pdp__buy{display:grid;grid-template-columns:auto 1fr;gap:.8rem;margin-top:1.6rem}
.pdp__buy .qty{margin:0;width: fit-content;}
.pdp__trust{display:grid;grid-template-columns:1fr 1fr;gap:.6rem 1rem;margin-top:1.4rem;padding-top:1.2rem;border-top:1px solid var(--line);font-size:.84rem;color:var(--mute)}
.pdp__trust li{display:flex;gap:.5rem;align-items:center}
.pdp__trust svg{width:16px;height:16px;stroke:var(--gold);fill:none;stroke-width:1.8;flex:0 0 auto}
.acc{border-top:1px solid var(--line);margin-top:1.6rem}
.acc__item{border-bottom:1px solid var(--line)}
.acc__btn{width:100%;display:flex;justify-content:space-between;align-items:center;padding:1rem 0;font-weight:600;text-align:left;gap:1rem}
.acc__btn::after{content:"+";font-family:var(--serif);font-size:1.5rem;font-weight:300;line-height:1;transition:transform .3s var(--ease);flex:0 0 auto}
.acc__item.is-open .acc__btn::after{transform:rotate(45deg)}
.acc__body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s var(--ease)}
.acc__item.is-open .acc__body{grid-template-rows:1fr}
.acc__body>div{overflow:hidden}
.acc__body p,.acc__body ul{padding-bottom:1.1rem;color:var(--mute);line-height:1.6;font-size:.94rem}
.acc__body li{padding:.15rem 0 .15rem 1rem;position:relative}
.acc__body li::before{content:"";position:absolute;left:0;top:.75em;width:5px;height:5px;border-radius:50%;background:var(--gold)}
@media (max-width:1023px){.pdp{grid-template-columns:1fr}.gal{position:static;grid-template-columns:1fr}.gal__thumbs{flex-direction:row;order:2}.gal__thumbs button{width:64px}}
@media (max-width:480px){.pdp__buy{grid-template-columns:1fr}}

/* ── cart page ──────────────────────────────── */
.cart{display:grid;grid-template-columns:1fr 380px;gap:clamp(1.5rem,4vw,4rem);align-items:start}
.cart__list .line{grid-template-columns:110px 1fr auto;padding:1.4rem 0}
.summary{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.5rem;position:sticky;top:96px}
.summary h2{font-size:1.4rem;margin-bottom:1rem}
.srow{display:flex;justify-content:space-between;padding:.45rem 0;font-size:.95rem}
.srow--total{border-top:1px solid var(--line);margin-top:.6rem;padding-top:.9rem;font-weight:600;font-size:1.15rem}
.srow .is-free{color:var(--ok);font-weight:600}
.summary .btn{margin-top:1rem}
.summary .small{margin-top:.8rem;text-align:center}
@media (max-width:1023px){.cart{grid-template-columns:1fr}.summary{position:static}}
@media (max-width:480px){.cart__list .line{grid-template-columns:84px 1fr}.cart__list .line__price{grid-column:2;text-align:left}}

/* ── checkout ───────────────────────────────── */
.co{display:grid;grid-template-columns:1fr 420px;gap:clamp(1.5rem,4vw,4rem);align-items:start}
.co__step{margin-bottom:2.2rem}
.co__step h2{font-size:1.35rem;margin-bottom:1rem;display:flex;align-items:center;gap:.7rem}
.co__step h2 i{
  font-family:var(--sans);font-style:normal;font-size:.8rem;font-weight:700;
  width:26px;height:26px;border-radius:50%;background:var(--jade);color:var(--ivory);
  display:inline-flex;align-items:center;justify-content:center;
}
.co__form{display:grid;gap:1rem}
.co__opts{display:grid;gap:.7rem}
.co__side .summary{background:var(--ivory-2);border:0}
.co .line{grid-template-columns:64px 1fr auto;padding:.8rem 0}
.co .line__img{position:relative}
.co .line__q{
  position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:50%;
  background:var(--jade);color:var(--ivory);font-size:.7rem;display:flex;align-items:center;justify-content:center;
}
.co__thumb{position:relative;width:64px}
@media (max-width:1023px){.co{grid-template-columns:1fr}.co__side{order:-1}}

/* order confirmation */
.done{max-width:640px;margin:0 auto;text-align:center;padding:clamp(3rem,6vw,5rem) 0}
.done__ico{width:72px;height:72px;margin:0 auto 1.4rem;border-radius:50%;background:var(--jade);display:flex;align-items:center;justify-content:center}
.done__ico svg{width:34px;height:34px;stroke:var(--gold-2);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.done .h2{margin-bottom:.7rem}
.done__id{font-family:var(--serif);font-size:1.3rem;margin:1.2rem 0;color:var(--gold)}

/* ── about page ─────────────────────────────── */
.about-hero{background:var(--jade);color:var(--ivory)}
.about-hero__in{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:end;padding:clamp(3rem,7vw,6rem) 0}
.about-hero .h1{color:var(--ivory)}
.about-hero .h1 i{color:var(--gold-2);font-weight:300}
.about-hero p{color:rgba(244,239,230,.78);font-size:1.08rem;max-width:44ch}
@media (max-width:1023px){.about-hero__in{grid-template-columns:1fr}}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;border-top:1px solid var(--line);padding-top:1.5rem}
.step b{display:block;font-family:var(--serif);font-size:1.25rem;font-weight:500;margin:.3rem 0 .4rem}
.step i{font-family:var(--serif);font-style:italic;color:var(--gold)}
.step p{font-size:.92rem;color:var(--mute)}
@media (max-width:1023px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.steps{grid-template-columns:1fr}}
.tl{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.tl__item{border-top:1px solid var(--gold);padding-top:1rem}
.tl__year{font-family:var(--serif);font-size:1.8rem;color:var(--gold);display:block;margin-bottom:.3rem}
.tl__item p{font-size:.92rem;color:var(--mute)}
@media (max-width:767px){.tl{grid-template-columns:1fr}}
.mosaic{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem}
.mosaic img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--r)}
.mosaic figure:first-child{grid-column:span 2;grid-row:span 2}
.mosaic figure:first-child img{height:100%}
@media (max-width:600px){.mosaic{grid-template-columns:repeat(2,1fr)}}

/* ── FAQ page ───────────────────────────────── */
.faq{display:grid;grid-template-columns:240px 1fr;gap:clamp(1.5rem,4vw,4rem);align-items:start}
.faq__nav{position:sticky;top:96px;display:flex;flex-direction:column;gap:.1rem}
.faq__nav a{padding:.5rem 0;color:var(--mute);border-left:2px solid transparent;padding-left:.8rem;margin-left:-.8rem}
.faq__nav a.is-active,.faq__nav a:hover{color:var(--ink);border-color:var(--gold)}
.faq__grp+.faq__grp{margin-top:3rem}
.faq__grp h2{font-size:1.6rem;margin-bottom:.4rem}
.faq .acc{margin-top:.8rem}
.faq__help{margin-top:3.5rem;background:var(--ivory-2);border-radius:var(--r);padding:1.6rem;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;flex-wrap:wrap}
@media (max-width:1023px){.faq{grid-template-columns:1fr}.faq__nav{position:static;flex-direction:row;flex-wrap:wrap;gap:.4rem .9rem;border-bottom:1px solid var(--line);padding-bottom:1rem}.faq__nav a{border-left:0;padding:.3rem 0;margin:0;border-bottom:2px solid transparent}}

/* ── contact page ───────────────────────────── */
.contact{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(2rem,5vw,5rem);align-items:start}
.cinfo{display:grid;gap:1.6rem}
.cinfo__item b{display:block;font-family:var(--serif);font-weight:500;font-size:1.15rem;margin-bottom:.25rem}
.cinfo__item a{display:block;color:var(--mute)}
.cinfo__item a:hover{color:var(--gold)}
.cinfo__item p{color:var(--mute);font-size:.94rem}
.cinfo__wa{display:inline-flex;align-items:center;gap:.5rem;margin-top:.4rem;color:var(--ok);font-weight:600}
.cinfo__wa svg{width:20px;height:20px;fill:currentColor}
.cform{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:clamp(1.4rem,3vw,2.2rem);display:grid;gap:1rem}
.cform h2{font-size:1.5rem}
.cform__ok{display:none;text-align:center;padding:2rem 1rem}
.cform.is-sent form{display:none}
.cform.is-sent .cform__ok{display:block}
@media (max-width:1023px){.contact{grid-template-columns:1fr}}

/* ── footer ─────────────────────────────────── */
.ftr{background:var(--jade);color:var(--ivory);margin-top:clamp(3rem,7vw,6rem)}
.ftr__in{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:2.5rem;padding:clamp(2.5rem,5vw,4rem) 0 2rem}
.ftr .logo__word{color:var(--ivory)}
.ftr__about{color:rgba(244,239,230,.7);font-size:.92rem;margin-top:.9rem;max-width:34ch}
.ftr h3{font-family:var(--sans);font-size:.9rem;font-weight:600;margin-bottom:.9rem;color:var(--gold-2)}
.ftr__col a{display:block;padding:.25rem 0;color:rgba(244,239,230,.8);font-size:.92rem;transition:color .2s}
.ftr__col a:hover{color:var(--gold-2)}
.ftr__base{border-top:1px solid var(--line-d);padding:1.2rem 0;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.8rem;color:rgba(244,239,230,.55)}
.ftr__pay{display:flex;gap:.5rem}
.ftr__pay span{border:1px solid var(--line-d);border-radius:3px;padding:.15rem .5rem;font-size:.72rem;letter-spacing:.03em}
@media (max-width:1023px){.ftr__in{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.ftr__in{grid-template-columns:1fr;gap:1.8rem}}

/* ── reveal (one orchestrated entrance on home only) ── */
.rv{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rv.in{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important}
  .rv{opacity:1;transform:none}
}
