.formats-page,
.home-v3-formats,
.retreats-v2-formats {
	--formats-ink: var(--livi-text);
	--formats-muted: var(--livi-muted);
	--formats-rule: var(--livi-rule);
  --formats-accent: var(--livi-muted);
  background: var(--livi-bg);
  color: var(--formats-ink);
	overflow: hidden;
}

.formats-page *,
.home-v3-formats *,
.retreats-v2-formats *,
.contact--formats * { box-sizing: border-box; }
.formats-container { max-width: 1720px; padding-inline: var(--livi-case-inline-inset); }
.formats-page a,
.home-v3-formats a,
.retreats-v2-formats a { color: inherit; }
.formats-page .screen-reader-text { 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; }
.formats-page a:focus-visible,
.formats-page button:focus-visible,
.contact--formats a:focus-visible,
.contact--formats input:focus-visible,
.contact--formats textarea:focus-visible { outline: 2px solid var(--formats-ink); outline-offset: 5px; }
.formats-eyebrow { font-family: "Quicksand", sans-serif; font-size: 10px; font-weight: 500; letter-spacing: .15em; line-height: 1.3; margin: 0 0 24px; text-transform: uppercase; }
.formats-title { font-family: var(--livi-font-display); font-size: var(--livi-type-section); font-weight: 400; letter-spacing: var(--livi-display-tracking); line-height: var(--livi-display-leading); margin: 0; }
.formats-arrow-link { align-items: center; display: inline-flex; font-family: "Quicksand", sans-serif; font-size: 11px; font-weight: 500; gap: 26px; letter-spacing: .11em; line-height: 1.2; text-decoration: none; text-transform: uppercase; }
.formats-arrow-link span { font-size: 23px; font-weight: 400; line-height: .6; transition: transform 180ms ease; }
.formats-arrow-link:hover span { transform: translateX(6px); }
.formats-section { min-height: var(--livi-scene-min); padding: var(--livi-scene-pad-y) 0; border-block: 0; }
.formats-section-heading { margin-bottom: 68px; max-width: 780px; }
.formats-reveal { opacity: 0; transform: translateY(16px); transition: opacity 500ms ease-out, transform 500ms ease-out; }
.formats-reveal.is-visible { opacity: 1; transform: none; }

