/* Explore Puncak — Location Hub Decision-First v1.1
 * v0.30.1 hero baseline alignment for /lokasi/.
 * Scope is local to .ep-location-hub. It does not alter Flatsome header,
 * global typography, global button system, or the v0.29.1 UI safeguards.
 */
.ep-location-hub{
  --eploc-deep:#1a3624;
  --eploc-pine:#19442b;
  --eploc-moss:#6f984c;
  --eploc-olive:#65744e;
  --eploc-trail:#5f7533;
  --eploc-leaf:#5c873b;
  --eploc-sage:#949c6d;
  --eploc-paper:#fffefa;
  --eploc-ivory:#f7f6f0;
  --eploc-soft:#eef3eb;
  --eploc-text:#1a3624;
  --eploc-muted:#68776e;
  --eploc-line:#dfe7df;
  --eploc-shadow:0 8px 24px rgba(19,59,39,.055);
  color:var(--eploc-text);
  background:var(--eploc-paper);
  font-family:Calibri,"Segoe UI",Arial,sans-serif;
  font-size:11px;
  line-height:1.55;
}
.ep-location-hub *{box-sizing:border-box}
.ep-location-hub img{display:block;max-width:100%}
.ep-location-hub a{text-decoration:none}
.ep-location-hub h1,.ep-location-hub h2,.ep-location-hub h3,.ep-location-hub p{font-family:Calibri,"Segoe UI",Arial,sans-serif}
.ep-location-hub h2{font-size:24px;line-height:1.15;font-weight:800;letter-spacing:-.01em}
.ep-location-hub h3{font-size:16px;line-height:1.2;font-weight:800}
.ep-location-hub p{font-size:11px;line-height:1.55}

/* HERO — uses the same Shared Hero geometry, slider, overlay, typography and button system as the other hubs.
 * Location-only rules below are decorative only and never redefine hero height, H1 size, paragraph size, overlay or buttons.
 */
