@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Instrument+Serif:ital@0;1&display=swap');

/* ============================================================================
   Peplabs — folha de estilo da loja
   ========================================================================= */

:root{
  --ink:#0E1520;          /* texto principal */
  --ink-2:#3D4A5C;        /* texto secundário */
  --mut:#6B7A8D;          /* apoio */
  --line:#E4E9EF;
  --line-2:#F0F3F7;
  --bg:#FBFCFD;
  --card:#FFFFFF;
  --acc:#0F8C8C;          /* verde-petróleo da marca */
  --acc-d:#0A6F6F;
  --acc-l:#E6F4F4;
  --dark:#0B121C;
  --dark-2:#121C29;
  --warn:#B4232A;
  --gold:#B8863B;
  --r:14px;
  --shadow:0 1px 2px rgba(14,21,32,.05), 0 8px 24px rgba(14,21,32,.06);
  --shadow-h:0 6px 12px rgba(14,21,32,.07), 0 20px 44px rgba(14,21,32,.11);
}

body{
  background:var(--bg); color:var(--ink);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  font-size:16px; line-height:1.65; letter-spacing:-.003em;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5{ font-family:'Inter',sans-serif; color:var(--ink); letter-spacing:-.022em; font-weight:700; }
a{ text-decoration:none; }
.ast-container,.site-content .ast-container{ max-width:1280px; }

/* ---------------------------------------------------------------- topbar -- */
.dp-topbar{ background:var(--dark); color:#C8D6DF; font-size:.79rem; letter-spacing:.02em; }
.dp-topbar-in{
  max-width:1280px; margin:0 auto; padding:9px 24px;
  display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap;
}
.dp-tb-item{ white-space:nowrap; }
.dp-tb-sep{ color:var(--acc); }

/* ------------------------------------------------------------- cabeçalho -- */
.ast-primary-header-bar,.site-header{
  background:#fff !important; border-bottom:1px solid var(--line) !important;
}
.main-header-menu > .menu-item > .menu-link{
  font-weight:600; font-size:.94rem; color:var(--ink) !important; letter-spacing:-.01em;
}
.main-header-menu > .menu-item > .menu-link:hover{ color:var(--acc) !important; }
.main-header-menu .sub-menu{
  border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow);
  padding:8px; overflow:hidden;
}
.main-header-menu .sub-menu .menu-link{ border-radius:8px; font-size:.9rem; padding:9px 12px !important; }
.main-header-menu .sub-menu .menu-item:hover > .menu-link{ background:var(--acc-l); color:var(--acc-d) !important; }
.custom-logo-link img{ max-height:50px; width:auto; }
.site-header .ast-site-identity .site-title{ display:none !important; }

/* ícones utilitários */
.dp-util{ display:flex; align-items:center; gap:2px; margin-left:14px; }
.dp-util-btn{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:10px; color:var(--ink);
  background:transparent; border:0; cursor:pointer; transition:background .15s,color .15s;
}
.dp-util-btn:hover{ background:var(--acc-l); color:var(--acc-d); }
.dp-cart-n{
  position:absolute; top:4px; right:3px; min-width:17px; height:17px; padding:0 4px;
  background:var(--acc); color:#fff; font-size:.66rem; font-weight:800;
  border-radius:9px; display:flex; align-items:center; justify-content:center;
}
.dp-search-panel{
  position:absolute; top:100%; right:0; left:0; z-index:60;
  background:#fff; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  padding:22px 24px; box-shadow:var(--shadow);
}
.dp-search-panel form{ max-width:720px; margin:0 auto; display:flex; gap:10px; }
.dp-search-panel input[type=search]{
  flex:1; padding:14px 18px; border:1px solid var(--line); border-radius:10px;
  font-size:1rem; background:var(--bg);
}
.dp-search-panel input[type=search]:focus{ outline:0; border-color:var(--acc); background:#fff; }
.dp-search-panel button{
  padding:14px 26px; background:var(--ink); color:#fff; border:0; border-radius:10px;
  font-weight:600; cursor:pointer;
}
.dp-search-panel button:hover{ background:var(--acc-d); }
.dp-search-hint{ max-width:720px; margin:10px auto 0; font-size:.8rem; color:var(--mut); }

/* ------------------------------------------------------------------ hero -- */
.dp-hero{
  position:relative; overflow:hidden; border-radius:22px; margin:26px auto 52px;
  padding:96px 60px 92px;
  background:
    radial-gradient(1000px 460px at 82% 12%, rgba(15,140,140,.42), transparent 62%),
    linear-gradient(142deg,#0B121C 0%,#0E2029 52%,#0C3333 100%);
  color:#fff;
}
.dp-hero:before{
  content:""; position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size:46px 46px; mask-image:radial-gradient(circle at 70% 30%, #000, transparent 72%);
}
.dp-hero > *{ position:relative; }
.dp-eyebrow{
  display:inline-flex; align-items:center; gap:9px;
  color:#6FE0E0 !important; font-size:.74rem; font-weight:700;
  letter-spacing:.19em; text-transform:uppercase; margin:0 0 20px !important;
}
.dp-eyebrow:before{ content:""; width:26px; height:2px; background:#6FE0E0; }
.dp-hero-title{
  color:#fff !important; font-size:clamp(2.3rem,5vw,4.05rem); line-height:1.03;
  font-weight:800; margin:0 0 22px !important; max-width:17ch; letter-spacing:-.038em;
}
.dp-hero-title em{
  font-family:'Instrument Serif',Georgia,serif; font-style:italic;
  font-weight:400; color:#7FE9E9; letter-spacing:-.01em;
}
.dp-hero-sub{
  color:#B9CBD6 !important; font-size:1.11rem; max-width:54ch;
  margin:0 0 34px !important; line-height:1.68;
}
.dp-hero .wp-block-button__link{
  background:var(--acc); color:#fff; border:0; border-radius:11px;
  padding:16px 34px; font-weight:700; font-size:.98rem; letter-spacing:-.01em;
  box-shadow:0 8px 24px rgba(15,140,140,.34); transition:transform .15s, box-shadow .15s;
}
.dp-hero .wp-block-button__link:hover{ transform:translateY(-2px); box-shadow:0 12px 30px rgba(15,140,140,.42); }
.dp-hero .is-style-outline .wp-block-button__link{
  background:transparent; border:1.5px solid rgba(255,255,255,.30); box-shadow:none; color:#fff;
}
.dp-hero .is-style-outline .wp-block-button__link:hover{ border-color:#fff; background:rgba(255,255,255,.07); }
.dp-hero-stats{
  display:flex; gap:44px; margin-top:52px; padding-top:32px;
  border-top:1px solid rgba(255,255,255,.13); flex-wrap:wrap;
}
.dp-hero-stats .dp-stat b{
  display:block; font-size:1.85rem; font-weight:800; color:#fff; letter-spacing:-.03em; line-height:1.1;
}
.dp-hero-stats .dp-stat span{ font-size:.83rem; color:#9FB4C2; }

/* ------------------------------------------------------- faixa confiança -- */
.dp-trust{
  background:var(--card); border:1px solid var(--line); border-radius:var(--r);
  padding:34px 34px; margin-bottom:62px; box-shadow:var(--shadow);
}
.dp-trust h4{ font-size:.98rem; margin:0 0 6px; display:flex; align-items:center; gap:8px; }
.dp-trust h4:before{
  content:""; width:7px; height:7px; border-radius:50%; background:var(--acc); flex:none;
}
.dp-trust p{ color:var(--mut); font-size:.885rem; margin:0; line-height:1.6; }

/* --------------------------------------------------------- seções / home -- */
.dp-sec{
  font-size:1.95rem; font-weight:800; margin:8px 0 6px; letter-spacing:-.03em;
}
.dp-sec-sub{
  text-align:center; color:var(--mut); font-size:.98rem; margin:0 0 34px;
}
.dp-sec:after{
  content:""; display:block; width:50px; height:3px; background:var(--acc);
  border-radius:3px; margin:16px auto 0;
}
.dp-note{
  background:linear-gradient(180deg,#EFF6F6,#F7FAFA); border:1px solid #D7E7E7;
  border-left:4px solid var(--acc); border-radius:12px;
  padding:22px 26px; margin:60px 0 16px;
}
.dp-note p{ color:#2B3A44; font-size:.9rem; margin:0; line-height:1.68; }

/* --------------------------------------------------- chamada de afiliados -- */
.dp-cta-afiliado{
  display:flex; align-items:center; justify-content:space-between; gap:36px; flex-wrap:wrap;
  background:
    radial-gradient(700px 300px at 88% 20%, rgba(15,140,140,.35), transparent 60%),
    linear-gradient(135deg,#111C26,#14303A);
  border-radius:20px; padding:48px 52px; margin:70px 0; color:#fff;
}
.dp-cta-eyebrow{
  display:block; color:#6FE0E0; font-size:.73rem; font-weight:700;
  letter-spacing:.17em; text-transform:uppercase; margin-bottom:12px;
}
.dp-cta-afiliado h2{ color:#fff; font-size:2rem; margin:0 0 10px; letter-spacing:-.032em; }
.dp-cta-afiliado p{ color:#B4C7D3; margin:0; max-width:56ch; font-size:.98rem; line-height:1.66; }
.dp-cta-btn a{
  display:inline-block; background:var(--acc); color:#fff; padding:16px 34px;
  border-radius:11px; font-weight:700; white-space:nowrap;
  box-shadow:0 8px 24px rgba(15,140,140,.34); transition:transform .15s;
}
.dp-cta-btn a:hover{ transform:translateY(-2px); color:#fff; }

/* ------------------------------------------------------ grade de produtos -- */
.woocommerce ul.products{ gap:24px 22px !important; }
.woocommerce ul.products li.product{
  background:var(--card); border:1px solid var(--line); border-radius:var(--r);
  padding:0 0 20px; overflow:hidden; position:relative;
  transition:box-shadow .2s ease, transform .2s ease, border-color .2s ease;
  display:flex; flex-direction:column;
}
.woocommerce ul.products li.product:hover{
  box-shadow:var(--shadow-h); transform:translateY(-4px); border-color:#CBD7E1;
}
.woocommerce ul.products li.product a img{
  margin:0 0 16px !important; border-radius:0; aspect-ratio:1/1; object-fit:cover;
  background:#F4F7F9; transition:transform .5s ease;
}
.woocommerce ul.products li.product:hover a img{ transform:scale(1.045); }
.woocommerce ul.products li.product .ast-woo-product-category,
.woocommerce ul.products li.product .ast-woocommerce-category{
  padding:0 18px; font-size:.72rem; text-transform:uppercase; letter-spacing:.09em;
  color:var(--mut); font-weight:600;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:1.01rem !important; font-weight:700; line-height:1.36;
  padding:6px 18px 0 !important; min-height:2.6em; color:var(--ink);
}
.woocommerce ul.products li.product .price{
  padding:8px 18px 0; color:var(--ink) !important; font-weight:800; font-size:1.15rem;
  letter-spacing:-.02em; margin-top:auto;
}
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart{
  margin:14px 18px 0; background:var(--ink); color:#fff; border-radius:10px;
  font-weight:600; font-size:.86rem; padding:11px 16px; text-align:center;
  display:block; transition:background .15s;
}
.woocommerce ul.products li.product .button:hover{ background:var(--acc-d); color:#fff; }
.woocommerce ul.products li.product .button.loading{ opacity:.7; }

/* selos */
.dp-selos{ position:absolute; top:12px; left:12px; z-index:3; display:flex; flex-direction:column; gap:6px; align-items:flex-start; }
.dp-selo{
  font-size:.68rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase;
  padding:5px 10px; border-radius:7px; backdrop-filter:blur(6px);
}
.dp-selo-off{ background:rgba(180,35,42,.94); color:#fff; }
.dp-selo-baixo{ background:rgba(184,134,59,.94); color:#fff; }
.dp-selo-dest{ background:rgba(15,140,140,.94); color:#fff; }
.woocommerce span.onsale{ background:var(--acc); border-radius:7px; font-weight:700; }

/* categorias */
.woocommerce ul.products li.product-category{ padding:0; overflow:hidden; position:relative; border:0; }
.woocommerce ul.products li.product-category a{ position:relative; display:block; }
.woocommerce ul.products li.product-category img{
  margin:0 !important; border-radius:var(--r); aspect-ratio:4/3; object-fit:cover;
}
.woocommerce ul.products li.product-category h2.woocommerce-loop-category__title{
  position:absolute; left:0; right:0; bottom:0; margin:0 !important;
  padding:20px 18px !important; background:linear-gradient(transparent, rgba(6,10,16,.86) 62%);
  color:#fff !important; font-size:1rem !important; font-weight:800 !important;
  letter-spacing:-.01em; text-align:left; border-radius:0 0 var(--r) var(--r);
}
.woocommerce ul.products li.product-category h2 mark{
  display:block; background:transparent !important; color:#9DE3E3 !important;
  font-size:.74rem; font-weight:600; margin-top:3px; letter-spacing:.04em;
}

/* --------------------------------------------------------- ficha produto -- */
.dp-cat-head{ margin-bottom:26px; }
.dp-cat-head h1{ font-size:2.1rem; margin:0 0 4px; letter-spacing:-.03em; }
.dp-cat-head p{ color:var(--mut); font-size:.92rem; margin:0; }

.woocommerce div.product .product_title{ font-weight:800; letter-spacing:-.03em; font-size:2.05rem; }
.woocommerce div.product p.price{ color:var(--ink); font-weight:800; font-size:1.85rem; letter-spacing:-.03em; }
.woocommerce div.product .woocommerce-product-details__short-description{
  color:var(--ink-2); font-size:1rem; background:var(--acc-l);
  border-left:3px solid var(--acc); border-radius:0 10px 10px 0;
  padding:14px 18px; margin:18px 0 22px;
}
.woocommerce div.product form.cart .button{
  background:var(--acc); color:#fff; font-weight:700; border-radius:11px;
  padding:15px 34px; font-size:1rem; box-shadow:0 6px 18px rgba(15,140,140,.28);
}
.woocommerce div.product form.cart .button:hover{ background:var(--acc-d); }
.woocommerce div.product .quantity input{ border:1px solid var(--line); border-radius:9px; padding:12px 8px; }
.woocommerce div.product .stock.in-stock{ color:var(--acc-d); font-weight:600; }
.woocommerce div.product .stock.out-of-stock{ color:var(--warn); font-weight:700; }
.woocommerce div.product .images img{ border-radius:var(--r); border:1px solid var(--line); background:#F4F7F9; }
.woocommerce-product-gallery{ opacity:1 !important; }

.dp-garantias{
  list-style:none; margin:22px 0 0; padding:18px 20px;
  background:var(--card); border:1px solid var(--line); border-radius:12px;
}
.dp-garantias li{
  font-size:.87rem; color:var(--ink-2); padding:7px 0 7px 26px; position:relative; line-height:1.5;
}
.dp-garantias li + li{ border-top:1px solid var(--line-2); }
.dp-garantias li:before{
  content:"✓"; position:absolute; left:0; top:7px; color:var(--acc); font-weight:800;
}
.dp-garantias strong{ color:var(--ink); }

.woocommerce div.product .woocommerce-tabs ul.tabs{ padding:0; border-bottom:1px solid var(--line); }
.woocommerce div.product .woocommerce-tabs ul.tabs li{ background:transparent; border:0; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a{ font-weight:600; color:var(--mut); }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{
  color:var(--acc-d); border-bottom:2px solid var(--acc);
}
.woocommerce div.product .woocommerce-tabs h4{ margin-top:26px; font-size:1.06rem; }
.woocommerce .product_meta{
  font-size:.85rem; color:var(--mut); border-top:1px solid var(--line);
  padding-top:16px; margin-top:22px;
}
.woocommerce table.shop_attributes th{ background:var(--bg); font-weight:600; }

/* ------------------------------------------------- carrinho e checkout --- */
.woocommerce-cart table.cart,
.woocommerce-checkout .woocommerce-checkout-review-order-table,
.wc-block-components-order-summary{
  background:var(--card); border-radius:12px; overflow:hidden;
}
.woocommerce #respond input#submit.alt,.woocommerce a.button.alt,
.woocommerce button.button.alt,.woocommerce input.button.alt,
.wc-block-components-checkout-place-order-button,.wc-block-cart__submit-button{
  background:var(--acc) !important; color:#fff !important; font-weight:700 !important;
  border-radius:11px !important;
}
.woocommerce a.button.alt:hover,.wc-block-components-checkout-place-order-button:hover{ background:var(--acc-d) !important; }
.woocommerce-info,.woocommerce-message{ border-top-color:var(--acc); background:var(--card); border-radius:0 0 10px 10px; }
.woocommerce-info:before,.woocommerce-message:before{ color:var(--acc); }
.wc-block-components-totals-footer-item{ font-weight:800; }

/* ------------------------------------------------------------------ blog -- */
.dp-blog-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.dp-post-card{
  background:var(--card); border:1px solid var(--line); border-radius:var(--r);
  overflow:hidden; display:flex; flex-direction:column; transition:box-shadow .2s, transform .2s;
}
.dp-post-card:hover{ box-shadow:var(--shadow-h); transform:translateY(-3px); }
.dp-post-card img{ width:100%; aspect-ratio:16/9; object-fit:cover; display:block; }
.dp-post-card .dp-pc-body{ padding:18px 20px 22px; display:flex; flex-direction:column; flex:1; }
.dp-post-card .dp-pc-cat{
  font-size:.7rem; text-transform:uppercase; letter-spacing:.1em; color:var(--acc-d); font-weight:700;
}
.dp-post-card h3{ font-size:1.04rem; line-height:1.38; margin:7px 0 9px; letter-spacing:-.02em; }
.dp-post-card h3 a{ color:var(--ink); }
.dp-post-card h3 a:hover{ color:var(--acc-d); }
.dp-post-card p{ font-size:.875rem; color:var(--mut); margin:0; line-height:1.6; }

.single-post .entry-content{ font-size:1.05rem; line-height:1.78; }
.single-post .entry-content h2{ margin-top:2.1em; font-size:1.55rem; letter-spacing:-.025em; }
.single-post .entry-content h3{ margin-top:1.5em; font-size:1.16rem; }
.single-post .entry-content table{ font-size:.93rem; }
.single-post .entry-content th{ background:var(--bg); }
.single-post .entry-content .dp-nota,
.entry-content p.dp-nota{
  background:var(--acc-l); border-left:3px solid var(--acc); border-radius:0 10px 10px 0;
  padding:15px 18px; font-size:.9rem; color:var(--ink-2);
}
.single-post .post-thumb-img-content img{ border-radius:var(--r); }

/* --------------------------------------------------------- página padrão -- */
.dp-page-hero{
  background:linear-gradient(140deg,#0B121C,#0E2029 60%,#0C3333);
  border-radius:20px; padding:56px 48px; margin-bottom:40px; color:#fff;
}
.dp-page-hero h1{ color:#fff !important; font-size:clamp(1.9rem,3.6vw,2.9rem); margin:0 0 12px; letter-spacing:-.035em; }
.dp-page-hero p{ color:#B9CBD6 !important; margin:0; max-width:60ch; }
.entry-content h2{ margin-top:2em; letter-spacing:-.025em; }
.entry-content table{ border-collapse:collapse; width:100%; }
.entry-content th,.entry-content td{ border:1px solid var(--line); padding:11px 14px; text-align:left; }
.entry-content thead th{ background:var(--bg); font-weight:700; }

/* formulário de contato / afiliados */
.wpcf7 label,.slicewp-form label{ display:block; font-weight:600; font-size:.9rem; margin-bottom:14px; color:var(--ink); }
.wpcf7 input[type=text],.wpcf7 input[type=email],.wpcf7 textarea,.wpcf7 select,
.slicewp-form input[type=text],.slicewp-form input[type=email],.slicewp-form input[type=password],
.slicewp-form input[type=url],.slicewp-form textarea{
  width:100%; padding:12px 15px; border:1px solid var(--line); border-radius:10px;
  font-family:inherit; font-size:.95rem; background:#fff; margin-top:5px;
}
.wpcf7 input:focus,.wpcf7 textarea:focus,.slicewp-form input:focus{ outline:0; border-color:var(--acc); }
.wpcf7 input[type=submit],.slicewp-form input[type=submit],.slicewp-form button{
  background:var(--acc); color:#fff; border:0; border-radius:11px; padding:14px 32px;
  font-weight:700; font-size:.96rem; cursor:pointer;
}
.wpcf7 input[type=submit]:hover,.slicewp-form input[type=submit]:hover{ background:var(--acc-d); }
.slicewp-table{ width:100%; border-collapse:collapse; font-size:.9rem; }
.slicewp-table th,.slicewp-table td{ border:1px solid var(--line); padding:10px 12px; }

/* ---------------------------------------------------------------- rodapé -- */
.dp-footer{ background:var(--dark); color:#8FA5B4; padding:64px 24px 0; margin-top:80px; }
.dp-footer-in{
  max-width:1280px; margin:0 auto; display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr 1fr; gap:42px;
}
.dp-flogo{
  font-size:1.4rem; font-weight:800; color:#fff; letter-spacing:-.03em; margin-bottom:12px;
}
.dp-fbrand p{ font-size:.875rem; line-height:1.68; margin:0 0 18px; max-width:34ch; }
.dp-fpay{ display:flex; gap:8px; flex-wrap:wrap; }
.dp-fpay span{
  font-size:.7rem; padding:5px 10px; border:1px solid rgba(255,255,255,.15);
  border-radius:6px; color:#A9BECB;
}
.dp-fcol h4{
  color:#fff; font-size:.83rem; text-transform:uppercase; letter-spacing:.11em;
  margin:0 0 16px; font-weight:700;
}
.dp-fcol ul{ list-style:none; margin:0; padding:0; }
.dp-fcol li{ margin-bottom:9px; }
.dp-fcol a{ color:#9DB2C0; font-size:.885rem; transition:color .15s; }
.dp-fcol a:hover{ color:#7FE9E9; }
.dp-footer-aviso{
  max-width:1280px; margin:52px auto 0; padding:22px 0 26px;
  border-top:1px solid rgba(255,255,255,.10); font-size:.8rem; line-height:1.7; color:#7C93A3;
}
.dp-footer-aviso strong{ color:#B9CBD6; }
.site-footer,.ast-small-footer{ background:var(--dark); color:#7C93A3; border-top:1px solid rgba(255,255,255,.08); }
.ast-small-footer{ font-size:.8rem; padding:18px 0; }
.site-footer a,.ast-small-footer a{ color:#9DB2C0; }
.site-footer a:hover{ color:#7FE9E9; }

/* ------------------------------------------------------------ responsivo -- */
@media (max-width:1024px){
  .dp-footer-in{ grid-template-columns:1fr 1fr 1fr; gap:34px; }
  .dp-blog-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:782px){
  .dp-hero{ padding:56px 26px 50px; border-radius:16px; margin-bottom:36px; }
  .dp-hero-title{ font-size:2.1rem; }
  .dp-hero-stats{ gap:26px; margin-top:34px; padding-top:24px; }
  .dp-hero-stats .dp-stat b{ font-size:1.4rem; }
  .dp-trust{ padding:24px 20px; margin-bottom:42px; }
  .dp-sec{ font-size:1.5rem; }
  .dp-page-hero{ padding:36px 24px; }
  .dp-footer-in{ grid-template-columns:1fr 1fr; gap:28px; }
  .dp-blog-grid{ grid-template-columns:1fr; }
  .dp-topbar-in{ font-size:.72rem; padding:8px 14px; gap:8px; }
  .dp-util{ margin-left:4px; }
  .dp-util-btn{ width:36px; height:36px; }
}
@media (max-width:544px){
  .dp-footer-in{ grid-template-columns:1fr; }
  .woocommerce ul.products li.product .woocommerce-loop-product__title{ font-size:.94rem !important; }
}


/* ============================================================================
   CLONE DAS FUNCIONALIDADES DO MODELO DE REFERÊNCIA (24/08)
   Faixa de conformidade · marcas de verificação · calculadora · lote e QR
   ========================================================================= */

/* --------------------------------------------- faixa de conformidade ------ */
.dp-compliance{ background:var(--warn); color:#fff; }
.dp-compliance-in{
  max-width:1280px; margin:0 auto; padding:7px 24px;
  font-size:.68rem; font-weight:700; letter-spacing:.06em; text-align:center; line-height:1.5;
}

/* ------------------------------ marcas de verificação na ficha ------------ */
.dp-checks{ display:flex; flex-wrap:wrap; gap:8px; margin:2px 0 16px; }
.dp-check{
  font-size:.78rem; font-weight:600; color:var(--acc-d);
  background:var(--acc-l); border:1px solid #CDE7E7; border-radius:999px; padding:4px 12px;
}
.dp-check-pur{ color:var(--gold); background:#FBF4E8; border-color:#EEDFC2; }

/* ---------------------------------------------------- calculadora --------- */
.pl-calc{ background:var(--card); border:1px solid var(--line); border-radius:var(--r);
  padding:26px; box-shadow:var(--shadow); }
.pl-calc-aviso{
  background:#FFF7F7; border:1px solid #F3D6D8; border-radius:10px; color:#7A2429;
  font-size:.85rem; padding:11px 14px; margin:0 0 22px;
}
.pl-calc-grid{ display:grid; gap:22px; }
.pl-calc-campo label{ display:block; font-weight:600; font-size:.9rem; margin-bottom:9px; color:var(--ink); }
.pl-chips{ display:flex; flex-wrap:wrap; gap:7px; }
.pl-chip{
  border:1px solid var(--line); background:#fff; color:var(--ink-2);
  border-radius:9px; padding:7px 13px; font-size:.85rem; font-weight:500; cursor:pointer;
  font-family:inherit; transition:all .13s ease;
}
.pl-chip:hover{ border-color:var(--acc); color:var(--acc-d); }
.pl-chip.is-on{ background:var(--acc); border-color:var(--acc); color:#fff; font-weight:600; }
.pl-calc-reset{
  margin-top:18px; background:none; border:none; color:var(--mut);
  font-size:.82rem; cursor:pointer; text-decoration:underline; font-family:inherit; padding:0;
}
.pl-calc-res{ margin-top:26px; padding-top:22px; border-top:1px solid var(--line); }
.pl-calc-res h3{ font-size:.75rem; text-transform:uppercase; letter-spacing:.09em;
  color:var(--mut); margin:0 0 14px; font-weight:700; }
.pl-calc-res dl{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:2px; margin:0; }
/* ⚠️ "QUANTIDADE PREPARADA" ocupa duas linhas e "MARCA NA SERINGA" ocupa uma: em grelha
   simples os dois valores ficam a alturas diferentes e a leitura lado-a-lado desfaz-se.
   Com coluna flex e `margin-top:auto` no valor, os números assentam sempre na mesma
   linha de base, seja qual for o comprimento do rótulo — inclusive traduzido. */
.pl-calc-res dl > div{ background:var(--line-2); border-radius:10px; padding:14px 16px;
  display:flex; flex-direction:column; }
.pl-calc-res dt{ font-size:.74rem; text-transform:uppercase; letter-spacing:.05em;
  color:var(--mut); font-weight:600; margin-bottom:4px; }
.pl-calc-res dd{ margin:auto 0 0; font-size:1.22rem; font-weight:700; color:var(--ink); letter-spacing:-.02em; }
.pl-calc-res dd.is-alerta{ color:var(--warn); font-size:.95rem; line-height:1.4; }
.pl-calc-nota{ font-size:.78rem; color:var(--mut); margin:14px 0 0; }

/* ------------------------------------------------- verificação de lote ---- */
.pl-lote-form{ background:var(--card); border:1px solid var(--line); border-radius:var(--r);
  padding:24px; box-shadow:var(--shadow); }
.pl-lote-form label{ display:block; font-weight:600; font-size:.9rem; margin-bottom:10px; }
.pl-lote-linha{ display:flex; gap:9px; flex-wrap:wrap; }
.pl-lote-linha input{
  flex:1 1 260px; border:1px solid var(--line); border-radius:10px; padding:12px 14px;
  font-size:1rem; font-family:'Inter',monospace; letter-spacing:.02em;
}
.pl-lote-linha input:focus{ outline:none; border-color:var(--acc); box-shadow:0 0 0 3px var(--acc-l); }
.pl-lote-linha button{
  background:var(--acc); color:#fff; border:none; border-radius:10px;
  padding:12px 26px; font-weight:600; font-size:.95rem; cursor:pointer; font-family:inherit;
}
.pl-lote-linha button:hover{ background:var(--acc-d); }

.pl-lote-nao{ margin-top:18px; background:#FFF7F7; border:1px solid #F3D6D8;
  border-radius:var(--r); padding:16px 18px; color:#7A2429; font-size:.92rem; }
.pl-lote-ok{ margin-top:18px; background:var(--card); border:1px solid var(--line);
  border-radius:var(--r); overflow:hidden; box-shadow:var(--shadow); }
.pl-lote-cab{ background:var(--acc-l); border-bottom:1px solid #CDE7E7;
  padding:14px 20px; display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.pl-lote-estado{ color:var(--acc-d); font-weight:700; font-size:.95rem; }
.pl-lote-num{ font-family:'Inter',monospace; font-weight:700; letter-spacing:.03em; color:var(--ink); }
.pl-lote-tab{ width:100%; border-collapse:collapse; }
.pl-lote-tab th,.pl-lote-tab td{ padding:11px 20px; border-bottom:1px solid var(--line-2);
  text-align:left; font-size:.9rem; vertical-align:top; }
.pl-lote-tab th{ color:var(--mut); font-weight:600; width:180px; white-space:nowrap; }
.pl-lote-tab tr:last-child th,.pl-lote-tab tr:last-child td{ border-bottom:none; }

.pl-lote-lista{ margin-top:34px; }
.pl-lote-lista h3{ font-size:1.05rem; margin:0 0 6px; }
.pl-lote-lista p{ color:var(--mut); font-size:.88rem; margin:0 0 14px; }
.pl-lote-lista ul{ list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:8px; }
.pl-lote-lista li{ background:var(--card); border:1px solid var(--line); border-radius:10px;
  padding:11px 14px; display:flex; flex-direction:column; gap:2px; }
.pl-lote-lista li a{ font-family:'Inter',monospace; font-weight:600; color:var(--acc-d); font-size:.88rem; }
.pl-lote-lista li span{ font-size:.8rem; color:var(--mut); }

/* --------------------------------------- selo de lote com QR, na ficha ---- */
.pl-selo-lote{
  display:flex; gap:16px; align-items:flex-start;
  background:var(--line-2); border:1px solid var(--line); border-left:3px solid var(--acc);
  border-radius:12px; padding:16px 18px; margin:18px 0;
}
.pl-selo-qr{ flex:0 0 auto; background:#fff; border:1px solid var(--line);
  border-radius:9px; padding:6px; line-height:0; }
.pl-selo-qr img{ display:block; width:88px; height:88px; }
.pl-selo-txt{ font-size:.85rem; color:var(--ink-2); line-height:1.6; }
.pl-selo-txt strong{ color:var(--ink); }
.pl-selo-txt > strong:first-child{ display:block; margin-bottom:3px; font-size:.9rem; }

@media (max-width:600px){
  .dp-compliance-in{ font-size:.62rem; padding:6px 14px; letter-spacing:.04em; }
  .pl-calc{ padding:18px; }
  .pl-calc-res dl{ grid-template-columns:1fr 1fr; }
  .pl-lote-tab th{ width:auto; }
  .pl-lote-tab th,.pl-lote-tab td{ padding:9px 14px; font-size:.84rem; }
  .pl-selo-lote{ flex-direction:column; }
}

/* ------------------------------------------ preço de parceiro e wholesale -- */
.pl-membro-off{ display:block; margin-top:3px; font-size:.78rem; font-weight:500;
  color:var(--acc-d); text-decoration:underline; }
.pl-membro-on{ display:block; margin-top:3px; font-size:.75rem; font-weight:600;
  color:var(--acc); text-transform:uppercase; letter-spacing:.05em; }

.pl-whole-ok{ background:var(--acc-l); border:1px solid #CDE7E7; border-radius:var(--r);
  padding:16px 18px; margin-bottom:26px; color:var(--acc-d); font-size:.94rem; }
.pl-whole-cols{ display:grid; grid-template-columns:1fr 1fr; gap:34px; margin-bottom:34px; }
.pl-whole-cols h2{ font-size:1.1rem; margin:0 0 12px; }
.pl-whole-lista{ list-style:none; margin:0; padding:0; }
.pl-whole-lista li{ padding:9px 0 9px 26px; border-bottom:1px solid var(--line-2);
  font-size:.92rem; color:var(--ink-2); position:relative; }
.pl-whole-lista li:before{ content:"✔︎"; position:absolute; left:0; color:var(--acc); font-weight:700; }
.pl-whole-lista li:last-child{ border-bottom:none; }
.pl-whole-nota{ font-size:.85rem; color:var(--mut); border-left:3px solid var(--line);
  padding-left:14px; margin-top:14px; }
@media (max-width:820px){ .pl-whole-cols{ grid-template-columns:1fr; gap:24px; } }

/* ------------------------------------ badge de desconto no formato do modelo */
.dp-onsale, .ast-onsale-card{ background:var(--gold) !important; color:#fff !important; font-weight:700 !important;
  font-size:.72rem !important; letter-spacing:.02em; padding:5px 11px !important;
  border-radius:999px !important; text-transform:none !important; min-height:0 !important;
  min-width:0 !important; line-height:1.3 !important; }

/* "Limpar seleção" do Woo: minúsculo e discreto, não um aviso de erro */
.woocommerce-variation-add-to-cart .reset_variations,
a.reset_variations{ text-transform:none !important; font-size:.78rem !important;
  color:var(--mut) !important; font-weight:400 !important; letter-spacing:0 !important; }

/* ==================================== comparar · moeda · newsletter ======= */
.pl-comp-wrap{ overflow-x:auto; border:1px solid var(--line); border-radius:var(--r);
  background:var(--card); box-shadow:var(--shadow); }
.pl-comp{ width:100%; border-collapse:collapse; min-width:820px; }
.pl-comp th,.pl-comp td{ padding:12px 14px; border-bottom:1px solid var(--line-2);
  text-align:left; font-size:.87rem; vertical-align:middle; }
.pl-comp thead th{ border-bottom:2px solid var(--line); vertical-align:bottom; }
.pl-comp thead a{ display:block; text-align:center; color:var(--ink); }
.pl-comp thead img{ width:74px; height:74px; object-fit:contain; margin:0 auto 6px; display:block; }
.pl-comp thead span{ font-weight:600; font-size:.84rem; line-height:1.35; display:block; }
.pl-comp-rot{ color:var(--mut); font-weight:600; white-space:nowrap;
  background:var(--line-2); position:sticky; left:0; }
.pl-comp tbody tr:last-child td{ border-bottom:none; }
.pl-comp-btn{ display:inline-block; background:var(--acc); color:#fff; border-radius:8px;
  padding:7px 16px; font-size:.82rem; font-weight:600; }
.pl-comp-btn:hover{ background:var(--acc-d); color:#fff; }

.pl-moeda{ position:fixed; right:16px; bottom:16px; z-index:90; opacity:.94;
  background:var(--card); border:1px solid var(--line); border-radius:12px;
  box-shadow:var(--shadow-h); padding:9px 12px; display:flex; align-items:center;
  gap:8px; flex-wrap:wrap; max-width:290px; }
.pl-moeda:hover{ opacity:1; }
.pl-moeda label{ font-size:.76rem; color:var(--mut); font-weight:600; }
.pl-moeda select{ border:1px solid var(--line); border-radius:8px; padding:5px 8px;
  font-size:.82rem; font-family:inherit; background:#fff; }
.pl-moeda-nota{ font-size:.68rem; color:var(--mut); line-height:1.4; flex-basis:100%; }

.pl-news{ background:var(--dark); color:#C8D6DF; }
.pl-news-in{ max-width:1280px; margin:0 auto; padding:26px 24px;
  display:flex; align-items:center; gap:26px; flex-wrap:wrap; }
.pl-news-txt{ flex:1 1 320px; font-size:.87rem; line-height:1.6; }
.pl-news-txt strong{ display:block; color:#fff; font-size:1.02rem; margin-bottom:3px; }
.pl-news-form{ display:flex; gap:8px; flex:0 1 420px; }
.pl-news-form input{ flex:1; border:1px solid #2A3646; background:#131C29; color:#fff;
  border-radius:9px; padding:11px 14px; font-size:.92rem; font-family:inherit; }
.pl-news-form input::placeholder{ color:#5E6E80; }
.pl-news-form input:focus{ outline:none; border-color:var(--acc); }
.pl-news-form button{ background:var(--acc); color:#fff; border:none; border-radius:9px;
  padding:11px 22px; font-weight:600; font-size:.9rem; cursor:pointer; font-family:inherit; }
.pl-news-form button:hover:not(:disabled){ background:var(--acc-d); }
.pl-news-form button:disabled{ opacity:.6; cursor:default; }
.pl-news-msg{ flex-basis:100%; margin:10px 0 0; font-size:.86rem; }
.pl-news-msg.is-ok{ color:#6FD3B4; }
.pl-news-msg.is-erro{ color:#F2A0A5; }

@media (max-width:700px){
  .pl-moeda{ right:10px; bottom:10px; padding:7px 10px; max-width:230px; }
  .pl-news-in{ padding:20px 16px; gap:16px; }
  .pl-news-form{ flex-basis:100%; }
}


/* ------------------------- correções do avaliador independente (25/08) ----- */

/* O gettext troca o TEXTO do badge do Astra, mas o Woo ainda emite o seu <span.onsale>
   nativo por baixo: ficavam dois, desalinhados, e no telemóvel transbordavam o card. */
.woocommerce ul.products li.product > span.onsale:not(.dp-onsale),
.woocommerce span.onsale:not(.ast-onsale-card):not(.dp-onsale){ display:none !important; }

/* O botão da busca é o único <button> entre quatro <a> no cabeçalho: o estilo de botão
   do tema ganhava e a lupa desaparecia numa caixa branca vazia. */
.dp-util .dp-util-btn.dp-search-open{
  background:transparent !important; border:none !important; box-shadow:none !important;
  color:var(--ink) !important; padding:6px !important; min-height:0 !important;
  min-width:0 !important; line-height:0 !important;
}
.dp-util .dp-util-btn.dp-search-open:hover{ color:var(--acc) !important; background:transparent !important; }

/* O conversor era fixed sem exceção e tapava conteúdo: a célula "Categorias" na
   comparação, as linhas Água e CAS do boletim, o cartão da concentração, e o preço
   do primeiro card no telemóvel. Sai das páginas onde não há preço nenhum. */
/* onde ele aparece é decidido no PHP (is_shop/is_product/...), não por classe de body:
   o WordPress marca o body com page-id-NNN, e caçar IDs quebra na primeira página nova. */
.pl-moeda{ bottom:20px; }

/* lote reprovado: tem de se ler como reprovado, não como mais uma linha da tabela */
.pl-lote-cab.is-reprovado{ background:#FFF1F1; border-bottom-color:#F3D6D8; }
.pl-lote-cab.is-reprovado .pl-lote-estado{ color:var(--warn); }
.pl-lote-motivo{ margin:0; padding:14px 20px; background:#FFF7F7;
  border-bottom:1px solid var(--line-2); font-size:.9rem; color:#7A2429; }
.pl-lote-esp{ font-size:.8rem; color:var(--mut); }
.pl-lote-lista li.is-reprovado{ border-color:#F3D6D8; background:#FFFBFB; }
.pl-lote-lista li.is-reprovado a{ color:var(--warn); }
.pl-lote-lista li.is-reprovado strong{ color:var(--warn); text-transform:uppercase;
  font-size:.72rem; letter-spacing:.04em; }

/* ================= filtro · selo de lote no card · cookies · sugestões ==== */
.pl-filtro{ display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:0 0 18px; margin-bottom:22px; border-bottom:1px solid var(--line); }
.pl-filtro-rot{ font-size:.78rem; font-weight:600; color:var(--mut);
  text-transform:uppercase; letter-spacing:.06em; }
.pl-filtro-abas{ display:flex; gap:7px; flex-wrap:wrap; }
.pl-filtro-aba{ border:1px solid var(--line); background:#fff; color:var(--ink-2);
  border-radius:999px; padding:6px 15px; font-size:.85rem; font-weight:500; }
.pl-filtro-aba:hover{ border-color:var(--acc); color:var(--acc-d); }
.pl-filtro-aba.is-on{ background:var(--acc); border-color:var(--acc); color:#fff; font-weight:600; }

.pl-card-lote{ display:flex; flex-direction:column; gap:1px; margin:2px 0 8px;
  padding:6px 10px; background:var(--line-2); border-radius:8px;
  border-left:2px solid var(--acc); }
.pl-card-lote-n{ font-size:.72rem; font-weight:600; color:var(--ink-2);
  font-family:'Inter',monospace; letter-spacing:.01em; }
.pl-card-lote-p{ font-size:.7rem; color:var(--mut); }
.pl-card-lote:hover{ background:var(--acc-l); }

.pl-cookies{ position:fixed; left:0; right:0; bottom:0; z-index:80;
  background:var(--dark); color:#C8D6DF; border-top:2px solid var(--acc); }
/* Enquanto o banner está visível ele tapa o que estiver no fundo do ecrã — e no
   carrinho em blocos é exatamente ali que vive o botão de finalizar compra. Foi assim
   que a prova de fluxo parou de fechar pedido: clicava e o clique ia para o banner. */
body.pl-cookies-abertas{ padding-bottom:64px; }
@media (max-width:700px){ body.pl-cookies-abertas{ padding-bottom:110px; } }
.pl-cookies-in{ max-width:1280px; margin:0 auto; padding:10px 24px;
  display:flex; align-items:center; gap:16px; flex-wrap:nowrap; }
.pl-cookies-txt{ flex:1 1 auto; font-size:.78rem; line-height:1.45;
  overflow:hidden; text-overflow:ellipsis; }
.pl-cookies-txt strong{ display:inline; color:#fff; margin-right:6px; }
.pl-cookies-txt a{ color:var(--acc); text-decoration:underline; }
.pl-cookies-ok{ background:var(--acc); color:#fff; border:none; border-radius:8px;
  padding:7px 20px; font-weight:600; font-size:.82rem; cursor:pointer;
  font-family:inherit; white-space:nowrap; flex:0 0 auto; }
.pl-cookies-ok:hover{ background:var(--acc-d); }

.pl-sugere{ margin-top:44px; }
.pl-sugere > h2{ font-size:1.35rem; margin:0 0 20px; }

@media (max-width:700px){
  .pl-cookies-in{ padding:10px 14px; gap:10px; flex-wrap:wrap; }
  .pl-cookies-txt{ font-size:.72rem; flex:1 1 100%; }
  .pl-cookies-ok{ width:100%; padding:8px; }
  /* o conversor não pode ficar por baixo do banner de cookies */
  .pl-moeda{ bottom:calc(20px + env(safe-area-inset-bottom)); }
}


/* O banner tem z-index 80 e cobria o <select> do conversor (60): elementFromPoint sobre
   ele devolvia o banner, em desktop e no telemóvel. O conversor sobe para 90 e recua
   enquanto o banner está aberto, para não ficarem um por cima do outro. */
body.pl-cookies-abertas .pl-moeda{ bottom:74px; }
@media (max-width:700px){ body.pl-cookies-abertas .pl-moeda{ bottom:120px; } }

/* O filtro colava no contador do Woo e, a 390px, as 4 abas empilhavam numa coluna
   estreita com as etiquetas partidas ao meio. */
.pl-filtro{ margin-top:8px; }
@media (max-width:700px){
  .pl-filtro{ flex-direction:column; align-items:flex-start; gap:8px; }
  .pl-filtro-abas{ width:100%; }
  .pl-filtro-aba{ flex:1 1 auto; text-align:center; white-space:nowrap; padding:7px 12px; }
}

.pl-demo-aviso{ background:#FFF7ED; border:1px solid #F0DCC0; border-left:3px solid var(--gold);
  border-radius:10px; padding:14px 16px; margin:0 0 24px; font-size:.9rem; color:#7A5A24; }
.pl-demo-aviso strong{ color:#5C441B; }


/* ⚠️ No telemóvel o conversor flutuante tapava os dois CTA da home e o preço dos dois
   primeiros cards da loja — um widget de conversão de preços a tapar os preços. Em
   ecrã estreito não há canto livre: ele deixa de flutuar e passa a uma barra no fim
   do conteúdo, onde não disputa espaço com nada. */
@media (max-width:700px){
  .pl-moeda{
    position:static; max-width:none; width:100%; border-radius:0;
    border-left:none; border-right:none; box-shadow:none; opacity:1;
    justify-content:center; padding:12px 16px; margin-top:24px;
  }
  body.pl-cookies-abertas .pl-moeda{ bottom:auto; }
}


/* estado vazio da busca: o default do Woo não dá saída nenhuma */
.pl-vazio{ background:var(--card); border:1px solid var(--line); border-radius:var(--r);
  padding:34px; text-align:center; box-shadow:var(--shadow); }
.pl-vazio h2{ font-size:1.3rem; margin:0 0 10px; }
.pl-vazio p{ color:var(--mut); margin:0 0 16px; }

/* 3px de scroll horizontal no telemóvel, do filtro */
@media (max-width:700px){
  .pl-filtro-abas{ max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  body{ overflow-x:hidden; }
}


/* Classe usada só durante a captura da prova: esconde os elementos fixed, que numa
   screenshot fullPage aparecem congelados a meio da imagem. `visibility:hidden` no
   contentor não bastava — os filhos reafirmam `visible` e ficavam controlos órfãos a
   flutuar sobre o conteúdo em 14 das 24 capturas. `display:none` não tem esse furo. */
.pl-captura .pl-moeda,
.pl-captura .pl-cookies,
.pl-captura #ast-scroll-top{ display:none !important; }


/* O badge "até −18%" (z-index automático do tema) cobria 76×23 px do selo DESTAQUE em
   3 dos 6 cards. Os dois passam a empilhar em coluna, sem disputar o mesmo canto. */
.woocommerce ul.products li.product{ position:relative; }
.dp-selos{ position:absolute; top:12px; right:12px; z-index:6;
  display:flex; flex-direction:column; align-items:flex-end; gap:5px; }
.ast-onsale-card, .dp-onsale{ z-index:7 !important; }

/* A página de categoria imprimia DOIS <h1> idênticos: o do tema e o do bloco próprio. */
.tax-product_cat .ast-archive-description > h1,
.tax-product_cat .page-title:not(.dp-cat-head h1){ display:none; }
.dp-cat-head h1{ margin-top:0; }


/* o aviso de parceiro, agora inserido junto dos totais */
#pl-aviso-parceiro{ margin:0 0 16px; }

/* "Mostrando todos os 6 resultados" colava em "Preço por frasco", gap 0, nas duas larguras */
.woocommerce-result-count{ margin-bottom:14px !important; }
.pl-filtro{ margin-top:14px; }


/* A folga entre "Mostrando todos os N resultados" e "PREÇO POR FRASCO" media
   exatamente 0px, nas duas larguras: as duas margens colapsavam. */
.woocommerce .woocommerce-result-count{ margin:0 0 20px !important; display:block; }
.woocommerce .pl-filtro{ margin-top:0; padding-top:4px; }


/* ============================================================================
   TOPBAR EM TRÊS ZONAS  ·  o menu volta a uma linha
   Os ícones eram um <li> do menu: com 10 itens, "Contato" caía para a segunda
   linha, sozinho e desalinhado. Agora a topbar leva selos à esquerda e
   idioma + moeda + ícones à direita.
   ========================================================================= */
.dp-topbar-in{ justify-content:space-between !important; gap:18px; padding:7px 24px !important; }
.dp-tb-selos{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; min-width:0; }
.dp-tb-dir{ display:flex; align-items:center; gap:14px; flex:0 0 auto; }
.dp-tb-dir .dp-util{ gap:10px; }
.dp-tb-dir .dp-util-btn{ color:#C8D6DF !important; padding:4px !important; }
.dp-tb-dir .dp-util-btn:hover{ color:#fff !important; }
.dp-tb-dir .dp-util-btn svg{ width:17px; height:17px; }
.dp-tb-dir .dp-cart-n{ background:var(--acc); color:#fff; }

/* o painel de busca abre por baixo da topbar, alinhado à direita */
.dp-tb-dir .dp-search-panel{ top:100%; right:0; left:auto; }

@media (max-width:900px){
  .dp-topbar-in{ flex-direction:column; gap:8px; }
  .dp-tb-selos{ justify-content:center; font-size:.7rem; }
  .dp-tb-dir{ justify-content:center; }
}

/* ============================================================================
   SELETORES DA TOPBAR  ·  idioma e moeda
   Os dois eram problemas diferentes com a mesma causa: viviam fora do sítio.
   O conversor flutuava no canto e tapava conteúdo; o idioma não existia.
   ========================================================================= */
.pl-sel{ position:relative; }
.pl-sel-btn{
  display:flex; align-items:center; gap:6px; background:transparent; border:1px solid #2A3646;
  color:#C8D6DF; border-radius:7px; padding:4px 9px; font-size:.74rem; font-weight:600;
  font-family:inherit; cursor:pointer; line-height:1.4; letter-spacing:.01em;
}
.pl-sel-btn:hover{ border-color:var(--acc); color:#fff; }
.pl-sel-flag, .pl-sel-simb{ font-size:.9rem; line-height:1; }
.pl-sel-menu{
  position:absolute; top:calc(100% + 7px); right:0; z-index:120; min-width:212px;
  background:var(--card); border:1px solid var(--line); border-radius:11px;
  box-shadow:var(--shadow-h); padding:6px; display:flex; flex-direction:column; gap:1px;
}
.pl-sel-op{
  display:flex; align-items:center; gap:9px; background:transparent; border:none;
  border-radius:7px; padding:8px 11px; font-size:.86rem; color:var(--ink-2);
  font-family:inherit; text-align:left; cursor:pointer; width:100%;
}
.pl-sel-op:hover{ background:var(--line-2); color:var(--ink); }
.pl-sel-op.is-on{ background:var(--acc-l); color:var(--acc-d); font-weight:600; }
.pl-sel-nota{
  font-size:.7rem; color:var(--mut); padding:9px 11px 4px; line-height:1.45;
  border-top:1px solid var(--line-2); margin-top:4px;
}
.pl-lang-aviso{
  background:var(--acc-l); color:var(--acc-d); font-size:.74rem; text-align:center;
  padding:5px 16px; border-bottom:1px solid #CDE7E7;
}

/* o conversor deixou de ser fixed: as regras antigas saem de cena */
.pl-moeda.pl-sel{ position:relative !important; right:auto !important; bottom:auto !important;
  max-width:none !important; padding:0 !important; background:none !important;
  border:none !important; box-shadow:none !important; opacity:1 !important; }

@media (max-width:900px){
  .pl-sel-menu{ right:auto; left:50%; transform:translateX(-50%); }
}


/* ---------------------------------------------- a seringa da calculadora --
   O modelo desenha uma seringa estática. Esta responde ao cálculo: o líquido
   preenche até à marca, o êmbolo recua, e a linha vermelha diz onde parar. */
.pl-seringa-wrap{ margin:26px 0 6px; padding:22px 12px 12px;
  background:linear-gradient(180deg,#fbfcfd,#eef2f6); border:1px solid var(--line);
  border-radius:14px; overflow-x:auto; }
.pl-seringa{ display:block; width:100%; min-width:600px; height:auto; }

/* ⚠️ `min-width:600px` existia por um motivo real — os rótulos da escala são
   font-size="11" em unidades de um viewBox de 720, e a menos de 600 px ficam
   ilegíveis. Só que num ecrã de 390 px isso não encolhe o desenho: CORTA-O. A
   seringa aparecia até "40" e o resto, incluindo a marca vermelha que é a única
   coisa que interessa ler, ficava fora do ecrã.
   A saída é deixar escalar e compensar o que a escala tira: os textos e os traços
   crescem em unidades de viewBox, de modo que o tamanho REAL em px se mantém. */
@media (max-width: 760px){
  .pl-seringa{ min-width:0; }
  .pl-seringa #pl-numeros{ font-size:21px; font-weight:600; }
  .pl-seringa #pl-marca text{ font-size:23px; }
  .pl-seringa #pl-escala{ stroke-width:2.4; }
  .pl-seringa #pl-marca line{ stroke-width:4; }
  .pl-seringa #pl-marca circle{ r:8; }
  .pl-seringa-wrap{ padding:22px 4px 10px; }
}
.pl-seringa #pl-liq, .pl-seringa #pl-menisco, .pl-seringa #pl-haste,
.pl-seringa #pl-marca{ transition:all .22s cubic-bezier(.4,0,.2,1); }

/* ============================================================================
   HERO  ·  a cadeia de verificação em SVG, e a copy que a sustenta
   O anterior era só texto sobre um fundo. Agora a arte MOSTRA o argumento:
   frasco → número de lote → boletim, com o selo de conforme no fim.
   ========================================================================= */
.dp-hero{
  display:grid; grid-template-columns:1.05fr .95fr; gap:52px; align-items:center;
  background:linear-gradient(135deg,#0B121C 0%,#0E2A2A 55%,#0A6F6F 140%);
  border-radius:20px; padding:56px 56px 52px; margin:0 0 14px; overflow:hidden; position:relative;
}
.dp-hero:before{
  content:""; position:absolute; inset:0; opacity:.5; pointer-events:none;
  background:radial-gradient(680px 300px at 78% 18%, rgba(78,207,192,.16), transparent 62%);
}
.dp-hero-texto{ position:relative; z-index:1; }
.dp-hero-eyebrow{
  color:#4ECFC0; font-size:.72rem; font-weight:700; letter-spacing:.14em;
  margin:0 0 16px; text-transform:uppercase;
}
.dp-hero-title{
  color:#fff !important; font-size:3.05rem; line-height:1.06; letter-spacing:-.035em;
  margin:0 0 20px; font-weight:800;
}
.dp-hero-title em{ font-family:'Instrument Serif',Georgia,serif; font-style:italic;
  font-weight:400; color:#4ECFC0; letter-spacing:-.01em; }
.dp-hero-sub{ color:#B9C9D4; font-size:1.03rem; line-height:1.68; margin:0 0 28px; max-width:34em; }
.dp-hero-ctas{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom:26px; }
.dp-btn-primario{
  background:var(--acc); color:#fff !important; border-radius:11px; padding:14px 28px;
  font-weight:700; font-size:.97rem; display:inline-block; transition:transform .14s, background .14s;
}
.dp-btn-primario:hover{ background:#12A5A5; transform:translateY(-1px); color:#fff !important; }
.dp-btn-secundario{
  background:transparent; color:#CFE3E3 !important; border:1px solid #2F4A4A; border-radius:11px;
  padding:13px 26px; font-weight:600; font-size:.97rem; display:inline-block;
}
.dp-btn-secundario:hover{ border-color:var(--acc); color:#fff !important; }
.dp-hero-prova{
  color:#8FA3B0; font-size:.85rem; line-height:1.6; margin:0; padding-left:14px;
  border-left:2px solid #2F4A4A; max-width:36em;
}
.dp-hero-prova strong{ color:#4ECFC0; }
.dp-hero-arte{ position:relative; z-index:1; }
.dp-hero-svg{ width:100%; height:auto; display:block;
  filter:drop-shadow(0 24px 48px rgba(0,0,0,.34)); }

.dp-trust{
  display:grid; grid-template-columns:repeat(4,1fr); gap:2px; background:var(--line);
  border:1px solid var(--line); border-radius:14px; overflow:hidden; margin:0 0 42px;
}
.dp-trust-item{ background:var(--card); padding:22px 20px; text-align:center; }
.dp-trust-item b{ display:block; font-size:1.75rem; font-weight:800; color:var(--acc-d);
  letter-spacing:-.03em; line-height:1.1; margin-bottom:5px; }
.dp-trust-item span{ font-size:.79rem; color:var(--mut); line-height:1.45; display:block; }

@media (max-width:980px){
  .dp-hero{ grid-template-columns:1fr; gap:36px; padding:40px 30px; }
  .dp-hero-title{ font-size:2.3rem; }
  .dp-hero-arte{ max-width:420px; margin:0 auto; }
  .dp-trust{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){
  .dp-hero{ padding:32px 22px; }
  .dp-hero-title{ font-size:1.95rem; }
  .dp-hero-ctas{ flex-direction:column; }
  .dp-btn-primario,.dp-btn-secundario{ text-align:center; }
}

/* ============================================================================
   CATEGORIAS EM SVG
   Os PNG gerados por PHP GD ficavam iguais entre si e desfocavam em retina.
   Cada categoria tem agora um desenho do que aquela linha estuda, ~1 KB e nítido.
   ========================================================================= */
.pl-cats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(232px,1fr)); gap:16px; margin:0 0 46px; }
.pl-cat{
  position:relative; display:block; border-radius:15px; overflow:hidden;
  aspect-ratio:4/3; box-shadow:var(--shadow); transition:transform .18s, box-shadow .18s;
}
.pl-cat:hover{ transform:translateY(-3px); box-shadow:var(--shadow-h); }
.pl-cat-svg{ position:absolute; inset:0; width:100%; height:100%; display:block; }
.pl-cat-txt{ position:absolute; left:0; right:0; bottom:0; padding:18px 18px 16px; z-index:2; }
.pl-cat-txt strong{
  display:block; color:#fff; font-size:1rem; font-weight:700; line-height:1.25;
  letter-spacing:-.015em; text-shadow:0 1px 12px rgba(0,0,0,.4);
}
.pl-cat-txt em{ display:block; color:#C8D6DF; font-size:.76rem; font-style:normal; margin-top:3px; }

/* e nos arquivos do Woo, onde o SVG substitui a miniatura */
.woocommerce ul.products li.product-category > a{ position:relative; display:block;
  border-radius:15px; overflow:hidden; aspect-ratio:4/3; }
.woocommerce ul.products li.product-category .pl-cat-svg{ position:absolute; inset:0;
  width:100%; height:100%; }
.woocommerce ul.products li.product-category h2{ position:absolute; left:18px; right:18px;
  bottom:16px; z-index:2; color:#fff !important; text-shadow:0 1px 12px rgba(0,0,0,.4); }

/* ============================================================================
   COMPARADOR DINÂMICO, 2 A 2
   A tabela de 6 colunas mostrava tudo e não ajudava a decidir. Aos pares cabe o
   que distingue um do outro, que é a informação que faltava.
   ========================================================================= */
.pl-cmp-sugestoes{ margin-bottom:22px; }
.pl-cmp-sug-rot{ display:block; font-size:.74rem; font-weight:700; color:var(--mut);
  text-transform:uppercase; letter-spacing:.07em; margin-bottom:9px; }
.pl-cmp-sug-lista{ display:flex; gap:7px; flex-wrap:wrap; }
.pl-cmp-sug{ border:1px solid var(--line); background:#fff; color:var(--ink-2);
  border-radius:999px; padding:6px 15px; font-size:.82rem; font-weight:600;
  font-family:'Inter',monospace; letter-spacing:.01em; }
.pl-cmp-sug:hover{ border-color:var(--acc); color:var(--acc-d); }
.pl-cmp-sug.is-on{ background:var(--acc); border-color:var(--acc); color:#fff; }

.pl-cmp-escolha{ display:flex; gap:14px; align-items:flex-end; flex-wrap:wrap;
  background:var(--card); border:1px solid var(--line); border-radius:var(--r);
  padding:18px 20px; box-shadow:var(--shadow); }
.pl-cmp-campo{ flex:1 1 240px; display:flex; flex-direction:column; gap:5px; }
.pl-cmp-campo span{ font-size:.76rem; font-weight:700; color:var(--mut);
  text-transform:uppercase; letter-spacing:.06em; }
/* ⚠️ Sem line-height explícita o Chrome fecha a caixa do <select> na altura da fonte e
   corta o que desce da linha de base: "GHK-Cu 50 mg" aparecia como "GHK-Cu 50 mq". */
.pl-cmp-campo select{ border:1px solid var(--line); border-radius:9px; padding:10px 12px;
  font-size:.94rem; font-family:inherit; background:#fff; color:var(--ink);
  line-height:1.5; height:auto; }
.pl-cmp-campo select:focus{ outline:none; border-color:var(--acc); box-shadow:0 0 0 3px var(--acc-l); }

.pl-cmp-razao{ margin:16px 0 0; padding:13px 16px; background:var(--acc-l);
  border-left:3px solid var(--acc); border-radius:9px; font-size:.9rem; color:var(--acc-d); }

.pl-cmp-cards{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:22px 0 2px; }
.pl-cmp-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--r);
  padding:20px; text-align:center; box-shadow:var(--shadow); position:relative; }
.pl-cmp-img img{ width:112px; height:112px; object-fit:contain; margin:0 auto 10px; display:block; }
.pl-cmp-cod{ display:inline-block; background:var(--dark); color:#fff; border-radius:5px;
  padding:2px 9px; font-size:.7rem; font-weight:700; letter-spacing:.04em; margin-bottom:7px; }
.pl-cmp-card h3{ font-size:1.06rem; margin:0 0 6px; line-height:1.3; }
.pl-cmp-card h3 a{ color:var(--ink); }
.pl-cmp-classe{ font-size:.8rem; color:var(--mut); margin:0 0 12px; line-height:1.45; }
.pl-cmp-preco{ font-size:1.16rem; font-weight:800; color:var(--ink); margin:0 0 14px; }
.pl-cmp-preco em{ font-size:.74rem; font-weight:400; color:var(--mut); font-style:normal; }
.pl-cmp-btn{ display:inline-block; background:var(--acc); color:#fff !important;
  border-radius:9px; padding:9px 22px; font-size:.87rem; font-weight:600; }
.pl-cmp-btn:hover{ background:var(--acc-d); }

.pl-cmp-linhas{ border:1px solid var(--line); border-radius:var(--r); overflow:hidden;
  background:var(--card); box-shadow:var(--shadow); margin-top:18px; }
.pl-cmp-linha{ display:grid; grid-template-columns:180px 1fr 1fr; border-bottom:1px solid var(--line-2); }
.pl-cmp-linha:last-child{ border-bottom:none; }
.pl-cmp-rot{ background:var(--line-2); padding:15px 17px; font-size:.79rem; font-weight:700;
  color:var(--mut); text-transform:uppercase; letter-spacing:.045em; line-height:1.35; }
.pl-cmp-val{ padding:15px 18px; font-size:.89rem; color:var(--ink-2); line-height:1.6;
  border-left:1px solid var(--line-2); }
.pl-cmp-aviso{ margin-top:18px; font-size:.8rem; color:var(--mut); line-height:1.6;
  padding-left:14px; border-left:2px solid var(--line); }

@media (max-width:820px){
  .pl-cmp-linha{ grid-template-columns:1fr; }
  .pl-cmp-rot{ padding:11px 15px; }
  .pl-cmp-val{ border-left:none; border-top:1px solid var(--line-2); }
  .pl-cmp-val:before{ content:attr(data-lado); }
}
@media (max-width:560px){ .pl-cmp-cards{ grid-template-columns:1fr; } }

/* ------------------------------------- cupões à vista, no carrinho -------- */
.pl-cupoes{ background:#FFF9EC; border:1px solid #F0DCC0; border-left:3px solid var(--gold);
  border-radius:11px; padding:15px 17px; margin:0 0 16px; }
.pl-cupoes > strong{ display:block; font-size:.86rem; color:#5C441B; margin-bottom:9px; }
.pl-cupoes ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.pl-cupoes li{ display:flex; align-items:baseline; gap:9px; font-size:.83rem; color:#7A5A24; }
.pl-cupoes code{ background:#fff; border:1px dashed #D9BC8A; border-radius:6px;
  padding:2px 9px; font-weight:700; letter-spacing:.05em; color:#5C441B; font-size:.8rem; }

/* ⚠️ O `hidden` do HTML não tinha efeito: `.pl-sel-menu{display:flex}` ganha do atributo,
   e os dois dropdowns apareciam ABERTOS, tapando o menu e a faixa de conformidade.
   Um atributo `hidden` só funciona se nada declarar `display` por cima dele. */
.pl-sel-menu[hidden]{ display:none !important; }
.pl-sel.is-aberto .pl-sel-menu{ display:flex !important; }
.pl-sel-btn[aria-expanded="true"]{ border-color:var(--acc); color:#fff; }


/* ============================================================================
   O FILTRO E O CONTADOR  ·  a sobreposição no telemóvel
   `.woocommerce-result-count` é `float:left` no tema. Qualquer coisa a seguir sem
   `clear` sobe para junto dele: no desktop havia largura de sobra e não se via, no
   telemóvel o texto ficava POR CIMA de "PREÇO POR FRASCO".
   ========================================================================= */
.pl-filtro{
  clear:both !important;
  width:100%;
  box-sizing:border-box;
  margin:0 0 20px !important;
  padding:0 0 18px !important;
}
.woocommerce .woocommerce-result-count{
  clear:both !important;
  float:none !important;
  display:block;
  margin:0 0 14px !important;
}
.woocommerce .woocommerce-ordering{ clear:none; }

@media (max-width:700px){
  /* as abas ficavam a empilhar 2+1+1 com larguras diferentes; passam a uma fila
     que rola na horizontal, com todas do mesmo tamanho */
  .pl-filtro{ flex-direction:column; align-items:stretch; gap:10px; }
  .pl-filtro-rot{ margin:0; }
  .pl-filtro-abas{
    display:grid; grid-template-columns:repeat(2,1fr); gap:8px;
    width:100%; overflow:visible;
  }
  .pl-filtro-aba{ text-align:center; padding:9px 8px; font-size:.82rem; white-space:nowrap; }
  .woocommerce .woocommerce-ordering{ width:100%; margin-bottom:16px; }
  .woocommerce .woocommerce-ordering select{ width:100%; }
}

/* ⚠️ A COLISÃO REAL, medida com getBoundingClientRect em 390px.
   O Astra põe um botão de compra CIRCULAR sobre a imagem do card
   (.add_to_cart_button, absolute, 32x32, z-index 5) além do "Ver opções" normal no fim
   do card. São dois botões para a mesma ação, e é o circular que o selo tapava.
   No telemóvel o circular é redundante e é o que sai: fica o botão de largura total,
   que tem alvo de toque decente. */
@media (max-width:700px){
  .woocommerce ul.products li.product .astra-shop-thumbnail-wrap .add_to_cart_button,
  .woocommerce ul.products li.product .ast-on-card-button.ast-shop-hover-button,
  .woocommerce ul.products li.product a.add_to_cart_button.ast-on-card-button{
    display:none !important;
  }
  /* e o selo e o badge deixam de disputar a mesma faixa */
  .dp-selos{ max-width:52%; }
  .ast-onsale-card, .dp-onsale{ max-width:44%; }
}

/* ⚠️ MEDIDO, não suposto: o badge do Astra fica em `left:37` — ele nasce à ESQUERDA do
   card, e a minha regra `right:8px` não o movia (o tema define left, que ganha).
   Em vez de brigar com o tema, o SELO é que muda de lado: badge à esquerda onde já
   estava, selo à direita, e nunca mais se encontram. */
@media (max-width:700px){
  .dp-selos{
    left:auto !important; right:8px !important; top:8px !important;
    align-items:flex-end !important; max-width:46% !important;
  }
  .ast-onsale-card, .dp-onsale{ right:auto !important; left:8px !important; max-width:46% !important; }
}

/* ⚠️ A CAUSA REAL, e não era posição — foi preciso medir para ver.
   `.dp-selos` é um contentor flex de 278px de largura: estica-se pelo card todo e
   INTERCEPTA o clique de tudo o que estiver por baixo, incluindo o botão circular do
   Astra em x=335. Os selos lá dentro têm 50px; o contentor é que é largo.
   Mover o contentor de canto nunca ia resolver: ele cobre a largura inteira.
   A correção é o contentor deixar de receber ponteiro, e só os selos receberem. */
.dp-selos{ pointer-events:none !important; width:auto !important; }
/* ⚠️ Os selos TAMBÉM não recebem ponteiro. "Destaque", "Esgotado" e "Últimas N" são
   informativos: nenhum é clicável, e todos ficam por cima da foto do produto, que É o
   link. Devolver-lhes o ponteiro (como fiz numa primeira tentativa) faz o selo roubar
   o clique do card — o utilizador toca no produto e não acontece nada. */
.dp-selos > *{ pointer-events:none; }
.ast-onsale-card, .dp-onsale{ pointer-events:none; }