/* assets/css/style.css */
/* Colors provided: green, white, black, #B6AE9F #C5C7BC #DEDED1 #FBF3D1 */
:root{
  --brand-green: #2c7a2c;
  --accent1: #B6AE9F;
  --accent2: #C5C7BC;
  --accent3: #DEDED1;
  --accent4: #FBF3D1;
  --bg: #ffffff;
  --text: #111;
  --muted: #666;
}

*{box-sizing:border-box}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial;margin:0;color:var(--text);background:var(--bg);line-height:1.5}
a{color:var(--brand-green);text-decoration:none}
.topnav{display:flex;gap:12px;padding:12px 18px;background:#fff;border-bottom:1px solid var(--accent3)}
.topnav a{padding:8px 12px;border-radius:6px}
.topnav a.active{background:var(--accent4)}
.container{max-width:1100px;margin:28px auto;padding:0 18px}

/* Landing */
.hero{height:80vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(120deg,var(--accent4),var(--accent3))}
.hero-inner{text-align:center}
.hero h1{font-size:48px;margin:0;color:var(--brand-green)}
.tagline{margin:12px 0 18px;color:var(--muted);font-size:18px}
.cta-row{display:flex;gap:12px;justify-content:center}
.btn{display:inline-block;padding:10px 16px;background:var(--brand-green);color:#fff;border-radius:8px;border:none;cursor:pointer}
.btn-outline{background:transparent;border:1px solid var(--brand-green);color:var(--brand-green)}
.small{font-size:13px;color:var(--muted);margin-top:14px}

/* Cards */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin:18px 0 40px}
.card{background:#fff;border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,0.06);overflow:hidden;display:flex;flex-direction:column}
.thumb{width:100%;height:160px;object-fit:cover}
.card-body{padding:14px;flex:1;display:flex;flex-direction:column}
.card-body h3{margin:0 0 8px;font-size:18px}
.card-body .short{color:var(--muted);flex:1}
.card-actions{display:flex;gap:8px;margin-top:12px}
.expanded{display:none;margin-top:12px;padding-top:12px;border-top:1px dashed var(--accent3)}
.card .expanded.show{display:block}

/* Detail page */
.detail img{max-width:100%;display:block;margin:0 auto}
.slideshow{position:relative;max-width:900px;margin:0 auto 20px;overflow:hidden;border-radius:8px}
.slide{display:none}
.slide.active{display:block}
.slide img{width:100%;height:420px;object-fit:cover}
.slide-prev,.slide-next{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,0.35);color:#fff;border:none;padding:10px;border-radius:50%;cursor:pointer}
.slide-prev{left:10px}
.slide-next{right:10px}

/* contact layout */
.contact-grid{display:grid;grid-template-columns:1fr 320px;gap:18px}
.contact-form label{display:block;margin-bottom:10px}
.contact-form input,.contact-form textarea{width:100%;padding:10px;border:1px solid var(--accent3);border-radius:6px}
.contact-form textarea{min-height:140px}
.contact-info{background:var(--accent4);padding:16px;border-radius:8px}

/* small screens */
@media (max-width:800px){
  .contact-grid{grid-template-columns:1fr}
  .hero h1{font-size:36px}
}
