/* ==========================================================
   CleanPlate AU — Sage & Sand Editorial
   Playfair Display + Nunito Sans
   ========================================================== */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,500;0,700;1,500&family=Nunito+Sans:wght@300;400;600;700&display=swap');

:root{
  --bg:#f7f5f0;
  --surf:#ffffff;
  --ink:#262421;
  --dim:#6e6a63;
  --sage:#5b7e5f;
  --sage-l:#e5efdf;
  --sage-d:#3e5c41;
  --sand:#c49a3c;
  --sand-l:#fbf4e2;
  --line:#ddd9d2;
  --head:'Playfair Display',Georgia,serif;
  --body:'Nunito Sans','Helvetica Neue',sans-serif;
  --mw:1100px;
  --r:6px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--body);color:var(--ink);background:var(--bg);line-height:1.75;font-size:16px;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--sage);text-decoration:none;transition:color .15s}
a:hover{color:var(--sage-d)}
.w{max-width:var(--mw);margin:0 auto;padding:0 26px}

/* ---------- HEADER ---------- */
.hd{background:var(--surf);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:90}
.hd-in{max-width:var(--mw);margin:0 auto;padding:0 26px;display:flex;align-items:center;justify-content:space-between;height:62px}
.logo{font-family:var(--head);font-size:1.3rem;color:var(--sage-d);font-weight:700}
.logo i{font-style:italic;color:var(--sand);font-weight:500}
nav ul{list-style:none;display:flex;gap:4px}
nav a{display:block;padding:6px 12px;font-size:.85rem;font-weight:600;color:var(--dim);border-radius:var(--r);transition:background .15s,color .15s}
nav a:hover,nav a[aria-current]{background:var(--sage-l);color:var(--sage-d)}
.mb{display:none;background:none;border:none;cursor:pointer;width:28px;height:22px;position:relative}
.mb b,.mb b::before,.mb b::after{display:block;width:18px;height:2px;background:var(--ink);border-radius:1px;position:absolute;left:5px}
.mb b{top:10px}.mb b::before{content:'';top:-6px}.mb b::after{content:'';top:6px}

