/* A gente separa. Você escolhe. Carregado após a base funcional. */
:root {
  --selection: #193447;
  --gold: #80652f;
  --gold-bright: #a9894f;
  --portrait-radius: 4px;
}

/* Loader inicial */
.site-loader {
  position: fixed;
  inset: 0;
  z-index: 500;
  display: grid;
  place-items: center;
  background: #0d1a23;
  opacity: 1;
  visibility: visible;
  transition: opacity 380ms ease-out, visibility 380ms linear;
  animation: site-loader-fallback 3200ms ease-out forwards;
}
.site-loader.is-closing {
  animation: none;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
@keyframes site-loader-fallback {
  0%, 80% { opacity: 1; visibility: visible; pointer-events: auto; }
  100% { opacity: 0; visibility: hidden; pointer-events: none; }
}
.site-loader__content {
  display: flex;
  width: min(14rem, 58vw);
  flex-direction: column;
  align-items: center;
  gap: 1.75rem;
}
.site-loader__logo {
  width: 4.5rem;
  height: 4.5rem;
  object-fit: contain;
}
.site-loader__track {
  width: 100%;
  height: 1px;
  overflow: hidden;
  background: rgba(143, 144, 142, 0.22);
}
.site-loader__fill {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--white);
  transform: scaleX(0);
  transform-origin: left center;
  animation: site-loader-fill var(--loader-fill-ms, 980ms) cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
@keyframes site-loader-fill {
  to { transform: scaleX(1); }
}

.hero__bg { background: var(--ink); }
.hero__wordmark,
.hero__glow-copy,
.hero__grain,
.hero__vignette,
.hero__glow,
.story__wordmark,
.story__glow,
.founders__glow { display: none; }

.hero__layout {
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.65fr);
  max-width: 1180px;
  gap: clamp(3rem, 8vw, 8rem);
}
.hero__content { max-width: 43rem; }
.hero__title {
  max-width: 11ch;
  font-size: clamp(3.6rem, 7.5vw, 6rem);
  font-weight: 600;
  line-height: 0.98;
  letter-spacing: -0.035em;
}
.hero__lead { max-width: 48ch; color: var(--ash); }
.hero__story {
  width: min(100%, 330px);
  border: 0;
  border-radius: var(--portrait-radius);
  box-shadow: none;
  max-height: none;
}
.hero__video,
.story__reel { object-fit: contain; filter: saturate(0.84) contrast(1.04) sepia(0.05); }
.hero__scroll-arrow,
.story__pulse { animation: none; }

.btn--solid {
  border-color: var(--selection);
  background: var(--selection);
  color: var(--paper);
}
.btn--solid:hover { border-color: var(--selection); background: transparent; color: var(--paper); }

.store__title,
.story__title,
.founders__title,
.care__title,
.shipping__title,
.trust__title,
.visit__title,
.finale__title {
  font-size: clamp(2.7rem, 5.5vw, 4.75rem);
  font-weight: 600;
  line-height: 1.02;
  letter-spacing: -0.035em;
}

.store__stage {
  height: clamp(590px, 72vh, 760px);
  overflow: hidden;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.store__track {
  inset: 0;
  display: flex;
  gap: clamp(1rem, 2vw, 1.75rem);
  transition: transform 0.85s var(--ease-out);
  will-change: transform;
}
.store__slide {
  position: relative;
  inset: auto;
  flex: 0 0 76%;
  grid-template-columns: minmax(210px, 0.62fr) minmax(320px, 0.9fr);
  gap: clamp(2rem, 4vw, 3.5rem);
  padding: 0;
  opacity: 0.2;
  visibility: visible;
  pointer-events: none;
  transition: opacity 0.65s var(--ease-out);
}
.store__slide.is-active { opacity: 1; visibility: visible; pointer-events: auto; }
.store__slide.is-leaving { opacity: 0.2; visibility: visible; }
.store__slide.is-before,
.store__slide.is-after { opacity: 0.58; }
.store__side { display: none; }
.store__slide:not(.is-active) .store__copy,
.store__slide:not(.is-active) .store__side { opacity: 0; }
.store__slide.is-before .store__frame,
.store__slide.is-after .store__frame {
  position: absolute;
  top: 50%;
  width: clamp(130px, 13vw, 190px);
  height: auto;
  clip-path: inset(0);
  opacity: 0.7;
  transform: translateY(-50%);
}
.store__slide.is-before .store__frame { right: 0; }
.store__slide.is-after .store__frame { left: 0; }
.store__frame {
  overflow: hidden;
  aspect-ratio: 9 / 16;
  height: min(68vh, 720px);
  align-self: center;
  border-radius: var(--portrait-radius);
  background: var(--deep);
  clip-path: inset(100% 0 0 0);
}
.store__slide.is-active .store__frame {
  clip-path: inset(0);
  transition: clip-path 1s var(--ease-out);
}
.store__photo,
.store__slide.is-active .store__photo,
.store__slide.is-leaving .store__photo {
  transform: none;
  object-fit: cover;
  filter: saturate(0.84) contrast(1.04) sepia(0.05);
}
.store__num { width: auto; padding-top: 0; border: 0; color: var(--selection); }
.store__word { display: none; }
.store__rail {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-top: 2.4rem;
}
.store__controls {
  position: static;
  display: flex;
  gap: 0.65rem;
  flex: 0 0 auto;
}
.store__nav,
.store__nav--prev,
.store__nav--next { position: static; }
.store__dots { position: relative; flex: 1; gap: 0; margin-top: 0; padding-inline: 2rem; }
.store__dots::before {
  content: "";
  position: absolute;
  left: 2rem;
  right: 2rem;
  height: 1px;
  background: rgba(143, 144, 142, 0.34);
}
.store__dot {
  z-index: 1;
  width: 0.55rem;
  height: 0.55rem;
  margin-inline: clamp(1rem, 4vw, 3.5rem);
  border: 2px solid var(--ink);
  background: #8f908e;
}
.store__dot.is-active {
  width: 0.8rem;
  height: 0.8rem;
  background: #193447;
  box-shadow: 0 0 0 3px rgba(25, 52, 71, 0.16);
}
.store__slide.is-active .store__num,
.store__slide.is-active .store__slide-title,
.store__slide.is-active .store__slide-text,
.store__slide.is-active .store__slide-extra,
.store__slide.is-active .store__count,
.store__slide.is-active .store__word { animation: none; }

.story__compose { grid-template-columns: minmax(260px, 360px) minmax(0, 1fr); gap: clamp(4rem, 10vw, 9rem); }
.story__card { border: 0; border-radius: var(--portrait-radius); box-shadow: none; }
.story__pulse { background: var(--selection); }
.story__text {
  font-size: 1.08rem;
  line-height: 1.75;
  color: var(--paper);
}
.story__facts {
  gap: 0.75rem;
  margin-top: 2.25rem;
  padding-block: 1.4rem;
}
.story__facts li {
  font-family: var(--font-b);
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ash);
}

.founders { padding-block: clamp(8rem, 15vw, 13rem); }
.founders__inner {
  display: grid;
  grid-template-columns: minmax(300px, 0.82fr) minmax(0, 1fr);
  grid-template-areas: "photo head" "photo identity" "photo quote" "photo meta";
  align-items: start;
  gap: 1.5rem clamp(4rem, 10vw, 9rem);
  max-width: 1120px;
  text-align: left;
}
.founders__head { grid-area: head; margin: 2rem 0 1rem; }
.founders__photo-wrap { grid-area: photo; margin: 0; max-width: 410px; }
.founders__identity { grid-area: identity; margin: 0; }
.founders__quote { grid-area: quote; margin: 1.5rem 0 0; max-width: 30ch; }
.founders__meta { grid-area: meta; }
.founders__lead { margin: 0; max-width: 44ch; }
.founders__photo {
  max-width: 410px;
  aspect-ratio: 9 / 16;
  object-fit: cover;
  object-position: center;
  border: 0;
  border-radius: var(--portrait-radius);
  box-shadow: none;
  background: var(--deep);
  filter: saturate(0.84) contrast(1.04) sepia(0.05);
}

