:root{--of-wine:#88284A;--of-dark:#12070b;--of-dark2:#1a0b10;--of-gold:#c8a767;--of-cream:#f4e7dc;--of-muted:#c7b4ac;--of-line:rgba(244,231,220,.16)}.of-page{background:var(--of-dark);color:var(--of-cream)}.of-hero{padding:145px 0 95px;background:radial-gradient(circle at 75% 20%,rgba(136,40,74,.55),transparent 37%),linear-gradient(135deg,#12070b,#2b0c17)}.of-hero__inner{max-width:850px}.of-kicker{margin:0 0 15px;color:var(--of-gold);font-size:10px;text-transform:uppercase;letter-spacing:.18em}.of-hero h1,.of-heading h2{font-family:'Playfair Display',Georgia,serif;font-weight:500;letter-spacing:-.03em}.of-hero h1{font-size:clamp(48px,7vw,84px);line-height:.98;margin:0 0 24px}.of-hero h1 em{font-weight:500;color:#e0a6b9}.of-hero p:not(.of-kicker){max-width:720px;color:var(--of-muted);font-size:16px;line-height:1.8}.of-section{padding:90px 0 110px;background:linear-gradient(180deg,#16090d,#100609)}.of-wrap{max-width:980px}.of-heading{max-width:760px;margin-bottom:34px}.of-heading h2{font-size:clamp(36px,5vw,58px);margin:0 0 16px}.of-heading>p:last-child{color:var(--of-muted);line-height:1.75}.of-form{display:grid;gap:26px}.of-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.of-field{display:grid;gap:8px}.of-field>span,.of-channels legend{color:var(--of-gold);font-size:11px;text-transform:uppercase;letter-spacing:.08em}.of-field input,.of-field select,.of-field textarea{width:100%;border:1px solid var(--of-line);background:#1b0d12;color:var(--of-cream);padding:14px 15px;font:inherit;outline:none}.of-field input:focus,.of-field select:focus,.of-field textarea:focus{border-color:var(--of-gold);box-shadow:0 0 0 2px rgba(200,167,103,.08)}.of-field small{color:var(--of-muted);font-size:11px;line-height:1.5}.of-field--full{grid-column:1/-1}.of-field--wide{grid-column:span 1}.of-channels{border:1px solid var(--of-line);padding:22px;display:grid;gap:10px}.of-channels legend{padding:0 8px}.of-channels>p{color:var(--of-muted);margin:0 0 8px;font-size:13px}.of-choice{display:flex;align-items:flex-start;gap:12px;padding:16px;border:1px solid var(--of-line);cursor:pointer}.of-choice:has(input:checked){border-color:var(--of-gold);background:rgba(200,167,103,.06)}.of-choice input{margin-top:3px}.of-choice span{display:grid;gap:3px}.of-choice b{font-size:14px}.of-choice small{color:var(--of-muted)}.of-reveal{border-left:2px solid var(--of-wine);padding:15px 18px;margin:0 0 8px;background:rgba(136,40,74,.055)}.of-physical{padding:24px}.of-physical h3{font-family:'Playfair Display',Georgia,serif;font-size:27px;margin:0 0 18px}.of-unit{margin-top:24px;padding-top:24px;border-top:1px solid var(--of-line)}.of-unit__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.of-unit__head h4{font-family:'Playfair Display',Georgia,serif;font-size:22px;margin:0}.of-unit__remove,.of-link{border:0;background:none;color:var(--of-gold);font-size:11px;cursor:pointer;padding:7px 0}.of-number{display:grid;gap:7px}.of-number>label{color:var(--of-muted);font-size:11px}.of-btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--of-line);border-radius:999px;min-height:47px;padding:0 22px;background:#1c0d12;color:var(--of-gold);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;cursor:pointer;text-decoration:none}.of-btn--gold{background:var(--of-gold);color:#1b0a10;border-color:var(--of-gold)}.of-btn--small{min-height:39px;margin-top:20px}.of-complement{padding-top:7px}.of-consents{display:grid;gap:10px;color:var(--of-muted);font-size:12px}.of-consents a{color:var(--of-gold)}.of-submit{display:flex;align-items:center;gap:16px;padding-top:8px}.of-submit-status{font-size:12px;color:var(--of-muted)}.of-alert{padding:14px 16px;border:1px solid #a64758;background:#2a1017;margin-bottom:22px;color:#ffd8de}.of-alert[data-success="1"]{border-color:#4f8b61;background:#102617;color:#ccebd5}.of-hp{position:absolute!important;left:-10000px!important}.of-field [aria-invalid="true"]{border-color:#d75b6c!important}.of-field-error{color:#f29aa7!important}.of-unit .of-grid{margin-top:0}
@media(max-width:680px){.of-hero{padding:110px 0 70px}.of-section{padding:65px 0 80px}.of-grid{grid-template-columns:1fr}.of-field--full,.of-field--wide{grid-column:auto}.of-physical{padding:18px 14px}.of-submit{align-items:stretch;flex-direction:column}.of-submit .of-btn{width:100%}}

/* =========================================================
   AJUSTE DE LAYOUT DOS CAMPOS — 2026-08
   Padroniza dimensões e evita herança indevida em checkboxes.
   ========================================================= */
.of-wrap{
  width:min(1120px,calc(100% - 40px));
  max-width:1120px;
  margin-inline:auto;
}

.of-heading{
  max-width:820px;
}

.of-form{
  width:100%;
  gap:30px;
}

.of-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px 24px;
  align-items:start;
}

