/* ==========================================================================
   Chat with Jeff — stili di sezione. Valori (colori, font, spaziature,
   raggi, ombre) presi 1:1 dal design approvato. I token globali (colori,
   font, container) vivono in style.css.
   ========================================================================== */

/* --------------------------------------------------------------------
   Sfumature che pulsano lentissime, sullo sfondo di alcune sezioni
   -------------------------------------------------------------------- */
@keyframes cwjDriftA {
  0%   { transform: translate3d(0,0,0) scale(1); opacity: 0.55; }
  50%  { transform: translate3d(6%,-5%,0) scale(1.14); opacity: 1; }
  100% { transform: translate3d(0,0,0) scale(1); opacity: 0.55; }
}
@keyframes cwjDriftB {
  0%   { transform: translate3d(0,0,0) scale(1.08); opacity: 1; }
  50%  { transform: translate3d(-7%,6%,0) scale(1); opacity: 0.5; }
  100% { transform: translate3d(0,0,0) scale(1.08); opacity: 1; }
}
.cwj-drift { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.cwj-drift span { position: absolute; inset: -15%; pointer-events: none; }
.cwj-drift .is-a { animation: cwjDriftA 90s ease-in-out infinite; }
.cwj-drift .is-b { animation: cwjDriftB 112s ease-in-out infinite; }

/* --------------------------------------------------------------------
   Intro a schermo intero: la frase si forma grande e si sposta al suo
   posto nella hero (4s), poi scompare.
   -------------------------------------------------------------------- */
@keyframes cwjIntroFallback {
  to { opacity: 0; visibility: hidden; pointer-events: none; }
}
.cwj-intro {
  position: fixed; inset: 0; z-index: 200; background: var(--cwj-white);
  display: flex; align-items: center; justify-content: center; padding: 0 7vw;
  /* Rete di sicurezza indipendente da main.js: se per qualunque motivo lo
     script non riprende il controllo dell'overlay (plugin che ritardano
     gli script, un errore altrove nella pagina...), questa sparisce da
     sola dopo 6s invece di restare bloccata sopra il sito per sempre. */
  animation: cwjIntroFallback 1ms linear 6s forwards;
}
.cwj-intro__line {
  font-family: var(--cwj-font-display); font-weight: 400;
  font-size: 76px; line-height: 1.14; letter-spacing: -0.028em;
  color: var(--cwj-ink); text-align: left; transform-origin: left top;
  will-change: transform;
  /* Di default invisibile (anche in HTML, vedi header.php): evita che la
     frase intera lampeggi un istante prima che lo script la riscriva in
     parole animate. Lo script la riporta a opacity:1 nello stesso tick in
     cui ricostruisce le parole, quindi non si vede mai la frase "grezza". */
  opacity: 0;
}
.cwj-intro__word { display: inline-block; opacity: 0; filter: blur(9px); transform: translate3d(0,14px,0); }

/* --------------------------------------------------------------------
   Header
   -------------------------------------------------------------------- */
.cwj-header {
  position: sticky; top: 0; z-index: 60; height: var(--cwj-header-h);
  background: rgba(255,255,255,0.9); backdrop-filter: blur(18px);
  border-bottom: 1px solid var(--cwj-line);
}
.cwj-header__bar {
  max-width: var(--cwj-container); height: 86px; margin: 0 auto;
  padding: 0 clamp(24px, 4vw, 0px);
  display: flex; align-items: center; justify-content: space-between;
  gap: 28px; flex-wrap: wrap;
  position: relative;
}
.cwj-header__brand { display: block; }
.cwj-header__brand img { width: 218px; height: 58px; object-fit: contain; display: block; }
.cwj-header__nav { display: flex; align-items: center; gap: clamp(16px,1.8vw,34px); flex-wrap: wrap; }
.cwj-header__nav a { font-family: var(--cwj-font-ui); font-size: 14px; line-height: 24.08px; color: var(--cwj-ink); }
.cwj-header__cta {
  display: inline-flex; align-items: center; justify-content: center; height: 48.08px;
  padding: 0 18px; border-radius: var(--cwj-radius-pill);
  box-shadow: inset 0 0 0 1px var(--cwj-ink); font-weight: 500; white-space: nowrap;
  transition: background-color 220ms ease, color 220ms ease;
}
.cwj-header__cta:hover { background: var(--cwj-ink-button); color: var(--cwj-cream); }

.cwj-nav-toggle { display: none; }

/* --------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------- */
.cwj-hero { position: relative; overflow: hidden; background: var(--cwj-white); }
.cwj-hero__video-wrap {
  position: absolute; inset: 0; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
}
.cwj-hero__video-wrap > div { width: var(--cwj-container); max-width: 100%; display: flex; justify-content: center; }
.cwj-hero__video {
  width: 50%; height: auto; opacity: 0.5; display: block;
  /* Promuove il video a un suo layer di compositing: su Safari, un video
     che sta sotto un elemento con backdrop-filter (l'header sticky sfocato)
     può scattare perché il browser lo ridipinge insieme al resto invece
     di trattarlo come layer indipendente. */
  transform: translateZ(0);
  will-change: transform;
}
.cwj-hero__wash { position: absolute; inset: 0; background: linear-gradient(rgba(255,255,255,0.62), rgba(255,255,255,0.78)); }
.cwj-hero__inner { position: relative; max-width: var(--cwj-container-wide); margin: 0 auto; padding: 150px var(--cwj-container-pad) 96px; }
.cwj-hero__row {
  max-width: var(--cwj-container); margin: 0 auto; display: flex; flex-wrap: wrap;
  gap: 72px; align-items: center; justify-content: center;
}
.cwj-hero__copy { flex: 1 1 100%; min-width: 0; max-width: 50vw; width: 46vw; }
.cwj-hero__copy .cwj-eyebrow { margin-bottom: 22px; }
.cwj-hero__title {
  font-family: var(--cwj-font-display); font-weight: 400; font-size: clamp(52px,5.4vw,96px);
  line-height: 1; letter-spacing: -0.035em; color: var(--cwj-ink); margin: 0 0 30px;
}
.cwj-hero__title em { font-style: normal; color: var(--cwj-taupe); }
.cwj-hero__subtitle {
  font-family: var(--cwj-font-display); font-weight: 400; font-size: clamp(27px,2.3vw,40px);
  line-height: 1.18; color: var(--cwj-black); margin: 0 0 36px; max-width: 790px;
}
.cwj-hero__paragraphs { display: flex; flex-direction: column; gap: 16px; max-width: 688px; }
.cwj-hero__paragraphs p { font-family: var(--cwj-font-body); font-size: 15px; line-height: 27.5px; color: var(--cwj-brown); }
.cwj-hero__actions { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 38px; }
.cwj-hero__microcopy {
  font-family: var(--cwj-font-body); font-size: 11px; line-height: 22.36px; letter-spacing: 0.4px;
  text-transform: uppercase; color: var(--cwj-brown);
}

/* --------------------------------------------------------------------
   Choice cards (Chat with Jeff / Open Workshops)
   -------------------------------------------------------------------- */
.cwj-choice { position: relative; background: var(--cwj-white); }
.cwj-choice__inner { max-width: var(--cwj-container-wide); margin: 0 auto; padding: 0 var(--cwj-container-pad) 110px; }
.cwj-choice__grid {
  max-width: var(--cwj-container); margin: 0 auto; display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(380px, 100%), 1fr)); gap: 28px;
}
.cwj-choice__card {
  border-radius: var(--cwj-radius-card); box-shadow: inset 0 0 0 1px var(--cwj-line), var(--cwj-shadow-card);
  padding: 44px 42px 40px; display: flex; flex-direction: column; min-width: 0;
}
.cwj-choice__card.is-chat { background: var(--cwj-cream); }
.cwj-choice__card.is-workshop { background: var(--cwj-sand); }
.cwj-choice__card .cwj-eyebrow { margin-bottom: 22px; }
.cwj-choice__card.is-chat .cwj-eyebrow { font-size: 8px; }
.cwj-choice__card h2 {
  font-family: var(--cwj-font-display); font-weight: 400; font-size: clamp(34px,2.6vw,44px);
  line-height: 1.05; letter-spacing: -0.035em; color: var(--cwj-ink); margin: 0 0 8px;
}
.cwj-choice__card .cwj-choice__tagline { font-family: var(--cwj-font-display); font-size: 25px; line-height: 34px; color: var(--cwj-black); margin-bottom: 20px; }
.cwj-choice__card p.cwj-choice__desc { font-family: var(--cwj-font-body); font-size: 16px; line-height: 27.5px; color: var(--cwj-brown); margin-bottom: 34px; }
.cwj-choice__card .cwj-btn { margin-top: auto; align-self: flex-start; }

