/* ==========================================
   Homepage
   Loaded only by HomePage (lib/features/home/ui/home_page.dart).
   Global tokens come from styles.css; the variables below are home-only
   roles mapped onto them for light/dark themes.
   Motion is enhanced by web/scripts/home.js; without it every section is
   fully visible and usable.
   ========================================== */
.home-page {
  --home-ink: var(--color-black);
  --home-card: var(--color-white);
  --home-line: rgba(18, 18, 22, 0.1);
  --home-dot: rgba(18, 18, 22, 0.14);
  --home-glass: rgba(255, 255, 255, 0.78);
  --home-spot: rgba(255, 184, 0, 0.16);
  --home-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --home-radius-xl: 2rem;
  --home-radius-2xl: 2.5rem;
  --home-section-y: clamp(4rem, 8vw, 6.5rem);

  font-family: 'Manrope', system-ui, sans-serif;
  color: var(--color-text-main);
  overflow-x: clip;
}

:root[data-theme="dark"] .home-page {
  --home-ink: #1c1c24;
  --home-card: #1c1c24;
  --home-line: rgba(255, 255, 255, 0.1);
  --home-dot: rgba(255, 255, 255, 0.09);
  --home-glass: rgba(28, 28, 36, 0.78);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .home-page {
    --home-ink: #1c1c24;
    --home-card: #1c1c24;
    --home-line: rgba(255, 255, 255, 0.1);
    --home-dot: rgba(255, 255, 255, 0.09);
    --home-glass: rgba(28, 28, 36, 0.78);
  }
}

/* The global `section` rule boxes every section; the homepage controls its own widths. */
.home-page > section {
  width: 100%;
  margin: 0;
  padding: 0;
}

.home-page > .home-section {
  padding: var(--home-section-y) var(--page-gutter);
}

.home-page > .home-booking {
  padding-bottom: calc(var(--home-section-y) * 0.75);
}

.home-container {
  width: min(100%, var(--container-max-width));
  margin-inline: auto;
}

.home-icon {
  width: 1.25rem;
  height: 1.25rem;
  display: block;
  flex-shrink: 0;
}

/* ---------- Shared type ---------- */
.home-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--color-error);
}

.home-eyebrow::before {
  content: '';
  width: 1.5rem;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
}

.home-heading {
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
  max-width: 48rem;
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
}

.home-heading--center {
  align-items: center;
  margin-inline: auto;
  text-align: center;
}

.home-heading__title {
  margin: 0;
  font-size: clamp(2.25rem, 5vw, 4.25rem);
  font-weight: 800;
  line-height: 1.02;
  letter-spacing: -0.04em;
  text-wrap: balance;
}

.home-heading__subtitle {
  max-width: 38rem;
  margin: 0;
  font-size: 1.125rem;
  line-height: 1.65;
  color: var(--color-text-muted);
}

.home-heading--dark .home-heading__title {
  color: var(--color-white);
}

.home-heading--dark .home-heading__subtitle {
  color: rgba(255, 255, 255, 0.7);
}

.home-heading--dark .home-eyebrow {
  color: var(--color-primary);
}

.home-pill {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  padding: 0.4rem 0.85rem;
  border-radius: var(--radius-pill);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: var(--color-primary-20);
  color: inherit;
}

.home-tone--primary {
  background: var(--color-primary-20);
  color: var(--color-primary);
}

.home-tone--error {
  background: var(--color-error-20);
  color: var(--color-error);
}

.home-tone--success {
  background: var(--color-success-20);
  color: var(--color-success);
}

/* Masked word for slide-up headline reveals (see splitWords). */
.home-word {
  display: inline-block;
  overflow: hidden;
  padding-bottom: 0.1em;
  margin-bottom: -0.1em;
  vertical-align: top;
}

.home-word__inner {
  display: inline-block;
}

/* ---------- Buttons ---------- */
.home-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.9rem;
  min-height: 3.5rem;
  padding: 0.45rem 0.45rem 0.45rem 1.6rem;
  overflow: hidden;
  isolation: isolate;
  border: 1.5px solid transparent;
  border-radius: var(--radius-pill);
  font: inherit;
  font-size: 1rem;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition: color 0.35s var(--home-ease), border-color 0.35s var(--home-ease),
    background-color 0.35s var(--home-ease), box-shadow 0.35s var(--home-ease),
    translate 0.5s var(--home-ease);
}

.home-btn::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  transform: translateY(101%);
  transition: transform 0.5s var(--home-ease);
}

.home-btn:hover::before,
.home-btn:focus-visible::before {
  transform: translateY(0);
}

.home-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px var(--color-primary-20);
}

.home-btn__icon {
  display: grid;
  place-items: center;
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 50%;
  transition: transform 0.5s var(--home-ease), background-color 0.35s, color 0.35s;
}

.home-btn:hover .home-btn__icon {
  transform: rotate(-45deg);
}

.home-btn--primary {
  background: var(--color-primary);
  color: var(--color-text-on-primary);
  box-shadow: 0 10px 30px -10px rgba(255, 184, 0, 0.7);
}

.home-btn--primary::before {
  background: var(--color-black);
}

.home-btn--primary:hover {
  color: var(--color-white);
}

.home-btn--primary .home-btn__icon {
  background: var(--color-black);
  color: var(--color-primary);
}

.home-btn--primary:hover .home-btn__icon {
  background: var(--color-primary);
  color: var(--color-black);
}

.home-btn--ghost {
  border-color: var(--home-line);
  background: var(--home-glass);
  color: var(--color-text-main);
  backdrop-filter: blur(10px);
}

.home-btn--ghost::before {
  background: var(--color-text-main);
}

.home-btn--ghost:hover {
  color: var(--color-bg-page);
  border-color: var(--color-text-main);
}

.home-btn--ghost .home-btn__icon {
  background: var(--color-surface);
}

.home-btn--ghost:hover .home-btn__icon {
  background: var(--color-primary);
  color: var(--color-black);
}

.home-btn--block {
  width: 100%;
  justify-content: space-between;
}

/* ---------- Scroll progress + cursor ---------- */
.home-progress {
  position: fixed;
  inset: 0 0 auto;
  z-index: 1100;
  height: 3px;
  background: linear-gradient(90deg, var(--color-primary), var(--color-error));
  transform: scaleX(var(--progress, 0));
  transform-origin: left center;
  pointer-events: none;
}

.home-cursor {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2000;
  width: 2.5rem;
  height: 2.5rem;
  margin: -1.25rem 0 0 -1.25rem;
  border: 1.5px solid var(--color-primary);
  border-radius: 50%;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s, width 0.35s var(--home-ease), height 0.35s var(--home-ease),
    margin 0.35s var(--home-ease), background-color 0.35s;
}

.home-cursor-on .home-cursor {
  opacity: 1;
}

