/* =========================================================
   MEOWMAP — FINAL V4 INTEGRATION
   Loaded after the main site style.css.
   ========================================================= */

.meowmap-page{background:#f7f2ea;color:#161516}
.meowmap-main{overflow:hidden}

.meowmap-hero{
  padding:72px 0;
  background:
    radial-gradient(circle at 82% 25%,rgba(111,65,181,.18),transparent 31%),
    radial-gradient(circle at 77% 82%,rgba(27,150,115,.09),transparent 25%),
    #0b0b0d;
  color:#fff;
}
.meowmap-hero-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.55fr);gap:70px;align-items:end}
.meowmap-hero h1{margin-top:18px;font-size:clamp(52px,6vw,86px);line-height:.94;letter-spacing:-.055em;color:#fff}
.meowmap-hero h1 span{color:var(--orange)}
.meowmap-hero p{max-width:760px;margin-top:25px;color:#b8b4bc;font-size:18px;line-height:1.7}
.meowmap-hero-card{padding:30px;border:1px solid #38363d;border-radius:26px;background:rgba(31,30,35,.88);display:grid}
.meowmap-hero-card span{color:var(--orange);font-size:11px;font-weight:700;letter-spacing:.14em}
.meowmap-hero-card strong{margin-top:8px;font-size:64px;line-height:1;color:#fff}
.meowmap-hero-card b{font-size:20px;color:#fff}
.meowmap-hero-card small{margin-top:12px;color:#aaa6ad}

.meowmap-workspace{padding:46px 0 70px;background:#f7f2ea}
.meowmap-toolbar{
  margin-bottom:18px;padding:18px;border:1px solid #ded6cc;border-radius:22px;background:#fff;
  display:grid;grid-template-columns:190px minmax(220px,1fr) auto;gap:12px;align-items:end;
  box-shadow:0 16px 50px rgba(22,18,12,.06)
}
.map-field{display:grid;gap:6px}
.map-field label{font-size:10px;font-weight:700;letter-spacing:.12em;color:#77716b;text-transform:uppercase}
.map-field select,.map-field input{
  width:100%;height:46px;padding:0 14px;border:1px solid #ddd5cc;border-radius:12px;background:#faf7f2;color:#191719;
  font:500 13px "Fredoka",sans-serif;outline:none
}
.map-field select:focus,.map-field input:focus{border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,133,0,.1)}
.map-location-button{
  height:46px;padding:0 18px;border:0;border-radius:12px;background:#111;color:#fff;font-weight:650;cursor:pointer
}
.map-location-button:hover{background:var(--orange);color:#111}
.poi-options{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding-top:4px}
.poi-options label{cursor:pointer}
.poi-options input{position:absolute;opacity:0;pointer-events:none}
.poi-options span{
  min-height:46px;padding:8px 12px;border:1px solid #e2dad1;border-radius:12px;background:#fbf8f3;
  display:flex;align-items:center;justify-content:center;gap:8px;color:#514d49;font-size:12px;font-weight:600;transition:.18s
}
.poi-options img{width:25px;height:25px;object-fit:contain}
.poi-options input:checked+span{border-color:var(--orange);background:#fff0dc;color:#111;box-shadow:inset 0 0 0 1px var(--orange)}

#map-container{display:grid;grid-template-columns:170px minmax(0,1fr) 170px;gap:12px;align-items:stretch}
#map{
  min-height:650px;position:relative;overflow:hidden;border:1px solid #d8d0c7;border-radius:24px;background:#ddd;
  box-shadow:0 22px 60px rgba(22,18,12,.10);z-index:1
}
.map-banner{
  padding:10px;border:1px solid #ded6cc;border-radius:22px;background:#fff;
  display:grid;grid-template-rows:repeat(4,1fr);gap:10px;min-width:0
}
.ad-slot{
  appearance:none;width:100%;min-height:0;padding:6px;border:1px dashed #e7b36e;border-radius:14px;background:#fbf7f1;
  display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:pointer;transition:.18s
}
.ad-slot:hover{border-color:var(--orange);transform:translateY(-2px);box-shadow:0 10px 24px rgba(255,133,0,.12)}
.ad-slot img{width:100%;height:100%;max-height:135px;object-fit:contain;border-radius:9px}
.basarsoft-logo{position:absolute;left:10px;bottom:10px;z-index:500;width:auto;height:32px;padding:5px 7px;border-radius:8px;background:rgba(255,255,255,.9)}

.map-action-row{margin-top:16px;display:flex;justify-content:flex-end;gap:9px}
.map-action{min-height:46px;padding:0 18px;border-radius:999px;font-weight:650;cursor:pointer}
.map-action-dark{border:1px solid #242326;background:#111;color:#fff}
.map-action-orange{border:1px solid var(--orange);background:var(--orange);color:#111}

.meowmap-info{padding:80px 0;background:#101012;color:#fff}
.meowmap-info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.meowmap-info article{min-height:230px;padding:28px;border:1px solid #302f34;border-radius:22px;background:#18181b}
.map-info-number{color:var(--orange);font-size:11px;font-weight:700;letter-spacing:.12em}
.meowmap-info h2{margin-top:32px;color:#fff;font-size:27px;line-height:1.05}
.meowmap-info p{margin-top:14px;color:#aaa6ad;line-height:1.65;font-size:14px}
.meowmap-info strong{color:#fff}

.map-about{padding:65px 0;background:#f7f2ea}
.map-about-inner{display:grid;grid-template-columns:1fr auto;gap:50px;align-items:center}
.map-about h2{margin-top:12px;font-size:42px;letter-spacing:-.04em}
.map-about p{margin-top:10px;color:#706b66}
.map-about-inner>a{padding:20px 26px;border:1px solid #ded6cc;border-radius:18px;background:#fff}
.map-about-inner>a img{width:170px;max-height:55px;object-fit:contain}

.leaflet-popup-content{font-family:"Fredoka",sans-serif!important}
.leaflet-popup-content form{min-width:220px;color:#333}
.leaflet-popup-content form p{margin:8px 0}
.leaflet-popup-content form input{
  width:100%;margin:4px 0;padding:9px 10px;border:1px solid #d7d0c8;border-radius:8px;font:inherit
}
.leaflet-popup-content form button{
  width:100%;margin-top:7px;padding:10px;border:0;border-radius:8px;background:var(--orange);color:#111;font:700 13px "Fredoka",sans-serif;cursor:pointer
}

/* Modals */
.map-modal{
  position:fixed;inset:0;z-index:10000;padding:24px;background:rgba(5,5,7,.76);backdrop-filter:blur(8px);
  display:none;align-items:center;justify-content:center;overflow:auto
}
.map-modal.open{display:flex}
.map-modal-card{
  position:relative;width:min(620px,100%);max-height:calc(100vh - 48px);overflow:auto;padding:34px;border:1px solid #37353b;
  border-radius:26px;background:#18181b;color:#fff;box-shadow:0 30px 100px rgba(0,0,0,.38)
}
.map-modal-close{position:absolute;right:18px;top:15px;width:36px;height:36px;border:1px solid #39373d;border-radius:50%;background:#222226;color:#fff;font-size:23px;cursor:pointer}
.modal-kicker{color:var(--orange);font-size:10px;font-weight:700;letter-spacing:.15em}
.map-modal h2{margin-top:10px;color:#fff;font-size:36px;line-height:1.05;letter-spacing:-.035em}
.map-modal-card>p{margin-top:12px;color:#aaa6ad}
.map-form{margin-top:24px;display:grid;gap:12px}
.map-form label{display:grid;gap:6px;color:#d6d2da;font-size:11px;font-weight:600}
.map-form input,.map-form textarea{
  width:100%;padding:12px 13px;border:1px solid #37353b;border-radius:11px;background:#101012;color:#fff;font:inherit;resize:vertical;outline:none
}
.map-form input:focus,.map-form textarea:focus{border-color:var(--orange)}
.map-form button,.modal-primary{min-height:48px;border:0;border-radius:12px;background:var(--orange);color:#111;font-weight:700;cursor:pointer}
.pricing-list{margin-top:24px;display:grid;gap:8px}
.pricing-list div{padding:14px 16px;border:1px solid #333137;border-radius:12px;background:#101012;display:flex;justify-content:space-between;gap:20px}
.pricing-list span{color:#aaa6ad}.pricing-list strong{color:#fff}
.modal-note{margin:18px 0;padding:16px;border:1px solid rgba(255,133,0,.3);border-radius:13px;background:rgba(255,133,0,.07)}
.modal-note strong{color:var(--orange)}.modal-note p{margin-top:5px;color:#aaa6ad}
.modal-primary{width:100%}
.help-grid{margin-top:24px;display:grid;grid-template-columns:1fr 1fr;gap:9px}
.help-grid div{padding:16px;border:1px solid #333137;border-radius:13px;background:#101012}
.help-grid strong{color:var(--orange)}.help-grid p{margin-top:5px;color:#aaa6ad;font-size:13px}
.icon-legend{margin-top:18px;padding:0;list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.icon-legend li{padding:10px;border:1px solid #333137;border-radius:11px;display:flex;align-items:center;gap:7px;color:#ddd;font-size:11px}
.icon-legend img{width:25px;height:25px}

/* Floating cat — same left-side treatment as final homepage */
.meowist-corner{
  position:fixed;left:18px;bottom:20px;z-index:9000;pointer-events:none;transform:translateZ(0)
}
.meowist-gif{width:100px;height:auto;display:block;filter:drop-shadow(0 14px 36px rgba(0,0,0,.28));user-select:none}
.meowist-bubble{
  position:absolute;left:-4px;bottom:calc(100% + 24px);min-width:210px;max-width:285px;padding:12px 42px 12px 14px;
  border:1px solid rgba(255,255,255,.1);border-radius:14px;background:#0f1115;color:#fff;
  box-shadow:0 14px 36px rgba(0,0,0,.28);opacity:0;visibility:hidden;transform:translateY(8px);transition:.24s ease;pointer-events:auto
}
.meowist-bubble.show{opacity:1;visibility:visible;transform:none}
.meowist-bubble:after{content:"";position:absolute;left:28px;bottom:-8px;width:16px;height:16px;background:#0f1115;border-right:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1);transform:rotate(45deg)}
.meowist-cta{display:block;color:#fff!important;font-size:12px;font-weight:650;white-space:nowrap}
.meowist-close{position:absolute;right:8px;top:7px;width:26px;height:26px;border:0;background:transparent;color:#8f8c94;font-size:18px;cursor:pointer}

/* Keep the homepage header visual language, but no false active nav state on MeowMap */
.meowmap-page .main-nav a.active:after{display:none!important}

@media(max-width:1100px){
  #map-container{grid-template-columns:1fr}
  #map{order:1;min-height:600px}
  .map-banner{grid-template-columns:repeat(4,1fr);grid-template-rows:1fr}
  .banner-left{order:2}.banner-right{order:3}
  .ad-slot img{max-height:95px}
}
@media(max-width:850px){
  .meowmap-hero-grid{grid-template-columns:1fr;gap:30px}
  .meowmap-hero-card{max-width:420px}
  .meowmap-toolbar{grid-template-columns:1fr 1fr}
  .map-location-button{grid-column:1/-1}
  .poi-options{grid-template-columns:1fr 1fr}
  .meowmap-info-grid{grid-template-columns:1fr}
  .map-about-inner{grid-template-columns:1fr}
  .map-about-inner>a{width:max-content}
  .map-banner{grid-template-columns:1fr 1fr}
  .help-grid{grid-template-columns:1fr}
  .icon-legend{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){
  .meowmap-hero{padding:52px 0}
  .meowmap-hero h1{font-size:50px}
  .meowmap-toolbar{grid-template-columns:1fr;padding:13px}
  .map-location-button,.poi-options{grid-column:auto}
  .poi-options{grid-template-columns:1fr 1fr}
  #map{min-height:500px;border-radius:18px}
  .map-banner{grid-template-columns:1fr 1fr;padding:7px}
  .map-action-row{display:grid}
  .map-action{width:100%}
  .map-modal{padding:12px}
  .map-modal-card{padding:28px 20px}
  .pricing-list div{display:grid;gap:2px}
  .meowist-corner{left:10px;bottom:58px}
  .meowist-gif{width:68px}
  .meowist-bubble{min-width:190px;max-width:235px}
}