/* --------------------------------------------------------------------
   Sezioni con eyebrow numerata ("01 · Introduction" ecc.)
   -------------------------------------------------------------------- */
.cwj-section-head { display: flex; flex-wrap: wrap; gap: 22px 0; align-items: start; margin-bottom: 62px; }
.cwj-section-head__index { flex: 0 0 192px; max-width: 100%; padding-top: 9px; }
.cwj-section-head__index .cwj-rule { width: 60px; height: 1px; background: var(--cwj-line); margin-bottom: 8px; }
.cwj-section-head__index span { font-family: var(--cwj-font-ui); font-size: 12px; line-height: 20.64px; letter-spacing: 2.16px; color: var(--cwj-brown); }
.cwj-section-head__index.is-wide { flex-basis: 533px; }
.cwj-section-head__body { flex: 1 1 560px; min-width: 0; }
.cwj-section-head__body h2 {
  font-family: var(--cwj-font-display); font-weight: 400; font-size: clamp(40px,4.4vw,76px);
  line-height: 1.03; letter-spacing: -0.035em; color: var(--cwj-ink); margin: 0 0 22px;
}
.cwj-section-head__body .cwj-lead { font-family: var(--cwj-font-display); font-size: 25px; line-height: 34px; color: var(--cwj-black); }
.cwj-section-head__eyebrow { font-family: var(--cwj-font-ui); font-weight: 600; font-size: 12px; line-height: 20.64px; letter-spacing: 2.4px; text-transform: uppercase; color: var(--cwj-taupe); margin-bottom: 18px; }
.cwj-index-label { display: block; font-family: var(--cwj-font-ui); font-size: 12px; line-height: 20.64px; letter-spacing: 2.16px; color: var(--cwj-brown); }