.home-cursor.is-hover {
  width: 4.5rem;
  height: 4.5rem;
  margin: -2.25rem 0 0 -2.25rem;
  background: rgba(255, 184, 0, 0.14);
}

.home-cursor.is-down {
  width: 1.75rem;
  height: 1.75rem;
  margin: -0.875rem 0 0 -0.875rem;
}

/* ==========================================
   Hero
   ========================================== */
.home-page > .home-hero {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: calc(100svh - var(--header-height));
  padding: clamp(2.5rem, 5vw, 4rem) var(--page-gutter) 7rem;
  overflow: hidden;
  isolation: isolate;
}

.home-hero__grid {
  position: absolute;
  inset: 0;
  z-index: -2;
  background-image: radial-gradient(var(--home-dot) 1.2px, transparent 1.2px);
  background-size: 28px 28px;
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 40%, #000 25%, transparent 75%);
  mask-image: radial-gradient(ellipse 80% 70% at 50% 40%, #000 25%, transparent 75%);
}

.home-hero__glow {
  position: absolute;
  top: var(--my, 45%);
  left: var(--mx, 72%);
  z-index: -1;
  width: min(48rem, 90vw);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 184, 0, 0.32) 0%, rgba(224, 90, 27, 0.08) 40%, transparent 65%);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.home-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
  width: min(100%, var(--container-max-width));
  margin-inline: auto;
}

.home-hero__eyebrow {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem;
  padding: 0.5rem 1rem 0.5rem 0.75rem;
  border: 1px solid var(--home-line);
  border-radius: var(--radius-pill);
  background: var(--home-glass);
  backdrop-filter: blur(10px);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.home-hero__meta {
  padding-left: 0.6rem;
  border-left: 1px solid var(--home-line);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: none;
  color: var(--color-text-muted);
}

.home-hero__pulse {
  position: relative;
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: var(--color-success);
  flex-shrink: 0;
}

.home-hero__pulse::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: inherit;
  animation: home-pulse 2s ease-out infinite;
}

.home-hero__title {
  margin: 1.5rem 0 1.5rem;
  font-size: clamp(2.6rem, 6.2vw, 5.6rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.05em;
  text-wrap: balance;
}

/* Highlighter swipe behind the accent words; clone keeps it on every line. */
.home-hero__accent {
  background-image: linear-gradient(var(--color-primary), var(--color-primary));
  background-repeat: no-repeat;
  background-position: 0 86%;
  background-size: 100% 0.34em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

.home-hero__body {
  max-width: 34rem;
  margin: 0 0 2.25rem;
  font-size: clamp(1.05rem, 1.35vw, 1.25rem);
  line-height: 1.65;
  color: var(--color-text-muted);
}

.home-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.9rem;
}

.home-hero__proof {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 2.5rem;
}

.home-hero__avatars {
  display: flex;
}

.home-hero__avatar {
  width: 2.75rem;
  height: 2.75rem;
  margin-left: -0.75rem;
  border: 3px solid var(--color-bg-page);
  border-radius: 50%;
  object-fit: cover;
  transition: transform 0.4s var(--home-ease);
}

.home-hero__avatar:first-child {
  margin-left: 0;
}

.home-hero__avatars:hover .home-hero__avatar {
  transform: translateY(-4px);
}

.home-hero__avatars:hover .home-hero__avatar:nth-child(2) {
  transition-delay: 0.05s;
}

.home-hero__avatars:hover .home-hero__avatar:nth-child(3) {
  transition-delay: 0.1s;
}

.home-hero__avatars:hover .home-hero__avatar:nth-child(4) {
  transition-delay: 0.15s;
}

.home-hero__avatar--more {
  display: grid;
  place-items: center;
  background: var(--color-primary);
  color: var(--color-black);
  font-weight: 800;
}

.home-hero__proof-text {
  max-width: 15rem;
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.4;
  color: var(--color-text-muted);
}

.home-hero__proof-text strong {
  display: block;
  font-size: 1.15rem;
  color: var(--color-text-main);
}

/* Visual */
.home-hero__visual {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 1;
}

.home-hero__ring {
  position: absolute;
  inset: 2%;
  border: 1.5px dashed var(--color-border);
  border-radius: 50%;
  animation: home-spin 60s linear infinite;
}

.home-hero__ring::before,
.home-hero__ring::after {
  content: '';
  position: absolute;
  width: 0.9rem;
  height: 0.9rem;
  border-radius: 50%;
  background: var(--color-primary);
  box-shadow: 0 0 0 6px var(--color-primary-20);
}

.home-hero__ring::before {
  top: 14%;
  left: 14%;
}

.home-hero__ring::after {
  right: 6%;
  bottom: 30%;
  background: var(--color-error);
  box-shadow: 0 0 0 6px var(--color-error-20);
}

.home-hero__blob {
  position: absolute;
  inset: 14%;
  background: linear-gradient(145deg, #ffd24d 0%, var(--color-primary) 45%, #ff9a1f 100%);
  border-radius: 42% 58% 63% 37% / 41% 44% 56% 59%;
  box-shadow: inset 0 -30px 60px rgba(224, 90, 27, 0.25), 0 40px 80px -30px rgba(255, 184, 0, 0.6);
  animation: home-morph 14s ease-in-out infinite;
}

.home-hero__image {
  position: relative;
  width: 118%;
  max-width: none;
  height: auto;
  margin-top: 6%;
  filter: drop-shadow(0 30px 40px rgba(18, 18, 22, 0.22));
}

.home-chip {
  position: absolute;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.8rem 1.1rem;
  border: 1px solid var(--home-line);
  border-radius: 1.1rem;
  background: var(--home-glass);
  backdrop-filter: blur(14px);
  box-shadow: 0 20px 40px -20px rgba(18, 18, 22, 0.35);
  font-weight: 800;
  white-space: nowrap;
  animation: home-bob 6s ease-in-out infinite;
}

.home-chip--rotator {
  top: 10%;
  left: -4%;
  font-size: 1.2rem;
}

.home-chip--cervantes {
  bottom: 16%;
  left: -8%;
  animation-delay: -2s;
}

.home-chip--habla {
  top: 22%;
  right: -6%;
  gap: 0.5rem;
  border-color: transparent;
  background: var(--color-black);
  color: var(--color-primary);
  animation-delay: -4s;
}

.home-chip__sparkle {
  width: 1rem;
  height: 1rem;
  animation: home-spin 6s linear infinite;
}

.home-chip__icon {
  width: 2.25rem;
  height: 2.25rem;
  padding: 0.45rem;
  border-radius: 0.7rem;
  background: var(--color-primary-20);
}

.home-chip__text {
  display: flex;
  flex-direction: column;
  font-size: 0.9rem;
  line-height: 1.25;
}

.home-chip__text span {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--color-text-muted);
}

.home-rotator {
  display: inline-grid;
  overflow: hidden;
}

.home-rotator__word {
  grid-area: 1 / 1;
  opacity: 0;
  transform: translateY(70%);
  transition: opacity 0.5s var(--home-ease), transform 0.6s var(--home-ease);
}

.home-rotator__word.is-active {
  opacity: 1;
  transform: none;
}

.home-rotator__word.is-leaving {
  opacity: 0;
  transform: translateY(-70%);
}

/* MaxiBee popover */
.home-mascot {
  position: absolute;
  right: 4%;
  bottom: 2%;
  z-index: 3;
}

.home-mascot__trigger {
  display: grid;
  place-items: center;
  width: 5rem;
  height: 5rem;
  padding: 0;
  border: 1px solid var(--home-line);
  border-radius: 50%;
  background: var(--home-glass);
  backdrop-filter: blur(14px);
  box-shadow: 0 20px 40px -20px rgba(18, 18, 22, 0.4);
  cursor: pointer;
  transition: transform 0.5s var(--home-ease);
}

.home-mascot__trigger:hover,
.home-mascot.is-open .home-mascot__trigger {
  transform: scale(1.08) rotate(-8deg);
}

.home-mascot__trigger:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px var(--color-primary-20);
}