.ep-location-hub .ep-shared-hero-location-hub .ep-hero-inner{position:relative}
.ep-location-hub .ep-shared-hero-location-hub .ep-hero-copy{position:relative;z-index:3}
.ep-location-hub .ep-shared-hero-breadcrumb{display:flex;align-items:center;gap:7px;margin:0 0 16px;color:rgba(255,255,255,.78);font-family:Calibri,"Segoe UI",Arial,sans-serif;font-size:10px;line-height:1.35;font-weight:600}
.ep-location-hub .ep-shared-hero-breadcrumb a{color:#fff;text-decoration:none}.ep-location-hub .ep-shared-hero-breadcrumb a:hover{color:#d7e8cb}
.ep-location-hub .ep-shared-hero-aside{position:absolute;right:0;top:50%;z-index:2;width:min(380px,34%);height:315px;transform:translateY(-48%);pointer-events:none}
.ep-location-hub .eploc-hero-collage{position:relative;width:100%;height:100%}
.ep-location-hub .eploc-hero-note{position:absolute;left:1%;top:32%;z-index:4;max-width:150px;color:#fff;font-family:Calibri,"Segoe UI",Arial,sans-serif;font-size:14px;line-height:1.2;font-style:italic;font-weight:700;transform:rotate(-6deg);text-shadow:0 2px 10px rgba(0,0,0,.45)}
.ep-location-hub .eploc-polaroid{position:absolute;padding:6px;background:#fff;border:1px solid rgba(255,255,255,.88);box-shadow:0 12px 28px rgba(7,31,20,.28)}
.ep-location-hub .eploc-polaroid img{width:100%;height:100%;object-fit:cover}
.ep-location-hub .eploc-polaroid-1{right:9%;top:2px;width:160px;height:110px;transform:rotate(-5deg)}
.ep-location-hub .eploc-polaroid-2{right:0;top:105px;width:142px;height:104px;transform:rotate(4deg)}
.ep-location-hub .eploc-polaroid-3{right:24%;bottom:4px;width:180px;height:120px;transform:rotate(-2deg)}
.eploc-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:20px}
.eploc-btn-secondary{border:1px solid #b9c8be!important;background:rgba(255,255,255,.88)!important;color:#214932!important;box-shadow:none!important}
.eploc-btn-secondary:hover{background:#fff!important;color:#163c29!important}

/* Cross-hub navigation — only visual compaction on Lokasi, labels/order/routes stay shared. */
.eploc-service-band{padding:16px 0 0;background:var(--eploc-paper)}

.eploc-section{padding:42px 0}
.eploc-section-soft{background:#f8f8f3}
.eploc-section-head{display:flex;align-items:flex-start;gap:10px;margin-bottom:18px}
.eploc-section-head h2{margin:0;color:var(--eploc-deep)}
.eploc-section-head p{margin:5px 0 0;color:var(--eploc-muted)}
.eploc-section-icon{display:grid;place-items:center;width:24px;height:24px;flex:0 0 24px;color:#0b6b4d}
.eploc-section-icon svg{width:20px;height:20px;fill:currentColor}
.eploc-bars{display:flex;align-items:end;justify-content:center;gap:2px}
.eploc-bars i{display:block;width:4px;background:#0b6b4d;border-radius:2px}.eploc-bars i:nth-child(1){height:8px}.eploc-bars i:nth-child(2){height:15px}.eploc-bars i:nth-child(3){height:20px}
.eploc-route-icon,.eploc-question{font-size:18px;font-weight:900;color:#0b6b4d}

/* Area cards */
.eploc-area-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.eploc-area-card{overflow:hidden;border:1px solid var(--eploc-line);border-radius:12px;background:#fff;box-shadow:var(--eploc-shadow);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.eploc-area-card:hover{transform:translateY(-2px);border-color:#bdcfc2;box-shadow:0 12px 28px rgba(19,59,39,.08)}
.eploc-area-card.is-query-target{border-color:#6f984c;box-shadow:0 0 0 3px rgba(111,152,76,.12),var(--eploc-shadow)}
.eploc-area-photo{display:block;height:158px;overflow:hidden;background:#e7eee8}
.eploc-area-photo img{width:100%;height:100%;object-fit:cover;transition:transform .25s ease}
.eploc-area-card:hover .eploc-area-photo img{transform:scale(1.025)}
.eploc-area-body{padding:16px}
.eploc-area-body h3{margin:0 0 5px;color:var(--eploc-deep)}
.eploc-area-body p{min-height:51px;margin:0;color:var(--eploc-muted)}
.eploc-chips,.eploc-subarea-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:11px}
.eploc-chips span,.eploc-subarea-chips span{display:inline-flex;align-items:center;min-height:24px;padding:3px 8px;border-radius:999px;background:#edf3e8;color:#49634f;font-size:10px;font-weight:700;line-height:1.1}
.eploc-card-cta{display:flex;align-items:center;justify-content:center;gap:8px;min-height:38px;margin-top:12px;border-radius:7px;background:#0d5d3d;color:#fff;font-size:12px;font-weight:800}
.eploc-card-cta:hover{background:#084c32;color:#fff}

/* Comparison */
.eploc-compare-wrap{overflow:auto;border:1px solid var(--eploc-line);border-radius:12px;background:#fff;box-shadow:var(--eploc-shadow)}
.eploc-compare-table{width:100%;min-width:760px;border-collapse:collapse;margin:0}
.eploc-compare-table th,.eploc-compare-table td{padding:10px 12px;border-right:1px solid #e4e9e4;border-bottom:1px solid #e7ece7;text-align:left;vertical-align:top;font-size:11px;line-height:1.4}
.eploc-compare-table thead th{background:#e7efe4;color:#173d30;font-weight:800}
.eploc-compare-table tbody th{width:128px;background:#f6f8f4;color:#365a43;font-weight:800}
.eploc-compare-table tr:last-child th,.eploc-compare-table tr:last-child td{border-bottom:0}
.eploc-compare-table th:last-child,.eploc-compare-table td:last-child{border-right:0}

/* Routing */
.eploc-routing-section{background:#fffefa}
.eploc-route-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.eploc-route-card{scroll-margin-top:110px;padding:14px;border:1px solid var(--eploc-line);border-radius:12px;background:#fff;box-shadow:var(--eploc-shadow)}
.eploc-route-card.is-query-target{border-color:#6f984c;box-shadow:0 0 0 3px rgba(111,152,76,.12),var(--eploc-shadow)}
.eploc-route-card>header{display:flex;align-items:center;gap:9px;margin-bottom:9px}
.eploc-route-card>header img{width:34px;height:34px;border-radius:50%;object-fit:cover}
.eploc-route-card h3{margin:0;color:#173d30}
.eploc-route-card nav{display:grid;border-top:1px solid #e7ece7}
.eploc-route-card nav a{display:grid;grid-template-columns:22px 1fr 14px;align-items:center;gap:8px;min-height:39px;border-bottom:1px solid #edf0ed;color:#365844}
.eploc-route-card nav a:last-child{border-bottom:0}
.eploc-route-card nav a:hover{color:#0b6044;background:#fafcf9}
.eploc-route-link-icon{display:grid;place-items:center}.eploc-route-link-icon svg{width:15px;height:15px;fill:currentColor}
.eploc-route-card nav strong{font-size:11px;font-weight:700}.eploc-route-card nav b{text-align:right;font-size:13px}

/* Context */
.eploc-context-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.eploc-context-card{display:grid;grid-template-columns:92px 1fr;gap:12px;align-items:start;padding:12px;border:1px solid var(--eploc-line);border-radius:12px;background:#fff}
.eploc-context-card>img{width:92px;height:86px;border-radius:8px;object-fit:cover}
.eploc-context-card h3{margin:1px 0 4px;color:#173d30}
.eploc-context-card p{margin:0;color:#69776f}
.eploc-context-card .eploc-subarea-chips{margin-top:8px}

/* FAQ + CTA */
.eploc-final-section{padding-bottom:70px;background:#fffefa}
.eploc-final-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:16px;align-items:stretch}
.eploc-section-head-compact{margin-bottom:10px}
.eploc-faq-list{display:grid;gap:7px}
.eploc-faq-list details{border:1px solid var(--eploc-line);border-radius:9px;background:#fff;overflow:hidden}
.eploc-faq-list summary{cursor:pointer;list-style:none;padding:12px 34px 12px 14px;position:relative;color:#294d38;font-size:11px;font-weight:800}
.eploc-faq-list summary::-webkit-details-marker{display:none}
.eploc-faq-list summary:after{content:"⌄";position:absolute;right:13px;top:10px;color:#52705d;font-size:15px;transition:transform .18s ease}
.eploc-faq-list details[open] summary:after{transform:rotate(180deg)}
.eploc-faq-list details p{margin:0;padding:0 14px 13px;color:#68776e}
.eploc-final-cta{display:grid;grid-template-columns:1fr 190px;gap:18px;padding:20px;border:1px solid #cfe0d2;border-radius:13px;background:linear-gradient(135deg,#f3f7ef 0%,#fff 100%)}
.eploc-final-copy h2{margin:4px 0 7px;color:#173d30}
.eploc-final-copy p{margin:0;color:#64766b}
.eploc-final-copy .eploc-actions{margin-top:15px}
.eploc-brief-card{align-self:stretch;padding:14px;border-radius:10px;background:#eaf1e5;color:#355743}
.eploc-brief-card strong{display:block;margin-bottom:8px;font-size:10px}
.eploc-brief-card ul{margin:0;padding-left:16px}.eploc-brief-card li{margin:5px 0;font-size:10px}

@media(max-width:980px){
  .ep-location-hub .ep-shared-hero-aside{width:300px;height:250px;right:0;opacity:.88}
  .eploc-area-grid,.eploc-route-grid,.eploc-context-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .eploc-area-grid .eploc-area-card:last-child,.eploc-route-grid .eploc-route-card:last-child,.eploc-context-grid .eploc-context-card:last-child{grid-column:1/-1}
  .eploc-final-grid{grid-template-columns:1fr}
}
@media(max-width:760px){
  .ep-location-hub .ep-shared-hero-aside{display:none}
  .ep-location-hub .ep-shared-hero-breadcrumb{margin-bottom:13px}
  .eploc-actions{gap:7px}.eploc-actions .ep-btn{flex:1 1 auto}
  .eploc-service-band{padding-top:12px}
  .eploc-section{padding:34px 0}
  .eploc-area-grid,.eploc-route-grid,.eploc-context-grid{grid-template-columns:1fr}
  .eploc-area-grid .eploc-area-card:last-child,.eploc-route-grid .eploc-route-card:last-child,.eploc-context-grid .eploc-context-card:last-child{grid-column:auto}
  .eploc-area-photo{height:180px}
  .eploc-area-body p{min-height:0}
  .eploc-compare-wrap{border-radius:10px}
  .eploc-final-cta{grid-template-columns:1fr}
}
@media(max-width:520px){
  .eploc-context-card{grid-template-columns:78px 1fr}.eploc-context-card>img{width:78px;height:76px}
  .eploc-final-copy .eploc-actions{display:grid;grid-template-columns:1fr}.eploc-final-copy .eploc-actions .ep-btn{width:100%}
}