/* mr integrações com IA · página de pacotes (carrega depois de estilo.css)
   Cada pacote tem um tom próprio dentro da paleta (ouro, marfim, bronze), um ícone de linha
   e a mesma ordem de leitura: para que serve, hoje e depois, o que você recebe, botão. */

.pg-pacotes {
  padding-bottom: 104px;
  --ac-a: #DFA968;  /* ouro */
  --ac-b: #F1E9DA;  /* marfim */
  --ac-c: #B9822F;  /* bronze */
  --ac-m: #E8C48F;  /* ouro claro */
  --ac-s: #8C5E22;  /* bronze escuro, sobre marfim */
}
.menu a[aria-current="page"] { color: var(--ouro); }
.pg-pacotes .wrap { padding-left: clamp(0px, 3vw, 48px); }

/* entrada suave dos blocos (js/pacotes.js liga .is-visivel) */
.js .revela { opacity: 0; transform: translateY(28px); transition: opacity 0.9s var(--ease), transform 0.9s var(--ease); }
.js .revela.is-visivel { opacity: 1; transform: none; }

/* ---------- abertura ---------- */
.pac-hero { padding-block: clamp(120px, 14vw, 180px) clamp(48px, 6vw, 80px); }
.pac-hero__selo { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--ouro); }
.pac-hero__titulo {
  margin-top: 18px; font-family: var(--f-display); font-size: clamp(2.375rem, 1.4rem + 3.4vw, 4.25rem); font-weight: 500;
  line-height: 1.05; letter-spacing: -0.02em; color: var(--marfim); max-width: 18ch;
}
.pac-hero__sub { margin-top: 24px; font-size: var(--t-lead); color: var(--texto-2); max-width: 58ch; }

.etapas { margin-top: clamp(40px, 5vw, 64px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; counter-reset: etapa; }
.etapa {
  position: relative; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; align-items: start;
  padding: 20px 20px 22px; border: 1px solid var(--linha); border-radius: 14px; background: rgba(33, 27, 21, 0.72);
}
.etapa + .etapa::before { /* fio ligando as etapas */
  content: ""; position: absolute; left: -15px; top: 41px; width: 16px; height: 1px; background: var(--linha-forte);
}
.etapa__num {
  width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center;
  border: 1px solid var(--ouro); color: var(--ouro); font-family: var(--f-display); font-size: 1.375rem; line-height: 1;
}
.etapa:last-child .etapa__num { background: var(--ouro); color: var(--preto); }
.etapa strong { display: block; color: var(--marfim); font-weight: 600; font-size: 1.0625rem; line-height: 1.3; }
.etapa span:not(.etapa__num) { display: block; margin-top: 4px; font-size: var(--t-pequeno); color: var(--texto-2); line-height: 1.5; }

/* ---------- guia por situação ---------- */
.guia { padding-block: clamp(32px, 4vw, 56px); }
.guia__abre { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px clamp(32px, 6vw, 96px); align-items: end; }
.guia__titulo { font-family: var(--f-display); font-size: var(--t-h3); line-height: 1.15; color: var(--marfim); max-width: 22ch; }
.guia__sub { color: var(--texto-2); max-width: 46ch; }
.guia__lista { margin-top: 32px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.guia__lista li { display: flex; }
.guia__op {
  --acento: var(--ouro);
  position: relative; isolation: isolate; overflow: hidden; width: 100%;
  display: flex; flex-direction: column; align-items: flex-start; gap: 16px; text-align: left;
  padding: 22px 20px 20px; border-radius: 14px; border: 1px solid var(--linha); background: rgba(33, 27, 21, 0.8);
  color: var(--texto); font: inherit; cursor: pointer;
  transition: border-color 0.4s var(--ease), transform 0.4s var(--ease), background-color 0.4s var(--ease);
}
.guia__op::before { /* faixa de cor do pacote no topo, que cresce ao escolher */
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--acento);
  transform: scaleX(0.18); transform-origin: left; transition: transform 0.6s var(--ease);
}
.guia__ico {
  width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center;
  border: 1px solid color-mix(in srgb, var(--acento) 45%, transparent); color: var(--acento);
  transition: background-color 0.4s var(--ease), color 0.4s var(--ease), transform 0.5s var(--ease);
}
.guia__ico svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linejoin: round; stroke-linecap: round; }
.guia__frase { font-size: var(--t-pequeno); line-height: 1.55; color: var(--texto); flex: 1; }
.guia__ir { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--acento); letter-spacing: 0.02em; }
.guia__ir svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.5; transition: transform 0.4s var(--ease); }
@media (hover: hover) {
  .guia__op:hover { border-color: color-mix(in srgb, var(--acento) 60%, transparent); transform: translateY(-4px); }
  .guia__op:hover::before { transform: scaleX(1); }
  .guia__op:hover .guia__ico { transform: rotate(-6deg) scale(1.06); }
  .guia__op:hover .guia__ir svg { transform: translateX(4px); }
}
.guia__op[aria-pressed="true"] { border-color: var(--acento); background: color-mix(in srgb, var(--acento) 9%, var(--preto-2)); }
.guia__op[aria-pressed="true"]::before { transform: scaleX(1); }
.guia__op[aria-pressed="true"] .guia__ico { background: var(--acento); color: var(--preto); }
.guia__resposta { margin-top: 18px; min-height: 1.7em; font-size: var(--t-pequeno); color: var(--marfim); }
.guia__resposta strong { color: var(--ouro); font-weight: 600; }

