@import url('https://fonts.googleapis.com/css2?family=Pontano+Sans&display=swap');

:root { --green:#448800; --green-dark:#326600; --charcoal:#1d1d1d; --ink:#333; --soft:#888; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; padding:10px 18px 40px; background:#fff; color:var(--ink); font-family:'Pontano Sans',Tahoma,sans-serif; font-size:14px; line-height:1.45; }
a { color:var(--green); text-decoration:none; }
a:hover, a:focus { color:var(--green-dark); text-decoration:underline; }
.skip-link { position:absolute; left:-9999px; }
.skip-link:focus { left:12px; top:8px; z-index:10; background:#fff; padding:10px; }
.site-shell { width:min(940px,100%); margin:0 auto; }
.masthead { min-height:215px; display:flex; justify-content:space-between; align-items:center; gap:24px; }
.brand { display:flex; align-items:center; gap:20px; color:var(--green); padding:8px 0; min-width:0; }
.brand:hover { text-decoration:none; }
.brand img { width:180px; height:auto; display:block; flex:0 0 auto; }
.company-heading { display:flex; flex-direction:column; min-width:0; }
.company-heading strong { color:var(--green); font-size:42px; line-height:1; font-weight:500; white-space:nowrap; }
.company-heading small { margin-top:4px; color:#555; font-size:12px; line-height:1.2; }
.contact-summary { display:flex; flex-direction:column; align-items:flex-end; padding-top:4px; color:#aaa; font-size:12px; line-height:1.45; }
.contact-summary strong { color:#222; font-size:14px; font-weight:500; }
.contact-summary strong a { color:#222; }
.contact-summary .header-email { color:var(--green); font-size:12px; }
.main-nav { min-height:36px; display:flex; align-items:stretch; background:var(--charcoal); border-bottom:4px solid var(--green); }
.main-nav a { display:flex; align-items:center; padding:0 12px; color:#fff; border-right:1px solid #555; }
.main-nav a:hover, .main-nav a:focus { background:#2a2a2a; text-decoration:none; }
.hero { position:relative; margin-top:20px; min-height:326px; overflow:hidden; background:#17384d; }
.hero img { display:block; width:100%; height:326px; object-fit:cover; }
.hero:after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(3,31,49,.55),transparent 55%); pointer-events:none; }
.hero-message { position:absolute; z-index:1; left:30px; right:30px; top:29px; color:#fff; font-size:21px; line-height:1.45; text-shadow:0 1px 2px rgba(0,0,0,.25); }
.hero-button { position:absolute; z-index:2; left:30px; top:150px; padding:14px 17px; color:#fff; background:var(--green); border-radius:4px; font-size:18px; box-shadow:0 2px 3px rgba(0,0,0,.22); }
.hero-button:hover, .hero-button:focus { color:#fff; background:var(--green-dark); text-decoration:none; }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; padding:16px 0 22px; border-bottom:1px solid #333; }
.feature-grid article { min-width:0; }
.feature-grid h2 { margin:4px 0 7px; color:#222; font-size:20px; font-weight:500; }
.feature-grid p { color:#888; margin:4px 0; }
.feature-grid p a { float:right; }
.feature-icon { display:block; height:67px; color:var(--green); font-size:46px; line-height:62px; text-align:center; letter-spacing:-20px; padding-right:20px; }
a.feature-icon { letter-spacing:0; }
.calculator { font-size:62px; line-height:62px; }
footer { position:relative; padding-top:20px; color:#222; }
footer p { margin:2px 0 0; font-size:12px; }
.back-top { position:absolute; right:0; top:20px; }

@media (max-width:720px) {
  body { padding:8px 12px 28px; }
  .masthead { align-items:center; }
  .masthead { min-height:180px; }
  .brand { gap:12px; }
  .brand img { width:145px; }
  .company-heading strong { font-size:31px; white-space:normal; }
  .company-heading small { font-size:10px; }
  .contact-summary { font-size:10px; }
  .contact-summary strong { font-size:12px; }
  .hero, .hero img { min-height:340px; height:340px; }
  .hero-message { left:20px; right:20px; top:24px; font-size:18px; }
  .hero-button { left:20px; top:190px; }
  .feature-grid { grid-template-columns:1fr; gap:10px; }
  .feature-grid article { padding-bottom:15px; border-bottom:1px solid #ddd; }
  .feature-grid article:last-child { border-bottom:0; }
}
@media (max-width:500px) {
  .masthead { flex-direction:column; align-items:flex-start; gap:2px; }
  .contact-summary { align-items:flex-start; padding-bottom:10px; }
  .brand img { width:140px; }
  .company-heading strong { font-size:27px; }
  .main-nav a { flex:1; justify-content:center; }
  .hero-message { font-size:17px; }
  footer { padding-right:0; }
  .back-top { position:static; float:right; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }