/* =========================================================
   Dr. Emmerson Theme — estilos base (dirección "Editorial")
   Los colores salen de variables que llena el Personalizador.
   ========================================================= */

:root{
	/* valores de respaldo; el Personalizador los sobreescribe */
	--de-accent:#2E5C9E;
	--de-accent-deep:#1E4478;
	--de-bg:#F1F4F8;
	--de-ink:#1F2530;
	--de-accent-tint:#E3EBF6;
	--de-accent-line:#B9CCE5;

	--de-surface:#FFFFFF;
	--de-surface-sunk:#E7EDF4;
	--de-ink-soft:#5A6578;
	--de-ink-faint:#8E99AC;
	--de-line:#D8DFE9;
	--de-shadow:0 30px 60px -32px rgba(20,28,44,0.28);
	--de-r:18px;
	--de-font-d:"Fraunces",Georgia,serif;
	--de-font-b:"Barlow",system-ui,sans-serif;
}

body{
	margin:0;
	background:var(--de-bg);
	color:var(--de-ink);
	font-family:var(--de-font-b);
	-webkit-font-smoothing:antialiased;
}
.de-content h1,.de-content h2,.de-content h3,.de-title{ font-family:var(--de-font-d); font-weight:600; }
img{ max-width:100%; height:auto; }
a{ color:var(--de-accent); }

.de-wrap{ max-width:1100px; margin:0 auto; padding:0 clamp(20px,4vw,44px); }
.de-section{ padding:clamp(40px,6vw,72px) clamp(20px,4vw,44px); max-width:1100px; margin:0 auto; }

/* ---------- Topbar + Navegación ---------- */
.de-site-top{ position:sticky; top:0; z-index:80; }
.admin-bar .de-site-top{ top:32px; }
.de-topbar{ background:var(--de-ink); color:var(--de-bg); font-size:0.78rem; text-align:center; padding:8px 14px; font-weight:500; }
.de-nav{ border-bottom:1px solid var(--de-line); background:var(--de-bg); }
@supports (backdrop-filter:blur(8px)){
	.de-nav{ background:color-mix(in srgb, var(--de-bg) 86%, transparent); backdrop-filter:blur(12px); }
}
.de-nav-inner{ max-width:1100px; margin:0 auto; padding:13px clamp(20px,4vw,44px); display:flex; align-items:center; justify-content:space-between; gap:18px; }
.de-nav-logo{ display:flex; align-items:center; text-decoration:none; }
.de-nav-logo img{ max-height:40px; width:auto; }
.de-logo-text{ font-family:var(--de-font-d); font-size:1.3rem; color:var(--de-ink); }

.de-menu{ display:flex; gap:clamp(14px,2.2vw,28px); list-style:none; margin:0; padding:0; }
.de-menu a{ font-size:0.9rem; font-weight:500; color:var(--de-ink-soft); text-decoration:none; transition:color .18s; }
.de-menu a:hover, .de-menu .current-menu-item a{ color:var(--de-ink); }

.de-nav-cta{
	font-weight:600; font-size:0.9rem; background:var(--de-accent-deep); color:#fff !important;
	border-radius:999px; padding:10px 20px; text-decoration:none; transition:background .2s;
}
.de-nav-cta:hover{ background:var(--de-accent); }

.de-burger{ display:none; width:40px; height:40px; border:1px solid var(--de-line); background:none; border-radius:10px; cursor:pointer; color:var(--de-ink); align-items:center; justify-content:center; }
.de-mobile-menu{ display:none; border-bottom:1px solid var(--de-line); background:var(--de-bg); padding:8px clamp(20px,4vw,44px) 16px; }
.de-mobile-menu.open{ display:block; }
.de-menu-mobile{ list-style:none; margin:0; padding:0; }
.de-menu-mobile a{ display:block; padding:12px 2px; font-size:1rem; font-weight:600; color:var(--de-ink); text-decoration:none; border-bottom:1px solid var(--de-line); }

@media (max-width:880px){
	.de-nav-links, .de-nav-inner .de-nav-cta{ display:none; }
	.de-burger{ display:flex; }
}