/* ---------- cartões dos pacotes ---------- */
.pacotes { padding-block: clamp(40px, 5vw, 72px) clamp(32px, 4vw, 56px); }
.pacotes__abre { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 16px clamp(32px, 6vw, 96px); align-items: end; }
.pacotes__abre p { color: var(--texto-2); max-width: 56ch; }
.cartoes { margin-top: clamp(36px, 5vw, 56px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; align-items: stretch; }
.cartao, .extra {
  --acento: var(--ouro);
  position: relative; display: flex; flex-direction: column; padding: 28px 26px 26px; border-radius: 18px;
  border: 1px solid var(--linha);
  background: linear-gradient(180deg, color-mix(in srgb, var(--acento) 13%, rgba(33, 27, 21, 0.94)) 0, rgba(33, 27, 21, 0.94) 260px);
  scroll-margin-top: 96px;
  transition: border-color 0.5s var(--ease), transform 0.5s var(--ease), box-shadow 0.6s var(--ease);
}
.cartao::before, .extra::before { /* faixa de cor do pacote */
  content: ""; position: absolute; left: 26px; right: 26px; top: -1px; height: 3px; border-radius: 0 0 3px 3px; background: var(--acento);
}
@media (hover: hover) { .cartao:hover, .extra:hover { border-color: color-mix(in srgb, var(--acento) 55%, transparent); transform: translateY(-4px); } }
.cartao.is-marcado, .extra.is-marcado {
  border-color: var(--acento);
  box-shadow: 0 0 0 1px var(--acento), 0 30px 70px -34px color-mix(in srgb, var(--acento) 70%, transparent);
}
.cartao.is-chegada, .extra.is-chegada { animation: chegada 1.6s var(--ease); }
@keyframes chegada { 0%, 30% { box-shadow: 0 0 0 2px var(--acento), 0 0 60px -10px var(--acento); } 100% { box-shadow: 0 0 0 0 transparent; } }

.cartao__topo { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.cartao__ico {
  width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; flex: none;
  background: var(--acento); color: var(--preto);
}
.cartao__ico svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.3; stroke-linejoin: round; stroke-linecap: round; }
.cartao__letra { font-family: var(--f-display); font-size: 4.5rem; line-height: 0.8; color: var(--acento); opacity: 0.9; }

.cartao__tipo { margin-top: 22px; font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--acento); }
.cartao__nome { margin-top: 8px; font-family: var(--f-display); font-size: clamp(1.625rem, 1.35rem + 0.9vw, 2.125rem); line-height: 1.1; color: var(--marfim); letter-spacing: -0.01em; }
.cartao__resolve { margin-top: 12px; color: var(--texto); font-size: 1.0625rem; line-height: 1.5; }

