/* ===== Layout tightening overrides ===== */

/* ---- News/recipes listing headings ---- */
.blockspotlight h3,
.newscont-right h1 {
  font-family: 'Yanone Kaffeesatz', sans-serif !important;
}

/* ===== Layout tightening overrides ===== */

/* ---- News/recipes listing headings ---- */
.blockspotlight h3,
.newscont-right h1 {
  font-family: 'Yanone Kaffeesatz', sans-serif !important;
}

/* ---- Dropdown subcategory list ---- */
.dropdown-subcatlist {
  list-style: none !important;
  margin: 2px 0 6px 0 !important;
  padding: 0 !important;
}
.dropdown-subcat a:link,
.dropdown-subcat a:visited {
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #656a51 !important;
  padding: 3px 24px 3px 32px !important;
  letter-spacing: 0.03em !important;
  text-transform: none !important;
  border-left: none !important;
  opacity: 0.85;
}
.dropdown-subcat a:hover {
  color: #490047 !important;
  background-color: #e4c7d8 !important;
  opacity: 1;
}

/* ---- Dropdown panel ---- */
.dropdown-inner {
  background-color: #f0ece6 !important;
  border-top: 4px solid #490047 !important;
  box-shadow: 0 8px 24px rgba(73,0,71,0.12) !important;
  padding: 24px 30px 28px !important;
  min-height: 0 !important;
}
.dropdowngrid {
  gap: 0 !important;
  padding: 0 !important;
}
.dropdowngriditem {
  border-left: 1px solid #e4c7d8;
  padding: 4px 0;
}
.dropdowngriditem:first-child {
  border-left: none;
}
.dropdowngriditem ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.dropdowngriditem li a:link,
.dropdowngriditem li a:visited {
  font-family: 'Yanone Kaffeesatz', sans-serif !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  color: #656a51 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  padding: 8px 24px !important;
  display: block !important;
  background-image: none !important;
  border-left: 3px solid transparent;
  transition: border-color 0.15s, color 0.15s, background 0.15s !important;
}
.dropdowngriditem li a:hover {
  color: #490047 !important;
  background-color: #e4c7d8 !important;
  border-left-color: #490047 !important;
}
.dropdowngrid a:link,
.dropdowngrid a:visited,
.dropdowngrid a:hover {
  color: #656a51 !important;
}

/* ---- Global containers: 1520px cap ---- */
.contentcontainer, #footer, #menu, .brochuredownloadscont, #topnavcont,
.dropdown-inner, .navbar, #homeslider, .hotmtwoinner, .homecategoriesinner,
.container, .homeboxes, .productboxes {
  max-width: 1520px !important;
}

/* ---- Hero / carousel ---- */
.fullwidthcont {
  /*max-width: 1280px !important;*/
  margin-left: auto;
  margin-right: auto;
}
.homelargephoto img {
  width: 100% !important;
  object-fit: cover;
}
.fullwidthcont {
  margin-top: 0px !important;
}

/* ---- Banner slide overlays ---- */
.banner-slide {
  position: relative;
  display: block;
  line-height: 0;
}
.banner-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 18px 28px 20px;
  background: linear-gradient(transparent, rgba(0,0,0,0.52));
  text-align: left;
  line-height: 1.3;
}
.banner-overlay-title {
  font-family: 'Dancing Script', cursive !important;
  font-size: 30px !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin: 0 0 4px !important;
  text-shadow: 0 1px 4px rgba(0,0,0,0.45);
}
.banner-overlay-sub {
  font-family: 'Yanone Kaffeesatz', sans-serif !important;
  font-size: 17px !important;
  font-weight: 400 !important;
  color: rgba(255,255,255,0.92) !important;
  margin: 0 !important;
  text-shadow: 0 1px 3px rgba(0,0,0,0.35);
}

/* ---- Base typography ---- */
body {
  font-size: 21px !important;
}
.pure-g [class*="pure-u"] {
  font-size: 21px !important;
}
#content p {
  line-height: 1.5em;
}

/* ---- Logo ---- */
.logo img {
  max-width: 200px !important;
}

