/* ==========================================================================
   COACHING 1:1 — aggiunte specifiche (base: style.css della Stoic Room)
   Look "tecnico": foto desaturate con tono oro, cornici sottili, niente nudo.
   ========================================================================== */

.navbar__inner--split { justify-content: space-between; }
.nav__cta { padding: 0.7rem 1.25rem; font-size: 0.75rem; }
@media (max-width: 480px) { .nav__cta { display: none; } }

/* Trattamento foto uniforme: stessi colori del brand, tono tecnico */
.ph img,
.include__photo img {
  filter: grayscale(0.55) sepia(0.18) contrast(1.12) brightness(0.8) saturate(0.9);
}

/* Segnaposto finché la foto non viene caricata */
.ph {
  position: relative;
  background:
    repeating-linear-gradient(135deg, rgba(212,175,55,.04) 0 12px, transparent 12px 24px),
    #0a0a0a;
  border: 1px solid rgba(212, 175, 55, 0.25);
  overflow: hidden;
}
.ph::before {
  content: attr(data-label);
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  text-align: center;
  font-size: 0.7rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(212, 175, 55, 0.6);
}
.ph img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: cover; }
.ph .include__badge, .ph .result__tag { z-index: 3; }
.include__photo.ph::after { z-index: 2; }

/* Hero: foto incorniciata (non scontornata) */
.hero__photo { width: 100%; }
.hero__photo .ph { aspect-ratio: 4 / 5; border-radius: 1.5rem; }
.hero__photo .ph::after {
  content: "";
  position: absolute; inset: 0; z-index: 2;
  background: linear-gradient(to top, rgba(0,0,0,.6), transparent 55%);
}
@media (min-width: 768px) {
  .hero__photo { flex: 1; max-width: 30rem; margin-left: auto; }
}

.problem__content .problem__title { font-size: clamp(1.9rem, 4.4vw, 3.75rem); }

/* Metodo: griglia a 3 */
@media (min-width: 900px) {
  .include__grid--3 { grid-template-columns: repeat(3, 1fr); gap: 2.5rem; }
}
.method__note { display: block; width: fit-content; margin: 4rem auto 0; text-align: center; }

/* Risultati prima/dopo */
.results__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  margin-top: 3.5rem;
}
@media (min-width: 900px) { .results__grid { grid-template-columns: repeat(3, 1fr); } }
.result__pair { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.result__img { aspect-ratio: 3 / 4; }
.result__tag {
  position: absolute;
  left: 0.6rem; bottom: 0.6rem;
  padding: 0.3rem 0.6rem;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  background: rgba(0,0,0,.65);
  border: 1px solid rgba(255,255,255,.2);
  color: rgba(255,255,255,.8);
}
.result__tag--gold { border-color: rgba(212,175,55,.6); color: var(--gold); }

/* Step */
.steps {
  list-style: none;
  padding: 0;
  margin: 4rem 0 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.5rem;
}
@media (min-width: 900px) { .steps { grid-template-columns: repeat(3, 1fr); } }
.step { border-top: 1px solid rgba(212,175,55,.3); padding-top: 1.75rem; }
.step__num { font-family: var(--font-serif); font-size: 2.5rem; color: var(--gold); line-height: 1; }
.step h3 { margin: 1rem 0 0.5rem; font-size: 1.05rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.1em; }
.step p { margin: 0; line-height: 1.6; color: rgba(255,255,255,.6); }

/* Per chi è */
.fit__grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 768px) { .fit__grid { grid-template-columns: 1fr 1fr; } }
.fit { border: 1px solid rgba(255,255,255,.1); padding: 2rem; }
.fit--yes { border-color: rgba(212,175,55,.35); }
.fit h3 { margin: 0 0 1.25rem; font-family: var(--font-serif); font-weight: 400; font-size: 1.5rem; text-transform: uppercase; }
.fit--yes h3 { color: var(--gold); }
.fit ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.9rem; }
.fit li { position: relative; padding-left: 1.75rem; line-height: 1.5; color: rgba(255,255,255,.75); }
.fit--yes li::before { content: "✓"; position: absolute; left: 0; color: var(--gold); }
.fit--no li::before { content: "✕"; position: absolute; left: 0; color: rgba(255,255,255,.35); }

