/* ========================================
   RESET & BASE
   ======================================== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body { background: #0A0906; color: #fff; overflow-x: hidden; }

/* ========================================
   HEADER
   ======================================== */
.header {
  position: fixed; top: 0; left: 0; width: 100%; height: 87px;
  background: linear-gradient(180deg, #12110C 0%, rgba(21, 19, 14, 0.00) 100%);
  backdrop-filter: blur(39.1px); -webkit-backdrop-filter: blur(39.1px);
  z-index: 1000;
}

.nav {
  width: 100%; max-width: 1924px; height: 100%;
  margin: 0 auto; padding: 0 80px;
  display: flex; align-items: center; justify-content: space-between;
}

.nav__logo { text-decoration: none; display: flex; align-items: center; flex-shrink: 0; }

.nav__menu { display: flex; align-items: center; gap: 34px; list-style: none; }

.nav__link {
  color: #D3D3D3; text-decoration: none;
  font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 600;
  line-height: 124.667%; letter-spacing: 2.66px; text-transform: uppercase;
  transition: color 0.2s;
}
.nav__link:hover { color: #fff; }

.nav__right { display: flex; align-items: center; gap: 24px; flex-shrink: 0; }

.nav__lang { display: flex; align-items: center; gap: 6px; }

.nav__lang-item {
  color: #D3D3D3; font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 600;
  line-height: 124.667%; letter-spacing: 2.66px; text-transform: uppercase; cursor: pointer;
}
.nav__lang-item--active { color: #FF6C68; }
.nav__lang-sep { color: #D3D3D3; font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 600; }

.btn--nav {
  display: flex; padding: 12px 34px; justify-content: center; align-items: center; gap: 10px;
  border: 1px solid rgba(229,227,227,0.26); background: transparent; cursor: pointer;
  color: #F8F8F8; font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 400;
  line-height: 124.667%; letter-spacing: 1.96px; text-transform: uppercase;
  transition: border-color 0.2s;
}
.btn--nav:hover { border-color: rgba(229,227,227,0.6); }

/* ========================================
   HERO — entrance animation (page load)
   ======================================== */
@keyframes heroReveal {
  from { opacity: 0; transform: translateY(22px); }
  to   { opacity: 1; transform: translateY(0);    }
}

.hero__badge      { animation: heroReveal 0.8s cubic-bezier(0.25,0.46,0.45,0.94) 0.10s both; }
.hero__title      { animation: heroReveal 0.9s cubic-bezier(0.25,0.46,0.45,0.94) 0.30s both; }
.hero__subtitle   { animation: heroReveal 0.9s cubic-bezier(0.25,0.46,0.45,0.94) 0.55s both; }
.btn--hero        { animation: heroReveal 0.8s cubic-bezier(0.25,0.46,0.45,0.94) 0.80s both; }
.hero__mobile-img { animation: heroReveal 1.0s cubic-bezier(0.25,0.46,0.45,0.94) 0.35s both; }

/* ========================================
   HERO
   ======================================== */
.hero {
  position: relative; width: 100%; height: 100vh; min-height: 700px;
  background-image: url('assets/hero.webp');
  background-size: cover; background-position: center right;
  display: flex; align-items: center; overflow: hidden;
}

.hero__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(90deg, #000 22.29%, rgba(3, 6, 2, 0.00) 77.71%);
  pointer-events: none; z-index: 1;
}

.hero__content {
  position: relative; z-index: 2;
  display: flex; width: 877px; max-width: 90%;
  flex-direction: column; justify-content: center; align-items: center;
  gap: 29px;
  padding-left: clamp(40px, 8vw, 160px);
  padding-top: 87px;
}

.hero__badge {
  display: flex; padding: 4px 15px; justify-content: center; align-items: center; gap: 10px;
  background: rgba(0,0,0,0.55);
}
.hero__badge-label {
  color: #FF908D; text-align: center; font-family: 'Montserrat', sans-serif;
  font-size: 16px; font-weight: 400; line-height: 153%; letter-spacing: 2.08px; text-transform: uppercase;
}

.hero__title {
  color: #FFF; text-align: center; font-family: 'Cinzel', serif;
  font-size: clamp(48px, calc(92 / 1920 * 100vw), 92px);
  font-weight: 700; line-height: 1.08;
  display: flex; flex-direction: column; align-items: center;
}
.hero__title-red {
  color: #CF0000; font-family: 'Cinzel', serif;
  font-size: clamp(48px, calc(92 / 1920 * 100vw), 92px);
  font-weight: 700; line-height: 1.08; text-transform: uppercase;
}

.hero__subtitle {
  color: #F8F8F8; text-align: center; font-family: 'Montserrat', sans-serif;
  font-size: clamp(15px, calc(20 / 1920 * 100vw), 20px);
  font-weight: 400; line-height: 1.6; letter-spacing: -0.2px;
}

.btn--hero {
  display: flex; padding: 12px 34px 15px 34px; justify-content: center; align-items: center; gap: 10px;
  background: rgba(18,8,8,0.72); border: 1px solid rgba(229,227,227,0.26); cursor: pointer;
  color: #F8F8F8; font-family: 'Montserrat', sans-serif; font-size: 20px; font-weight: 500;
  line-height: 124.667%; letter-spacing: -0.2px; transition: background 0.2s, border-color 0.2s;
}
.btn--hero:hover { background: rgba(60,10,10,0.85); border-color: rgba(229,227,227,0.5); }

/* ========================================
   WHATSAPP FAB
   ======================================== */
.whatsapp-fab {
  position: fixed; bottom: 36px; left: 36px; width: 54px; height: 54px;
  border-radius: 50%; background: #25D366;
  display: flex; align-items: center; justify-content: center;
  z-index: 999; text-decoration: none;
  box-shadow: 0 4px 20px rgba(0,0,0,0.35); transition: transform 0.2s;
}
.whatsapp-fab:hover { transform: scale(1.08); }

/* ========================================
   POPUP OVERLAY
   ======================================== */
.popup-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,0.82);
  display: flex; align-items: center; justify-content: center;
  z-index: 2000; opacity: 0; pointer-events: none; transition: opacity 0.3s ease;
}
.popup-overlay--active { opacity: 1; pointer-events: all; }

.popup {
  display: flex; width: 1180px; max-width: 95vw; height: 680px; max-height: 92vh;
  background: #111; overflow: hidden;
  transform: scale(0.96); transition: transform 0.3s ease;
}
.popup-overlay--active .popup { transform: scale(1); }

.popup__image {
  width: 46%; flex-shrink: 0; overflow: hidden; background: #1a1a1a;
}
.popup__image img { width: 100%; height: 100%; object-fit: cover; object-position: center; }

.popup__content { flex: 1; background: #0D0D0D; display: flex; flex-direction: column; overflow: hidden; }

/* Steps */
.popup__step {
  display: flex; flex-direction: column; height: 100%;
  padding: 32px 44px 0;
}
.popup__step--hidden { display: none !important; }

/* Nav */
.popup__nav {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 20px; flex-shrink: 0;
}
.popup__back {
  display: flex; align-items: center; gap: 10px;
  background: transparent; border: none; cursor: pointer;
  color: #D3D3D3; font-family: 'Montserrat', sans-serif; font-size: 12px;
  font-weight: 600; letter-spacing: 2.2px; text-transform: uppercase; transition: color 0.2s;
}
.popup__back:hover { color: #fff; }
.popup__close {
  background: transparent; border: none; cursor: pointer;
  display: flex; align-items: center; opacity: 0.65; transition: opacity 0.2s;
}
.popup__close:hover { opacity: 1; }
.popup__close--top-right { position: absolute; top: 28px; right: 40px; }

/* Scrollable body */
.popup__body {
  flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 18px;
  padding-bottom: 16px;
}
.popup__body::-webkit-scrollbar { width: 4px; }
.popup__body::-webkit-scrollbar-track { background: transparent; }
.popup__body::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.12); border-radius: 2px; }

/* Titles & text */
.popup__title { color: #D98A82; font-family: 'Cinzel', serif; font-size: 32px; font-weight: 700; line-height: 1.2; }
.popup__divider { border: none; border-top: 1px solid rgba(255,255,255,0.09); flex-shrink: 0; }
.popup__desc { color: #ACACAC; font-family: 'Montserrat', sans-serif; font-size: 20px; font-weight: 400; line-height: 32px; letter-spacing: -0.2px; }
.popup__price { color: #888; font-family: 'Montserrat', sans-serif; font-size: 17px; font-weight: 400; letter-spacing: 1px; }
.popup__price-inline { color: #888; font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 400; letter-spacing: 1px; margin-top: -8px; }

/* Variantes (step 1) */
.popup__variant-label {
  color: #888;
  font-family: 'Montserrat', sans-serif;
  font-size: 10px;
  letter-spacing: 2.5px;
  font-weight: 500;
  margin: 18px 0 10px;
  text-transform: uppercase;
}
.variant-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  gap: 8px;
  margin-bottom: 18px;
}
.variant-pill {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 12px 8px;
  background: transparent;
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 4px;
  color: #C0C0C0;
  font-family: 'Montserrat', sans-serif;
  cursor: pointer;
  transition: all 0.18s ease;
}
.variant-pill:hover {
  border-color: rgba(217,138,130,0.5);
  background: rgba(217,138,130,0.04);
}
.variant-pill--selected {
  border-color: #D98A82;
  background: rgba(217,138,130,0.12);
  color: #D98A82;
}
.variant-pill__dur {
  font-size: 11px;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  font-weight: 600;
}
.variant-pill__price {
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.5px;
}
.variant-pill--selected .variant-pill__price { color: #D98A82; }
.btn--action[disabled] {
  opacity: 0.4;
  cursor: not-allowed;
  pointer-events: none;
}
.popup__booking-summary {
  color: #D98A82; font-family: 'Montserrat', sans-serif; font-size: 13px; font-weight: 500;
  letter-spacing: 0.5px; margin-top: -8px;
}

/* Step 1: body should not stretch so the button stays close */
#step1 .popup__body { flex: 0 0 auto; }

/* Action button (shared) */
.btn--action {
  width: 100%; padding: 20px 34px;
  display: flex; justify-content: center; align-items: center;
  background: #7A1F1F; border: none; cursor: pointer; flex-shrink: 0; margin-top: 4px;
  color: #F8F8F8; font-family: 'Montserrat', sans-serif; font-size: 14px;
  font-weight: 600; letter-spacing: 3px; text-transform: uppercase; transition: background 0.2s;
}
.btn--action:hover { background: #9A2828; }
.btn--action-outline { background: transparent; border: 1px solid rgba(229,227,227,0.26); }
.btn--action-outline:hover { background: rgba(255,255,255,0.05); }

/* ========================================
   LOCATION PICKER (Step 1)
   ======================================== */
.location-pick { margin-top: 4px; }
.location-pick__label {
  font-family: 'Montserrat', sans-serif; font-size: 10px; font-weight: 600;
  letter-spacing: 2px; text-transform: uppercase; color: #666; margin-bottom: 10px;
}
.location-pick__cards { display: flex; flex-direction: column; gap: 8px; }

.location-card {
  display: flex; align-items: center; gap: 12px;
  padding: 11px 14px;
  border: 1px solid rgba(255,255,255,0.1); background: rgba(255,255,255,0.02);
  cursor: pointer; transition: border-color 0.2s, background 0.2s;
}
.location-card:hover { border-color: rgba(217,138,130,0.4); background: rgba(217,138,130,0.04); }
.location-card--selected { border-color: #D98A82; background: rgba(217,138,130,0.08); }

.location-card__pin { color: #555; flex-shrink: 0; transition: color 0.2s; }
.location-card--selected .location-card__pin { color: #D98A82; }

.location-card__info { flex: 1; min-width: 0; }
.location-card__name {
  font-family: 'Montserrat', sans-serif; font-size: 13px; font-weight: 600;
  color: #D3D3D3; letter-spacing: 0.3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.location-card--selected .location-card__name { color: #F8F8F8; }
.location-card__address {
  font-family: 'Montserrat', sans-serif; font-size: 11px; color: #555; margin-top: 2px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.location-card__check {
  width: 18px; height: 18px; border: 1px solid rgba(255,255,255,0.15); border-radius: 50%;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: all 0.2s;
}
.location-card--selected .location-card__check { background: #D98A82; border-color: #D98A82; }

.location-card__change {
  background: none; border: none; color: #555; font-family: 'Montserrat', sans-serif;
  font-size: 9px; letter-spacing: 1.5px; cursor: pointer; padding: 2px 0;
  text-transform: uppercase; text-decoration: underline; display: none; flex-shrink: 0;
}
.location-card--selected .location-card__change { display: block; color: #888; }

/* ========================================
   CALENDAR (Step 2)
   ======================================== */
.cal-nav {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 6px; flex-shrink: 0;
}
.cal-nav__btn {
  background: transparent; border: none; cursor: pointer;
  color: #888; font-size: 22px; line-height: 1; padding: 0 8px;
  transition: color 0.2s;
}
.cal-nav__btn:hover { color: #fff; }
.cal-nav__btn:disabled { opacity: 0.25; cursor: default; }
.cal-nav__title {
  color: #D3D3D3; font-family: 'Montserrat', sans-serif; font-size: 13px;
  font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase;
}

.calendar { flex-shrink: 0; }
.calendar__day-names { display: grid; grid-template-columns: repeat(7,1fr); margin-bottom: 3px; }
.calendar__day-name {
  text-align: center; color: #555; font-family: 'Montserrat', sans-serif;
  font-size: 11px; font-weight: 600; letter-spacing: 0.5px; padding: 5px 0;
}
.calendar__grid { display: grid; grid-template-columns: repeat(7,1fr); gap: 2px; }

.calendar__day {
  display: flex; align-items: center; justify-content: center; height: 36px;
  color: #C0C0C0; font-family: 'Montserrat', sans-serif; font-size: 13px; font-weight: 400;
  cursor: pointer; border: 1px solid transparent; transition: border-color 0.15s, color 0.15s;
}
.calendar__day:hover:not(.calendar__day--disabled):not(.calendar__day--full) {
  border-color: rgba(217,138,130,0.4); color: #fff;
}
.calendar__day--empty { cursor: default; pointer-events: none; }
.calendar__day--disabled { cursor: default; pointer-events: none; color: #333; }
.calendar__day--full { cursor: not-allowed; color: #3a3a3a; text-decoration: line-through; }
.calendar__day--today { border-color: rgba(217,138,130,0.6); color: #fff; }
.calendar__day--selected { border-color: #D98A82; color: #D98A82; background: rgba(217,138,130,0.08); }

/* Time slots */
.popup__horarios-label {
  color: #555; font-family: 'Montserrat', sans-serif; font-size: 11px;
  font-weight: 600; letter-spacing: 2px; text-transform: uppercase; flex-shrink: 0;
}
.time-slots { display: flex; gap: 8px; flex-wrap: wrap; flex-shrink: 0; }
.no-slots { color: #666; font-family: 'Montserrat', sans-serif; font-size: 13px; }

.time-slot {
  padding: 8px 14px; border: 1px solid rgba(229,227,227,0.2);
  background: transparent; cursor: pointer;
  color: #C0C0C0; font-family: 'Montserrat', sans-serif; font-size: 13px; font-weight: 400;
  transition: border-color 0.15s, color 0.15s;
}
.time-slot:hover { border-color: rgba(217,138,130,0.5); color: #fff; }
.time-slot--selected { border-color: #D98A82; color: #D98A82; background: rgba(217,138,130,0.08); }

/* ========================================
   BOOKING FORM (Step 3)
   ======================================== */
.booking-form { display: flex; flex-direction: column; gap: 18px; }
.form-group { display: flex; flex-direction: column; gap: 7px; }
.form-label {
  color: #888; font-family: 'Montserrat', sans-serif; font-size: 11px;
  font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase;
}
.form-required { color: #D98A82; }
.form-optional { color: #555; font-weight: 400; text-transform: none; letter-spacing: 0; font-size: 10px; }
.form-input {
  background: #1a1a1a; border: 1px solid rgba(255,255,255,0.1); padding: 12px 14px;
  color: #F0F0F0; font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 400;
  outline: none; transition: border-color 0.2s;
}
.form-input::placeholder { color: #444; }
.form-input:focus { border-color: rgba(217,138,130,0.5); }
.form-input.is-invalid { border-color: #CF0000; }
.form-error { color: #CF0000; font-family: 'Montserrat', sans-serif; font-size: 11px; min-height: 14px; }

/* ── intl-tel-input — tema escuro ─────────────────────────── */
.iti { width: 100%; }
.iti__tel-input {
  background: #1a1a1a !important; border: 1px solid rgba(255,255,255,0.1) !important;
  color: #F0F0F0 !important; font-family: 'Montserrat', sans-serif !important;
  font-size: 14px !important; outline: none !important;
  transition: border-color 0.2s !important; width: 100% !important;
}
.iti__tel-input:focus { border-color: rgba(217,138,130,0.5) !important; }
.iti__tel-input::placeholder { color: #444 !important; }
.iti__tel-input.is-invalid { border-color: #CF0000 !important; }
.iti__selected-country {
  background: rgba(255,255,255,0.04) !important;
  border-right: 1px solid rgba(255,255,255,0.1) !important;
  padding: 0 10px 0 12px !important;
}
.iti__selected-country:hover { background: rgba(255,255,255,0.08) !important; }
.iti__selected-dial-code { color: #888; font-family: 'Montserrat', sans-serif; font-size: 13px; margin-left: 4px; }
.iti__dropdown-content {
  background: #161414 !important; border: 1px solid rgba(255,255,255,0.1) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.7) !important;
}
.iti__search-input {
  background: #222 !important; border: 1px solid rgba(255,255,255,0.1) !important;
  color: #F0F0F0 !important; font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important; margin: 8px 10px !important; width: calc(100% - 20px) !important;
  padding: 7px 10px !important; outline: none !important;
}
.iti__search-input::placeholder { color: #555 !important; }
.iti__country { padding: 9px 12px !important; color: #C0C0C0 !important; font-family: 'Montserrat', sans-serif; font-size: 13px; }
.iti__country.iti__highlight,
.iti__country:hover { background: rgba(255,255,255,0.05) !important; }
.iti__country-name { color: #D0D0D0 !important; }
.iti__dial-code { color: #666 !important; }

/* ── intl-tel-input — Conte-me (separateDialCode, bege) ── */
.iti--conte { width: 100%; }

/* Input: mesmas métricas que .conte__input
   Não sobrescrever padding-left/right — o iti calcula o espaço
   para bandeira + código de país com separateDialCode */
.iti--conte .iti__tel-input {
  background: transparent !important; border: none !important;
  border-bottom: 1px solid #8A8A8B !important;
  color: #040404 !important; font-family: 'Montserrat', sans-serif !important;
  font-size: 16px !important; line-height: 32px !important;
  padding-top: 4px !important; padding-bottom: 4px !important;
  outline: none !important; width: 100% !important;
}
.iti--conte .iti__tel-input:focus { border-bottom-color: #91241C !important; }
.iti--conte .iti__tel-input::placeholder { color: #8A8A8B !important; }

/* Botão bandeira — fundo transparente, sem borda direita própria */
.iti--conte .iti__selected-country {
  background: transparent !important;
  padding: 4px 6px 4px 0 !important;
  border-right: none !important;
}
.iti--conte .iti__selected-country:hover { background: rgba(145,36,28,0.04) !important; }

/* Código de país separado — aparece entre bandeira e input */
.iti--conte .iti__selected-dial-code {
  color: #555 !important;
  font-size: 16px !important;
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 400 !important;
  padding: 0 10px 0 2px !important;
  border-right: 1px solid #C5C5C5 !important;
  line-height: 40px !important;   /* alinha verticalmente com o input */
  display: inline-flex !important;
  align-items: center !important;
}

/* Dropdown bege */
.iti--conte .iti__dropdown-content {
  background: #FBF7F3 !important; border: 1px solid rgba(145,36,28,0.2) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.1) !important;
}
.iti--conte .iti__search-input {
  background: #FFF !important; border: 1px solid #DDD !important;
  color: #040404 !important; font-family: 'Montserrat', sans-serif !important; font-size: 13px !important;
}
.iti--conte .iti__search-input::placeholder { color: #AAA !important; }
.iti--conte .iti__country { color: #040404 !important; font-size: 13px !important; }
.iti--conte .iti__country:hover,
.iti--conte .iti__country.iti__highlight { background: rgba(145,36,28,0.06) !important; }
.iti--conte .iti__country-name { color: #222 !important; }
.iti--conte .iti__dial-code { color: #888 !important; }

/* ── flatpickr — tema rosé para secção Conte-me ──────────── */
.flatpickr-calendar {
  background: #FBF6F0; border: 1px solid rgba(145,36,28,0.2);
  box-shadow: 0 8px 30px rgba(0,0,0,0.12); border-radius: 2px;
  font-family: 'Montserrat', sans-serif;
}
.flatpickr-months { background: #91241C; border-radius: 2px 2px 0 0; }
.flatpickr-month, .flatpickr-current-month,
.flatpickr-current-month .cur-month,
.flatpickr-current-month input.cur-year { color: #FFF !important; fill: #FFF; }
.flatpickr-current-month .flatpickr-monthDropdown-months { background: #91241C; color: #FFF; }
.flatpickr-prev-month svg, .flatpickr-next-month svg { fill: #FFF !important; }
.flatpickr-prev-month:hover, .flatpickr-next-month:hover { background: rgba(255,255,255,0.15) !important; }
.flatpickr-weekday { background: #FBF6F0; color: #91241C !important; font-weight: 600; font-size: 11px; }
.flatpickr-weekdays { background: #FBF6F0; }
.flatpickr-day { color: #040404; border-radius: 2px; font-size: 13px; }
.flatpickr-day:hover { background: rgba(145,36,28,0.1); border-color: transparent; }
.flatpickr-day.selected,
.flatpickr-day.selected:hover { background: #91241C !important; border-color: #91241C !important; color: #FFF !important; }
.flatpickr-day.today { border-color: rgba(145,36,28,0.5); }
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover { color: #CCC; background: transparent; }

/* ========================================
   SUCCESS (Step 4)
   ======================================== */
.popup__step--success {
  align-items: center; justify-content: center; gap: 16px; text-align: center; position: relative;
  padding: 40px 44px;
}
.success-icon { margin-bottom: 4px; }
.success-title {
  color: #D98A82; font-family: 'Cinzel', serif; font-size: 26px; font-weight: 700;
}
.success-ref {
  color: #555; font-family: 'Montserrat', sans-serif; font-size: 12px;
  letter-spacing: 1.5px; text-transform: uppercase;
}
.success-details {
  color: #C0C0C0; font-family: 'Montserrat', sans-serif; font-size: 14px;
  line-height: 1.8; text-align: center;
}
.success-details strong { color: #F0F0F0; }
.success-note {
  color: #555; font-family: 'Montserrat', sans-serif; font-size: 12px; line-height: 1.6;
  max-width: 340px;
}

/* ========================================
   NOSSOS RITUAIS
   ======================================== */
.rituais {
  background: #1E0B09;
  padding: 80px 0 0;
  position: relative;
  overflow: hidden;
}

.rituais__header {
  display: flex;
  align-items: center;
  padding: 0 80px;
  margin-bottom: 56px;
  gap: 0;
}

.rituais__line {
  flex: 1;
  height: 1px;
  background: rgba(255,255,255,0.18);
}

.rituais__title {
  padding: 0 40px;
  font-family: 'Cinzel', serif;
  font-size: 52px;
  font-weight: 700;
  letter-spacing: 4px;
  white-space: nowrap;
}
.rituais__title-white { color: #F5EDE0; }
.rituais__title-red   { color: #C94040; }

/* Carousel wrap — full width, arrows inside */
.rituais__carousel-wrap {
  position: relative;
  width: 100%;
  height: 440px;
  overflow: hidden;
  display: flex;
  align-items: center;
}

/* Blurred bg behind cards */
.rituais__carousel-wrap::before {
  content: '';
  position: absolute;
  inset: -8%;
  filter: blur(28px) brightness(0.22);
  z-index: 0;
}

.rituais__stage {
  position: relative;
  flex: 1;
  height: 100%;
  z-index: 1;
}

/* Cards */
.ritual-card {
  position: absolute;
  width: 305px;
  height: 400px;
  left: 50%;
  top: 50%;
  margin-left: -152px;
  margin-top: -200px;
  overflow: hidden;
  cursor: pointer;
  transition: transform 0.65s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              opacity 0.65s ease,
              filter 0.65s ease;
  will-change: transform, opacity;
}

.ritual-card__img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  pointer-events: none; user-select: none;
}

.ritual-card__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg,
    transparent 38%,
    rgba(10,4,2,0.7) 68%,
    rgba(10,4,2,0.97) 100%);
  pointer-events: none;
}

.ritual-card__body {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 22px 22px 26px;
}

.ritual-card__title {
  color: #D98A82;
  font-family: 'Cinzel', serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 9px;
  text-transform: capitalize;
}

.ritual-card__desc {
  color: rgba(255,255,255,0.82);
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.55;
  margin-bottom: 18px;
}

.ritual-card__book {
  display: inline-block;
  padding: 10px 28px;
  background: transparent;
  border: 1px solid rgba(217, 138, 130, 0.6);
  color: #D98A82;
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
  pointer-events: none; /* card handles click */
}
.ritual-card:hover .ritual-card__book,
.ritual-card__book:hover {
  background: rgba(217, 138, 130, 0.12);
  border-color: #D98A82;
  color: #fff;
}

/* Arrows — positioned inside carousel-wrap */
.rituais__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 20;
  flex-shrink: 0;
  display: flex;
  width: 85.473px;
  height: 85.473px;
  padding: 16px 13px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 42.736px;
  border: 2.999px solid #FFADA9;
  background: rgba(0, 0, 0, 0.60);
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}
.rituais__arrow:hover { background: rgba(0,0,0,0.82); border-color: #fff; }
.rituais__arrow--left  { left: 56px; }
.rituais__arrow--right { right: 56px; }

/* Curved bottom divider */
.rituais__curve {
  position: relative;
  margin-top: 60px;
  height: 70px;
  overflow: hidden;
}
.rituais__curve::after {
  content: '';
  position: absolute;
  bottom: 0; left: 50%;
  transform: translateX(-50%);
  width: 120%;
  height: 180px;
  background: #0A0906;
  border-radius: 50% 50% 0 0;
}

/* ========================================
   INSTANTES DE ENTREGA
   ======================================== */

/*
  Tudo escalado proporcionalmente em relação a 1920px de largura.
  Fórmula: calc(valor_px / 1920 * 100vw)
  Cards: 436.69 × 654.955 px · gap: 66 px · offset coluna central: 110 px
  Section: 1920 × 2438 px · padding topo/base: ~115.57 px
*/

.instantes {
  background: #040404;
  position: relative;                          /* âncora para o overlay absoluto   */
  padding-top:    calc(115.57 / 1920 * 100vw);
  padding-bottom: calc(115.57 / 1920 * 100vw);
  overflow: clip;                              /* evita scroll-x sem quebrar sticky */
}

/* ── Grid 3 colunas ─────────────────────────────────────── */
.instantes__grid {
  display: flex;
  gap:            calc(66 / 1920 * 100vw);
  justify-content: center;
  align-items:    flex-start;
  position: relative;
  z-index: 1;
}

.instantes__col {
  display: flex;
  flex-direction: column;
  gap: calc(66 / 1920 * 100vw);
  flex-shrink: 0;
}

/* Coluna central deslocada 110 px para baixo */
.instantes__col--mid {
  margin-top: calc(110 / 1920 * 100vw);
}

/* Card de foto */
.instantes__card {
  width:        calc(436.69 / 1920 * 100vw);
  aspect-ratio: 2 / 3;
  overflow: hidden;
  background: #111;                            /* placeholder enquanto sem imagem  */
  flex-shrink: 0;
}
.instantes__card img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
  /* blur-reveal initial state — JS adds .is-visible to parent card */
  filter: blur(14px);
  transform: scale(1.08);
  opacity: 0;
  transition:
    filter    1.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),
    transform 1.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),
    opacity   1.1s ease;
  will-change: filter, transform, opacity;
}
.instantes__card.is-visible img {
  filter: blur(0px);
  transform: scale(1);
  opacity: 1;
}

/* ── Fade-up scroll reveal — textos e blocos de secção ───── */
.fade-up {
  opacity: 0;
  transform: translateY(34px);
  transition:
    opacity   0.9s ease,
    transform 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  will-change: opacity, transform;
}
.fade-up.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ── Overlay para a label sticky ────────────────────────── */
.instantes__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: center;
  pointer-events: none;                        /* cliques passam pelos cards        */
  z-index: 5;
}

/* A label em si — position:sticky dentro do overlay absoluto
   faz a caixa grudar no centro da viewport enquanto o section
   está visível e sair suavemente ao sair do section. */
.instantes__label {
  position: sticky;
  /* 50 vh − metade da altura da label ≈ 231 px em 1920 px de largura */
  top: calc(50vh - clamp(55px, calc(231 / 1920 * 100vw), 231px));
  align-self: flex-start;
  height: fit-content;
  pointer-events: all;

  background: rgba(234, 224, 212, 0.39);
  box-shadow: 0 -5px 175.7px 79px rgba(0, 0, 0, 0.40);
  backdrop-filter: blur(86.75px);
  -webkit-backdrop-filter: blur(86.75px);

  width:   clamp(180px, calc(680 / 1920 * 100vw), 680px);
  padding: clamp(32px, calc(159 / 1920 * 100vw), 159px)
           clamp(20px, calc(135 / 1920 * 100vw), 135px);

  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.instantes__label-text {
  color: #3B2618;
  font-family: 'Cinzel', serif;
  font-size:   clamp(14px, calc(64 / 1920 * 100vw), 64px);
  font-weight: 700;
  line-height: clamp(16px, calc(72.466 / 1920 * 100vw), 72.466px);
  text-align: center;
  margin: 0;
  leading-trim: both;
  text-edge: cap;
}

/* "ENTREGA." em vermelho numa linha própria */
.instantes__label-red {
  color: #CF0000;
  display: block;
  leading-trim: both;
  text-edge: cap;
}

/* Location pick label (step 3 reuse) */
.location-pick__label {
  font-family: 'Montserrat', sans-serif; font-size: 10px; font-weight: 600;
  letter-spacing: 2px; text-transform: uppercase; color: #666; margin-bottom: 10px;
}

/* ========================================
   MOBILE NAV — elementos exclusivos mobile
   ======================================== */

/* Ícone WhatsApp no header (mobile) */
.nav__wa-btn {
  display: none;
  width: 30px; height: 30px;
  padding: 5.451px 5.453px 5.365px 5.363px;
  justify-content: center; align-items: center;
  border-radius: 57.6px;
  border: 0.48px solid #5D5D5D;
  background: conic-gradient(from 63deg at 25.08% 3.57%, #211C20 0deg, #271C19 360deg);
  flex-shrink: 0; text-decoration: none;
}

/* Botão hamburger (mobile) */
.nav__hamburger {
  display: none;
  align-items: center; justify-content: center;
  background: transparent; border: none;
  cursor: pointer; padding: 4px; flex-shrink: 0;
}

/* Hero mobile image (oculta no desktop) */
.hero__mobile-img { display: none; }

/* Aspas mobile (oculta no desktop) */
.quote-section__aspas { display: none; }

/* Assinatura imagem mobile (oculta no desktop) */
.quote-section__sig-img { display: none; }

/* ========================================
   MOBILE MENU OVERLAY
   ======================================== */
/* ── Mobile menu — dropdown panel (not full-screen) ── */
.mobile-menu {
  display: none;
  position: fixed;
  top: 53px;            /* sits flush below the header */
  left: 0;
  right: 0;
  z-index: 1400;
  background: #010201;
  box-shadow: 0 31px 42.7px 0 rgba(0, 0, 0, 0.46);
}
.mobile-menu--open { display: block; }

/* Figma frame: padding 17px 16px · flex column · gap 28px between sections */
.mobile-menu__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 17px 16px;
  gap: 28px;            /* space between nav list / button / lang selector */
  width: 100%;
  box-sizing: border-box;
}

/* Nav list — flex column with 34px gap between items */
.mobile-menu__list {
  list-style: none;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 34px;
}

.mobile-menu__link {
  display: block;
  color: #D3D3D3;
  text-decoration: none;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 124.667%;
  letter-spacing: 2.66px;
  text-transform: uppercase;
  transition: color 0.2s;
}
.mobile-menu__link:hover { color: #D98A82; }

.mobile-menu__cta {
  align-self: stretch;  /* gap on parent handles top spacing */
  padding: 12px 16px;
  background: transparent;
  border: 1px solid rgba(229,227,227,0.26);
  color: #F8F8F8;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 124.667%;
  letter-spacing: 1.96px;
  text-transform: uppercase;
  cursor: pointer;
  text-align: center;
  transition: border-color 0.2s;
}
.mobile-menu__cta:hover { border-color: rgba(229,227,227,0.6); }

.mobile-menu__lang {
  display: flex;        /* gap on parent handles top spacing */
  align-items: center;
  gap: 8px;
}

/* ========================================
   PURO. INTENSO. INESQUECÍVEL.
   ----------------------------------------
   Frame Figma:  1922 × 981 px
   Padding:      top 146 / bot 169 / left 313 / right 329
   Bloco texto:  498 × 391 px  ·  gap 29 px
   Background:   #210E0C
   ======================================== */
.puro {
  background: #210E0C;
  width: 100%;
  padding-top:    calc(146 / 1920 * 100vw);
  padding-bottom: calc(169 / 1920 * 100vw);
  overflow: hidden;
}

.puro__inner {
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
  padding-left:  calc(313 / 1920 * 100vw);
  padding-right: calc(329 / 1920 * 100vw);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(40 / 1920 * 100vw);
}

/* ── Colagem (lado esquerdo) — imagem única do Figma ────── */
.puro__collage {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
}

.puro__collage-img {
  display: block;
  width: 100%;
  height: auto;
  max-width: calc(660 / 1920 * 100vw);
  max-height: calc(805 / 1920 * 100vw);
  min-width: 360px;
  object-fit: contain;
}

/* ── Bloco de texto (lado direito) ──────────────────────── */
.puro__text {
  flex: 0 0 auto;
  width: calc(498 / 1920 * 100vw);
  min-width: 360px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc(29 / 1920 * 100vw);
}

.puro__title {
  display: flex;
  flex-direction: column;
  color: #F8F8F8;
  font-family: 'Cinzel', serif;
  font-size:   clamp(28px, calc(52 / 1920 * 100vw), 52px);
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: 0.5px;
}
.puro__title-red {
  color: #CF0000;
  text-transform: uppercase;
}

.puro__desc {
  color: #C9BDB9;
  font-family: 'Montserrat', sans-serif;
  font-size:   clamp(14px, calc(15 / 1920 * 100vw), 15px);
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: -0.1px;
  max-width: clamp(260px, calc(420 / 1920 * 100vw), 420px);
}

.puro__cta {
  display: inline-flex;
  padding: 12px 34px 15px 34px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  background: rgba(18, 8, 8, 0.72);
  border: 1px solid rgba(229, 227, 227, 0.26);
  cursor: pointer;
  color: #F8F8F8;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 124.667%;
  letter-spacing: 1.96px;
  text-transform: uppercase;
  transition: background 0.2s, border-color 0.2s;
  margin-top: 16px;
}
.puro__cta:hover {
  background: rgba(60, 10, 10, 0.85);
  border-color: rgba(229, 227, 227, 0.5);
}

/* Garantir tamanho mínimo legível em telas pequenas */
@media (max-width: 1100px) {
  .puro__title { font-size: 34px; }
  .puro__desc  { font-size: 14px; max-width: 100%; }
  .puro__cta   { font-size: 13px; padding: 12px 28px; }
}

/* ========================================
   SINTA. VIVA. TRANSBORDE.
   ----------------------------------------
   Inner content:  1280 × 719.61 px
   Colagem:        620.96 × 719.61 px  (direita)
   Bloco texto:    498 × ? px          (esquerda)
   Gap texto↔colagem: 160 px
   Background:     #000
   ======================================== */
.sinta {
  background: #000;
  width: 100%;
  padding-top:    calc(146 / 1920 * 100vw);
  padding-bottom: calc(169 / 1920 * 100vw);
  overflow: hidden;
}

.sinta__inner {
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
  padding-left:  calc(313 / 1920 * 100vw);
  padding-right: calc(329 / 1920 * 100vw);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(160 / 1920 * 100vw);
}

/* ── Bloco de texto (lado esquerdo) ──────────────────────── */
.sinta__text {
  flex: 0 0 auto;
  width: calc(498 / 1920 * 100vw);
  min-width: 360px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc(29 / 1920 * 100vw);
}

.sinta__title {
  display: flex;
  flex-direction: column;
  color: #F8F8F8;
  font-family: 'Cinzel', serif;
  font-size:   clamp(28px, calc(52 / 1920 * 100vw), 52px);
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: 0.5px;
}
.sinta__title-red {
  color: #CF0000;
  text-transform: uppercase;
}

.sinta__desc {
  color: #C9BDB9;
  font-family: 'Montserrat', sans-serif;
  font-size:   clamp(14px, calc(15 / 1920 * 100vw), 15px);
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: -0.1px;
  max-width: clamp(260px, calc(420 / 1920 * 100vw), 420px);
}

.sinta__cta {
  display: inline-flex;
  padding: 12px 34px 15px 34px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  background: rgba(18, 8, 8, 0.72);
  border: 1px solid rgba(229, 227, 227, 0.26);
  cursor: pointer;
  color: #F8F8F8;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 124.667%;
  letter-spacing: 1.96px;
  text-transform: uppercase;
  transition: background 0.2s, border-color 0.2s;
  margin-top: 16px;
}
.sinta__cta:hover {
  background: rgba(60, 10, 10, 0.85);
  border-color: rgba(229, 227, 227, 0.5);
}

/* ── Colagem (lado direito) — imagem única do Figma ────── */
.sinta__collage {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sinta__collage-img {
  display: block;
  width: calc(620.96 / 1920 * 100vw);
  height: auto;
  max-height: calc(719.61 / 1920 * 100vw);
  min-width: 360px;
  object-fit: contain;
}

/* Tamanhos mínimos legíveis em telas menores */
@media (max-width: 1100px) {
  .sinta__title { font-size: 34px; }
  .sinta__desc  { font-size: 14px; max-width: 100%; }
  .sinta__cta   { font-size: 13px; padding: 12px 28px; }
}

/* ========================================
   ALGUMAS EXPERIÊNCIAS NÃO PODEM SER EXPLICADAS...
   ----------------------------------------
   Frame Figma: 1922 × 950.92
   Bloco central: 857.57 wide · gap 40
   Gradiente: #000 topo/base → transparente centro
   Fonte assinatura: Jhon Halend (placeholder: Great Vibes)
     → Quando tiver o arquivo: adicionar assets/fonts/jhon-halend.otf
     → Descomentar o @font-face abaixo e trocar font-family na .quote-section__sig
   ======================================== */

@font-face {
  font-family: 'Jhon Halend';
  src: url('assets/fonts/jhon-halend.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

.quote-section {
  position: relative;
  width: 100%;
  min-height: calc(950.92 / 1920 * 100vw);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;

  /* Foto + gradiente vertical em camadas */
  background-image:
    linear-gradient(to bottom,
      #000 0%,
      rgba(0,0,0,0.55) 18%,
      rgba(0,0,0,0)    35%,
      rgba(0,0,0,0)    65%,
      rgba(0,0,0,0.55) 82%,
      #000 100%
    ),
    url('assets/algumas-experiencias_bg.webp');
  background-size: cover;
  background-position: center;
}

.quote-section__inner {
  position: relative;
  z-index: 1;
  width:  calc(857.57 / 1920 * 100vw);
  min-width: 480px;
  max-width: 90vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc(40 / 1920 * 100vw);
  text-align: center;
}

/* Aspas grandes */
.quote-section__mark {
  font-family: 'Cinzel', serif;
  font-size:  clamp(36px, calc(72 / 1920 * 100vw), 72px);
  font-weight: 700;
  color: #F8F8F8;
  line-height: 0.6;
  margin-bottom: calc(-10 / 1920 * 100vw);
}

/* Texto principal */
.quote-section__text {
  color: #F8F8F8;
  font-family: 'Cinzel', serif;
  font-size:  clamp(24px, calc(48 / 1920 * 100vw), 48px);
  font-weight: 700;
  line-height: 1.25;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

/* "APENAS SENTIDAS." em vermelho */
.quote-section__red {
  color: #CF0000;
  font-family: 'Cinzel', serif;
  font-size:  clamp(24px, calc(48 / 1920 * 100vw), 48px);
  font-weight: 700;
  line-height: 1.25;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  margin-top: calc(-20 / 1920 * 100vw);
}

/* Assinatura — troca 'Great Vibes' por 'Jhon Halend' quando tiver o arquivo */
.quote-section__sig {
  font-family: 'Jhon Halend', 'Great Vibes', cursive;
  font-size:  clamp(56px, calc(107 / 1920 * 100vw), 107px);
  font-weight: 400;
  color: #F8F8F8;
  line-height: 0.8;
  letter-spacing: 0;
}

@media (max-width: 1100px) {
  .quote-section__text,
  .quote-section__red  { font-size: 32px; }
  .quote-section__mark { font-size: 48px; }
  .quote-section__sig  { font-size: 64px; }
}

/* ========================================
   CONTE-ME SEUS DESEJOS  — specs Figma
   ----------------------------------------
   Foto:  479.953 × 929.501 px
   Form frame: 699 × 847 px  · gap 20px
   Posição form: left=949, top=118, right=272, bottom=85.6
   ======================================== */
.conte {
  width: 100%;
  background-image: url('assets/image 57777.webp');
  background-size: 100% auto;
  background-position: left top;
  background-repeat: no-repeat;
  background-color: #D9B599;
  display: flex;
  align-items: flex-start;
  overflow: hidden;
}

/* ── Foto: offset x=309.9, y=121.5 do Figma ───────────── */
.conte__photo {
  flex: 0 0 auto;
  width: calc(479.953 / 1920 * 100vw);
  min-width: 200px;
  margin-left: calc(309.9 / 1920 * 100vw);
  align-self: stretch;
  position: relative;
  overflow: hidden;
  /* Dissolve nos 4 lados */
  -webkit-mask-image:
    linear-gradient(to right,  transparent 0%, black 12%, black 88%, transparent 100%),
    linear-gradient(to bottom, transparent 0%, black 28%, black 100%, black 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(to right,  transparent 0%, black 12%, black 88%, transparent 100%),
    linear-gradient(to bottom, transparent 0%, black 28%, black 100%, black 100%);
  mask-composite: intersect;
}
.conte__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  mix-blend-mode: multiply;
}

/* ── Coluna direita: frame inicia em x=949, padding-left = 949-(309.9+479.95)=159.15 ── */
.conte__form-wrap {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: calc(20 / 1920 * 100vw);
  padding-top:    calc(118.38 / 1920 * 100vw);
  padding-bottom: calc(85.62  / 1920 * 100vw);
  padding-left:   calc(159.15 / 1920 * 100vw);
  padding-right:  calc(272    / 1920 * 100vw);
}

/* ── Cabeçalho ────────────────────────────────────────── */
.conte__header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  align-self: stretch;
}

.conte__title {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-self: stretch;
}
.conte__title-black {
  font-family: 'Cinzel', serif;
  font-size: clamp(28px, calc(48 / 1920 * 100vw), 48px);
  font-weight: 700;
  line-height: 1.15;
  color: #010101;
  text-align: center;
}
.conte__title-red {
  font-family: 'Cinzel', serif;
  font-size: clamp(28px, calc(48 / 1920 * 100vw), 48px);
  font-weight: 700;
  line-height: 1.15;
  color: #CF0000;
  text-align: center;
}

.conte__subtitle {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(13px, calc(16 / 1920 * 100vw), 16px);
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: -0.2px;
  color: #040404;
  text-align: center;
  align-self: stretch;
}

/* ── Formulário ───────────────────────────────────────── */
.conte__form {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-self: stretch;
  gap: calc(20 / 1920 * 100vw);
}

.conte__row {
  display: flex;
  align-self: stretch;
  gap: 20px;
}
.conte__row .conte__field { flex: 1; }

.conte__field {
  display: flex;
  flex-direction: column;
  align-self: stretch;
  gap: 4px;
}

/* Labels: NOME, CONTATO, DATA PREFERENCIAL, SEUS DESEJOS */
.conte__label {
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 1.6px;
  color: #91241C;
  text-transform: uppercase;
}

/* Inputs de texto (borda só embaixo) */
.conte__input {
  background: transparent;
  border: none;
  border-bottom: 1px solid #8A8A8B;
  padding: 4px 0;
  font-family: 'Montserrat', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 32px;
  letter-spacing: -0.16px;
  color: #040404;
  outline: none;
  width: 100%;
  transition: border-color 0.2s;
}
.conte__input::placeholder { color: #8A8A8B; }
.conte__input:focus { border-bottom-color: #91241C; }

/* Textarea "Seus Desejos" */
.conte__textarea {
  display: flex;
  height: clamp(110px, calc(148 / 1920 * 100vw), 148px);
  padding: 14px 16px;
  align-items: flex-start;
  align-self: stretch;
  gap: 10px;
  border: 1px solid #C5C5C5;
  background: #F9F9F9;
  resize: none;
  font-family: 'Montserrat', sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: -0.1px;
  color: #040404;
  outline: none;
  width: 100%;
  transition: border-color 0.2s;
}
.conte__textarea::placeholder { color: #8A8A8B; }
.conte__textarea:focus { border-color: #91241C; }

/* ── Checkbox ─────────────────────────────────────────── */
.conte__check {
  display: flex;
  align-items: flex-start;
  align-self: stretch;
  gap: 12px;
  cursor: pointer;
}
.conte__check-input { display: none; }
.conte__check-box {
  flex-shrink: 0;
  width: 20px; height: 20px;
  border: 1px solid #8A8A8B;
  border-radius: 50%;
  background: transparent;
  margin-top: 6px;
  transition: background 0.2s, border-color 0.2s;
}
.conte__check-input:checked + .conte__check-box {
  background: #91241C;
  border-color: #91241C;
}
.conte__check-text {
  flex: 1 0 0;
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.1px;
  color: #8A8A8B;
}

/* ── Botão ENVIAR MEU DESEJO ──────────────────────────── */
.conte__btn {
  display: flex;
  height: 52px;
  padding: 12px 34px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  align-self: stretch;
  background: #91241C;
  border: none;
  box-shadow: 0 8px 24px 0 rgba(0, 0, 0, 0.18);
  cursor: pointer;
  color: #D9B599;
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 2px;
  text-transform: uppercase;
  transition: background 0.2s;
}
.conte__btn:hover { background: #6E1915; }

@media (max-width: 1100px) {
  .conte__title-black,
  .conte__title-red   { font-size: 32px; line-height: 38px; }
  .conte__subtitle    { font-size: 14px; }
  .conte__textarea    { height: 120px; }
}

/* ========================================
   PERGUNTAS FREQUENTES
   ======================================== */

.faq {
  width: 100%;
  background: #EAEAEA;
  padding-top:    calc(153    / 1920 * 100vw);
  padding-bottom: calc(153    / 1920 * 100vw);
  padding-left:   calc(469.66 / 1920 * 100vw);
  padding-right:  calc(469.9  / 1920 * 100vw);
}

.faq__inner {
  display: flex;
  flex-direction: column;
}

.faq__title {
  display: block;
  text-align: center;
  margin-bottom: calc(75.16 / 1920 * 100vw);
}
.faq__title-black {
  font-family: 'Cinzel', serif;
  font-size: 44px;
  font-weight: 700;
  line-height: 1.1;
  color: #010101;
}
.faq__title-red {
  font-family: 'Cinzel', serif;
  font-size: 44px;
  font-weight: 700;
  line-height: 1.1;
  color: #D10E0D;
}

.faq__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.faq__item {
  border-top: 1px solid rgba(4, 4, 4, 0.15);
}
.faq__item:last-child {
  border-bottom: 1px solid rgba(4, 4, 4, 0.15);
}

.faq__q {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 28px 0;
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
  gap: 16px;
}

.faq__q-text {
  font-family: 'Montserrat', sans-serif;
  font-size: 17px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.1px;
  color: #040404;
}

.faq__icon {
  font-size: 22px;
  color: #040404;
  flex-shrink: 0;
  line-height: 1;
  transition: transform 0.25s;
  user-select: none;
}

.faq__item.is-open .faq__icon {
  transform: rotate(45deg);
}

.faq__a {
  display: none;
  padding-bottom: 28px;
}
.faq__item.is-open .faq__a {
  display: block;
}

.faq__a p {
  font-family: 'Montserrat', sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0.1px;
  color: rgba(4, 4, 4, 0.55);
  max-width: calc(952.438 / 1920 * 100vw);
}

/* ========================================
   FOOTER
   ======================================== */

.site-footer {
  width: 100%;
  background-color: #11100B;
  background-image: url('assets/miss-helena-footer-bg-desktop.webp');
  background-size: 100% auto;
  background-position: left top;
  background-repeat: no-repeat;
}

/* footer main = exatamente a altura da image 27.png (740px a 1920px) */
.site-footer__main {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: calc(740 / 1920 * 100vw);
  gap: 0;
}

/* logo top = 132.7; height ≈ 94.5 (Group13 2x: 245×94.5) */
.site-footer__logo {
  margin-top: calc(132.7 / 1920 * 100vw);
  width: calc(245 / 1920 * 100vw);
  min-width: 120px;
}

/* nav top = 272.47 → gap logo→nav = 272.47 - 132.7 - 94.5 = 45.27 */
.site-footer__nav {
  margin-top: calc(45.27 / 1920 * 100vw);
  display: flex;
  align-items: center;
  gap: calc(48 / 1920 * 100vw);
}

.site-footer__nav-link {
  font-family: 'Montserrat', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.85);
  text-decoration: none;
  transition: color 0.2s;
}
.site-footer__nav-link:hover { color: #fff; }

/* tagline top = 351.95 → gap nav→tagline = 351.95 - (272.47+20) = 59.48 */
.site-footer__tagline {
  margin-top: calc(59.48 / 1920 * 100vw);
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.45);
  text-align: center;
  line-height: 2;
}

/* social top = 557.93 → gap tagline→social = 557.93 - (351.95+44) = 161.98 */
/* social bottom margin = 146.07 (pushes footer main to 740px total)        */
.site-footer__social {
  margin-top: calc(161.98 / 1920 * 100vw);
  margin-bottom: calc(146.07 / 1920 * 100vw);
  display: flex;
  align-items: center;
  gap: calc(12 / 1920 * 100vw);
}

.site-footer__social-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width:  calc(36 / 1920 * 100vw);
  height: calc(36 / 1920 * 100vw);
  min-width:  28px;
  min-height: 28px;
  border-radius: 50%;
  text-decoration: none;
  transition: opacity 0.2s;
}
.site-footer__social-btn:hover { opacity: 0.85; }
.site-footer__social-btn--telegram { background: #2AABEE; }
.site-footer__social-btn--whatsapp { background: #25D366; }
.site-footer__social-btn--email    { background: #91241C; }

.site-footer__bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding: 20px;
  text-align: center;
}

.site-footer__bottom p {
  font-family: 'Montserrat', sans-serif;
  font-size: 10px;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.3);
}
.site-footer__dev {
  margin-top: 6px;
  font-family: 'Montserrat', sans-serif;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  padding-bottom: 1px;
  transition: color 0.2s, border-color 0.2s;
  cursor: pointer;
}
.site-footer__dev:hover {
  color: rgba(255, 255, 255, 0.9);
  border-bottom-color: rgba(255, 255, 255, 0.6);
}

/* ── Rodapé — links legais + aviso ───────────────────────── */
.site-footer__legal {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 6px 12px;
  margin-bottom: 10px;
}
.site-footer__legal-link {
  font-family: 'Montserrat', sans-serif;
  font-size: 9px;
  font-weight: 500;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.45);
  text-decoration: none;
  transition: color 0.2s;
}
.site-footer__legal-link:hover { color: rgba(255, 255, 255, 0.8); }
.site-footer__legal-sep {
  color: rgba(255, 255, 255, 0.2);
  font-size: 9px;
}
.site-footer__disclaimer {
  font-family: 'Montserrat', sans-serif;
  font-size: 9px;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.25);
  margin-bottom: 8px;
}

/* ── GDPR checkbox — popup formulário ───────────────────── */
.form-gdpr {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
  margin-top: 12px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 2px;
  transition: border-color 0.2s;
}
.form-gdpr--error { border-color: rgba(207, 0, 0, 0.6) !important; }
.form-gdpr__input { display: none; }
.form-gdpr__box {
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  margin-top: 2px;
  border: 1px solid rgba(255, 255, 255, 0.35);
  background: transparent;
  border-radius: 2px;
  transition: background 0.15s, border-color 0.15s;
  position: relative;
}
.form-gdpr__input:checked + .form-gdpr__box {
  background: #CF0000;
  border-color: #CF0000;
}
.form-gdpr__input:checked + .form-gdpr__box::after {
  content: '';
  position: absolute;
  left: 3px; top: 1px;
  width: 5px; height: 8px;
  border: 1.5px solid #fff;
  border-top: none; border-left: none;
  transform: rotate(40deg);
}
.form-gdpr__text {
  font-family: 'Montserrat', sans-serif;
  font-size: 10px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.55);
}
.form-gdpr__text a {
  color: rgba(217, 138, 130, 0.85);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ========================================
   PÁGINAS LEGAIS (privacidade / termos / cookies)
   ======================================== */
.legal-page {
  background: #0A0906;
  min-height: 100vh;
  color: #F0EDE8;
  font-family: 'Montserrat', sans-serif;
}
.legal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 40px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.legal-header__back {
  font-family: 'Montserrat', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(217, 138, 130, 0.85);
  text-decoration: none;
  transition: color 0.2s;
}
.legal-header__back:hover { color: #D98A82; }
.legal-header__logo { height: 28px; }
.legal-content {
  max-width: 780px;
  margin: 0 auto;
  padding: 60px 32px 80px;
}
.legal-content h1 {
  font-family: 'Cinzel', serif;
  font-size: clamp(24px, 3vw, 36px);
  font-weight: 700;
  color: #F0EDE8;
  margin-bottom: 8px;
}
.legal-content .legal-date {
  font-size: 11px;
  letter-spacing: 1px;
  color: rgba(255,255,255,0.35);
  text-transform: uppercase;
  margin-bottom: 48px;
}
.legal-content h2 {
  font-family: 'Cinzel', serif;
  font-size: clamp(14px, 1.5vw, 18px);
  font-weight: 700;
  color: #D98A82;
  margin: 40px 0 14px;
  letter-spacing: 0.5px;
}
.legal-content p {
  font-size: 14px;
  line-height: 1.75;
  color: rgba(255,255,255,0.7);
  margin-bottom: 14px;
}
.legal-content strong { color: rgba(255,255,255,0.9); }
.legal-content ul {
  list-style: none;
  padding: 0;
  margin: 0 0 16px;
}
.legal-content ul li {
  font-size: 14px;
  line-height: 1.75;
  color: rgba(255,255,255,0.7);
  padding-left: 18px;
  position: relative;
  margin-bottom: 4px;
}
.legal-content ul li::before {
  content: '—';
  position: absolute;
  left: 0;
  color: #D98A82;
  font-size: 11px;
}
.legal-footer-bar {
  border-top: 1px solid rgba(255,255,255,0.08);
  padding: 20px 40px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.legal-footer-bar p, .legal-footer-bar a {
  font-family: 'Montserrat', sans-serif;
  font-size: 10px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  text-decoration: none;
}
.legal-footer-bar a:hover { color: rgba(255,255,255,0.7); }
@media (max-width: 768px) {
  .legal-header { padding: 16px 20px; }
  .legal-content { padding: 40px 20px 60px; }
  .legal-footer-bar { padding: 16px 20px; flex-direction: column; text-align: center; }
}

/* ========================================
   LAPTOP  ≤ 1440 px  (ex: Lenovo Yoga, MacBook)
   ======================================== */
@media (max-width: 1440px) {
  /* Puro / Sinta — reduz padding lateral para não comprimir o conteúdo */
  .puro__inner,
  .sinta__inner {
    padding-left:  clamp(40px, calc(180 / 1440 * 100vw), 220px);
    padding-right: clamp(40px, calc(180 / 1440 * 100vw), 220px);
    gap: 40px;
  }

  /* Imagens colagem — evitar que fiquem enormes */
  .puro__collage-img { max-width: min(460px, 40vw); }
  .sinta__collage-img { max-width: min(460px, 40vw); }

  /* Quote — padding lateral */
  .quote-section__inner {
    padding-left:  clamp(60px, 8vw, 160px);
    padding-right: clamp(60px, 8vw, 160px);
  }

  /* FAQ — padding lateral */
  .faq {
    padding-left:  clamp(60px, 12vw, 320px);
    padding-right: clamp(60px, 12vw, 320px);
  }

  /* Conte-me — padding */
  .conte__form-wrap {
    padding-left:  clamp(40px, 6vw, 160px);
    padding-right: clamp(40px, 8vw, 220px);
  }
}

/* ========================================
   MOBILE  ≤ 768 px
   ======================================== */
@media (max-width: 768px) {

  /* ── Header ────────────────────────────────────── */
  .header {
    height: 53px;
    background: #010201;
    backdrop-filter: blur(39.1px);
    -webkit-backdrop-filter: blur(39.1px);
  }
  .nav {
    padding: 0 16px;
    justify-content: space-between;
    align-items: center;
    height: 100%;
  }
  .nav__menu  { display: none; }
  .nav__right { display: none; }
  .nav__logo img { width: 128.977px; height: 12.639px; object-fit: contain; }
  .nav__wa-btn    { display: flex; }
  .nav__hamburger { display: flex; }
  .whatsapp-fab   { display: none; }

  /* ── Hero ────────────────────────────────────────── */
  .hero {
    height: auto; min-height: 100svh;
    background-image: none; background: #0A0906;
    align-items: flex-start; flex-direction: column; overflow: visible;
  }
  .hero__overlay { display: none; }
  .hero__content {
    flex: 0 0 auto; width: 100%; max-width: 100%;
    padding: 73px 16px 20px; gap: 18px;
    align-items: center; text-align: center;
  }
  .hero__badge-label { font-size: 10px; letter-spacing: 1.3px; }
  .hero__title     { font-size: 38px; line-height: 40px; }
  .hero__title-red { font-size: 38px; line-height: 40px; }
  .hero__subtitle  { font-size: 14px; line-height: 153%; letter-spacing: -0.14px; }
  .btn--hero {
    font-size: 14px; letter-spacing: 1px;
    background: #1D111A;
    border: 1px solid #F7BAB7;
  }
  .hero__title-red { color: #CF0000; }
  .hero__mobile-img {
    display: block; flex: 0 0 auto; width: 100%;
  }
  .hero__mobile-img img {
    width: 100%; height: auto; display: block; /* natural proportions — no crop */
  }

  /* ── Rituais ─────────────────────────────────────── */
  .rituais { padding: 48px 0 0; }
  .rituais__header { padding: 0 16px; margin-bottom: 28px; }
  .rituais__title  { font-size: 30px; letter-spacing: 0; padding: 0 12px; line-height: 81%; }
  .rituais__title-white { color: #F0F0F0; }
  .rituais__title-red   { color: #CF0000; }
  .rituais__carousel-wrap { height: 340px; overflow: hidden; }
  .rituais__stage { overflow: hidden; clip-path: inset(0); } /* belt-and-suspenders for Safari 3D */
  .ritual-card {
    width: 201.38px; height: 301.96px;
    margin-left: -100.69px; margin-top: -150.98px;
    border: 0.442px solid #262626;
  }
  .ritual-card__overlay {
    background: linear-gradient(180deg,
      rgba(102,102,102,0.00) 0%,
      rgba(6,6,6,0.61) 63.7%,
      rgba(0,0,0,0.61) 86.17%);
  }
  .ritual-card__body  { padding: 14px 14px 18px; }
  .ritual-card__title { font-size: 16px; color: #F49494; line-height: 19.432px; margin-bottom: 6px; }
  .ritual-card__desc  { font-size: 8.833px; color: #F8F8F8; line-height: 14.132px; letter-spacing: -0.088px; margin-bottom: 12px; }
  .ritual-card__book  { font-size: 9px; padding: 7px 16px; letter-spacing: 1.5px; }
  .rituais__arrow {
    width: 44px; height: 44px; padding: 8px;
    border-radius: 22px; border-width: 1.5px;
  }
  .rituais__arrow--left  { left: 8px; }
  .rituais__arrow--right { right: 8px; }
  .rituais__curve { margin-top: 32px; }

  /* ── Instantes ───────────────────────────────────── */
  .instantes {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .instantes__grid {
    gap: 6px;
    padding: 0 10px;
  }
  .instantes__col { width: calc((100% - 12px) / 3); } /* 3 colunas, 2 gaps de 6px */
  .instantes__col--mid { margin-top: 0; }
  .instantes__card { width: 100%; }
  .instantes__overlay {
    position: absolute;
    inset: 0;
  }
  .instantes__label {
    position: sticky;
    top: calc(50vh - 68px); /* label ~136px tall on mobile → centre in viewport */
    width: 84%;
    padding: 32px 20px;
  }
  .instantes__label-text {
    font-size: clamp(22px, 7vw, 32px);
    line-height: 1.25;
  }

  /* ── Puro ────────────────────────────────────────── */
  .puro { padding: 62px 0 66px; }
  .puro__inner {
    flex-direction: column-reverse;
    padding: 0 22px;
    gap: 32px;
  }
  .puro__collage { width: 100%; flex: none; justify-content: flex-start; }
  .puro__collage picture { display: block; width: 100%; }
  .puro__collage-img { width: 100%; max-width: 100%; min-width: 0; max-height: none; height: auto; }
  .puro__text { width: 100%; min-width: 0; }
  .puro__title { font-size: 36px; }
  .puro__desc  { font-size: 15px; max-width: 100%; }
  .puro__cta {
    font-size: 13px;
    padding: 12px 28px;
    margin-top: 0;
  }

  /* ── Sinta ───────────────────────────────────────── */
  .sinta { padding: 48px 0; }
  .sinta__inner {
    flex-direction: column;
    padding: 0 24px;
    gap: 32px;
  }
  .sinta__text { width: 100%; min-width: 0; }
  .sinta__title { font-size: 36px; }
  .sinta__desc  { font-size: 15px; max-width: 100%; }
  .sinta__cta   { font-size: 13px; padding: 12px 28px; margin-top: 0; }
  .sinta__collage { width: 100%; }
  .sinta__collage-img { width: 100%; max-width: 100%; min-width: 0; max-height: none; height: auto; }

  /* ── Quote ───────────────────────────────────────── */
  .quote-section {
    min-height: 575px;
    background-image:
      linear-gradient(180deg, #080808 0%, rgba(4,4,4,0) 35%, rgba(4,4,4,0) 65%, #080808 100%),
      url('assets/image 21.webp');
    background-size: cover;
    background-position: center;
  }
  .quote-section__inner {
    min-width: 0; width: 90vw; gap: 16px;
    padding: 60px 0;
  }
  .quote-section__mark  { display: none; }
  .quote-section__aspas {
    display: block;
    width: 21.68px;
    height: 16.11px;
    flex-shrink: 0;
  }
  .quote-section__text {
    font-size: 30px;
    line-height: 31.595px;
    color: #F0F0F0;
  }
  .quote-section__red {
    font-size: 30px;
    line-height: 31.595px;
    margin-top: 0;
  }
  .quote-section__sig { display: none; }
  .quote-section__sig-img {
    display: block;
    width: 188px;
    height: auto;
  }

  /* ── Conte-me ─────────────────────────────────────── */
  .conte {
    flex-direction: column;
    background-image: url('assets/miss-helena-contacto-mobile.webp');
    background-size: cover;
    background-position: center top;
    background-color: #D9B599;
  }
  .conte__photo { display: none; }
  .conte__form-wrap {
    width: 100%;
    padding: 48px 24px 56px;
    gap: 22px;
  }
  .conte__title-black,
  .conte__title-red  { font-size: 30px; line-height: 38px; }
  .conte__subtitle   { font-size: 14px; line-height: 32px; letter-spacing: -0.14px; color: #040404; }
  .conte__form       { gap: 22px; }
  .conte__field      { gap: 10px; }
  .conte__row        { flex-direction: column; gap: 22px; }
  .conte__label      { font-size: 16px; line-height: 32px; letter-spacing: -0.16px; }
  .conte__input      { font-size: 16px; line-height: 32px; letter-spacing: -0.16px; }
  .conte__textarea   { font-size: 16px; line-height: 24px; letter-spacing: -0.16px; height: 160px; padding: 24px; }
  .conte__check-text { font-size: 14px; line-height: 22px; letter-spacing: -0.14px; }
  .conte__btn        { height: 59px; padding: 0 34px; }

  /* ── FAQ ─────────────────────────────────────────── */
  .faq {
    padding: 60px 24px;
  }
  .faq__title { margin-bottom: 40px; }
  .faq__title-black,
  .faq__title-red { font-size: 28px; }
  .faq__q      { padding: 18px 0; }
  .faq__q-text { font-size: 15px; line-height: 1.5; }
  .faq__a p    { font-size: 13px; line-height: 1.7; max-width: 100%; }

  /* ── Footer ──────────────────────────────────────── */
  .site-footer {
    /* mobile: portrait image anchored at bottom */
    background-image: url('assets/miss-helena-footer-background.webp');
    background-size: 100% auto;
    background-position: left bottom;
  }
  .site-footer__main { min-height: 740px; }
  .site-footer__logo { margin-top: 50px; width: 180px; }
  .site-footer__nav {
    margin-top: 40px;
    flex-direction: column;
    align-items: flex-start;
    gap: 34px;
    padding: 0 32px;
    align-self: stretch;
  }
  .site-footer__nav-link { color: #D3D3D3; font-size: 14px; letter-spacing: 2.5px; }
  .site-footer__tagline { margin-top: 60px; }
  .site-footer__social  { margin-top: 80px; margin-bottom: 0; gap: 14px; }
  .site-footer__social-btn { width: 36px; height: 36px; }

  /* ── Popup ───────────────────────────────────────── */
  .popup {
    flex-direction: column;
    width: calc(100% - 40px);
    max-width: calc(100% - 40px);
    height: 90svh;        /* definite height — needed for flex chain to constrain children */
    max-height: 90svh;
    overflow: hidden;
  }
  .popup__image {
    width: 100%;
    height: 180px;
    flex-shrink: 0;
  }
  /* flex chain: popup → content → step → body (scrollable) */
  .popup__content {
    flex: 1;
    min-height: 0;         /* prevents flex child from overflowing parent */
    overflow: hidden;
    display: flex;
    flex-direction: column;
  }
  .popup__step {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: auto;          /* override desktop height:100% */
    padding: 16px 20px 0;
    overflow: hidden;
  }
  .popup__body {
    -webkit-overflow-scrolling: touch;  /* smooth scroll on iOS */
  }
  .popup__step--success { padding: 28px 20px; gap: 12px; }
  .popup__title { font-size: 22px; }
  .popup__desc  { font-size: 15px; line-height: 26px; }
  .btn--action  { padding: 16px 20px; }

  /* Compact calendar so slots are visible without scrolling */
  .calendar__day { height: 28px; font-size: 12px; }
  .calendar__day-name { font-size: 10px; padding: 3px 0; }
  .calendar__grid { gap: 1px; }
  .cal-nav { margin-bottom: 4px; }
  .cal-nav__title { font-size: 12px; }
  .popup__horarios-label { margin-top: 4px; }
  .popup__body { gap: 10px; }

  /* Previne zoom automático do iOS ao focar inputs (font-size mínimo 16px) */
  .form-input       { font-size: 16px !important; }
  .iti__tel-input   { font-size: 16px !important; }
}

/* ========================================
   LANDSCAPE MOBILE  (telefone deitado)
   ≤ 768 px largura  +  orientation: landscape
   ======================================== */
@media (max-width: 768px) and (orientation: landscape) {
  /* Hero: sem imagem tall — usa o fundo escuro e o conteúdo normal */
  .hero {
    min-height: 100svh;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
  }
  .hero__mobile-img { display: none; }  /* foto retrato demasiado alta */
  .hero__content {
    padding: 80px 32px 40px;
    width: 100%;
    background-image: url('assets/hero.webp');
    background-size: cover;
    background-position: center;
  }
  .hero__title, .hero__title-red { font-size: 30px; line-height: 34px; }
  .hero__subtitle { font-size: 13px; }

  /* Rituais: carousel mais baixo */
  .rituais__carousel-wrap { height: 260px; }
  .ritual-card {
    width: 160px; height: 240px;
    margin-left: -80px; margin-top: -120px;
  }

  /* Instantes: label mais pequena no centro */
  .instantes { padding-top: 24px; padding-bottom: 24px; }
  .instantes__label {
    top: calc(50vh - 55px);
    padding: 20px 16px;
  }
  .instantes__label-text { font-size: 20px; }

  /* Popup: mais horizontal */
  .popup {
    flex-direction: row;
    width: calc(100% - 24px);
    max-height: 96svh;
  }
  .popup__image { width: 40%; height: auto; }
}

/* ========================================
   ACESSIBILIDADE — sem animações
   (utilizadores com vestibular disorders, etc.)
   ======================================== */
@media (prefers-reduced-motion: reduce) {
  .hero__badge, .hero__title, .hero__subtitle,
  .btn--hero, .hero__mobile-img {
    animation: none;
    opacity: 1; transform: none;
  }
  .fade-up {
    opacity: 1; transform: none;
    transition: none;
  }
  .instantes__card img {
    filter: none; transform: none; opacity: 1;
    transition: none;
  }
}

/* ── Location hint ─────────────────────────────────────────── */
.location-pick__hint {
  display: flex; align-items: flex-start; gap: 5px;
  font-family: 'Montserrat', sans-serif; font-size: 10px; font-weight: 400;
  color: rgba(211,211,211,0.4); line-height: 1.5;
  margin-top: 2px; margin-bottom: 10px;
}
.location-pick__hint-icon {
  font-style: normal; flex-shrink: 0;
  color: rgba(211,211,211,0.4); margin-top: 1px;
}

/* ── Review step ───────────────────────────────────────────── */
.review-block {
  display: flex; flex-direction: column;
  margin-bottom: 14px;
}
.review-row {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 12px; padding: 8px 0;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}
.review-row:last-child { border-bottom: none; }
.review-label {
  font-family: 'Montserrat', sans-serif; font-size: 9px; font-weight: 700;
  letter-spacing: 1.2px; text-transform: uppercase;
  color: rgba(211,211,211,0.4); flex-shrink: 0;
}
.review-value {
  font-family: 'Montserrat', sans-serif; font-size: 12px; font-weight: 500;
  color: #D3D3D3; text-align: right; word-break: break-word;
}
.review-notice {
  background: rgba(217,138,130,0.07); border: 1px solid rgba(217,138,130,0.18);
  border-radius: 4px; padding: 10px 14px;
  font-family: 'Montserrat', sans-serif; font-size: 10px; font-weight: 400;
  color: rgba(217,138,130,0.8); line-height: 1.65; text-align: center;
}
.acknowledge-label {
  display: flex; align-items: flex-start; gap: 10px; cursor: pointer;
  margin-top: 14px; margin-bottom: 16px; padding: 12px 14px;
  border: 1px solid rgba(255,255,255,0.08); transition: border-color 0.2s;
}
.acknowledge-label--error { border-color: rgba(207,0,0,0.5); }
.acknowledge-label input[type="checkbox"] { display: none; }
.acknowledge-text {
  font-family: 'Montserrat', sans-serif; font-size: 11px; font-weight: 500;
  color: rgba(211,211,211,0.6); line-height: 1.6; letter-spacing: 0.3px;
  display: flex; align-items: flex-start; gap: 8px;
}
.acknowledge-text::before {
  content: ''; display: inline-block; width: 15px; height: 15px; flex-shrink: 0;
  border: 1px solid rgba(255,255,255,0.2); background: transparent; margin-top: 1px;
  transition: background 0.15s, border-color 0.15s;
}
.acknowledge-label input[type="checkbox"]:checked + .acknowledge-text { color: rgba(211,211,211,0.9); }
.acknowledge-label input[type="checkbox"]:checked + .acknowledge-text::before {
  background: #D98A82; border-color: #D98A82;
}
.acknowledge-label--error .acknowledge-text::before { border-color: #CF0000; }
.form-privacy {
  display: flex; align-items: flex-start; gap: 6px;
  font-family: 'Montserrat', sans-serif; font-size: 10px; color: rgba(211,211,211,0.3);
  line-height: 1.5; margin-top: 2px; margin-bottom: 8px;
}