/* ==========================================================
   THEME: fundo branco, textos e bordas pretos
   ========================================================== */
:root {
  --font-display : 'Condor', 'Corbel', serif;
  --font-body    : 'Corbel', serif;

  --gold        : #000;
  --gold-light  : #000;
  --orange      : #000;
  --gray-text   : #222;
  --gray-line   : #000;
  --card-bg     : #fff;
  --card-border : #000;
  --section-bg  : #fff;
}

body, .main-content, .hero, .section { background: #fff !important; color: #000 !important; }
body { font-family: var(--font-body) !important; }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-display) !important; color: #000 !important; }

/* Hero / navegação */
.hero__video-wrap::after { background: linear-gradient(to right, rgba(255,255,255,0.85) 0%, rgba(255,255,255,0.6) 55%, rgba(255,255,255,0.3) 100%); }
.hero__nav-item { font-family: var(--font-display) !important; font-weight: 700 !important; letter-spacing: 0.14em; color: #000 !important; }
.hero__nav-item:hover { color: #000 !important; }
.hero__nav-item::after { background: #000; }
.wave-text .char .back { color: #000; }
.hero__headline { font-family: var(--font-display) !important; font-weight: 700; font-size: clamp(1.6rem, 3.2vw, 2.4rem); line-height: 1.15; color: #000; max-width: 460px; margin: 0; }
.hero__cta-group { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }
.hero__subtitle, .product-card__desc, .contact-card__desc, .conheca-card p { font-family: var(--font-body) !important; font-weight: 400 !important; color: #000 !important; }
.hero__social-icon { background: #fff; border: 1px solid #000; color: #000; }
.hero__social-icon:hover { background: #000; color: #fff; }
.hero__social-icon svg { fill: currentColor; }

/* Labels e textos */
.section-label { font-family: var(--font-display) !important; font-weight: 400 !important; letter-spacing: 0.22em; color: #000 !important; }
.section-label::before { background: #000; }
.product-card__title, .contact-card__title, .conheca-card h3 { font-family: var(--font-display) !important; font-weight: 700 !important; letter-spacing: 0.07em; color: #000 !important; }

/* Cards */
.product-card, .contact-card, .conheca-card { background: #fff; border: 1px solid #000; backdrop-filter: none; }
.product-card:hover, .contact-card:hover, .conheca-card:hover { border-color: #000; box-shadow: 0 20px 50px rgba(0,0,0,0.25); }
.product-card::before { background: none; }
.products-grid--services .product-card--featured { border-color: #000; }
.product-card__arrow { background: #fff; border: 1px solid #000; }
.product-card__arrow svg path { stroke: #000; }
.product-card:hover .product-card__arrow { background: #fff; }
.conheca-card img { border: 2px solid #000; }

/* Cards de cursos (imagens) */
.coupon-card { border: 1px solid #000; background: #fff; }
.coupon-card:hover { box-shadow: 0 20px 50px rgba(0,0,0,0.3), 0 0 0 1px #000; }

/* Botões */
.btn-whatsapp, .btn-instagram { font-family: var(--font-body) !important; font-weight: 700 !important; letter-spacing: 0.08em; background: #fff; border: 1px solid #000; color: #000; }
.btn-whatsapp:hover, .btn-instagram:hover { background: #000; border-color: #000; color: #fff; }
.btn-whatsapp .wa-icon { color: inherit; }

/* Divisor, voltar ao topo, rodapé */
.section-divider { background: #000; }
.scroll-top { background: #fff; border: 1px solid #000; }
.scroll-top:hover { background: #000; }
.scroll-top svg path { stroke: #000; }
.scroll-top:hover svg path { stroke: #fff; }
.rodape { background: #fff; border-top: 1px solid #000; }
.rodape__copy { color: #000; }

@keyframes glowPulse {
  0%, 100% { box-shadow: 0 0 0 rgba(0,0,0,0); }
  50%      { box-shadow: 0 24px 60px rgba(0,0,0,0.25), 0 0 28px rgba(0,0,0,0.12); }
}

/* ==========================================================
   DESKTOP (acima de 680px): cards um embaixo do outro e maiores
   O mobile continua exatamente como estava.
   ========================================================== */
@media (min-width: 681px) {
  .coupons-grid { gap: 32px; }
  .coupon-row { flex-direction: column; align-items: center; gap: 32px; }
  .coupon-card { flex: none; width: 100%; max-width: 960px; min-width: 0; }

  .products-grid,
  .products-grid--services,
  .contacts-grid,
  .conheca-grid { grid-template-columns: 1fr !important; max-width: 960px; margin: 0 auto; width: 100%; gap: 32px; }

  .products-grid--single .product-card,
  .conheca-grid--single .conheca-card { max-width: 960px; }
}

/* Mobile */
@media (max-width: 680px) {
  .hero__headline { max-width: 100%; text-align: left; }
  .hero__cta-group { flex-direction: column; width: 100%; }
  .btn-whatsapp, .btn-instagram { min-height: 46px; font-size: 0.82rem; }
  .products-grid--services { grid-template-columns: 1fr !important; }
}

/* ==========================================================
   POPUP DE ESCOLHA DE CIDADE
   ========================================================== */
body.modal-open { overflow: hidden; }

.modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 20px; visibility: hidden; opacity: 0; transition: opacity .3s ease, visibility .3s ease; }
.modal.is-open { visibility: visible; opacity: 1; }

.modal__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.35); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }

.modal__box { position: relative; width: 100%; max-width: 460px; background: #fff; color: #000; border: 1px solid #000; border-radius: var(--radius-lg); padding: 40px 32px 32px; text-align: center; box-shadow: 0 30px 80px rgba(0,0,0,0.35); transform: translateY(24px) scale(.96); transition: transform .35s cubic-bezier(.25,.8,.25,1); }
.modal.is-open .modal__box { transform: translateY(0) scale(1); }

.modal__close { position: absolute; top: 14px; right: 14px; width: 36px; height: 36px; border-radius: 50%; background: #fff; border: 1px solid #000; color: #000; font-size: 1rem; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background var(--transition), color var(--transition); }
.modal__close:hover { background: #000; color: #fff; }

.modal__eyebrow { font-family: var(--font-display); font-size: 0.78rem; letter-spacing: .22em; text-transform: uppercase; color: #000; margin-bottom: 12px; }
.modal__title { font-family: var(--font-display) !important; font-size: clamp(1.4rem, 4vw, 1.8rem); line-height: 1.2; color: #000 !important; margin-bottom: 10px; }
.modal__text { font-family: var(--font-body); font-size: 0.95rem; color: #000; line-height: 1.5; margin-bottom: 24px; }

.modal__options { display: flex; flex-direction: column; gap: 14px; }
.modal__option { display: flex; align-items: center; gap: 16px; width: 100%; padding: 18px 20px; background: #fff; color: #000; border: 1px solid #000; border-radius: var(--radius); font-family: var(--font-body); text-align: left; cursor: pointer; transition: background var(--transition), color var(--transition), transform var(--transition), box-shadow var(--transition); }
.modal__option:hover, .modal__option:focus-visible { background: #000; color: #fff; transform: translateY(-3px); box-shadow: 0 12px 30px rgba(0,0,0,0.3); outline: none; }
.modal__option-icon { font-size: 1.3rem; }
.modal__option-label { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.modal__option-label strong { font-family: var(--font-display); font-size: 1.15rem; letter-spacing: .06em; text-transform: uppercase; }
.modal__option-label small { font-size: 0.82rem; opacity: .75; }
.modal__option-arrow { transition: transform var(--transition); }
.modal__option:hover .modal__option-arrow { transform: translateX(4px); }

@media (max-width: 680px) {
  .modal__box { padding: 36px 20px 24px; }
}