/* ---- Header spacing ---- */
#topnavcont {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
  align-items: center !important;
}
#topnavcont > div {
  align-self: center !important;
}
.topleftimage {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.topbasket {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
#header .basket {
  font-size: 16px;
  margin-bottom: 10px;
  display: flex !important;
  float: none !important;
  width: 100% !important;
  justify-content: space-between !important;
  align-items: center !important;
}
.topbasket > div {
  display: inline-flex;
  flex-direction: column;
  align-items: stretch;
}
#header .basket .social-icon {
  color: #646853;
  font-size: 18px;
  margin-right: 12px;
  text-decoration: none !important;
  vertical-align: middle;
}
#header .basket .header-fav-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  font-size: 20px;
  line-height: 1;
  color: #646853;
  text-decoration: none !important;
  margin: 0 8px;
}
#header .basket .header-fav-link:hover {
  color: #966c94;
}
#header .basket .social-icon:hover {
  color: #966c94;
}
#header .search {
  margin-top: 3px;
}
#header .search .form-control {
  width: 300px;
  font-size: 16px !important;
  padding: 4px 36px 4px 8px !important;
}
#header .search .form-inline {
  position: relative;
  display: inline-block;
}
#header .search .btn-default {
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
  background-color: transparent !important;
}
.topleftimage img {
  max-height: 85px !important;
  width: auto !important;
}

/* ---- Navbar ---- */
.navbar {
  padding-left: 15px !important;
  padding-right: 15px !important;
}
/* ---- Category breadcrumb banner: align with navbar ---- */
.catherbplants .hometext {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.catherbplants .hometextinner {
  padding-left: 15px;
  padding-right: 15px;
}
.navbar a:link, .navbar a:visited {
  font-size: 22px !important;
  padding: 12px 6px !important;
  margin: 0px 8px !important;
  /* 2. Letter-spacing */
  letter-spacing: 0.07em !important;
  /* 5. Scale transition */
  transition: transform 0.18s ease !important;
  position: relative;
}
/* 5. Subtle scale on hover */
.navbar > .dropdown:hover > a,
.navbar > .dropdown > a:hover {
  transform: scale(1.06) !important;
  display: inline-block;
}
/* 6. Bottom border indicator on hover & active */
.navbar > .dropdown > a:hover,
.navbar > .dropdown > a.nav-active {
  border-bottom: 3px solid currentColor !important;
  padding-bottom: 9px !important;
}
/* 4. Bold active page */
.navbar > .dropdown > a.nav-active {
  font-weight: 700 !important;
}
/* 3. Dot separator — positioned on the <a> itself, not .dropdown */
.navbar > .dropdown + .dropdown > a::before {
  content: '·';
  position: absolute;
  left: -10px;
  top: 50%;
  transform: translateY(-50%);
  color: rgba(255,255,255,0.5);
  font-weight: 300;
  pointer-events: none;
}
/* Fix: .dropdown must NOT be position:relative — it has overflow:hidden which
   would clip the absolutely-positioned dropdown-content panel */
.navbar > .dropdown {
  overflow: visible !important;
}
/* 7. Staggered fade-in for dropdown grid items */
.dropdowngriditem {
  opacity: 0;
  transform: translateY(-6px);
  transition: opacity 0.22s ease, transform 0.22s ease;
}
.dropdown:hover .dropdowngriditem {
  opacity: 1;
  transform: translateY(0);
}
.dropdown:hover .dropdowngriditem:nth-child(1) { transition-delay: 0.04s; }
.dropdown:hover .dropdowngriditem:nth-child(2) { transition-delay: 0.09s; }
.dropdown:hover .dropdowngriditem:nth-child(3) { transition-delay: 0.14s; }
.dropdown:hover .dropdowngriditem:nth-child(4) { transition-delay: 0.19s; }
.dropdown:hover .dropdowngriditem:nth-child(5) { transition-delay: 0.24s; }

.dropdowngriditem a:link, .dropdowngriditem a:visited {
  font-size: 22px !important;
}
.dropdown-inner {
  padding-top: 15px !important;
  min-height: 100px !important;
}
.dropdowngrid {
  gap: 20px !important;
  padding: 8px 20px !important;
}
.dropdown-content li a {
  font-size: 13px !important;
}

/* ---- Headings ---- */
.homecategoriesinner h2 { font-size: 32px !important; }
.catherbplants h2       { font-size: 36px !important; }
#readytoplant-banner,
#hotm_one { background-color: #490047 !important; }
#delivering { background-color: #646853 !important; }
#readytoplant-banner h2,
#hotm_one h2,
#delivering h2 {
  font-size: 36px !important;
  padding: 20px 0px 20px 205px !important;
  margin: 0 !important;
  color: #fff !important;
  background-image: url(/images/hettysh1.png) !important;
  background-repeat: no-repeat !important;
  background-position: left center !important;
  background-color: transparent !important;
  display: inline-block !important;
  width: auto !important;
  box-sizing: border-box !important;
}
.productheadline        { font-size: 36px !important; }
.homeconnect h1,
.homeconnect .foragarden { font-size: 36px !important; }
.productintro           { font-size: 20px !important; }
.productsubheadline     { font-size: 20px !important; }

