/* ═══════ RIGHTFUL HEALTH — REBUILD ═══════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --bg:#fafaf7;--bg2:#fff;--text:#2a2a2a;--text2:#555;--text3:#888;
  --accent:#4a8c5c;--accent2:#3a7a4c;--accent-bg:#e8f5ec;
  --border:#ddd;--shadow:0 2px 12px rgba(0,0,0,.08);
  --page-color:rgba(200,183,122,0.35);
  --font-body:'Georgia','Times New Roman',serif;
  --font-heading:'Georgia',serif;
  --max-w:900px;
}

body{background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:16px;line-height:1.7}

/* ── HEADER ── */
#site-header{background:var(--bg2);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100;box-shadow:var(--shadow)}
.header-inner{max-width:var(--max-w);margin:0 auto;padding:10px 20px;display:flex;align-items:center;gap:16px}
.logo img{height:50px;width:auto}
#menu-toggle{display:none;background:none;border:1px solid var(--border);font-size:1.4em;padding:4px 10px;cursor:pointer;color:var(--text2);border-radius:4px}
#main-nav{display:flex;gap:4px;align-items:center;flex-wrap:wrap;margin-left:auto}
.nav-link{background:none;border:none;font-family:var(--font-body);font-size:.9em;color:var(--text2);padding:8px 14px;cursor:pointer;text-decoration:none;border-radius:4px;transition:background .2s,color .2s}
.nav-link:hover,.nav-link.active{color:var(--accent);background:var(--accent-bg)}
.nav-drop{position:relative}
.drop-menu{display:none;position:absolute;top:100%;left:0;background:var(--bg2);border:1px solid var(--border);border-radius:6px;box-shadow:var(--shadow);min-width:160px;z-index:200;flex-direction:column;padding:4px 0}
.nav-drop:hover .drop-menu,.drop-menu:hover{display:flex}
.drop-menu a{padding:8px 16px;color:var(--text2);text-decoration:none;font-size:.88em;transition:background .15s}
.drop-menu a:hover{background:var(--accent-bg);color:var(--accent)}

/* ── MAIN ── */
main{max-width:var(--max-w);margin:0 auto;padding:24px 20px;min-height:60vh}

/* ── PAGE CONTENT ── */
.page-header{text-align:center;margin-bottom:24px}
.page-header img{max-width:300px;height:auto;border-radius:8px}
.page-body{background:var(--bg2);border-radius:10px;padding:28px 32px;box-shadow:var(--shadow);border-top:4px solid var(--page-color)}
.page-body h2{font-family:var(--font-heading);color:var(--accent);font-size:1.4em;margin:20px 0 10px;border-bottom:1px solid var(--border);padding-bottom:6px}
.page-body h3{color:var(--accent2);font-size:1.1em;margin:16px 0 8px}
.page-body p{margin:10px 0}
.page-body ul,.page-body ol{margin:10px 0 10px 24px}
.page-body li{margin:4px 0}
.page-body img{max-width:100%;height:auto;border-radius:6px;margin:10px 0}
.page-body img.float-right{float:right;max-width:240px;margin:0 0 12px 16px}
.page-body img.float-left{float:left;max-width:240px;margin:0 16px 12px 0}
.page-body .img-row{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin:16px 0}
.page-body .img-row img{width:240px;height:180px;object-fit:cover;border-radius:6px}
.page-body blockquote{background:var(--accent-bg);border-left:4px solid var(--accent);padding:14px 18px;margin:20px 0;font-style:italic;border-radius:0 6px 6px 0}
.page-body blockquote cite{display:block;margin-top:6px;font-style:normal;font-size:.88em;color:var(--text3)}

