/* CSS RESET & NORMALIZE */
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,font,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;vertical-align:baseline;box-sizing:border-box;
}
html { box-sizing: border-box; }
*, *::before, *::after { box-sizing: inherit; }
body {line-height:1.5;background-color:#f4f4ef;color:#203320;-webkit-font-smoothing:antialiased;}
:root {
  --primary:#222B45;
  --secondary:#F9D923;
  --accent:#F6F6F6;
  --earth1:#cfdcc0; /* sage */
  --earth2:#b7b787; /* olive sand */
  --earth3:#5c8a52; /* leafy olive green */
  --earth4:#927659; /* light brown */
  --earth5:#f7f5ee; /* cream background */
  --organic-corner:20px;
  --shadow1:0 2px 8px rgba(50,80,60,0.08);
  --shadow2:0 6px 24px rgba(34,43,69,0.08);
}

/* BASE TYPOGRAPHY */
@font-face {
  font-family: 'Oswald';font-style: normal;font-weight: 700;src: local('Oswald'), url('https://fonts.gstatic.com/s/oswald/v48/TK3iWkUHHAIjg75cFRf3bXL8LICs1F8.ttf') format('truetype');font-display: swap;
}
@font-face {
  font-family: 'Roboto';font-style: normal;font-weight: 400;src: local('Roboto'), url('https://fonts.gstatic.com/s/roboto/v30/KFOmCnqEu92Fr1Mu4mxM.woff2') format('woff2');font-display: swap;
}
body {
  font-family:'Roboto',Arial,sans-serif;
  background:var(--earth5);
  color:#2d3328;
  font-size:16px;
}
h1, h2, h3, h4, h5, h6 {
  font-family:'Oswald',Arial,sans-serif;
  color:var(--primary);
  line-height:1.1;
  letter-spacing: 0.02em;
  margin-bottom:16px;
}
h1 {font-size: 2.375rem; /* 38px */}
h2 {font-size: 1.75rem; /* 28px */}
h3 {font-size: 1.5rem; /* 24px */}
h4 {font-size: 1.25rem; /* 20px */}
p, ul, ol, li {font-size: 1rem;}
.subheadline {font-size:1.25rem; color:var(--earth3); font-weight: 500;margin-bottom:18px;}
strong { font-weight: 700; }

/* LINKS & BUTTONS */
a { color: var(--earth3); text-decoration: underline; transition:color .2s;}
a:hover, a:focus { color: var(--secondary); text-decoration: none; }
.cta-primary {
  display: inline-block;
  background: var(--earth3);
  color: #fff;
  border-radius:30px 18px 24px 22px / 23px 20px 30px 12px;
  font-family: 'Oswald', Arial, sans-serif;
  font-size: 1.15rem;
  font-weight: 700;
  padding: 14px 36px;
  margin-top: 18px;
  box-shadow: var(--shadow2);
  border:none;
  transition: background .18s, transform .15s, box-shadow .18s;
  text-decoration: none;
  letter-spacing:0.04em;
  cursor: pointer;
}
.cta-primary:hover, .cta-primary:focus {
  background: var(--secondary);
  color: var(--primary);
  transform: translateY(-2px) scale(1.035) rotate(-1deg);
  box-shadow: 0 8px 36px rgba(80,145,80,0.14);
}

/* LAYOUT CONTAINERS */
.container {
  width:100%;
  max-width:1200px;
  margin:0 auto;
  padding:0 20px;
}
.section,
main > section {
  margin-bottom:60px;
  padding:40px 20px;
  border-radius:32px 44px 38px 22px/25px 34px 30px 40px;
  background: var(--accent);
  box-shadow: var(--shadow1);
}
.content-wrapper {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:20px;
}

/* FLEXBOX PATTERNS & MANDATORY CLASSES */
.card-container {
  display:flex;
  flex-wrap:wrap;
  gap:24px;
}
.card {
  margin-bottom:20px;
  position:relative;
  border-radius: 30px;
  background: #fff;
  box-shadow: var(--shadow1);
  padding: 28px 22px;
  flex:1 1 320px;
}
.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;
  align-items:center;
  gap:20px;
  padding:20px 24px;
  background: #fff;
  border-radius: 28px;
  box-shadow: var(--shadow1);
  margin-bottom:20px;
  min-width:0;
  transition: box-shadow .2s, transform .2s;
}
.testimonial-card:hover {
  box-shadow: 0 8px 32px rgba(92,138,82,0.13);
  transform: translateY(-2px) scale(1.025) rotate(-.5deg);
}
.feature-item {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:15px;
}
.features {
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  list-style:none;
  margin:0 0 6px 0;
}
.features li {
  background:rgba(203,223,186,0.17);
  border-radius:21px 15px 24px 27px;
  display:flex;
  align-items:center;
  gap: 12px;
  padding:16px 22px;
  font-size:1.08rem;
  font-weight:500;
  color: var(--primary);
  margin-bottom:0;
  box-shadow: 0 1px 8px rgba(124,158,98,0.08);
}
.features img {
  width:32px;height:32px; flex-shrink:0;
}