/* ---------- Botones ---------- */
.de-btn, .de-content .button, .woocommerce a.button, .woocommerce button.button,
.woocommerce .button.alt, .woocommerce #respond input#submit{
	display:inline-block; background:var(--de-accent-deep); color:#fff; border:none;
	border-radius:999px; padding:13px 26px; font-family:var(--de-font-b); font-weight:600;
	font-size:0.95rem; text-decoration:none; cursor:pointer; transition:background .2s, transform .2s;
}
.de-btn:hover, .woocommerce a.button:hover, .woocommerce button.button:hover{
	background:var(--de-accent); color:#fff; transform:translateY(-1px);
}

/* ---------- Hero de respaldo ---------- */
.de-hero{ background:linear-gradient(160deg, var(--de-accent-tint), var(--de-bg)); }
.de-hero-inner{ padding-top:clamp(40px,7vw,90px); padding-bottom:clamp(40px,7vw,90px); }
.de-kicker{ text-transform:uppercase; letter-spacing:0.14em; font-size:0.78rem; font-weight:600; color:var(--de-accent); display:block; margin-bottom:14px; }
.de-hero h1{ font-family:var(--de-font-d); font-size:clamp(2.2rem,4.6vw,3.6rem); line-height:1.08; margin:0 0 16px; }
.de-hero p{ color:var(--de-ink-soft); font-size:1.05rem; line-height:1.6; max-width:52ch; margin:0 0 24px; }

/* ---------- Contenido ---------- */
.de-entry-content{ line-height:1.7; color:var(--de-ink); max-width:72ch; }
.de-entry-content a{ color:var(--de-accent-deep); }

/* ---------- WooCommerce base ---------- */
.de-woo ul.products li.product{
	background:var(--de-surface); border:1px solid var(--de-line); border-radius:var(--de-r);
	padding:18px; transition:transform .25s, border-color .25s; list-style:none;
}
.de-woo ul.products li.product:hover{ transform:translateY(-4px); border-color:var(--de-accent-line); }
.de-woo ul.products li.product img{ border-radius:12px; }
.de-woo .woocommerce-loop-product__title{ font-family:var(--de-font-d); font-size:1.15rem; }
.de-woo .price{ color:var(--de-accent-deep); font-weight:700; }
.de-woo .onsale{ background:var(--de-accent); border-radius:999px; }

/* ---------- Footer ---------- */
.de-footer{ border-top:1px solid var(--de-line); background:var(--de-surface-sunk); margin-top:clamp(40px,6vw,80px); }
.de-footer-grid{ max-width:1100px; margin:0 auto; padding:clamp(36px,5vw,56px) clamp(20px,4vw,44px) 28px; display:grid; grid-template-columns:1.4fr 1fr 1.2fr; gap:clamp(24px,4vw,40px); }
.de-f-brand img{ max-height:30px; width:auto; }
.de-f-brand p{ margin:14px 0 0; font-size:0.88rem; color:var(--de-ink-soft); line-height:1.55; max-width:30ch; }
.de-f-social{ display:flex; gap:10px; margin-top:16px; }
.de-f-social a{ font-size:0.8rem; font-weight:600; color:var(--de-ink-soft); text-decoration:none; border:1px solid var(--de-line); border-radius:999px; padding:6px 14px; }
.de-f-social a:hover{ color:var(--de-ink); border-color:var(--de-accent); }
.de-f-col > b{ display:block; text-transform:uppercase; letter-spacing:0.1em; font-size:0.76rem; color:var(--de-ink); margin-bottom:12px; }
.de-f-col a, .de-f-col span{ display:block; font-size:0.88rem; color:var(--de-ink-soft); text-decoration:none; padding:4px 0; line-height:1.5; }
.de-menu-footer{ list-style:none; margin:0; padding:0; }
.de-menu-footer a{ display:block; font-size:0.88rem; color:var(--de-ink-soft); text-decoration:none; padding:4px 0; }
.de-footer-bottom{ border-top:1px solid var(--de-line); text-align:center; padding:14px; font-size:0.76rem; color:var(--de-ink-faint); }

@media (max-width:760px){ .de-footer-grid{ grid-template-columns:1fr; } }

/* ---------- WhatsApp flotante ---------- */
.de-wa-float{
	position:fixed; right:18px; bottom:18px; width:54px; height:54px; border-radius:50%;
	background:#25D366; color:#fff; display:flex; align-items:center; justify-content:center;
	box-shadow:0 14px 32px -10px rgba(0,0,0,.45); z-index:90; transition:transform .25s;
}
.de-wa-float:hover{ transform:scale(1.1); color:#fff; }