/* FAQ */
.faq__wrap { max-width: 52rem; }
.faq { margin-top: 3rem; }
.faq details { border-bottom: 1px solid rgba(255,255,255,.1); }
.faq summary {
  list-style: none;
  cursor: pointer;
  padding: 1.5rem 2.5rem 1.5rem 0;
  position: relative;
  font-weight: 500;
  font-size: 1.05rem;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: "+";
  position: absolute; right: 0; top: 50%;
  transform: translateY(-50%);
  font-size: 1.5rem; color: var(--gold);
  transition: transform .3s var(--ease-luxury);
}
.faq details[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.faq details p { margin: 0 0 1.5rem; line-height: 1.7; color: rgba(255,255,255,.6); }

/* Calendly */
.offer__text--wide { max-width: 34rem; }
.calendly__box {
  width: 100%;
  max-width: 64rem;
  min-width: 280px;
  height: 720px;
  border: 1px solid rgba(212,175,55,.3);
  border-radius: 6px;
  overflow: hidden;
  background: #0a0a0a;
}
.calendly__fallback { text-decoration: underline; }

/* Mobile: il bottone grande non deve uscire dallo schermo */
@media (max-width: 640px) {
  .btn--lg { white-space: normal; text-align: center; width: 100%; padding: 1.1rem 1.25rem; font-size: 0.875rem; letter-spacing: 0.12em; }
}

/* ---------- Wordmark testuale (niente logo) ---------- */
.wordmark { display: inline-flex; flex-direction: column; text-decoration: none; line-height: 1; }
.wordmark__main { font-family: var(--font-serif); font-size: 1.4rem; letter-spacing: 0.32em; color: #fff; }
.wordmark__sub { margin-top: 0.45rem; font-size: 0.6rem; font-weight: 600; letter-spacing: 0.3em; text-transform: uppercase; color: var(--gold); }
.wordmark--center { align-items: center; }
@media (min-width: 768px) { .wordmark__main { font-size: 1.6rem; } }

/* ---------- Hero: due bottoni ---------- */
.hero__ctas { display: flex; flex-wrap: wrap; gap: 1rem; }
.btn--ghost { background: transparent; color: #fff; border: 1px solid rgba(212,175,55,.55); }
.btn--ghost:hover { border-color: var(--gold); color: var(--gold); }

/* ---------- Blocco Coaching (testo + foto) ---------- */
.block { display: grid; grid-template-columns: 1fr; gap: 3rem; align-items: center; }
@media (min-width: 900px) { .block { grid-template-columns: 1.1fr 0.9fr; gap: 5rem; } }
.block__copy { display: flex; flex-direction: column; align-items: flex-start; gap: 1.5rem; }
.block__copy .highlight-gold { padding-left: 0; padding-right: 0; }
.block__photo .ph { aspect-ratio: 4 / 5; border-radius: 1.5rem; }

/* ---------- Corsi ---------- */
.courses__photo { margin: 3.5rem auto 0; max-width: 56rem; aspect-ratio: 16 / 9; border-radius: 6px; }
.courses__grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; max-width: 56rem; margin: 1.5rem auto 0; }
@media (min-width: 768px) { .courses__grid { grid-template-columns: 1fr 1fr; } }
.course { display: flex; flex-direction: column; align-items: flex-start; gap: 1rem; padding: 2rem; border: 1px solid rgba(212,175,55,.3); background: rgba(255,255,255,.015); }
.course__tag { font-size: 0.65rem; font-weight: 600; letter-spacing: 0.3em; text-transform: uppercase; color: var(--gold); }
.course h3 { margin: 0; font-family: var(--font-serif); font-weight: 400; font-size: 1.6rem; text-transform: uppercase; }
.course p { margin: 0; line-height: 1.65; color: rgba(255,255,255,.6); flex: 1; }
@media (max-width: 640px) { .hero__ctas { width: 100%; } .btn--md { white-space: normal; } }

/* ---------- Slider risultati ---------- */
.slider { position: relative; margin-top: 3.5rem; }
.slider__track {
  display: flex; gap: 1.25rem;
  overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth;
  padding-bottom: 1rem; scrollbar-width: none;
}
.slider__track::-webkit-scrollbar { display: none; }
.slide { flex: 0 0 78%; margin: 0; scroll-snap-align: center; }
@media (min-width: 640px) { .slide { flex-basis: 42%; } }
@media (min-width: 1000px) { .slide { flex-basis: calc((100% - 2.5rem) / 3); scroll-snap-align: start; } }
.slide__img { position: relative; aspect-ratio: 9 / 16; overflow: hidden; border: 1px solid rgba(212,175,55,.3); background: #0a0a0a; }
.slide__img img { width: 100%; height: 100%; object-fit: cover; filter: contrast(1.04) saturate(0.92); }
.slide__img::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: rgba(212,175,55,.7); }
.slide__tag-top { top: 0.6rem; bottom: auto; }
.slide__tag-bottom { top: calc(50% + 0.6rem); bottom: auto; }
.slide figcaption { display: flex; justify-content: space-between; align-items: baseline; padding-top: 1rem; border-bottom: 1px solid rgba(255,255,255,.1); padding-bottom: 1rem; }
.slide__time { font-size: 0.8rem; font-weight: 600; letter-spacing: 0.25em; text-transform: uppercase; color: rgba(255,255,255,.75); }
.slide__kg { font-family: var(--font-serif); font-size: 1.4rem; color: var(--gold); }
.slider__btn {
  position: absolute; top: calc(50% - 2rem); transform: translateY(-50%); z-index: 5;
  width: 3rem; height: 3rem; border-radius: 50%;
  border: 1px solid rgba(212,175,55,.6); background: rgba(0,0,0,.75); color: var(--gold);
  font-size: 1.75rem; line-height: 1; cursor: pointer; transition: background .2s, color .2s;
}
.slider__btn:hover { background: var(--gold); color: #000; }
.slider__btn--prev { left: -1.6rem; }
.slider__btn--next { right: -1.6rem; }
@media (max-width: 640px) { .slider__btn { display: none; } }
.results__note { text-align: center; margin-top: 1.5rem; }

/* ---------- Bottone WhatsApp fisso (oro/nero) ---------- */
.wa-float {
  position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 60;
  display: inline-flex; align-items: center; gap: 0.6rem;
  height: 3.5rem; padding: 0 1.1rem;
  border-radius: 9999px; background: #000; color: var(--gold);
  border: 1px solid var(--gold); text-decoration: none;
  box-shadow: 0 0 30px -6px rgba(212,175,55,.5);
  transition: background .25s, color .25s, transform .2s;
}
.wa-float:hover { background: var(--gold); color: #000; transform: scale(1.04); }
.wa-float__label { font-size: 0.72rem; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; }
@media (max-width: 640px) { .wa-float { width: 3.5rem; padding: 0; justify-content: center; } .wa-float__label { display: none; } }

/* ---------- Hero con video di sfondo ---------- */
.hero-video { position: relative; min-height: 100svh; display: flex; align-items: center; overflow: hidden; background: #000; }
.hero-video__media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero-video__overlay {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at center, rgba(0,0,0,.35) 0%, rgba(0,0,0,.7) 75%),
    linear-gradient(to bottom, rgba(0,0,0,.55) 0%, rgba(0,0,0,.15) 40%, rgba(0,0,0,.9) 100%);
}
.hero-video__content {
  position: relative; z-index: 2; width: 100%;
  display: flex; flex-direction: column; align-items: center; gap: 1.75rem;
  text-align: center; padding-top: 7rem; padding-bottom: 6rem;
}
.hero-video__title { max-width: 52rem; font-size: clamp(2.2rem, 6vw, 4.2rem); }
.hero-video__text { max-width: 34rem; color: rgba(255,255,255,.75); }
.hero-video__ctas { justify-content: center; }
.hero-video__scroll { position: absolute; bottom: 1.75rem; left: 50%; transform: translateX(-50%); z-index: 2; color: var(--gold); }
@media (max-width: 640px) { .hero-video__ctas { flex-direction: column; } }

/* ---------- Mockup telefono (scheda app) ---------- */
.include__photo--phone {
  display: flex; align-items: center; justify-content: center;
  background: radial-gradient(ellipse at center, rgba(212,175,55,.14), transparent 65%), #070707;
  border: 1px solid rgba(212,175,55,.25);
}
.include__photo--phone::after { display: none; }
.phone {
  position: relative; height: 88%; aspect-ratio: 9 / 19.5;
  border-radius: 1.6rem; padding: 0.35rem;
  background: linear-gradient(145deg, #2a2a2a, #0b0b0b);
  border: 1px solid rgba(212,175,55,.45);
  box-shadow: 0 20px 50px -10px rgba(0,0,0,.9), 0 0 40px -12px rgba(212,175,55,.35);
  transition: transform .6s var(--ease-luxury);
}
.include__item:hover .phone { transform: translateY(-6px) rotate(-1.5deg); }
.phone__notch { position: absolute; top: 0.55rem; left: 50%; transform: translateX(-50%); width: 30%; height: 0.55rem; border-radius: 9999px; background: #000; z-index: 3; }
.phone__screen { position: relative; width: 100%; height: 100%; border-radius: 1.3rem; overflow: hidden; background: #000; }
.phone__screen img { width: 100%; height: 100%; object-fit: cover; object-position: center 15%; filter: contrast(1.05) saturate(0.9); }
.include__item:hover .phone__screen img { transform: none; }
.phone__ui {
  position: absolute; inset: 0; z-index: 2;
  display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 0.35rem;
  padding: 0 0.6rem 1rem;
  background: linear-gradient(to top, rgba(0,0,0,.92) 0%, rgba(0,0,0,.35) 40%, transparent 65%);
}
.phone__brand { font-size: 0.42rem; font-weight: 600; letter-spacing: 0.3em; color: var(--gold); }
.phone__title { font-family: var(--font-serif); font-size: 0.75rem; text-transform: uppercase; color: #fff; }
.phone__btn { margin-top: 0.25rem; width: 80%; padding: 0.3rem 0; border-radius: 9999px; background: var(--gold); color: #000; font-size: 0.45rem; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; text-align: center; }
.phone__ui { text-align: center; }
.phone__brand { white-space: nowrap; letter-spacing: 0.18em; font-size: 0.4rem; }
.phone__title { white-space: nowrap; font-size: 0.68rem; }
@media (max-width: 640px) { .phone__title { font-size: 0.56rem; } .phone__brand { font-size: 0.34rem; } }