/* --------------------------------------------------------------------
   About ("What is the Chat with Jeff?")
   -------------------------------------------------------------------- */
.cwj-about { background: var(--cwj-white); }
.cwj-about__inner { max-width: var(--cwj-container-wide); margin: 0 auto; padding: 108px var(--cwj-container-pad); }
.cwj-about__container { max-width: var(--cwj-container); margin: 0 auto; }
.cwj-about .cwj-section-head { margin-bottom: 62px; }
.cwj-about .cwj-section-head__body h2 { margin-bottom: 20px; }
.cwj-about .cwj-section-head__body .cwj-lead { max-width: 1277px; }
.cwj-about__columns { display: flex; flex-wrap: wrap; gap: 64px; justify-content: space-between; align-items: start; }
.cwj-about__text { flex: 1 1 460px; min-width: 0; max-width: 760px; display: flex; flex-direction: column; gap: 22px; }
.cwj-about__text p { font-family: var(--cwj-font-body); font-size: 16px; line-height: 27.5px; color: var(--cwj-brown); }
.cwj-about__text p.is-lead { font-weight: 800; font-size: 18.5px; line-height: 32px; color: var(--cwj-ink); }

.cwj-glance {
  flex: 1 1 380px; min-width: 0; max-width: 557px; border-radius: var(--cwj-radius-card);
  background: var(--cwj-cream); box-shadow: inset 0 0 0 1px var(--cwj-line), var(--cwj-shadow-card); padding: 35px;
}
.cwj-glance.is-sand { background: var(--cwj-sand); }
.cwj-glance h3 { font-family: var(--cwj-font-display); font-weight: 400; font-size: 32px; line-height: 31.36px; letter-spacing: -1.12px; color: var(--cwj-ink); margin: 0 0 24px; }
.cwj-glance__row { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; height: 55.078px; border-bottom: 1px solid var(--cwj-line); }
.cwj-glance__row:last-child { border-bottom: none; }
.cwj-glance__row span:first-child { font-family: var(--cwj-font-ui); font-size: 14px; line-height: 24.08px; color: var(--cwj-brown); }
.cwj-glance__row span:last-child { font-family: var(--cwj-font-ui); font-weight: 500; font-size: 14px; line-height: 24.08px; text-align: right; color: var(--cwj-ink); }

/* --------------------------------------------------------------------
   Experience ("What happens during the hour?")
   -------------------------------------------------------------------- */
.cwj-experience { position: relative; overflow: hidden; background: var(--cwj-sand); }
.cwj-experience .is-a { background: radial-gradient(48% 48% at 22% 30%, rgba(185,166,200,0.30) 0%, rgba(0,0,0,0) 68%); }
.cwj-experience .is-b { background: radial-gradient(44% 44% at 78% 72%, rgba(174,148,119,0.26) 0%, rgba(0,0,0,0) 66%); }
.cwj-experience__inner { position: relative; max-width: var(--cwj-container-wide); margin: 0 auto; padding: 94px var(--cwj-container-pad) 100px; }
.cwj-experience__container { max-width: var(--cwj-container); margin: 0 auto; }
.cwj-experience__container > h2 {
  font-family: var(--cwj-font-display); font-weight: 400; font-size: clamp(40px,4.4vw,76px);
  line-height: 1.08; letter-spacing: -0.035em; color: var(--cwj-ink); margin: 14px 0 0;
}
.cwj-experience__gallery { margin-top: 60px; border-radius: var(--cwj-radius-card-lg); overflow: hidden; box-shadow: var(--cwj-shadow-card-lg); }
.cwj-experience__gallery img { display: block; width: 100%; height: auto; }
.cwj-experience__grid { margin-top: 36px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: 33px; }
.cwj-experience__step {
  border-radius: var(--cwj-radius-card); background: var(--cwj-cream); box-shadow: inset 0 0 0 1px var(--cwj-line), var(--cwj-shadow-card);
  padding: 32px; display: flex; flex-direction: column; gap: 18px; min-width: 0;
}
.cwj-experience__step span:first-child { font-family: var(--cwj-font-display); font-weight: 400; font-size: 29px; line-height: 36px; letter-spacing: -1.12px; color: var(--cwj-ink); }
.cwj-experience__step span:last-child { font-family: var(--cwj-font-body); font-size: 15px; line-height: 24px; color: var(--cwj-brown); }

