:root{
  --manul-bg:#fbf6ee;
  --manul-cream:#fffdf8;
  --manul-ink:#2c2622;
  --manul-soft:#6f655c;
  --manul-accent:#d9772f;
  --manul-accent2:#8a6a4f;
  --manul-line:#e7ddcd;
}
.manul-site{ background:var(--manul-bg); color:var(--manul-ink); font-family:"Trebuchet MS","Segoe UI",system-ui,-apple-system,sans-serif; line-height:1.6; margin:0; }
.manul-site *{ box-sizing:border-box; }
.manul-site .wrap{ max-width:1100px; margin:0 auto; padding:0 20px; }
.manul-site h2{ font-size:clamp(26px,4vw,40px); margin:0 0 8px; letter-spacing:-.5px; }
.manul-site .kicker{ text-transform:uppercase; letter-spacing:.18em; font-size:12px; color:var(--manul-accent); font-weight:700; margin:0 0 10px; }
.manul-site .lead{ color:var(--manul-soft); max-width:640px; margin:0 0 28px; }

/* NAV */
.manul-site .topnav{ border-top:1px solid var(--manul-line); border-bottom:1px solid var(--manul-line); background:var(--manul-cream); }
.manul-site .topnav a{ display:inline-block; padding:12px 14px; font-size:15px; color:var(--manul-ink); text-decoration:none; }
.manul-site .topnav a:hover{ color:var(--manul-accent); }
.manul-site .topnav a.cur{ color:var(--manul-accent); font-weight:700; }

/* HERO */
.manul-site .hero{ padding:60px 0 40px; }
.manul-site .hero-grid{ display:flex; gap:40px; align-items:center; flex-wrap:wrap; }
.manul-site .hero-txt{ flex:1 1 420px; }
.manul-site .hero-title{ font-size:clamp(40px,7vw,74px); line-height:1.02; margin:0 0 16px; letter-spacing:-1.5px; }
.manul-site .hero-title em{ font-style:normal; color:var(--manul-accent); white-space:nowrap; }
.manul-site .hero-sub{ font-size:clamp(17px,2.2vw,21px); color:var(--manul-soft); margin:0 0 26px; }
.manul-site .badges{ display:flex; gap:10px; flex-wrap:wrap; }
.manul-site .badge{ background:var(--manul-cream); border:1px solid var(--manul-line); border-radius:999px; padding:9px 16px; font-size:14px; box-shadow:0 2px 0 rgba(0,0,0,.04); }
.manul-site .hero-img{ flex:1 1 340px; max-width:480px; margin:0 auto; }
.manul-site .hero-img img{ width:100%; height:auto; display:block; border-radius:22px 90px 22px 22px; box-shadow:14px 18px 0 rgba(138,106,79,.22); border:5px solid #fff; }
.manul-site .hero-img figcaption{ font-size:14px; color:var(--manul-soft); margin-top:12px; text-align:center; }

/* FACTS */
.manul-site .facts{ padding:46px 0; }
.manul-site .facts-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:18px; }
.manul-site .fact{ background:var(--manul-cream); border:1px solid var(--manul-line); border-radius:18px; padding:22px 22px 20px; }
.manul-site .fact b{ display:block; font-size:30px; color:var(--manul-accent); margin-bottom:6px; }
.manul-site .fact p{ margin:0; font-size:15px; color:var(--manul-soft); }

