/* =========================================================
   Color Jam - main stylesheet
   Sections: tokens / base / header / hero / marquee / brand
             collections / services / process / about / cta
             footer / woocommerce / editorial / responsive
   ========================================================= */

/* ---------- tokens ---------- */
:root{
  --cj-cream:#f6f1eb;
  --cj-cream-2:#f1eae1;
  --cj-panel:#fbf8f4;
  --cj-ink:#2b2320;
  --cj-muted:#5c5049;
  --cj-soft:#7c6d64;
  --cj-burgundy:#86404b;
  --cj-burgundy-deep:#5d3a36;
  --cj-blue:#7283a2;
  --cj-olive:#6b7250;
  --cj-rule:rgba(43,35,32,.16);
  --cj-rule-soft:rgba(43,35,32,.12);
  --cj-on-dark:rgba(246,241,235,.9);
  --cj-gutter:clamp(20px,4vw,44px);
  --cj-display:"Askey","Jost","Avenir Next",Avenir,Georgia,serif;
  --cj-body:"Jost","Avenir Next",Avenir,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --cj-ease:cubic-bezier(.22,.61,.36,1);
}

@font-face{
  font-family:"Askey";
  src:url("../fonts/Askey-Regular.otf") format("opentype");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--cj-cream);
  color:var(--cj-ink);
  font-family:var(--cj-body);
  font-weight:300;
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img{max-width:100%;height:auto}
a{color:var(--cj-burgundy);text-decoration:none;transition:color .3s ease}
a:hover{color:var(--cj-blue)}
h1,h2,h3,h4,h5,h6{font-weight:400;margin:0}
button{font-family:inherit}
:focus-visible{outline:2px solid var(--cj-burgundy);outline-offset:3px}

.cj-skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:var(--cj-cream);color:var(--cj-burgundy);padding:12px 20px}
.cj-skip-link:focus{left:12px;top:12px}

.screen-reader-text{
  border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;
  overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal!important;
}

/* ---------- shared bits ---------- */
.cj-eyebrow{
  font-size:11px;letter-spacing:.3em;text-transform:uppercase;
  color:var(--cj-burgundy);display:block;
}
.cj-display{font-family:var(--cj-display);font-weight:400;line-height:1;letter-spacing:.01em}
.cj-section{padding:clamp(64px,9vw,110px) var(--cj-gutter)}
.cj-section-head{
  display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:flex-end;
  border-bottom:1px solid var(--cj-rule);padding-bottom:24px;
}
.cj-section-head__titles{display:flex;flex-direction:column;gap:12px}
.cj-section-head h2{font-family:var(--cj-display);font-size:clamp(38px,6vw,68px);line-height:1}
.cj-section-head__note{font-size:13px;color:var(--cj-soft);max-width:340px;text-wrap:pretty}

.cj-btn{
  display:inline-block;padding:17px 32px;font-size:12px;letter-spacing:.2em;
  text-transform:uppercase;transition:background .35s ease,color .35s ease,border-color .35s ease;
  border:1px solid transparent;cursor:pointer;
}
.cj-btn--light{background:var(--cj-cream);color:var(--cj-burgundy)}
.cj-btn--light:hover{background:var(--cj-burgundy);color:var(--cj-cream)}
.cj-btn--outline{border-color:rgba(246,241,235,.6);color:var(--cj-cream);background:transparent}
.cj-btn--outline:hover{background:rgba(246,241,235,.14);color:var(--cj-cream)}
.cj-btn--solid{background:var(--cj-burgundy);color:var(--cj-cream)}
.cj-btn--solid:hover{background:var(--cj-blue);color:var(--cj-cream)}

.cj-link{
  font-size:12px;letter-spacing:.2em;text-transform:uppercase;
  border-bottom:1px solid var(--cj-burgundy);padding-bottom:3px;align-self:flex-start;
}

