/* STREAMING_CHUNK: Base Location specific sections /
/ =========================================================
Pak Cleaners — Location Page Add-on Styles
Loads AFTER styles.css and pages.css.
========================================================= */

/* ---------- Credibility Bar ---------- */
.credbar { background: var(--ice, #f8fafc); padding: 24px 0; border-bottom: 1px solid var(--line, #e2e8f0); }
.credbar ul { display: flex; flex-wrap: wrap; gap: 20px 40px; justify-content: center; list-style: none; margin: 0; padding: 0; }
.credbar li { display: flex; flex-direction: column; font-size: 0.9rem; }
.credbar strong { color: var(--navy, #0f172a); font-weight: 600; font-size: 0.95rem; }
.credbar span { color: var(--muted, #64748b); font-size: 0.85rem; margin-top: 4px; }

/* ---------- Service Cards (Text only version for Location page) ---------- */
.scards { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 24px; margin-top: 32px; }
.scard { background: #fff; border: 1px solid var(--line, #e2e8f0); border-radius: var(--r-lg, 12px); padding: 32px; box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05); }
.scard h3 { font-size: 1.25rem; margin-bottom: 12px; color: var(--navy, #0f172a); }
.scard__blurb { color: var(--muted, #475569); font-size: 0.95rem; line-height: 1.6; margin-bottom: 24px; }
.scard__price { font-size: 0.95rem; margin-bottom: 16px; color: var(--muted, #64748b); }
.scard__price strong { font-size: 1.15rem; color: var(--navy, #0f172a); }
.scard__link { font-weight: 600; color: var(--cyan, #0ea5e9); font-size: 0.95rem; }
.scard__link:hover { text-decoration: underline; }

/* ---------- Phase Coverage Grid ---------- */
.phases{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.phase{
background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
padding:24px 22px;border-left:4px solid var(--cyan);
transition:transform .2s ease,box-shadow .2s ease;
}
.phase:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.phase__n{
font-family:var(--font-display);font-weight:700;font-size:1.05rem;
color:var(--navy);margin-bottom:4px;
}
.phase__blocks{font-size:.85rem;color:var(--muted);margin-bottom:14px}
.phase__resp{
font-size:.84rem;color:var(--muted);margin-bottom:12px;
padding-bottom:12px;border-bottom:1px dashed var(--line);
}
.phase__resp strong{color:var(--mint-dark);font-variant-numeric:tabular-nums}
.phase__note{font-size:.84rem;color:var(--navy);font-weight:500;margin:0}
.phases__note{margin-top:22px;font-size:.88rem;color:var(--muted)}

/* ---------- Local Conditions ---------- */
.localgrid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.local{
background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
padding:28px 26px;position:relative;
transition:transform .25s var(--ease,ease),box-shadow .25s var(--ease,ease);
}
.local:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.local__n{
display:grid;place-items:center;width:38px;height:38px;border-radius:50%;
background:var(--navy);color:#fff;font-family:var(--font-display);
font-weight:700;font-size:.82rem;margin-bottom:16px;
}
.local h3{margin-bottom:10px;font-size:1.06rem;line-height:1.35}
.local p{font-size:.93rem;color:var(--muted);line-height:1.72;margin:0}

/* STREAMING_CHUNK: Case Studies and Layout blocks /
/ ---------- Case Studies (Detailed format for Location page) ---------- */
.cstudies { display: grid; grid-template-columns: repeat(auto-fit, minmax(1, 1fr)); gap: 24px; margin-top: 32px; }
.cstudy { background: #fff; border: 1px solid var(--line, #e2e8f0); border-radius: var(--r-lg, 12px); padding: 32px; transition: transform .25s var(--ease,ease), box-shadow .25s var(--ease,ease); }
.cstudy:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.cstudy__head { margin-bottom: 20px; }
.cstudy__tag { display: inline-block; background: var(--ice, #e0f2fe); color: var(--cyan, #0284c7); padding: 4px 12px; border-radius: 20px; font-size: 0.8rem; font-weight: 600; margin-bottom: 16px; }
.cstudy h3 { font-size: 1.15rem; line-height: 1.4; margin-top: 0; color: var(--navy, #0f172a); }
.cstudy__dl { display: grid; grid-template-columns: 85px 1fr; gap: 12px 16px; font-size: 0.9rem; margin-bottom: 24px; }
.cstudy__dl dt { font-weight: 600; color: var(--navy, #0f172a); }
.cstudy__dl dd { color: var(--muted, #475569); margin: 0; line-height: 1.5; }
.cstudy__stats { display: flex; flex-wrap: wrap; gap: 24px; border-top: 1px solid var(--line, #e2e8f0); padding-top: 20px; list-style: none; margin: 0; }
.cstudy__stats li { display: flex; flex-direction: column; }
.cstudy__stats strong { font-size: 1.1rem; color: var(--navy, #0f172a); }
.cstudy__stats span { font-size: 0.8rem; color: var(--muted, #64748b); }

/* ---------- Evidence Section ---------- */
.evidence { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.evidence__box { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 32px; box-shadow: var(--shadow-sm); border-top: 4px solid var(--mint); }
.evidence__box h3 { margin-bottom: 16px; font-size: 1.15rem; }

/* ---------- Pricing Table ---------- */
.ptablewrap { overflow-x: auto; margin-top: 32px; background: #fff; border: 1px solid var(--line, #e2e8f0); border-radius: var(--r-lg, 12px); }
.ptable { width: 100%; border-collapse: collapse; min-width: 600px; text-align: left; }
.ptable th, .ptable td { padding: 16px 24px; border-bottom: 1px solid var(--line, #e2e8f0); }
.ptable th { background: var(--ice, #f8fafc); font-weight: 600; color: var(--navy, #0f172a); font-size: 0.95rem; }
.ptable td { font-size: 0.95rem; color: var(--ink, #334155); }
.ptable__price { font-weight: 600; color: var(--navy, #0f172a); white-space: nowrap; }
.ptable__note { margin-top: 16px; font-size: 0.9rem; color: var(--muted, #64748b); }

/* ---------- Nearby Areas Chips ---------- */
.chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 24px 0; padding: 0; list-style: none; }
.chips a { display: inline-block; padding: 8px 16px; background: #fff; border: 1px solid var(--line); border-radius: 999px; font-size: 0.9rem; color: var(--navy); font-weight: 500; transition: all 0.2s ease; }
.chips a:hover { border-color: var(--cyan); color: var(--cyan); box-shadow: 0 2px 6px rgba(2, 132, 199, 0.1); }

/* ---------- Shared Utilities in Location Page ---------- */
.decide__foot { text-align: center; margin-top: 32px; }
.areas__maplabel { font-size: 0.85rem; color: var(--muted); margin-top: 12px; text-align: center; }

/* ---------- Landmark List ---------- */
.landmarks{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:22px 0}
.landmarks li{
background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);
padding:12px 14px;transition:border-color .2s ease,transform .2s ease;
}
.landmarks li:hover{border-color:var(--cyan);transform:translateY(-2px)}
.landmarks strong{display:block;font-family:var(--font-display);font-size:.9rem;color:var(--navy)}
.landmarks span{display:block;font-size:.8rem;color:var(--muted);margin-top:2px}

/* ---------- Long-form Guide + Sticky Rail ---------- */
.glayout{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,3fr);gap:44px;align-items:start}
.gbody{
min-width:0;background:#fff;border:1px solid var(--line);
border-radius:var(--r-lg);padding:36px 38px;
}
.gbody h3{
font-size:clamp(1.15rem,2vw,1.4rem);margin:34px 0 14px;padding-top:26px;
border-top:1px solid var(--line);scroll-margin-top:110px;
}
.gbody h3:first-of-type{margin-top:0;padding-top:0;border-top:0}
.gbody p{font-size:.98rem;line-height:1.78;color:var(--ink);margin-bottom:16px}

.toc{background:var(--ice);border:1px solid var(--line);border-radius:var(--r-md);padding:22px 26px;margin-bottom:8px}
.toc__title{font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.toc ol{counter-reset:toc;display:grid;gap:9px}
.toc li{counter-increment:toc;position:relative;padding-left:28px}
.toc li::before{
content:counter(toc,decimal-leading-zero);position:absolute;left:0;top:1px;
font-family:var(--font-display);font-size:.72rem;font-weight:700;color:var(--mint);
}
.toc a{font-size:.93rem;font-weight:500;color:var(--navy);border-bottom:1px solid transparent;transition:color .18s ease,border-color .18s ease}
.toc a:hover{color:var(--cyan);border-bottom-color:var(--cyan)}
.toc a.is-current{color:var(--cyan);font-weight:600}

.grail{position:sticky;top:100px;min-width:0}
.grail__card{
background:var(--navy);color:#fff;border-radius:var(--r-lg);
padding:28px 26px;box-shadow:var(--shadow-md);border-top:4px solid var(--mint);
}
.grail__card h3{color:#fff;font-size:1.08rem;margin-bottom:10px}
.grail__card>p{color:#A9C0D6;font-size:.89rem;margin-bottom:16px}
.grail__points{margin-bottom:18px}
.grail__points li{position:relative;padding-left:22px;margin-bottom:9px;font-size:.86rem;color:#D6E6F2}
.grail__points li::before{
content:"";position:absolute;left:0;top:.5em;width:11px;height:6px;
border-left:2.2px solid var(--mint);border-bottom:2.2px solid var(--mint);transform:rotate(-45deg);
}
.grail__tel{display:block;text-align:center;margin-top:12px;font-size:.85rem;font-weight:600;color:#9FB6CC}
.grail__tel:hover{color:var(--mint)}

/* STREAMING_CHUNK: Responsive adjustments /
/ =========================================================
RESPONSIVE
========================================================= */
@media (max-width:1080px){
.phases{grid-template-columns:repeat(2,1fr)}
.glayout{grid-template-columns:1fr;gap:28px}
.grail{position:static}
.grail__card{display:grid;grid-template-columns:1fr 1fr;gap:0 22px;align-items:start}
.grail__card h3,.grail__card>p,.grail__points{grid-column:1/-1}
}

@media (max-width:900px){
.localgrid,.landmarks{grid-template-columns:1fr}
.gbody{padding:28px 24px}
.evidence { grid-template-columns: 1fr; }
}

@media (max-width:680px){
.phases{grid-template-columns:1fr}
.grail__card{grid-template-columns:1fr}
.gbody{padding:24px 20px}
.toc{padding:18px 20px}
}

@media (prefers-reduced-motion:reduce){
.phase:hover,.local:hover,.cstudy:hover,.landmarks li:hover{transform:none}
}