#mkhome{--forest:#1A3C2A;--deep:#0F2419;--gold:#C8A951;--cream:#F5F0E6;--earth:#6B4F3A;--white:#FDFCF8;--red:#C6543F}
#mkhome *{box-sizing:border-box}
#mkhome{margin:0;background:var(--white);color:var(--deep);font-family:'DM Sans','Noto Sans Devanagari',-apple-system,Segoe UI,sans-serif}
#mkhome h1,#mkhome h2,#mkhome h3{font-family:'Playfair Display',Georgia,serif;margin:0}
#mkhome .mk-wrap{max-width:1180px;margin:0 auto;padding:0 24px}
#mkhome a{color:inherit}
#mkhome .mk-eyebrow{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--earth);font-weight:800;margin-bottom:6px}
#mkhome h2.mk-big{font-size:31px;line-height:1.15;font-weight:800}
#mkhome h2.mk-big em{font-style:normal;color:var(--gold)}
#mkhome section{padding:38px 0}
#mkhome .mk-tint{background:var(--cream)}
#mkhome .mk-dark{background:var(--deep);color:var(--cream)}
#mkhome .mk-btn{display:inline-flex;align-items:center;gap:8px;border-radius:100px;padding:12px 21px;font-weight:800;font-size:14px;text-decoration:none;border:none;cursor:pointer;font-family:inherit}
#mkhome .mk-btn.mk-gold{background:var(--gold);color:var(--deep)}
#mkhome .mk-btn.mk-dark{background:var(--forest);color:#fff}
#mkhome .mk-btn.mk-ghost{border:1.5px solid rgba(200,169,81,.6);color:inherit;background:transparent}

/* nav */
#mkhome .mk-nav{background:var(--white);border-bottom:1px solid rgba(200,169,81,.35);padding:11px 0}
#mkhome .mk-nav .mk-wrap{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
#mkhome .mk-logo{font-family:'Playfair Display',serif;font-weight:800;font-size:20px}
#mkhome .mk-logo b{color:var(--gold)}
#mkhome .mk-pillsel{border:1px solid rgba(200,169,81,.6);border-radius:100px;padding:5px 12px;font-size:12px;font-weight:700}
#mkhome .mk-ico{width:26px;height:26px;border-radius:50%;background:var(--cream);display:inline-block}
#mkhome .mk-menu{background:var(--white);border-bottom:1px solid rgba(200,169,81,.25);padding:9px 0}
#mkhome .mk-menu .mk-wrap{display:flex;gap:20px;flex-wrap:wrap;font-size:13.5px;font-weight:600}

/* hero */
#mkhome .mk-hero{background:linear-gradient(150deg,#0B1C13,var(--forest) 62%,#16341F);color:var(--cream);padding:34px 0 26px}
#mkhome .mk-hero .mk-wrap{display:grid;grid-template-columns:1.02fr .98fr;gap:32px;align-items:center}
#mkhome .mk-tagpill{display:inline-flex;gap:7px;border:1px solid rgba(200,169,81,.55);border-radius:100px;padding:5px 14px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);margin-bottom:14px}
#mkhome .mk-hero h1{font-size:42px;line-height:1.1;font-weight:800}
#mkhome .mk-hero h1 em{font-style:normal;color:var(--gold)}
#mkhome .mk-hero .mk-hi{font-family:'Noto Sans Devanagari',sans-serif;font-size:18px;margin:11px 0 9px;font-weight:600}
#mkhome .mk-hero p{margin:0 0 18px;font-size:14.5px;line-height:1.65;color:rgba(245,240,230,.88);max-width:33em}
#mkhome .mk-mapwrap{position:relative;background:rgba(245,240,230,.05);border:1px solid rgba(200,169,81,.35);border-radius:20px;padding:12px 12px 8px}
#mkhome #indiaMap{display:block;width:100%;height:auto;max-height:360px}
#mkhome .mk-near path{fill:rgba(245,240,230,.05);stroke:rgba(245,240,230,.14);stroke-width:.6}
#mkhome .mk-ind{fill:rgba(200,169,81,.10);stroke:var(--gold);stroke-width:1.5;stroke-linejoin:round}
#mkhome .mk-wide circle{fill:rgba(245,240,230,.42)}
#mkhome .mk-corr circle{fill:var(--gold);opacity:.92}
#mkhome .mk-halo{fill:rgba(200,169,81,.13);stroke:rgba(200,169,81,.5);stroke-width:1;stroke-dasharray:4 4}
#mkhome .mk-bp path{fill:var(--cream);stroke:var(--forest);stroke-width:1.5}
#mkhome .mk-bp .mk-core{fill:var(--forest)}
#mkhome .mk-mlab{position:absolute;right:20px;top:18px;text-align:right;font-size:10.5px;color:rgba(245,240,230,.9)}
#mkhome .mk-mlab b{display:block;color:var(--gold);font-size:12px}
#mkhome .mk-legend{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;padding:6px 4px 2px;font-size:10.5px;color:rgba(245,240,230,.85)}
#mkhome .mk-legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px;vertical-align:-1px}
#mkhome .mk-hsearch{display:flex;background:#fff;border-radius:100px;padding:5px;box-shadow:0 6px 22px rgba(0,0,0,.24);max-width:520px}
#mkhome .mk-hsearch input{flex:1;border:none;outline:none;padding:12px 17px;font-size:14.5px;font-family:inherit;border-radius:100px;color:var(--deep)}
#mkhome .mk-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:13px}
#mkhome .mk-chip{background:rgba(245,240,230,.94);color:var(--deep);border-radius:100px;padding:6px 14px;font-size:12.5px;font-weight:700}