.text-section {
  padding: 0;
  margin-bottom: 18px;
}

ul, ol {
  margin: 0 0 20px 18px;
}
ul li, ol li {
  margin-bottom:10px;padding-left:4px;}
ul li:last-child, ol li:last-child {margin-bottom:0;}

/* List Style for Organic Look */
ul, ol {
  list-style: disc inside;
}
ul.features { list-style: none inside; }

/* ORGANIC SHAPES & NATURAL ELEMENTS */
.section, .card, .testimonial-card, .features li, .location-map {
  border-radius: 32px 44px 28px 22px/25px 34px 30px 40px;
}

/* PRICES IN COURSE LISTS */
ul li span {
  background: var(--earth2);
  color: #35523e;
  border-radius: 17px 12px 17px 15px / 13px 15px 16px 11px;
  padding:2px 11px;margin-left:10px;font-size:1rem;font-weight:500;
  display:inline-block;
}

/* TESTIMONIAL SLIDER (Horizontal Scroll on mobile) */
.testimonial-slider {
  display:flex;
  flex-wrap:wrap;
  gap:24px;
  overflow-x:auto;
  scroll-behavior:smooth;
  margin-bottom:6px;
}
.testimonial-card p {
  color:var(--primary); font-size:1.08rem; margin-bottom:6px; line-height:1.5; }
.testimonial-card span {
  color: var(--earth3); font-weight:500; font-size:0.95rem; }

/* INSTRUCTOR GRID & BIOS */
.instructor-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  margin-bottom:8px;
}
.instructor-bio {
  background: #fff;
  border-radius:24px 34px 28px 21px/25px 26px 22px 21px;
  box-shadow: var(--shadow1);
  padding:24px 18px;
  flex:1 1 280px;
  min-width:240px;
  font-size:1.07rem;
  transition: box-shadow .15s, transform .17s;
}
.instructor-bio:hover {
  box-shadow:0 10px 32px rgba(124,158,98,0.14);
  transform: translateY(-2px) scale(1.022);
}

/* EVENT GRID */
.event-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}
.event-details {
  background: #fff;
  border-radius: 24px 36px 22px 17px/19px 22px 25px 18px;
  box-shadow: var(--shadow1);
  padding: 22px 18px;
  flex:1 1 300px;
  min-width:220px;
}

.location-map {
  background:var(--earth1);
  border-radius:18px 30px 19px 22px/13px 15px 21px 19px;
  color:var(--primary);
}

/* FOOTER */
footer {
  padding:40px 20px 30px 20px;
  background:var(--primary);
  color:#fff;
  margin-top:40px;
  border-radius:44px 12px 21px 37px/22px 12px 44px 32px;
}
footer nav {
  display:flex;flex-wrap:wrap;gap:16px;margin-bottom:24px;
}
footer a {color:var(--secondary);text-decoration:none;font-weight:500;font-family:'Oswald';font-size:1rem;transition:color .18s;}
footer a:hover, footer a:focus {color:var(--earth1);text-decoration:underline;}
.footer-info {
  font-size:0.97rem;
  color:#f8f8f8;
}

/* HEADER */
header {
  background: var(--earth4);
  color: #fff;
  padding:22px 0 0 0;
  border-radius: 0 0 36px 36px/0 0 28px 37px;
  box-shadow:0 6px 20px rgba(89,56,23,0.10);
}
.main-nav {
  display:flex;
  flex-wrap:wrap;
  gap:22px;
  align-items: center;
  justify-content: flex-start;
  padding: 0 20px;
}
.main-nav a {
  color:#fff;
  font-family:'Oswald',sans-serif;
  font-size:1rem;
  text-decoration: none;
  padding:7px 14px;
  border-radius:20px;
  transition:background .17s, color .14s;
}
.main-nav a:not(.cta-primary):hover, .main-nav a:not(.cta-primary):focus {
  background:var(--earth3);
  color:#fff;
}
.main-nav img { height: 42px; margin-right: 10px; border-radius:16px 13px 15px 11px; background:var(--accent); }

/* --- MOBILE NAVIGATION --- */
.mobile-menu-toggle {
  display: none;
  background: var(--primary);
  color: var(--secondary);
  border: none;
  font-size: 2rem;
  cursor: pointer;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  position: absolute;
  top: 26px;
  right: 24px;
  z-index: 1101;
  box-shadow:0 2px 8px rgba(60,40,5,0.07);
  transition:background 0.15s;
}
.mobile-menu-toggle:focus { outline:2px solid var(--secondary);}