/* GALLERY */
.manul-site .gallery{ padding:46px 0; }
.manul-site .grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:22px; }
.manul-site figure.shot{ margin:0; background:var(--manul-cream); border:1px solid var(--manul-line); border-radius:18px; overflow:hidden; transition:transform .18s ease, box-shadow .18s ease; }
.manul-site figure.shot:hover{ transform:translateY(-4px) rotate(-.6deg); box-shadow:0 12px 26px rgba(44,38,34,.14); }
.manul-site figure.shot img{ width:100%; height:260px; object-fit:cover; display:block; background:#ddd; }
.manul-site figure.shot figcaption{ padding:14px 16px 16px; font-size:15px; }
.manul-site figure.shot figcaption b{ display:block; margin-bottom:3px; }
.manul-site figure.shot figcaption span{ font-size:13px; color:var(--manul-soft); }
.manul-site .wide{ grid-column:span 2; }
.manul-site .wide img{ height:340px; }
@media (max-width:640px){ .manul-site .wide{ grid-column:auto; } .manul-site .wide img{ height:260px; } }

/* MOODS */
.manul-site .moods{ padding:46px 0; background:linear-gradient(180deg,rgba(217,119,47,.07),rgba(217,119,47,0)); }
.manul-site .mood-list{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; }
.manul-site .mood{ border-left:4px solid var(--manul-accent); background:var(--manul-cream); border-radius:0 14px 14px 0; padding:16px 18px; }
.manul-site .mood h3{ margin:0 0 6px; font-size:17px; }
.manul-site .mood p{ margin:0; font-size:14px; color:var(--manul-soft); }

/* QUOTE + PHOTO STRIP */
.manul-site .quote{ padding:40px 0; }
.manul-site .quote-inner{ display:flex; gap:30px; align-items:center; flex-wrap:wrap; }
.manul-site .quote-inner img{ width:300px; max-width:100%; height:auto; border-radius:18px; object-fit:cover; }
.manul-site blockquote{ margin:0; font-size:clamp(20px,3vw,30px); font-style:italic; max-width:520px; }
.manul-site blockquote footer{ font-size:14px; font-style:normal; color:var(--manul-soft); margin-top:10px; }

/* ARTICLE PAGES */
.manul-site article{ padding:44px 0 20px; max-width:760px; }
.manul-site article p{ margin:0 0 18px; }
.manul-site article a{ color:var(--manul-accent); }
.manul-site article h1{ font-size:clamp(28px,5vw,44px); margin:0 0 18px; letter-spacing:-.8px; }
.manul-site article h2{ font-size:22px; margin:28px 0 10px; }
.manul-site .crumbs{ font-size:14px; color:var(--manul-soft); margin:0 0 22px; }

/* RESPONSIVE HARDENING */
.manul-site{ width:100%; overflow-x:hidden; }
.manul-site img{ max-width:100%; }
.manul-site .hero-txt,.manul-site .hero-img,.manul-site .quote-inner blockquote{ min-width:0; }
@media (max-width:720px){
  .manul-site .hero{ padding:34px 0 26px; }
  .manul-site .hero-grid{ gap:26px; }
  .manul-site .hero-txt,.manul-site .hero-img{ flex:1 1 100%; }
  .manul-site .hero-title{ font-size:clamp(30px,9vw,40px); letter-spacing:-.5px; line-height:1.08; }
  .manul-site .hero-title em{ white-space:normal; }
  .manul-site .hero-img img{ border-radius:18px 60px 18px 18px; box-shadow:8px 10px 0 rgba(138,106,79,.22); }
  .manul-site .grid{ grid-template-columns:1fr; gap:16px; }
  .manul-site .facts-grid{ grid-template-columns:1fr; }
  .manul-site .mood-list{ grid-template-columns:1fr; }
  .manul-site .quote-inner img{ width:200px; }
  .manul-site .wrap{ padding:0 16px; }
}

/* FOOTER */
.manul-site .foot{ padding:36px 0 60px; border-top:1px solid var(--manul-line); font-size:13px; color:var(--manul-soft); }
.manul-site .foot a{ color:var(--manul-accent2); }
.manul-site .foot ul{ list-style:none; padding:0; margin:10px 0 0; display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:4px 20px; }
.manul-site .foot ul.footnav{ grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); margin-top:18px; }
.manul-site .tiny{ font-size:12px; opacity:.8; }