.home-mascot__bee {
  width: 3.75rem;
  height: auto;
  animation: home-wobble 3s ease-in-out infinite;
}

.home-mascot__card {
  position: absolute;
  right: 0;
  bottom: calc(100% + 0.9rem);
  width: min(20rem, 80vw);
  padding: 1.25rem 1.35rem;
  border: 1px solid var(--home-line);
  border-radius: 1.25rem;
  background: var(--home-card);
  box-shadow: var(--shadow-elevated);
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px) scale(0.96);
  transform-origin: bottom right;
  transition: opacity 0.35s var(--home-ease), transform 0.45s var(--home-ease), visibility 0.35s;
}

.home-mascot:hover .home-mascot__card,
.home-mascot:focus-within .home-mascot__card,
.home-mascot.is-open .home-mascot__card {
  opacity: 1;
  visibility: visible;
  transform: none;
}

.home-mascot__title {
  display: block;
  margin-bottom: 0.4rem;
  font-size: 1rem;
}

.home-mascot__body {
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.55;
  color: var(--color-text-muted);
}

/* Scroll cue */
.home-hero__scroll {
  position: absolute;
  bottom: 1.75rem;
  left: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.6rem;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--color-text-muted);
  transform: translateX(-50%);
}

.home-hero__scroll-mouse {
  display: flex;
  justify-content: center;
  width: 1.4rem;
  height: 2.2rem;
  padding-top: 0.4rem;
  border: 2px solid currentColor;
  border-radius: 1rem;
}

.home-hero__scroll-dot {
  width: 0.25rem;
  height: 0.5rem;
  border-radius: 1rem;
  background: var(--color-primary);
  animation: home-scroll-dot 1.8s ease-in-out infinite;
}

/* ==========================================
   Stats band: bee-carried cards
   Static grid by default; `.is-flying` (set by home.js) switches to the
   flock where every card is absolutely positioned and moved per frame.
   ========================================== */
.home-page > .home-stats {
  position: relative;
  width: auto;
  margin-inline: var(--page-gutter);
  padding: clamp(1.25rem, 2.5vw, 2rem);
  overflow: hidden;
  border-radius: var(--home-radius-2xl);
  background:
    radial-gradient(60rem 20rem at 50% 120%, rgba(255, 184, 0, 0.14), transparent 70%),
    var(--home-ink);
  color: var(--color-white);
}

.home-stats__hint {
  display: none;
  position: absolute;
  top: 1.25rem;
  left: 50%;
  z-index: 3;
  margin: 0;
  padding: 0.45rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.05);
  font-size: 0.75rem;
  font-weight: 700;
  white-space: nowrap;
  color: rgba(255, 255, 255, 0.7);
  transform: translateX(-50%);
  pointer-events: none;
}

.home-stats:has(.is-flying) .home-stats__hint {
  display: block;
}

.home-stats__sky {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.75rem;
  width: min(100%, var(--container-max-width));
  margin-inline: auto;
}

.home-stat {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.home-stat__carrier {
  position: relative;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 6.75rem;
  height: 4.25rem;
  margin-bottom: -0.25rem;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.home-stat__carrier:focus-visible {
  outline: none;
}

.home-stat__carrier:focus-visible .home-stat__bee {
  filter: drop-shadow(0 0 0.5rem rgba(255, 184, 0, 0.9));
}

/* The source PNG faces left with wide transparent padding: flip and crop. */
.home-stat__bee {
  width: 10.5rem;
  max-width: none;
  height: auto;
  margin: -3.1rem;
  transform: scaleX(-1);
  pointer-events: none;
  animation: home-buzz 0.16s ease-in-out infinite alternate;
}

.home-stat__carrier:hover .home-stat__bee {
  animation-duration: 0.08s;
}

.home-stat.is-looping .home-stat__carrier {
  animation: home-loop 0.9s var(--home-ease);
}

.home-stat__bubble {
  position: absolute;
  bottom: 80%;
  left: 70%;
  padding: 0.3rem 0.65rem;
  border-radius: 0.8rem 0.8rem 0.8rem 0.2rem;
  background: var(--color-white);
  font-size: 0.8rem;
  font-weight: 800;
  white-space: nowrap;
  color: var(--color-black);
  opacity: 0;
  transform: translateY(6px) scale(0.6);
  transform-origin: bottom left;
  transition: opacity 0.25s, transform 0.35s var(--motion-easing-bounce);
  pointer-events: none;
}

.home-stat.is-looping .home-stat__bubble,
.home-stat.is-grabbed .home-stat__bubble {
  opacity: 1;
  transform: none;
}

/* Two threads from the bee's legs down to the card. */
.home-stat__strings {
  position: relative;
  z-index: 1;
  width: 55%;
  height: 1.1rem;
}

.home-stat__strings::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to bottom right, transparent calc(50% - 1px), rgba(255, 184, 0, 0.55) 50%, transparent calc(50% + 1px)) left / 50% 100% no-repeat,
    linear-gradient(to bottom left, transparent calc(50% - 1px), rgba(255, 184, 0, 0.55) 50%, transparent calc(50% + 1px)) right / 50% 100% no-repeat;
}

.home-stat__card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  width: 100%;
  padding: 1.4rem 1.3rem;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 1.5rem;
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(6px);
  transition: border-color 0.4s, background-color 0.4s, box-shadow 0.4s, transform 0.4s var(--home-ease);
}

.home-stat:hover .home-stat__card,
.home-stat.is-grabbed .home-stat__card {
  border-color: rgba(255, 184, 0, 0.45);
  background: rgba(255, 255, 255, 0.08);
  box-shadow: 0 24px 50px -20px rgba(0, 0, 0, 0.6);
}

