/* =========================================
   Brand Colours - The Cultivated System
   ========================================= */
:root{
  --primary:#3B6E4D;
  --secondary:#A9CBB7;
  --accent-1:#C98C70;
  --accent-2:#E6C96D;

  --text-dark:#3E3B32;
  --text-light:#FFFFFF;
  --background:#F8F5F1;

  --success:#7BAE7F;
  --warning:#D9A441;
  --error:#C45B5B;

  --container-max:1200px;

  /* Banner defaults (global, consistent) */
  --banner-bg:#4C6A4C;
  --banner-text:#FFFFFF;
  --banner-image:none;
  --banner-overlay-opacity:0;
  --banner-height:65vh;   /* <-- standardised height */
}

/* =========================================
   Global / Base
   ========================================= */
*,*::before,*::after{box-sizing:border-box;}
html,body{height:100%;}
body{
  background-color:var(--background);
  color:var(--text-dark);
  font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
  margin:0;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img,svg,video{max-width:100%;display:block;height:auto;}
.container{
  max-width:var(--container-max);
  margin-inline:auto;
  padding-inline:1.25rem;
}

/* =========================================
   Typography
   ========================================= */
h1,h2,h3,h4,h5,h6,
.display-1,.display-2,.display-3,.display-4,
h1.fw-bold,h2.fw-bold,h3.fw-bold,h4.fw-bold,h5.fw-bold,h6.fw-bold{
  font-family:"Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-weight:300 !important;
  line-height:1.2;
  letter-spacing:normal;
  margin-bottom:.75rem;
  color:var(--text-dark);
}
.heading-green{color:var(--primary) !important;}
.heading-white{color:#fff !important;}
p{margin:0 0 1em;}
.lead{
  font-weight:300;
  font-size:1.25rem;
  line-height:1.6;
  color:var(--text-dark);
}
.section-subtitle,.section-intro{
  font-weight:300;
  font-size:clamp(1.05rem,1.1vw,1.25rem);
  line-height:1.6;
  color:rgba(62,59,50,.85);
  max-width:800px;
  margin-inline:auto;
}
a{color:var(--primary);text-decoration:none;}
a:hover,a:focus{color:var(--accent-1);}

/* =========================================
   Buttons
   ========================================= */
.cta-button, a.cta-button, button.cta-button{
  display:inline-flex; width:auto; max-width:max-content;
  align-items:center; justify-content:center; gap:.4rem;
  text-decoration:none; line-height:1;
  padding:.75rem 1.5rem; border-radius:6px; border:none; cursor:pointer;
  background-color:#fff; color:var(--banner-bg);
  transition:background .3s ease, transform .06s ease, color .2s ease;
  vertical-align:middle; align-self:flex-start;
}
.cta-button:hover{background-color:#e0e0e0;}
.cta-button:active{transform:translateY(1px);}
button.primary, .btn-primary{
  background-color:var(--primary); color:var(--text-light);
  border:none; padding:.6em 1.2em; border-radius:6px; cursor:pointer;
  transition:transform .06s ease, opacity .2s ease, background-color .2s ease;
}
button.primary:hover, .btn-primary:hover{background-color:var(--secondary);}
button.primary:active, .btn-primary:active{transform:translateY(1px);}
.btn-outline-primary{
  background:transparent; border:2px solid var(--accent-1); color:var(--accent-1);
  padding:.55em 1.15em; border-radius:6px; cursor:pointer;
  transition:background-color .2s ease, color .2s ease, border-color .2s ease;
}
.btn-outline-primary:hover,.btn-outline-primary:focus{
  background-color:var(--accent-1); color:var(--text-light); border-color:var(--accent-1);
}

/* =========================================
   Navbar
   ========================================= */
.navbar{
  background-color:#F4F2ED;
  border-bottom:1px solid #A6B89A;
  padding-block:1rem;
}
.navbar .container{display:flex;align-items:center;gap:clamp(.5rem,2vw,1.25rem);}
.navbar-brand{font-weight:700;color:#5A5E4D;}
.navbar-brand img{height:64px !important;width:auto;}
.navbar-collapse{flex:1 1 auto;}
.navbar-nav{
  display:flex; align-items:center; flex:1 1 auto; flex-wrap:nowrap;
  gap:clamp(1rem,1.8vw,1.5rem); min-width:0;
}
.navbar-nav .nav-item:last-child{margin-left:auto;}
.navbar-nav .nav-link{
  font-family:"Montserrat","Helvetica Neue",Helvetica,Arial,sans-serif;
  letter-spacing:.01em; font-weight:500;
  font-size:clamp(.9rem,.85vw,.98rem);
  line-height:1.35; white-space:nowrap; color:#2E3B3A;
}
.navbar-nav .nav-link:hover,.navbar-nav .nav-link:focus{color:var(--primary);}
.navbar-nav .nav-item:last-child .btn{
  font-family:"Montserrat","Helvetica Neue",Helvetica,Arial,sans-serif;
  font-weight:500; font-size:.95rem; letter-spacing:.01em;
  padding:.55rem 1rem; line-height:1.2; border-radius:8px; flex-shrink:0;
}

/* =========================================
   Sections
   ========================================= */
section{padding-top:4rem;padding-bottom:4rem;}
.bg-light{background-color:#F4F2ED !important;}
.hero{
  background:#86b89a; color:#fff; padding:6rem 2rem; text-align:center;
}


/* =========================================
    Cookie consent form
    ========================================
    /* Brand-coloured checkboxes */
.form-check-input:checked {
  background-color: #1e2928 !important; /* dark green fill */
  border-color: #1e2928 !important;     /* dark green border */
}

.form-check-input:focus {
  border-color: #1e2928 !important;
  box-shadow: 0 0 0 0.2rem rgba(30, 41, 40, 0.25) !important; /* subtle green glow */
}

/* =========================================
   Banner
   ========================================= */
.banner{
  position:relative; display:flex; align-items:stretch; justify-content:space-between;
  color:var(--banner-text);
  min-height:var(--banner-height,65vh);
  overflow:hidden; isolation:isolate;
}
.banner-content{
  position:relative; z-index:2; flex:1 1 50%;
  display:flex; flex-direction:column; justify-content:center;
  padding:clamp(1.5rem,3vw,3rem); text-align:left; background-color:var(--banner-bg);
}
.banner-content h1, .banner-content p{color:#fff !important;}
.banner h1{font-size:clamp(2rem,4vw,3rem);}
.banner p{font-size:clamp(1rem,1.5vw,1.25rem); margin:0; max-width:48ch;}
.banner-image{
  flex:1 1 50%;
  background-image:var(--banner-image);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.banner.banner--overlay::before{
  content:""; position:absolute; inset:0; z-index:1;
  background-image:var(--banner-image);
  background-size:cover; background-position:center; background-repeat:no-repeat;
  opacity:var(--banner-overlay-opacity);
}
@media (max-width:900px){
  .banner{flex-direction:column;}
  .banner-image{height:300px;}
}

/* =========================================
   Values Section
   ========================================= */
.values-icon{width:50px;height:auto;}
.principle-card{
  background:#fff; border-radius:1rem; padding:1rem;
}
.principle-card h4{color:var(--primary); font-weight:700;}
.principle-card p{color:var(--text-dark);}
@media (max-width:767.98px){
  .principle-card .d-flex{flex-direction:column;align-items:center;justify-content:center;text-align:center;}
  .principle-card .values-icon{display:block;margin:0 auto .75rem auto;}
  .principle-card h4{text-align:center;}
}

/* =========================================
   Harvest the Outcomes (new)
   ========================================= */
.harvest-section {
  font-family: 'Inter', sans-serif;
}
.harvest-card {
  background: #fff;
  border-radius: 1rem;
  padding: 1.5rem;
  height: 100%;
  display: flex;
  align-items: center;
  gap: 1rem;
  box-shadow: 0 6px 16px rgba(0,0,0,.06);
  border: 1px solid rgba(0,0,0,.06);
}
.harvest-icon {
  display: inline-grid;
  place-items: center;
  width: 50px;
  height: 50px;
  font-size: 28px;
  line-height: 1;
  border-radius: 12px;
  background: #F4F2ED;
  color: var(--primary);
  flex-shrink: 0;
}
.harvest-card p {
  margin: 0;
  font-size: 1rem;
  color: var(--text-dark);
}
@media (min-width: 1200px) {
  .harvest-icon {
    width: 56px;
    height: 56px;
    font-size: 30px;
  }
}


/* =========================================
   Price Comparison Table (Complete Styles)
   ========================================= */

/* Wrapper */
.price-comparison {
  background-color: var(--background);
  font-family: 'Inter', sans-serif;
}

/* Table base */
.comparison-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  text-align: center;
}


/* ---- THEAD (keep your heading styles; only do layout/colors) ---- */
.comparison-table thead th {
  /* DO NOT set font-family/size/weight here to avoid overriding your headings */
  color: var(--text-light);
  padding: 1rem;
  vertical-align: top;
  border: 1px solid rgba(255,255,255,.15);
}

.comparison-table thead h4,
.comparison-table thead p {
  color: var(--text-light);        /* ensure white text on colored headers */
  margin: 0;
}

.comparison-table thead p {
  font-size: .9rem;
  font-weight: 300;
  line-height: 1.35;
}

/* First (feature) column header cell stays neutral */
.comparison-table thead th:first-child {
  background: #f4f2ed;
  color: var(--text-dark);
  border-color: #ddd;
}

/* ---- COLUMN COLOUR BANDS (headers & footer cells only) ---- */
.comparison-table th.col-green-1,
.comparison-table tfoot td.col-green-1 {
  background-color: #8a9171;
  color: #fff;
}

.comparison-table th.col-green-2,
.comparison-table tfoot td.col-green-2 {
  background-color: #496d50;
  color: #fff;
}

.comparison-table th.col-green-3,
.comparison-table tfoot td.col-green-3 {
  background-color: #3c4438;
  color: #fff;
}

.comparison-table th.col-green-4,
.comparison-table tfoot td.col-green-4 {
  background-color: #1e2928;
  color: #fff;
}

.comparison-table .old-price {
  text-decoration: line-through;
  opacity: .9;
  color: #fff;
  background: #6D3B47; /* brand accent for contrast */
  padding: 2px 8px;
  border-radius: 6px;
}

/* ---- TBODY ---- */
.comparison-table tbody td {
  border: 1px solid #ddd;
  padding: .75rem;
  font-family: 'Inter', sans-serif;   /* match the look & feel */
  font-size: 0.95rem;
  font-weight: 400;
  letter-spacing: .01em;              /* requested to match headings' spacing vibe */
  line-height: 1.4;
}

/* Zebra */
.comparison-table tbody tr:nth-child(even) {
  background-color: #f9f9f9;
}

/* Left feature labels */
.comparison-table tbody td:first-child {
  font-weight: 500;                   /* a touch bolder for readability */
  text-align: left;
  background-color: #f4f2ed;
}

/* ---- TFOOT (Prices) ---- */
.comparison-table tfoot td {
  border: 1px solid #ddd;
  padding: .9rem .75rem;
  font-family: 'Inter', sans-serif;   /* align with body */
  font-size: 1.0rem;
  font-weight: 600;                   /* keep prices bold */
  letter-spacing: .01em;
}

/* Left "Price" label cell */
.comparison-table tfoot td:first-child {
  background-color: #f4f2ed;
  color: var(--text-dark);
}

/* Slightly larger price row text if desired */
.comparison-table .pricing-row td {
  font-size: 1.05rem;
}

/* ---- Responsive niceties ---- */
@media (max-width: 991.98px) {
  .comparison-table thead p {
    font-size: .85rem;
  }
  .comparison-table tbody td,
  .comparison-table tfoot td {
    font-size: 0.95rem;
  }
}

@media (max-width: 575.98px) {
  .comparison-table {
    font-size: 0.95rem;
  }
  .comparison-table thead th,
  .comparison-table tbody td,
  .comparison-table tfoot td {
    padding: .65rem .5rem;
  }
}


/* =========================================
   Pillar
   ========================================= */
.pillar-icon {
  width: 75px;
  height: 75px;
  object-fit: contain;
}

/* =========================================
   Blog author
   ======================================== */

.author-card { border-radius: 12px; }
.author-avatar {
  width: 104px; height: 104px; 
  border-radius: 50%; object-fit: cover;
  display: block;
}
@media (min-width: 992px) {
  .author-avatar { width: 120px; height: 120px; }
}
/* Author avatar: square, rounded corners, fills the box */
.author-avatar--square{
  width: 120px;
  height: 120px;             /* makes it square */
  border-radius: 12px;        /* not a circle anymore */
  object-fit: cover;          /* fills the box */
  object-position: 50% 35%;   /* adjust framing: X% Y%; try 50% 35% or 50% 30% */
  display: block;
}

/* Optional: larger on desktop */
@media (min-width: 992px){
  .author-avatar--square{ width: 140px; height: 140px; }
}

/* Indent all paragraphs after the first one in the article body (md and up) */
@media (min-width: 768px){
  #article-body p:not(:first-of-type){
    padding-left: 1.5rem;   /* match the feel of the first para */
    padding-right: 1.5rem;
  }
}


/* =========================================
   Footer
   ========================================= */
footer.site-footer{
  background-color:#2E3B3A !important;
  color:var(--text-light);
  font-size:.95rem;
  padding-top:2rem; padding-bottom:2rem;
  position:relative;
  left:50%; right:50%;
  margin-left:-50vw; margin-right:-50vw;
  width:100vw;
}
.site-footer .container{position:relative;margin:0 auto;}
.site-footer .footer-heading{
  color:var(--secondary);
  letter-spacing:.04em;
  margin:0 0 .5rem;
}
.site-footer .footer-link{
  color:var(--text-light); text-decoration:none; border-bottom:1px solid transparent;
}
.site-footer .footer-link:hover,.site-footer .footer-link:focus{
  color:var(--accent-1); border-bottom-color:rgba(255,255,255,.25); outline:none;
}
.site-footer .footer-icon{
  display:inline-flex; width:40px; height:40px; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.25); border-radius:999px; color:var(--text-light); text-decoration:none;
}
.site-footer .footer-icon:hover,.site-footer .footer-icon:focus{color:var(--accent-2); border-color:var(--accent-2);}
.site-footer .footer-copy{color:rgba(255,255,255,.8); border-color:rgba(255,255,255,.2) !important;}