/* auto-sliding carousel */
#mkhome .mk-carou{position:relative}
#mkhome .mk-track{display:flex;gap:15px;overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;padding-bottom:4px}
#mkhome .mk-track::-webkit-scrollbar{display:none}
#mkhome .mk-track>.mk-card{flex:0 0 calc((100% - 45px)/4)}
#mkhome .mk-dots{display:flex;gap:6px;justify-content:center;margin-top:12px}
#mkhome .mk-dots i{width:7px;height:7px;border-radius:50%;background:rgba(107,79,58,.3);display:block}
#mkhome .mk-dots i.mk-on{background:var(--gold);width:20px;border-radius:100px}


/* map slider — one pane on a desktop, two swipeable panes on a phone */
#mkhome .mk-mslider{display:block}
#mkhome .mk-mpane{display:block}
#mkhome .mk-mpane.mk-mzoom{display:none}
#mkhome .mk-mdots{display:none}
#mkhome #indiaZoom{display:block;width:100%;height:auto;max-height:360px}
#mkhome #indiaZoom .mk-wide circle{display:none}
#mkhome #indiaZoom .mk-corr circle{r:1.6}
#mkhome #indiaZoom .mk-ind{stroke-width:.5}
#mkhome #indiaZoom .mk-near path{stroke-width:.25}
#mkhome #indiaZoom .mk-halo{stroke-width:.4;stroke-dasharray:2 2}

/* Pin geometry is in absolute user units, so a tighter viewBox magnifies
   it. Scale the shape about its own tip so the anchor stays exactly on the
   coordinate while the pin returns to a sane size. */
#mkhome #indiaZoom .mk-bp path{transform:scale(.3);transform-origin:0 0;stroke-width:4}
#mkhome #indiaZoom .mk-bp .mk-core{transform:scale(.3);transform-origin:0 0}
#mkhome #indiaZoom .mk-halo{r:14}
#mkhome #indiaZoom .mk-corr circle{r:1.1}

@media(max-width:760px){#mkhome .mk-hero .mk-wrap{grid-template-columns:1fr}
#mkhome .mk-mslider{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;
    scrollbar-width:none;scroll-behavior:smooth}
#mkhome .mk-mslider::-webkit-scrollbar{display:none}
#mkhome .mk-mpane{flex:0 0 100%;scroll-snap-align:center}
#mkhome .mk-mpane.mk-mzoom{display:block}
#mkhome .mk-mdots{display:flex;gap:6px;justify-content:center;margin-top:8px}
#mkhome .mk-mdots i{width:7px;height:7px;border-radius:50%;background:rgba(245,240,230,.3);display:block}
#mkhome .mk-mdots i.mk-on{background:var(--gold);width:20px;border-radius:100px}
#mkhome #indiaMap,#mkhome #indiaZoom{max-height:250px}
#mkhome .mk-row4,#mkhome .mk-two,#mkhome .mk-why,#mkhome .mk-g3,#mkhome .mk-g4,#mkhome .mk-apps,#mkhome .mk-stats .mk-wrap,#mkhome .mk-foot .mk-cols{grid-template-columns:1fr}
#mkhome .mk-track>.mk-card{flex:0 0 82%}
#mkhome .mk-hero h1{font-size:31px}
#mkhome .mk-hsearch{max-width:none}}