/* ── HOME ── */
.home-hero{text-align:center;padding:40px 20px}
.home-hero h1{font-family:var(--font-heading);font-size:2em;color:var(--accent);margin-bottom:8px}
.home-hero p{font-size:1.1em;color:var(--text2);max-width:600px;margin:0 auto 24px}
.home-cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;margin-top:24px}
.home-cat{background:var(--bg2);border-radius:8px;padding:20px;box-shadow:var(--shadow);border-top:3px solid var(--accent);cursor:pointer;transition:transform .2s,box-shadow .2s}
.home-cat:hover{transform:translateY(-2px);box-shadow:0 4px 20px rgba(0,0,0,.12)}
.home-cat h3{color:var(--accent);font-size:1em;margin-bottom:8px}
.home-cat ul{list-style:none;padding:0}
.home-cat ul li{padding:3px 0;font-size:.9em;color:var(--text2)}
.home-cat ul li a{color:var(--text2);text-decoration:none}
.home-cat ul li a:hover{color:var(--accent)}

/* ── RECIPES ── */
.recipe-cats{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0}
.recipe-cat-btn{background:var(--accent-bg);border:1px solid var(--accent);color:var(--accent);font-family:var(--font-body);font-size:.85em;padding:6px 14px;border-radius:20px;cursor:pointer;transition:background .2s,color .2s}
.recipe-cat-btn:hover,.recipe-cat-btn.active{background:var(--accent);color:#fff}
.recipe-card{background:var(--bg);border:1px solid var(--border);border-radius:8px;margin:12px 0;overflow:hidden}
.recipe-card-header{padding:12px 16px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;font-weight:bold;color:var(--accent2)}
.recipe-card-header:hover{background:var(--accent-bg)}
.recipe-card-body{display:none;padding:16px;border-top:1px solid var(--border)}
.recipe-card-body.open{display:block}
.recipe-card-body ul{margin:8px 0 8px 20px}
.recipe-card-body ol{margin:8px 0 8px 20px}

/* ── CONTACT ── */
.contact-form{max-width:500px}
.contact-form label{display:block;font-size:.9em;color:var(--text2);margin:12px 0 4px;font-weight:bold}
.contact-form input,.contact-form textarea{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:6px;font-family:var(--font-body);font-size:.95em;background:var(--bg)}
.contact-form input:focus,.contact-form textarea:focus{border-color:var(--accent);outline:none}
.contact-form textarea{height:120px;resize:vertical}
.contact-form button{margin-top:14px;background:var(--accent);color:#fff;border:none;padding:10px 28px;border-radius:6px;font-family:var(--font-body);font-size:1em;cursor:pointer;transition:background .2s}
.contact-form button:hover{background:var(--accent2)}
#contact-status{font-size:.9em;margin-top:8px;min-height:1.4em}

/* ── FOOTER ── */
#site-footer{text-align:center;padding:24px 20px;border-top:1px solid var(--border);color:var(--text3);font-size:.85em;margin-top:40px}
#site-footer a{color:var(--accent)}

/* ── BACK TO TOP ── */
#back-to-top{display:none;position:fixed;bottom:20px;right:20px;background:var(--accent);color:#fff;border:none;width:40px;height:40px;border-radius:50%;font-size:1.2em;cursor:pointer;box-shadow:var(--shadow);transition:opacity .2s;z-index:50}
#back-to-top:hover{background:var(--accent2)}

/* ── RESPONSIVE ── */
@media(max-width:700px){
  .header-inner{flex-wrap:wrap}
  #menu-toggle{display:block}
  #main-nav{display:none;width:100%;flex-direction:column;gap:0;border-top:1px solid var(--border);padding-top:8px}
  #main-nav.open{display:flex}
  .nav-drop{width:100%}
  .nav-drop>.nav-link{width:100%;text-align:left}
  .drop-menu{position:static;box-shadow:none;border:none;padding-left:16px}
  .nav-drop:hover .drop-menu{display:none}
  .nav-drop.open .drop-menu{display:flex}
  .page-body{padding:18px 16px}
  .page-body img.float-right,.page-body img.float-left{float:none;max-width:100%;margin:10px 0}
  .home-hero h1{font-size:1.5em}
}