.care__title::after { display: none; }
.shipping__progress {
  position: relative;
  overflow: visible;
  margin-inline: 0.4rem;
  background: rgba(143, 144, 142, 0.34);
}
.shipping__progress-bar {
  position: absolute;
  top: 50%;
  left: 0;
  width: 0.8rem;
  height: 0.8rem;
  border: 2px solid var(--deep);
  border-radius: 50%;
  background: #193447;
  box-shadow: 0 0 0 3px rgba(25, 52, 71, 0.16);
  transform: translate(-50%, -50%);
  transition: left 0.7s var(--ease-out);
}
.care__inner { display: block; }
.care__intro {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(280px, 0.6fr);
  column-gap: clamp(3rem, 9vw, 8rem);
  align-items: end;
}
.care__label {
  grid-column: 1 / -1;
  color: var(--gold);
}
.care__title { margin-bottom: 0; }
.care__cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1.5rem, 5vw, 4rem);
  margin-top: clamp(3rem, 7vw, 5rem);
  border-top: 1px solid rgba(128, 101, 47, 0.38);
}
.care__card,
.care__card:hover {
  transform: none;
  padding: 1.7rem 0;
  border: 0;
  border-bottom: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.care__card::before {
  top: -4px;
  width: 7px;
  height: 7px;
  background: var(--gold-bright);
}
.care__step {
  display: block;
  margin-bottom: 1.2rem;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--gold);
}
.shipping__slide { border-radius: var(--portrait-radius); }
.shipping__slide img,
.shipping__slide:hover img {
  aspect-ratio: 9 / 16;
  object-fit: contain;
  transform: none;
  background: var(--ink);
  filter: saturate(0.84) contrast(1.04) sepia(0.05);
}
.shipping__status { margin: 0.6rem 0 0; font-size: 0.72rem; color: var(--ash); }
.trust__card,
.trust__card:hover {
  transform: none;
  border: 0;
  border-top: 1px solid rgba(143, 144, 142, 0.22);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

/* Clientes reais: prova social integrada ao trilho de seleção. */
.clients {
  overflow: hidden;
  padding-block: clamp(6.5rem, 12vw, 10rem);
  padding-inline: var(--gutter);
  background: var(--ink);
}
.clients__inner {
  width: 100%;
  max-width: 1180px;
  margin-inline: auto;
}
.clients__head {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(280px, 0.65fr);
  align-items: end;
  gap: clamp(2rem, 8vw, 7rem);
  margin-bottom: clamp(3rem, 7vw, 5rem);
}
.clients__title {
  margin: 0;
  max-width: 12ch;
  font-family: var(--font-d);
  font-size: clamp(2.7rem, 5.5vw, 4.75rem);
  font-weight: 600;
  line-height: 1.02;
  letter-spacing: -0.035em;
  color: var(--paper);
  text-wrap: balance;
}
.clients__lead {
  margin: 0;
  max-width: 48ch;
  font-size: 1.02rem;
  line-height: 1.7;
  color: var(--ash);
  text-wrap: pretty;
}
.clients__carousel { outline: none; }
.clients__viewport {
  position: relative;
  height: clamp(590px, 70vh, 720px);
}
.clients__track {
  position: absolute;
  inset: 0;
}
.clients__slide {
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(32vw, 390px);
  margin: 0;
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, -50%) scale(0.9);
  transition:
    left 0.65s var(--ease-out),
    right 0.65s var(--ease-out),
    opacity 0.55s ease,
    transform 0.65s var(--ease-out);
  pointer-events: none;
}
.clients__slide.is-active {
  z-index: 2;
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, -50%) scale(1);
}
.clients__slide.is-before,
.clients__slide.is-after {
  z-index: 1;
  width: min(16vw, 190px);
  opacity: 0.42;
  visibility: visible;
  filter: saturate(0.72);
}
.clients__slide.is-before {
  left: 0;
  transform: translate(0, -50%);
}
.clients__slide.is-after {
  left: 100%;
  transform: translate(-100%, -50%);
}
.clients__slide img {
  display: block;
  width: 100%;
  aspect-ratio: 9 / 16;
  object-fit: contain;
  border-radius: var(--portrait-radius);
  background: var(--deep);
  filter: saturate(0.9) contrast(1.025) sepia(0.025);
  user-select: none;
  -webkit-user-drag: none;
}
.clients__meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  width: min(32vw, 390px);
  margin: 1.15rem auto 0;
}
.clients__caption {
  margin: 0;
  font-family: var(--font-d);
  font-size: 1.35rem;
  font-weight: 600;
  color: var(--paper);
}
.clients__status {
  margin: 0;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  color: var(--ash);
}
.clients__rail {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-top: 2rem;
}
.clients__dots {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-around;
  flex: 1;
  min-height: 2.75rem;
  padding-inline: 1rem;
}
.clients__dots::before {
  content: "";
  position: absolute;
  left: 1rem;
  right: 1rem;
  height: 1px;
  background: rgba(143, 144, 142, 0.34);
}
.clients__dot {
  position: relative;
  z-index: 1;
  width: 0.55rem;
  height: 0.55rem;
  padding: 0;
  border: 2px solid var(--ink);
  border-radius: 50%;
  background: #8f908e;
}
.clients__dot.is-active {
  width: 0.8rem;
  height: 0.8rem;
  background: #193447;
  box-shadow: 0 0 0 3px rgba(25, 52, 71, 0.16);
}
.clients__controls {
  display: flex;
  gap: 0.65rem;
}
.clients__arrow {
  display: grid;
  width: 2.9rem;
  height: 2.9rem;
  place-items: center;
  border: 1px solid rgba(143, 144, 142, 0.32);
  border-radius: 50%;
  color: var(--paper);
  transition: border-color 0.25s ease, background 0.25s ease;
}
.clients__arrow:hover {
  border-color: var(--selection);
  background: rgba(25, 52, 71, 0.1);
}
.clients__reviews {
  margin-top: clamp(3rem, 6vw, 4.5rem);
  padding-top: clamp(1.75rem, 4vw, 2.5rem);
  border-top: 1px solid rgba(143, 144, 142, 0.22);
}
.clients__reviews-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 2rem;
  margin-bottom: 1.75rem;
}
.clients__reviews-head h3 {
  margin: 0;
  font-family: var(--font-b);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ash);
}
.clients__reviews-head p {
  margin: 0;
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  color: var(--ash);
}
.clients__reviews-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(2rem, 7vw, 6rem);
}
.clients__reviews-list blockquote {
  margin: 0;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(143, 144, 142, 0.18);
}
.clients__reviews-list blockquote p {
  max-width: 48ch;
  margin: 0 0 1.25rem;
  font-size: 1rem;
  line-height: 1.7;
  color: var(--paper);
}
.clients__reviews-list footer,
.clients__google {
  font-size: 0.68rem;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--ash);
}
.clients__google {
  display: inline-flex;
  gap: 0.4rem;
  margin-top: 2.25rem;
  padding-bottom: 0.15rem;
  border-bottom: 1px solid rgba(143, 144, 142, 0.26);
}
.visit__frame { aspect-ratio: 9 / 16; border-radius: var(--portrait-radius); background: var(--ink); }
.visit__photo { width: 100%; height: 100%; object-fit: cover; filter: saturate(0.84) contrast(1.04) sepia(0.05); }