/* ---------- reveal animations ---------- */
@keyframes cjrise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes cjfade{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes cjmarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
[data-reveal]{opacity:0}
[data-reveal].is-in{animation:cjrise .9s var(--cj-ease) forwards}
.no-js [data-reveal]{opacity:1;animation:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  [data-reveal]{opacity:1!important;animation:none!important}
  .cj-marquee__track{animation:none!important}
  *{transition-duration:.01ms!important}
}

/* ---------- header ---------- */
.cj-header{
  position:fixed;top:0;left:0;right:0;z-index:90;
  display:flex;align-items:center;justify-content:space-between;gap:12px 28px;
  padding:16px var(--cj-gutter);
  background:rgba(72,32,34,.28);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  transition:background .45s ease;
}
.cj-header.is-scrolled{background:var(--cj-burgundy)}
.cj-header__brand{display:flex;align-items:center;height:40px}
/* Logo art is trimmed to its ink, so this height is the mark itself, not a padded canvas. */
.cj-header__brand img{height:38px;width:auto;max-width:220px;object-fit:contain;display:block}
.cj-header__brand .cj-wordmark{
  font-family:var(--cj-display);font-size:26px;color:var(--cj-cream);
  text-transform:uppercase;letter-spacing:.06em;
}
.cj-nav ul{display:flex;flex-wrap:wrap;gap:10px clamp(16px,2.4vw,38px);list-style:none;margin:0;padding:0}
.cj-nav a{color:var(--cj-cream);font-size:13px;letter-spacing:.2em;text-transform:uppercase}
.cj-nav a:hover,.cj-nav .current-menu-item>a{color:#e0c9ce}
.cj-header__cta{
  color:var(--cj-cream);border:1px solid rgba(246,241,235,.45);
  padding:9px 20px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;white-space:nowrap;
}
.cj-header__cta:hover{background:var(--cj-cream);color:var(--cj-burgundy)}
.cj-header__tools{display:flex;align-items:center;gap:16px}
.cj-cart-link{color:var(--cj-cream);font-size:11px;letter-spacing:.2em;text-transform:uppercase}
.cj-cart-link:hover{color:#e0c9ce}
.cj-burger{display:none;background:none;border:0;padding:8px;cursor:pointer}
.cj-burger span{display:block;width:24px;height:1px;background:var(--cj-cream);margin:5px 0;transition:transform .3s ease,opacity .3s ease}
.cj-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.cj-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.cj-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* ---------- hero ---------- */
.cj-hero{position:relative;height:100vh;min-height:640px;overflow:hidden;background:var(--cj-burgundy-deep)}
.cj-hero__media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 74%;display:block}
.cj-hero__scrim{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(66,30,30,.52) 0%,rgba(66,30,30,.12) 40%,rgba(66,30,30,.58) 100%);
}
.cj-hero__inner{
  position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);z-index:2;
  display:flex;flex-direction:column;align-items:center;gap:26px;
  padding:0 var(--cj-gutter);text-align:center;
}
.cj-hero__kicker{
  font-size:11px;letter-spacing:.4em;text-transform:uppercase;color:var(--cj-on-dark);
  animation:cjfade 1s ease both;
}
.cj-hero__title{
  font-family:var(--cj-display);font-size:clamp(48px,8vw,148px);line-height:.92;
  color:var(--cj-cream);text-transform:uppercase;animation:cjfade 1.1s .1s ease both;
}
.cj-hero__lede{
  margin:0;max-width:560px;font-size:clamp(16px,1.4vw,18px);line-height:1.7;
  color:rgba(246,241,235,.94);text-wrap:pretty;animation:cjfade 1.1s .25s ease both;
}
.cj-hero__actions{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;animation:cjfade 1.1s .4s ease both}
.cj-hero__meta{
  position:absolute;left:var(--cj-gutter);bottom:34px;z-index:2;display:flex;gap:40px;
  color:rgba(246,241,235,.88);font-size:11px;letter-spacing:.26em;text-transform:uppercase;
}
.cj-hero__scroll{
  position:absolute;right:var(--cj-gutter);bottom:34px;z-index:2;color:rgba(246,241,235,.88);
  font-size:11px;letter-spacing:.26em;text-transform:uppercase;
}
.cj-hero__scroll:hover{color:var(--cj-cream)}

/* ---------- marquee ---------- */
.cj-marquee{background:var(--cj-burgundy);color:var(--cj-cream);overflow:hidden;padding:18px 0;white-space:nowrap}
.cj-marquee__track{
  display:inline-flex;gap:52px;padding-right:52px;
  font-family:var(--cj-display);font-size:clamp(22px,2.6vw,30px);
  letter-spacing:.1em;text-transform:uppercase;
  animation:cjmarquee 40s linear infinite;
}
.cj-marquee__sep{opacity:.55}