/* stats */
#mkhome .mk-stats{background:var(--cream);border-top:1px solid rgba(200,169,81,.4);border-bottom:1px solid rgba(200,169,81,.4)}
#mkhome .mk-stats .mk-wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:18px 24px;text-align:center}
#mkhome .mk-stats b{display:block;font-family:'Playfair Display',serif;font-size:26px;color:var(--forest)}
#mkhome .mk-stats span{font-size:11px;color:var(--earth);letter-spacing:.05em;text-transform:uppercase;font-weight:700}

/* listing cards */
#mkhome .mk-row4{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
#mkhome .mk-card{background:#fff;border:1px solid rgba(200,169,81,.45);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
#mkhome .mk-card .mk-ph{height:118px;background:linear-gradient(#a9c6e2 38%,#9aad63 38%);position:relative}
#mkhome .mk-card .mk-ph .mk-tag{position:absolute;left:7px;bottom:7px;background:rgba(15,36,25,.82);color:#fff;font-size:9.5px;padding:3px 7px;border-radius:8px;font-weight:700}
#mkhome .mk-card .mk-b{padding:11px 12px;display:flex;flex-direction:column;gap:5px;flex:1}
#mkhome .mk-ref{font-family:ui-monospace,monospace;font-size:10.5px;color:var(--earth)}
#mkhome .mk-card .mk-t{font-weight:800;font-size:14px}
#mkhome .mk-meta{font-size:11.5px;color:var(--earth);display:flex;flex-wrap:wrap;gap:4px 9px}
#mkhome .mk-areabar{background:var(--gold);color:var(--deep);border-radius:8px;padding:6px 9px;font-weight:800;font-size:11.5px;text-align:center}
#mkhome .mk-gm{display:inline-flex;align-items:center;gap:5px;border:1.2px solid rgba(200,169,81,.6);border-radius:100px;padding:3px 9px;font-size:10.5px;font-weight:700;align-self:flex-start}
#mkhome .mk-pr{font-weight:800;font-size:14px;color:var(--forest)}
#mkhome .mk-pr small{font-weight:600;color:var(--earth);font-size:11px}
#mkhome .mk-wa{background:var(--forest);color:#fff;border-radius:100px;padding:7px 12px;font-size:11.5px;font-weight:800;text-align:center;margin-top:auto}

/* trusted */
#mkhome .mk-tp{display:grid;grid-template-columns:.92fr 1.08fr;gap:28px;align-items:center}
#mkhome .mk-tpbox{background:var(--forest);color:var(--cream);border-radius:16px;padding:20px 22px}
#mkhome .mk-tpbox .mk-hd{font-family:'Noto Sans Devanagari',sans-serif;color:var(--gold);font-weight:700;font-size:15px}
#mkhome .mk-tpbox .mk-sub{font-size:11.5px;opacity:.85;margin:2px 0 12px}
#mkhome .mk-tprow{display:flex;gap:12px;align-items:baseline;padding:7px 0;border-bottom:1px dashed rgba(245,240,230,.18);font-size:12.5px}
#mkhome .mk-tprow b{font-family:'Playfair Display',serif;font-size:22px;color:var(--gold);min-width:34px}

/* learn */
#mkhome .mk-g3{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
#mkhome .mk-lcard{border:1px solid rgba(200,169,81,.45);border-radius:12px;padding:15px 16px;background:#fff}
#mkhome .mk-lcard b{display:block;font-size:14.5px;margin-bottom:5px}
#mkhome .mk-lcard p{margin:0 0 8px;font-size:12.5px;color:var(--earth);line-height:1.6}
#mkhome .mk-lcard a{display:block;font-size:12px;font-weight:700;color:var(--forest);text-decoration:none;margin-top:3px}
#mkhome .mk-g4{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}
#mkhome .mk-zone{border:1px solid rgba(200,169,81,.45);border-radius:12px;padding:14px;background:#fff}
#mkhome .mk-zone b{display:block;font-size:14.5px}
#mkhome .mk-zone span{font-size:12px;color:var(--earth)}
#mkhome .mk-two{display:grid;grid-template-columns:1fr 1fr;gap:34px}
#mkhome .mk-why{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#mkhome .mk-why div{background:#fff;border:1px solid rgba(200,169,81,.4);border-radius:11px;padding:13px 15px}
#mkhome .mk-why b{display:block;font-size:14px;margin-bottom:3px}
#mkhome .mk-why span{font-size:12px;color:var(--earth);line-height:1.5}
#mkhome .mk-guide{display:block;background:#fff;border:1px solid rgba(200,169,81,.45);border-left:4px solid var(--gold);border-radius:0 10px 10px 0;padding:12px 16px;margin-bottom:10px;text-decoration:none;color:inherit}
#mkhome .mk-guide b{font-size:14px}
#mkhome .mk-guide span{display:block;font-size:12px;color:var(--earth);margin-top:2px}

