/*
 Theme Name:   Wolverine Child Theme
 Theme URI:    http://themes.g5plus.net/wolverine
 Description:  Wolverine Child Theme
 Author:       G5plus
 Author URI:   http://g5plus.net
 Template:     wolverine
 Version:      1.3
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags: 				two-columns, three-columns, left-sidebar, right-sidebar, fixed-layout, responsive-layout, custom-background, custom-header, custom-menu, editor-style, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready, accessibility-ready
Text Domain: 		g5plus-framework
*/


/************************************************************************************
Put your custom CSS below this block :)
*************************************************************************************/

.nutrinamic-nav-grid {
  max-width: 900px;
  margin: 0 auto;
}

.nutri-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

/* Base item */
.nutri-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 60px 20px;
  text-align: center;
  text-decoration: none;
}

/* VERTICAL divider – only left column gets right border */
.nutri-item:nth-child(odd) {
  border-right: 1px solid #e5e5e5;
}

/* HORIZONTAL divider – only top row gets bottom border */
.nutri-item:nth-child(-n+2) {
  border-bottom: 1px solid #e5e5e5;
}

/* Icon */
.nutri-item img {
  width: 72px;
  height: 72px;
  object-fit: contain;
  display: block;
}

/* Text */
.nutri-item span {
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  line-height: 1.4;
  color: #1a1a1a;
}

/* Hover – subtle, brand-safe */
.nutri-item:hover {
  background-color: #fafafa;
}

/* Mobile */
@media (max-width: 767px) {
  .nutri-item {
    padding: 40px 16px;
  }

  .nutri-item img {
    width: 56px;
    height: 56px;
  }

  .nutri-item span {
    font-size: 11px;
  }
}

/************************************************************************************
Remove header-left inset overlay shadow
*************************************************************************************/

@media (min-width: 992px) {
  header.header-left,
  header.header-7.header-left {
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
  }
}

/************************************************************************************
Remove header-left inset overlay shadow on inner wrappers
*************************************************************************************/

@media (min-width: 992px) {
  header.header-left .header-nav-wrapper,
  header.header-left .header-nav-above {
    box-shadow: none !important;
  }
}

/************************************************************************************
BigBaby – About block + Nutritional Information (compact + softer colours + spacing)
PASTE THIS INTO: Appearance → Customise → Additional CSS
*************************************************************************************/

/* -----------------------------
   ABOUT (soft “airy” blue card) – minimal, not loud
------------------------------ */

.bb-card-blue{
  background: linear-gradient(180deg, #eef7ff 0%, #f7fbff 100%);
  color: #1f2a37;
  border: 1px solid rgba(42, 167, 217, 0.18);
  border-radius: 16px;
  padding: 18px 18px;
  position: relative;
  box-shadow: 0 10px 22px rgba(0,0,0,0.06);
  overflow: hidden;
  margin: 18px 0 22px 0;
}

.bb-card-blue:before{
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 18% 15%, rgba(42,167,217,0.14) 0%, rgba(42,167,217,0.00) 55%),
    radial-gradient(circle at 85% 25%, rgba(27,120,182,0.10) 0%, rgba(27,120,182,0.00) 55%);
  pointer-events: none;
}

.bb-card-blue h3{
  margin: 0 0 8px 0;
  font-weight: 800;
  letter-spacing: 0.01em;
  font-size: 22px;
  line-height: 1.1;
  color: #0f2d3d;
}

.bb-card-blue p{
  margin: 0 0 10px 0;
  line-height: 1.6;
  font-size: 14px;
  color: #243b4a;
}

.bb-card-blue p:last-child{
  margin-bottom: 0;
}


/* -----------------------------
   NUTRITION – compact “clean list” styling (softer purple)
   Targets the HTML you pasted: .bb-nutrition-wrap, .bb-nutrition-legend, .bb-nutrition-item, etc.
------------------------------ */

.bb-nutrition-tab{
  margin-top: 18px;
}

