/* Middletown Tree Pros — fast, plain, Google-readable. No frameworks, no JS. */
:root{
  --green:#1e5c2f;--green-d:#163f22;--dark:#15331d;
  --accent:#e8a020;--accent-d:#c9861a;
  --bg:#faf9f5;--text:#232823;--muted:#5b635b;--line:#dbe0d4;--card:#ffffff;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{font-family:Georgia,'Times New Roman',serif;color:var(--text);background:var(--bg);line-height:1.7;font-size:18px;}
h1,h2,h3,h4{font-family:Arial,Helvetica,sans-serif;color:var(--dark);line-height:1.22;letter-spacing:-.01em;}
p{margin-bottom:15px;}
p:last-child{margin-bottom:0;}
a{color:var(--green);}
a:hover{color:var(--green-d);}
strong{color:var(--dark);}
.wrap{max-width:880px;margin:0 auto;padding:0 22px;}

/* Header */
header{background:var(--dark);color:#fff;padding:14px 0;}
header .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;}
.logo{font-family:Arial,sans-serif;font-weight:bold;font-size:1.3rem;color:#fff;text-decoration:none;letter-spacing:-.01em;}
.call-btn{background:var(--accent);color:var(--dark);font-family:Arial,sans-serif;font-weight:bold;padding:11px 20px;border-radius:7px;text-decoration:none;font-size:1.05rem;box-shadow:0 1px 2px rgba(0,0,0,.15);}
.call-btn:hover{background:var(--accent-d);color:var(--dark);}
nav{background:var(--green);}
nav .wrap{display:flex;flex-wrap:wrap;gap:2px;}
nav a{color:#fff;text-decoration:none;padding:10px 13px;font-family:Arial,sans-serif;font-size:.95rem;}
nav a:hover{background:var(--green-d);color:#fff;}

/* Hero */
.hero{background:linear-gradient(160deg,var(--green) 0%,var(--green-d) 100%);color:#fff;text-align:center;padding:56px 20px;}
.hero h1{color:#fff;font-size:2.1rem;margin-bottom:14px;}
.hero p{max-width:660px;margin:0 auto 24px;font-size:1.12rem;}
.hero .call-btn{font-size:1.25rem;padding:15px 30px;display:inline-block;}
.hero small{display:block;margin-top:14px;opacity:.9;font-size:.9rem;}

/* Trust bar */
.trust-bar{background:#fff;border-bottom:1px solid var(--line);}
.trust-bar .wrap{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 30px;padding-top:14px;padding-bottom:14px;}
.trust-bar span{font-family:Arial,sans-serif;font-size:.9rem;font-weight:bold;color:var(--green);letter-spacing:.01em;white-space:nowrap;}

/* Sections */
section{padding:40px 0;}
section h2{font-size:1.65rem;margin-bottom:8px;}
section > .wrap > h2:first-child + p{margin-top:6px;}
section h3{font-size:1.18rem;margin:22px 0 8px;}
section p{margin-bottom:15px;}
section ul{margin:0 0 15px 22px;}
section li{margin-bottom:7px;}
.alt{background:#edf1e9;}

/* Service cards */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:14px;}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:20px;box-shadow:0 1px 3px rgba(0,0,0,.04);}
.card h3{margin-top:0;}
.card a{font-family:Arial,sans-serif;font-weight:bold;text-decoration:none;}
.card a:hover{text-decoration:underline;}

/* Our Process — CSS-numbered steps */
.process{list-style:none;counter-reset:step;display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:18px;margin:18px 0 0;padding:0;}
.process li{counter-increment:step;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:24px 20px;margin:0;box-shadow:0 1px 3px rgba(0,0,0,.04);}
.process li::before{content:counter(step);display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;background:var(--green);color:#fff;font-family:Arial,sans-serif;font-weight:bold;font-size:1.2rem;margin-bottom:14px;}
.process li h3{margin:0 0 6px;font-size:1.06rem;}
.process li p{margin:0;font-size:.96rem;color:var(--muted);}

/* Common trees guide */
.tree-guide{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-top:16px;}
.tree-card{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--green);border-radius:8px;padding:18px 20px;box-shadow:0 1px 3px rgba(0,0,0,.04);}
.tree-card h3{margin:0 0 8px;font-size:1.12rem;}
.tree-card p{margin:0 0 10px;font-size:.96rem;}
.tree-card .verdict{font-family:Arial,sans-serif;font-size:.86rem;font-weight:bold;color:var(--green-d);display:block;margin-top:4px;}

/* FAQ — native details/summary, no JS */
.faq{margin-top:16px;}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:8px;margin-bottom:11px;box-shadow:0 1px 2px rgba(0,0,0,.03);}
.faq summary{font-family:Arial,sans-serif;font-weight:bold;font-size:1.03rem;color:var(--dark);padding:15px 46px 15px 18px;cursor:pointer;list-style:none;position:relative;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);font-size:1.5rem;line-height:1;color:var(--green);font-weight:bold;}
.faq details[open] summary::after{content:"\2013";}
.faq details[open] summary{border-bottom:1px solid var(--line);}
.faq details .answer{padding:15px 18px;}
.faq details .answer p{margin-bottom:12px;}
.faq details .answer p:last-child{margin-bottom:0;}

/* CTA band */
.cta-band{background:var(--dark);color:#fff;text-align:center;padding:38px 20px;}
.cta-band h2{color:#fff;margin-bottom:10px;font-size:1.55rem;}
.cta-band p{margin-bottom:0;}

/* Footer */
footer{background:#111;color:#b7bdb5;padding:34px 0 28px;font-size:.92rem;}
footer .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:22px 28px;align-items:start;}
footer a{color:#dfe4da;text-decoration:none;line-height:1.9;}
footer a:hover{color:#fff;text-decoration:underline;}
footer strong{color:#fff;font-family:Arial,sans-serif;display:inline-block;margin-bottom:8px;letter-spacing:.01em;}
footer p{font-size:.86rem;color:#8b918a;margin:0;}

@media(max-width:600px){
  body{font-size:17px;}
  .wrap{padding:0 18px;}
  .hero{padding:42px 18px;}
  .hero h1{font-size:1.6rem;}
  .hero p{font-size:1.05rem;}
  .hero .call-btn{display:block;width:100%;font-size:1.22rem;padding:17px;}
  header .wrap{gap:8px;}
  header .call-btn{padding:12px 16px;font-size:1rem;}
  section{padding:32px 0;}
  section h2{font-size:1.45rem;}
  .trust-bar .wrap{gap:7px 18px;}
  .trust-bar span{font-size:.82rem;}
  .cta-band .call-btn{display:inline-block;}
}