/* apps */
#mkhome .mk-apps{display:grid;grid-template-columns:repeat(5,1fr);gap:13px}
/* the carousel engine rebuilds this as a flex rail; #mkhome outranks the
   engine's .azc-cols-4 width, so the four-per-view widths live here too (2 Sep 2026) */
#mkhome .mk-apps.azc-track{gap:13px}
#mkhome .mk-apps.azc-track>*{width:calc(25% - 10px);min-width:0}
@media(max-width:1023px){#mkhome .mk-apps.azc-track>*{width:calc(33.34% - 9px)}}
@media(max-width:760px){#mkhome .mk-apps.azc-track>*{width:calc(50% - 7px)}}
@media(max-width:480px){#mkhome .mk-apps.azc-track>*{width:clamp(220px,78vw,300px)}}
#mkhome .mk-app{border:1px solid rgba(200,169,81,.5);border-radius:13px;padding:14px;background:#fff}
#mkhome .mk-app b{display:block;font-size:13.5px;margin-bottom:4px}
#mkhome .mk-app ul{margin:6px 0 0;padding-left:15px;font-size:11px;color:var(--earth);line-height:1.6}
#mkhome .mk-app .mk-pkg{font-family:ui-monospace,monospace;font-size:9.5px;color:var(--earth);margin-top:7px;display:block}

/* look up */
#mkhome .mk-search{display:flex;background:#fff;border-radius:100px;padding:5px;border:1.5px solid rgba(200,169,81,.6);max-width:720px}
#mkhome .mk-search input{flex:1;border:none;outline:none;padding:11px 16px;font-size:14px;font-family:inherit;border-radius:100px}
#mkhome .mk-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
#mkhome .mk-tab{border:1.2px solid rgba(200,169,81,.6);border-radius:100px;padding:6px 13px;font-size:12px;font-weight:700}
#mkhome .mk-tab.mk-on{background:var(--forest);color:#fff;border-color:var(--forest)}
#mkhome .mk-links{columns:3;font-size:12.5px;line-height:2;margin-top:14px;color:var(--forest)}

/* footer */
#mkhome .mk-foot{background:var(--deep);color:rgba(245,240,230,.75);padding:30px 0 22px;font-size:12.5px;line-height:1.7}
#mkhome .mk-foot .mk-cols{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin:20px 0}
#mkhome .mk-foot h4{color:var(--gold);font-family:'Playfair Display',serif;font-size:14px;margin:0 0 8px}
#mkhome .mk-foot li{list-style:none;margin:0 0 5px;font-size:12px}
#mkhome .mk-foot ul{padding:0;margin:0}
#mkhome .mk-disc{border-top:1px solid rgba(245,240,230,.15);margin-top:14px;padding-top:14px;font-size:10.5px;line-height:1.65;color:rgba(245,240,230,.62)}
#mkhome .mk-note{background:#FDF6F3;border-left:4px solid var(--red);padding:13px 17px;border-radius:0 10px 10px 0;font-size:12.5px;line-height:1.6;color:#7a2c1c;margin:0 0 22px}
/* --- bridges between the mockup and the live site --------------------- */
#mkhome{overflow-x:clip}
#mkhome section{padding:38px 0}
#mkhome .mk-hero .mk-wrap,#mkhome .mk-stats .mk-wrap{max-width:1180px}
#mkhome .mk-chip{text-decoration:none}
#mkhome .mk-tprow{display:flex;gap:12px;align-items:baseline;padding:7px 0;
  border-bottom:1px dashed rgba(245,240,230,.18);font-size:12.5px;text-decoration:none;color:inherit}
#mkhome .mk-tprow:hover b{text-decoration:underline}
/* real photographs sit in the card's picture band */
#mkhome .mk-card .mk-ph{overflow:hidden}
#mkhome .mk-card .mk-ph img{width:100%;height:100%;object-fit:cover;display:block}
#mkhome .mk-gm,#mkhome .mk-wa{text-decoration:none}
#mkhome .mk-wa{display:block}
#mkhome .mk-alinks{display:flex;flex-direction:column;gap:6px;margin-top:8px;align-items:flex-start}
#mkhome .mk-gplay{display:inline-block;line-height:0}
#mkhome .mk-gplay img{height:40px;width:auto;display:block}
#mkhome .mk-gplay-txt{display:inline-block;background:#0F2419;color:#fff;border-radius:8px;padding:9px 14px;font-size:12px;font-weight:800;line-height:1;white-space:nowrap}
/* card actions: View listing beside the WhatsApp button (2 Sep 2026) */
#mkhome .mk-acts{display:flex;gap:8px;margin-top:auto}
#mkhome .mk-acts .mk-wa{margin-top:0;flex:1 1 auto}
#mkhome .mk-view{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;border:1.5px solid var(--forest);
  color:var(--forest);border-radius:100px;padding:7px 12px;font-size:11.5px;font-weight:800;text-decoration:none;white-space:nowrap}
#mkhome .mk-view:hover{background:var(--forest);color:#fff}
#mkhome .mk-alinks a{font-size:11px;font-weight:800;color:var(--forest);text-decoration:none}
/* the track is a scroller: it must never paint outside the wrap */
#mkhome .mk-carou{overflow:hidden}
#mkhome .mk-track{max-width:100%}
/* site index keeps its own stylesheet; only the shell is the mockup's */
#mkhome .sm-inline{padding:0}
#mkhome .sm-inline .sm-sub{max-width:720px}
/* Hero map: one pane that flies from India to the belt. The second static
   pane and its dots are gone — an animation that lands where the other pane
   already sat was showing the same thing twice. */
#mkhome .mk-mslider{display:block!important;overflow:visible!important}
#mkhome .mk-mpane{flex:none!important;display:block!important}
#mkhome #indiaMap .mk-ind,#mkhome #indiaMap .mk-near path,
#mkhome #indiaMap .mk-halo,#mkhome #indiaMap .mk-bp path{
  vector-effect:non-scaling-stroke}