.antes-depois { margin-top: 20px; display: grid; gap: 8px; }
.antes-depois p { position: relative; padding: 12px 14px 12px 14px; border-radius: 10px; font-size: var(--t-pequeno); line-height: 1.5; color: var(--texto-3); background: rgba(22, 18, 15, 0.55); border: 1px solid var(--linha); }
.antes-depois p + p { color: var(--marfim); border-color: color-mix(in srgb, var(--acento) 40%, transparent); background: color-mix(in srgb, var(--acento) 7%, transparent); }
.antes-depois span { display: block; margin-bottom: 2px; font-family: var(--f-mono); font-size: 10.5px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--texto-3); }
.antes-depois p + p span { color: var(--acento); }
.antes-depois p + p::before { /* seta entre hoje e depois */
  content: ""; position: absolute; left: 22px; top: -9px; width: 1px; height: 9px; background: var(--acento);
}

.cartao__rotulo { margin-top: 24px; font-size: 13px; font-weight: 600; letter-spacing: 0.02em; color: var(--marfim); padding-bottom: 10px; border-bottom: 1px solid var(--linha); }
.cartao__lista { margin-top: 12px; display: grid; gap: 9px; }
.cartao__lista li { position: relative; padding-left: 26px; font-size: var(--t-pequeno); line-height: 1.55; color: var(--texto-2); }
.cartao__lista li::before { /* visto de linha fina */
  content: ""; position: absolute; left: 2px; top: 0.42em; width: 12px; height: 7px;
  border-left: 1.5px solid var(--acento); border-bottom: 1.5px solid var(--acento); transform: rotate(-45deg);
}
.cartao__nota { margin-top: 18px; font-size: 13.5px; line-height: 1.55; color: var(--texto-3); }
.cartao > .alternar { margin-top: auto; }
.cartao > .cartao__nota { margin-bottom: 24px; }