.home-stat.is-grabbed .home-stat__card {
  transform: scale(1.04);
}

.home-stat__label {
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  color: var(--color-primary);
}

.home-stat__value {
  display: flex;
  align-items: baseline;
  gap: 0.1rem;
  font-size: clamp(2.2rem, 3.4vw, 3.2rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.045em;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.home-stat__suffix {
  color: var(--color-primary);
}

.home-stat__description {
  margin: 0;
  font-size: 0.88rem;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.62);
}

/* Flying mode */
.home-stats__sky.is-flying {
  position: relative;
  display: block;
  width: auto;
  height: 23.5rem;
  margin-inline: calc(-1 * clamp(1.25rem, 2.5vw, 2rem));
  touch-action: pan-y;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}

.home-stats__sky.is-flying .home-stat {
  position: absolute;
  top: 3.25rem;
  left: 0;
  width: 15rem;
  cursor: grab;
  user-select: none;
  -webkit-user-select: none;
  will-change: transform;
}

.home-stats__sky.is-flying .home-stat.is-grabbed {
  z-index: 5;
  cursor: grabbing;
}

.home-stats__sky.is-flying .home-stat__card {
  min-height: 10.5rem;
}

.home-honey {
  position: absolute;
  z-index: 6;
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50% 50% 50% 0;
  background: var(--color-primary);
  pointer-events: none;
  animation: home-honey 0.9s cubic-bezier(0.2, 0.7, 0.3, 1) forwards;
}

@keyframes home-buzz {
  from {
    translate: 0 -1px;
    rotate: -2deg;
  }
  to {
    translate: 0 1px;
    rotate: 2deg;
  }
}

@keyframes home-loop {
  0% {
    transform: none;
  }
  50% {
    transform: translateY(-2.5rem) rotate(-200deg) scale(1.15);
  }
  100% {
    transform: rotate(-360deg);
  }
}

@keyframes home-honey {
  from {
    opacity: 1;
    transform: translate(-50%, -50%) rotate(-45deg) scale(1);
  }
  to {
    opacity: 0;
    transform: translate(calc(-50% + var(--x)), calc(-50% + var(--y))) rotate(-45deg) scale(0.4);
  }
}


/* ==========================================
   Marquee
   ========================================== */
.home-page > .home-marquee {
  padding: clamp(4rem, 8vw, 6.5rem) 0 clamp(2rem, 4vw, 3rem);
  overflow: hidden;
}

.home-marquee__row {
  display: flex;
  overflow: hidden;
  padding: 1.1rem 0;
  transform: rotate(var(--tilt)) skewX(var(--skew, 0deg));
  transition: transform 0.4s var(--home-ease);
}

.home-marquee__row--forward {
  --tilt: -2deg;
  position: relative;
  z-index: 1;
  margin-inline: -2rem;
  background: var(--color-primary);
  color: var(--color-black);
}

.home-marquee__row--reverse {
  --tilt: 1.5deg;
  margin: -0.5rem -2rem 0;
  background: var(--home-ink);
  color: var(--color-white);
}

.home-marquee__track {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 2.25rem;
  padding-right: 2.25rem;
  width: max-content;
  animation: home-marquee 38s linear infinite;
}

.home-marquee__row--reverse .home-marquee__track {
  animation-direction: reverse;
  animation-duration: 44s;
}

.home-marquee:hover .home-marquee__track {
  animation-play-state: paused;
}

.home-marquee__word {
  font-size: clamp(2.25rem, 6vw, 5rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.03em;
  text-transform: uppercase;
}

.home-marquee__row--reverse .home-marquee__word {
  color: transparent;
  -webkit-text-stroke: 1.5px var(--color-white);
}

.home-marquee__star {
  width: clamp(1.5rem, 3vw, 2.5rem);
  height: auto;
  color: var(--color-error);
}

.home-marquee__row--reverse .home-marquee__star {
  color: var(--color-primary);
}

/* ==========================================
   Methodology tabs
   ========================================== */
.home-tabs {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: clamp(1rem, 3vw, 2rem);
  align-items: stretch;
}

.home-tabs__list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.home-tabs__hint {
  margin-bottom: 0.25rem;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-text-secondary);
}

.home-tab {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1.25rem;
  align-items: start;
  width: 100%;
  padding: 1.5rem 1.5rem 1.75rem;
  overflow: hidden;
  border: 1px solid var(--home-line);
  border-radius: 1.5rem;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background-color 0.4s var(--home-ease), border-color 0.4s, box-shadow 0.4s, transform 0.5s var(--home-ease);
}

.home-tab:hover {
  background: var(--home-card);
  transform: translateX(6px);
}

.home-tab.is-active {
  border-color: transparent;
  background: var(--home-card);
  box-shadow: 0 24px 48px -28px rgba(18, 18, 22, 0.35);
  transform: none;
}

.home-tab:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px var(--color-primary-20);
}

.home-tab__index {
  font-size: 0.85rem;
  font-weight: 800;
  color: var(--color-text-secondary);
  font-variant-numeric: tabular-nums;
  transition: color 0.3s;
}

.home-tab.is-active .home-tab__index {
  color: var(--color-error);
}

