.video-thumb {
  position: relative;
  display: inline-block;
  cursor: pointer;
}

.video-thumb img {
  display: block;
  width: 180px;      /* Thumbnail width */
  height: 100px;     /* Thumbnail height */
  object-fit: cover;
  border-radius: 6px;
}

.video-thumb::after {
  content: "▶";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 36px;
  color: rgba(255,255,255,0.8);
  pointer-events: none;
  text-shadow: 1px 1px 4px #000;
}

/* Main stylesheet for Evergreen Edge Construction */
:root{
  --accent:#2a8f59;
  --dark:#0f1720;
  --muted:#6b7280;
  --maxw:1100px;
}
*{box-sizing:border-box}
body{font-family:Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; margin:0; color:var(--dark); line-height:1.5;}
a{color:inherit; text-decoration:none}
.header{background:linear-gradient(90deg, rgba(42,143,89,0.06), rgba(42,143,89,0.02)); border-bottom:1px solid #e6e9eb}
.container{max-width:var(--maxw); margin:0 auto; padding:24px}
.nav{display:flex; align-items:center; justify-content:space-between; gap:16px}
.brand{display:flex; align-items:center; gap:12px}
.brand img{height:56px; width:56px; object-fit:contain; border-radius:6px}
.nav-links{display:flex; gap:18px; align-items:center}
.cta{background:var(--accent); color:white; padding:10px 14px; border-radius:8px; font-weight:600}

.hero{display:grid; grid-template-columns:1fr 420px; gap:28px; align-items:center; padding:48px 0}
.hero h1{font-size:34px; margin:0 0 10px}
.lead{color:var(--muted); margin-bottom:18px}

.card{background:white; border-radius:12px; padding:18px; box-shadow:0 6px 18px rgba(10,10,10,0.06); border:1px solid #f0f2f4}

.services-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:20px}
.service{padding:18px; border-radius:10px; text-align:left; background:linear-gradient(180deg, rgba(42,143,89,0.03), transparent)}

.gallery{display:grid; grid-template-columns:repeat(3,1fr); gap:8px}
.gallery img{width:100%; height:190px; object-fit:cover; border-radius:8px}

.footer{background:#f8fafb; padding:28px 0; margin-top:32px}
.footer .container{display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap}

.section-title{display:flex; align-items:center; gap:12px; margin-bottom:12px}
.kicker{font-size:14px; color:var(--accent); font-weight:700}

@media(max-width:900px){
  .hero{grid-template-columns:1fr; padding:28px 0}
  .services-grid{grid-template-columns:repeat(2,1fr)}
  .gallery{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .nav-links{display:none}
  .brand img{height:46px; width:46px}
  .services-grid{grid-template-columns:1fr}
  .gallery{grid-template-columns:1fr}
  .container{padding:16px}
  .hero h1{font-size:26px}
}
/* small utilities */
.row{display:flex; gap:12px; align-items:center}
.badge{background:#eefdf4; color:var(--accent); padding:6px 10px; border-radius:999px; font-weight:700}
.small{font-size:14px; color:var(--muted)}
.quote{font-style:italic; color:#0b3f22}
form .field{margin-bottom:12px}
input, textarea{width:100%; padding:10px; border-radius:8px; border:1px solid #e4e7ea}
button{background:var(--accent); color:white; padding:10px 14px; border-radius:8px; border:0; cursor:pointer}