/* acompanhamento e sob medida */
.extras { margin-top: 18px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.extra { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; align-content: start; }
.extra--mensal { border-style: dashed; border-color: color-mix(in srgb, var(--acento) 40%, transparent); }
.extra--mensal .extra__colunas { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; }
.extra--mensal .cartao__rotulo { margin-top: 0; }
.extra__prova { margin-top: 14px; display: inline-flex; align-items: center; gap: 10px; font-size: 13.5px; color: var(--acento); }
.extra__prova::before { content: ""; width: 7px; height: 7px; rotate: 45deg; border: 1px solid currentColor; flex: none; }
.extra .alternar { align-self: start; }

/* sob medida: superfície marfim, a única clara da página */
.extra--medida {
  --acento: var(--ac-s);
  background: var(--marfim) !important; border-color: var(--marfim); color: var(--preto);
}
.extra--medida .cartao__nome { color: var(--preto); }
.extra--medida .cartao__resolve { color: #3A2F25; }
.extra--medida .cartao__tipo { color: #8C5E22; }
.extra--medida .cartao__rotulo { color: var(--preto); border-color: rgba(22, 18, 15, 0.16); margin-top: 0; }
.extra--medida .cartao__lista li { color: #3A2F25; }
.extra--medida .cartao__lista li::before { border-color: #8C5E22; }
.extra--medida .cartao__nota { color: #5C4E40; }
.extra--medida .cartao__ico { background: var(--preto); color: var(--ouro); }
.extra--medida .alternar { color: var(--preto); border-color: rgba(22, 18, 15, 0.3); }
.extra--medida .alternar::before { background: var(--preto); }
.extra--medida .alternar svg { stroke: #8C5E22; }
.extra--medida .alternar[aria-pressed="true"] { color: var(--marfim); border-color: var(--preto); }
.extra--medida .alternar[aria-pressed="true"] svg { stroke: var(--ouro); }
.extra--medida.is-marcado { box-shadow: 0 0 0 2px var(--ouro), 0 30px 70px -34px rgba(223, 169, 104, 0.6); }

/* botão de marcar: preenche da esquerda com a cor do pacote e desenha o visto */
.alternar {
  position: relative; isolation: isolate; overflow: hidden;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 22px 0 18px; width: 100%;
  border: 1px solid color-mix(in srgb, var(--acento, var(--ouro)) 55%, transparent); border-radius: 12px; background: transparent; color: var(--marfim);
  font: 600 1rem var(--f-texto); cursor: pointer;
  transition: color 0.45s var(--ease), border-color 0.45s var(--ease), transform 0.3s var(--ease);
}
.alternar:active { transform: scale(0.98); }
.alternar::before {
  content: ""; position: absolute; inset: 0; z-index: -1; background: var(--acento, var(--ouro));
  clip-path: inset(0 100% 0 0); transition: clip-path 0.55s var(--ease);
}
.alternar svg {
  width: 18px; height: 18px; fill: none; stroke: var(--acento, var(--ouro)); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
  stroke-dasharray: 20; stroke-dashoffset: 20; transition: stroke-dashoffset 0.5s 0.15s var(--ease), stroke 0.3s;
}
@media (hover: hover) {
  .alternar:hover { border-color: var(--acento, var(--ouro)); }
  .alternar:hover svg { stroke-dashoffset: 13; }
  .alternar[aria-pressed="true"]:hover svg { stroke-dashoffset: 0; }
}
.alternar__dentro { display: none; }
.alternar[aria-pressed="true"] { color: var(--preto); border-color: var(--acento, var(--ouro)); }
.alternar[aria-pressed="true"]::before { clip-path: inset(0 0 0 0); }
.alternar[aria-pressed="true"] svg { stroke: var(--preto); stroke-dashoffset: 0; }
.alternar[aria-pressed="true"] .alternar__fora { display: none; }
.alternar[aria-pressed="true"] .alternar__dentro { display: inline; }

/* ---------- pagamento ---------- */
.condicoes { padding-block: clamp(72px, 9vw, 128px) clamp(40px, 5vw, 72px); }
.condicoes__itens { margin-top: clamp(32px, 4vw, 48px); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.condicao { padding: 24px 22px; border: 1px solid var(--linha); border-radius: 16px; background: rgba(33, 27, 21, 0.8); }
.condicao__ico { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--linha-forte); color: var(--ouro); }
.condicao__ico svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linejoin: round; stroke-linecap: round; }
.condicao h3 { margin-top: 18px; font-family: var(--f-display); font-size: 1.375rem; line-height: 1.2; color: var(--marfim); }
.condicao p, .condicao li { margin-top: 10px; font-size: var(--t-pequeno); color: var(--texto-2); line-height: 1.55; }
.condicao ul li { position: relative; padding-left: 18px; margin-top: 7px; }
.condicao ul li::before { content: ""; position: absolute; left: 0; top: 0.8em; width: 8px; height: 1px; background: var(--ouro); }
.condicao--destaque { background: var(--ouro); border-color: var(--ouro); }
.condicao--destaque h3 { color: var(--preto); }
.condicao--destaque p { color: #2B231B; }
.condicao--destaque .condicao__ico { border-color: rgba(22, 18, 15, 0.35); color: var(--preto); }

/* ---------- dúvidas ---------- */
.duvidas { padding-block: clamp(40px, 5vw, 72px) var(--s-secao); }
.duvidas__grade { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: clamp(32px, 7vw, 120px); align-items: start; }
.duvida { border-top: 1px solid var(--linha); }
.duvida:last-child { border-bottom: 1px solid var(--linha); }
.duvida summary {
  list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 20px; min-height: 48px;
  padding: 20px 0; font-family: var(--f-display); font-size: clamp(1.1875rem, 1.05rem + 0.5vw, 1.4375rem); color: var(--marfim); line-height: 1.3;
  transition: color 0.3s var(--ease);
}
.duvida summary::-webkit-details-marker { display: none; }
.duvida summary::after {
  content: ""; flex: none; width: 14px; height: 14px;
  background: linear-gradient(var(--ouro), var(--ouro)) center / 14px 1px no-repeat, linear-gradient(var(--ouro), var(--ouro)) center / 1px 14px no-repeat;
  transition: transform 0.45s var(--ease);
}
.duvida[open] summary::after { transform: rotate(45deg); }
.duvida summary:hover { color: var(--ouro); }
.duvida p { padding-bottom: 24px; color: var(--texto-2); max-width: 62ch; }

/* ---------- barra fixa do pedido ---------- */
.barra {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: var(--z-barra);
  background: rgba(33, 27, 21, 0.96); border-top: 1px solid var(--linha-forte);
  padding-block: 12px calc(12px + env(safe-area-inset-bottom));
}
@supports (backdrop-filter: blur(8px)) { .barra { background: rgba(33, 27, 21, 0.84); backdrop-filter: blur(14px); } }
.barra__linha { display: flex; align-items: center; gap: 16px; }
.barra__info { min-width: 0; flex: 1; }
.barra__rotulo { font-family: var(--f-mono); font-size: 10.5px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ouro); }
.barra__resumo { font-size: var(--t-pequeno); color: var(--texto-2); line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tem-pedido .barra__resumo { color: var(--marfim); }
.barra__fichas { display: flex; gap: 6px; }
.barra__fichas li {
  width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center;
  background: var(--acento, var(--ouro)); color: var(--preto); font-family: var(--f-display); font-size: 1.0625rem; line-height: 1;
  animation: ficha 0.5s var(--ease) both;
}
@keyframes ficha { from { transform: scale(0.3); opacity: 0; } }
body.menu-aberto .barra { visibility: hidden; }
.barra__btn { flex: none; min-height: 48px; transition: color 0.45s var(--ease), transform 0.35s var(--ease); }
.barra.is-pulso .barra__btn { animation: pulso 0.7s var(--ease); }
@keyframes pulso { 40% { transform: scale(1.06); } }

/* ---------- responsivo ---------- */
@media (max-width: 1024px) {
  .cartoes { grid-template-columns: 1fr; max-width: 640px; }
  .extras { grid-template-columns: 1fr; max-width: 640px; }
  .guia__lista { grid-template-columns: 1fr 1fr; }
  .condicoes__itens { grid-template-columns: 1fr 1fr; }
  .guia__abre, .pacotes__abre, .duvidas__grade { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .pg-pacotes .wrap { padding-left: 0; }
  .etapas { grid-template-columns: 1fr; gap: 10px; }
  .etapa { padding: 16px; }
  .etapa + .etapa::before { left: 37px; top: -11px; width: 1px; height: 10px; }
  .guia__lista { grid-template-columns: 1fr; gap: 10px; }
  .guia__op { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 6px 14px; padding: 16px; }
  .guia__ico { grid-row: span 2; }
  .cartao, .extra { padding: 24px 18px 20px; border-radius: 16px; }
  .cartao::before, .extra::before { left: 18px; right: 18px; }
  .cartao__letra { font-size: 3.5rem; }
  .extra--mensal .extra__colunas { grid-template-columns: 1fr; gap: 20px; }
  .condicoes__itens { grid-template-columns: 1fr; }
  .barra__resumo { font-size: 13.5px; }
  .barra__fichas li { width: 30px; height: 30px; font-size: 0.9375rem; }
  .so-largo { display: none; }
  .barra__btn { padding: 0 16px; font-size: 0.9375rem; }
}
@media (max-width: 400px) { .barra__fichas { display: none; } }
@media (prefers-reduced-motion: reduce) {
  .cartao.is-chegada, .extra.is-chegada { animation: none; }
  .js .revela { opacity: 1; transform: none; }
}