/* Outer card */
.bb-nutrition-wrap{
  background: linear-gradient(180deg, #f6f4ff 0%, #efeaff 100%);
  color: #1f2330;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(90, 76, 166, 0.18);
  box-shadow: 0 10px 22px rgba(0,0,0,0.06);
  margin: 10px 0 22px 0;
}

/* Title strip */
.bb-nutrition-title{
  padding: 12px 14px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 12px;
  background: rgba(90, 76, 166, 0.08);
  color: #2b2350;
  border-bottom: 1px solid rgba(90, 76, 166, 0.14);
}

/* Legend/header row */
.bb-nutrition-legend{
  display: grid;
  grid-template-columns: 2.2fr 0.7fr 1.1fr 1fr 0.9fr;
  gap: 0;
  padding: 10px 12px;
  font-weight: 800;
  font-size: 12px;
  color: #3a2f6b;
  background: rgba(90, 76, 166, 0.06);
  border-bottom: 1px solid rgba(90, 76, 166, 0.12);
}

.bb-nutrition-legend > div{
  padding: 6px 6px;
}

.bb-nutrition-legend > div:nth-child(n+2){
  text-align: center;
}

/* List container */
.bb-nutrition-list{
  padding: 6px 8px 10px 8px;
}

/* Group divider */
.bb-nutrition-group{
  margin: 10px 8px 6px 8px;
  padding: 8px 10px;
  background: rgba(90, 76, 166, 0.08);
  border: 1px solid rgba(90, 76, 166, 0.12);
  border-radius: 12px;
  font-weight: 900;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #2b2350;
}

/* Each row item */
.bb-nutrition-item{
  display: grid;
  grid-template-columns: 2.2fr 0.7fr 1.1fr 1fr 0.9fr;
  align-items: center;
  gap: 0;
  margin: 6px 6px;
  border-radius: 12px;
  border: 1px solid rgba(90, 76, 166, 0.12);
  background: rgba(255,255,255,0.70);
  overflow: hidden;
}

/* Subtle alternating feel without heavy colour blocks */
.bb-nutrition-item:nth-child(even){
  background: rgba(255,255,255,0.55);
}

/* Cell spacing */
.bb-nutrition-item > div{
  padding: 9px 8px;
  font-size: 12px;
  line-height: 1.25;
}

/* Nutrient label */
.bb-nutrition-name{
  font-weight: 650;
  color: #1f2330;
}

/* UOM and numeric columns */
.bb-nutrition-uom,
.bb-nutrition-100,
.bb-nutrition-50,
.bb-nutrition-nrv{
  text-align: center;
  font-variant-numeric: tabular-nums;
  color: #1f2330;
}

/* NRV column – present, but not shouting */
.bb-nutrition-nrv{
  font-weight: 850;
  background: rgba(90, 76, 166, 0.06);
}

/* Make long labels breathe slightly */
.bb-nutrition-name{
  padding-left: 10px;
}

/* Responsive adjustments */
@media (max-width: 900px){
  .bb-nutrition-legend,
  .bb-nutrition-item{
    grid-template-columns: 1.7fr 0.6fr 0.95fr 0.9fr 0.85fr;
  }
}

@media (max-width: 640px){
  .bb-card-blue{
    padding: 16px 14px;
    border-radius: 14px;
  }

  .bb-card-blue h3{
    font-size: 20px;
  }

  .bb-nutrition-title{
    font-size: 11px;
    padding: 10px 12px;
  }

  .bb-nutrition-legend{
    padding: 8px 10px;
    font-size: 11px;
  }

  .bb-nutrition-item > div{
    padding: 8px 6px;
    font-size: 11px;
  }

  .bb-nutrition-group{
    margin: 10px 6px 6px 6px;
    padding: 8px 10px;
    border-radius: 10px;
    font-size: 11px;
  }
}

/* -----------------------------
   HEADINGS – WPBakery Wolverine Heading
   Purple title variant (final)
   Scoped via extra class: .purple-heading-color
------------------------------ */

/* Small top heading: WHAT WE DO (neutral) */
.wolverine-heading.purple-heading-color h3 {
    color: #6f6f6f !important;
}

/* Main heading: A STORY ABOUT US (purple + bold) */
.wolverine-heading.purple-heading-color h2 {
    color: #7967a6 !important;
    font-weight: 700 !important;
}

/* Remove the theme icon completely */
.wolverine-heading.purple-heading-color i {
    display: none !important;
}

/* Remove any container-generated dividers
   (prevents divider appearing after paragraph) */
.wolverine-heading.purple-heading-color::before,
.wolverine-heading.purple-heading-color::after {
    content: none !important;
    display: none !important;
}

/* Divider directly under the H2 (correct position) */
.wolverine-heading.purple-heading-color h2::after {
    content: "";
    display: block;
    width: 56px;
    height: 3px;
    margin: 18px auto 0 auto;
    background-color: #7967a6 !important;
}

/* Paragraph styling – normal body copy */
.wolverine-heading.purple-heading-color p {
    margin-top: 26px !important;
    font-style: normal !important;
    font-family: inherit !important;
    font-weight: 400 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    color: inherit;
}


/* -----------------------------
   QUOTES – WPBakery Wolverine Quotes colour override (Nutrinamic blue)
   Scoped via extra class: .quote-color
------------------------------ */

/* Quote text */
.wolverine-quotes.quote-color .quotes-item p {
    color: #009edb !important;
}

/* Decorative quote marks inside the text */
.wolverine-quotes.quote-color .quotes-item::before,
.wolverine-quotes.quote-color .quotes-item::after,
.wolverine-quotes.quote-color .quotes-item p::before,
.wolverine-quotes.quote-color .quotes-item p::after {
    color: #009edb !important;
}

/* Big quotation icon container (square border) */
.wolverine-quotes.quote-color .quotes-icon,
.wolverine-quotes.quote-color .quote-icon {
    border-color: #009edb !important;
}

/* Big quotation icon glyph (icon font via ::before) */
.wolverine-quotes.quote-color .quotes-icon i,
.wolverine-quotes.quote-color .quote-icon i,
.wolverine-quotes.quote-color .quotes-icon i::before,
.wolverine-quotes.quote-color .quote-icon i::before {
    color: #009edb !important;
}

/* Author text (name under the quote) */
.wolverine-quotes.quote-color .quotes-item span {
    color: #009edb !important;
    background: none !important;
}

/* Thin divider line (drawn via pseudo-elements, NOT the span itself) */
.wolverine-quotes.quote-color .quotes-item span::before,
.wolverine-quotes.quote-color .quotes-item span::after {
    background-color: #009edb !important;
    border-color: #009edb !important;
}


/* -----------------------------
   BUTTONS – WPBakery Wolverine Button
   Purple variant via extra class: .purple-button
   Supports: class on the <a> OR on a parent wrapper
------------------------------ */

/* Case A: extra class is on the <a> itself */
a.wolverine-button.purple-button {
    background-color: #7967a6 !important;
    border-color: #7967a6 !important;
    color: #ffffff !important;
}

/* Case B: extra class is on a wrapper/row/module around the <a> */
.purple-button a.wolverine-button {
    background-color: #7967a6 !important;
    border-color: #7967a6 !important;
    color: #ffffff !important;
}

/* Hover / focus (both cases) */
a.wolverine-button.purple-button:hover,
a.wolverine-button.purple-button:focus,
.purple-button a.wolverine-button:hover,
.purple-button a.wolverine-button:focus {
    background-color: #6a5b96 !important;
    border-color: #6a5b96 !important;
    color: #ffffff !important;
}

/* Optional: smooth hover */
a.wolverine-button.purple-button,
.purple-button a.wolverine-button {
    transition: background-color 0.25s ease, border-color 0.25s ease, color 0.25s ease;
}

/* -----------------------------
   UNDERLINE – Testimonials underline (purple border only)
   Scoped via extra class: .purple-underline
------------------------------ */

.wolverine-testimonial.purple-underline h3::after,
.purple-underline .wolverine-testimonial h3::after {
    background: transparent !important;   /* prevents purple “block” */
    border-color: #7967a6 !important;     /* recolours the underline */
}



/* -----------------------------
   FOOTER – Accent colour + footer logo swap
   PAGE ONLY: ID 1650
------------------------------ */

/* =============================
   1) Accent colour fix (Read more, dates, etc.)
   ============================= */

/* Read more text */
.page-id-1650 .main-footer-wrapper .footer-logo-read-more a,
.page-id-1650 .main-footer-wrapper .footer-logo-read-more a:visited {
    color: #009edb !important;
    text-decoration-color: #009edb !important;
    outline-color: #009edb !important;
}

/* Other footer accent text */
.page-id-1650 .main-footer-wrapper .post-date,
.page-id-1650 .main-footer-wrapper .entry-date,
.page-id-1650 .main-footer-wrapper .time,
.page-id-1650 .main-footer-wrapper .date,
.page-id-1650 .main-footer-wrapper .meta a,
.page-id-1650 .main-footer-wrapper a.read-more,
.page-id-1650 .main-footer-wrapper a.readmore {
    color: #009edb !important;
    text-decoration-color: #009edb !important;
}

/* Prevent hover colour switching */
.page-id-1650 .main-footer-wrapper a:hover,
.page-id-1650 .main-footer-wrapper a:focus {
    color: #009edb !important;
    text-decoration-color: #009edb !important;
}


/* =============================
   2) Footer logo swap (this page only)
   ============================= */

.page-id-1650 #wolverine-footer-logo-4 .footer-logo-img,
.page-id-1650 #wolverine-footer-logo-4 img.footer-logo-img {
    width: 150px !important;
    height: auto !important;
    max-width: 100%;
}


