/* Core styles inspired by reference: soft beige backgrounds, rounded cards, clean Inter font */
:root{
  --bg-soft:#f6ece4;
  --card:#ffffff;
  --ink:#1a1a1a;
  --muted:#6b6b6b;
  --brand:#2b8a6e;
  --accent:#f3d5bd;
  --panel:#e8f2ec;
  --line:#eee3da;
  --radius:14px;
  --container:1120px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;height:100%}
body{
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--ink);
  background:#fff;
  min-height:100vh;
  display:flex;
  flex-direction:column;
}
.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 20px}
.skip-link{position:absolute;left:-9999px;top:auto}
.muted{color:var(--muted)}

/* Typography */
h1,h2,h3,h4{line-height:1.2;margin:0 0 10px}
h1{font-size:40px;font-family:Manrope,Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
h2{font-size:28px}
h3{font-size:20px}
p{margin:0 0 12px}
a{color:var(--ink)}
a:hover{color:var(--brand)}

/* Header */
.site-header{background:#fff;border-bottom:1px solid #eee;position:sticky;top:0;z-index:10}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;height:64px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-weight:700}
.logo-mark{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--brand);color:#fff}
.nav-toggle{display:none}
.burger{display:none;cursor:pointer}
.burger span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0}
.main-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:20px}
.main-nav a{text-decoration:none;color:var(--ink);font-weight:500;padding:8px 10px;border-radius:10px}
.main-nav a:hover{background:var(--bg-soft)}
.main-nav .muted a{color:var(--muted)}

/* Hero and sections */
.hero{background:var(--bg-soft);padding:56px 0}
.hero-inner{display:grid;grid-template-columns:1.2fr 1fr;gap:24px;align-items:center}
.hero h1{font-size:40px;margin:0 0 12px}
.hero p{color:var(--muted);margin:0 0 16px}
.hero .hero-card{background:var(--card);border-radius:var(--radius);padding:20px;border:1px solid #eee}
.hero img{border-radius:12px;border:1px solid #eee;display:block;width:100%;height:auto}

.section{padding:56px 0}
.section-soft{background:var(--bg-soft)}
.section .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.article-cover{display:block;width:100%;max-height:420px;object-fit:cover;border-radius:12px;border:1px solid #eee;margin:8px 0 12px}
.card{background:var(--card);border:1px solid #eee;border-radius:var(--radius);padding:16px}
.card img{width:100%;height:160px;object-fit:cover;border-radius:10px}
.card.shadow{box-shadow:0 8px 24px rgba(0,0,0,.04)}
.card.flat{border-color:#e9e4de}
.section h2{margin-bottom:14px}
.card:hover{box-shadow:0 12px 30px rgba(0,0,0,.06);transform:translateY(-2px);transition:.15s ease}
.badge{display:inline-block;padding:4px 10px;background:#e8f5ef;color:#246b56;border-radius:999px;font-size:12px}
.chip{display:inline-block;padding:6px 12px;border-radius:999px;background:#fff;border:1px solid #e9e4de}

/* Footer */
.site-footer{background:var(--bg-soft);margin-top:56px}
.footer-inner{padding:40px 0}
.footer-brand{display:flex;align-items:center;gap:10px;font-weight:700}
.footer-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;row-gap:16px;margin-top:16px}
.footer-col h3{margin:0 0 12px;font-size:22px;font-family:Manrope,Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
.footer-col ul{list-style:none;margin:0;padding:0}
.footer-col p,.footer-col li{margin:10px 0;line-height:1.5}
.footer-col a{text-decoration:none;color:var(--ink)}
.copyright{margin-top:16px;border-top:1px solid #e3d7cd;padding-top:12px;font-size:14px}

/* Sticky footer layout */
.site-main{flex:1}

/* Cookie banner */
.cookie-banner{position:fixed;left:0;right:0;bottom:0;background:#1a1a1a;color:#fff;padding:12px 0;z-index:20}
.cookie-banner .container{display:flex;gap:12px;align-items:center;justify-content:space-between}
.cookie-banner p{margin:0;max-width:800px;font-size:14px}
.cookie-banner .btn{background:#2b8a6e}

/* Courses cards */
.course-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.course-item .meta{display:flex;gap:14px;color:var(--muted);font-size:12px;margin-top:8px}
.course-item h3{margin:10px 0 4px}
.course-item{background:#fff}

/* Forms */
.form{display:grid;grid-template-columns:1fr 1fr;gap:12px;background:var(--panel);padding:16px;border:1px solid #d5e6da;border-radius:var(--radius)}
.form input,.form textarea{width:100%;padding:12px;border:1px solid #d9d9d9;border-radius:10px;background:#f7faf8}
.form textarea{grid-column:1/-1;min-height:120px}
.btn{display:inline-block;padding:12px 16px;background:var(--brand);color:#fff;border-radius:999px;text-decoration:none;border:none;cursor:pointer}
.btn.muted{background:#e7e7e7;color:#222}
.btn.light{background:#fff;color:#1a1a1a;border:1px solid #e9e4de}
.btn.block{display:block;width:100%;text-align:center}
.btn.lg{padding:14px 22px;font-weight:600}

/* Utilities */
.rounded{border-radius:var(--radius)}
.shadow{box-shadow:0 10px 30px rgba(0,0,0,.06)}
.divider{height:1px;background:var(--line);margin:16px 0}

/* CTA banner (beige strip like reference) */
.cta-banner{background:var(--bg-soft)}
.cta-banner .cta-inner{display:flex;align-items:center;justify-content:space-between;gap:20px}
.cta-banner h2{font-size:32px;margin:0}
.cta-actions{display:flex;gap:10px;flex-wrap:wrap}

/* Focus states */
*:focus{outline:2px solid rgba(43,138,110,.35);outline-offset:2px}

/* Responsive */
@media (max-width:980px){
  .section .grid,.course-grid{grid-template-columns:repeat(2,1fr)}
  .hero-inner{grid-template-columns:1fr}
  .footer-cols{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:720px){
  .burger{display:block}
  .main-nav{position:fixed;inset:64px 0 auto 0;background:#fff;border-bottom:1px solid #eee;transform:translateY(-120%);transition:none}
  .main-nav ul{flex-direction:column;padding:16px}
  .nav-toggle:checked ~ .burger + .main-nav{transform:translateY(0)}
  h1{font-size:32px}
  h2{font-size:24px}
  .footer-inner{padding:32px 20px}
  .footer-cols{grid-template-columns:1fr;row-gap:16px}
  .footer-col{padding:18px 0;border-bottom:1px solid var(--line)}
  .footer-col:last-child{border-bottom:none}
  .footer-brand{margin-bottom:8px}
}
@media (max-width:480px){
  .section .grid,.course-grid{grid-template-columns:1fr}
}