/* CSS RESET & BASE TYPOGRAPHY - Mobile first */
html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{
  margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;
  box-sizing:border-box;
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{
  display:block;
}
body{
  line-height:1.5;
  font-family:'Roboto', Arial, sans-serif;
  background-color:#F8F7F3;
  color:#233123;
  font-size:16px;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
  scroll-behavior: smooth;
}
img{
  max-width:100%;height:auto;display:block;
}
a{
  text-decoration:none;
  color:inherit;
  transition:color .2s;
}
ul,ol{
  list-style:none;
}
button,input,select,textarea{
  font:inherit;
  background:none;
  border:none;
  outline:none;
}

/* NATURAL COLORS PALETTE - earth tones and green accents */
:root {
  --primary: #1C2B49;     /* Brand Main Navy */
  --secondary: #27A5D8;   /* Brand Blue Accent */
  --accent: #F7F7F7;      /* Brand soft accent */
  --earth1: #EDE6DB;      /* Light sand backdrop */
  --earth2: #DDC9A3;      /* Sanded beige */
  --leaf: #44825B;        /* Deep green accent */
  --moss: #89A87A;        /* Moss green */
  --soil: #7C6540;        /* Soil brown */
  --alert: #e1643b;       /* Alert orange */
  --shadow: rgba(60,75,53,.10);
}

/* Main container utility */
.container {
  width:100%;
  max-width:1160px;
  margin:0 auto;
  padding-left:16px;
  padding-right:16px;
  display:flex;
  flex-direction:column;
}

/* HEADER & NAVIGATION */
header {
  background:var(--earth1);
  border-bottom:2px solid var(--earth2);
  box-shadow:0 3px 20px var(--shadow);
  position: relative;
  z-index: 300;
}
header .container{
  flex-direction:row;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding-top:16px;
  padding-bottom:16px;
}
.brand-logo img{
  height:44px;
  width:auto;
}
.main-nav {
  display:flex;
  align-items:center;
  gap:20px;
}
.main-nav a {
  font-family:'Montserrat',Arial,sans-serif;
  font-weight:500;
  font-size:16px;
  color:var(--primary);
  padding:6px 10px;
  border-radius:17px;
  transition:background .19s,color .19s;
}
.main-nav a:hover, .main-nav a.active {
  background:var(--moss);
  color:#fff;
}
.cta-btn {
  background:var(--leaf);
  color:#fff !important;
  font-family:'Montserrat',sans-serif;
  font-weight:700;
  border:none;
  padding:10px 26px;
  border-radius:28px;
  font-size:17px;
  margin-left:6px;
  margin-right:0;
  cursor:pointer;
  box-shadow:0 3px 12px var(--shadow);
  transition:background .20s,box-shadow .20s,transform .16s;
}
.cta-btn:hover, .cta-btn:focus {
  background:var(--moss);
  color:#fff;
  box-shadow:0 5px 20px var(--shadow);
  transform:translateY(-2px) scale(1.04);
}

/* MOBILE NAVIGATION -------------------------- */
.mobile-menu-toggle {
  display:inline-flex;
  background:var(--leaf);
  color:#fff;
  font-size:28px;
  border-radius:50%;
  border:none;
  width:44px;
  height:44px;
  align-items:center;
  justify-content:center;
  margin-left:15px;
  transition:background .2s;
  cursor:pointer;
  z-index: 305;
}
.mobile-menu-toggle:hover, .mobile-menu-toggle:focus{
  background:var(--moss);
}
.mobile-menu {
  display:none;
  position:fixed;
  top:0;left:0;
  width:100vw;
  height:100vh;
  background:rgba(237,230,219,0.96);
  box-shadow:0 4px 22px rgba(32,53,39,.13);
  z-index:400;
  flex-direction:column;
  align-items:flex-start;
  padding:40px 0 0 0;
  transform:translateX(-100vw);
  transition:transform .36s cubic-bezier(.89,.13,.25,1);
}
.mobile-menu.open {
  display:flex;
  transform:translateX(0);
}
.mobile-menu-close {
  position:absolute;
  top:22px;
  right:24px;
  font-size:34px;
  color:var(--primary);
  background:none;
  border:none;
  z-index:420;
  cursor:pointer;
  border-radius:50%;
  width:42px;height:42px;
  transition:background .2s;
}
.mobile-menu-close:hover, .mobile-menu-close:focus {
  background:var(--earth2);
  color:var(--leaf);
}
.mobile-nav {
  display:flex;
  flex-direction:column;
  gap:22px;
  width:100%;
  margin-top:48px;
  align-items:center;
}
.mobile-nav a{
  font-size:20px;
  font-family:'Montserrat',sans-serif;
  color:var(--primary);
  font-weight:600;
  border-radius:16px;
  padding:12px 25px;
  width:90%;
  text-align:center;
  margin:0 auto;
  transition:background .15s,color .2s;
}
.mobile-nav a:hover{
  background:var(--moss);
  color:#fff;
}
@media (max-width: 1020px) {
  .main-nav {
    gap:12px;
  }
  .cta-btn {
    padding:8px 16px;
  }
}
@media (max-width: 900px) {
  .main-nav {
    gap:6px;
    font-size:15px;
  }
}
@media (max-width: 850px) {
  .main-nav {
    gap:3px;
    font-size:13px;
  }
}
@media (max-width: 768px) {
  .main-nav {
    display:none;
  }
  .mobile-menu-toggle {
    display:inline-flex;
  }
}
@media (min-width: 769px) {
  .mobile-menu, .mobile-menu-toggle {display:none !important}
}

/* HERO SECTION -------------------------- */
.hero-section{
  background:linear-gradient(150deg, var(--earth1) 80%, var(--moss) 100%);
  min-height:390px;
  border-bottom-left-radius:50px 26px;
  border-bottom-right-radius:230px 74px;
  box-shadow: 0 7px 38px var(--shadow);
  margin-bottom:60px;
  padding:40px 0 10px 0;
}
.hero-section .container {
  min-height:390px;
  align-items:center;
  justify-content:center;
}
.hero-section .content-wrapper {
  max-width:740px;
  margin: 0 auto;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:24px;
  padding:10px 0 30px 0;
  text-align:left;
}
.hero-section h1 {
  font-family:'Montserrat',sans-serif;
  font-weight:900;
  font-size:2.5rem;
  color:var(--primary);
  margin-bottom:0;
  letter-spacing:-0.5px;
  line-height:1.11;
  text-shadow:0 1px 0 #fff3, 0 10px 45px #89A87A40;
}
.hero-section p {
  font-size:18px;
  font-family:'Roboto',sans-serif;
  color:#365d3e;
  margin:6px 0 0 0;
  max-width:90vw;
}
.hero-section .cta-btn{
  margin-top:20px;
}

@media (max-width:600px) {
  .hero-section {
    border-bottom-left-radius:28px 13px;
    border-bottom-right-radius:100px 32px;
    padding-bottom:7px;
  }
  .hero-section h1 { font-size:1.5rem; }
  .hero-section p { font-size:15.5px; }
}

/* ----------------- NATURE/ORGANIC SECTION SPACING PATTERNS */
.section {
  margin-bottom:60px;
  padding:40px 20px;
}
.card-container {
  display:flex;
  flex-wrap:wrap;
  gap:24px;
}
.card {
  margin-bottom:20px;
  position:relative;
  background:var(--accent);
  border-radius:20px;
  box-shadow:0 4px 22px var(--shadow);
}
.content-grid {
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  justify-content:space-between;
}
.text-image-section {
  display:flex;
  align-items:center;
  gap:30px;
  flex-wrap:wrap;
}
.testimonial-card {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:20px;
  padding:20px;
  margin-bottom:22px;
  background:var(--earth1);
  border-radius:30px;
  box-shadow:0 6px 28px var(--shadow);
  border:1.5px solid var(--earth2);
  max-width:600px;
}
.feature-item {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:15px;
  background:var(--accent);
  border-radius:22px 30px 19px 19px / 33px 14px 19px 24px;
  box-shadow:0 4px 17px var(--shadow);
  padding:24px 26px;
  margin-bottom:20px;
  min-width:220px;
  min-height:200px;
  transition:box-shadow .19s,transform .13s;
}
.feature-item:hover{
  box-shadow:0 6px 28px var(--shadow);
  transform:translateY(-2px) scale(1.03);
}

@media (max-width:800px){
  .feature-item{min-width:140px;}
}

/* Responsive alignment rules */
@media (max-width: 900px) {
  .content-grid,
  .feature-grid,
  .services-grid,
  .post-grid,
  .course-cards,
  .experts-intro,
  .experts-grid,
  .team-bios
  {flex-direction:column;gap:20px;}
  .card-container {gap:14px;}
}
@media (max-width: 768px) {
  .section{padding:26px 6px;}
  .text-image-section, .content-grid,
  .feature-grid, .services-grid, .experts-intro, .experts-grid,
  .team-bios, .course-cards, .post-grid {
    flex-direction:column;
    gap:18px;
    align-items:stretch;
  }
}

/* ---- FEATURES SECTION ---- */
.features-section .feature-grid {
  display:flex;
  flex-wrap:wrap;
  gap:28px;
  margin-top:30px;
}
.features-section h2 {
  font-family:'Montserrat',sans-serif;
  font-size:2rem;
  font-weight:700;
  color:var(--primary);
  margin-bottom:16px;
}
.feature-item h3 {
  font-family:'Montserrat',sans-serif;
  font-weight:600;
  font-size:1.2rem;
  color:var(--leaf);
}
.feature-item p{
  font-size:15.5px;
  color:var(--primary);
  line-height:1.5;
}
.feature-item img{
  width:39px;height:39px;margin-bottom:2px;
}

/* ---- TESTIMONIALS SECTION ---- */
.testimonials-section h2 {
  font-size:1.8rem;
  color:var(--primary);
  font-family:'Montserrat',sans-serif;
  font-weight:700;
  margin-bottom:18px;
  letter-spacing:-0.5px;
}
.testimonial-card {
  background:var(--accent);
  color:#253f27;
  border:1.5px solid var(--moss);
  box-shadow:0 3px 22px var(--shadow);
  margin-bottom:24px;
  min-width:240px;
  max-width:680px;
  font-family:'Roboto',sans-serif;
  font-size:17px;
  position:relative;
  transition:box-shadow .14s,transform .14s;
}
.testimonial-card:hover{
  box-shadow:0 8px 40px var(--shadow);
  transform:scale(1.025);
}
.testimonial-header {
  display:flex;
  align-items:center;
  gap:3px;
  margin-bottom:7px;
}
.testimonial-header img{
  width:22px;height:22px;
}
.testimonial-card blockquote {
  font-style:italic;
  color:#233123;
  font-size:19px;
  line-height:1.45;
  margin:8px 0;
  letter-spacing:0.01rem;
  word-break:break-word;
}
.testimonial-card footer {
  align-self:flex-end;
  font-size:15px;
  color:var(--soil);
  margin-top:3px;
}

/* ---- COURSES PREVIEW ---- */
.courses-preview-section h2,
.courses-offer-section h2 {
  font-size:1.7rem;
  font-family:'Montserrat',sans-serif;
  color:var(--primary);
  margin-bottom:18px;
  font-weight:700;
}
.course-cards {
  display:flex;
  flex-wrap:wrap;
  gap:22px;
  margin-top:18px;
}
.course-card {
  background:var(--earth2);
  color:var(--primary);
  border-radius:26px;
  padding:24px 30px 32px 30px;
  box-shadow:0 2px 18px var(--shadow);
  min-width:220px;
  flex:1 1 240px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  margin-bottom:20px;
  position:relative;
  transition:box-shadow .14s,transform .14s;
}
.course-card:hover {
  box-shadow:0 9px 32px var(--shadow);
  background:var(--moss);
  color:#fff;
  transform:scale(1.035);
}
.course-card h3 {
  font-family:'Montserrat',sans-serif;
  font-weight:600;
  font-size:1.15rem;
  color:var(--leaf);
  margin-bottom:8px;
}
.course-card p {
  font-size:15px;
  line-height:1.48;
  margin-bottom:16px;
}
.course-card .cta-btn{align-self:flex-end; margin:0;}

/* ---- EXPERTS/TEAM BIOS ---- */
.experts-intro, .experts-grid, .team-bios {
  display:flex;
  flex-wrap:wrap;
  gap:30px;
  margin-top:16px;
}
.mini-bio {
  background:var(--accent);
  border-radius:25px;
  box-shadow:0 3px 15px var(--shadow);
  padding:20px 24px 20px 24px;
  color:var(--primary);
  font-family:'Roboto',sans-serif;
  font-size:16px;
  margin-bottom:20px;
  min-width:180px;
  max-width:350px;
  transition:box-shadow .12s,transform .12s;
}
.mini-bio strong {
  color:var(--leaf);
  font-family:'Montserrat',sans-serif;
  font-size:17.5px;
  font-weight:600;
  letter-spacing:0;
}
.mini-bio img {
  height:17px;width:17px;vertical-align:middle;margin:0 3px;
}
.mini-bio:hover {box-shadow:0 8px 35px var(--shadow);transform:scale(1.03);}

/* Services/Feature/Offer grids */
.feature-grid, .services-grid, .course-list, .post-grid, .team-bios, .experts-intro, .experts-grid, .course-cards {
  display:flex;
  flex-wrap:wrap;
  gap:24px;
}
@media (max-width: 768px) {
  .feature-grid, .services-grid, .course-list, .post-grid, .experts-grid, .course-cards {
    flex-direction:column;
    gap:18px;
  }
}

.services-grid .service-item {
  background:var(--earth2);
  border-radius:29px 20px 20px 27px / 29px 14px 19px 31px;
  box-shadow:0 3px 15px var(--shadow);
  min-width:210px;
  padding:24px 22px 36px 24px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  margin-bottom:20px;
  transition:box-shadow .16s,transform .13s;
}
.services-grid .service-item:hover {
  box-shadow:0 8px 30px var(--shadow);
  background:var(--moss);
  color:#fff;
}
.service-item h3 {
  color:var(--leaf);
  font-family:'Montserrat',sans-serif;
  font-weight:600;
  font-size:1.13rem;
}
.service-item img {
  width:38px;height:38px;
}

.course-list {
  display:flex;
  flex-wrap:wrap;
  gap:28px;
  margin-top:15px;
}
.course-category{
  background:var(--earth1);
  border-radius:19px 24px / 16px 17px;
  box-shadow:0 2px 6px var(--shadow);
  padding:17px 21px 12px 21px;
  min-width:180px;
  flex: 1 1 220px;
  margin-bottom:20px;
}
.course-category h3{
  color:var(--leaf);
  font-family:'Montserrat',sans-serif;
  font-size:1.15rem;
  font-weight:600;
  margin-bottom:7px;
}
.course-category ul{
  margin-left:0;padding-left:0;list-style:disc inside;color:var(--primary);font-size:15px;
}
.course-category li{margin-bottom:7px;}

.categories-tabs{
  color:var(--leaf);font-weight:700;font-size:1.03em;margin-left:5px;
}

/* ---------------- BLOG/POST CARDS ----------------- */
.blog-posts-section h2 {
  font-size:1.7rem;
  font-family:'Montserrat',sans-serif;
  color:var(--primary);
  margin-bottom:18px;
  font-weight:700;
}
.post-grid {
  display:flex;
  flex-wrap:wrap;
  gap:24px;
  margin-bottom:20px;
}
.post-card {
  background:var(--earth2);
  border-radius:18px;
  box-shadow:0 2px 9px var(--shadow);
  padding:22px 22px 27px 22px;
  color:var(--primary);
  font-family:'Roboto',sans-serif;
  min-width:210px;
  flex:1 1 270px;
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-bottom:20px;
  transition:box-shadow .14s,transform .12s;
}
.post-card h3{
  color:var(--leaf);
  font-family:'Montserrat',sans-serif;
  font-size:1.02rem;
  font-weight:600;
  margin-bottom:7px;
}
.post-card a {
  color:var(--leaf);
  font-weight:600;
  margin-top:7px;
  border-radius:8px;
  text-decoration:underline;
  transition:color .13s,background .17s;
}
.post-card a:hover {
  background:var(--moss);
  color:#fff;
}
.post-card:hover {
  box-shadow:0 7px 24px var(--shadow);
  background:var(--moss);
  color:#fff;
  transform:scale(1.03);
}

.featured-article{
  background:var(--moss);
  border-radius:20px;
  color:#fff;
  font-family:'Roboto',sans-serif;
  margin:22px 0 17px 0;
  padding:24px 18px;
  box-shadow:0 2px 18px var(--shadow);
}
.featured-article h3 {font-size:1.1rem;margin-bottom:4px;font-family:'Montserrat',sans-serif;font-weight:600;}

.search-filter {
  margin:28px 0 7px 0;
  display:flex;
  flex-direction:column;
  gap:7px;
}
.search-filter input[type="text"]{
  font-size:16px;
  padding:7px 12px;
  border-radius:12px;
  border:1px solid var(--earth2);
  background:var(--accent);
  color:var(--primary);
  transition:border-color .12s,box-shadow .12s;
}
.search-filter input:focus{border-color:var(--leaf);box-shadow:0 1px 6px var(--shadow);}

/* ----------------- CONTACT PAGE --------------------- */
.contact-section, .contact-details-section {
  margin-bottom:48px;
}
.contact-section h2, .contact-details-section h2{
  font-size:1.37rem;
  font-family:'Montserrat',sans-serif;
  color:var(--leaf);
  font-weight:700;
  margin-bottom:10px;
}
.contact-section ul, .contact-details-section ul {
  margin:12px 0 9px 0;
  list-style:none;
  padding-left:0;
  font-size:16px;
}
.contact-section li, .contact-details-section li {
  margin-bottom:4px;
  display:flex;
  align-items:center;
  gap:7px;
}
.contact-section img, .contact-details-section img{width:20px;height:20px;margin-right:6px;vertical-align:middle;}
.contact-section a.cta-btn {margin-top:13px;}
.map {
  margin-top:8px;
  background:var(--earth2);
  border-radius:12px;
  color:var(--primary);
  padding:8px 12px;
  max-width:270px;
  font-size:15px;
  display:flex;
  align-items:center;
  gap:4px;
}
.map img {width:16px;height:16px;}

/* -------------- CTA SECTIONS --------------- */
.cta-section {
  background:var(--leaf);
  color:#fff;
  border-radius:26px 70px 24px 35px;
  box-shadow:0 6px 22px var(--shadow);
  margin:0 0 60px 0;
  padding:36px 17px 54px 17px;
}
.cta-section h2 {font-size:1.5rem;font-family:'Montserrat',sans-serif;font-weight:800;margin-bottom:10px;}
.cta-section p {font-size:17px;line-height:1.49;}
.cta-section .cta-btn{background:#fff;color:var(--leaf) !important;box-shadow:0 3px 14px var(--shadow);margin-top:12px;}
.cta-section .cta-btn:hover{background:var(--moss);color:#fff !important;}

/* -------------- FOOTER --------------- */
footer {
  background:var(--earth1);
  color:var(--primary);
  font-size:15px;
  border-top:2px solid var(--earth2);
  box-shadow:0 -3px 28px var(--shadow);
}
.footer-top {
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  gap:32px;
  padding:32px 0 10px 0;
  border-bottom:1.5px solid var(--earth2);
}
.footer-logo img {
  height:34px;
  margin-bottom:11px;
}
.footer-nav, .footer-utility {
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:120px;
}
.footer-nav a, .footer-utility a {
  color:var(--primary);
  font-family:'Montserrat',sans-serif;
  font-size:15.2px;
  border-radius:10px;
  padding:5px 7px;
  transition:background .13s, color .17s;
}
.footer-nav a:hover, .footer-utility a:hover {
  background:var(--moss);
  color:#fff;
}
.footer-contact {
  margin-top:6px;
  display:flex;
  flex-direction:row;
  align-items:flex-start;
  gap:18px;
}
.contact-summary {
  font-size:15.5px;
  color:var(--leaf);
  display:flex;flex-direction:column;gap:3px;
}
.contact-summary img {width:17px;height:17px;vertical-align:middle;margin-right:5px;}
.footer-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:17px;
  padding:18px 0 10px 0;
  font-size:13.5px;
}
.social-media-links{
  display:flex;
  align-items:center;
  gap:10px;
}
.social-media-links a img{
  height:23px;width:23px;transition:filter .12s, transform .13s;
  filter:grayscale(0.3);
}
.social-media-links a:hover img{filter:grayscale(0) brightness(1.16);transform:scale(1.12);}
.legal-statement{color:var(--soil);font-size:12.5px;}
@media (max-width: 740px) {
  .footer-top, .footer-bottom, .footer-contact {flex-direction:column;gap:15px;}
  .footer-logo img {margin-bottom:7px;}
}

/* THANK YOU/THANKYOU SECTION */
.thankyou-section h1{
  font-size:2rem;
  color:var(--leaf);
  font-family:'Montserrat',sans-serif;
  font-weight:700;
  margin-bottom:10px;
}

/* ----------------- PRIVACY POLICY & LEGAL ----------------- */
.text-section {
  margin-top:14px;
  margin-bottom:10px;
  font-size:16px;
  color:var(--primary);
}
.text-section h2 {
  font-size:1.12rem;
  font-family:'Montserrat',sans-serif;
  color:var(--leaf);
  font-weight:600;
  margin:16px 0 6px 0;
}
.text-section ul {
  list-style:disc inside;
  margin-bottom:11px;
  padding-left:18px;
}
.text-section p {
  margin-bottom:6px;
  color:var(--primary);
}
.text-section li {
  margin-bottom:5px;
}


/* --------------------- COOKIE CONSENT BANNER --------------------- */
.cookie-banner {
  position:fixed;
  left:0;right:0;bottom:0;
  width:100vw;
  background:var(--earth2);
  color:var(--primary);
  z-index:800;
  box-shadow:0 -2px 24px var(--shadow);
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:space-between;
  padding:18px 16px 16px 18px;
  font-size:15.2px;
  gap:18px;
  transition:transform .25s cubic-bezier(.78,.12,.23,1);
}
.cookie-banner.hide {
  transform:translateY(120%);
}
.cookie-banner .cookie-text{
  flex:1;
  color:var(--primary);
  margin-right:15px;
  min-width:0;
}
.cookie-banner .cookie-actions {
  display:flex;flex-direction:row;gap:11px;
}
.cookie-btn, .cookie-settings-btn {
  color:#fff;
  background:var(--leaf);
  border-radius:23px;
  padding:7px 16px;
  font-size:15.5px;
  font-family:'Montserrat',sans-serif;
  border:none;
  cursor:pointer;
  font-weight:600;
  transition:background .17s, box-shadow .15s, color .16s;
  box-shadow:0 3px 10px var(--shadow);
}
.cookie-btn.reject {
  background:var(--alert);
}
.cookie-btn:hover,.cookie-btn:focus,.cookie-settings-btn:hover,.cookie-settings-btn:focus {
  background:var(--moss);
  color:#fff;
}

/* COOKIE MODAL POPUP ------------------- */
.cookie-modal {
  display:none;
  position:fixed;
  top:0;left:0;right:0;bottom:0;
  background:rgba(44,60,39,0.27);
  z-index:1000;
  align-items:center;
  justify-content:center;
  min-height:100vh;
  min-width:100vw;
  padding:24px;
  transition:opacity .23s;
}
.cookie-modal.show{
  display:flex;
}
.cookie-modal-content {
  background:var(--earth1);
  border-radius:21px;
  box-shadow:0 16px 72px var(--shadow);
  max-width:420px;
  width:98vw;
  padding:32px 24px;
  color:var(--primary);
  font-family:'Roboto',sans-serif;
  position:relative;
  display:flex;
  flex-direction:column;
  gap:21px;
}
.cookie-modal-content h2 {
  font-family:'Montserrat',sans-serif;
  font-size:1.18rem;
  color:var(--leaf);
  font-weight:700;
}
.cookie-option {
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:11px;
}
.cookie-option label {
  font-size:15.7px;
  color:var(--primary);
  font-weight:600;
}
.cookie-switch {
  width:38px;
  height:21px;
  background:var(--earth2);
  border-radius:13px;
  position:relative;
  flex-shrink:0;
}
.cookie-switch input[type="checkbox"] {
  display:none;
}
.cookie-slider {
  position:absolute;
  top:2.3px;left:2.1px;
  width:17px;height:17px;
  background:var(--leaf);
  border-radius:50%;
  transition:left .18s, background .15s;
}
.cookie-switch input[type="checkbox"]:checked + .cookie-slider {
  left:18px;
  background:var(--secondary);
}
.cookie-modal-actions{
  display:flex;
  gap:12px;
  margin-top:7px;
  justify-content:flex-end;
}
.cookie-modal .close-modal {
  position:absolute;top:9px;right:13px;
  background:none;border:none;font-size:18px;color:var(--soil);cursor:pointer;
  border-radius:50%;width:32px;height:32px;transition:background .13s;
}
.cookie-modal .close-modal:hover{background:var(--earth2);color:var(--leaf);}

/* --------------- TYPOGRAPHY ------------------ */
h1{
  font-size:2.17rem;
  font-family:'Montserrat',sans-serif;
  color:var(--leaf);
  font-weight:800;
  margin-bottom:10px;
}
h2{
  font-size:1.7rem;
  font-family:'Montserrat',sans-serif;
  color:var(--primary);
  font-weight:700;
  margin-bottom:9px;
}
h3{
  font-size:1.15rem;
  font-family:'Montserrat',sans-serif;
  color:var(--leaf);
  font-weight:600;
  margin-bottom:7px;
}
@media (max-width:700px){
  h1{font-size:1.35rem;}
  h2{font-size:1.1rem;}
}

p,li,label,blockquote {
  font-family:'Roboto',sans-serif;
  font-size:16px;
}
strong {font-weight:bolder;}

/* --------------- UTILITIES ------------------- */
::-webkit-scrollbar{width:10px;background:#f5f1eb;}
::-webkit-scrollbar-thumb{background:var(--earth2);border-radius:8px;}

.fade-in {
  opacity:0;
  animation:fade-in .95s 0.25s forwards;
}
@keyframes fade-in {
  from{opacity:0;}
  to{opacity:1;}
}

/* Micro-interaction effects */
button:active, .cta-btn:active, .cookie-btn:active, .cookie-settings-btn:active {
  transform:scale(.98);
}

/* Responsive spacing tweaks */
@media (max-width:480px){
  .container {padding-left:8px;padding-right:8px;}
  .feature-item,.service-item,.mini-bio,.course-card,.post-card{padding:12px 9px 17px 14px;}
}

/* ARTIFICIALLY ORGANIC BORDER SHAPES - decor for sections */
.section,
.hero-section,
.features-section,
.cta-section,
.course-card,
.feature-item,
.service-item,
.mini-bio,
.testimonial-card,
.post-card{
  border-radius:clamp(14px,4vw,38px) / clamp(14px,8vw,50px);
}

/* Prevent element overlapping with extra spacing */
.section > *, .content-wrapper > *, .feature-grid > *, .services-grid > *, .course-cards > *, .post-grid > *, .experts-grid > *, .mini-bio, .course-card, .feature-item, .service-item, .testimonial-card, .card {
  margin-bottom:20px;
}
.section:last-child,.content-wrapper > *:last-child,
.feature-grid > *:last-child,.services-grid > *:last-child,.course-cards > *:last-child,.post-grid > *:last-child,.experts-grid > *:last-child { margin-bottom:0; }

/* FOCUS OUTLINES for accessibility */
a:focus, button:focus, input:focus, .cta-btn:focus, .cookie-btn:focus, .cookie-settings-btn:focus {
  outline:2.5px solid var(--secondary);
  outline-offset:1px;
}