/* =============================
   3) Read More arrow – circle colour ONLY
   ============================= */

/* Change the circular background (was green) */
.page-id-1650 .footer-logo-read-more span {
    background-color: #eabad6 !important;
}

/* Explicitly keep the arrow icon white */
.page-id-1650 .footer-logo-read-more span i {
    color: #ffffff !important;
}

/* =============================
   4) Footer "Follow Us:" label colour
   PAGE ONLY: ID 1650
============================= */

/* Change Follow Us text colour */
.page-id-1650 #g5plus-social-profile-2 span {
    color: #009edb !important;
}

/* -----------------------------
   WOOCOMMERCE – Price colour override
   Currency symbol + numbers
   PAGE ONLY
------------------------------ */

.page-id-1650 .woocommerce-Price-amount,
.page-id-1650 .woocommerce-Price-amount bdi,
.page-id-1650 .woocommerce-Price-currencySymbol {
    color: #009edb !important;
}

/* -----------------------------
   TESTIMONIALS – Author name colour (force purple)
   Scoped via extra class: .purple-underline
------------------------------ */

/* Override theme rule */
.wolverine-testimonial.style4.purple-underline .testimonial-info span {
    color: #7967a6 !important;
}

.wolverine-testimonial.style4.purple-underline .testimonial-info {
    color: inherit !important;
}


