/* ============================================================
   PERFUMA FLORIPA — CSS Customizado · Versão 2 · Rose Parchment
   ============================================================
   ONDE COLAR: Painel LI → Aparência → Personalizar → CSS Customizado
   AÇÃO: Apague o CSS antigo, cole este inteiro e clique Salvar
   ============================================================ */

/* ----------------------------------------------------------
   1. VARIÁVEIS DA MARCA
   ---------------------------------------------------------- */
:root {
  --burgundy:         #800020;
  --burgundy-dark:    #5a0016;
  --burgundy-mid:     #9a0028;
  --tiger-lily:       #db8780;
  --tiger-lily-lt:    #f0c4be;
  --cream:            #f5ebe4;  /* Rose Parchment — aprovado pelo cliente */
  --cream-dark:       #ead5ca;
  --white:            #fdf8f5;  /* quase-branco quente */
  --text-dark:        #2c1810;
  --text-mid:         #5a3e38;
  --text-light:       #9e7a74;
  --border:           #ddc8b8;
  --shadow-sm:        0 2px 12px rgba(128,0,32,.07);
  --shadow-md:        0 4px 24px rgba(128,0,32,.11);
  --shadow-lg:        0 8px 48px rgba(128,0,32,.16);
  --r-sm:             8px;
  --r-md:             14px;
  --r-lg:             28px;
  --tr:               all .28s cubic-bezier(.4,0,.2,1);
  --serif:            'Cormorant Garamond', Georgia, serif;
  --sans:             'Inter', Arial, sans-serif;
}

/* ----------------------------------------------------------
   2. BASE
   ---------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  font-family: var(--serif);
  background-color: var(--cream);
  color: var(--text-dark);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.75;
  letter-spacing: 0.01em;
}

img { max-width: 100%; display: block; }
a { text-decoration: none; color: inherit; }

/* ----------------------------------------------------------
   3. TIPOGRAFIA
   ---------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--serif);
  color: var(--burgundy);
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1.2;
}

/* ----------------------------------------------------------
   4. HEADER / NAVEGAÇÃO
   ---------------------------------------------------------- */
.header, .topo, header, .store-header {
  background: var(--white) !important;
  border-bottom: 1px solid var(--border);
  box-shadow: var(--shadow-sm);
}

/* Logo */
.logo img, .store-logo img { max-height: 56px; }

/* Nav principal */
.nav-principal, .menu-principal, nav.menu {
  background: var(--burgundy) !important;
  border-bottom: 3px solid var(--burgundy-dark);
}
.nav-principal a, .menu-principal a, nav.menu a {
  color: rgba(255,255,255,.9) !important;
  font-size: 13.5px;
  font-weight: 500;
  padding: 12px 16px !important;
  transition: var(--tr);
}
.nav-principal a:hover, .menu-principal a:hover, nav.menu a:hover {
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
}

/* Search */
.busca input, .search input, input[type="search"] {
  border: 1.5px solid var(--border) !important;
  border-radius: 50px !important;
  padding: 10px 18px !important;
  background: var(--cream) !important;
  font-family: var(--serif);
  font-size: 15px;
  transition: var(--tr);
}
.busca input:focus, input[type="search"]:focus {
  border-color: var(--tiger-lily) !important;
  box-shadow: 0 0 0 3px rgba(219,135,128,.15) !important;
  outline: none !important;
}

/* ----------------------------------------------------------
   5. BOTÕES
   ---------------------------------------------------------- */
.btn-comprar, .btn-adicionar, .btn-carrinho,
.buy-btn, .add-to-cart, button.comprar,
input[type="submit"], .btn-primary-loja {
  background: var(--burgundy) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 50px !important;
  padding: 13px 32px !important;
  font-family: var(--serif);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: .02em;
  cursor: pointer;
  transition: var(--tr);
}
.btn-comprar:hover, .btn-adicionar:hover,
.btn-carrinho:hover, .buy-btn:hover {
  background: var(--burgundy-dark) !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 24px rgba(128,0,32,.35);
}

/* ----------------------------------------------------------
   6. CARDS DE PRODUTO
   ---------------------------------------------------------- */
.produto, .product-item, .produto-item,
.vitrine-item, .item-produto {
  background: var(--white) !important;
  border-radius: var(--r-md) !important;
  border: 1px solid var(--border) !important;
  overflow: hidden;
  transition: var(--tr);
}
.produto:hover, .product-item:hover,
.vitrine-item:hover, .item-produto:hover {
  transform: translateY(-5px) !important;
  box-shadow: var(--shadow-lg) !important;
  border-color: var(--tiger-lily-lt) !important;
}