.home-tab__text {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.home-tab__tag {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}

.home-tab__title {
  font-size: clamp(1.15rem, 1.6vw, 1.4rem);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

.home-tab__progress {
  position: absolute;
  right: 1.5rem;
  bottom: 0.9rem;
  left: 1.5rem;
  height: 3px;
  overflow: hidden;
  border-radius: 3px;
  background: var(--home-line);
  opacity: 0;
  transition: opacity 0.3s;
}

.home-tab.is-active .home-tab__progress {
  opacity: 1;
}

.home-tab__bar {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--color-primary);
  transform-origin: left center;
}

.home-tabs.is-autoplay .home-tab.is-active .home-tab__bar {
  animation: home-tab-fill var(--tab-duration, 7s) linear forwards;
}

.home-tabs.is-paused .home-tab.is-active .home-tab__bar {
  animation-play-state: paused;
}

.home-tabs__panels {
  position: relative;
  display: grid;
  transform: perspective(1200px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
  transition: transform 0.6s var(--home-ease);
}

.home-panel {
  position: relative;
  grid-area: 1 / 1;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  min-height: 100%;
  padding: clamp(2rem, 4vw, 3.5rem);
  overflow: hidden;
  border-radius: var(--home-radius-xl);
  background: var(--home-ink);
  color: var(--color-white);
}

.home-panel[hidden] {
  display: none;
}

.home-panel.is-entering {
  animation: home-panel-in 0.7s var(--home-ease) both;
}

.home-panel__watermark {
  position: absolute;
  right: -0.5rem;
  bottom: -4rem;
  font-size: clamp(10rem, 20vw, 18rem);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.06em;
  color: rgba(255, 255, 255, 0.04);
  pointer-events: none;
}

.home-panel__icon-wrap {
  display: grid;
  place-items: center;
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 1.25rem;
}

.home-panel__icon {
  width: 2.25rem;
  height: 2.25rem;
  object-fit: contain;
}

.home-panel__title {
  margin: 0.5rem 0 0;
  font-size: clamp(1.75rem, 3vw, 2.6rem);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -0.035em;
}

.home-panel__description {
  max-width: 34rem;
  margin: 0;
  font-size: 1.08rem;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.74);
}

.home-panel__footer {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  margin-top: auto;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  font-weight: 700;
}

.home-panel__check {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: var(--color-primary);
  color: var(--color-black);
}

.home-panel__check .home-icon {
  width: 1rem;
  height: 1rem;
}

/* ==========================================
   Founder
   ========================================== */
.home-founder__layout {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: clamp(2rem, 6vw, 6rem);
  align-items: start;
}

.home-founder__media {
  position: sticky;
  top: 2rem;
}

.home-founder__card {
  position: relative;
  aspect-ratio: 4 / 5;
  margin: 0;
  overflow: hidden;
  border-radius: var(--home-radius-xl);
  background: var(--color-surface);
  transform: perspective(1200px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
  transition: transform 0.6s var(--home-ease);
}

.home-founder__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 62% center;
  transition: transform 1.2s var(--home-ease);
}

.home-founder__card:hover .home-founder__photo {
  transform: scale(1.06);
}

.home-founder__caption {
  position: absolute;
  right: 1rem;
  bottom: 1rem;
  left: 1rem;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  padding: 1rem 1.25rem;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 1.25rem;
  background: rgba(18, 18, 22, 0.55);
  backdrop-filter: blur(14px);
  color: var(--color-white);
}

.home-founder__caption strong {
  font-size: 1.1rem;
}

.home-founder__caption span {
  font-size: 0.82rem;
  color: rgba(255, 255, 255, 0.75);
}

.home-founder__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1rem;
}

.home-founder__badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.6rem 1rem;
  border: 1px solid var(--home-line);
  border-radius: var(--radius-pill);
  background: var(--home-card);
  font-size: 0.82rem;
  font-weight: 700;
  transition: transform 0.4s var(--home-ease);
}

.home-founder__badge:hover {
  transform: translateY(-3px);
}

.home-founder__badge--primary {
  border-color: transparent;
  background: var(--color-primary-20);
}

.home-founder__badge--dark {
  border-color: transparent;
  background: var(--home-ink);
  color: var(--color-primary);
}

.home-founder__badge-icon {
  width: 1.1rem;
  height: 1.1rem;
}

.home-founder__content {
  padding-top: 1rem;
}

.home-founder__quote-mark {
  display: block;
  height: 4.5rem;
  margin-top: 1.5rem;
  font-size: 9rem;
  font-weight: 800;
  line-height: 1;
  color: var(--color-primary);
}

.home-founder__quote {
  margin: 0 0 2.5rem;
  font-size: clamp(1.85rem, 3.5vw, 3.1rem);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.035em;
}

.home-founder__word {
  transition: opacity 0.35s ease, color 0.35s ease;
}

.home-founder__body {
  max-width: 38rem;
}

.home-founder__body p {
  margin: 0 0 1.1rem;
  font-size: 1.08rem;
  line-height: 1.75;
  color: var(--color-text-muted);
}

.home-founder__signature {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--home-line);
}

.home-founder__signature-bee {
  width: 3.25rem;
  height: auto;
  animation: home-wobble 3s ease-in-out infinite;
}

.home-founder__signature span {
  display: flex;
  flex-direction: column;
  font-size: 0.85rem;
  color: var(--color-text-muted);
}

.home-founder__signature strong {
  font-size: 1.05rem;
  color: var(--color-text-main);
}

/* ==========================================
   Phrases (flip cards)
   ========================================== */
.home-page > .home-phrases {
  position: relative;
  width: auto;
  margin-inline: var(--page-gutter);
  overflow: hidden;
  isolation: isolate;
  border-radius: var(--home-radius-2xl);
  background: var(--home-ink);
  color: var(--color-white);
}

.home-phrases__glow {
  position: absolute;
  top: -20rem;
  left: -10rem;
  z-index: -1;
  width: 45rem;
  height: 45rem;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 184, 0, 0.22), transparent 65%);
  animation: home-drift 18s ease-in-out infinite alternate;
}

.home-phrases__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
}

.home-phrase-wrap {
  position: relative;
  height: 15rem;
  perspective: 1200px;
}

.home-phrase {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transform-style: preserve-3d;
  transition: transform 0.8s var(--home-ease);
}

.home-phrase:hover {
  transform: rotateY(-8deg) rotateX(4deg);
}

.home-phrase[aria-pressed="true"] {
  transform: rotateY(180deg);
}

.home-phrase:focus-visible {
  outline: none;
}

.home-phrase:focus-visible .home-phrase__face {
  box-shadow: 0 0 0 4px rgba(255, 184, 0, 0.5);
}

.home-phrase__face {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.75rem;
  border-radius: 1.5rem;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.home-phrase__face--front {
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02));
}

.home-phrase__face--back {
  background: var(--color-primary);
  color: var(--color-black);
  transform: rotateY(180deg);
}

.home-phrase__tag {
  padding-right: 3.5rem;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--color-primary);
}

.home-phrase__face--back .home-phrase__tag {
  letter-spacing: 0.02em;
  text-transform: none;
  font-size: 0.9rem;
  color: rgba(18, 18, 22, 0.6);
}

.home-phrase__text {
  font-size: clamp(1.45rem, 2.3vw, 1.95rem);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.025em;
}

.home-phrase__hint {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.8rem;
  font-weight: 700;
  opacity: 0.6;
}

.home-phrase__hint .home-icon {
  width: 1rem;
  height: 1rem;
  transition: transform 0.6s var(--home-ease);
}

.home-phrase:hover .home-phrase__hint .home-icon {
  transform: rotate(180deg);
}

.home-phrase__listen {
  position: absolute;
  top: 1.1rem;
  right: 1.1rem;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--color-primary);
  color: var(--color-black);
  cursor: pointer;
  transition: transform 0.4s var(--home-ease), background-color 0.3s, color 0.3s;
}

.home-phrase__listen:hover {
  transform: scale(1.1);
}

.home-phrase__listen:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px rgba(255, 184, 0, 0.5);
}

.home-phrase-wrap:has(.home-phrase[aria-pressed="true"]) .home-phrase__listen {
  background: var(--color-black);
  color: var(--color-primary);
}

.home-phrase__listen.is-speaking::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2px solid var(--color-primary);
  animation: home-pulse 1s ease-out infinite;
}

