/* Pré-contato Kombú (assets/precontato.js).
   Celular: folha que sobe de baixo, na altura do conteúdo. Computador: cartão
   preso ao topo. Movimento só em transform/opacity, desligado com
   prefers-reduced-motion. */
.pc-lock, .pc-lock body { overflow: hidden; }
.pc { position: fixed; inset: 0; z-index: 200; display: flex; align-items: flex-end; justify-content: center; touch-action: manipulation; font-family: var(--sans); }
.pc[hidden] { display: none; }
.pc-veil { position: absolute; inset: 0; background: rgba(12, 22, 10, .62); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); animation: pcVeil .22s ease-out both; }
.pc-sheet {
  position: relative; display: flex; flex-direction: column; width: 100%;
  max-height: calc(100dvh - max(16px, env(safe-area-inset-top, 0px)));
  background: #fffdf8; color: var(--green-deep);
  border-radius: 22px 22px 0 0; box-shadow: 0 -18px 50px -20px rgba(0, 0, 0, .45);
  animation: pcSheet .36s var(--ease) both;
}
.pc-top { flex: none; display: flex; align-items: center; gap: 12px; height: 64px; padding: 0 12px; border-bottom: 1px solid transparent; }
.pc-icon { width: 44px; height: 44px; border: 0; border-radius: 50%; background: transparent; color: var(--green-deep); display: grid; place-items: center; cursor: pointer; flex: none; transition: background-color .15s; }
.pc-icon:hover { background: #eef1e6; }
.pc-progress { flex: 1; height: 6px; border-radius: 99px; background: #e6eadb; overflow: hidden; }
.pc-progress span { display: block; height: 100%; width: 100%; background: var(--green); border-radius: inherit; transform-origin: left; transform: scaleX(0); transition: transform .5s var(--ease); }
.pc-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; padding: 4px max(20px, env(safe-area-inset-left, 0px)) 28px max(20px, env(safe-area-inset-right, 0px)); }
.pc-count { margin: 6px 0 0; font-size: 13px; font-weight: 600; color: var(--green-2); letter-spacing: .02em; }
.pc-step h2 { margin: 8px 0 0; font-family: var(--serif); font-weight: 700; font-size: clamp(1.6rem, 6.4vw, 2rem); line-height: 1.15; letter-spacing: -.015em; color: var(--green-deep); text-wrap: balance; outline: none; }
.pc-sub { margin: 10px 0 0; font-size: 15px; line-height: 1.6; color: #4d5a48; max-width: 46ch; }
.pc-content { margin-top: 22px; }

.pc-options { display: grid; gap: 10px; }
.pc-option {
  width: 100%; min-height: 62px; display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 14px 18px; border: 1.5px solid #dfe3d4; border-radius: 14px; background: #fff; color: var(--green-deep);
  font: 500 16px/1.4 var(--sans); text-align: left; cursor: pointer;
  transition: border-color .15s, background-color .15s, transform .15s;
  animation: pcRise .34s var(--ease) both; animation-delay: calc(60ms + var(--i, 0) * 45ms);
}
.pc-option:hover { border-color: var(--green); }
.pc-option:active { transform: scale(.985); }
.pc-option[aria-checked="true"] { border-color: var(--green); background: #eff3e4; }
.pc-option[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }
.pc-option[aria-disabled="true"]:hover { border-color: #dfe3d4; }
.pc-mark { flex: none; width: 24px; height: 24px; border: 2px solid #b8bfad; display: grid; place-items: center; color: var(--green-deep); transition: background-color .15s, border-color .15s; }
.pc-mark-radio { border-radius: 50%; }
.pc-mark-checkbox { border-radius: 6px; }
[aria-checked="true"] > .pc-mark { border-color: var(--green); background: var(--lime); }
.pc-mark b { width: 10px; height: 10px; border-radius: 50%; background: var(--green-deep); animation: pcMark .22s cubic-bezier(.3, 1.5, .6, 1) both; }
.pc-mark svg { animation: pcMark .22s cubic-bezier(.3, 1.5, .6, 1) both; }

.pc-flavors { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 10px; }
.pc-flavor { border: 0; background: none; padding: 0; text-align: center; cursor: pointer; color: var(--green-deep); min-width: 0; animation: pcRise .34s var(--ease) both; animation-delay: calc(40ms + var(--i, 0) * 30ms); }
.pc-flavor-art { position: relative; display: grid; place-items: center; height: 128px; border-radius: 14px; background: #eef1e6; box-shadow: inset 0 0 0 1.5px transparent; transition: box-shadow .15s, background-color .15s; }
.pc-flavor img { height: 112px; width: auto; transition: transform .3s var(--ease); }
.pc-flavor:hover img { transform: translateY(-3px); }
.pc-flavor[aria-checked="true"] .pc-flavor-art { background: #e3ecd0; box-shadow: inset 0 0 0 2.5px var(--green); }
.pc-flavor[aria-disabled="true"] { opacity: .42; cursor: not-allowed; }
.pc-flavor-name { display: block; margin-top: 7px; font-size: 13px; font-weight: 600; line-height: 1.3; }
.pc-tick { position: absolute; top: 7px; right: 7px; width: 24px; height: 24px; border-radius: 50%; background: var(--lime); color: var(--green-deep); display: grid; place-items: center; animation: pcMark .22s cubic-bezier(.3, 1.5, .6, 1) both; }
.is-static { animation: none !important; }

.pc-switch { margin: 18px 0 0; font-size: 14px; line-height: 1.5; color: #4d5a48; animation: pcRise .34s var(--ease) both; animation-delay: .4s; }
.pc-switch button { border: 0; background: none; padding: 0 2px; min-height: 44px; color: var(--green); font: 600 14px var(--sans); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.pc-switch button:hover { color: var(--green-deep); }
.pc-fields { display: grid; gap: 16px; }
.pc-field { display: grid; gap: 8px; }
.pc-field[hidden] { display: none; }
.pc-other { margin-top: 14px; animation: pcRise .24s var(--ease) both; }
.pc-field span { font-size: 15px; font-weight: 600; }
.pc-field small { font-weight: 400; color: #66705f; margin-left: 4px; font-size: 13px; }
.pc-field input, .pc-field textarea { width: 100%; max-width: 100%; border: 1.5px solid #dfe3d4; border-radius: 12px; background: #fff; color: var(--green-deep); font: 400 17px/1.5 var(--sans); padding: 13px 15px; min-height: 54px; }
.pc-field textarea { resize: vertical; min-height: 120px; }
.pc-field input:focus, .pc-field textarea:focus { outline: none; border-color: var(--green); box-shadow: 0 0 0 3px rgba(45, 75, 40, .15); }

.pc-summary { margin: 0; display: grid; gap: 0; border-top: 1px solid #e6eadb; }
.pc-summary div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 14px; padding: 13px 0; border-bottom: 1px solid #e6eadb; animation: pcRise .3s var(--ease) both; }
.pc-summary dt { font-size: 13px; color: #66705f; }
.pc-summary dd { margin: 0; grid-column: 1; font-size: 16px; font-weight: 600; line-height: 1.45; overflow-wrap: anywhere; }
.pc-edit { grid-column: 2; grid-row: 1 / span 2; align-self: center; border: 0; background: none; color: var(--green); text-decoration: underline; text-underline-offset: 4px; font: 500 14px var(--sans); min-height: 44px; cursor: pointer; padding: 0 2px; }

.pc-foot { flex: none; padding: 12px max(20px, env(safe-area-inset-left, 0px)) calc(14px + env(safe-area-inset-bottom, 0px)) max(20px, env(safe-area-inset-right, 0px)); border-top: 1px solid #e6eadb; background: #fffdf8; }
.pc-foot[hidden] { display: none; }
.pc-foot-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.pc-counter { font-size: 14px; color: #4d5a48; }
.pc-next, .pc-send { display: inline-flex; align-items: center; justify-content: center; gap: 10px; border: 0; border-radius: 999px; min-height: 52px; padding: 0 22px 0 26px; font: 700 16px var(--sans); cursor: pointer; transition: background-color .15s, transform .15s, color .15s; }
.pc-next { background: var(--green); color: var(--cream); margin-left: auto; }
.pc-next:hover { background: var(--green-deep); }
.pc-next:active { transform: scale(.97); }
.pc-next:disabled { background: #e6eadb; color: #6f7a68; cursor: not-allowed; transform: none; }
.pc-send { width: 100%; min-height: 56px; background: var(--green-deep); color: var(--cream); text-decoration: none; padding: 0 24px; }
.pc-send svg { color: var(--lime); }
.pc-send:hover { background: var(--green); }
.pc-send:active { transform: scale(.98); }
.pc-foot-note { margin: 9px 0 0; text-align: center; font-size: 13px; color: #4d5a48; }
.pc :focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }

.pc-in-next { animation: pcNext .3s var(--ease) both; }
.pc-in-back { animation: pcBack .3s var(--ease) both; }

.pc-toast { position: fixed; left: 50%; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); z-index: 210; margin: 0; max-width: min(92vw, 440px); padding: 14px 20px; border-radius: 14px; background: var(--green-deep); color: var(--cream); font: 500 15px/1.5 var(--sans); text-align: center; box-shadow: 0 18px 40px -18px rgba(0, 0, 0, .5); opacity: 0; pointer-events: none; transform: translate(-50%, 16px); transition: opacity .3s, transform .3s var(--ease); }
.pc-toast.is-on { opacity: 1; transform: translate(-50%, 0); }

@keyframes pcVeil { from { opacity: 0; } to { opacity: 1; } }
@keyframes pcSheet { from { opacity: 0; transform: translateY(32px); } to { opacity: 1; transform: none; } }
@keyframes pcNext { from { opacity: 0; transform: translateX(22px); } to { opacity: 1; transform: none; } }
@keyframes pcBack { from { opacity: 0; transform: translateX(-22px); } to { opacity: 1; transform: none; } }
@keyframes pcRise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes pcMark { from { transform: scale(.3); } to { transform: scale(1); } }

@media (min-width: 640px) {
  .pc { align-items: flex-start; padding: max(24px, 7dvh) 24px 24px; }
  .pc-sheet { max-width: 620px; border-radius: 22px; max-height: min(820px, calc(100dvh - 2 * max(24px, 7dvh))); box-shadow: 0 34px 90px -24px rgba(0, 0, 0, .5); }
  .pc-top { padding: 0 18px; }
  .pc-body { padding: 4px 40px 30px; }
  .pc-foot { padding: 14px 40px 18px; }
  .pc-flavors { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .pc-step h2 { font-size: 2rem; }
}
@media (prefers-reduced-motion: reduce) {
  .pc *, .pc-veil, .pc-sheet, .pc-toast { animation: none !important; transition: none !important; }
}