/* Natural Life — capa de marca sobre Pureglow.
   Pureglow define su paleta en variables (style.css :root); aquí se pisan con verdes y tierras
   (00-norte §4). Todo lo específico de Natural Life vive en este archivo. */

:root {
  --pureglow-base: #5E7D4B;
  --pureglow-base-rgb: 94, 125, 75;
  --pureglow-black: #1F2A1F;
  --pureglow-black-rgb: 31, 42, 31;
  --pureglow-gray: #5F665B;
  --pureglow-gray-rgb: 95, 102, 91;
  --pureglow-primary: #F4F6EE;
  --pureglow-primary-rgb: 244, 246, 238;
  --nl-tierra: #A0703F;
  --nl-crema: #FBF8F1;
  --nl-verde-oscuro: #2F4A2A;
}

/* ---------- logo de texto (mientras no haya logo gráfico) ---------- */
.nl-logo { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; }
.nl-logo svg { width: 38px; height: 38px; flex: none; }
.nl-logo__txt { display: flex; flex-direction: column; line-height: 1.05; }
.nl-logo__marca { font-family: var(--pureglow-font-two); font-size: 24px; color: var(--pureglow-black); }
.nl-logo__sub { font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--pureglow-base); font-weight: 600; }
.nl-logo--claro .nl-logo__marca { color: #fff; }
.nl-logo--claro .nl-logo__sub { color: #cfe0c0; }

/* ---------- botón WhatsApp ---------- */
.thm-btn.nl-wa, .nl-wa { background-color: #25D366; }
.thm-btn.nl-wa:hover { color: #fff; }
.nl-wa-flotante {
  position: fixed; right: 18px; bottom: 18px; z-index: 999;
  width: 58px; height: 58px; border-radius: 50%;
  background: #25D366; color: #fff; display: flex; align-items: center; justify-content: center;
  font-size: 30px; box-shadow: 0 8px 24px rgba(0,0,0,.18); transition: transform .2s;
}
.nl-wa-flotante:hover { transform: scale(1.07); color: #fff; }

/* ---------- lugar de foto (hasta que lleguen las reales) ---------- */
.nl-foto {
  position: relative; overflow: hidden; border-radius: var(--pureglow-bdr-radius);
  background: radial-gradient(120% 90% at 20% 10%, #EAF0DF 0%, #D6E2C6 45%, #B9CDA3 100%);
  display: flex; align-items: center; justify-content: center; min-height: 320px;
}
.nl-foto img.nl-foto__rama { position: absolute; width: 70%; max-width: 360px; opacity: .95; }
.nl-foto__etiqueta {
  position: absolute; left: 14px; bottom: 12px; font-size: 12px; color: var(--nl-verde-oscuro);
  background: rgba(255,255,255,.75); padding: 3px 10px; border-radius: 20px;
}
.nl-foto--oscura { background: radial-gradient(120% 90% at 20% 10%, #5E7D4B 0%, #3F5A33 55%, #2F4A2A 100%); }

/* ---------- hero ---------- */
.nl-hero { position: relative; overflow: hidden; background: var(--nl-crema); padding: 90px 0 110px; }
.nl-hero__rama-1 { position: absolute; right: -40px; top: 30px; width: 340px; opacity: .9; }
.nl-hero__rama-2 { position: absolute; left: -60px; bottom: -30px; width: 260px; opacity: .55; transform: rotate(160deg); }
.nl-hero__tag { font-family: var(--pureglow-font-three); color: var(--pureglow-base); font-size: 34px; margin-bottom: 6px; }
.nl-hero__titulo { font-family: var(--pureglow-font-two); font-size: 56px; line-height: 1.12; color: var(--pureglow-black); margin-bottom: 22px; }
.nl-hero__texto { font-size: 18px; max-width: 560px; margin-bottom: 34px; }
.nl-hero__btns { display: flex; flex-wrap: wrap; gap: 14px; }
.nl-hero__img { position: relative; }
.nl-hero__img .nl-foto { min-height: 460px; border-radius: 240px 240px 18px 18px; }
.nl-hero__sello {
  position: absolute; left: -24px; bottom: 36px; background: #fff; border-radius: 14px;
  padding: 14px 18px; box-shadow: 0 12px 30px rgba(31,42,31,.12); max-width: 250px;
}
.nl-hero__sello strong { display: block; font-family: var(--pureglow-font-two); color: var(--pureglow-black); font-size: 18px; }
.nl-hero__sello span { font-size: 14px; }
@media (max-width: 991px) {
  .nl-hero { padding: 60px 0 70px; }
  .nl-hero__titulo { font-size: 40px; }
  .nl-hero__img { margin-top: 50px; }
  .nl-hero__sello { left: 12px; }
}

/* ---------- los cuatro frentes ---------- */
.nl-frentes { padding: 100px 0 70px; }
.nl-frente {
  background: #fff; border: 1px solid #E4EAD9; border-radius: 16px; padding: 34px 28px;
  height: 100%; transition: box-shadow .25s, transform .25s; position: relative;
}
.nl-frente:hover { box-shadow: 0 18px 40px rgba(31,42,31,.08); transform: translateY(-4px); }
.nl-frente__num { font-family: var(--pureglow-font-two); font-size: 42px; color: #D6E2C6; line-height: 1; }
.nl-frente__icono { font-size: 34px; color: var(--pureglow-base); margin: 10px 0 14px; }
.nl-frente h3 { font-size: 22px; margin-bottom: 10px; }
.nl-frente p { margin-bottom: 16px; }
.nl-frente a.nl-link { font-weight: 600; color: var(--pureglow-base); }

/* ---------- estante ---------- */
.nl-estante { padding: 100px 0; background: var(--pureglow-primary); }
.nl-producto {
  background: #fff; border-radius: 16px; overflow: hidden; height: 100%;
  display: flex; flex-direction: column; border: 1px solid #E4EAD9;
}
.nl-producto__img { background: linear-gradient(180deg, #F4F6EE, #E4ECD8); display: flex; justify-content: center; padding: 26px 0 10px; }
.nl-producto__img svg { height: 190px; width: auto; }
.nl-producto__cuerpo { padding: 22px 22px 26px; display: flex; flex-direction: column; flex: 1; }
.nl-producto__necesidad { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--nl-tierra); font-weight: 600; }
.nl-producto__nombre { font-size: 22px; margin: 6px 0 8px; }
.nl-producto__nombre a { color: var(--pureglow-black); }
.nl-producto__resumen { font-size: 15px; flex: 1; }
.nl-producto__acciones { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.nl-producto__acciones .thm-btn { padding: 10px 18px; font-size: 14px; }

/* ---------- bandas ---------- */
.nl-banda { background: var(--nl-verde-oscuro); color: #E6EEDC; padding: 80px 0; position: relative; overflow: hidden; }
.nl-banda h2 { color: #fff; font-family: var(--pureglow-font-two); font-size: 40px; }
.nl-banda p { color: #D2DEC6; font-size: 17px; }
.nl-banda__rama { position: absolute; right: -30px; bottom: -40px; width: 300px; opacity: .25; filter: brightness(2.2); }

.nl-pasos { counter-reset: paso; list-style: none; padding: 0; margin: 0; }
.nl-pasos li { counter-increment: paso; position: relative; padding: 0 0 22px 58px; }
.nl-pasos li::before {
  content: counter(paso); position: absolute; left: 0; top: -2px; width: 40px; height: 40px; border-radius: 50%;
  background: var(--pureglow-base); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700;
}
.nl-pasos li strong { display: block; color: var(--pureglow-black); font-size: 18px; margin-bottom: 2px; }

.nl-aviso {
  background: #FFF7E6; border-left: 4px solid var(--nl-tierra); padding: 14px 18px; border-radius: 8px;
  font-size: 15px; margin: 20px 0;
}

/* ---------- blog ---------- */
.nl-post-card { background: #fff; border-radius: 16px; overflow: hidden; border: 1px solid #E4EAD9; height: 100%; display: flex; flex-direction: column; }
.nl-post-card__img { height: 190px; }
.nl-post-card__img .nl-foto { min-height: 190px; height: 100%; border-radius: 0; }
.nl-post-card__cuerpo { padding: 22px; flex: 1; display: flex; flex-direction: column; }
.nl-post-card__fecha { font-size: 13px; color: var(--nl-tierra); font-weight: 600; }
.nl-post-card h3 { font-size: 21px; margin: 8px 0 10px; line-height: 1.3; }
.nl-post-card h3 a { color: var(--pureglow-black); }
.nl-post-card p { font-size: 15px; flex: 1; }

.nl-articulo { padding: 90px 0; }
.nl-articulo__cuerpo { font-size: 18px; line-height: 1.75; }
.nl-articulo__cuerpo h2 { font-size: 30px; margin: 38px 0 14px; }
.nl-articulo__cuerpo h3 { font-size: 23px; margin: 28px 0 10px; }
.nl-articulo__cuerpo ul { padding-left: 22px; margin-bottom: 20px; }
.nl-articulo__cuerpo li { margin-bottom: 6px; }
.nl-articulo__cuerpo p { margin-bottom: 18px; }
.nl-articulo__cierre { background: var(--pureglow-primary); border-radius: 16px; padding: 30px; margin-top: 40px; }

.nl-seccion { padding: 100px 0; }
.nl-seccion--suave { background: var(--pureglow-primary); }

/* la plantilla pinta el menú activo en naranja por defecto: se hereda la variable */
.main-menu__list > li.current > a { color: var(--pureglow-base); }

.nl-foto--alta { min-height: 520px; }
@media (max-width: 1199px) { .nl-foto--alta { min-height: 360px; margin-bottom: 40px; } }
.nl-ficha { padding: 90px 0; }
.nl-ficha__img { background: linear-gradient(180deg, #F4F6EE, #E4ECD8); border-radius: 18px; display: flex; justify-content: center; padding: 40px 0; }
.nl-ficha__img svg { height: 340px; width: auto; }
.nl-ficha h1 { font-family: var(--pureglow-font-two); font-size: 44px; margin: 6px 0 14px; }
.nl-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 22px; padding: 0; list-style: none; }
.nl-chips li { background: #EAF0DF; color: var(--nl-verde-oscuro); padding: 5px 14px; border-radius: 20px; font-size: 14px; font-weight: 600; }
.nl-filtros { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-bottom: 40px; }
.nl-filtros a { border: 1px solid #CFDCC0; color: var(--nl-verde-oscuro); padding: 8px 18px; border-radius: 22px; font-size: 14px; font-weight: 600; }
.nl-filtros a:hover { background: var(--pureglow-base); color: #fff; border-color: var(--pureglow-base); }
.nl-grupo { margin-bottom: 60px; }
.nl-grupo h2 { font-family: var(--pureglow-font-two); font-size: 30px; margin-bottom: 22px; }
.nl-contacto-card { background: #fff; border: 1px solid #E4EAD9; border-radius: 16px; padding: 30px; height: 100%; }
.nl-contacto-card i { font-size: 30px; color: var(--pureglow-base); margin-bottom: 14px; }
.nl-contacto-card h3 { font-size: 22px; margin-bottom: 8px; }
.nl-mapa { border: 0; width: 100%; height: 380px; border-radius: 16px; }

/* La plantilla capitaliza cada palabra (text-transform: capitalize): en español se ve mal. */
.main-menu__list > li > a, .thm-btn, .main-menu__top-welcome-text, .footer-widget__title,
.main-menu .main-menu__list > li > a, .stricky-header .main-menu__list > li > a { text-transform: none !important; }
.thm-breadcrumb, .thm-breadcrumb li, .thm-breadcrumb a { text-transform: none !important; }
.thm-btn.nl-wa { padding-top: 15px; padding-bottom: 15px; padding-right: 30px; }
@media (max-width: 991px) {
  .nl-hero__rama-1 { width: 170px; right: -50px; top: auto; bottom: 40%; opacity: .35; }
}

/* fotos reales */
.nl-foto--real { background: #E4ECD8; }
.nl-foto__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nl-producto__img img { height: 220px; width: auto; border-radius: 10px; box-shadow: 0 10px 24px rgba(31,42,31,.15); }
.nl-ficha__img img { max-height: 460px; width: auto; border-radius: 14px; box-shadow: 0 16px 36px rgba(31,42,31,.18); }
.nl-banda--foto { background-size: cover; background-position: center; }
.nl-banda--foto::before { content: ""; position: absolute; inset: 0; background: rgba(47,74,42,.88); }
.nl-banda--foto > .container { position: relative; }
.footer-widget__links-list a { text-transform: none !important; }

/* retrato del doctor: círculo con rama de acuarela */
.nl-retrato { position: relative; max-width: 460px; margin: 0 auto; aspect-ratio: 1; }
.nl-retrato__fondo { position: absolute; inset: 0; border-radius: 50%; background: radial-gradient(circle at 30% 25%, #EAF0DF, #C9D8B6); }
.nl-retrato img.nl-retrato__foto { position: absolute; inset: 7%; width: 86%; height: 86%; border-radius: 50%; object-fit: cover; box-shadow: 0 18px 40px rgba(31,42,31,.18); border: 6px solid #fff; }
.nl-retrato__rama { position: absolute; width: 46%; right: -12%; bottom: -6%; transform: rotate(-12deg); }
.nl-retrato__rama--2 { right: auto; left: -14%; top: -4%; bottom: auto; width: 38%; transform: rotate(160deg); opacity: .8; }
.nl-foto--tech { background: #030C0A; }
.nl-foto--tech .nl-foto__img { object-fit: contain; } .nl-foto--tech.nl-foto--alta { min-height: 0; aspect-ratio: 4 / 3; }