.mobile-menu {
  position: fixed;
  top: 0; right: 0; left:0; bottom: 0;
  background:rgba(33,39,52,0.96);
  z-index: 2001;
  transform: translateX(100%);
  transition: transform 0.36s cubic-bezier(.68,-0.25,.265,1.25);
  display: flex;
  flex-direction: column;
  padding: 0;
  pointer-events:none;
  opacity:0;
}
.mobile-menu.open {
  transform: translateX(0);
  opacity:1;
  pointer-events:auto;
}
.mobile-menu-close {
  background: var(--earth2);
  color: var(--primary);
  border: none;
  font-size: 2.3rem;
  border-radius: 50%;
  width: 48px;
  height: 48px;
  align-self: flex-end;
  margin:22px 15px 8px 0;
  cursor: pointer;
  box-shadow:0 3px 18px rgba(203,190,43,0.08);
  transition:background .18s;
}
.mobile-menu-close:focus { outline:2px solid var(--secondary);}
.mobile-nav {
  display: flex;
  flex-direction: column;
  gap: 28px;
  align-items: flex-start;
  margin: 40px 0 0 32px;
}
.mobile-nav a {
  color:var(--secondary);
  font-size: 1.125rem;
  font-family:'Oswald',Arial,sans-serif;
  text-decoration: none;
  font-weight: 700;
  background:none;
  padding: 7px 0 7px 8px;
  border-radius: 17px;
  transition:background .16s,color .13s;
  min-width: 185px;
}
.mobile-nav a:hover, .mobile-nav a:focus {
  background:var(--earth3);
  color:#fff;
}