/* ---- Home "for a garden" section ---- */
.homeconnect .quality {
  font-size: 18px !important;
  width: 150px;
  height: 44px;
  line-height: 42px;
  margin: 0 15px 0 0 !important;
}
.homeright {
  font-size: 16px !important;
  padding: 30px 15px 0px 15px !important;
}
.homeconnectcont {
  padding-bottom: 0;
}

/* ---- Product cards ---- */
.product .thumbnail {
  position: relative;
  padding-bottom: 100%;
  height: 0;
  overflow: hidden;
  background-size: cover;
  background-position: center center;
}
.product .thumbnail a {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  display: block;
}
.product .thumbnail img { display: none; }
.product .product_info {
  padding: 3px 6px;
  display: flex;
  flex-direction: column;
}
.product .product_info > a {
  flex: 1;
  overflow: hidden;
  display: block;
}
.product .product_info .product_title {
  font-size: 12px !important;
  height: 18px;
  overflow: hidden;
}
.product .product_info .product_subtitle {
  font-size: 11px !important;
  line-height: 1.1;
  margin: 1px 0;
}
.product .product_info .product_starting {
  font-size: 12px;
  margin: 2px 0 0;
}
.product .product_info .product_soldout {
  font-size: 12px;
  color: #888;
  margin: 2px 0 0;
}
.product .btn { font-size: 12px !important; padding: 4px 10px !important; }

/* ---- Home slider product cards (override the generic product card minimisation above) ---- */
#homeslider .product {
  display: flex;
  flex-direction: column;
}
#homeslider .product > a {
  flex: 1;
  display: flex;
  flex-direction: column;
}
#homeslider .product .product_info {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 8px 12px;
}
#homeslider .product .product_info .product_title {
  font-size: 24px !important;
  height: auto !important;
  overflow: visible;
}
#homeslider .product .product_info .product_subtitle {
  font-size: 14px !important;
  line-height: 1.3;
  margin: 2px 0;
}
#homeslider .product .product_info .product_starting {
  font-size: 14px;
  margin-top: auto;
  padding-top: 6px;
}

/* ---- Herbs of the Month ---- */
#hotm_two .herbsofthemonth .title { font-size: 20px !important; overflow: hidden; }
#hotm_two .herbsofthemonth .subheading { font-size: 17px !important; }
#hotm_two .herbsofthemonth .info { font-size: 15px; height: 90px; }

/* ---- Delivering section ---- */
#delivering_two { padding: 40px 0 0 !important; font-size: 16px !important; }
#delivering_two h3 { font-size: 26px !important; padding: 0 0 15px !important; }

/* ---- Buttons ---- */
a:link.btn, a:visited.btn, .btn { font-size: 21px !important; padding: 8px 20px !important; }
a:link.btnadd, a:visited.btnadd, input.btnadd { font-size: 21px !important; }

/* ---- Form inputs ---- */
input:not([type="file"]), select, textarea {
  font-size: 21px !important;
  padding: 10px !important;
}

/* ---- Footer ---- */
#footer { padding-top: 30px !important; padding-bottom: 30px !important; }
#footer h3 { font-size: 26px !important; }
#footercont { padding: 25px 0 40px !important; font-size: 14px !important; }

/* ---- Collections & hints banner ---- */
#collectionshints { padding: 40px 0 25px !important; }

/* ---- Inner sections ---- */
.homeconnect, .hotmtwoinner, .hettyshintscont {
  max-width: 1080px !important;
}

/* ---- Cart popup ---- */
#cart-popup-wrapper h2 { font-size: 16px !important; }

/* ---- News pages ---- */
.newscont-right, .newsintro { padding: 60px 60px 30px 60px !important; }
.newscont-left { padding: 60px !important; }

/* ---- Breadcrumb / page headings ---- */
.pageheading h2 { font-size: 22px !important; }

/* ---- Category grid ---- */
.categorygriditem a:link, .categorygriditem a:visited {
  font-size: 18px !important;
}
.homeboxes { font-size: 18px !important; }

/* ---- Footer newsletter button ---- */
#footer .btnproduct {
  background-color: #fff !important;
  color: #646853 !important;
  border-color: #fff !important;
}
#footer .btnproduct:hover {
  background-color: #e8e8e8 !important;
  color: #646853 !important;
  border-color: #e8e8e8 !important;
}

/* ---- Footer payment cards ---- */
.footer-payment-cards {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 4px 0;
}
.footer-payment-cards img {
  width: 50px !important;
  height: 50px !important;
  object-fit: contain;
  display: inline-block;
}
.footer-payment-cards img.payment-card-wide {
  width: auto !important;
  height: 36px !important;
  max-width: 110px !important;
}