/* Nome do produto */
.produto .nome, .product-item .name,
.vitrine-item .produto-nome, .nome-produto {
  font-family: var(--serif) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  color: var(--text-dark) !important;
}

/* Preço */
.preco, .price, .produto .valor,
.preco-por, .price-value {
  font-family: var(--serif) !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  color: var(--burgundy) !important;
}
.preco-de, .price-old, .preco-antes {
  font-size: 14px !important;
  color: var(--text-light) !important;
  text-decoration: line-through !important;
}

/* Badges */
.badge-novo, .tag-novo, .novo-badge {
  background: var(--burgundy) !important;
  color: #fff !important;
  border-radius: 20px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 3px 10px !important;
  letter-spacing: .06em;
}
.badge-oferta, .tag-desconto, .desconto-badge {
  background: #e53e3e !important;
  color: #fff !important;
  border-radius: 20px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 3px 10px !important;
}

/* ----------------------------------------------------------
   7. SEÇÕES DA HOMEPAGE
   ---------------------------------------------------------- */
.vitrine, .secao-produtos, .section-produtos {
  background: var(--cream) !important;
  padding: 48px 0 !important;
}
.vitrine:nth-child(even),
.secao-produtos:nth-child(even) {
  background: var(--white) !important;
}

/* Títulos de seção */
.vitrine h2, .secao h2, .section-titulo,
.titulo-secao, .vitrine-titulo {
  font-family: var(--serif) !important;
  font-size: 36px !important;
  font-weight: 600 !important;
  color: var(--burgundy) !important;
}

/* ----------------------------------------------------------
   8. BREADCRUMB
   ---------------------------------------------------------- */
.breadcrumb, .trilha-navegacao, nav.breadcrumb {
  font-size: 13px;
  color: var(--text-light);
}
.breadcrumb a:hover { color: var(--burgundy); }

/* ----------------------------------------------------------
   9. PAGINAÇÃO
   ---------------------------------------------------------- */
.paginacao a, .pagination a {
  border: 1.5px solid var(--border) !important;
  border-radius: var(--r-sm) !important;
  color: var(--text-mid) !important;
  transition: var(--tr);
}
.paginacao a:hover, .pagination a:hover,
.paginacao .atual, .pagination .active {
  background: var(--burgundy) !important;
  border-color: var(--burgundy) !important;
  color: #fff !important;
}

/* ----------------------------------------------------------
   10. CARRINHO / CHECKOUT
   ---------------------------------------------------------- */
.carrinho, .cart-page { background: var(--cream) !important; }
.carrinho-item, .cart-item {
  background: var(--white) !important;
  border-radius: var(--r-md) !important;
  border: 1px solid var(--border) !important;
  margin-bottom: 12px;
}

/* Total */
.carrinho-total, .cart-total, .resumo-total {
  font-family: var(--serif) !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  color: var(--burgundy) !important;
}

/* ----------------------------------------------------------
   11. PÁGINA DE PRODUTO
   ---------------------------------------------------------- */
.produto-detalhe h1, .product-title {
  font-family: var(--serif) !important;
  font-size: clamp(28px, 4vw, 44px) !important;
  font-weight: 600 !important;
  color: var(--burgundy) !important;
}

/* Abas de descrição */
.abas-produto .aba, .product-tabs .tab {
  border-bottom: 2px solid transparent !important;
  color: var(--text-light) !important;
  transition: var(--tr);
  font-family: var(--serif);
}
.abas-produto .aba.ativa, .abas-produto .aba:hover,
.product-tabs .tab.active, .product-tabs .tab:hover {
  border-bottom-color: var(--burgundy) !important;
  color: var(--burgundy) !important;
}

/* Quantidade */
input[name="quantidade"], input.qty {
  border: 1.5px solid var(--border) !important;
  border-radius: var(--r-sm) !important;
  text-align: center !important;
  font-family: var(--serif);
  font-size: 18px;
}

/* ----------------------------------------------------------
   12. FOOTER
   ---------------------------------------------------------- */
