/* =========================================================
   D'Pâtisserie — v3.3.0
   Refinamento visual final das áreas públicas.
   Aplicado somente a: Home, Checkout, Acompanhar e Quem Somos.
   Camada estritamente visual: nenhuma regra de negócio é alterada.
========================================================= */

:root{
  --public-bg:#fcfaf8;
  --public-bg-warm:#f8f1ec;
  --public-surface:#fffefd;
  --public-surface-soft:#fbf6f2;
  --public-brown:#70443c;
  --public-brown-dark:#50302b;
  --public-brown-deep:#39231f;
  --public-gold:#a77b3e;
  --public-gold-soft:#ead8bc;
  --public-text:#3c302d;
  --public-muted:#786b67;
  --public-border:#eaded7;
  --public-shadow:0 18px 52px rgba(72,45,40,.08);
  --public-shadow-soft:0 9px 26px rgba(72,45,40,.055);
  --public-radius:20px;
  --public-radius-lg:32px;
}

html{background:var(--public-bg)}
body{
  color:var(--public-text)!important;
  background:
    radial-gradient(circle at 12% 4%,rgba(167,123,62,.07),transparent 27%),
    radial-gradient(circle at 89% 7%,rgba(112,68,60,.045),transparent 24%),
    linear-gradient(180deg,#fffefd 0%,var(--public-bg) 50%,#faf6f2 100%)!important;
}
body::before{
  opacity:.16!important;
  filter:saturate(.45) brightness(1.12);
}

/* ===== TOPO: o mesmo padrão elegante da página inicial ===== */
.topbar,.site-header{
  min-height:82px!important;
  background:rgba(255,255,255,.965)!important;
  border-bottom:1px solid rgba(112,68,60,.10)!important;
  box-shadow:0 8px 28px rgba(62,38,34,.045)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
}
.topbar-content,.topbar__content,.site-header__content{
  width:min(1240px,calc(100% - 40px))!important;
  min-height:82px!important;
  margin-inline:auto!important;
}
.brand-logo,.brand__logo{
  width:58px!important;
  height:58px!important;
  border:1px solid rgba(167,123,62,.24)!important;
  box-shadow:0 8px 24px rgba(80,48,43,.10)!important;
}
.brand-name,.brand__name{
  color:var(--public-brown)!important;
  font-family:"Playfair Display",Georgia,serif!important;
  font-weight:700!important;
}
.brand-subtitle,.brand__subtitle{
  color:#7f6b65!important;
  font-weight:600!important;
  letter-spacing:.08em!important;
}

/* ===== BOTÕES: contraste coerente em qualquer fundo ===== */
.header-button,.topbar-button,.hero-button,.button,.back-link,.search-button,
.confirm-button,.map-action-btn,.copy-btn{
  min-height:44px!important;
  border-radius:999px!important;
  font-weight:700!important;
  letter-spacing:.005em!important;
}
.header-button.primary,.topbar-button.primary,.hero-button.primary,.button.primary,
.search-button,.confirm-button,.map-action-btn--primary{
  background:linear-gradient(135deg,var(--public-brown),var(--public-brown-dark))!important;
  border:1px solid transparent!important;
  color:#fff!important;
  box-shadow:0 10px 24px rgba(80,48,43,.16)!important;
}
.header-button.primary:hover,.topbar-button.primary:hover,.hero-button.primary:hover,
.button.primary:hover,.search-button:hover,.confirm-button:hover,.map-action-btn--primary:hover{
  background:linear-gradient(135deg,var(--public-brown-dark),var(--public-brown-deep))!important;
  color:#fff!important;
}
.header-button:not(.primary),.topbar-button:not(.primary),.hero-button:not(.primary),
.button:not(.primary),.back-link,.map-action-btn:not(.map-action-btn--primary),.copy-btn{
  background:#fff!important;
  border:1px solid var(--public-border)!important;
  color:var(--public-brown-dark)!important;
  box-shadow:0 6px 18px rgba(72,45,40,.045)!important;
}
.header-button:not(.primary) *, .topbar-button:not(.primary) *,
.hero-button:not(.primary) *, .button:not(.primary) *, .back-link *,
.map-action-btn:not(.map-action-btn--primary) *, .copy-btn *{
  color:inherit!important;
}
.header-button:not(.primary):hover,.topbar-button:not(.primary):hover,
.hero-button:not(.primary):hover,.button:not(.primary):hover,.back-link:hover,
.map-action-btn:not(.map-action-btn--primary):hover,.copy-btn:hover{
  background:#fffaf6!important;
  border-color:rgba(167,123,62,.48)!important;
  color:var(--public-brown-deep)!important;
}

/* Regra definitiva: botão claro sempre recebe texto escuro. */
.dark-section .button:not(.primary),.section-dark .button:not(.primary),
.cta__card .button:not(.primary),.cta-card .button:not(.primary),
.order-header .button:not(.primary),.experience-block .button:not(.primary),
.story-year .button:not(.primary){
  background:#fff!important;
  color:var(--public-brown-dark)!important;
  border-color:rgba(255,255,255,.52)!important;
}

/* ===== RITMO, TÍTULOS E CARDS ===== */
h1,h2,h3,.hero-title,.hero__title,.section-heading h2,.card-heading h2{
  color:var(--public-brown-dark);
}
.hero-eyebrow,.hero__eyebrow,.section-eyebrow,.checkout-hero__eyebrow,.order-kicker{
  color:#8d6837!important;
  background:rgba(245,236,223,.82)!important;
  border:1px solid rgba(167,123,62,.20)!important;
  border-radius:999px!important;
}
.hero-description,.hero__description,.section-heading p,.checkout-message,
.privacy-note,.secure-note{color:var(--public-muted)!important}

.hero-card,.hero__card,.checkout-card,.search-card,.order-card,.content-card,
.value-card,.flavor-card,.feature-card,.dream-card,.promise-card,.message-card,
.benefit-card,.delivery-map-panel,.summary-box,.payment-option{
  background:rgba(255,254,253,.97)!important;
  border:1px solid var(--public-border)!important;
  box-shadow:var(--public-shadow-soft)!important;
}
.checkout-card,.search-card,.order-card,.content-card,.value-card,.flavor-card,
.feature-card,.dream-card,.promise-card,.message-card,.benefit-card{
  border-radius:var(--public-radius)!important;
}
.hero-card,.hero__card{
  border-radius:var(--public-radius-lg)!important;
  box-shadow:var(--public-shadow)!important;
}

/* ===== HOME ===== */
.hero-header{padding-top:22px!important}
.hero-card{
  background:
    radial-gradient(circle at 96% 8%,rgba(167,123,62,.10),transparent 27%),
    linear-gradient(135deg,#fffefd 0%,#fbf3ee 100%)!important;
}
.hero-title{color:#684039!important}
.hero-logo-frame{
  background:rgba(255,255,255,.76)!important;
  border:18px solid rgba(255,255,255,.78)!important;
  box-shadow:0 24px 58px rgba(80,48,43,.13)!important;
}
.status-badge,.hero-feature{
  background:rgba(255,255,255,.78)!important;
  border:1px solid rgba(112,68,60,.10)!important;
  color:var(--public-text)!important;
}
.menu-intro,.benefits-section{color:var(--public-text)}
.benefit-icon{
  background:#f5eae4!important;
  color:var(--public-brown)!important;
}
.floating-track{
  background:#fff!important;
  color:var(--public-brown)!important;
  border:1px solid var(--public-border)!important;
}
.floating-cart{
  background:linear-gradient(135deg,var(--public-gold),#8f6935)!important;
  color:#fff!important;
}
.cart-header{
  background:linear-gradient(135deg,var(--public-brown),var(--public-brown-dark))!important;
}

/* ===== CHECKOUT ===== */
.page-container{width:min(1240px,calc(100% - 36px))!important}
.checkout-hero{
  background:linear-gradient(135deg,#fffefd 0%,#faf1eb 100%)!important;
  border:1px solid var(--public-border)!important;
  box-shadow:var(--public-shadow-soft)!important;
}
.checkout-hero h1{color:var(--public-brown-dark)!important}
.card-heading__icon,.field-icon{
  background:#f4e7e1!important;
  color:var(--public-brown)!important;
}
.form-input,.form-select,.form-textarea{
  background:#fff!important;
  border-color:#e8dbd4!important;
  color:var(--public-text)!important;
}
.form-input:focus,.form-select:focus,.form-textarea:focus{
  border-color:var(--public-gold)!important;
  box-shadow:0 0 0 3px rgba(167,123,62,.12)!important;
}
.checkout-progress{
  background:rgba(255,255,255,.78)!important;
  border:1px solid var(--public-border)!important;
}
.progress-step__number{
  background:#f1e5df!important;
  color:var(--public-brown)!important;
}
.progress-step.active .progress-step__number{
  background:var(--public-brown)!important;
  color:#fff!important;
}
.payment-option:hover,.delivery-choice:hover{
  border-color:rgba(167,123,62,.38)!important;
  background:#fffaf6!important;
}
.payment-option.active,.delivery-choice.active{
  border-color:var(--public-gold)!important;
  background:#fffaf4!important;
}
.pix-box,.delivery-notice,.secure-note{
  background:#fbf5f0!important;
  border-color:#e8d8ce!important;
}
.summary-box{background:#fff!important}
.summary-line.total{color:var(--public-brown-dark)!important}

/* ===== ACOMPANHAR PEDIDO ===== */
.page-shell{background:transparent!important}
.main-content{width:min(1120px,calc(100% - 36px))!important}
body.dp-track .hero{
  background:linear-gradient(135deg,#fffefd 0%,#faf1eb 100%)!important;
  border:1px solid var(--public-border)!important;
  box-shadow:var(--public-shadow-soft)!important;
}
.hero__title{color:var(--public-brown-dark)!important}
.search-card{background:#fff!important}
.order-header{
  background:linear-gradient(135deg,var(--public-brown),var(--public-brown-dark))!important;
  color:#fff!important;
}
.order-header *{color:#fff!important}
.section-heading__icon,.card-heading__icon,.payment-panel__icon{
  background:#f4e7e1!important;
  color:var(--public-brown)!important;
}
.address-box,.payment-panel,.order-notes,.summary-list{
  background:#fbf6f2!important;
  border-color:#eadbd3!important;
}
.timeline-step__circle{background:#fff!important;color:var(--public-brown)!important}
.timeline-step.active .timeline-step__circle,
.timeline-step.completed .timeline-step__circle{
  background:var(--public-brown)!important;
  color:#fff!important;
}

/* ===== QUEM SOMOS ===== */
.hero__card{
  background:
    radial-gradient(circle at 94% 4%,rgba(167,123,62,.10),transparent 28%),
    linear-gradient(135deg,#fffefd 0%,#faf1eb 100%)!important;
}
.hero__title{color:#684039!important}
.hero__quote,.story-highlight,.portfolio-closing{
  background:#f7eee8!important;
  border-color:#e7d7cd!important;
  color:var(--public-brown-dark)!important;
}
.story-year,.experience-block{
  background:linear-gradient(135deg,var(--public-brown),var(--public-brown-dark))!important;
  color:#fff!important;
}
.story-year *,.experience-block *{color:#fff!important}
.value-icon,.feature-icon,.dream-number{
  background:#f3e5de!important;
  color:var(--public-brown)!important;
}
.flavor-label,.founder-role{
  background:#f7eee8!important;
  border-color:#e5d2c7!important;
  color:var(--public-brown)!important;
}
.cta__card{
  background:linear-gradient(135deg,var(--public-brown),var(--public-brown-dark))!important;
  color:#fff!important;
}
.cta__card h2,.cta__card h3,.cta__card p,.cta__card span{color:#fff!important}
.cta__card .button.secondary{
  background:#fff!important;
  color:var(--public-brown-dark)!important;
}

/* ===== RODAPÉ: consistente nas quatro páginas ===== */
.dp-footer{
  background:linear-gradient(135deg,#4c2f2a 0%,#5b3731 58%,#402722 100%)!important;
  border-top:1px solid rgba(167,123,62,.34)!important;
}
.dp-footer,.dp-footer *{color:rgba(255,255,255,.78)}
.dp-footer__brand,.dp-footer__title{color:#fff!important}
.dp-footer__whatsapp,.dp-footer__instagram,.dp-footer__links a{
  color:rgba(255,255,255,.76)!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.dp-footer__whatsapp:hover,.dp-footer__instagram:hover,.dp-footer__links a:hover{
  color:var(--public-gold-soft)!important;
}

@media(max-width:760px){
  .topbar,.site-header,.topbar-content,.topbar__content,.site-header__content{min-height:72px!important}
  .topbar-content,.topbar__content,.site-header__content{width:calc(100% - 24px)!important}
  .brand-logo,.brand__logo{width:50px!important;height:50px!important}
  .hero-card,.hero__card{border-radius:24px!important}
  .page-container,.main-content{width:calc(100% - 24px)!important}
}

@media(max-width:480px){
  .hero-button,.button,.search-button,.confirm-button{width:100%!important;justify-content:center!important}
  .header-button,.topbar-button{min-height:40px!important}
  .hero-card,.hero__card,.checkout-card,.search-card,.order-card,.content-card{border-radius:18px!important}
}


/* =========================================================
   D'Pâtisserie v3.3.2 — Catálogo sem imagem e carrinho
========================================================= */
.product-card .product-media{
  width:100%;
  height:222px;
  flex:0 0 222px;
  overflow:hidden;
  border-radius:18px;
  background:#f8f1ec;
}
.product-card .product-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:0;
}
.product-media--placeholder{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:#8a6259;
  border:1px solid rgba(112,68,60,.08);
  background:
    radial-gradient(circle at 78% 20%,rgba(167,123,62,.16),transparent 31%),
    radial-gradient(circle at 20% 86%,rgba(112,68,60,.10),transparent 33%),
    linear-gradient(145deg,#fffdfb 0%,#f5e9e2 100%)!important;
}
.product-media--placeholder::before{
  content:"";
  position:absolute;
  inset:14px;
  border:1px solid rgba(167,123,62,.22);
  border-radius:14px;
  pointer-events:none;
}
.product-placeholder__monogram{
  position:relative;
  z-index:1;
  font-family:"Playfair Display",Georgia,serif;
  font-size:2rem;
  font-weight:700;
  line-height:1;
  color:#a77b3e;
}
.product-placeholder__brand{
  position:relative;
  z-index:1;
  font-family:"Playfair Display",Georgia,serif;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#755048;
}
.product-card__content{
  min-height:194px;
  display:flex;
  flex:1;
  flex-direction:column;
}
.product-card__content .product-price{margin-top:auto}
.product-card--no-image::before{
  background:rgba(86,52,47,.84);
}

/* O botão claro do cabeçalho precisa ter ícone escuro e visível. */
.cart-header button{
  background:#fff!important;
  color:#56342f!important;
  border-color:rgba(255,255,255,.64)!important;
  box-shadow:0 7px 20px rgba(40,24,21,.16)!important;
  font-size:1.15rem!important;
  line-height:1!important;
}
.cart-header button:hover{
  background:#f9f1ec!important;
  color:#422824!important;
  border-color:#ead7ca!important;
}
.cart-header button:focus-visible{
  outline:3px solid rgba(255,255,255,.35)!important;
  outline-offset:3px;
}

@media(max-width:760px){
  .product-card .product-media{height:205px;flex-basis:205px}
}