#mkhome .mk-pinlink{cursor:pointer}
#mkhome .mk-pinlink .mk-bp path{transition:filter .2s}
#mkhome .mk-pinlink:hover .mk-bp path{filter:brightness(1.15)}
#mkhome .mk-pinlink:focus-visible .mk-hit{stroke:#C8A951;stroke-width:2}
@media(prefers-reduced-motion:reduce){
  #mkhome #indiaMap{transition:none}
}
/* Apps: four per view, sliding to the rest. Was five-across when there were
   five apps; a sixth (the marketplace app) made that a half-cut card, and
   Adheer asked for four with the rail auto-sliding (2 Sep 2026). */
@media(min-width:1024px){
  #mkhome .mk-apps.azc-track>*{width:calc((100% - 39px)/4)}
  /* nothing to scroll to, so the arrows are only sitting on the copy */
  #mkhome .azc-btn[disabled]{opacity:0;pointer-events:none}
}
/* The mockup's own mobile-collapse rule is dead — .two/.why/.g4 are declared
   after its media query, so they win at every width. Re-assert them here. */
@media(max-width:760px){
  #mkhome .mk-two,#mkhome .mk-why,#mkhome .mk-g4{grid-template-columns:1fr}
}
/* Tablet: four 169px cards is a shelf of stamps. Two, then one. */
@media(min-width:761px) and (max-width:1023px){
  #mkhome .mk-track>.mk-card{flex:0 0 calc((100% - 15px)/2)}
  #mkhome .mk-apps{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:760px){
  #mkhome .mk-tp{grid-template-columns:1fr}
  #mkhome .mk-apps{grid-template-columns:1fr 1fr}
  #mkhome .mk-two{gap:24px}
}
@media(max-width:520px){
  #mkhome .mk-apps{grid-template-columns:1fr}
  #mkhome .mk-why{grid-template-columns:1fr}
  #mkhome .mk-stats .mk-wrap{grid-template-columns:1fr 1fr}
}

/* AgriZameen Social moved out of the hero on 16 Aug — it lives in the Explore
   dropdown and the footer now, on every page rather than only this one. The
   .mk-hsoc rule went with the button; dead CSS is how a stylesheet stops
   being readable. The hero's bottom padding came down with it, because the
   gap below the chips was sized for a row that is no longer there. */
