/* location-page.php (20 city URLs) — page layout only; components come from ui-v2.css */

/* hero: phones put the CTAs above the lead (visual order only, DOM unchanged) */
.location-hero .hero-ctas{margin-top:var(--s-5)}
.location-hero .location-lead{margin-bottom:0}
.location-hero .clamp-more{color:var(--blue-2);align-self:flex-start}
.location-proof-row .stat__n{color:#fff}
.location-proof-row .stat__label{color:var(--text-inverse-muted)}
@media (max-width:768px){
  .location-hero .container{display:flex;flex-direction:column;align-items:stretch}
  .location-hero .breadcrumb{order:1}
  .location-hero .eyebrow{order:2;align-self:flex-start}
  .location-hero h1{order:3}
  .location-hero .hero-ctas{order:4;margin-top:var(--s-4)}
  .location-hero .location-lead{order:5;margin-top:var(--s-5)}
  .location-hero .clamp-more{order:6}
  .location-hero .location-proof-row{order:7;margin-top:var(--s-5);gap:var(--s-3) var(--s-5)}
}
@media (min-width:769px){.location-hero .location-lead{margin-top:var(--s-4)}}

/* "In short" note */
.location-answer{max-width:880px;margin-bottom:var(--s-7)}
.location-answer>p{font-size:var(--fs-lead);line-height:1.5;color:var(--text);letter-spacing:-.01em;max-width:var(--measure-lead)}
.post-hero+.section-pad-tight{padding-top:var(--section-pad-tight)}

/* Who / Problems / What you get / Why */
.card__head{display:flex;align-items:center;gap:10px}
.card__kicker{font-family:var(--font-mono);font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
.card--dark .card__kicker{color:var(--text-inverse-muted)}
.location-brief .card--spec h2{font-size:var(--fs-h3);font-weight:600;letter-spacing:-.015em;line-height:1.25;margin:0}
.location-brief .card--dark h2{color:#fff}
.location-brief .card--dark>p{color:var(--text-inverse-muted);font-size:var(--fs-body);line-height:1.6}
.location-brief .card--dark{align-self:start}
.location-brief .card--dark .btn-link{white-space:normal;text-align:left;line-height:1.3;margin-top:var(--s-3)}
.location-brief .card--spec .list-check li{padding:10px 0 10px 18px}
.location-brief .card--spec .list-check li::before{top:calc(10px + .55em)}
@media (max-width:600px){.location-brief{grid-template-columns:minmax(0,1fr)!important}.location-brief .loc-spec--short{grid-column:1/-1}}
@media (max-width:768px){
  .location-brief{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--s-4)}
  .location-brief .loc-spec--long{grid-column:1/-1}
  .location-brief .loc-spec--short:first-child{order:1}
  .location-brief .location-card-feature{order:2;margin-top:var(--s-5);align-self:start}
  .location-brief .loc-spec--long{order:3}
  .location-answer{margin-bottom:var(--s-6)}
  .location-brief .card--spec{padding-top:var(--s-4)}
  .location-brief .card--spec li{padding:7px 0 7px 16px;font-size:var(--fs-small);line-height:1.45}
  .location-brief .card--spec .list-check li::before{top:calc(7px + .5em);width:6px;height:6px}
  .location-brief .card--dark{padding:var(--s-4)}
  .location-brief .card--dark>p{font-size:var(--fs-small)}
}
@media (max-width:359px){.location-brief{grid-template-columns:minmax(0,1fr)}.location-brief .location-card-feature{margin-top:0}}

/* outcomes + guide: ruled, compact on phones */
.location-outcomes h3,.location-guide h3{font-size:var(--fs-h4);font-weight:600;letter-spacing:-.01em;line-height:1.3;margin:0}
.location-guide h3{font-size:var(--fs-h3)}
@media (max-width:768px){
  .location-outcomes{gap:0 var(--s-4)}
  .location-outcomes .card--spec{padding-top:var(--s-4);gap:8px}
  .location-outcomes p{font-size:var(--fs-micro)}
  .location-guide{gap:0}
  .location-guide .card--spec{padding-top:var(--s-4);gap:8px}
}

/* case studies */
.card--result .card__result .eyebrow{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card__media picture{display:block;width:100%;height:100%}
.location-card-meta{display:inline-flex;font-family:var(--font-mono);font-size:12px;color:var(--text-muted)}
@media (max-width:768px){
  .location-proof-grid .location-card-meta{display:none}
  .location-proof-grid.rail__track>*{flex-basis:78vw}
}

/* blog rows */
.card--row .card__body{min-width:0;display:grid;gap:4px}
.card--row p{font-size:var(--fs-small)}
.location-more{text-align:center;margin-top:var(--s-6)}
@media (max-width:768px){
  .location-posts p{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
  .location-posts .card--row h3{font-size:16px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .location-more{margin-top:var(--s-5)}
}

/* dark band: video + testimonials + service area share one background, separated by hairlines */
.location-video-section .location-vt-grid{margin-top:0}
.location-testi .testi-card .av{width:44px;height:44px;border-radius:50%;overflow:hidden;background:var(--grad-accent);display:grid;place-items:center;font-weight:600;font-size:14px;color:#fff;flex:0 0 auto}
.location-testi .testi-card .av img,.location-testi .testi-card .av picture{width:100%;height:100%;object-fit:cover;display:block}
.location-testi .testi-card .meta b{display:block;font-size:14px;color:#fff;font-weight:600}
.location-testi .testi-card .meta span{font-size:var(--fs-micro);color:var(--text-inverse-muted)}
@media (min-width:769px){.location-testi{display:grid}}

/* service area: ruled rows, chips */
.location-area-row{display:grid;grid-template-columns:220px minmax(0,1fr);gap:var(--s-4) var(--s-6);padding:var(--s-5) 0;border-top:1px solid var(--hair-dark)}
.location-area-row:first-child{border-top:0;padding-top:0}
.location-area-row h3{font-size:var(--fs-h4);font-weight:600;letter-spacing:-.01em;color:#fff;margin:0}
.location-area-row__body{display:grid;gap:var(--s-3)}
.location-area-row__body p{margin:0;color:var(--text-inverse-muted);font-size:var(--fs-body)}
.location-tags .chip{min-height:36px}
@media (max-width:768px){
  .location-area-row{grid-template-columns:minmax(0,1fr);gap:var(--s-3);padding:var(--s-4) 0}
  .location-tags .chip{min-height:32px;padding:0 10px;font-size:12px}
  .location-area-row__body{gap:var(--s-2)}
}

/* process: hairline 4-up on desktop, vertical timeline on phones */
.location-process-grid h4{font-size:var(--fs-h4);font-weight:600;letter-spacing:-.01em;line-height:1.3;margin:0}
.location-process-grid p{font-size:var(--fs-small)}
@media (max-width:768px){
  .location-process-grid{gap:0}
  .location-process-grid .card--spec{display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:0;row-gap:6px;align-content:start;border-top:0;padding:0 0 var(--s-5);position:relative}
  .location-process-grid .card__num{grid-column:1;grid-row:1;padding-top:4px}
  .location-process-grid h4{grid-column:2;grid-row:1}
  .location-process-grid p{grid-column:2;grid-row:2}
  .location-process-grid .card--spec::before{content:"";position:absolute;left:7px;top:24px;bottom:0;width:1px;background:var(--hair-strong)}
  .location-process-grid .card--spec:last-child::before{display:none}
}

/* related services chips */
.location-links{justify-content:center}
.location-links .chip{white-space:normal;line-height:1.25;padding:6px 14px;text-align:center}