.home-no-speech .home-phrase__listen {
  display: none;
}

/* ==========================================
   Community bento
   ========================================== */
.home-bento {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 1.25rem;
}

.home-bento__card {
  position: relative;
  display: flex;
  min-height: 20rem;
  overflow: hidden;
  border: 1px solid var(--home-line);
  border-radius: 1.75rem;
  background: var(--home-card);
  transform: perspective(1100px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
  transition: transform 0.6s var(--home-ease), box-shadow 0.5s var(--home-ease);
}

.home-bento__card:hover {
  box-shadow: 0 30px 60px -30px rgba(18, 18, 22, 0.35);
}

.home-bento__card--tapas,
.home-bento__card--book {
  grid-column: span 4;
}

.home-bento__card--cinema,
.home-bento__card--immersion {
  grid-column: span 2;
}

.home-bento__card--book {
  flex-direction: row-reverse;
}

.home-bento__media {
  flex: 0 0 46%;
  overflow: hidden;
}

.home-bento__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom;
  /* The source photos carry a thin UI strip at the top; scaling from the
     bottom edge keeps it out of frame. */
  transform: scale(1.12);
  transform-origin: center bottom;
  transition: transform 1.2s var(--home-ease);
}

.home-bento__card:hover .home-bento__img {
  transform: scale(1.2);
}

.home-bento__content {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 0.9rem;
  padding: clamp(1.5rem, 2.5vw, 2.25rem);
}

.home-bento__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.5rem;
}

.home-bento__icon-wrap {
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  border-radius: 0.9rem;
  background: var(--color-primary-20);
  transition: transform 0.5s var(--home-ease);
}

.home-bento__card:hover .home-bento__icon-wrap {
  transform: rotate(-10deg) scale(1.08);
}

.home-bento__icon {
  width: 1.5rem;
  height: 1.5rem;
  object-fit: contain;
}

.home-bento__title {
  margin: 0;
  font-size: clamp(1.3rem, 2vw, 1.6rem);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.025em;
}

.home-bento__description {
  margin: 0;
  font-size: 0.98rem;
  line-height: 1.6;
  color: var(--color-text-muted);
}

.home-bento__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: auto;
  padding-top: 1.1rem;
  border-top: 1px solid var(--home-line);
  font-size: 0.85rem;
  font-weight: 700;
}

.home-bento__card--cinema {
  border-color: transparent;
  background: var(--home-ink);
  color: var(--color-white);
}

.home-bento__card--cinema .home-bento__description {
  color: rgba(255, 255, 255, 0.7);
}

.home-bento__card--cinema .home-bento__footer {
  border-color: rgba(255, 255, 255, 0.12);
  color: var(--color-primary);
}

.home-bento__card--cinema .home-bento__icon-wrap {
  background: rgba(255, 184, 0, 0.18);
}

.home-bento__card--immersion {
  --home-spot: rgba(255, 255, 255, 0.35);
  border-color: transparent;
  background: var(--color-primary);
  color: var(--color-black);
}

.home-bento__card--immersion .home-bento__description {
  color: rgba(18, 18, 22, 0.72);
}

.home-bento__card--immersion .home-bento__footer {
  border-color: rgba(18, 18, 22, 0.14);
}

.home-bento__card--immersion .home-bento__icon-wrap {
  background: var(--color-black);
}

.home-bento__arrow {
  display: grid;
  place-items: center;
  width: 2.4rem;
  height: 2.4rem;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--color-black);
  color: var(--color-primary);
  transition: transform 0.5s var(--home-ease);
}

.home-bento__card:hover .home-bento__arrow {
  transform: rotate(45deg);
}

/* Cursor-following spotlight shared by cards marked data-spotlight. */
.home-page [data-spotlight]::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
  background: radial-gradient(26rem circle at var(--sx, 50%) var(--sy, 50%), var(--home-spot), transparent 45%);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.4s;
}

.home-page [data-spotlight]:hover::after {
  opacity: 1;
}

/* ==========================================
   Values accordion
   ========================================== */
.home-values__list {
  display: flex;
  gap: 1rem;
  height: 27rem;
}

.home-value {
  position: relative;
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  min-width: 0;
  padding: 2rem;
  overflow: hidden;
  border: 1px solid var(--home-line);
  border-radius: 1.75rem;
  background: var(--home-card);
  transition: flex-grow 0.7s var(--home-ease), background-color 0.5s, color 0.5s, border-color 0.5s;
}

.home-value.is-open {
  flex-grow: 2.6;
  border-color: transparent;
}

.home-value--primary.is-open {
  background: var(--color-primary);
  color: var(--color-black);
}

.home-value--success.is-open {
  background: var(--home-ink);
  color: var(--color-white);
}

.home-value--error.is-open {
  background: var(--color-error);
  color: var(--color-white);
}

.home-value__head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.25rem;
  width: 100%;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.home-value__head:focus-visible {
  outline: none;
}

.home-value:has(.home-value__head:focus-visible) {
  box-shadow: 0 0 0 4px var(--color-primary-20);
}

.home-value__index {
  font-size: 0.85rem;
  font-weight: 800;
  opacity: 0.55;
}

.home-value__icon-wrap {
  display: grid;
  place-items: center;
  width: 3.75rem;
  height: 3.75rem;
  border-radius: 1.1rem;
  transition: transform 0.6s var(--home-ease);
}

.home-value.is-open .home-value__icon-wrap {
  background: rgba(255, 255, 255, 0.92);
  transform: rotate(-8deg);
}

.home-value__icon {
  width: 1.75rem;
  height: 1.75rem;
  object-fit: contain;
}

.home-value__title {
  font-size: clamp(1.25rem, 1.9vw, 1.6rem);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.025em;
}

.home-value__body {
  display: grid;
  grid-template-rows: 0fr;
  margin-top: auto;
  opacity: 0;
  transition: grid-template-rows 0.6s var(--home-ease), opacity 0.4s;
}

.home-value.is-open .home-value__body {
  grid-template-rows: 1fr;
  opacity: 1;
  transition-delay: 0.15s;
}

.home-value__body p {
  min-height: 0;
  max-width: 34rem;
  margin: 0;
  overflow: hidden;
  font-size: 1rem;
  line-height: 1.65;
  opacity: 0.85;
}

/* ==========================================
   Booking
   ========================================== */
.home-booking__card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0.75rem;
  padding: 0.75rem;
  border-radius: var(--home-radius-2xl);
  background: var(--home-ink);
  color: var(--color-white);
}

.home-booking__intro {
  position: relative;
  padding: clamp(1.75rem, 4.5vw, 3.75rem);
  overflow: hidden;
  isolation: isolate;
}

.home-booking__orb {
  position: absolute;
  z-index: -1;
  border-radius: 50%;
  filter: blur(40px);
  animation: home-drift 16s ease-in-out infinite alternate;
}