/* ---------- brand intro ---------- */
.cj-brand{
  padding:clamp(64px,9vw,110px) var(--cj-gutter) clamp(56px,8vw,100px);
  display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,72px);align-items:center;
}
.cj-brand__copy{display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.cj-brand__statement{
  margin:0;font-family:var(--cj-display);font-size:clamp(26px,3.4vw,40px);
  line-height:1.3;text-wrap:pretty;
}
.cj-brand__body{margin:0;font-size:17px;line-height:1.8;color:var(--cj-muted);max-width:500px;text-wrap:pretty}
.cj-brand__grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.cj-brand__grid img{
  width:100%;aspect-ratio:1/1;object-fit:contain;background:var(--cj-panel);
  mix-blend-mode:multiply;display:block;
}
.cj-brand__grid img:nth-child(2){margin-top:40px}

/* ---------- collections ---------- */
.cj-collections{padding:0 var(--cj-gutter) clamp(72px,10vw,120px)}
.cj-filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.cj-filter{
  padding:9px 18px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  border:1px solid rgba(43,35,32,.22);background:transparent;color:var(--cj-muted);
  cursor:pointer;transition:all .3s ease;
}
.cj-filter:hover{border-color:var(--cj-burgundy);color:var(--cj-burgundy)}
.cj-filter.is-active{border-color:var(--cj-burgundy);background:var(--cj-burgundy);color:var(--cj-cream)}

.cj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:44px 32px;padding-top:52px}
.cj-card{display:flex;flex-direction:column;gap:18px}
.cj-card[hidden]{display:none}
.cj-card__media{
  position:relative;aspect-ratio:1/1;background:var(--cj-panel);overflow:hidden;
}
/* The link is the padded frame, so the badges stay pinned to the panel edges
   while the product gets breathing room. The renders are trimmed to their
   subject, so any oversizing here would crop them. */
.cj-card__media > a{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  padding:9%;
}
.cj-card__img{
  width:100%;height:100%;object-fit:contain;display:block;mix-blend-mode:multiply;
  transition:transform .7s var(--cj-ease),opacity .3s ease;
}
.cj-card:hover .cj-card__img{transform:scale(1.05)}
.cj-card__img.is-swapping{opacity:.35}
.cj-card__cat{
  position:absolute;top:14px;left:16px;font-size:10px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--cj-burgundy);
}
.cj-card__price{position:absolute;bottom:14px;right:16px;font-size:13px;color:var(--cj-muted)}
.cj-card__price del{opacity:.5;margin-right:6px}
.cj-card__foot{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.cj-card__names{display:flex;flex-direction:column;gap:6px}
.cj-card__title{font-family:var(--cj-display);font-size:clamp(22px,2vw,27px)}
.cj-card__title a{color:inherit}
.cj-card__title a:hover{color:var(--cj-burgundy)}
.cj-card__finish{font-size:13px;color:var(--cj-soft);letter-spacing:.04em}
.cj-swatches{display:flex;gap:8px;padding-top:8px;flex-wrap:wrap}
.cj-swatch{
  width:18px;height:18px;border-radius:50%;padding:0;cursor:pointer;
  border:1px solid rgba(43,35,32,.22);outline:none;outline-offset:-4px;
  transition:transform .25s ease,border-color .25s ease;
}
.cj-swatch:hover{transform:scale(1.12)}
.cj-swatch.is-active{border-color:var(--cj-ink);outline:2px solid var(--cj-cream);transform:scale(1.12)}
.cj-empty{
  grid-column:1/-1;padding:64px 24px;text-align:center;color:var(--cj-soft);
  border:1px dashed var(--cj-rule);
}
.cj-collections__more{display:flex;justify-content:center;padding-top:52px}

/* ---------- services ---------- */
.cj-services{background:var(--cj-cream-2)}
.cj-service{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,4.5vw,64px);align-items:center;
  padding:clamp(44px,6vw,72px) 0;border-bottom:1px solid var(--cj-rule-soft);
}
.cj-service:last-child{border-bottom:0;padding-bottom:0}
.cj-service__copy{display:flex;flex-direction:column;gap:20px;align-items:flex-start}
.cj-service__icon{width:88px;height:88px;object-fit:contain;object-position:left center;display:block}
.cj-service__title{font-family:var(--cj-display);font-size:clamp(30px,3.6vw,42px)}
.cj-service__body{margin:0;font-size:17px;line-height:1.75;color:var(--cj-muted);max-width:460px;text-wrap:pretty}
.cj-service__media{width:100%;height:clamp(280px,34vw,420px);object-fit:cover;display:block}
.cj-service__media--contain{object-fit:contain;mix-blend-mode:multiply}
.cj-service--flipped .cj-service__copy{order:2}
.cj-service--flipped .cj-service__media{order:1}