/* --------------------------------------------------------------------
   Public conversations (#conversations)
   -------------------------------------------------------------------- */
.cwj-conversations { position: relative; overflow: hidden; background: var(--cwj-sand); border-top: 1px solid var(--cwj-line-soft); scroll-margin-top: var(--cwj-header-h); }
.cwj-conversations .is-a { background: radial-gradient(48% 48% at 22% 30%, rgba(145,174,192,0.26) 0%, rgba(0,0,0,0) 68%); }
.cwj-conversations .is-b { background: radial-gradient(44% 44% at 78% 72%, rgba(185,166,200,0.24) 0%, rgba(0,0,0,0) 66%); }
.cwj-conversations__ring {
  position: absolute; right: -180px; top: 90px; width: 420px; height: 420px; border-radius: 50px;
  box-shadow: inset 0 0 0 1px rgba(32,49,45,0.09), 0px 0px 0px 70px rgba(32,49,45,0.024), 0px 0px 0px 140px rgba(32,49,45,0.02);
}
.cwj-conversations__inner { position: relative; max-width: var(--cwj-container-wide); margin: 0 auto; padding: 108px var(--cwj-container-pad); }
.cwj-conversations__container { max-width: var(--cwj-container); margin: 0 auto; }
.cwj-conversations__container .cwj-section-head__body .cwj-lead { max-width: 729px; }
.cwj-conversations__list { display: flex; flex-direction: column; gap: 22px; }
.cwj-conversations__note { font-family: var(--cwj-font-ui); font-size: 13px; line-height: 22.36px; color: var(--cwj-brown); margin-top: 52px; }
.cwj-conversations__empty { font-family: var(--cwj-font-body); font-size: 16px; line-height: 27.5px; color: var(--cwj-brown); }

/* --------------------------------------------------------------------
   Event cards (chat + workshop) — condivise fra conversations e workshops
   -------------------------------------------------------------------- */