footer, .rodape, .footer {
  background: var(--text-dark) !important;
  color: rgba(255,255,255,.65) !important;
}
footer a, .rodape a, .footer a {
  color: rgba(255,255,255,.55) !important;
  transition: var(--tr);
}
footer a:hover, .rodape a:hover, .footer a:hover {
  color: var(--tiger-lily-lt) !important;
}
footer h3, footer h4, .rodape h3, .rodape h4 {
  color: rgba(255,255,255,.9) !important;
  font-family: var(--serif);
  font-size: 13px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* ----------------------------------------------------------
   13. HERO SLIDER — classes dos banners customizados
   ---------------------------------------------------------- */
.pf-hero { position:relative; overflow:hidden; }
.pf-slider { position:relative; overflow:hidden; }
.pf-slide { display:none; position:relative; min-height:480px; align-items:center; }
.pf-slide--active { display:flex; animation:pfSlideIn .5s ease; }
@keyframes pfSlideIn { from{opacity:0;transform:translateX(30px)} to{opacity:1;transform:translateX(0)} }
.pf-slide__bg { position:absolute; inset:0; z-index:0; }
.pf-slide__inner { position:relative; z-index:1; display:grid; grid-template-columns:1fr 340px; gap:40px; align-items:center; padding:60px 24px; max-width:1260px; margin:0 auto; width:100%; }
.pf-slide__tag { font-size:11px; letter-spacing:.15em; text-transform:uppercase; color:var(--burgundy); font-weight:600; margin-bottom:12px; }
.pf-slide__title { font-family:var(--serif); font-size:clamp(36px,5vw,60px); font-weight:600; color:var(--text-dark); line-height:1.1; margin-bottom:16px; }
.pf-slide__desc { font-size:15px; color:var(--text-mid); line-height:1.75; margin-bottom:28px; max-width:460px; }
.pf-slide__cta { display:flex; gap:14px; flex-wrap:wrap; }
.pf-btn { display:inline-flex; align-items:center; justify-content:center; border-radius:50px; font-weight:600; font-size:14px; cursor:pointer; transition:all .28s cubic-bezier(.4,0,.2,1); text-decoration:none; border:none; }
.pf-btn--primary { background:var(--burgundy); color:#fff; padding:13px 32px; }
.pf-btn--primary:hover { background:var(--burgundy-dark); transform:translateY(-2px); box-shadow:0 6px 24px rgba(128,0,32,.35); }
.pf-btn--ghost { background:transparent; color:var(--burgundy); padding:12px 28px; border:2px solid var(--burgundy); }
.pf-btn--ghost:hover { background:var(--burgundy); color:#fff; transform:translateY(-2px); }
.pf-btn--sm { padding:9px 20px; font-size:13px; }
.pf-slide__product-card { background:var(--white); border-radius:20px; padding:24px; text-align:center; box-shadow:var(--shadow-md); border:1px solid var(--border); position:relative; }
.pf-slide__badge { position:absolute; top:12px; left:12px; background:var(--burgundy); color:#fff; padding:4px 12px; border-radius:20px; font-size:11px; font-weight:700; letter-spacing:.06em; }
.pf-slide__badge--gold { background:#b8860b; }
.pf-slide__badge--sale { background:#e53e3e; }
.pf-slide__product-img { font-size:72px; height:160px; display:flex; align-items:center; justify-content:center; margin-bottom:12px; }
.pf-slide__product-brand { font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-light); margin-bottom:4px; }
.pf-slide__product-name { font-family:var(--serif); font-size:17px; font-weight:600; color:var(--text-dark); margin-bottom:10px; }
.pf-price-old { font-size:13px; color:var(--text-light); text-decoration:line-through; margin-right:8px; }
.pf-price-current { font-family:var(--serif); font-size:26px; font-weight:700; color:var(--burgundy); }
.pf-slide__product-price { margin-bottom:14px; }
.pf-slider__arrow { position:absolute; top:50%; transform:translateY(-50%); width:42px; height:42px; border-radius:50%; border:2px solid var(--border); background:var(--white); color:var(--burgundy); font-size:18px; cursor:pointer; z-index:3; transition:all .28s ease; display:flex; align-items:center; justify-content:center; }
.pf-slider__arrow:hover { background:var(--burgundy); color:#fff; border-color:var(--burgundy); }
.pf-slider__arrow--prev { left:16px; }
.pf-slider__arrow--next { right:16px; }
.pf-slider__dots { position:absolute; bottom:16px; left:50%; transform:translateX(-50%); display:flex; gap:8px; z-index:3; }
.pf-slider__dot { width:8px; height:8px; border-radius:50%; background:var(--border); border:none; cursor:pointer; transition:all .28s ease; padding:0; }
.pf-slider__dot--active { background:var(--burgundy); width:24px; border-radius:4px; }

/* ----------------------------------------------------------
   14. PROMO BAR & COUNTDOWN
   ---------------------------------------------------------- */
.pf-promo-bar { background:var(--burgundy); color:#fff; padding:10px 0; position:relative; }
.pf-promo-bar__inner { max-width:1260px; margin:0 auto; padding:0 24px; display:flex; align-items:center; justify-content:center; gap:16px; }
.pf-promo-bar__text { font-size:13.5px; text-align:center; }
.pf-promo-bar__code { background:rgba(255,255,255,.2); padding:2px 10px; border-radius:4px; letter-spacing:.08em; }
.pf-countdown { font-weight:700; font-family:monospace; background:rgba(0,0,0,.25); padding:2px 8px; border-radius:4px; }
.pf-promo-bar__close { position:absolute; right:16px; top:50%; transform:translateY(-50%); background:none; border:none; color:rgba(255,255,255,.7); font-size:20px; cursor:pointer; line-height:1; padding:4px; }
.pf-promo-bar__close:hover { color:#fff; }

/* ----------------------------------------------------------
   15. BENEFITS BAR
   ---------------------------------------------------------- */
.pf-benefits { background:var(--white); border-bottom:1px solid var(--border); }
.pf-benefits__grid { max-width:1260px; margin:0 auto; padding:0 24px; display:grid; grid-template-columns:repeat(4,1fr); }
.pf-benefit { display:flex; align-items:center; gap:14px; padding:18px 20px; border-right:1px solid var(--border); transition:all .28s ease; }
.pf-benefit:last-child { border-right:none; }
.pf-benefit:hover { background:var(--cream); }
.pf-benefit__icon { font-size:22px; flex-shrink:0; }
.pf-benefit__text strong { display:block; font-size:13.5px; font-weight:600; color:var(--text-dark); }
.pf-benefit__text span { font-size:12px; color:var(--text-light); }

/* ----------------------------------------------------------
   16. SECTION HEADERS
   ---------------------------------------------------------- */
.pf-container { max-width:1260px; margin:0 auto; padding:0 24px; }
.pf-section-header { margin-bottom:40px; }
.pf-section-header--center { text-align:center; }
.pf-section-header__tag { font-size:11px; letter-spacing:.15em; text-transform:uppercase; color:var(--tiger-lily); font-weight:600; margin-bottom:8px; }
.pf-section-header__title { font-family:var(--serif); font-size:clamp(28px,4vw,44px); font-weight:600; color:var(--burgundy); line-height:1.2; margin-bottom:12px; }
.pf-section-header__desc { font-size:15px; color:var(--text-mid); }

/* ----------------------------------------------------------
   17. BRANDS
   ---------------------------------------------------------- */
.pf-brands { background:var(--cream); padding:64px 0; }
.pf-brands__grid { display:grid; grid-template-columns:repeat(6,1fr); gap:12px; margin-bottom:32px; }
.pf-brand-item { background:var(--white); border:1px solid var(--border); border-radius:var(--r-sm); padding:20px 12px; display:flex; align-items:center; justify-content:center; text-align:center; transition:all .28s ease; cursor:pointer; }
.pf-brand-item:hover { border-color:var(--tiger-lily); box-shadow:var(--shadow-md); transform:translateY(-3px); }
.pf-brand-item__name { font-family:var(--serif); font-size:15px; font-weight:600; color:var(--text-mid); letter-spacing:.04em; line-height:1.3; }
.pf-brand-item:hover .pf-brand-item__name { color:var(--burgundy); }
.pf-brands__cta { text-align:center; }

/* ----------------------------------------------------------
   18. REVIEWS / DEPOIMENTOS
   ---------------------------------------------------------- */
.pf-reviews { background:var(--white); padding:64px 0; }
.pf-reviews__summary { display:grid; grid-template-columns:200px 1fr; gap:48px; align-items:center; margin-bottom:48px; padding:32px; background:var(--cream); border-radius:var(--r-md); border:1px solid var(--border); }
.pf-reviews__score-number { font-family:var(--serif); font-size:64px; font-weight:700; color:var(--burgundy); line-height:1; }
.pf-reviews__stars { color:#f59e0b; font-size:22px; letter-spacing:2px; margin:4px 0 8px; }
.pf-reviews__score-label { font-size:13px; color:var(--text-light); margin-bottom:12px; }
.pf-reviews__bar-row { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.pf-reviews__bar-label { font-size:12px; color:var(--text-light); width:28px; text-align:right; flex-shrink:0; }
.pf-reviews__bar-track { flex:1; height:8px; background:var(--border); border-radius:4px; overflow:hidden; }
.pf-reviews__bar-fill { height:100%; background:linear-gradient(90deg,var(--tiger-lily),var(--burgundy)); border-radius:4px; transition:width .6s ease; }
.pf-reviews__bar-pct { font-size:12px; color:var(--text-light); width:32px; flex-shrink:0; }
.pf-reviews__google-btn { margin-top:12px; }
.pf-testimonials__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.pf-testimonial { background:var(--cream); border-radius:var(--r-md); padding:28px; border:1px solid var(--border); transition:all .28s ease; position:relative; }
.pf-testimonial:hover { box-shadow:var(--shadow-md); transform:translateY(-3px); border-color:var(--tiger-lily-lt); }
.pf-testimonial__stars { color:#f59e0b; font-size:18px; letter-spacing:2px; margin-bottom:12px; }
.pf-testimonial__text { font-size:14px; color:var(--text-mid); line-height:1.75; margin-bottom:20px; font-style:italic; }
.pf-testimonial__author { display:flex; align-items:center; gap:10px; }
.pf-testimonial__avatar { width:40px; height:40px; border-radius:50%; background:linear-gradient(135deg,var(--tiger-lily-lt),var(--cream-dark)); display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; color:var(--burgundy); flex-shrink:0; }
.pf-testimonial__name { font-size:14px; font-weight:600; color:var(--text-dark); display:block; }
.pf-testimonial__date { font-size:12px; color:var(--text-light); }
.pf-testimonial__google { width:28px; height:28px; border-radius:50%; background:var(--white); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; color:#4285f4; margin-left:auto; flex-shrink:0; }

/* ----------------------------------------------------------
   19. WHATSAPP FLOAT
   ---------------------------------------------------------- */
.pf-whatsapp { position:fixed; bottom:28px; right:28px; z-index:9999; display:flex; flex-direction:column; align-items:flex-end; gap:10px; }
.pf-whatsapp__tooltip { background:var(--white); color:var(--text-dark); border-radius:14px; padding:12px 16px; box-shadow:var(--shadow-lg); font-size:13px; max-width:220px; line-height:1.5; border:1px solid var(--tiger-lily-lt); opacity:0; pointer-events:none; transition:opacity .25s ease,transform .25s ease; transform:translateY(8px); }
.pf-whatsapp__tooltip--visible { opacity:1; pointer-events:auto; transform:translateY(0); }
.pf-whatsapp__tooltip strong { color:var(--burgundy); display:block; margin-bottom:3px; font-size:14px; }
.pf-whatsapp__tooltip span { color:var(--text-mid); }
.pf-whatsapp__btn { width:60px; height:60px; border-radius:50%; background:#25D366; display:flex; align-items:center; justify-content:center; text-decoration:none; box-shadow:0 4px 24px rgba(37,211,102,.45); position:relative; transition:all .28s ease; }
.pf-whatsapp__btn:hover { transform:scale(1.1); box-shadow:0 6px 32px rgba(37,211,102,.55); }
.pf-whatsapp__pulse { position:absolute; inset:-6px; border-radius:50%; border:2px solid rgba(37,211,102,.45); animation:pfPulse 2.2s ease infinite; }
@keyframes pfPulse { 0%{transform:scale(1);opacity:1} 70%{transform:scale(1.4);opacity:0} 100%{transform:scale(1.4);opacity:0} }

/* ----------------------------------------------------------
   20. SCROLL REVEAL
   ---------------------------------------------------------- */
.pf-reveal { opacity:0; transform:translateY(24px); transition:opacity .5s ease,transform .5s ease; }
.pf-revealed { opacity:1; transform:translateY(0); }

/* ----------------------------------------------------------
   21. RESPONSIVO
   ---------------------------------------------------------- */
@media (max-width: 860px) {
  .pf-slide__inner { grid-template-columns:1fr; }
  .pf-slide__visual { display:none; }
  .pf-slide { min-height:320px; }
  .pf-benefits__grid { grid-template-columns:repeat(2,1fr); }
  .pf-testimonials__grid { grid-template-columns:1fr; }
  .pf-brands__grid { grid-template-columns:repeat(3,1fr); }
  .pf-reviews__summary { grid-template-columns:1fr; gap:24px; }
}
@media (max-width: 540px) {
  .pf-slide { min-height:260px; }
  .pf-slide__title { font-size:28px; }
  .pf-benefits__grid { grid-template-columns:1fr; }
  .pf-brands__grid { grid-template-columns:repeat(2,1fr); }
  .pf-promo-bar__text { font-size:12px; }
}