/* ==========================================================================
   AgriZameen — ZONE MAP page styles                 /az-zonemap.css
   Lifted from the homepage on 15 Aug 2026. The rules below use the brand
   variables, which on the homepage were declared on #mkhome — a scope this
   page does not have. Without them background:var(--forest-deep) resolves
   to nothing, the section renders on white with cream text, and every word
   in it disappears. Declared here so the section is self-sufficient.
   ========================================================================== */
:root{--forest:#1A3C2A;--forest-deep:#0F2419;--gold:#C8A951;--gold-light:#E8D48B;
      --gold-dark:#6F5518;--cream:#F5F0E6;--earth:#6B4F3A}

.section-label{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:4px;text-transform:uppercase;color:#6E5417;margin-bottom:12px;display:block}
.section-title{font-family:'Playfair Display',Georgia,serif;font-size:clamp(2rem,5vw,3.2rem);font-weight:800;line-height:1.15;color:var(--forest-deep);margin-bottom:20px}
.section-title em{color:var(--gold-dark);font-style:normal}
.hero-search .btn-primary{flex:0 0 auto;padding:11px 20px}
@media(max-width:768px){
  .hero-search .btn-primary{padding:11px 15px;font-size:13.5px}}
.zonemap-sec{padding:66px 0;background:var(--cream)}
.zonemap-sub{max-width:640px;color:var(--earth);margin-bottom:26px;line-height:1.7}
.zonemap-note{font-size:11.5px;opacity:.75;margin-top:12px}
.zonemap-cta{margin-top:22px;text-align:center}
#focus .zonemap-cta,.focus-map .zonemap-cta{display:block!important;text-align:center!important}
#focus .zonemap-cta>a,.focus-map .zonemap-cta>a{margin:0 auto}
.focus-also{margin-top:22px;font-size:14px;color:rgba(245,240,230,.55)}
.focus-also a{color:var(--gold-light);text-decoration:none;font-weight:600}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:4px}
.srch-item:hover,.srch-item:focus{background:var(--cream)}
.listings-head .section-title{margin:0}
.listings-head .btn-primary{flex:0 0 auto}
@media(max-width:560px){.listings-head .btn-primary{width:100%;text-align:center}}
#focus .zonemap-sub,.focus-map .zonemap-sub{color:rgba(245,240,230,.85)!important}
#focus .zonemap-note,.focus-map .zonemap-note{color:rgba(245,240,230,.62)!important}
.focus-map{margin-top:26px}
.focus-map .section-label{color:#C8A951}
.focus-map .section-title{color:var(--cream)}
.focus-map .section-title em{color:#E8D48B}
.focus-map .zonemap-sub{color:rgba(245,240,230,.86)}
.focus-map .zonemap-note{color:rgba(245,240,230,.62)}
.apps-sec .section-title{color:var(--cream)}
.btn-primary{display:inline-flex;align-items:center;gap:8px;background:var(--gold);color:var(--forest-deep);padding:16px 32px;border-radius:12px;font-size:15px;font-weight:700;text-decoration:none;transition:all 0.3s;box-shadow:0 4px 20px rgba(200,169,81,0.4)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 30px rgba(200,169,81,0.5)}
.focus{padding:74px 0;background:var(--forest-deep);color:var(--cream);position:relative;overflow:hidden}
.focus::before{content:'';position:absolute;top:-200px;right:-200px;width:600px;height:600px;background:radial-gradient(circle,rgba(200,169,81,0.08) 0%,transparent 70%)}
.focus .section-title{color:var(--cream)}
.focus .section-title em{color:var(--gold)}
.focus-subtitle{font-size:16px;color:rgba(245,240,230,0.72);max-width:none;margin-bottom:34px;line-height:1.75}
.focus-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;position:relative;z-index:1}
.focus-card{background:rgba(255,255,255,0.04);border:1px solid rgba(200,169,81,0.15);border-radius:16px;padding:28px 20px;text-align:center;transition:all 0.4s;cursor:default}
.focus-card:hover{background:rgba(200,169,81,0.1);border-color:var(--gold);transform:translateY(-4px)}
.focus-card .fc-icon{font-size:36px;margin-bottom:16px}
.focus-card h3{font-family:'Playfair Display',Georgia,serif;font-size:20px;font-weight:700;color:var(--gold);margin-bottom:8px}
.focus-card p{font-size:12px;color:rgba(245,240,230,0.5);line-height:1.6}
.services .section-title{color:var(--cream)}
.services .section-title em{color:var(--gold)}
.knowledge .section-title{color:var(--cream);margin-bottom:0}
.knowledge .section-title em{color:var(--gold)}
.knowledge .section-label{color:var(--gold-light)}
.states-sec .section-title{color:var(--cream)}
.states-sec .section-title em{color:var(--gold)}
.states-sec .section-label{color:var(--gold-light)}
.state-dropdown:focus{border-color:var(--gold)}
@media (max-width:1024px){.focus-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:768px){.focus-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:480px){.focus-grid{grid-template-columns:1fr}}