.home-booking__orb--one {
  top: -6rem;
  right: -6rem;
  width: 20rem;
  height: 20rem;
  background: rgba(255, 184, 0, 0.35);
}

.home-booking__orb--two {
  bottom: -8rem;
  left: -4rem;
  width: 18rem;
  height: 18rem;
  background: rgba(224, 90, 27, 0.28);
  animation-delay: -6s;
}

.home-booking__badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  border: 1px solid rgba(255, 184, 0, 0.35);
  border-radius: var(--radius-pill);
  background: rgba(255, 184, 0, 0.12);
  font-size: 0.8rem;
  font-weight: 800;
  color: var(--color-primary);
}

.home-booking__badge-icon {
  width: 1rem;
  height: 1rem;
}

.home-booking__title {
  margin: 1.5rem 0 1rem;
  font-size: clamp(2rem, 3.6vw, 3.2rem);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -0.04em;
  text-wrap: balance;
}

.home-booking__description {
  max-width: 32rem;
  margin: 0 0 2rem;
  font-size: 1.05rem;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.72);
}

.home-booking__benefits {
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.home-booking__benefit {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  font-weight: 600;
}

.home-booking__check {
  display: grid;
  place-items: center;
  width: 1.75rem;
  height: 1.75rem;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--color-primary);
  color: var(--color-black);
}

.home-booking__check .home-icon {
  width: 0.95rem;
  height: 0.95rem;
}

.home-booking__bee {
  position: absolute;
  top: 1.5rem;
  right: 1.75rem;
  width: 5.5rem;
  height: auto;
  animation: home-bob 5s ease-in-out infinite;
}

.home-booking__panel {
  position: relative;
  padding: clamp(1.75rem, 3.5vw, 3rem);
  overflow: hidden;
  border-radius: var(--home-radius-xl);
  background: var(--color-bg-page);
  color: var(--color-text-main);
}

.home-booking__form {
  display: flex;
  flex-direction: column;
  gap: 1.15rem;
}

.home-booking__form[hidden],
.home-booking__success[hidden] {
  display: none;
}

.home-booking__form-title {
  margin: 0 0 0.4rem;
  font-size: clamp(1.5rem, 2.2vw, 1.85rem);
  font-weight: 800;
  letter-spacing: -0.025em;
}

.home-booking__form-subtitle {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.6;
  color: var(--color-text-muted);
}

.home-field {
  position: relative;
}

.home-field__input {
  width: 100%;
  height: 3.9rem;
  padding: 1.45rem 1.1rem 0.45rem;
  border: 1.5px solid var(--color-border);
  border-radius: 1rem;
  background: var(--home-card);
  color: var(--color-text-main);
  font: inherit;
  font-size: 1rem;
  transition: border-color 0.25s, box-shadow 0.25s;
}

.home-field__input:hover {
  border-color: var(--color-text-muted);
}

.home-field__input:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 4px var(--color-primary-20);
}

.home-field__label {
  position: absolute;
  top: 1.95rem;
  left: 1.15rem;
  font-size: 1rem;
  color: var(--color-text-muted);
  pointer-events: none;
  transform: translateY(-50%);
  transform-origin: left center;
  transition: top 0.3s var(--home-ease), font-size 0.3s var(--home-ease), color 0.3s;
}

.home-field__input:focus ~ .home-field__label,
.home-field__input:not(:placeholder-shown) ~ .home-field__label {
  top: 1.1rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--color-text-main);
}

.home-field__hint {
  position: absolute;
  top: 1.45rem;
  left: 1.15rem;
  height: 1.95rem;
  display: flex;
  align-items: center;
  font-size: 1rem;
  color: var(--color-text-secondary);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s;
}

.home-field__input:focus:placeholder-shown ~ .home-field__hint {
  opacity: 1;
}

.home-field__error {
  display: block;
  margin-top: 0.35rem;
  padding-left: 0.25rem;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--color-error);
}

.home-field__error:empty {
  display: none;
}

.home-field.is-invalid .home-field__input {
  border-color: var(--color-error);
  animation: home-shake 0.45s ease;
}

.home-levels {
  margin: 0;
  padding: 0;
  border: 0;
}

.home-levels__legend {
  margin-bottom: 0.6rem;
  padding: 0;
  font-size: 0.85rem;
  font-weight: 700;
}

.home-levels__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.home-level {
  position: relative;
}

.home-level__input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.home-level__chip {
  display: inline-flex;
  padding: 0.65rem 1.1rem;
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-pill);
  font-size: 0.9rem;
  font-weight: 700;
  cursor: pointer;
  transition: background-color 0.3s, color 0.3s, border-color 0.3s, transform 0.4s var(--home-ease);
}

.home-level__chip:hover {
  border-color: var(--color-text-main);
  transform: translateY(-2px);
}

.home-level__input:checked + .home-level__chip {
  border-color: var(--color-primary);
  background: var(--color-primary);
  color: var(--color-black);
}

.home-level__input:focus-visible + .home-level__chip {
  box-shadow: 0 0 0 4px var(--color-primary-20);
}

.home-booking__consent {
  margin: 0;
  font-size: 0.75rem;
  line-height: 1.5;
  color: var(--color-text-muted);
}

.home-booking__success {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 1rem;
  min-height: 100%;
  animation: home-panel-in 0.7s var(--home-ease) both;
}

.home-booking__success:focus {
  outline: none;
}

.home-booking__success-icon {
  display: grid;
  place-items: center;
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 50%;
  background: var(--color-success);
  color: var(--color-white);
  animation: home-pop 0.7s var(--motion-easing-bounce) both 0.15s;
}

.home-booking__success-icon .home-icon {
  width: 2rem;
  height: 2rem;
}

.home-confetti {
  position: absolute;
  top: 40%;
  left: 50%;
  z-index: 5;
  width: 0.6rem;
  height: 0.9rem;
  border-radius: 2px;
  pointer-events: none;
  animation: home-confetti 1.3s cubic-bezier(0.2, 0.7, 0.3, 1) forwards;
}

/* ==========================================
   Reveal-on-scroll (only when home.js runs and motion is allowed)
   ========================================== */