.purchase-bottom {
    display: none !important;
}

/* -----------------------------
   HEADINGS – WPBakery Wolverine Heading
   Purple title variant with LEFT-aligned underline
   Scoped via extra class: .purple-heading-color-sideline
------------------------------ */

/* Small top heading: WHAT WE DO */
.wolverine-heading.purple-heading-color-sideline h3 {
    color: #6f6f6f !important;
}

/* Main heading: A STORY ABOUT US */
.wolverine-heading.purple-heading-color-sideline h2 {
    color: #7967a6 !important;
    text-align: left !important;
    font-weight: 700 !important; /* keep it bold like your other version */
}

/* Remove any theme-generated dividers/icons */
.wolverine-heading.purple-heading-color-sideline i,
.wolverine-heading.purple-heading-color-sideline::before,
.wolverine-heading.purple-heading-color-sideline::after {
    display: none !important;
    content: none !important;
}

/* LEFT-aligned underline directly under H2 */
.wolverine-heading.purple-heading-color-sideline h2::after {
    content: "";
    display: block;
    width: 56px;
    height: 3px;
    margin: 16px 0 0 0;   /* left aligned */
    background-color: #7967a6 !important;
}

/* Paragraph styling (normal body copy) */
.wolverine-heading.purple-heading-color-sideline p {
    margin-top: 22px !important;
    text-align: left !important;
    font-style: normal !important;
    font-family: inherit !important;
    font-weight: 400 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
}

/* Scale ONLY the Big Baby footer logo */
#wolverine-footer-logo-4 .footer-logo-img {
    width: 150px !important;
    max-width: 150px !important;
    height: auto !important;
}

.wolverine-quotes.style2.quote-text-lg .quotes-item p {
  font-size: 25px;
}

@media (max-width: 768px) {
  .wolverine-quotes.style2.quote-text-lg .quotes-item p {
    font-size: 18px;
  }
}

.wolverine-quotes.style2.quote-text-lg .quotes-item {
  display: flex;
  align-items: center;      /* vertical centring */
  justify-content: center;  /* horizontal centring */
  text-align: center;
}
