:root {
  --radius-sm: 12px;
  --radius-md: 18px;
  --radius-lg: 24px;
  --shadow-xs: 0 5px 16px rgba(15, 23, 42, .06);
  --shadow-sm: 0 14px 34px rgba(15, 23, 42, .10);
  --shadow-md: 0 26px 70px rgba(15, 23, 42, .18);
}

body {
  background: #f4f6f8;
  font-feature-settings: "ss01", "cv02";
}

.top-strip {
  background: #f7b825;
  letter-spacing: .12em;
  padding-block: 8px;
}

.main-header {
  background: rgba(13, 16, 21, .94);
  border-bottom-color: rgba(255, 255, 255, .08);
}

.brand {
  letter-spacing: -.04em;
  font-style: normal;
}

.hero {
  background:
    radial-gradient(circle at 82% 22%, rgba(247, 184, 37, .26), transparent 28%),
    linear-gradient(145deg, #11151c 0%, #191f29 58%, #11151c 100%);
}

.hero::after {
  opacity: .35;
  filter: blur(18px);
}

.hero h1 {
  letter-spacing: -.045em;
}

.hero-tags span,
.hero-badge {
  background: rgba(255, 255, 255, .07);
  border-color: rgba(255, 255, 255, .15);
  backdrop-filter: blur(10px);
}

.search-wrap {
  border: 0;
  min-height: 58px;
  box-shadow: 0 14px 36px rgba(15, 23, 42, .14);
}

.category-pill {
  border: 1px solid rgba(148, 163, 184, .18);
  min-width: 82px;
  max-width: 82px;
  padding-top: 10px;
}

.category-pill__icon {
  position: relative;
  background: #f5f7fa !important;
  border: 1px solid #e7ebf0;
}

.category-pill__emoji {
  width: auto !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  transform: none !important;
  font-size: 21px;
  line-height: 1;
}

.category-pill:nth-child(3n) .category-pill__emoji {
  border: 0 !important;
  border-radius: 0 !important;
}

.category-pill:nth-child(4n) .category-pill__emoji {
  width: auto !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  transform: none !important;
}

.product-card,
.checkout-card,
.driver-card {
  border-color: rgba(148, 163, 184, .2);
  box-shadow: var(--shadow-xs);
}

.checkout-page {
  background:
    radial-gradient(circle at 100% 0, rgba(247, 184, 37, .09), transparent 24%),
    #f5f7f9;
}

.checkout-header {
  min-height: 64px;
  background: rgba(255, 255, 255, .9);
  border-bottom-color: rgba(148, 163, 184, .2);
}

.checkout-card {
  gap: 14px;
  padding: 17px;
}

.checkout-card h3 {
  font-size: 19px;
  letter-spacing: -.025em;
}

.card-kicker {
  color: #a36d00;
  letter-spacing: .13em;
  font-size: 10px;
  font-weight: 900;
}

.checkout-banner {
  color: #543900;
  background: #fff8e8;
  border-color: #f1d797;
  box-shadow: none;
}

.checkout-banner span {
  color: #936400;
}

.checkout-card input {
  background: #f8fafc;
  border-color: #dce3eb;
  border-radius: 12px;
  min-height: 48px;
}

.checkout-card input:focus {
  background: #fff;
  border-color: #d6a01d;
  box-shadow: 0 0 0 4px rgba(247, 184, 37, .14);
}

.cep-field {
  padding: 12px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 15px;
}

.cep-field input {
  background: #fff;
  font-weight: 750;
  letter-spacing: .06em;
}

.field-status {
  color: #08734a;
  font-size: 11px;
  font-weight: 700;
}

.field-status--loading {
  color: #9a6700;
}

.checkout-sticky {
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(16px);
}

.btn {
  border-radius: 13px;
  letter-spacing: -.01em;
}

.btn-green {
  background: linear-gradient(135deg, #0caf68, #087b4b);
}

.btn-gold {
  background: linear-gradient(135deg, #f9ca4d, #dea013);
}

.driver-card {
  text-align: left;
  padding: 18px;
}

.driver-title,
.driver-sub {
  text-align: left;
}

.driver-map {
  height: 250px;
  border: 0;
  border-radius: 19px;
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, .08);
  user-select: none;
  touch-action: none;
}

.driver-map iframe {
  width: 125%;
  height: 125%;
  pointer-events: none;
  user-select: none;
  transform: scale(.8);
  transform-origin: top left;
}

.driver-map::after {
  content: "";
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 0;
  left: 0;
  height: 38px;
  pointer-events: none;
  background: #f8fafc;
}

.map-attribution {
  position: absolute;
  z-index: 5;
  right: 4px;
  top: 50%;
  color: #536171;
  font-size: 8.5px;
  font-weight: 650;
  letter-spacing: .02em;
  line-height: 1;
  writing-mode: vertical-rl;
  transform: translateY(-50%) rotate(180deg);
  pointer-events: auto;
  text-decoration: none;
  opacity: .85;
  background: rgba(255, 255, 255, .88);
  border-radius: 999px;
  padding: 5px 3px;
}

.map-attribution:hover {
  color: #1f2937;
  opacity: 1;
}

.driver-map-pin {
  top: 50%;
  z-index: 4;
}

.driver-avatar-wrap {
  position: relative;
  z-index: 6;
}

.driver-map-pin__callout {
  border: 0;
  border-radius: 10px;
  padding: 7px 10px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .18);
}

.driver-map-pin__dot {
  position: relative;
  width: 17px;
  height: 17px;
  background: #d99d12;
  border: 4px solid #fff;
  box-shadow: 0 3px 9px rgba(0, 0, 0, .28);
}

.driver-map-pin__dot::before,
.driver-map-pin__dot::after {
  content: "";
  position: absolute;
  inset: 50% auto auto 50%;
  width: 18px;
  height: 18px;
  border: 2px solid rgba(217, 157, 18, .75);
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(.35);
  animation: location-pulse 2s cubic-bezier(.2, .7, .2, 1) infinite;
}

.driver-map-pin__dot::after {
  animation-delay: 1s;
}

@keyframes location-pulse {
  0% { opacity: .9; transform: translate(-50%, -50%) scale(.35); }
  75%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(3.5); }
}

.driver-address {
  background: #f8fafc;
  border: 1px solid #e3e8ef;
  border-radius: 14px;
  padding: 13px;
}

@media (max-width: 520px) {
  .checkout-content { padding: 14px 12px; }
  .split-2 { grid-template-columns: 1fr; }
  .driver-map { height: 225px; }
}

/* PIX: ação de copiar evidente e confortável no celular. */
.pix-code-row {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
}

.pix-copy-btn {
  width: 100% !important;
  min-height: 62px !important;
  justify-content: center !important;
  border-radius: 16px !important;
  font-size: 17px !important;
  font-weight: 900 !important;
  box-shadow: 0 12px 24px rgba(0, 168, 90, .22) !important;
}