/* ---------- process ---------- */
.cj-steps{display:grid;grid-template-columns:repeat(4,1fr);padding-top:8px}
.cj-step{
  padding:44px 34px;display:flex;flex-direction:column;gap:16px;
  border-right:1px solid rgba(43,35,32,.14);transition:background .4s ease;
}
.cj-step:first-child{padding-left:0}
.cj-step:last-child{padding-right:0;border-right:0}
.cj-step:hover{background:var(--cj-cream-2)}
.cj-step__num{font-family:var(--cj-display);font-size:46px;color:var(--cj-burgundy);line-height:1}
.cj-step__title{font-size:22px;font-weight:500}
.cj-step p{margin:0;font-size:15px;line-height:1.75;color:var(--cj-muted)}

/* ---------- about / personality ---------- */
.cj-about{
  background-color:var(--cj-blue);background-repeat:repeat;background-size:560px auto;
  background-blend-mode:multiply;color:var(--cj-cream);
}
.cj-about__layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(36px,6vw,80px);align-items:start}
.cj-about__intro{display:flex;flex-direction:column;gap:16px}
.cj-about__intro .cj-eyebrow{color:inherit;opacity:.85}
.cj-about__title{font-family:var(--cj-display);font-size:clamp(34px,4.6vw,56px);line-height:1.1;text-wrap:pretty}
.cj-about__lede{margin:8px 0 0;font-size:15px;line-height:1.8;opacity:.9;max-width:380px;text-wrap:pretty}
.cj-traits{display:grid;grid-template-columns:1fr 1fr;gap:40px 56px}
.cj-trait{display:flex;flex-direction:column;gap:10px;border-top:1px solid rgba(246,241,235,.4);padding-top:18px}
.cj-trait h3{font-family:var(--cj-display);font-size:26px}
.cj-trait p{margin:0;font-size:15px;line-height:1.75;opacity:.92}

/* ---------- closing cta ---------- */
.cj-cta{position:relative}
.cj-cta__media{width:100%;height:clamp(360px,46vw,560px);object-fit:cover;object-position:50% 78%;display:block}
.cj-cta__overlay{
  position:absolute;inset:0;background:rgba(72,32,34,.34);
  display:flex;align-items:center;justify-content:center;
}
.cj-cta__inner{text-align:center;display:flex;flex-direction:column;gap:26px;align-items:center;padding:0 24px}
.cj-cta__title{
  font-family:var(--cj-display);font-size:clamp(30px,5vw,62px);line-height:1.1;
  color:var(--cj-cream);text-wrap:pretty;
}

