/* ============================================================
   evoke-locations.css
   Evoke Hair & Skin Clinic — Locations Page Styles
   Host on GitHub → serve via jsDelivr CDN
   ============================================================ */

:root{
  --ink:#0b1f1a; --ink-soft:#1a332c;
  --paper:#faf8f3; --paper-dim:#f1ede3;
  --line:#e3ddcd;
  --green:#0b5d4a; --green-mid:#13735c; --green-deep:#082e24;
  --accent:#c9a26a; --accent-soft:#e8d8b8;
  --text:#1d2a25; --text-dim:#5b6862;
  --r:18px; --r-sm:12px;
  --sh-sm:0 2px 12px rgba(11,31,26,.07);
  --sh-md:0 8px 30px rgba(11,31,26,.12);
  --sh-lg:0 20px 56px rgba(11,31,26,.18);
  --tr:.22s ease;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{font-family:'Inter',system-ui,sans-serif;background:var(--paper);color:var(--text);-webkit-font-smoothing:antialiased;line-height:1.6;overflow-x:hidden;}
h1,h2,h3,h4,h5{font-family:'Bricolage Grotesque',sans-serif;color:var(--ink);line-height:1.1;letter-spacing:-.015em;}
p{color:var(--text-dim);line-height:1.68;}
a{text-decoration:none;color:inherit;}
img{display:block;max-width:100%;}
ul{list-style:none;}
button{font-family:inherit;cursor:pointer;border:none;}

.ev-wrap{max-width:1240px;margin:0 auto;padding:0 28px;}
.ev-mono{font-family:'JetBrains Mono',monospace;font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;}
.ev-eyebrow{display:inline-flex;align-items:center;gap:10px;color:var(--green);margin-bottom:14px;}
.ev-idx{background:var(--accent-soft);color:var(--ink);padding:3px 9px;border-radius:6px;font-weight:600;}

/* ── BUTTONS ── */
.ev-btn{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;padding:12px 22px;border-radius:999px;border:1.5px solid transparent;transition:background var(--tr),border-color var(--tr),color var(--tr),transform var(--tr);white-space:nowrap;cursor:pointer;}
.ev-btn .ar{transition:transform var(--tr);}
.ev-btn:hover .ar{transform:translateX(3px);}
.ev-btn-primary{background:var(--green);color:#fff;border-color:var(--green);}
.ev-btn-primary:hover{background:var(--green-deep);border-color:var(--green-deep);}
.ev-btn-ghost{border-color:var(--line);color:var(--ink);background:transparent;}
.ev-btn-ghost:hover{border-color:var(--green);color:var(--green);}
.ev-btn-light{background:#fff;color:var(--ink);border-color:#fff;}
.ev-btn-light:hover{background:var(--paper-dim);}
.ev-btn-sm{padding:9px 18px;font-size:13px;}
.ev-btn-xs{padding:7px 14px;font-size:12.5px;}

/* ── HEADER ── */
.ev-head{position:sticky;top:0;z-index:100;background:rgba(250,248,243,.95);backdrop-filter:blur(14px) saturate(1.4);border-bottom:1px solid transparent;transition:border-color var(--tr),box-shadow var(--tr);}
.ev-head.is-stuck{border-color:var(--line);box-shadow:0 4px 20px rgba(11,31,26,.08);}
.ev-head-in{display:flex;align-items:center;justify-content:space-between;height:76px;}
.ev-logo img{height:32px;width:auto;}
.ev-nav{display:flex;align-items:center;gap:34px;}
.ev-navitem{position:relative;}
.ev-navlink{display:flex;align-items:center;gap:5px;font-size:14.5px;font-weight:500;color:var(--ink);padding:10px 0;transition:color var(--tr);}
.ev-navlink:hover{color:var(--green);}
.ev-navlink svg{transition:transform .2s;color:var(--text-dim);}
.ev-navitem:hover .ev-navlink svg{transform:rotate(180deg);}
.ev-drop{position:absolute;top:calc(100% + 8px);left:-18px;width:290px;background:#fff;border-radius:16px;box-shadow:var(--sh-lg);padding:14px;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .2s,transform .2s,visibility .2s;display:flex;flex-direction:column;gap:2px;}
.ev-navitem:hover .ev-drop{opacity:1;visibility:visible;transform:translateY(0);}
.ev-drop h4{font-size:11px;color:var(--text-dim);padding:6px 10px 4px;font-weight:500;}
.ev-drop a{padding:9px 10px;border-radius:9px;font-size:14px;color:var(--ink);transition:background var(--tr),color var(--tr);}
.ev-drop a:hover{background:var(--paper-dim);color:var(--green);}
.ev-head-cta{display:flex;align-items:center;gap:14px;}
.ev-callnum{display:flex;align-items:center;gap:7px;font-size:14px;font-weight:500;color:var(--ink);transition:color var(--tr);}
.ev-callnum:hover{color:var(--green);}
.ev-burger{display:none;flex-direction:column;gap:5px;background:none;padding:6px;}
.ev-burger span{width:22px;height:2px;background:var(--ink);border-radius:2px;transition:transform .25s,opacity .25s;}
.ev-burger.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.ev-burger.is-open span:nth-child(2){opacity:0;}
.ev-burger.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.ev-mnav{position:fixed;inset:0;background:var(--paper);z-index:90;padding:90px 28px 40px;display:flex;flex-direction:column;gap:4px;transform:translateX(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);overflow-y:auto;}
.ev-mnav.is-open{transform:none;}
.ev-mnav .mh{font-family:'JetBrains Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);margin:18px 0 8px;}
.ev-mnav a{padding:11px 0;font-size:16px;color:var(--ink);border-bottom:1px solid var(--line);transition:color var(--tr);}
.ev-mnav a:hover{color:var(--green);}
@media(max-width:1000px){.ev-nav,.ev-callnum{display:none;}.ev-burger{display:flex;}.ev-head-cta .ev-btn-primary{font-size:13px;padding:10px 16px;}}
@media(max-width:480px){.ev-head-cta .ev-btn-primary{display:none;}}

/* ── HERO ── */
.loc-hero{background:linear-gradient(150deg,var(--green-deep) 0%,#0b1f1a 55%,#102820 100%);position:relative;overflow:hidden;padding:70px 0 0;}
.loc-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 65% 70% at 92% -5%,rgba(201,162,106,.22) 0%,transparent 55%),radial-gradient(ellipse 45% 55% at 8% 108%,rgba(11,115,92,.25) 0%,transparent 55%);pointer-events:none;}
.loc-hero-strands{position:absolute;right:0;top:0;bottom:0;width:180px;display:flex;align-items:flex-end;gap:4px;padding-right:20px;opacity:.1;pointer-events:none;}
.loc-hero-strands span{flex:1;background:var(--accent-soft);border-radius:4px 4px 0 0;}
.loc-hero-inner{position:relative;padding-bottom:52px;}
.loc-breadcrumb{display:flex;align-items:center;gap:8px;font-size:13px;color:rgba(237,241,236,.45);margin-bottom:26px;}
.loc-breadcrumb a{color:rgba(237,241,236,.45);transition:color var(--tr);}
.loc-breadcrumb a:hover{color:rgba(237,241,236,.8);}
.loc-breadcrumb span{color:rgba(237,241,236,.25);}
.loc-hero h1{font-size:clamp(30px,4.2vw,54px);font-weight:700;color:#fff;max-width:660px;margin-bottom:18px;}
.loc-hero h1 em{font-style:normal;color:var(--accent-soft);}
.loc-hero-sub{color:rgba(237,241,236,.7);font-size:clamp(15px,1.5vw,17px);max-width:540px;margin-bottom:34px;line-height:1.7;}
.loc-hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:52px;}
.loc-stat-bar{display:flex;flex-wrap:wrap;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:18px 18px 0 0;overflow:hidden;}
.loc-stat{flex:1 1 auto;padding:22px 28px;border-right:1px solid rgba(255,255,255,.1);min-width:140px;}
.loc-stat:last-child{border-right:none;}
.loc-stat .n{font-family:'Bricolage Grotesque',sans-serif;font-size:clamp(24px,2.8vw,32px);font-weight:700;color:#fff;line-height:1;}
.loc-stat .n sup{font-size:15px;color:var(--accent);}
.loc-stat .l{font-size:12.5px;color:rgba(237,241,236,.5);margin-top:5px;}
@media(max-width:680px){.loc-stat{min-width:50%;border-bottom:1px solid rgba(255,255,255,.1);}.loc-stat:nth-child(2){border-right:none;}.loc-stat:last-child{border-bottom:none;}}

/* ── CITY NAV ── */
.city-nav-wrap{position:sticky;top:76px;z-index:50;background:rgba(250,248,243,.97);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);box-shadow:0 3px 14px rgba(11,31,26,.05);}
.city-nav-inner{display:flex;align-items:center;gap:6px;overflow-x:auto;padding:13px 0;scrollbar-width:none;-ms-overflow-style:none;}
.city-nav-inner::-webkit-scrollbar{display:none;}
.city-tab{flex-shrink:0;padding:9px 18px;border-radius:999px;border:1.5px solid var(--line);background:transparent;font-size:13px;font-weight:500;color:var(--text-dim);cursor:pointer;transition:all var(--tr);display:flex;align-items:center;gap:7px;}
.city-tab .badge{background:var(--paper-dim);color:var(--text-dim);font-size:11px;font-weight:600;padding:2px 7px;border-radius:999px;transition:all var(--tr);}
.city-tab:hover{border-color:var(--green);color:var(--green);}
.city-tab.is-active{background:var(--green);border-color:var(--green);color:#fff;}
.city-tab.is-active .badge{background:rgba(255,255,255,.22);color:#fff;}

/* ── CITY SECTIONS ── */
.city-section{padding:64px 0 40px;}
.city-section+.city-section{border-top:1px solid var(--line);}
.city-section.is-hidden{display:none;}
.city-hdr{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:32px;}
.city-label{display:inline-flex;align-items:center;gap:9px;background:var(--paper-dim);border:1px solid var(--line);border-radius:999px;padding:6px 14px;margin-bottom:12px;}
.city-label .dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px rgba(11,93,74,.18);}
.city-label span{font-size:11.5px;font-weight:600;color:var(--green);letter-spacing:.05em;text-transform:uppercase;font-family:'JetBrains Mono',monospace;}
.city-hdr h2{font-size:clamp(22px,2.6vw,32px);}
.city-hdr-right{display:flex;align-items:center;gap:12px;}

/* ── GRID & MOBILE CAROUSEL ── */
.clinic-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
@media(max-width:1100px){.clinic-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){
  .clinic-grid{display:flex;overflow-x:auto;gap:16px;padding-bottom:16px;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none;}
  .clinic-grid::-webkit-scrollbar{display:none;}
  .clinic-grid .clinic-card{flex:0 0 84vw;max-width:340px;scroll-snap-align:start;}
}
.clinic-grid.g2{grid-template-columns:repeat(2,1fr);}
@media(max-width:640px){
  .clinic-grid.g2{display:flex;overflow-x:auto;gap:16px;padding-bottom:16px;scroll-snap-type:x mandatory;}
  .clinic-grid.g2 .clinic-card{flex:0 0 84vw;max-width:340px;scroll-snap-align:start;}
}
.clinic-grid.g1{grid-template-columns:minmax(0,480px);}
@media(max-width:640px){.clinic-grid.g1{grid-template-columns:1fr;}}

/* ── CARD ── */
.clinic-card{background:#fff;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);box-shadow:var(--sh-sm);display:flex;flex-direction:column;transition:transform var(--tr),box-shadow var(--tr),border-color var(--tr);}
.clinic-card:hover{transform:translateY(-5px);box-shadow:var(--sh-lg);border-color:rgba(11,93,74,.18);}
.clinic-card.is-soon{opacity:.92;}

.cc-img{position:relative;height:200px;overflow:hidden;background:var(--paper-dim);flex-shrink:0;}
.cc-img img{width:100%;height:100%;object-fit:cover;object-position:center top;transition:transform .5s ease;}
.clinic-card:hover .cc-img img{transform:scale(1.05);}
.cc-img-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,31,26,0) 40%,rgba(11,31,26,.55) 100%);}
.cc-zone{position:absolute;bottom:12px;left:12px;background:rgba(11,31,26,.72);backdrop-filter:blur(4px);color:#fff;font-size:11.5px;font-weight:500;padding:5px 11px;border-radius:999px;font-family:'JetBrains Mono',monospace;letter-spacing:.04em;}
.cc-rating{position:absolute;top:12px;right:12px;background:#fff;color:var(--ink);font-size:12.5px;font-weight:600;padding:5px 11px;border-radius:999px;display:flex;align-items:center;gap:4px;box-shadow:0 2px 10px rgba(0,0,0,.15);}
.cc-rating .star{color:#f5a623;}
.cc-soon-badge{position:absolute;top:12px;left:12px;background:var(--accent);color:var(--ink);font-size:11px;font-weight:600;padding:5px 12px;border-radius:999px;font-family:'JetBrains Mono',monospace;letter-spacing:.04em;text-transform:uppercase;}

.cc-body{padding:20px 20px 20px;display:flex;flex-direction:column;gap:14px;flex:1;}
.cc-name{font-size:18px;font-weight:700;color:var(--ink);line-height:1.2;}
.cc-sub{font-size:12.5px;color:var(--text-dim);margin-top:3px;font-weight:400;line-height:1.4;}

.cc-info{display:flex;flex-direction:column;gap:8px;}
.cc-row{display:flex;align-items:flex-start;gap:9px;font-size:13.5px;color:var(--text);}
.cc-row svg{flex-shrink:0;margin-top:2px;color:var(--green);opacity:.9;}
.cc-row a{color:var(--text);transition:color var(--tr);}
.cc-row a:hover{color:var(--green);}

.cc-meta{display:flex;flex-wrap:wrap;gap:7px;padding-top:12px;border-top:1px solid var(--line);}
.cc-pill{display:inline-flex;align-items:center;gap:6px;background:var(--paper-dim);border:1px solid var(--line);border-radius:8px;padding:6px 11px;font-size:12px;color:var(--text-dim);}
.cc-pill svg{color:var(--green);}
.cc-pill b{color:var(--ink);font-weight:600;}

.cc-services{display:flex;flex-wrap:wrap;gap:5px;}
.cc-svc{font-size:11.5px;padding:4px 10px;border-radius:6px;background:rgba(11,93,74,.07);color:var(--green);border:1px solid rgba(11,93,74,.14);font-weight:500;}

.cc-ctas{display:flex;gap:8px;margin-top:auto;}
.cc-ctas .ev-btn{flex:1;justify-content:center;}

/* ── SCROLL HINT (mobile only) ── */
.scroll-hint{display:none;align-items:center;gap:6px;font-size:12px;color:var(--text-dim);margin-bottom:12px;}
.scroll-hint svg{color:var(--green);}
@media(max-width:640px){.scroll-hint{display:flex;}}

/* ── TRUST STRIP ── */
.trust-strip{background:var(--paper-dim);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:52px 0;}
.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;}
.trust-item{display:flex;gap:14px;align-items:flex-start;}
.trust-ic{width:46px;height:46px;border-radius:13px;background:#fff;box-shadow:var(--sh-sm);display:flex;align-items:center;justify-content:center;color:var(--green);flex-shrink:0;}
.trust-item h4{font-size:14px;font-weight:600;color:var(--ink);margin-bottom:4px;}
.trust-item p{font-size:13px;}
@media(max-width:900px){.trust-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:520px){.trust-grid{grid-template-columns:1fr;}}

/* ── GALLERY ── */
.gallery-sec{padding:72px 0 0;}
.gallery-sec .ev-shead{margin-bottom:36px;}
.ev-shead h2{font-size:clamp(24px,3vw,36px);}
.ev-lede{color:var(--text-dim);font-size:15.5px;max-width:560px;margin-top:10px;line-height:1.7;}
.gallery-mosaic{display:grid;grid-template-columns:1.4fr 1fr 1fr;grid-template-rows:240px 220px;gap:14px;}
.gm-img{overflow:hidden;border-radius:16px;}
.gm-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s;}
.gm-img:hover img{transform:scale(1.04);}
.g-tall{grid-row:span 2;}
@media(max-width:900px){.gallery-mosaic{grid-template-columns:1fr 1fr;grid-template-rows:200px 200px 200px;}.g-tall{grid-row:span 1;}}
@media(max-width:560px){.gallery-mosaic{grid-template-columns:1fr;}.gm-img{height:210px;}.gallery-mosaic{gap:10px;}}

/* ── FINAL CTA ── */
.loc-final{padding:72px 0;}
.loc-final-in{background:var(--ink);border-radius:26px;padding:clamp(44px,6vw,80px) clamp(24px,5vw,72px);position:relative;overflow:hidden;text-align:center;}
.loc-final-in::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% -10%,rgba(201,162,106,.16),transparent 60%);pointer-events:none;}
.loc-final-in h2{color:#fff;font-size:clamp(24px,3vw,38px);margin-bottom:14px;position:relative;}
.loc-final-in p{color:rgba(237,241,236,.68);max-width:520px;margin:0 auto 30px;position:relative;font-size:15.5px;line-height:1.7;}
.loc-final-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;position:relative;}

/* ── FOOTER ── */
.ev-foot{background:var(--ink);color:rgba(237,241,236,.65);padding:68px 0 26px;}
.ev-foot h5{color:#fff;font-size:14px;margin-bottom:18px;font-weight:600;}
.ev-foot-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:36px;padding-bottom:44px;border-bottom:1px solid rgba(237,241,236,.1);}
.ev-foot-brand img{height:28px;margin-bottom:16px;filter:brightness(0) invert(1);}
.ev-foot-brand p{color:rgba(237,241,236,.48);font-size:14px;max-width:230px;}
.ev-foot ul{display:flex;flex-direction:column;gap:10px;}
.ev-foot ul a{font-size:14px;color:rgba(237,241,236,.58);transition:color var(--tr);}
.ev-foot ul a:hover{color:var(--accent-soft);}
.ev-foot-loc{padding:38px 0;border-bottom:1px solid rgba(237,241,236,.1);}
.ev-loc-g{display:grid;grid-template-columns:repeat(4,1fr);gap:20px 26px;}
.ev-loc-it .lc{font-size:12.5px;color:var(--accent-soft);font-weight:600;margin-bottom:5px;}
.ev-loc-it a{font-size:13px;color:rgba(237,241,236,.5);line-height:1.55;transition:color var(--tr);}
.ev-loc-it a:hover{color:rgba(237,241,236,.9);}
.ev-foot-bot{display:flex;justify-content:space-between;align-items:center;padding-top:22px;flex-wrap:wrap;gap:12px;font-size:12.5px;color:rgba(237,241,236,.4);}
.ev-foot-social{display:flex;gap:10px;}
.ev-foot-social a{width:34px;height:34px;border-radius:50%;background:rgba(237,241,236,.08);display:flex;align-items:center;justify-content:center;color:rgba(237,241,236,.6);transition:background var(--tr),color var(--tr);}
.ev-foot-social a:hover{background:var(--green);color:#fff;}
.ev-grievance{font-size:11px;color:rgba(237,241,236,.33);margin-top:18px;line-height:1.65;}
@media(max-width:1000px){.ev-foot-top{grid-template-columns:1fr 1fr;}.ev-loc-g{grid-template-columns:1fr 1fr;}}
@media(max-width:540px){.ev-foot-top{grid-template-columns:1fr;}.ev-loc-g{grid-template-columns:1fr;}}

/* ── WHATSAPP FLOAT ── */
.ev-wa{position:fixed;bottom:24px;right:24px;background:#25D366;color:#fff;display:flex;align-items:center;gap:8px;padding:12px 20px;border-radius:999px;font-size:13.5px;font-weight:600;z-index:60;box-shadow:0 8px 26px rgba(37,211,102,.36);transition:transform var(--tr),box-shadow var(--tr);}
.ev-wa:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(37,211,102,.44);}

/* ── SCROLL REVEAL ── */
.ev-reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease;}
.ev-reveal.is-in{opacity:1;transform:none;}
.clinic-card.ev-reveal:nth-child(2){transition-delay:.07s;}
.clinic-card.ev-reveal:nth-child(3){transition-delay:.14s;}
.clinic-card.ev-reveal:nth-child(4){transition-delay:.07s;}
.clinic-card.ev-reveal:nth-child(5){transition-delay:.14s;}
.clinic-card.ev-reveal:nth-child(6){transition-delay:.21s;}