/* COOKIE CONSENT BANNER + MODAL */
.cookie-banner {
  position:fixed;
  left:0; right:0; bottom:0;
  background:var(--accent);
  color:var(--primary);
  display: flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap: 16px;
  box-shadow: 0 -6px 34px rgba(89,135,73,0.18);
  z-index:3000;
  padding:22px 12px 25px 12px;
  border-radius: 24px 24px 0 0/ 30px 28px 0 0;
  font-size:1.1rem;
  animation: cookiefloat 0.85s cubic-bezier(.85,0,.35,.99);
}
@keyframes cookiefloat {
  0% { transform:translateY(100%); opacity:0; }
  60% { opacity:1; transform:translateY(-12px); }
  100% {transform:translateY(0);opacity:1;}
}
.cookie-banner-btns {
  display:flex;
  flex-wrap:wrap;
  gap:16px;
}
.cookie-btn-accept, .cookie-btn-reject, .cookie-btn-settings {
  border:none;
  font-size:1rem;
  border-radius:20px 15px 14px 21px/13px 16px 15px 21px;
  font-family:'Oswald',Arial,sans-serif;
  padding:9px 24px;
  cursor:pointer;
  font-weight:600;
  transition:background .15s, color .11s,box-shadow .16s;
}
.cookie-btn-accept { background:var(--earth3); color:#fff; }
.cookie-btn-accept:hover, .cookie-btn-accept:focus { background:var(--secondary); color:var(--primary); }
.cookie-btn-reject { background:var(--earth2); color:var(--primary); }
.cookie-btn-reject:hover, .cookie-btn-reject:focus { background:var(--primary); color:#fff; }
.cookie-btn-settings { background:var(--accent); color:var(--primary); border:1.2px solid var(--primary); }
.cookie-btn-settings:hover, .cookie-btn-settings:focus { background:var(--earth1); color:var(--primary); }

.cookie-modal-overlay {
  position:fixed;
  top:0; left:0; right:0; bottom:0;
  background:rgba(45,48,31,0.77);
  z-index: 4000;
  display:none;
  align-items: center;
  justify-content: center;
}
.cookie-modal-overlay.open {
  display:flex;
  animation: modalin 0.52s cubic-bezier(.68,-0.08,.27,1.18);
}
@keyframes modalin {
  0% { opacity: 0; transform: translateY(60px) scale(.98); }
  100% { opacity: 1; transform: none; }
}
.cookie-modal {
  background: #fff;
  color:var(--primary);
  border-radius:30px 22px 25px 28px/24px 29px 18px 30px;
  box-shadow: 0 8px 48px rgba(124,158,98,0.2);
  max-width: 98vw;
  width: 397px;
  padding:32px 22px 24px 22px;
  display:flex;
  flex-direction:column;
  gap: 18px;
  position:relative;
  animation: cookiefloat 0.44s cubic-bezier(.7,-0.2,.23,1.1);
}
.cookie-modal-close {
  position:absolute;top:14px;right:14px;
  background:var(--earth2);
  color:var(--primary);
  border:none;
  border-radius:50%;
  width:36px; height:36px;
  font-size:1.5rem;
  cursor:pointer;
  box-shadow:0 2px 12px rgba(98,90,64,0.09);
}
.cookie-modal-close:focus { outline:2px solid var(--secondary);}

.cookie-categories {
  display:flex;
  flex-direction:column;
  gap:16px;
  margin: 14px 0 0 0;
}
.cookie-category {
  display:flex;
  align-items: center;
  justify-content:space-between;
  font-size:1.1rem;
  padding: 8px 0;
}
.cookie-category input[type="checkbox"] {
  accent-color: var(--earth3);
  width:22px; height:22px;
}
.cookie-label-essential {
  color: var(--earth3); font-weight:700; margin-left:8px;}

/* Responsive - Mobile First */
@media (max-width: 1100px) {
  .container { max-width: 900px; }
  h1{font-size:2rem;} h2{font-size:1.45rem;} h3{font-size:1.13rem;}
  .features li, .card, .testimonial-card, .instructor-bio, .event-details {padding-left:10px;padding-right:10px;}
}
@media (max-width:900px){
  .container{max-width:690px;}
  .main-nav{gap:12px;}
}
@media (max-width: 768px) {
  body {font-size:15px;}
  h1{font-size:1.45rem;} h2{font-size:1.15rem;} h3{font-size:1.06rem;}
  .section, main > section {padding:23px 4px; margin-bottom:38px;}
  .container{max-width:97vw;padding:0 8px;}
  .content-wrapper,.features,.card-container, .content-grid, .instructor-grid, .event-grid, .testimonial-slider{
    flex-direction: column !important;
    align-items: stretch !important; gap:18px !important;
  }
  .features li,.card,.testimonial-card,.instructor-bio,.event-details { min-width: 0; }
  .main-nav,.footer nav {flex-direction:column;gap:9px;align-items:flex-start;}
  .footer-info{font-size:0.93rem;}
  .mobile-menu-toggle{display:block;}
  .main-nav{display:none;}
  header{padding-top:18px;}
  .mobile-menu {padding:0;}
}
@media (max-width:560px) {
  .section, main > section {padding:13px 2px; margin-bottom:21px;}
  h1,h2,h3 {margin-bottom:10px;}
}

/* Hamburger always top-right */
@media (min-width: 769px) {
  .mobile-menu-toggle,.mobile-menu { display: none; }
  .main-nav { display: flex !important; }
}

/* White space, Spacing and Gaps */
.section > *, .content-wrapper > *, main > section > div > *, .footer-info, .features li, .testimonial-card, .card {
  margin-bottom:20px;
}
.section > *:last-child, .content-wrapper > *:last-child, main > section > div > *:last-child, .features li:last-child, .testimonial-card:last-child, .card:last-child {
  margin-bottom:0;
}

/* Scrollbar for testimonial slider */
.testimonial-slider { scrollbar-width:thin; scrollbar-color:var(--earth3) var(--earth1); }
.testimonial-slider::-webkit-scrollbar {height:10px; background:var(--earth1);}
.testimonial-slider::-webkit-scrollbar-thumb {background:var(--earth3);border-radius:16px;}

/* Selection highlight */
::selection {background:var(--secondary);color:var(--primary);}

/* Form Styles (Contact, Cookie) */
input, select, textarea {
  background:var(--earth1);
  color:var(--primary);
  border:1.2px solid var(--earth2);
  border-radius:12px;
  padding:11px 9px;
  margin-bottom:12px;
  font-size:1.05rem;
  font-family:'Roboto',sans-serif;
  transition:border .16s, background .13s;
}
input:focus, select:focus, textarea:focus {
  border-color: var(--earth3);
  background: var(--accent);
  outline: none;
}

/* Organic HR */
hr {border:0;height:3px;background:var(--earth3);border-radius:2px;margin:24px 0;}

/* Animations for Buttons */
.cta-primary, .cookie-banner-btns button {
  transition: box-shadow .18s, transform .14s, background .18s, color .18s;
}
.cta-primary:active, .cookie-banner-btns button:active {
  transform: scale(0.97) translateY(1px);
}

/* Visually Hidden Utility (for a11y) */
.visually-hidden {
  position:absolute !important; height:1px; width:1px; overflow:hidden;clip:rect(1px,1px,1px,1px); white-space:nowrap;
}

/* Z-INDEX LAYOUT STACKING */
header { z-index:10; position: relative; }
.mobile-menu {z-index:2001;}
.cookie-banner {z-index:3000;}
.cookie-modal-overlay {z-index:4000;}

/* --- END CSS --- */