/* ---------- footer ---------- */
.cj-footer{
  background-color:var(--cj-burgundy);background-repeat:repeat;background-size:560px auto;
  background-blend-mode:multiply;color:var(--cj-cream);
  padding:clamp(64px,9vw,104px) var(--cj-gutter) 40px;
}
/* :not(.cj-btn) so this does not outrank .cj-btn--light and blank out the CTA label. */
.cj-footer a:not(.cj-btn){color:var(--cj-cream)}
.cj-footer a:not(.cj-btn):hover{color:#e0c9ce}
.cj-footer__top{
  display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:clamp(32px,5vw,64px);align-items:start;
  border-bottom:1px solid rgba(246,241,235,.28);padding-bottom:clamp(40px,6vw,64px);
}
.cj-footer__lead{display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.cj-footer__lead .cj-eyebrow{color:inherit;opacity:.8}
.cj-footer__title{font-family:var(--cj-display);font-size:clamp(38px,5.4vw,62px);line-height:1.02}
.cj-footer__col{display:flex;flex-direction:column;gap:16px;font-size:15px;line-height:1.6}
.cj-footer__col h2{font-size:11px;letter-spacing:.24em;text-transform:uppercase;opacity:.7;font-weight:400}
.cj-footer__col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.cj-footer__bottom{
  display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;padding-top:26px;
  font-size:11px;letter-spacing:.22em;text-transform:uppercase;opacity:.75;
}

/* ---------- projects ---------- */
.cj-grid--projects{padding-top:44px}
.cj-project-card__media{
  position:relative;display:block;aspect-ratio:4/3;overflow:hidden;
  background:var(--cj-panel);
}
.cj-project-card__img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .8s var(--cj-ease);
}
.cj-project-card:hover .cj-project-card__img{transform:scale(1.04)}
.cj-project-card__placeholder{position:absolute;inset:0;background:var(--cj-cream-2)}
.cj-project-card .cj-card__cat{
  background:var(--cj-cream);padding:5px 10px;top:0;left:0;
}

.cj-project__head{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);align-items:end;
  border-bottom:1px solid var(--cj-rule);padding-bottom:24px;margin-bottom:44px;
}
.cj-project__intro{max-width:52ch;font-size:16px}
.cj-project__lead img{width:100%;height:auto;display:block}
.cj-project__lead{margin:0 0 clamp(24px,4vw,44px)}
.cj-project__gallery{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,32px);
}
.cj-project__shot{margin:0}
.cj-project__shot img{width:100%;height:100%;object-fit:cover;display:block}
.cj-project__shot--wide{grid-column:1/-1}
.cj-project__nav{
  display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;align-items:center;
  border-top:1px solid var(--cj-rule);margin-top:clamp(40px,6vw,72px);padding-top:28px;
}
.cj-project__nav .cj-link{align-self:auto}

/* ---------- editorial (blog / pages / shop) ---------- */
.cj-page{padding:calc(96px + clamp(40px,6vw,80px)) var(--cj-gutter) clamp(64px,9vw,110px)}
.cj-page__header{border-bottom:1px solid var(--cj-rule);padding-bottom:24px;margin-bottom:44px}
.cj-page__title{font-family:var(--cj-display);font-size:clamp(38px,6vw,68px);line-height:1}
.cj-prose{max-width:72ch;font-size:17px;line-height:1.8;color:var(--cj-muted)}
.cj-prose h2,.cj-prose h3{font-family:var(--cj-display);color:var(--cj-ink);margin:2em 0 .6em;line-height:1.2}
.cj-prose h2{font-size:32px}
.cj-prose h3{font-size:24px}
.cj-prose img{display:block;margin:2em 0}
.cj-prose blockquote{
  margin:2em 0;padding-left:24px;border-left:2px solid var(--cj-burgundy);
  font-family:var(--cj-display);font-size:24px;line-height:1.4;color:var(--cj-ink);
}
.cj-posts{display:grid;grid-template-columns:repeat(3,1fr);gap:44px 32px}
.cj-post__thumb{aspect-ratio:4/3;object-fit:cover;width:100%;display:block;background:var(--cj-panel)}
.cj-post__title{font-family:var(--cj-display);font-size:27px;margin:16px 0 8px}
.cj-post__meta{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--cj-soft)}
.cj-pagination{display:flex;gap:10px;padding-top:56px;flex-wrap:wrap}
.cj-pagination .page-numbers{
  padding:10px 16px;border:1px solid var(--cj-rule);font-size:12px;letter-spacing:.16em;color:var(--cj-muted);
}
.cj-pagination .page-numbers.current,.cj-pagination .page-numbers:hover{
  background:var(--cj-burgundy);border-color:var(--cj-burgundy);color:var(--cj-cream);
}

/* "View piece" reveal on hover — the card's only affordance beyond the image. */
.cj-card__view{
  position:absolute;left:50%;bottom:16px;transform:translate(-50%,12px);
  background:var(--cj-cream);color:var(--cj-burgundy);
  padding:11px 22px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  opacity:0;pointer-events:none;transition:opacity .35s ease,transform .35s var(--cj-ease);
  white-space:nowrap;z-index:3;
}
.cj-card:hover .cj-card__view,.cj-card__view:focus-visible{
  opacity:1;transform:translate(-50%,0);pointer-events:auto;
}
@media (hover:none){ .cj-card__view{display:none} }

/* ---------- shop ---------- */
.cj-shop-head{margin-bottom:8px}
.cj-shop-head .cj-page__title{font-size:clamp(38px,6vw,68px)}
a.cj-filter{text-decoration:none;display:inline-block}