@media (max-width: 900px) {
  .hero__layout,
  .story__compose,
  .founders__inner { grid-template-columns: 1fr; }
  .hero__layout { gap: 3rem; }
  .hero__media { justify-content: center; }
  .store__slide { flex-basis: 84%; grid-template-columns: minmax(140px, 0.65fr) minmax(240px, 1fr); }
  .store__side { display: none; }
  .founders__inner { grid-template-areas: "head" "photo" "identity" "quote" "meta"; text-align: center; }
  .founders__head,
  .founders__lead,
  .founders__photo-wrap,
  .founders__quote { margin-inline: auto; }
  .care__intro { grid-template-columns: 1fr; }
  .care__label { grid-column: auto; }
  .clients__head { grid-template-columns: 1fr; gap: 1.5rem; }
}

@media (max-width: 640px) {
  .hero__title { font-size: clamp(3rem, 15vw, 4.6rem); }
  .store__stage { height: 760px; }
  .store__slide { flex-basis: 88%; grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); gap: 1.5rem; }
  .store__copy { padding: 0; }
  .store__frame { width: min(100%, 320px); height: auto; max-height: none; justify-self: center; }
  .store__rail { align-items: flex-end; }
  .store__dots { padding-inline: 0.75rem; }
  .store__dots::before { left: 0.75rem; right: 0.75rem; }
  .store__dot { margin-inline: 0.8rem; }
  .store__slide.is-before .store__frame,
  .store__slide.is-after .store__frame { width: 92px; opacity: 0.55; }
  .founders__photo-wrap,
  .founders__photo { width: min(100%, 340px); }
  .care__cards { grid-template-columns: 1fr; border-top: 0; }
  .care__card,
  .care__card:hover { border-top: 1px solid rgba(128, 101, 47, 0.38); }
  .clients__viewport { height: 590px; }
  .clients__slide { width: min(82vw, 330px); }
  .clients__slide.is-before,
  .clients__slide.is-after { width: 72px; opacity: 0.3; }
  .clients__slide.is-before { left: -2.5rem; }
  .clients__slide.is-after { left: calc(100% + 2.5rem); }
  .clients__meta { width: min(82vw, 330px); }
  .clients__caption { font-size: 1.2rem; }
  .clients__rail { align-items: flex-end; }
  .clients__dots { padding-inline: 0; }
  .clients__dots::before { left: 0; right: 0; }
  .clients__reviews-head { align-items: flex-start; flex-direction: column; gap: 0.75rem; }
  .clients__reviews-list { grid-template-columns: 1fr; gap: 2rem; }
}

@media (prefers-reduced-motion: reduce) {
  .clients__slide { transition: none; }
  .site-loader { transition: none; }
}

/* Menu mobile: uma única camada composta, sem cascata ou relayout da página. */
@media (max-width: 960px) {
  html.is-nav-open,
  body.is-nav-open {
    overflow: hidden;
    overscroll-behavior: none;
  }
  .nav.is-open {
    background: #0d1a23;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    box-shadow: none;
  }
  .nav__overlay {
    min-height: 100dvh;
    background: #0d1a23;
    contain: layout paint;
    will-change: opacity;
    transition: opacity 160ms ease-out, visibility 160ms linear;
  }
  .nav__overlay-panel { min-height: 100dvh; }
  .nav__overlay-brand,
  .nav__overlay-close,
  .nav__overlay-link,
  .nav__overlay-cta,
  .nav__overlay-meta {
    opacity: 1;
    transform: none;
    transition: color 180ms ease, background 180ms ease;
  }
  .nav__overlay.is-open .nav__overlay-link:nth-child(n) {
    transition-delay: 0ms;
  }
}