.cwj-event-card {
  border-radius: var(--cwj-radius-card); padding: clamp(28px,3vw,45px);
  display: flex; flex-wrap: wrap; gap: 34px; align-items: center;
  transition: transform 340ms cubic-bezier(0.22,0.61,0.36,1), box-shadow 340ms ease;
}
.cwj-event-card__date { flex: 0 0 auto; min-width: 200px; padding-right: 34px; }
.cwj-event-card__day { font-family: var(--cwj-font-display); font-size: 70px; line-height: 56px; letter-spacing: -4.2px; }
.cwj-event-card__month { font-family: var(--cwj-font-display); font-size: 34px; line-height: 44px; letter-spacing: -1.12px; }
.cwj-event-card__year { font-family: var(--cwj-font-ui); font-size: 11px; line-height: 18.92px; letter-spacing: 1.76px; }
.cwj-event-card__body { flex: 1 1 380px; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.cwj-event-card__kicker, .cwj-event-card__meta { font-family: var(--cwj-font-ui); font-size: 11px; line-height: 18.92px; letter-spacing: 1.76px; text-transform: uppercase; }
.cwj-event-card__title { font-family: var(--cwj-font-display); font-weight: 400; font-size: clamp(29px,2.3vw,40px); line-height: 1.1; letter-spacing: -0.035em; }
.cwj-event-card__desc { font-family: var(--cwj-font-body); font-size: 15px; line-height: 24px; max-width: 926px; }
.cwj-event-card__details { font-family: var(--cwj-font-ui); font-size: 13px; line-height: 22.36px; }
.cwj-event-card__cta {
  display: inline-flex; align-items: center; justify-content: space-between; gap: 14px;
  width: 231.547px; height: 54px; padding: 0 25px; border-radius: var(--cwj-radius-pill);
  font-family: var(--cwj-font-ui); font-weight: 600; font-size: 14px; white-space: nowrap;
}
.cwj-event-card__cta .cwj-arrow { font-size: 19px; line-height: 19px; }
.cwj-event-card__side { flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-end; gap: 18px; }
.cwj-event-card__price { font-family: var(--cwj-font-display); font-size: 34px; line-height: 38px; letter-spacing: -1.12px; color: var(--cwj-taupe); }

/* Chat with Jeff — alterna scuro/chiaro */
.cwj-event-card--chat.is-dark {
  background: var(--cwj-gold); box-shadow: inset 0 0 0 1px rgba(0,0,0,0);
}
.cwj-event-card--chat.is-dark:hover { box-shadow: var(--cwj-shadow-hover); }
.cwj-event-card--chat.is-dark .cwj-event-card__date { border-right: 1px solid rgba(255,255,255,0.2); }
.cwj-event-card--chat.is-dark .cwj-event-card__day,
.cwj-event-card--chat.is-dark .cwj-event-card__month,
.cwj-event-card--chat.is-dark .cwj-event-card__title { color: var(--cwj-cream); }
.cwj-event-card--chat.is-dark .cwj-event-card__year,
.cwj-event-card--chat.is-dark .cwj-event-card__kicker,
.cwj-event-card--chat.is-dark .cwj-event-card__meta { color: rgba(255,255,255,0.72); }
.cwj-event-card--chat.is-dark .cwj-event-card__desc { color: rgba(255,255,255,0.92); }
.cwj-event-card--chat.is-dark .cwj-event-card__cta { background: var(--cwj-cream); box-shadow: inset 0 0 0 1px var(--cwj-cream); color: var(--cwj-taupe); }

.cwj-event-card--chat.is-light {
  background: rgba(255,253,249,0.72); box-shadow: inset 0 0 0 1px var(--cwj-line-softer);
}
.cwj-event-card--chat.is-light:hover { box-shadow: var(--cwj-shadow-hover); }
.cwj-event-card--chat.is-light .cwj-event-card__date { border-right: 1px solid var(--cwj-line); }
.cwj-event-card--chat.is-light .cwj-event-card__day,
.cwj-event-card--chat.is-light .cwj-event-card__month,
.cwj-event-card--chat.is-light .cwj-event-card__title { color: var(--cwj-ink); }
.cwj-event-card--chat.is-light .cwj-event-card__year,
.cwj-event-card--chat.is-light .cwj-event-card__kicker,
.cwj-event-card--chat.is-light .cwj-event-card__meta { color: var(--cwj-taupe); }
.cwj-event-card--chat.is-light .cwj-event-card__desc { color: var(--cwj-brown); }
.cwj-event-card--chat.is-light .cwj-event-card__cta { background: var(--cwj-ink-button); box-shadow: inset 0 0 0 1px var(--cwj-gold); color: var(--cwj-cream); }

.cwj-event-card:hover { transform: translateY(-4px); }

/* Open Workshop — sempre card chiara */
.cwj-event-card--workshop {
  background: var(--cwj-cream); box-shadow: inset 0 0 0 1px var(--cwj-line-softer);
}
.cwj-event-card--workshop:hover { box-shadow: inset 0 0 0 1px var(--cwj-line-softer), 0px 26px 60px 0px rgba(32,49,45,0.15); }
.cwj-event-card--workshop .cwj-event-card__date { border-right: 1px solid var(--cwj-line); }
.cwj-event-card--workshop .cwj-event-card__day,
.cwj-event-card--workshop .cwj-event-card__month,
.cwj-event-card--workshop .cwj-event-card__title { color: var(--cwj-ink); }
.cwj-event-card--workshop .cwj-event-card__year,
.cwj-event-card--workshop .cwj-event-card__kicker,
.cwj-event-card--workshop .cwj-event-card__meta { color: var(--cwj-taupe); }
.cwj-event-card--workshop .cwj-event-card__desc,
.cwj-event-card--workshop .cwj-event-card__details { color: var(--cwj-brown); }
.cwj-event-card--workshop .cwj-event-card__cta { background: var(--cwj-ink-button); box-shadow: inset 0 0 0 1px var(--cwj-gold); color: var(--cwj-cream); }
.cwj-event-card--workshop .cwj-event-card__cta:hover { background: var(--cwj-brown); }

/* --------------------------------------------------------------------
   Open Workshops (#workshops)
   -------------------------------------------------------------------- */
.cwj-workshops { position: relative; overflow: hidden; background: var(--cwj-white); scroll-margin-top: var(--cwj-header-h); }
.cwj-workshops .is-a { background: radial-gradient(48% 48% at 22% 30%, rgba(174,148,119,0.20) 0%, rgba(0,0,0,0) 68%); }
.cwj-workshops .is-b { background: radial-gradient(44% 44% at 78% 72%, rgba(145,174,192,0.18) 0%, rgba(0,0,0,0) 66%); }
.cwj-workshops__inner { position: relative; max-width: var(--cwj-container-wide); margin: 0 auto; padding: 108px var(--cwj-container-pad); }
.cwj-workshops__container { max-width: var(--cwj-container); margin: 0 auto; }
.cwj-workshops__container .cwj-section-head__body .cwj-lead { max-width: 900px; }
.cwj-workshops__columns { display: flex; flex-wrap: wrap; gap: 64px; justify-content: space-between; align-items: start; margin-bottom: 74px; }
.cwj-workshops__text { flex: 1 1 460px; min-width: 0; max-width: 760px; display: flex; flex-direction: column; gap: 22px; }
.cwj-workshops__text p { font-family: var(--cwj-font-body); font-size: 15px; line-height: 27.5px; color: var(--cwj-brown); }
.cwj-workshops__dates { display: flex; flex-direction: column; gap: 22px; scroll-margin-top: var(--cwj-header-h); }

/* --------------------------------------------------------------------
   Meet Jeff (#jeff)
   -------------------------------------------------------------------- */
.cwj-jeff { background: var(--cwj-white); scroll-margin-top: var(--cwj-header-h); }
.cwj-jeff__inner { max-width: var(--cwj-container-wide); margin: 0 auto; padding: 108px var(--cwj-container-pad); }
.cwj-jeff__row { max-width: var(--cwj-container); margin: 0 auto; display: flex; flex-wrap: wrap; gap: 72px; justify-content: space-between; align-items: center; }
.cwj-jeff__photo-wrap { flex: 1 1 400px; min-width: 300px; max-width: 590px; position: relative; }
.cwj-jeff__photo {
  width: 100%; max-width: 529.578px; height: 560px; border-radius: 28px 170px 28px 28px; overflow: hidden;
  box-shadow: var(--cwj-shadow-card-lg);
  /* background-image: impostata inline dal template (campo ACF "Foto" con
     fallback alla foto del design), qui solo posizione/dimensione/ripetizione. */
  background-position: center; background-size: cover; background-repeat: no-repeat;
}
.cwj-jeff__quote {
  position: absolute; right: 0; bottom: -18px; width: 210px; border-radius: 18px; background: var(--cwj-cream);
  box-shadow: inset 0 0 0 1px var(--cwj-line), 0px 16px 42px 0px rgba(32,49,45,0.1); padding: 26px 25px 22px;
}
.cwj-jeff__quote p { font-family: var(--cwj-font-display); font-size: 25px; line-height: 28px; color: var(--cwj-ink); }
.cwj-jeff__quote span { font-family: var(--cwj-font-ui); font-size: 10px; line-height: 11.2px; letter-spacing: 1.4px; color: var(--cwj-brown); margin-top: 18px; display: block; text-transform: uppercase; }
.cwj-jeff__content { flex: 1 1 520px; min-width: 0; max-width: 848px; }
.cwj-jeff__content .cwj-eyebrow { margin-bottom: 22px; }
.cwj-jeff__content h2 { font-family: var(--cwj-font-display); font-weight: 400; font-size: clamp(40px,4.4vw,76px); line-height: 1.03; letter-spacing: -0.035em; color: var(--cwj-ink); margin: 0 0 30px; }
.cwj-jeff__content .cwj-jeff__bio { display: flex; flex-direction: column; gap: 20px; max-width: 768px; }
.cwj-jeff__content .cwj-jeff__bio p { font-family: var(--cwj-font-ui); font-size: 16.5px; line-height: 32px; color: var(--cwj-ink); }
.cwj-jeff__actions { margin-top: 38px; }

/* --------------------------------------------------------------------
   Reflections (testimonials)
   -------------------------------------------------------------------- */
.cwj-testimonials { position: relative; overflow: hidden; background: var(--cwj-cream); }
.cwj-testimonials .is-a { background: radial-gradient(48% 48% at 22% 30%, rgba(185,166,200,0.22) 0%, rgba(0,0,0,0) 68%); }
.cwj-testimonials .is-b { background: radial-gradient(44% 44% at 78% 72%, rgba(174,148,119,0.20) 0%, rgba(0,0,0,0) 66%); }
.cwj-testimonials__inner { position: relative; max-width: var(--cwj-container-wide); margin: 0 auto; padding: 92px var(--cwj-container-pad) 108px; }
.cwj-testimonials__container { max-width: var(--cwj-container); margin: 0 auto; }
.cwj-testimonials__container > h2 {
  font-family: var(--cwj-font-display); font-weight: 400; font-size: clamp(38px,3.9vw,68px); line-height: 1.12;
  letter-spacing: -0.035em; text-align: center; color: var(--cwj-ink); margin: 0 0 58px;
}
/* Griglia a 2 colonne invece del flex + divisore singolo del design
   originale (pensato per esattamente 2 testimonianze): con "Aggiungi
   testimonianza" il cliente può metterne quante vuole (Chat with Jeff e
   Open Workshops nella stessa sezione), quindi i divisori sono bordi
   sulle celle stesse — funzionano con qualunque numero di righe, non
   solo con 2, e non lasciano mai un trattino isolato quando la griglia
   va a capo. */
.cwj-testimonials__grid {
  border-top: 1px solid rgba(118,90,73,0.38); padding-top: 46px;
  display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 48px; row-gap: 40px;
}
.cwj-testimonials__item { padding: 0 16px; }
.cwj-testimonials__item p {
  font-family: var(--cwj-font-display); font-size: 19px; line-height: 29px; color: var(--cwj-black);
}
.cwj-testimonials__author {
  display: block; margin-top: 14px; font-family: var(--cwj-font-ui); font-size: 12px; line-height: 20.64px;
  letter-spacing: 1.4px; text-transform: uppercase; color: var(--cwj-taupe);
}
/* Niente linee divisorie fra le testimonianze: solo lo spazio (row-gap/
   column-gap sopra) a separarle, sia sulla griglia a 2 colonne che su
   mobile a 1 colonna. */

@media (max-width: 780px) {
  .cwj-testimonials__grid { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------
   Continue exploring (CTA finale)
   -------------------------------------------------------------------- */
.cwj-cta { background: var(--cwj-white); }
.cwj-cta__inner { max-width: var(--cwj-container-wide); margin: 0 auto; padding: 136px var(--cwj-container-pad) 80px; }
.cwj-cta__card {
  position: relative; max-width: var(--cwj-container); margin: 0 auto; overflow: hidden; border-radius: 30px;
  background: var(--cwj-cream); box-shadow: inset 0 0 0 1px var(--cwj-line), 0px 28px 80px 0px rgba(32,49,45,0.07);
  padding: clamp(36px,6vw,97px);
}
.cwj-cta__blob { position: absolute; border-radius: 50px; filter: blur(18px); }
.cwj-cta__blob.is-1 { right: -114px; top: -90px; width: 280px; height: 280px; background: rgba(185,166,200,0.28); animation: cwjDriftA 84s ease-in-out infinite; }
.cwj-cta__blob.is-2 { right: -84px; bottom: -128px; width: 220px; height: 220px; background: rgba(145,174,192,0.22); animation: cwjDriftB 104s ease-in-out infinite; }
.cwj-cta__row { position: relative; display: flex; flex-wrap: wrap; gap: 56px; align-items: center; justify-content: space-between; }
.cwj-cta__text { flex: 1 1 480px; min-width: 0; max-width: 857px; }
.cwj-cta__text .cwj-eyebrow { color: var(--cwj-brown); margin-bottom: 20px; }
.cwj-cta__text h2 { font-family: var(--cwj-font-display); font-weight: 400; font-size: clamp(38px,3.9vw,68px); line-height: 1.03; letter-spacing: -0.035em; color: var(--cwj-ink); margin: 0 0 30px; }
.cwj-cta__text p { font-family: var(--cwj-font-ui); font-size: 16px; line-height: 27.5px; color: var(--cwj-brown); max-width: 668px; }
.cwj-cta__link {
  flex-shrink: 0; width: 190px; height: 190px; border-radius: 50px; background: var(--cwj-ink-button);
  box-shadow: 0px 20px 50px 0px rgba(48,74,66,0.22); display: flex; flex-direction: column;
  align-items: center; justify-content: space-between; padding: 32px 0; text-align: center;
  transition: background-color 220ms ease;
}
.cwj-cta__link:hover { background: var(--cwj-brown); }
.cwj-cta__link span:first-child { font-family: var(--cwj-font-ui); font-weight: 600; font-size: 14px; line-height: 24.08px; color: var(--cwj-cream); }
.cwj-cta__link span:last-child { font-family: var(--cwj-font-ui); font-weight: 600; font-size: 25px; line-height: 43px; color: var(--cwj-cream); }

/* --------------------------------------------------------------------
   Contact (modulo nativo, senza plugin — vedi inc/contact-form.php)
   -------------------------------------------------------------------- */
.cwj-contact { background: var(--cwj-white); }
.cwj-contact__inner { max-width: var(--cwj-container-wide); margin: 0 auto; padding: 20px var(--cwj-container-pad) 140px; }
.cwj-contact__container { max-width: 760px; margin: 0 auto; }
.cwj-contact__head { text-align: center; margin-bottom: 44px; }
.cwj-contact__head .cwj-eyebrow { justify-content: center; margin-bottom: 18px; }
.cwj-contact__head h2 {
  font-family: var(--cwj-font-display); font-weight: 400; font-size: clamp(34px,3.4vw,52px);
  line-height: 1.08; letter-spacing: -0.035em; color: var(--cwj-ink); margin: 0 0 16px;
}
.cwj-contact__head .cwj-lead { font-family: var(--cwj-font-display); font-size: 20px; line-height: 30px; color: var(--cwj-brown); }

.cwj-contact__notice {
  border-radius: var(--cwj-radius-card); padding: 22px 28px; margin-bottom: 28px;
  font-family: var(--cwj-font-ui); font-size: 14px; line-height: 24.08px; text-align: center;
}
.cwj-contact__notice.is-success { background: var(--cwj-sand); color: var(--cwj-ink); }
.cwj-contact__notice.is-error { background: rgba(178,58,46,0.08); color: rgb(139,45,35); }

.cwj-contact__form {
  border-radius: var(--cwj-radius-card); background: var(--cwj-cream);
  box-shadow: inset 0 0 0 1px var(--cwj-line), var(--cwj-shadow-card);
  padding: clamp(28px,3.5vw,45px); display: flex; flex-direction: column; gap: 22px;
}
.cwj-contact__row { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.cwj-contact__field { display: flex; flex-direction: column; gap: 8px; }
.cwj-contact__field label {
  font-family: var(--cwj-font-ui); font-weight: 500; font-size: 12px; line-height: 20.64px;
  letter-spacing: 1.4px; text-transform: uppercase; color: var(--cwj-taupe);
}
.cwj-contact__field input, .cwj-contact__field textarea {
  border-radius: 12px; border: 1px solid var(--cwj-line); background: var(--cwj-white);
  padding: 14px 16px; font-family: var(--cwj-font-ui); font-size: 15px; color: var(--cwj-ink);
  transition: border-color 200ms ease;
}
.cwj-contact__field input:focus, .cwj-contact__field textarea:focus {
  outline: none; border-color: var(--cwj-gold);
}
.cwj-contact__field textarea { resize: vertical; min-height: 120px; font-family: var(--cwj-font-ui); }
.cwj-contact__field-error { font-family: var(--cwj-font-ui); font-size: 12px; color: rgb(139,45,35); }
.cwj-contact__form .cwj-btn { align-self: flex-start; }

/* Honeypot: fuori dal flusso visivo e dalla tabulazione, ma presente nel
   markup per raccogliere i bot che compilano ogni campo che trovano. */
.cwj-contact__honeypot {
  position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden;
}

@media (max-width: 640px) {
  .cwj-contact__row { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------- */
.cwj-footer { border-top: 1px solid var(--cwj-line); background: var(--cwj-white); }
.cwj-footer .cwj-container { padding-top: 56px; padding-bottom: 30px; }
.cwj-footer__main { display: flex; align-items: flex-start; justify-content: space-between; gap: 80px; padding-bottom: 46px; flex-wrap: wrap; }
.cwj-footer__brand { flex: 1 1 380px; max-width: 478px; }
.cwj-footer__brand img { width: 218px; height: 58px; object-fit: contain; display: block; }
.cwj-footer__brand p { font-family: var(--cwj-font-ui); font-size: 14px; line-height: 24.08px; color: var(--cwj-brown); margin-top: 14px; }
.cwj-footer__nav { display: flex; align-items: center; gap: 30px; flex-wrap: wrap; }
.cwj-footer__nav a { font-family: var(--cwj-font-ui); font-size: 14px; line-height: 22.36px; color: var(--cwj-ink); }
.cwj-footer__bottom { border-top: 1px solid var(--cwj-line); padding-top: 25px; display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap; }
.cwj-footer__bottom span { font-family: var(--cwj-font-ui); font-size: 12px; line-height: 20.64px; color: var(--cwj-brown); }

/* --------------------------------------------------------------------
   Scroll reveal — fade-in quando l'elemento entra nel viewport
   -------------------------------------------------------------------- */
.cwj-reveal {
  opacity: 0; transform: translate3d(0,26px,0);
  transition: opacity 850ms cubic-bezier(0.22,0.61,0.36,1), transform 850ms cubic-bezier(0.22,0.61,0.36,1);
  will-change: opacity, transform;
}
.cwj-reveal.is-visible { opacity: 1; transform: translate3d(0,0,0); }

@media (prefers-reduced-motion: reduce) {
  .cwj-reveal { opacity: 1; transform: none; transition: none; }
  .cwj-drift .is-a, .cwj-drift .is-b, .cwj-cta__blob { animation: none; }
  .cwj-intro { display: none; }
}

/* --------------------------------------------------------------------
   Hero su mobile — nel design (pensato per un canvas desktop) la colonna
   di testo della hero è larga 46vw/50vw perché lascia volutamente
   respiro su schermi larghi; sotto i 640px quello stesso valore la
   schiaccia (meno di metà schermo). Qui soltanto la allarghiamo.
   -------------------------------------------------------------------- */
@media (max-width: 640px) {
  .cwj-hero__copy { max-width: 90vw; width: 90vw; }

  /* Choice cards ("Chat with Jeff" / "Open Workshops"): il padding
     laterale della sezione le riduceva a circa l'80% dello schermo,
     e con il padding pieno della card il bottone "Explore Upcoming
     Workshops" (il testo più lungo dei due) non aveva più spazio e si
     vedeva scomposto. Card portate al 95vw e padding interno ridotto. */
  .cwj-choice__inner { padding-left: 2.5vw; padding-right: 2.5vw; }
  .cwj-choice__card { padding: 32px 24px 28px; }
}

/* --------------------------------------------------------------------
   Nav mobile — il design è pensato per desktop; sotto i 900px la nav
   inline diventa un menu a tendina per restare utilizzabile su telefono,
   senza toccare nessun valore della versione desktop.
   -------------------------------------------------------------------- */
@media (max-width: 900px) {
  .cwj-header__nav { display: none; position: absolute; top: 100%; left: 0; right: 0; background: var(--cwj-white); flex-direction: column; align-items: flex-start; gap: 4px; padding: 16px var(--cwj-container-pad) 24px; border-bottom: 1px solid var(--cwj-line); }
  .cwj-header__nav.is-open { display: flex; }
  .cwj-header__nav a { padding: 10px 0; width: 100%; }
  .cwj-header__cta { width: auto; }
  .cwj-nav-toggle {
    display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px;
    border: none; background: transparent; cursor: pointer; padding: 0;
  }
  .cwj-nav-toggle span, .cwj-nav-toggle::before, .cwj-nav-toggle::after { content: ""; display: block; width: 22px; height: 1.5px; background: var(--cwj-ink); }
  .cwj-nav-toggle { flex-direction: column; gap: 5px; }
}