.woocommerce ul.products,
.woocommerce-page ul.products{
  display:grid;grid-template-columns:repeat(3,1fr);gap:44px 32px;
  margin:0;padding:52px 0 0;list-style:none;
}
.woocommerce ul.products::before,.woocommerce ul.products::after{content:none}
.woocommerce ul.products li.product{
  width:auto!important;margin:0!important;float:none!important;clear:none!important;
}
.woocommerce ul.products li.product::before,
.woocommerce ul.products li.product::after{content:none}
.cj-shop-item .cj-card{opacity:1}

.woocommerce .woocommerce-ordering{margin:0 0 8px}
.woocommerce .woocommerce-ordering select{
  border:1px solid var(--cj-rule);background:transparent;padding:10px 14px;
  font-family:inherit;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--cj-muted);
}

/* ---------- single product ---------- */
.woocommerce div.product{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,72px);align-items:start}
.woocommerce div.product div.images,
.woocommerce div.product div.summary{width:auto!important;float:none!important;margin:0!important}
.woocommerce div.product div.images img{background:var(--cj-panel)}
.woocommerce div.product .flex-control-thumbs{display:flex;gap:10px;margin-top:12px;padding:0}
.woocommerce div.product .flex-control-thumbs li{width:auto;margin:0;float:none}
.woocommerce div.product .flex-control-thumbs img{width:74px;height:74px;object-fit:contain;background:var(--cj-panel)}
.cj-single__cat{display:block;margin-bottom:10px}
.woocommerce div.product .product_title{margin:0 0 12px}
.woocommerce div.product .woocommerce-product-details__short-description{
  font-size:16px;line-height:1.8;color:var(--cj-muted);max-width:52ch;
}
.woocommerce div.product form.cart{margin:28px 0;display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
.woocommerce div.product form.cart .variations{width:100%;margin-bottom:8px}
.woocommerce div.product form.cart .variations td,
.woocommerce div.product form.cart .variations th{padding:8px 0;border:0}
.woocommerce div.product form.cart .variations label{
  font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--cj-soft);font-weight:400;
}
.woocommerce div.product form.cart .variations select{
  border:1px solid var(--cj-rule);background:transparent;padding:12px 14px;
  font-family:inherit;font-size:14px;color:var(--cj-ink);min-width:220px;
}
.woocommerce div.product form.cart div.quantity{margin:0}
.woocommerce .quantity input.qty{
  border:1px solid var(--cj-rule);background:transparent;padding:15px 8px;
  font-family:inherit;font-size:15px;color:var(--cj-ink);width:72px;text-align:center;
}
.woocommerce div.product .woocommerce-tabs{grid-column:1/-1;margin-top:clamp(32px,5vw,64px)}
.woocommerce div.product .woocommerce-tabs ul.tabs{padding:0;margin:0 0 28px;border-bottom:1px solid var(--cj-rule)}
.woocommerce div.product .woocommerce-tabs ul.tabs::before{border:0}
.woocommerce div.product .woocommerce-tabs ul.tabs li{
  background:transparent;border:0;border-radius:0;margin:0 28px 0 0;padding:0 0 14px;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after{content:none;border:0;box-shadow:none}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{
  font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--cj-soft);padding:0;font-weight:400;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{color:var(--cj-burgundy)}
.woocommerce div.product .woocommerce-tabs .panel{max-width:72ch;font-size:16px;line-height:1.8;color:var(--cj-muted)}
.woocommerce .related.products,.woocommerce .upsells.products{grid-column:1/-1;margin-top:clamp(40px,6vw,80px)}
.woocommerce .related.products > h2,.woocommerce .upsells.products > h2{
  font-family:var(--cj-display);font-size:clamp(28px,3.4vw,42px);font-weight:400;
  border-bottom:1px solid var(--cj-rule);padding-bottom:20px;
}

/* ---------- woocommerce ---------- */
.woocommerce .button,.woocommerce a.button,.woocommerce button.button,
.woocommerce input.button,.woocommerce #respond input#submit{
  background:var(--cj-burgundy);color:var(--cj-cream);border-radius:0;
  font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:400;
  padding:17px 32px;transition:background .35s ease;
}
.woocommerce .button:hover,.woocommerce a.button:hover,.woocommerce button.button:hover,
.woocommerce input.button:hover,.woocommerce #respond input#submit:hover{
  background:var(--cj-blue);color:var(--cj-cream);
}
.woocommerce .button.alt,.woocommerce button.button.alt{background:var(--cj-burgundy);color:var(--cj-cream)}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:var(--cj-display);font-size:24px;font-weight:400;
}
.woocommerce ul.products li.product .price{color:var(--cj-muted);font-size:15px}
.woocommerce ul.products li.product img{background:var(--cj-panel);mix-blend-mode:multiply}
.woocommerce span.onsale{
  background:var(--cj-burgundy);border-radius:0;font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;padding:6px 14px;min-height:0;min-width:0;line-height:1.4;
}
.woocommerce div.product .product_title{font-family:var(--cj-display);font-size:clamp(32px,4vw,52px);font-weight:400}
.woocommerce div.product p.price,.woocommerce div.product span.price{color:var(--cj-burgundy);font-size:24px}
.woocommerce .woocommerce-message,.woocommerce .woocommerce-info{border-top-color:var(--cj-burgundy)}
.woocommerce .woocommerce-message::before,.woocommerce .woocommerce-info::before{color:var(--cj-burgundy)}
.woocommerce-breadcrumb{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--cj-soft)}
.woocommerce nav.woocommerce-pagination ul{border:0;display:flex;gap:10px}
.woocommerce nav.woocommerce-pagination ul li{border:0}
.woocommerce nav.woocommerce-pagination ul li a,.woocommerce nav.woocommerce-pagination ul li span{
  border:1px solid var(--cj-rule);padding:10px 16px;
}
.woocommerce nav.woocommerce-pagination ul li span.current{background:var(--cj-burgundy);color:var(--cj-cream)}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .cj-grid,.cj-posts{grid-template-columns:repeat(2,1fr)}
  .woocommerce ul.products,.woocommerce-page ul.products{grid-template-columns:repeat(2,1fr)}
  .woocommerce div.product{grid-template-columns:1fr}
  .cj-steps{grid-template-columns:repeat(2,1fr)}
  .cj-step{padding:32px 28px}
  .cj-step:nth-child(2){border-right:0}
  .cj-step:nth-child(-n+2){border-bottom:1px solid rgba(43,35,32,.14)}
  .cj-step:nth-child(3){padding-left:0}
  .cj-footer__top{grid-template-columns:1fr 1fr}
  .cj-footer__lead{grid-column:1/-1}
}
@media (max-width:900px){
  .cj-burger{display:block}
  .cj-header{flex-wrap:wrap}
  .cj-nav{
    flex-basis:100%;display:none;order:3;
    border-top:1px solid rgba(246,241,235,.25);margin-top:12px;padding-top:16px;
  }
  .cj-header.is-open{background:var(--cj-burgundy)}
  .cj-header.is-open .cj-nav{display:block}
  .cj-nav ul{flex-direction:column;gap:14px}
  .cj-header__cta{display:none}
  .cj-header.is-open .cj-header__cta{display:inline-block;margin-top:4px}
  .cj-brand,.cj-about__layout,.cj-service{grid-template-columns:1fr}
  .cj-service--flipped .cj-service__copy{order:0}
  .cj-service--flipped .cj-service__media{order:0}
  .cj-hero{height:auto;min-height:0;padding:140px 0 96px}
  .cj-hero__inner{position:static;transform:none}
  .cj-hero__meta{position:static;justify-content:center;margin-top:32px}
  .cj-hero__scroll{display:none}
}
@media (max-width:900px){
  .cj-project__head{grid-template-columns:1fr}
}
@media (max-width:640px){
  .cj-grid,.cj-posts,.cj-traits{grid-template-columns:1fr}
  .woocommerce ul.products,.woocommerce-page ul.products{grid-template-columns:1fr}
  .cj-project__gallery{grid-template-columns:1fr}
  .cj-project__nav{flex-direction:column;align-items:flex-start;gap:14px}
  .cj-steps{grid-template-columns:1fr}
  .cj-step{padding:28px 0;border-right:0;border-bottom:1px solid rgba(43,35,32,.14)}
  .cj-step:last-child{border-bottom:0}
  .cj-brand__grid img:nth-child(2){margin-top:0}
  .cj-section-head{align-items:flex-start}
  .cj-footer__top{grid-template-columns:1fr}
  .cj-hero__actions .cj-btn{width:100%}
}