.formats-hero { min-height: var(--livi-scene-min); padding: 132px 0 0; position: relative; }
.formats-hero::after { background: linear-gradient(90deg, #070707 0%, rgba(7, 7, 7, .93) 31%, rgba(7, 7, 7, .16) 72%, rgba(7, 7, 7, .44) 100%); content: ""; inset: 0; pointer-events: none; position: absolute; z-index: 1; }
.formats-hero__visual { inset: 0; overflow: hidden; position: absolute; }
.formats-hero__visual img { height: 100%; object-fit: cover; object-position: center; width: 100%; }
.formats-hero__container { display: flex; flex-direction: column; min-height: calc(var(--livi-scene-min) - 132px); position: relative; z-index: 2; }
.formats-hero__content { max-width: 680px; padding-top: clamp(42px, 8vh, 118px); }
.formats-hero__title { font-family: var(--livi-font-display); font-size: clamp(44px, 3.7vw, 62px); font-weight: 400; letter-spacing: var(--livi-display-tracking); line-height: var(--livi-display-leading); margin: 0 0 30px; }
.formats-hero__lead { color: var(--formats-muted); font-family: "Quicksand", sans-serif; font-size: 15px; line-height: 1.55; margin: 0 0 38px; max-width: 430px; }
.formats-hero__rail { border-top: 1px solid var(--formats-rule); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: auto; }
.formats-hero__format-link { border-right: 1px solid var(--formats-rule); display: grid; gap: 8px; min-height: 124px; padding: 22px 18px 20px 0; text-decoration: none; transition: background-color 180ms ease, padding-left 180ms ease; }
.formats-hero__format-link:last-child { border-right: 0; }
.formats-hero__format-link span { color: var(--formats-accent); font-family: "Quicksand", sans-serif; font-size: 11px; letter-spacing: .08em; }
.formats-hero__format-link b { font-size: 18px; font-weight: 400; line-height: 1; }
.formats-hero__format-link:hover { background-color: rgba(252, 247, 240, .05); padding-left: 6px; }

.formats-goals__grid { display: grid; gap: 10vw; grid-template-columns: minmax(320px, .83fr) minmax(520px, 1.17fr); }
.formats-goals__intro > p:last-child { color: var(--formats-muted); font-family: "Quicksand", sans-serif; font-size: 14px; line-height: 1.6; margin: 34px 0 0; max-width: 390px; }
.formats-goals__list, .formats-system__list, .formats-capabilities__list, .formats-journey__stops { list-style: none; margin: 0; padding: 0; }
.formats-goals__list li { align-items: center; border-top: 1px solid var(--formats-rule); display: grid; font-family: "Playfair Display", serif; font-size: clamp(22px, 2vw, 34px); gap: 23px; grid-template-columns: 28px 1fr 20px; line-height: 1.1; padding: 21px 0; transition: padding 180ms ease, color 180ms ease; }
.formats-goals__list li:last-child { border-bottom: 1px solid var(--formats-rule); }
.formats-goals__list span, .formats-system__list span, .formats-capabilities__list span, .formats-panel__index, .formats-case__index { color: var(--formats-accent); font-family: "Quicksand", sans-serif; font-size: 10px; letter-spacing: .1em; }
.formats-goals__list b, .formats-capabilities__list b { font-family: "Quicksand", sans-serif; font-size: 19px; font-weight: 400; transition: transform 180ms ease; }
.formats-goals__list li:hover { color: var(--formats-ink); padding-left: 6px; }
.formats-goals__list li:hover b, .formats-capabilities__list li:hover b { transform: translateX(6px); }

.formats-core { background: #090909; }
.formats-format-explorer.is-changing .formats-panel { animation: formats-panel-change 320ms ease both; }
.formats-tabs { border-bottom: 1px solid var(--formats-rule); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.formats-tab { background: transparent; border: 0; color: rgba(252, 247, 240, .28); cursor: pointer; font-family: "Playfair Display", serif; font-size: clamp(54px, 5.2vw, 95px); font-weight: 400; letter-spacing: -.06em; line-height: 1; padding: 0 0 21px; position: relative; text-align: left; transition: color 180ms ease; }
.formats-tab::after { background: var(--formats-ink); bottom: -1px; content: ""; height: 2px; left: 0; position: absolute; transform: scaleX(0); transform-origin: left; transition: transform 350ms cubic-bezier(.22,.61,.36,1); width: 72px; }
.formats-tab:hover, .formats-tab.is-active { color: var(--formats-ink); }
.formats-tab.is-active::after { transform: scaleX(1); }
.formats-panels { padding-top: 48px; }
.formats-panel { display: grid; gap: clamp(40px, 6vw, 112px); grid-template-columns: minmax(0, 1.15fr) minmax(310px, .85fr); }
.formats-panel[hidden] { display: none; }
.formats-panel__media { aspect-ratio: 3 / 2; overflow: hidden; }
.formats-panel__media img { display: block; height: 100%; object-fit: cover; width: 100%; }
.formats-panel__content { align-self: center; max-width: 520px; padding: 10px 0; }
.formats-panel__index { margin: 0 0 12px; }
.formats-panel__content h3 { font-family: "Playfair Display", serif; font-size: clamp(39px, 3.3vw, 65px); font-weight: 400; letter-spacing: -.045em; line-height: .98; margin: 0 0 23px; }
.formats-panel__description { color: var(--formats-muted); font-family: "Quicksand", sans-serif; font-size: 14px; line-height: 1.58; margin: 0 0 34px; }
.formats-panel__details { border-top: 1px solid var(--formats-rule); margin: 0 0 34px; }
.formats-panel__details div { border-bottom: 1px solid var(--formats-rule); display: grid; gap: 24px; grid-template-columns: 120px 1fr; padding: 14px 0; }
.formats-panel__details dt { font-family: "Quicksand", sans-serif; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.formats-panel__details dd { color: var(--formats-muted); font-family: "Quicksand", sans-serif; font-size: 12px; line-height: 1.5; margin: 0; }

.formats-journey { min-height: 520px; overflow: hidden; position: relative; }
.formats-journey__image, .formats-journey__overlay { height: 100%; inset: 0; position: absolute; width: 100%; }
.formats-journey__image { object-fit: cover; }
.formats-journey__overlay { background: rgba(3, 4, 4, .72); }
.formats-journey__content { display: flex; flex-direction: column; justify-content: center; min-height: 520px; position: relative; z-index: 1; }
.formats-journey__stops { display: grid; grid-template-columns: repeat(6, 1fr); margin-top: 42px; position: relative; }
.formats-journey__stops::before { background: rgba(252, 247, 240, .75); content: ""; height: 1px; left: 0; position: absolute; right: 0; top: 34px; transform: scaleX(0); transform-origin: left; transition: transform 800ms cubic-bezier(.22,.61,.36,1); }
.formats-journey.is-visible .formats-journey__stops::before { transform: scaleX(1); }
.formats-journey__stops li { opacity: 0; position: relative; transition: opacity 280ms ease; }
.formats-journey.is-visible .formats-journey__stops li { opacity: 1; }
.formats-journey.is-visible .formats-journey__stops li:nth-child(2) { transition-delay: 100ms; }.formats-journey.is-visible .formats-journey__stops li:nth-child(3) { transition-delay: 200ms; }.formats-journey.is-visible .formats-journey__stops li:nth-child(4) { transition-delay: 300ms; }.formats-journey.is-visible .formats-journey__stops li:nth-child(5) { transition-delay: 400ms; }.formats-journey.is-visible .formats-journey__stops li:nth-child(6) { transition-delay: 500ms; }
.formats-journey__stops span { display: block; font-family: "Quicksand", sans-serif; font-size: 10px; letter-spacing: .1em; margin-bottom: 13px; }
.formats-journey__stops b { background: var(--formats-ink); border-radius: 50%; display: block; height: 7px; position: relative; width: 7px; z-index: 1; }
.formats-journey__stops p { font-family: "Playfair Display", serif; font-size: clamp(18px, 1.5vw, 29px); letter-spacing: -.03em; line-height: 1; margin: 16px 0 0; max-width: 140px; }

.formats-system__heading { display: grid; gap: 48px; grid-template-columns: minmax(0, .95fr) minmax(280px, .45fr); margin-bottom: 72px; max-width: 1190px; }
.formats-system__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.formats-system__list li { border-left: 1px solid var(--formats-rule); min-height: 215px; padding: 0 30px; }
.formats-system__list li:first-child { border-left: 0; padding-left: 0; }
.formats-system__list span { display: block; margin-bottom: 24px; }
.formats-system__list h3 { font-family: "Playfair Display", serif; font-size: clamp(21px, 1.7vw, 31px); font-weight: 400; letter-spacing: -.03em; line-height: 1.03; margin: 0 0 17px; }
.formats-system__list p { color: var(--formats-muted); font-family: "Quicksand", sans-serif; font-size: 12px; line-height: 1.55; margin: 0; max-width: 250px; }

.formats-capabilities { background: #080808; }
.formats-capabilities__grid { align-items: start; display: grid; gap: 9vw; grid-template-columns: minmax(0, 1fr) minmax(280px, .42fr); }
.formats-capabilities__list { border-top: 1px solid var(--formats-rule); }
.formats-capabilities__list li { align-items: center; border-bottom: 1px solid var(--formats-rule); display: grid; gap: 22px; grid-template-columns: 28px 1fr 20px; min-height: 48px; transition: padding 180ms ease; }
.formats-capabilities__list p { font-family: "Playfair Display", serif; font-size: clamp(17px, 1.3vw, 24px); letter-spacing: -.025em; line-height: 1.15; margin: 0; }
.formats-capabilities__list li:hover { padding-left: 6px; }
.formats-capabilities__media { aspect-ratio: 4 / 5; margin: 0; overflow: hidden; }
.formats-capabilities__media img { display: block; height: 100%; object-fit: cover; width: 100%; }

.formats-cases { background: #070707; }
.formats-cases__slider { display: grid; gap: 7vw; grid-template-columns: minmax(260px, .48fr) minmax(0, 1fr); }
.formats-cases__copy { align-self: center; }
.formats-case__index { margin: 0 0 18px; }
.formats-case h2 { font-family: "Playfair Display", serif; font-size: clamp(40px, 3.8vw, 65px); font-weight: 400; letter-spacing: -.05em; line-height: .95; margin: 0 0 25px; max-width: 480px; }
.formats-case__summary { color: var(--formats-muted); font-family: "Quicksand", sans-serif; font-size: 13px; line-height: 1.58; margin: 0 0 32px; max-width: 360px; }
.formats-cases__media { position: relative; }
.formats-case__media { margin: 0; overflow: hidden; }
.formats-case__media img, .formats-case__media video { display: block; height: 100%; object-fit: cover; width: 100%; }
.formats-case__media--desktop { aspect-ratio: 16 / 10; }
.formats-case__media--mobile { display: none; margin-top: 28px; }
.formats-cases__controls { align-items: center; bottom: 0; display: flex; gap: 16px; padding: 18px 20px; position: absolute; right: 0; z-index: 2; }
.formats-cases__controls::before { background: rgba(0, 0, 0, .48); content: ""; inset: 0; position: absolute; z-index: -1; }
.formats-cases__controls button { background: transparent; border: 0; color: var(--formats-ink); cursor: pointer; font-size: 20px; line-height: 1; padding: 7px; }
.formats-cases__controls p { font-family: "Quicksand", sans-serif; font-size: 11px; letter-spacing: .1em; margin: 0; white-space: nowrap; }
.formats-cases__empty { color: var(--formats-muted); font-family: "Quicksand", sans-serif; margin: 0; }

.contact--formats { background: #070707; border-top: 1px solid var(--formats-rule); color: var(--formats-ink); }
.contact--formats .container { max-width: 1720px; padding: 120px 56px; }
.contact--formats .contact__content { align-items: flex-start; }
.contact--formats .contact__left { align-items: flex-start; padding: 0 10vw 0 0; width: 50%; }
.contact--formats .contact__eyebrow { font-family: "Quicksand", sans-serif; font-size: 10px; letter-spacing: .15em; margin: 0 0 24px; text-transform: uppercase; }
.contact--formats .contact__text { font-size: clamp(42px, 4.4vw, 72px); letter-spacing: -.05em; line-height: .96; margin: 0 0 28px; }
.contact--formats .contact__note { color: var(--formats-muted); font-family: "Quicksand", sans-serif; font-size: 14px; line-height: 1.58; margin: 0; max-width: 390px; }
.contact--formats .contact__right { width: 50%; }
.contact--formats .contact__form { max-width: 540px; padding: 0; }
.contact--formats .contact__form input, .contact--formats .contact__form textarea { border-width: 0 0 1px; border-color: var(--formats-rule); font-size: 14px; padding: 7px 0; }
.contact--formats .contact__form textarea { min-height: 138px; }
.contact--formats .contact__submit input { border: 1px solid var(--formats-ink); border-radius: 0; font-size: 11px; letter-spacing: .1em; min-width: 0; padding: 13px 22px; }
.contact--formats .contact__submit input:hover { background: var(--formats-ink); color: #070707; }

@keyframes formats-panel-change { from { opacity: .35; transform: translateY(8px); } to { opacity: 1; transform: none; } }

@media (max-width: 1199px) {
  .formats-hero__rail, .formats-tabs { overflow-x: auto; scrollbar-width: thin; }
  .formats-hero__rail { grid-template-columns: repeat(4, minmax(180px, 1fr)); }
  .formats-tabs { display: flex; }
  .formats-tab { flex: 0 0 150px; }
  .formats-goals__grid, .formats-capabilities__grid { gap: 70px; }
  .formats-system__list li { padding: 0 20px; }
}

@media (max-width: 767px) {
  .formats-section { padding: 78px 0; }
  .formats-eyebrow { margin-bottom: 17px; }
  .formats-hero { min-height: 760px; padding-top: 105px; }
  .formats-hero::after { background: linear-gradient(180deg, rgba(7, 7, 7, .72) 0%, rgba(7, 7, 7, .9) 56%, #070707 100%); }
  .formats-hero__container { min-height: calc(760px - 105px); }
  .formats-hero__content { padding-top: 42px; }
  .formats-hero__title { font-size: clamp(47px, 13vw, 70px); }
  .formats-hero__rail { margin-left: -20px; margin-right: -20px; padding-left: 20px; }
  .formats-hero__format-link { min-height: 100px; }
  .formats-goals__grid, .formats-panel, .formats-capabilities__grid, .formats-cases__slider { gap: 46px; grid-template-columns: 1fr; }
  .formats-goals__list li { font-size: 23px; gap: 12px; grid-template-columns: 28px 1fr 18px; }
  .formats-section-heading { margin-bottom: 42px; }
  .formats-tab { flex-basis: 100px; font-size: 55px; }
  .formats-panels { padding-top: 28px; }
  .formats-panel__content { padding: 0; }
  .formats-panel__details div { display: block; }
  .formats-panel__details dt { margin-bottom: 8px; }
  .formats-journey, .formats-journey__content { min-height: 680px; }
  .formats-journey__stops { gap: 0; grid-template-columns: 1fr; margin-left: 4px; margin-top: 21px; }
  .formats-journey__stops::before { bottom: 15px; height: auto; left: 3px; right: auto; top: 0; transform: scaleY(0); transform-origin: top; width: 1px; }
  .formats-journey.is-visible .formats-journey__stops::before { transform: scaleY(1); }
  .formats-journey__stops li { display: grid; gap: 10px; grid-template-columns: 30px 8px 1fr; min-height: 66px; }
  .formats-journey__stops span { margin: 0; }
  .formats-journey__stops p { font-size: 22px; margin: 0; max-width: none; }
  .formats-system__heading { display: block; margin-bottom: 45px; }
  .formats-system__heading .formats-eyebrow { max-width: 270px; }
  .formats-system__list { grid-template-columns: 1fr; }
  .formats-system__list li, .formats-system__list li:first-child { border-left: 0; border-top: 1px solid var(--formats-rule); min-height: 0; padding: 25px 0; }
  .formats-system__list li:last-child { border-bottom: 1px solid var(--formats-rule); }
  .formats-capabilities__media { max-width: 350px; }
  .formats-case__media--desktop { display: none; }
  .formats-case__media--mobile { display: block; aspect-ratio: 16 / 10; }
  .formats-cases__controls { bottom: auto; top: 0; }
  .contact--formats .container { padding: 78px 20px; }
  .contact--formats .contact__content { display: block; }
  .contact--formats .contact__left, .contact--formats .contact__right { padding: 0; width: 100%; }
  .contact--formats .contact__left { margin-bottom: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  .formats-page *, .contact--formats * { scroll-behavior: auto !important; transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
  .formats-reveal { opacity: 1; transform: none; }
  .formats-journey__stops::before { transform: scaleX(1); }
  .formats-journey__stops li { opacity: 1; }
}

@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  .formats-journey__stops::before { transform: scaleY(1); }
}

/* Unified LIVI rhythm, route depth and canonical case work */
.formats-page {
  position: relative;
  isolation: isolate;
  font-family: var(--livi-font-body);
}

.formats-page::before {
  position: fixed;
  inset: -12%;
  z-index: -2;
  content: "";
  pointer-events: none;
  background: url("../img/retreats/hero-global-routes.png") 68% center / cover no-repeat;
  filter: brightness(.58) contrast(1.12);
  opacity: .34;
  transform: translate3d(0, var(--formats-parallax-y, 0), 0) scale(1.12);
  will-change: transform;
}

.formats-page > section { position: relative; z-index: 1; border-block: 0; box-shadow: none; }
.formats-core,
.formats-system,
.formats-capabilities,
.formats-cases,
.formats-contact { background: rgba(5, 5, 5, .54); }

.formats-eyebrow { color: var(--formats-ink); letter-spacing: .12em; }
.formats-hero__format-link span,
.formats-goals__list span,
.formats-system__list span,
.formats-capabilities__list span,
.formats-panel__index { color: var(--formats-muted); }

.formats-hero__content { max-width: 760px; padding-top: clamp(24px, 5vh, 62px); }
.formats-hero__rail { border-top-color: var(--formats-rule); }
.formats-panel__content h3,
.formats-system__list h3,
.formats-capabilities__list p { letter-spacing: var(--livi-display-tracking); }

.formats-core { min-height: var(--livi-scene-min); }
.formats-core .formats-section-heading { margin-bottom: 42px; }
.formats-panels { padding-top: 34px; }
.formats-panel { gap: clamp(36px, 4.5vw, 76px); }
.formats-panel__media { max-height: 480px; }

.formats-journey,
.formats-journey__content { min-height: 72svh; }
.formats-journey__image {
  object-position: 68% center;
  filter: brightness(.76) contrast(1.12);
  transform: translate3d(0, calc(var(--formats-parallax-y, 0) * -.32), 0) scale(1.14);
  will-change: transform;
}
.formats-journey__overlay { background: linear-gradient(90deg, rgba(3, 4, 4, .86), rgba(3, 4, 4, .48) 54%, rgba(3, 4, 4, .7)); }
.formats-journey__stops li { transition: opacity 280ms ease, transform 420ms var(--livi-ease-out); transform: translateY(12px); }
.formats-journey.is-visible .formats-journey__stops li { opacity: 1; transform: none; }
.formats-journey__stops p { letter-spacing: var(--livi-display-tracking); line-height: 1.08; }

.formats-system__heading {
  grid-template-columns: minmax(260px, .48fr) minmax(460px, 1fr);
  gap: clamp(52px, 8vw, 136px);
  align-items: start;
  max-width: none;
  margin-bottom: 62px;
}
.formats-system__heading .formats-title { max-width: 12ch; justify-self: end; }
.formats-system__list li { min-height: 190px; }

.formats-capabilities { overflow: hidden; }
.formats-capabilities::before {
  position: absolute;
  inset: -12%;
  z-index: -1;
  content: "";
  background: url("../img/retreats/hero-global-routes.png") 72% center / cover no-repeat;
  filter: brightness(.54) contrast(1.1);
  opacity: .42;
  transform: translate3d(0, calc(var(--formats-parallax-y, 0) * -.22), 0) scale(1.1);
  will-change: transform;
}
.formats-capabilities__grid { align-items: center; grid-template-columns: minmax(0, 1.2fr) minmax(260px, .42fr); }
.formats-capabilities__media { max-height: 520px; opacity: .78; }
.formats-capabilities__list li { min-height: 62px; transition: padding 220ms ease, background-color 220ms ease; }
.formats-capabilities__list li:hover { padding-left: 14px; background: rgba(240, 237, 232, .045); }

.formats-cases__heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .52fr);
  gap: 18px clamp(48px, 7vw, 118px);
  align-items: end;
  margin-bottom: 48px;
}
.formats-cases__heading .formats-eyebrow { grid-column: 1 / -1; margin-bottom: 0; }
.formats-cases__heading .formats-title { max-width: 820px; }
.formats-cases__heading > p:last-child { max-width: 42ch; margin: 0; color: var(--formats-muted); font-size: 14px; line-height: 1.6; }

.formats-cases--legacy { display: none !important; }
.formats-contact { background-color: rgba(5, 5, 5, .62); }

@media (max-width: 1199px) {
  .formats-section { min-height: 0; }
}

@media (max-width: 767px) {
  .formats-hero { min-height: 760px; padding-top: 105px; }
  .formats-hero__container { min-height: calc(760px - 105px); }
  .formats-hero__title { font-size: 42px; }
  .formats-title { font-size: 38px; }
  .formats-system__heading,
  .formats-cases__heading { display: block; }
  .formats-system__heading .formats-title { max-width: none; margin-top: 22px; }
  .formats-cases__heading > p:last-child { margin-top: 24px; }
  .formats-journey,
  .formats-journey__content { min-height: 680px; }
  .formats-capabilities__grid { grid-template-columns: 1fr; }
  .formats-capabilities__media { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .formats-page::before,
  .formats-journey__image,
  .formats-capabilities::before { transform: none; will-change: auto; }
}

/* Formats page review pass: canonical rhythm, tabs and section transitions */
.formats-hero {
  min-height: var(--livi-scene-min);
}

.formats-hero::before {
  content: "";
  position: absolute;
  z-index: 1;
  right: 0;
  bottom: -1px;
  left: 0;
  height: clamp(96px, 13vh, 170px);
  pointer-events: none;
  background: linear-gradient(180deg, rgba(5, 5, 5, 0), var(--livi-bg) 92%);
}

.formats-hero__content {
  width: min(900px, 62vw);
  max-width: none;
  padding-top: clamp(24px, 5vh, 62px);
}

.formats-hero__title {
  max-width: 900px;
}

.formats-hero__rail {
  margin-top: clamp(44px, 5vh, 72px);
}

.formats-goals::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: -1px;
  right: 0;
  left: 0;
  height: clamp(110px, 14vh, 190px);
  pointer-events: none;
  background: linear-gradient(180deg, var(--livi-bg), rgba(5, 5, 5, 0));
}

.formats-goals,
.formats-goals__grid,
.formats-core,
.formats-system,
.formats-capabilities,
.formats-cases {
  min-height: 0;
}

.formats-goals__grid,
.formats-core > .container,
.formats-system > .container,
.formats-capabilities__grid,
.formats-cases > .container {
  position: relative;
  z-index: 1;
}

.formats-core,
.formats-system,
.formats-capabilities {
	background: var(--livi-bg);
}

.formats-tabs {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.formats-tab {
  min-height: 64px;
  padding: 14px 12px;
  color: var(--formats-muted);
  font-family: var(--livi-font-body);
  font-size: var(--livi-type-action);
  font-weight: 500;
  letter-spacing: .04em;
  line-height: 1.35;
  text-transform: uppercase;
}

.formats-tab::after {
  right: 0;
  width: auto;
  height: 2px;
}

.formats-journey {
	min-height: 0;
	padding-block: var(--livi-scene-pad-y);
	background: var(--livi-bg);
}

.formats-journey__image,
.formats-journey__overlay {
  display: none;
}

.formats-journey__content {
  min-height: 0;
}

.formats-system {
  padding-block: var(--livi-scene-pad-y);
}

.formats-system__heading {
  display: block;
  max-width: 820px;
  margin-bottom: var(--livi-gap-md);
}

.formats-system__heading .formats-title {
  max-width: 820px;
  margin-top: 0;
}

.formats-system__list h3,
.formats-journey__stops p,
.formats-capabilities__list p {
  font-family: var(--livi-font-display);
}

.formats-system__list p,
.formats-panel__description,
.formats-panel__details dt,
.formats-panel__details dd,
.formats-capabilities__list span,
.formats-capabilities__list b {
  font-family: var(--livi-font-body);
}

.formats-capabilities {
  padding-block: var(--livi-scene-pad-y);
}

.formats-capabilities::before {
  display: none;
}

@media (max-width: 1199px) {
  .formats-hero__content {
    width: min(900px, 70vw);
  }

  .formats-tabs {
    display: flex;
  }

  .formats-tab {
    flex: 0 0 180px;
  }
}

@media (max-width: 767px) {
  .formats-hero__content {
    width: auto;
  }

  .formats-hero__rail {
    margin-top: 48px;
  }

  .formats-tabs {
    display: flex;
  }

  .formats-tab {
    flex-basis: 160px;
    font-size: 12px;
  }

  .formats-journey {
    padding-block: 78px;
  }
}

/* Canonical format explorer: the home block and Formats page share one rail,
 * active/hover states and detail rules. */
.home-v3-formats {
  display: block;
  align-items: initial;
}

.retreats-v2-formats {
  display: block;
  align-items: initial;
}

.home-v3-formats .formats-tabs,
.formats-page .formats-tabs,
.retreats-v2-formats .formats-tabs {
  border-bottom: 1px solid var(--formats-rule);
}

.home-v3-formats .formats-tab,
.formats-page .formats-tab,
.retreats-v2-formats .formats-tab {
  position: relative;
  color: var(--formats-muted);
  background: transparent;
  transition: color 180ms ease, background-color 180ms ease;
}

.home-v3-formats .formats-tab::after,
.formats-page .formats-tab::after,
.retreats-v2-formats .formats-tab::after {
  right: 0;
  width: auto;
  height: 2px;
}

.home-v3-formats .formats-tab:not(.is-active):hover,
.formats-page .formats-tab:not(.is-active):hover,
.retreats-v2-formats .formats-tab:not(.is-active):hover {
  color: var(--formats-ink);
  background: rgba(252, 247, 240, .045);
}

.home-v3-formats .formats-tab:not(.is-active):hover::after,
.formats-page .formats-tab:not(.is-active):hover::after,
.retreats-v2-formats .formats-tab:not(.is-active):hover::after {
  opacity: .55;
  transform: scaleX(.35);
}

.home-v3-formats .formats-panel__details,
.formats-page .formats-panel__details,
.retreats-v2-formats .formats-panel__details {
  border-top: 1px solid var(--formats-rule);
}

.home-v3-formats .formats-panel__details div,
.formats-page .formats-panel__details div,
.retreats-v2-formats .formats-panel__details div {
  border-bottom: 1px solid var(--formats-rule);
}

/* The supplied 16:9 disciplines image replaces the narrow placeholder and
 * softly blends into the dark section instead of reading as a hard card. */
.formats-capabilities__grid {
  align-items: center;
  gap: clamp(42px, 5vw, 96px);
  grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr);
}

.formats-capabilities__heading {
  margin-bottom: clamp(34px, 4vw, 58px);
}

.formats-capabilities__heading .formats-eyebrow {
  margin-bottom: 18px;
}

.formats-capabilities__heading .formats-title {
  max-width: 15ch;
  font-size: clamp(38px, 3.1vw, 56px);
}

.formats-capabilities__media {
  position: relative;
  width: 100%;
  max-width: none;
  max-height: none;
  aspect-ratio: 16 / 9;
  isolation: isolate;
  background: #111;
  opacity: 1;
}

.formats-capabilities__media::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  content: "";
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(7, 7, 7, .58), transparent 18%, transparent 78%, rgba(7, 7, 7, .8)),
    linear-gradient(90deg, rgba(7, 7, 7, .62), transparent 18%, transparent 84%, rgba(7, 7, 7, .34));
}

.formats-capabilities__media img {
  filter: brightness(.62) contrast(1.08) saturate(.78);
  mask-image: linear-gradient(90deg, transparent 0%, #000 10%, #000 90%, transparent 100%);
}

@media (max-width: 767px) {
  .formats-capabilities__grid {
    gap: 36px;
  }

  .formats-capabilities__heading {
    margin-bottom: 34px;
  }

  .formats-capabilities__media {
    display: block;
    aspect-ratio: 16 / 9;
  }
}

/* Format tabs: all supplied assets are 16:9, so keep the complete frame visible
 * and give the media column the width it needs on every implementation. */
.home-v3-formats > .formats-container {
  width: min(var(--livi-content-max), calc(100% - var(--livi-page-pad) - var(--livi-page-pad)));
  max-width: none;
  margin-inline: auto;
  padding-inline: var(--livi-case-inline-inset);
}

.home-v3-formats .formats-panel,
.formats-page .formats-panel,
.retreats-v2-formats .formats-panel {
  grid-template-columns: minmax(0, 1.2fr) minmax(310px, .8fr);
}

.home-v3-formats .formats-panel__media,
.formats-page .formats-panel__media,
.retreats-v2-formats .formats-panel__media {
  width: 100%;
  max-height: none;
  aspect-ratio: 16 / 9;
}

.home-v3-formats .formats-panel__media img,
.formats-page .formats-panel__media img,
.retreats-v2-formats .formats-panel__media img {
  object-fit: contain;
}

@media (max-width: 767px) {
  .home-v3-formats .formats-panel,
  .formats-page .formats-panel,
  .retreats-v2-formats .formats-panel {
    grid-template-columns: 1fr;
  }
}

/* Page sections use the canonical black canvas; component and media fills
 * remain independent so cards and images keep their intended contrast. */
.formats-page .formats-goals,
.formats-page .formats-core,
.formats-page .formats-system,
.formats-page .formats-cases,
.formats-page .formats-contact,
.formats-page .formats-journey,
.retreats-v2-formats {
  background: var(--livi-bg);
}