/* ---------- HERO ---------- */
.hero{position:relative;min-height:430px;display:flex;align-items:center;background:#262421;overflow:hidden}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.32}
.hero-txt{position:relative;z-index:2;padding:56px 0;max-width:560px}
.hero h1{font-family:var(--head);font-size:2.5rem;color:#fff;line-height:1.22;margin-bottom:14px}
.hero p{color:rgba(255,255,255,.8);font-size:1.04rem;font-weight:300;margin-bottom:26px}
.btn{display:inline-block;padding:11px 28px;border-radius:var(--r);font-family:var(--body);font-weight:700;font-size:.9rem;border:none;cursor:pointer;transition:background .15s}
.btn-p{background:var(--sage);color:#fff}.btn-p:hover{background:var(--sage-d);color:#fff}
.btn-o{background:transparent;border:2px solid var(--sage);color:var(--sage)}.btn-o:hover{background:var(--sage);color:#fff}

/* ---------- SECTIONS ---------- */
.sc{padding:58px 0}
.sc-a{background:var(--surf)}
.tag{display:inline-block;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--sage);margin-bottom:6px}
.sh{font-family:var(--head);font-size:1.85rem;margin-bottom:10px;line-height:1.22}
.sl{color:var(--dim);max-width:580px;margin-bottom:34px}

/* ---------- CARDS ---------- */
.cg{display:grid;gap:24px}
.cg3{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.cd{background:var(--surf);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:box-shadow .2s,transform .2s;display:block;color:inherit;text-decoration:none}
.cd:hover{box-shadow:0 4px 16px rgba(0,0,0,.06);transform:translateY(-2px)}
.cd-i{width:100%;height:210px;object-fit:cover}
.cd-b{padding:20px 22px 24px}
.cd-b h3{font-family:var(--head);font-size:1.1rem;margin-bottom:7px}
.cd-b p{color:var(--dim);font-size:.92rem;margin-bottom:12px}
.cd-l{font-weight:700;font-size:.84rem;color:var(--sage)}

/* ---------- PAGE HEADER ---------- */
.ph{background:linear-gradient(135deg,var(--sage-d),#2e4a32);color:#fff;padding:44px 0 36px}
.ph h1{font-family:var(--head);font-size:1.95rem;margin-bottom:7px}
.ph p{color:rgba(255,255,255,.76);max-width:520px;font-weight:300}

/* ---------- ARTICLE ---------- */
.ar{padding:46px 0 60px}
.ar h2{font-family:var(--head);font-size:1.45rem;margin:36px 0 10px}
.ar h3{font-size:1.08rem;font-weight:700;margin:24px 0 7px}
.ar p{margin-bottom:13px}
.ar ul,.ar ol{margin:0 0 13px 20px}
.ar li{margin-bottom:4px}
.ar-im{width:100%;border-radius:var(--r);margin:20px 0}
.nt{background:var(--sage-l);border-left:4px solid var(--sage);padding:16px 20px;margin:20px 0;border-radius:0 var(--r) var(--r) 0}
.nt p{margin:0}
.ds{background:var(--sand-l);border-left:4px solid var(--sand);padding:14px 18px;margin:26px 0;border-radius:0 var(--r) var(--r) 0;font-size:.88rem;color:var(--dim)}

/* ---------- TABLE ---------- */
.tb{width:100%;border-collapse:collapse;margin:20px 0;font-size:.92rem}
.tb th,.tb td{text-align:left;padding:10px 13px;border-bottom:1px solid var(--line)}
.tb th{background:var(--sage-l);font-weight:700;color:var(--sage-d)}
.tb tr:hover td{background:var(--bg)}

/* ---------- FORM ---------- */
.fm{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:580px}
.fi{display:flex;flex-direction:column}
.fw{grid-column:1/-1}
.fi label{font-size:.82rem;font-weight:700;margin-bottom:4px}
.fi input,.fi textarea,.fi select{padding:9px 12px;border:1px solid var(--line);border-radius:var(--r);font-family:var(--body);font-size:.92rem;background:var(--bg);color:var(--ink);transition:border-color .15s}
.fi input:focus,.fi textarea:focus,.fi select:focus{outline:none;border-color:var(--sage)}
.fi textarea{resize:vertical;min-height:105px}

/* ---------- VALUES ---------- */
.vg{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;margin:28px 0}
.vc{background:var(--surf);border:1px solid var(--line);border-radius:var(--r);padding:24px}
.vc h3{font-family:var(--head);font-size:1rem;margin-bottom:7px;color:var(--sage-d)}
.vc p{color:var(--dim);font-size:.9rem}

/* ---------- FOOTER ---------- */
.ft{background:#262421;color:rgba(255,255,255,.58);padding:44px 0 26px;font-size:.86rem}
.ft-g{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px;margin-bottom:28px}
.ft-b .logo{color:#fff;margin-bottom:9px;font-size:1.1rem}
.ft-b p{max-width:290px;line-height:1.6}
.ft h4{color:#fff;font-size:.78rem;text-transform:uppercase;letter-spacing:.09em;margin-bottom:12px}
.ft ul{list-style:none}
.ft li{margin-bottom:6px}
.ft a{color:rgba(255,255,255,.58)}.ft a:hover{color:#fff}
.ft-c{border-top:1px solid rgba(255,255,255,.08);padding-top:20px;text-align:center;font-size:.78rem}

/* ---------- RESPONSIVE ---------- */
@media(max-width:800px){
  .mb{display:block}
  nav{display:none;position:absolute;top:62px;left:0;right:0;background:var(--surf);border-bottom:1px solid var(--line);padding:12px 26px}
  nav.on{display:block}
  nav ul{flex-direction:column;gap:2px}
  .hero h1{font-size:1.85rem}
  .cg3{grid-template-columns:1fr}
  .fm{grid-template-columns:1fr}
  .ft-g{grid-template-columns:1fr;gap:22px}
  .hd-in{position:relative}
}