@media (prefers-reduced-motion: no-preference) {
  .home-js .home-page [data-reveal] {
    opacity: 0;
    translate: 0 2.5rem;
    transition: opacity 0.9s ease var(--d, 0ms), translate 1.1s var(--home-ease) var(--d, 0ms),
      transform 0.6s var(--home-ease), box-shadow 0.5s var(--home-ease),
      border-color 0.4s, background-color 0.4s;
  }

  .home-js .home-page [data-reveal].is-visible {
    opacity: 1;
    translate: none;
  }

  .home-js .home-page .home-word__inner {
    transform: translateY(110%);
    transition: transform 1s var(--home-ease) calc(var(--i, 0) * 45ms + 0.1s);
  }

  .home-js .home-page .is-visible .home-word__inner,
  .home-js .home-hero.is-loaded .home-word__inner {
    transform: none;
  }

  .home-js .home-hero__accent {
    background-size: 0% 0.34em;
    transition: background-size 1.1s var(--home-ease) 0.9s;
  }

  .home-js .home-hero.is-loaded .home-hero__accent {
    background-size: 100% 0.34em;
  }

  .home-js .home-hero__eyebrow,
  .home-js .home-hero__body,
  .home-js .home-hero__actions,
  .home-js .home-hero__proof {
    opacity: 0;
    translate: 0 1.5rem;
    transition: opacity 0.9s ease, translate 1s var(--home-ease);
  }

  .home-js .home-hero__body {
    transition-delay: 0.45s;
  }

  .home-js .home-hero__actions {
    transition-delay: 0.6s;
  }

  .home-js .home-hero__proof {
    transition-delay: 0.75s;
  }

  .home-js .home-hero.is-loaded :is(.home-hero__eyebrow, .home-hero__body, .home-hero__actions, .home-hero__proof) {
    opacity: 1;
    translate: none;
  }

  .home-js .home-hero__visual {
    opacity: 0;
    scale: 0.92;
    transition: opacity 1.2s ease 0.2s, scale 1.4s var(--home-ease) 0.2s;
  }

  .home-js .home-hero.is-loaded .home-hero__visual {
    opacity: 1;
    scale: 1;
  }

  .home-js [data-scroll-words] .home-founder__word {
    opacity: 0.16;
  }

  .home-js [data-scroll-words] .home-founder__word.is-lit {
    opacity: 1;
  }
}

/* ==========================================
   Keyframes
   ========================================== */
@keyframes home-pulse {
  0% {
    opacity: 0.7;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(2.8);
  }
}

@keyframes home-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes home-morph {
  0%,
  100% {
    border-radius: 42% 58% 63% 37% / 41% 44% 56% 59%;
  }
  33% {
    border-radius: 58% 42% 38% 62% / 52% 61% 39% 48%;
  }
  66% {
    border-radius: 36% 64% 52% 48% / 61% 37% 63% 39%;
  }
}

@keyframes home-bob {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-12px);
  }
}

@keyframes home-wobble {
  0%,
  100% {
    transform: rotate(-6deg) translateY(0);
  }
  50% {
    transform: rotate(6deg) translateY(-4px);
  }
}

@keyframes home-scroll-dot {
  0% {
    opacity: 0;
    transform: translateY(0);
  }
  30% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translateY(0.8rem);
  }
}

@keyframes home-marquee {
  to {
    transform: translateX(-50%);
  }
}

@keyframes home-tab-fill {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1);
  }
}

@keyframes home-panel-in {
  from {
    opacity: 0;
    transform: translateY(1.5rem) scale(0.98);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes home-drift {
  from {
    transform: translate(0, 0);
  }
  to {
    transform: translate(6rem, 4rem);
  }
}

@keyframes home-shake {
  0%,
  100% {
    transform: translateX(0);
  }
  20%,
  60% {
    transform: translateX(-6px);
  }
  40%,
  80% {
    transform: translateX(6px);
  }
}

@keyframes home-pop {
  from {
    opacity: 0;
    transform: scale(0.3);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes home-confetti {
  from {
    opacity: 1;
    transform: translate(-50%, -50%) rotate(0);
  }
  to {
    opacity: 0;
    transform: translate(calc(-50% + var(--x)), calc(-50% + var(--y))) rotate(var(--r));
  }
}

/* ==========================================
   Responsive
   ========================================== */
@media (max-width: 75rem) {
  .home-stats__sky {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 64rem) {
  .home-hero__inner {
    grid-template-columns: 1fr;
  }

  .home-hero__visual {
    width: min(100%, 34rem);
    margin-inline: auto;
  }

  .home-chip--rotator {
    left: 0;
  }

  .home-chip--cervantes {
    left: 0;
  }

  .home-chip--habla {
    right: 0;
  }

  .home-tabs,
  .home-founder__layout,
  .home-booking__card {
    grid-template-columns: 1fr;
  }

  .home-founder__media {
    position: static;
    max-width: 30rem;
  }

  .home-founder__card {
    aspect-ratio: 16 / 11;
  }

  .home-phrases__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-bento {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-bento__card--tapas,
  .home-bento__card--book {
    grid-column: span 2;
  }

  .home-bento__card--cinema,
  .home-bento__card--immersion {
    grid-column: span 1;
  }
}

@media (max-width: 48rem) {
  .home-page > .home-hero {
    padding-bottom: 6rem;
  }

  .home-hero__scroll {
    display: none;
  }

  .home-hero__meta {
    padding-left: 0;
    border-left: 0;
  }

  .home-chip {
    padding: 0.6rem 0.85rem;
    font-size: 0.85rem;
  }

  .home-chip--rotator {
    font-size: 1rem;
  }

  .home-chip--cervantes .home-chip__text span {
    display: none;
  }

  .home-stats__sky {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-stat:first-child {
    grid-column: span 2;
  }

  .home-stats__sky.is-flying {
    height: 22rem;
  }

  .home-stats__sky.is-flying .home-stat {
    width: 13rem;
  }

  .home-stats__hint {
    font-size: 0.68rem;
  }

  .home-bento {
    grid-template-columns: 1fr;
  }

  .home-bento__card,
  .home-bento__card--book {
    flex-direction: column;
  }

  .home-bento__card--tapas,
  .home-bento__card--book,
  .home-bento__card--cinema,
  .home-bento__card--immersion {
    grid-column: span 1;
  }

  .home-bento__media {
    flex-basis: 12rem;
  }

  .home-values__list {
    flex-direction: column;
    height: auto;
  }

  .home-value {
    flex: none;
    padding: 1.5rem;
  }

  .home-value__head {
    flex-direction: row;
    align-items: center;
    gap: 1rem;
  }

  .home-value__body {
    margin-top: 0;
  }

  .home-value.is-open .home-value__body {
    margin-top: 1rem;
  }
}

@media (max-width: 36rem) {
  .home-phrases__grid {
    grid-template-columns: 1fr;
  }

  .home-phrase-wrap {
    height: 13rem;
  }

  .home-hero__actions .home-btn {
    width: 100%;
    justify-content: space-between;
  }

  .home-mascot__trigger {
    width: 4rem;
    height: 4rem;
  }

  .home-mascot__bee {
    width: 3rem;
  }
}

/* Reduced motion: keep layout and state changes, drop decorative movement. */
@media (prefers-reduced-motion: reduce) {
  .home-page *,
  .home-page *::before,
  .home-page *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }

  .home-marquee__track {
    animation: none !important;
  }

  .home-cursor {
    display: none;
  }
}