.of-field{
  min-width:0;
  gap:9px;
}

.of-field>span,
.of-channels legend{
  font-size:12px;
  line-height:1.35;
}

/* Campos tradicionais */
.of-field input:not([type="checkbox"]):not([type="radio"]),
.of-field select,
.of-field textarea{
  display:block;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  border-radius:8px;
  border:1px solid rgba(244,231,220,.22);
  background:#1b0d12;
  color:var(--of-cream);
  font-family:inherit;
  font-size:15px;
  line-height:1.4;
}

.of-field input:not([type="checkbox"]):not([type="radio"]),
.of-field select{
  height:52px;
  min-height:52px;
  padding:0 16px;
}

.of-field textarea{
  min-height:130px;
  padding:14px 16px;
  resize:vertical;
}

.of-field input[type="file"]{
  height:auto!important;
  min-height:52px;
  padding:12px 14px!important;
}

.of-field input::placeholder,
.of-field textarea::placeholder{
  color:rgba(244,231,220,.48);
  opacity:1;
}

.of-field select{
  appearance:auto;
}

/* Checkboxes nunca podem herdar largura/altura de campo textual */
.of-field input[type="checkbox"],
.of-field input[type="radio"],
.of-choice input[type="checkbox"],
.of-choice input[type="radio"],
.of-consents input[type="checkbox"],
.of-consents input[type="radio"]{
  width:18px!important;
  height:18px!important;
  min-width:18px!important;
  min-height:18px!important;
  padding:0!important;
  margin:0;
  accent-color:var(--of-gold);
  flex:0 0 18px;
}

.of-choice{
  min-height:72px;
  padding:17px 18px;
  align-items:flex-start;
  border-radius:8px;
}

.of-choice input[type="checkbox"],
.of-choice input[type="radio"]{
  margin-top:2px;
}

.of-choice b{
  font-size:15px;
  line-height:1.35;
}

.of-choice small{
  font-size:12px;
  line-height:1.45;
}

.of-channels{
  padding:26px;
  gap:12px;
  border-radius:10px;
}

.of-reveal{
  padding:18px 20px;
  border-radius:0 8px 8px 0;
}

.of-physical{
  padding:28px;
}

.of-number{
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
}

.of-number>label{
  display:flex;
  align-items:center;
  gap:7px;
  white-space:nowrap;
  font-size:12px;
}

.of-field .of-link{
  justify-self:start;
  margin-top:0;
  font-size:12px;
}

.of-consents{
  gap:12px;
  font-size:13px;
}

.of-consents label{
  display:flex;
  align-items:flex-start;
  gap:9px;
  line-height:1.5;
}

.of-submit{
  padding-top:2px;
}

.of-submit .of-btn{
  min-width:210px;
  min-height:50px;
  font-size:11px;
}

@media (max-width:900px){
  .of-wrap{
    width:min(100% - 32px,820px);
  }
  .of-grid{
    grid-template-columns:1fr 1fr;
    gap:18px;
  }
}

@media (max-width:680px){
  .of-wrap{
    width:calc(100% - 28px);
  }
  .of-grid{
    grid-template-columns:1fr;
    gap:16px;
  }
  .of-field--full,
  .of-field--wide{
    grid-column:1;
  }
  .of-channels{
    padding:18px 14px;
  }
  .of-choice{
    min-height:auto;
    padding:15px 14px;
  }
  .of-reveal,
  .of-physical{
    padding:16px 14px;
  }
  .of-number{
    grid-template-columns:1fr;
  }
  .of-submit{
    gap:10px;
  }
  .of-submit .of-btn{
    width:100%;
    min-width:0;
  }
}

/* =========================================================
   REFINO RESPONSIVO + WHATSAPP — 2026-08-02
   ========================================================= */
.of-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:28px;
  row-gap:22px;
}

.of-field{
  align-content:start;
}

.of-field>span{
  min-height:16px;
}

/* Mantém os campos do mesmo tamanho mesmo quando um deles possui ajuda abaixo */
.of-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.of-field select{
  min-height:54px;
  height:54px;
  border-radius:9px;
  padding-inline:16px;
}

/* Campo telefônico visualmente reconhecível, sem destoar dos demais */
.of-field input[type="tel"],
.of-field input[data-phone]{
  letter-spacing:.015em;
  font-variant-numeric:tabular-nums;
}

.of-field input[type="tel"]::placeholder,
.of-field input[data-phone]::placeholder{
  letter-spacing:0;
}

.of-field small{
  min-height:16px;
  margin-top:0;
}

/* Opções de canais: checkbox sempre compacto e conteúdo alinhado */
.of-choice{
  display:grid;
  grid-template-columns:20px minmax(0,1fr);
  gap:14px;
  align-items:start;
  width:100%;
  box-sizing:border-box;
}

.of-choice input[type="checkbox"],
.of-choice input[type="radio"]{
  appearance:auto!important;
  -webkit-appearance:auto!important;
  width:20px!important;
  height:20px!important;
  min-width:20px!important;
  min-height:20px!important;
  max-width:20px!important;
  max-height:20px!important;
  margin:2px 0 0!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  background:transparent!important;
}

.of-choice span{
  min-width:0;
}

.of-reveal .of-field{
  max-width:100%;
}

/* Upload sem herdar altura de inputs comuns */
.of-field input[type="file"]{
  width:100%;
  min-height:58px;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  padding:12px 14px!important;
}

@media (max-width:760px){
  .of-grid{
    grid-template-columns:1fr;
    column-gap:0;
    row-gap:17px;
  }
  .of-field>span{
    min-height:0;
  }
  .of-field small{
    min-height:0;
  }
  .of-choice{
    grid-template-columns:20px minmax(0,1fr);
    padding:15px;
  }
}

@media (max-width:420px){
  .of-wrap{width:calc(100% - 22px)}
  .of-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
  .of-field select{height:52px;min-height:52px;padding-inline:13px}
  .of-channels{padding:16px 10px}
  .of-choice{padding:14px 12px;gap:11px}
}

/* Normaliza o <select> pra ficar exatamente do mesmo tamanho dos campos de
   texto ao lado (ex.: País x Nome completo) — o <select> nativo do navegador
   não respeita bem height/padding sozinho, então tira a aparência nativa e
   desenha a setinha à mão, garantindo altura/fonte idênticas ao input. */
.of-field select{
  box-sizing:border-box;
  height:54px;
  min-height:54px;
  max-height:54px;
  font-size:15px;
  line-height:54px;
  padding:0 38px 0 16px;
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23c8a767' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 16px center;
}
/* O line-height:54px acima é só pra centralizar o texto no campo fechado —
   sem isso, o navegador herda o mesmo valor pras linhas do dropdown aberto,
   deixando cada opção gigante. Reseta explicitamente nas <option>. Mantido
   como base pro <select> nativo do país continuar funcional caso o JS do
   dropdown customizado (loja-oficial-select-pais.js) não rode por algum
   motivo. */
.of-field select option{
  line-height:normal;
  font-size:15px;
  padding:8px 12px;
}

/* Dropdown customizado do campo País — ver loja-oficial-select-pais.js.
   Navegador nativo não deixa controlar o tamanho das linhas da lista aberta
   (só o campo fechado), então esse componente próprio resolve isso por
   completo. Visual replica exatamente o .of-field select ao lado. */
.of-select-custom{position:relative}
.of-select-custom__nativo{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.of-select-custom__botao{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  width:100%;box-sizing:border-box;height:54px;min-height:54px;
  border:1px solid var(--of-line);border-radius:9px;background:#1b0d12;color:var(--of-cream);
  font:inherit;font-size:15px;padding:0 16px;cursor:pointer;text-align:left;
}
.of-select-custom__botao:hover,
.of-select-custom__botao[aria-expanded="true"]{border-color:var(--of-gold)}
.of-select-custom__botao:focus-visible{border-color:var(--of-gold);box-shadow:0 0 0 2px rgba(200,167,103,.15);outline:none}
.of-select-custom__valor{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.of-select-custom__seta{flex:0 0 auto;color:var(--of-gold);transition:transform .15s ease}
.of-select-custom__botao[aria-expanded="true"] .of-select-custom__seta{transform:rotate(180deg)}
.of-select-custom__lista{
  position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:20;
  margin:0;padding:6px;list-style:none;
  max-height:260px;overflow-y:auto;
  background:#1b0d12;border:1px solid var(--of-line);border-radius:9px;
  box-shadow:0 14px 34px rgba(0,0,0,.4);
}
.of-select-custom__item{
  padding:9px 12px;border-radius:6px;font-size:14px;line-height:1.4;color:var(--of-cream);cursor:pointer;
}
.of-select-custom__item:hover,
.of-select-custom__item:focus{background:rgba(200,167,103,.14);outline:none}
.of-select-custom__item[aria-selected="true"]{background:var(--of-gold);color:#1b0a10;font-weight:600}
@media (max-width:420px){
  .of-select-custom__botao{height:52px;min-height:52px}
}
@media (max-width:420px){
  .of-field select{height:52px;min-height:52px;max-height:52px;line-height:52px}
}
