/* ── DESIGN TOKENS ─────────────────────────────────────────────────────────── */
:root {
  /* Indigo brand palette */
  --indigo:      #6366F1;
  --indigo-b:    #4F46E5;
  --indigo-c:    #818CF8;
  --indigo-fog:  #EEF2FF;
  --indigo-mid:  rgba(99,102,241,.12);
  --indigo-glow: 0 4px 14px rgba(99,102,241,.35);

  /* Aliases used by landing-page rules (.hero, .sec, .map-sec, .cta-sec, …) */
  --teal:      #6366F1;
  --teal-b:    #4F46E5;
  --teal-c:    #818CF8;
  --teal-fog:  #EEF2FF;
  --teal-mid:  rgba(99,102,241,.12);
  --coral:     #10B981;
  --coral-b:   #059669;
  --coral-fog: #ECFDF5;
  --st:        0 4px 14px rgba(99,102,241,.28);

  /* Emerald (verified / success) */
  --emerald:     #10B981;
  --emerald-fog: #ECFDF5;

  /* Slate scale */
  --navy:   #0F172A;
  --navy-2: #1E293B;
  --navy-3: #334155;
  --slate:  #64748B;
  --cloud:  #F8FAFC;
  --mist:   #F1F5F9;
  --rim:    #E2E8F0;
  --white:  #FFFFFF;

  /* Shadows */
  --sd: 0 2px 12px rgba(15,23,42,.07);
  --sm: 0 8px 32px rgba(15,23,42,.11);
  --sl: 0 20px 64px rgba(15,23,42,.16);

  /* Radii */
  --r8:  8px;
  --r12: 12px;
  --r16: 16px;
  --r20: 20px;
  --r28: 28px;
  --r99: 999px;
}

/* ── RESET ─────────────────────────────────────────────────────────────────── */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Plus Jakarta Sans', sans-serif;
  background: var(--cloud);
  color: var(--navy);
  -webkit-font-smoothing: antialiased;
  min-height: 100svh;
}

/* ── NAV ───────────────────────────────────────────────────────────────────── */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 900;
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 20px;
  background: rgba(248,250,252,.94);
  backdrop-filter: blur(28px) saturate(180%);
  border-bottom: 1px solid var(--rim);
  height: 60px;
}

.logo {
  display: flex; align-items: center; gap: 9px;
  text-decoration: none;
}
.logo-mark {
  width: 34px; height: 34px; border-radius: 10px;
  background: linear-gradient(140deg, var(--indigo), var(--indigo-c));
  display: flex; align-items: center; justify-content: center;
  box-shadow: var(--indigo-glow);
}
.logo-mark svg { width: 17px; height: 17px; }
.logo-type { font-size: 20px; font-weight: 800; letter-spacing: -.3px; }
.logo-near { color: var(--navy); }
.logo-fit  { color: var(--indigo); }

.nav-actions { display: flex; align-items: center; gap: 10px; }
.btn-nav-trainer {
  padding: 8px 18px; border-radius: var(--r99);
  background: var(--indigo); color: var(--white);
  font-size: 13px; font-weight: 700;
  text-decoration: none; transition: .2s;
  box-shadow: var(--indigo-glow);
}
.btn-nav-trainer:hover { background: var(--indigo-b); }

.nav-back {
  display: flex; align-items: center; gap: 7px;
  font-size: 13px; font-weight: 600; color: var(--slate);
  text-decoration: none; transition: .2s;
  padding: 8px 14px; border-radius: var(--r99);
}
.nav-back:hover { color: var(--indigo); background: var(--indigo-fog); }

/* ══════════════════════════════════
   HERO
══════════════════════════════════ */
.hero{
  min-height:100svh;
  padding:88px 18px 60px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  position:relative;overflow:hidden;
  background:linear-gradient(168deg, var(--white) 0%, var(--teal-fog) 52%, var(--coral-fog) 100%);
}
.hero-noise{
  position:absolute;inset:0;pointer-events:none;opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:200px;
}
.blob{position:absolute;border-radius:50%;pointer-events:none;filter:blur(72px);}
.b1{width:520px;height:520px;top:-120px;left:-160px;background:radial-gradient(circle,rgba(99,102,241,.2),transparent 68%);}
.b2{width:400px;height:400px;bottom:-80px;right:-100px;background:radial-gradient(circle,rgba(16,185,129,.17),transparent 68%);}
.b3{width:280px;height:280px;top:38%;left:48%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(99,102,241,.13),transparent 65%);}

.hero-inner{
  position:relative;z-index:2;
  display:flex;flex-direction:column;align-items:center;text-align:center;
  width:100%;max-width:700px;
}

.hero-pill{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--white);border:1.5px solid var(--rim);
  border-radius:var(--r99);padding:7px 16px;
  font-size:11px;font-weight:700;color:var(--teal);
  letter-spacing:.06em;text-transform:uppercase;
  box-shadow:var(--sd);margin-bottom:22px;
  animation:up .55s ease both;
}
.pill-dot{width:7px;height:7px;border-radius:50%;background:var(--teal);animation:blink 2s ease infinite;}
@keyframes blink{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(1.6)}}

.hero-h{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:clamp(40px,9vw,78px);line-height:1.05;font-weight:700;letter-spacing:-.02em;
  color:var(--navy);margin-bottom:16px;
  animation:up .6s .06s ease both;
}
.hero-h em{font-style:italic;color:var(--teal);font-weight:600;}
.hero-h .swash{
  position:relative;display:inline-block;
  font-style:italic;font-weight:600;
}
.hero-h .swash::after{
  content:'';position:absolute;
  bottom:2px;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--coral),rgba(16,185,129,.3));
  border-radius:2px;transform-origin:left;
  animation:lineIn .9s .8s cubic-bezier(.16,1,.3,1) both;
}
@keyframes lineIn{from{transform:scaleX(0)}to{transform:scaleX(1)}}

.hero-p{
  font-size:clamp(14px,3.2vw,17px);font-weight:400;line-height:1.72;
  color:var(--navy-3);max-width:460px;margin-bottom:34px;
  animation:up .6s .12s ease both;
}

/* SEARCH CARD */
.s-card{
  width:100%;max-width:620px;
  animation:up .6s .18s ease both;
}
.s-top{
  background:var(--white);
  border-radius:var(--r20) var(--r20) 0 0;
  box-shadow:0 -2px 0 0 var(--mist) inset;
  overflow:hidden;
  border:1.5px solid var(--mist);
  border-bottom:none;
}
.s-field{
  display:flex;align-items:center;gap:14px;
  padding:16px 20px;
  position:relative;transition:.2s;cursor:text;
}
.s-field:focus-within{background:var(--teal-fog);}
.s-field + .s-field{border-top:1.5px solid var(--mist);}
.s-ico-wrap{
  width:38px;height:38px;border-radius:var(--r12);
  background:var(--teal-fog);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:.2s;
}
.s-field:focus-within .s-ico-wrap{background:rgba(99,102,241,.18);}
.s-ico-wrap svg{color:var(--teal);}
.s-text{flex:1;min-width:0;}
.s-lbl{
  font-size:10px;font-weight:800;color:var(--slate);
  text-transform:uppercase;letter-spacing:.09em;
  display:block;margin-bottom:3px;
}
.s-input,.s-sel{
  border:none;outline:none;
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:15px;font-weight:600;color:var(--navy);
  background:transparent;width:100%;padding:0;
}
.s-sel{cursor:pointer;appearance:none;}
.s-input::placeholder{color:var(--rim);font-weight:400;}
.s-chevron{color:var(--slate);opacity:.5;flex-shrink:0;pointer-events:none;}

.s-goals{
  background:var(--white);
  border:1.5px solid var(--mist);border-top:none;
  padding:12px 16px;
  display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;
}
.s-goals::-webkit-scrollbar{display:none;}
.s-goal{
  flex-shrink:0;
  display:flex;align-items:center;gap:6px;
  padding:8px 14px;border-radius:var(--r99);
  border:1.5px solid var(--rim);background:var(--cloud);
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:12px;font-weight:600;color:var(--navy-3);
  cursor:pointer;transition:.2s;white-space:nowrap;
}
.s-goal:hover{border-color:var(--teal);color:var(--teal);background:var(--teal-fog);}
.s-goal.picked{border-color:var(--teal);color:var(--teal);background:var(--teal-fog);}
.s-goal-icon{font-size:14px;line-height:1;}

.s-bottom{
  display:flex;gap:0;
  border-radius:0 0 var(--r20) var(--r20);
  overflow:hidden;box-shadow:var(--sl);
}
.s-go{
  flex:1;padding:16px 20px;
  background:linear-gradient(135deg,var(--teal) 0%,var(--teal-c) 100%);
  color:var(--white);border:none;cursor:pointer;
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:15px;font-weight:700;letter-spacing:.02em;
  transition:.25s;
  display:flex;align-items:center;justify-content:center;gap:9px;
  text-decoration:none;
}
.s-go:hover{filter:brightness(1.07);}
.s-go svg{transition:transform .25s;}
.s-go:hover svg{transform:translateX(4px);}
.s-go-sub{font-size:11px;font-weight:500;opacity:.75;display:block;margin-top:1px;}

@media(min-width:540px){
  .s-top{display:flex;}
  .s-field{flex:1;}
  .s-field + .s-field{border-top:none;border-left:1.5px solid var(--mist);}
}

.hero-nums{
  display:flex;gap:24px;flex-wrap:wrap;justify-content:center;margin-top:32px;
  animation:up .6s .26s ease both;
}
.num-item{text-align:center;}
.num-val{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:28px;font-weight:700;color:var(--navy);line-height:1;letter-spacing:-.02em;
}
.num-lbl{font-size:10px;font-weight:600;color:var(--slate);text-transform:uppercase;letter-spacing:.07em;margin-top:3px;}

.hero-avatars{
  display:flex;align-items:center;gap:14px;margin-top:28px;
  animation:up .6s .32s ease both;
}
.av-stack{display:flex;}
.av-stack img{
  width:36px;height:36px;border-radius:50%;object-fit:cover;
  border:2.5px solid var(--white);margin-left:-10px;
  box-shadow:var(--sd);
}
.av-stack img:first-child{margin-left:0;}
.av-text{font-size:12px;font-weight:500;color:var(--slate);line-height:1.4;}
.av-text strong{color:var(--navy);font-weight:700;}

@keyframes up{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}

/* ══════════════════════════════════
   SHARED SECTION
══════════════════════════════════ */
.sec{padding:60px 18px;}
.sec-inner{max-width:1100px;margin:0 auto;}
@media(min-width:700px){.sec{padding:96px 40px;}}

.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-size:10px;font-weight:800;color:var(--teal);
  text-transform:uppercase;letter-spacing:.12em;margin-bottom:10px;
}
.eyebrow::before{content:'';width:24px;height:2px;background:var(--teal);border-radius:2px;}
.sec-title{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:clamp(28px,5vw,48px);line-height:1.12;color:var(--navy);
  font-weight:700;letter-spacing:-.02em;
}
.sec-sub{font-size:15px;color:var(--slate);line-height:1.7;margin-top:10px;max-width:440px;}

/* ══════════════════════════════════
   HOW IT WORKS
══════════════════════════════════ */
.how{background:var(--white);}
.how-grid{
  display:grid;gap:14px;
  grid-template-columns:1fr;margin-top:40px;
}
@media(min-width:540px){.how-grid{grid-template-columns:1fr 1fr;}}
@media(min-width:960px){.how-grid{grid-template-columns:repeat(4,1fr);}}

.how-card{
  padding:28px 24px 26px;border-radius:var(--r20);
  background:var(--cloud);
  border:1.5px solid transparent;
  position:relative;overflow:hidden;transition:.3s;
}
.how-card:hover{
  background:var(--white);
  border-color:rgba(99,102,241,.2);
  box-shadow:var(--sm);transform:translateY(-4px);
}
.how-card::before{
  content:'';position:absolute;inset:0;border-radius:var(--r20);
  background:linear-gradient(135deg,var(--teal-fog),var(--coral-fog));
  opacity:0;transition:.3s;
}
.how-card:hover::before{opacity:1;}
.how-card>*{position:relative;z-index:1;}
.how-n{
  position:absolute;top:16px;right:18px;
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:60px;font-weight:800;line-height:1;letter-spacing:-.04em;
  color:var(--mist);transition:.3s;user-select:none;
}
.how-card:hover .how-n{color:rgba(99,102,241,.1);}
.how-emoji{
  width:50px;height:50px;border-radius:14px;
  background:linear-gradient(135deg,var(--teal-fog),rgba(99,102,241,.1));
  display:flex;align-items:center;justify-content:center;
  font-size:22px;margin-bottom:16px;
}
.how-card h3{font-size:16px;font-weight:700;color:var(--navy);margin-bottom:7px;}
.how-card p{font-size:13px;color:var(--slate);line-height:1.68;}
@media(min-width:960px){
  .how-card:not(:last-child)::after{
    content:'→';
    position:absolute;right:-20px;top:50%;
    transform:translateY(-50%);
    font-size:18px;color:var(--teal-c);z-index:20;
  }
}

/* ══════════════════════════════════
   MAP (landing-page section)
══════════════════════════════════ */
.map-sec{background:var(--navy);}
.map-sec .eyebrow{color:var(--teal-c);}
.map-sec .eyebrow::before{background:var(--teal-c);}
.map-sec .sec-title{color:var(--white);}
.map-sec .sec-sub{color:rgba(255,255,255,.45);}

.map-layout{
  display:flex;flex-direction:column;gap:18px;
  margin-top:36px;
}
@media(min-width:860px){
  .map-layout{flex-direction:row;align-items:stretch;}
  .map-wrap{flex:1 1 62%;}
  .map-list{flex:0 0 300px;}
}

.map-wrap{
  border-radius:var(--r20);overflow:hidden;
  height:360px;
  border:1px solid rgba(255,255,255,.07);
  box-shadow:var(--sl);
}
@media(min-width:860px){.map-wrap{height:auto;min-height:480px;}}
#map{width:100%;height:100%;}

/* leaflet popup */
.leaflet-popup-content-wrapper{
  border-radius:16px !important;
  box-shadow:0 12px 40px rgba(15,23,42,.22) !important;
  padding:0 !important;overflow:hidden;
}
.leaflet-popup-content{margin:0 !important;width:auto !important;}
.leaflet-popup-tip-container{display:none;}
.lf-pop{padding:16px 18px;min-width:210px;}
.lf-pop-name{font-size:14px;font-weight:700;color:var(--navy);}
.lf-pop-spec{font-size:12px;color:var(--teal);font-weight:600;margin:2px 0 8px;}
.lf-pop-row{display:flex;justify-content:space-between;align-items:center;}
.lf-pop-rating{font-size:12px;color:var(--slate);}
.lf-pop-rating .s{color:var(--coral);}
.lf-pop-price{font-size:14px;font-weight:800;color:var(--navy);}
.lf-pop-btn{
  width:100%;margin-top:10px;padding:9px;border-radius:var(--r12);
  border:none;cursor:pointer;
  background:linear-gradient(135deg,var(--coral),var(--coral-b));
  color:var(--white);font-family:'Plus Jakarta Sans',sans-serif;
  font-size:12px;font-weight:700;transition:.2s;
}
.lf-pop-btn:hover{opacity:.88;}

.map-list{display:flex;flex-direction:column;gap:10px;overflow-y:auto;max-height:360px;}
@media(min-width:860px){.map-list{max-height:480px;}}
.map-list::-webkit-scrollbar{width:3px;}
.map-list::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:2px;}

.mc{
  display:flex;align-items:center;gap:13px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.09);
  border-radius:var(--r16);padding:13px 15px;
  cursor:pointer;transition:.25s;
}
.mc:hover,.mc.on{
  background:rgba(99,102,241,.16);
  border-color:rgba(99,102,241,.4);
  transform:translateX(4px);
}
.mc-av{
  width:44px;height:44px;border-radius:50%;overflow:hidden;
  border:2px solid rgba(255,255,255,.14);flex-shrink:0;
}
.mc-av img{width:100%;height:100%;object-fit:cover;}
.mc-name{font-size:13px;font-weight:700;color:var(--white);}
.mc-spec{font-size:11px;color:rgba(255,255,255,.45);margin-top:1px;}
.mc-price{font-size:13px;font-weight:800;color:var(--teal-c);margin-left:auto;flex-shrink:0;}

/* custom map pin */
.pin{
  display:flex;flex-direction:column;align-items:center;
  cursor:pointer;
}
.pin-bubble{
  display:flex;align-items:center;gap:7px;
  background:var(--white);
  border-radius:var(--r99);
  padding:5px 12px 5px 5px;
  box-shadow:0 4px 18px rgba(15,23,42,.22);
  border:2px solid var(--white);
  transition:.2s;white-space:nowrap;
}
.pin-bubble:hover{transform:scale(1.06);}
.pin-av{
  width:28px;height:28px;border-radius:50%;
  object-fit:cover;flex-shrink:0;
  border:1.5px solid var(--rim);
}
.pin-label{display:flex;flex-direction:column;}
.pin-name{font-family:'Plus Jakarta Sans',sans-serif;font-size:11px;font-weight:700;color:var(--navy);line-height:1.2;}
.pin-price{font-family:'Plus Jakarta Sans',sans-serif;font-size:10px;font-weight:600;line-height:1.2;}
.pin-tail{width:2px;height:10px;background:var(--navy);opacity:.3;}
.pin-dot{
  width:8px;height:8px;border-radius:50%;
  border:2px solid var(--white);
  box-shadow:0 2px 6px rgba(15,23,42,.3);
}
.pin-t .pin-price{color:var(--teal);}
.pin-t .pin-dot{background:var(--teal);}
.pin-c .pin-price{color:var(--coral);}
.pin-c .pin-dot{background:var(--coral);}

/* ══════════════════════════════════
   TRAINERS (landing-page grid)
══════════════════════════════════ */
.trainers-sec{background:var(--cloud);}
.tr-top{
  display:flex;align-items:flex-end;justify-content:space-between;
  flex-wrap:wrap;gap:14px;margin-bottom:22px;
}
.view-link{
  font-size:13px;font-weight:700;color:var(--teal);
  text-decoration:none;display:flex;align-items:center;gap:5px;
  transition:.2s;
}
.view-link:hover{gap:9px;}

.chips{
  display:flex;gap:8px;overflow-x:auto;
  padding-bottom:4px;margin-bottom:26px;
  scrollbar-width:none;
}
.chips::-webkit-scrollbar{display:none;}
.chip{
  flex-shrink:0;padding:9px 18px;border-radius:var(--r99);
  border:1.5px solid var(--rim);background:var(--white);
  color:var(--navy-3);font-family:'Plus Jakarta Sans',sans-serif;
  font-size:12px;font-weight:600;cursor:pointer;transition:.2s;
  white-space:nowrap;
}
.chip:hover{border-color:var(--teal);color:var(--teal);}
.chip.on{
  background:var(--teal);border-color:var(--teal);
  color:var(--white);box-shadow:var(--st);
}

.tr-grid{
  display:grid;gap:16px;
  grid-template-columns:1fr;
}
@media(min-width:500px){.tr-grid{grid-template-columns:1fr 1fr;}}
@media(min-width:880px){.tr-grid{grid-template-columns:repeat(3,1fr);}}

/* TRAINER CARD */
.tc{
  background:var(--white);border-radius:var(--r20);
  overflow:hidden;cursor:pointer;
  border:1.5px solid var(--mist);
  box-shadow:var(--sd);transition:.3s;
}
.tc:hover{
  transform:translateY(-7px);
  box-shadow:var(--sl);
  border-color:rgba(99,102,241,.2);
}
.tc-photo{
  position:relative;height:240px;overflow:hidden;
  background:var(--mist);
}
.tc-photo img{
  width:100%;height:100%;object-fit:cover;
  transition:.5s ease;
}
.tc:hover .tc-photo img{transform:scale(1.06);}
.tc-photo-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to top, rgba(15,23,42,.55) 0%, transparent 50%);
}
.tc-verified{
  position:absolute;top:12px;left:12px;
  background:rgba(255,255,255,.95);
  border-radius:var(--r99);padding:5px 11px;
  font-size:10px;font-weight:800;color:var(--teal);
  display:flex;align-items:center;gap:5px;
  backdrop-filter:blur(8px);letter-spacing:.02em;
}
.tc-price{
  position:absolute;bottom:12px;right:12px;
  background:var(--navy);color:var(--white);
  border-radius:var(--r99);padding:5px 14px;
  font-size:13px;font-weight:800;
}
.tc-rating-badge{
  position:absolute;bottom:12px;left:12px;
  background:rgba(255,255,255,.95);
  border-radius:var(--r99);padding:5px 11px;
  font-size:12px;font-weight:800;color:var(--navy);
  display:flex;align-items:center;gap:4px;
  backdrop-filter:blur(8px);
}
.tc-rating-badge .s{color:var(--coral);}

.tc-body{padding:0 18px 18px;}
.tc-card-header{
  display:flex;align-items:center;gap:12px;
  margin-bottom:10px;padding-top:0;
}
.tc-avatar{
  width:52px;height:52px;border-radius:50%;
  object-fit:cover;flex-shrink:0;
  border:3px solid var(--white);
  box-shadow:var(--sm);
  margin-top:-26px;
  position:relative;z-index:2;
  background:var(--mist);
}
.tc-header-info{flex:1;min-width:0;padding-top:4px;}
.tc-name{font-size:15px;font-weight:700;color:var(--navy);margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tc-spec{font-size:11px;font-weight:600;color:var(--teal);}
.tc-rating-pill{
  flex-shrink:0;margin-top:4px;
  display:flex;align-items:center;gap:3px;
  background:var(--cloud);border:1px solid var(--mist);
  border-radius:var(--r99);padding:4px 10px;
  font-size:12px;font-weight:700;color:var(--navy);
}
.tc-rating-pill .s{color:var(--coral);}
.tc-loc{
  font-size:12px;color:var(--slate);
  display:flex;align-items:center;gap:4px;margin-bottom:13px;
}
.tc-loc svg{width:12px;height:12px;flex-shrink:0;}
.tc-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px;}
.tc-tag{
  padding:4px 11px;border-radius:var(--r99);
  background:var(--cloud);border:1px solid var(--mist);
  font-size:10px;font-weight:600;color:var(--navy-3);letter-spacing:.02em;
}
.tc-actions{display:flex;gap:8px;}
.tc-book{
  flex:1;padding:11px;border-radius:var(--r99);
  background:linear-gradient(135deg,var(--coral),var(--coral-b));
  color:var(--white);border:none;cursor:pointer;
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:12px;font-weight:700;transition:.25s;
  box-shadow:0 4px 14px rgba(16,185,129,.3);
}
.tc-book:hover{transform:translateY(-2px);box-shadow:0 7px 20px rgba(16,185,129,.44);}
.tc-view{
  padding:11px 16px;border-radius:var(--r99);
  border:1.5px solid var(--rim);background:transparent;
  color:var(--slate);cursor:pointer;transition:.2s;
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:12px;font-weight:600;
}
.tc-view:hover{border-color:var(--teal);color:var(--teal);}

/* ══════════════════════════════════
   TESTIMONIALS
══════════════════════════════════ */
.testi-sec{background:var(--navy-2);}
.testi-sec .eyebrow{color:var(--teal-c);}
.testi-sec .eyebrow::before{background:var(--teal-c);}
.testi-sec .sec-title{color:var(--white);}

.testi-grid{
  display:grid;gap:14px;
  grid-template-columns:1fr;margin-top:40px;
}
@media(min-width:540px){.testi-grid{grid-template-columns:1fr 1fr;}}
@media(min-width:960px){.testi-grid{grid-template-columns:repeat(3,1fr);}}

.tcard{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--r20);padding:26px 22px;
  position:relative;overflow:hidden;transition:.3s;
}
.tcard::before{
  content:'\201C';
  position:absolute;top:-12px;right:16px;
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:130px;font-weight:700;font-style:italic;
  color:rgba(99,102,241,.1);line-height:1;pointer-events:none;
}
.tcard:hover{background:rgba(255,255,255,.09);transform:translateY(-4px);}
.tcard-stars{color:var(--coral);font-size:13px;letter-spacing:2px;margin-bottom:12px;}
.tcard-text{font-size:13px;color:rgba(255,255,255,.72);line-height:1.78;margin-bottom:18px;font-style:italic;}
.tcard-author{display:flex;align-items:center;gap:11px;}
.tcard-av{
  width:42px;height:42px;border-radius:50%;object-fit:cover;
  border:2px solid rgba(255,255,255,.12);
  background:var(--teal-fog);flex-shrink:0;
}
.tcard-name{font-size:13px;font-weight:700;color:var(--white);}
.tcard-res{font-size:11px;color:var(--teal-c);font-weight:600;margin-top:2px;}

/* ══════════════════════════════════
   CTA
══════════════════════════════════ */
.cta-sec{
  padding:80px 18px;text-align:center;
  background:linear-gradient(135deg,var(--teal-fog) 0%,var(--coral-fog) 100%);
  position:relative;overflow:hidden;
}
.cta-sec::before{
  content:'';position:absolute;inset:0;
  background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%236366F1' fill-opacity='0.04'%3E%3Ccircle cx='10' cy='10' r='2'/%3E%3Ccircle cx='30' cy='10' r='2'/%3E%3Ccircle cx='50' cy='10' r='2'/%3E%3Ccircle cx='10' cy='30' r='2'/%3E%3Ccircle cx='30' cy='30' r='2'/%3E%3Ccircle cx='50' cy='30' r='2'/%3E%3Ccircle cx='10' cy='50' r='2'/%3E%3Ccircle cx='30' cy='50' r='2'/%3E%3Ccircle cx='50' cy='50' r='2'/%3E%3C/g%3E%3C/svg%3E");
}
.cta-sec>*{position:relative;z-index:1;}
.cta-sec h2{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:clamp(28px,6vw,52px);line-height:1.1;font-weight:700;letter-spacing:-.02em;
  color:var(--navy);max-width:520px;margin:0 auto 14px;
}
.cta-sec h2.serif{font-style:italic;font-weight:600;}
.cta-sec p{font-size:15px;color:var(--navy-3);max-width:380px;margin:0 auto 36px;line-height:1.7;}
.cta-row{display:flex;flex-direction:column;gap:12px;align-items:center;}
@media(min-width:460px){.cta-row{flex-direction:row;justify-content:center;}}
.cta-main{
  padding:15px 32px;border-radius:var(--r99);
  background:linear-gradient(135deg,var(--coral),var(--coral-b));
  color:var(--white);border:none;cursor:pointer;
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:14px;font-weight:700;transition:.25s;
  box-shadow:0 6px 22px rgba(16,185,129,.35);
  text-decoration:none;display:inline-block;
}
.cta-main:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(16,185,129,.45);}
.cta-sec2{
  padding:15px 32px;border-radius:var(--r99);
  border:2px solid var(--navy);background:transparent;
  color:var(--navy);cursor:pointer;transition:.25s;
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:14px;font-weight:700;
  text-decoration:none;display:inline-block;
}
.cta-sec2:hover{background:var(--navy);color:var(--white);}

/* ══════════════════════════════════
   FOOTER (landing)
══════════════════════════════════ */
.lp-footer{
  background:var(--navy);padding:32px 18px;
  display:flex;flex-direction:column;align-items:center;gap:18px;text-align:center;
}
@media(min-width:700px){
  .lp-footer{flex-direction:row;justify-content:space-between;text-align:left;padding:32px 40px;}
}
.fl{display:flex;align-items:center;gap:9px;}
.fl-mark{
  width:30px;height:30px;border-radius:8px;
  background:linear-gradient(140deg,#6366F1,#818CF8);
  display:flex;align-items:center;justify-content:center;
}
.fl-mark svg{width:14px;height:14px;}
.fl-type{font-family:'Plus Jakarta Sans',sans-serif;font-size:18px;font-weight:700;color:var(--white);letter-spacing:-.01em;}
.fl-type .fl-fit{color:var(--teal-c);}
.flinks{display:flex;gap:18px;flex-wrap:wrap;justify-content:center;}
.flinks a{font-size:12px;color:rgba(255,255,255,.35);text-decoration:none;transition:.2s;font-weight:500;}
.flinks a:hover{color:var(--white);}
.fcopy{font-size:11px;color:rgba(255,255,255,.25);}

/* ══════════════════════════════════
   MODAL
══════════════════════════════════ */
.overlay{
  position:fixed;inset:0;z-index:1000;
  background:rgba(15,23,42,.6);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  display:none;align-items:flex-end;justify-content:center;
}
.overlay.on{display:flex;animation:ovIn .2s ease;}
@keyframes ovIn{from{opacity:0}to{opacity:1}}
@media(min-width:620px){.overlay{align-items:center;padding:20px;}}

.modal{
  background:var(--white);
  width:100%;max-width:660px;
  max-height:93svh;overflow-y:auto;
  border-radius:var(--r28) var(--r28) 0 0;
  animation:sheetUp .35s cubic-bezier(.16,1,.3,1);
  scrollbar-width:none;
}
.modal::-webkit-scrollbar{display:none;}
@media(min-width:620px){
  .modal{border-radius:var(--r28);animation:modalUp .3s ease;}
}
@keyframes sheetUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
@keyframes modalUp{from{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}

.mdrag{width:38px;height:4px;background:var(--mist);border-radius:2px;margin:12px auto 0;}
@media(min-width:620px){.mdrag{display:none;}}

.mcov{
  height:220px;overflow:hidden;position:relative;
  background:linear-gradient(135deg,var(--teal),var(--teal-c));
}
.mcov img{width:100%;height:100%;object-fit:cover;opacity:.65;}
.mcov-grad{position:absolute;inset:0;background:linear-gradient(to top,rgba(15,23,42,.6),transparent 60%);}
.mx{
  position:absolute;top:14px;right:14px;
  width:36px;height:36px;border-radius:50%;
  background:rgba(255,255,255,.92);border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-size:16px;color:var(--navy);transition:.2s;
}
.mx:hover{transform:scale(1.08);}
.mav{
  position:absolute;bottom:-24px;left:22px;
  width:64px;height:64px;border-radius:50%;
  border:3px solid var(--white);overflow:hidden;
  background:var(--teal-fog);box-shadow:var(--sm);
}
.mav img{width:100%;height:100%;object-fit:cover;}

.mbody{padding:38px 22px 26px;}
.mhead{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:10px;margin-bottom:18px;}
.mname{font-family:'Plus Jakarta Sans',sans-serif;font-size:22px;font-weight:700;color:var(--navy);letter-spacing:-.01em;}
.mspec{font-size:12px;color:var(--teal);font-weight:700;margin-top:3px;letter-spacing:.03em;}
.mkpis{display:flex;gap:18px;}
.mkpi-v{font-family:'Plus Jakarta Sans',sans-serif;font-size:18px;font-weight:700;color:var(--navy);text-align:center;}
.mkpi-l{font-size:10px;color:var(--slate);text-transform:uppercase;letter-spacing:.06em;text-align:center;}
.mh{font-size:11px;font-weight:800;color:var(--navy);text-transform:uppercase;letter-spacing:.08em;margin:20px 0 9px;}
.mbio{font-size:13px;color:var(--navy-3);line-height:1.78;}
.mcerts{display:flex;gap:8px;flex-wrap:wrap;}
.mcert{
  display:flex;align-items:center;gap:7px;
  padding:7px 13px;border-radius:var(--r12);
  background:var(--teal-fog);
  font-size:12px;font-weight:600;color:var(--teal);
  border:1px solid rgba(99,102,241,.15);
}
.mslots{
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px;
}
@media(min-width:380px){.mslots{grid-template-columns:repeat(4,1fr);}}
.mslot{
  padding:10px 4px;border-radius:var(--r12);
  border:1.5px solid var(--rim);
  font-size:11px;font-weight:600;color:var(--slate);
  text-align:center;cursor:pointer;transition:.2s;
}
.mslot:hover{border-color:var(--teal);color:var(--teal);}
.mslot.on{background:var(--teal);border-color:var(--teal);color:var(--white);}
.mbook{
  width:100%;margin-top:22px;padding:15px;border-radius:var(--r99);
  background:linear-gradient(135deg,var(--coral),var(--coral-b));
  color:var(--white);border:none;cursor:pointer;
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:14px;font-weight:700;transition:.25s;
  box-shadow:0 6px 20px rgba(16,185,129,.35);
  display:flex;align-items:center;justify-content:center;gap:9px;
}
.mbook:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(16,185,129,.46);}

/* ══════════════════════════════════
   TOAST
══════════════════════════════════ */
.toast{
  position:fixed;bottom:24px;left:50%;
  transform:translateX(-50%) translateY(70px);
  z-index:2000;
  background:var(--navy);
  border-radius:var(--r16);padding:15px 20px;
  display:flex;align-items:center;gap:13px;
  box-shadow:var(--sl);
  opacity:0;transition:all .4s cubic-bezier(.16,1,.3,1);
  min-width:260px;max-width:88vw;
}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0);}
.toast-ic{
  width:36px;height:36px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg,var(--teal),var(--teal-c));
  display:flex;align-items:center;justify-content:center;font-size:16px;color:var(--white);
}
.toast-t{font-size:13px;font-weight:700;color:var(--white);}
.toast-s{font-size:11px;color:rgba(255,255,255,.45);margin-top:2px;}

/* ── HOME PAGE LAYOUT ──────────────────────────────────────────────────────── */
.page-home {
  display: flex;
  height: calc(100svh - 60px);
  margin-top: 60px;
  overflow: hidden;
}

.sidebar {
  width: 400px;
  min-width: 400px;
  overflow-y: auto;
  background: var(--white);
  border-right: 1px solid var(--rim);
  display: flex;
  flex-direction: column;
}

.map-panel { flex: 1; position: relative; }
.map-panel #map { position: absolute; inset: 0; }

/* ── SEARCH BAR ────────────────────────────────────────────────────────────── */
.search-bar {
  padding: 16px 16px 12px;
  border-bottom: 1px solid var(--mist);
  position: sticky; top: 0; z-index: 10;
  background: var(--white);
}
.search-input-wrap {
  position: relative; margin-bottom: 12px;
}
.search-icon {
  position: absolute; left: 13px; top: 50%; transform: translateY(-50%);
  color: var(--slate); pointer-events: none;
}
.search-input {
  width: 100%; padding: 11px 14px 11px 40px;
  border: 1.5px solid var(--rim); border-radius: var(--r12);
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 14px; font-weight: 500; color: var(--navy);
  background: var(--cloud); outline: none; transition: .2s;
}
.search-input:focus { border-color: var(--indigo); box-shadow: 0 0 0 4px var(--indigo-fog); background: var(--white); }
.search-input::placeholder { color: var(--slate); font-weight: 400; }

.filter-chips {
  display: flex; gap: 6px; flex-wrap: wrap;
}
.filter-chip {
  padding: 5px 12px; border-radius: var(--r99);
  border: 1.5px solid var(--rim);
  background: var(--white); color: var(--slate);
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 12px; font-weight: 600;
  cursor: pointer; transition: .15s;
}
.filter-chip:hover, .filter-chip.active {
  border-color: var(--indigo); color: var(--indigo);
  background: var(--indigo-fog);
}

/* ── RESULTS META ──────────────────────────────────────────────────────────── */
.results-meta {
  padding: 12px 16px 4px;
  font-size: 12px; font-weight: 600; color: var(--slate);
}

/* ── TRAINER LIST (sidebar) ────────────────────────────────────────────────── */
.trainer-list {
  display: flex; flex-direction: column; gap: 0;
  padding: 4px 0 24px;
}

.trainer-card {
  display: flex; gap: 14px;
  padding: 14px 16px;
  text-decoration: none; color: inherit;
  border-bottom: 1px solid var(--mist);
  transition: .15s;
  cursor: pointer;
}
.trainer-card:hover { background: var(--cloud); }
.trainer-card.highlighted { background: var(--indigo-fog); border-left: 3px solid var(--indigo); }

.trainer-card-photo {
  width: 72px; height: 72px; border-radius: var(--r12);
  object-fit: cover; flex-shrink: 0;
  border: 2px solid var(--rim);
}

.trainer-card-body { flex: 1; min-width: 0; }

.trainer-card-top {
  display: flex; align-items: center; justify-content: space-between;
  gap: 6px; margin-bottom: 2px;
}
.trainer-card-name {
  font-size: 14px; font-weight: 700; color: var(--navy);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.verified-badge {
  display: inline-flex; align-items: center; gap: 4px;
  background: var(--emerald-fog); color: var(--emerald);
  font-size: 10px; font-weight: 700;
  padding: 2px 8px; border-radius: var(--r99);
  white-space: nowrap; flex-shrink: 0;
}
.verified-badge svg { width: 10px; height: 10px; }

.trainer-card-city {
  font-size: 12px; color: var(--slate); margin-bottom: 6px;
}

.trainer-card-specs {
  display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 6px;
}
.spec-badge {
  padding: 2px 9px; border-radius: var(--r99);
  background: var(--indigo-fog); color: var(--indigo);
  font-size: 11px; font-weight: 600;
}

.trainer-card-footer {
  display: flex; align-items: center; justify-content: space-between;
}
.trainer-card-rating { font-size: 12px; font-weight: 600; color: var(--slate); }
.trainer-card-price { font-size: 14px; font-weight: 800; color: var(--navy); }
.trainer-card-price span { font-size: 12px; font-weight: 500; color: var(--slate); }

/* ── MAP MARKERS (home maplibre) ───────────────────────────────────────────── */
.map-marker {
  padding: 5px 10px; border-radius: var(--r99);
  background: var(--indigo); color: var(--white);
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 12px; font-weight: 800;
  box-shadow: var(--sm); cursor: pointer;
  border: 2px solid var(--white);
  transition: .15s; white-space: nowrap;
}
.map-marker:hover { transform: scale(1.08); background: var(--indigo-b); }
.map-marker.active { background: var(--emerald); transform: scale(1.12); }

/* ── TRAINER DETAIL PAGE ───────────────────────────────────────────────────── */
.detail-page { padding-top: 60px; min-height: 100svh; }

.detail-hero {
  position: relative; height: 340px; overflow: hidden;
}
.detail-hero-img {
  width: 100%; height: 100%; object-fit: cover;
  object-position: center top;
}
.detail-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, transparent 40%, rgba(15,23,42,.8) 100%);
}
.detail-hero-content {
  position: absolute; bottom: 28px; left: 24px; right: 24px;
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 12px;
}
.detail-hero-name {
  font-size: clamp(26px, 4vw, 36px); font-weight: 800;
  color: var(--white); line-height: 1.1;
}
.detail-hero-price {
  background: rgba(255,255,255,.15); backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.2);
  color: var(--white); border-radius: var(--r12);
  padding: 10px 18px; text-align: center; white-space: nowrap;
}
.detail-hero-price-val { font-size: 24px; font-weight: 800; display: block; }
.detail-hero-price-label { font-size: 11px; font-weight: 500; opacity: .7; }

.detail-body {
  max-width: 720px; margin: 0 auto;
  padding: 32px 20px 80px;
}

.detail-meta-row {
  display: flex; align-items: center; gap: 10px;
  flex-wrap: wrap; margin-bottom: 20px;
}
.meta-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px; border-radius: var(--r99);
  background: var(--mist); border: 1px solid var(--rim);
  font-size: 13px; font-weight: 600; color: var(--navy-3);
}
.meta-chip.emerald { background: var(--emerald-fog); border-color: rgba(16,185,129,.2); color: var(--emerald); }
.meta-chip.indigo  { background: var(--indigo-fog); border-color: rgba(99,102,241,.2); color: var(--indigo); }
.meta-chip .stars  { color: #F59E0B; }

.detail-specs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 24px; }
.spec-badge-lg {
  padding: 6px 16px; border-radius: var(--r99);
  background: var(--indigo-fog); color: var(--indigo);
  font-size: 13px; font-weight: 700;
}

.detail-section { margin-bottom: 28px; }
.detail-section-title {
  font-size: 12px; font-weight: 800; text-transform: uppercase;
  letter-spacing: .08em; color: var(--slate); margin-bottom: 10px;
}
.detail-bio {
  font-size: 15px; line-height: 1.75; color: var(--navy-3);
}

.detail-info-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
}
.detail-info-item {
  background: var(--mist); border-radius: var(--r12);
  padding: 12px 14px; border: 1px solid var(--rim);
}
.detail-info-label { font-size: 11px; font-weight: 700; color: var(--slate); text-transform: uppercase; letter-spacing: .06em; margin-bottom: 4px; }
.detail-info-val   { font-size: 13px; font-weight: 600; color: var(--navy); }

.book-cta {
  position: sticky; bottom: 0;
  background: rgba(248,250,252,.95); backdrop-filter: blur(20px);
  border-top: 1px solid var(--rim);
  padding: 16px 20px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.book-cta-price { font-size: 22px; font-weight: 800; color: var(--navy); }
.book-cta-price span { font-size: 13px; font-weight: 500; color: var(--slate); }
.btn-book {
  padding: 14px 32px; border-radius: var(--r99);
  background: var(--indigo); color: var(--white);
  border: none; cursor: not-allowed;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 15px; font-weight: 700;
  opacity: .6;
  box-shadow: var(--indigo-glow);
}

.review-card {
  background: var(--white); border: 1px solid var(--rim);
  border-radius: var(--r16); padding: 18px 20px;
  margin-bottom: 12px;
}
.review-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 8px;
}
.review-author { font-size: 14px; font-weight: 700; color: var(--navy); }
.review-stars  { color: #F59E0B; font-size: 13px; }
.review-text   { font-size: 14px; line-height: 1.65; color: var(--navy-3); }

.coming-soon-badge {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--mist); border: 1px solid var(--rim);
  color: var(--slate); font-size: 12px; font-weight: 600;
  padding: 6px 12px; border-radius: var(--r99); margin-top: 8px;
}

/* ── REGISTER PAGE ─────────────────────────────────────────────────────────── */
.page {
  min-height: 100svh;
  display: grid;
  grid-template-columns: 1fr;
  padding-top: 60px;
}
@media (min-width: 960px) { .page { grid-template-columns: 420px 1fr; } }

.left {
  background: var(--navy);
  padding: 48px 36px;
  display: none; flex-direction: column;
  position: relative; overflow: hidden;
}
@media (min-width: 960px) { .left { display: flex; position: sticky; top: 60px; height: calc(100svh - 60px); } }

.left-bg { position: absolute; inset: 0; pointer-events: none; }
.left-orb { position: absolute; border-radius: 50%; filter: blur(80px); }
.lo1 { width: 400px; height: 400px; top: -100px; left: -100px; background: radial-gradient(circle, rgba(99,102,241,.28), transparent 65%); }
.lo2 { width: 300px; height: 300px; bottom: -60px; right: -60px; background: radial-gradient(circle, rgba(99,102,241,.18), transparent 65%); }

.left-content { position: relative; z-index: 2; display: flex; flex-direction: column; height: 100%; }

.left-badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(99,102,241,.18); border: 1px solid rgba(99,102,241,.3);
  border-radius: var(--r99); padding: 6px 14px;
  font-size: 11px; font-weight: 700; color: var(--indigo-c);
  text-transform: uppercase; letter-spacing: .08em;
  margin-bottom: 32px; width: fit-content;
}
.left-badge-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--indigo-c); animation: blink 2s ease infinite; }

.left h2 {
  font-size: clamp(30px, 3.2vw, 42px); font-weight: 800;
  line-height: 1.1; color: var(--white); margin-bottom: 16px;
}
.left h2 em { font-style: italic; color: var(--indigo-c); }
.left-sub { font-size: 14px; color: rgba(255,255,255,.5); line-height: 1.7; max-width: 320px; }

.perks { display: flex; flex-direction: column; gap: 14px; margin-top: 36px; }
.perk { display: flex; align-items: flex-start; gap: 13px; }
.perk-icon {
  width: 38px; height: 38px; border-radius: var(--r12); flex-shrink: 0;
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1);
  display: flex; align-items: center; justify-content: center; font-size: 16px;
}
.perk-title  { font-size: 13px; font-weight: 700; color: var(--white); margin-bottom: 2px; }
.perk-desc   { font-size: 12px; color: rgba(255,255,255,.45); line-height: 1.55; }

.left-trainers { margin-top: auto; padding-top: 32px; }
.lt-label { font-size: 11px; font-weight: 700; color: rgba(255,255,255,.3); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 12px; }
.lt-row { display: flex; align-items: center; }
.lt-av { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; border: 2.5px solid var(--navy-2); margin-right: -10px; background: var(--indigo-fog); }
.lt-text { font-size: 12px; color: rgba(255,255,255,.5); margin-left: 18px; line-height: 1.45; }
.lt-text strong { color: var(--white); }

.right { padding: 32px 18px 80px; display: flex; flex-direction: column; align-items: center; }
@media (min-width: 700px) { .right { padding: 48px 40px 80px; } }

.progress-wrap { width: 100%; max-width: 560px; margin-bottom: 40px; }
.progress-steps { display: flex; align-items: center; margin-bottom: 10px; }
.ps { display: flex; align-items: center; gap: 8px; flex: 1; position: relative; }
.ps-num {
  width: 32px; height: 32px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 800; flex-shrink: 0; transition: .3s;
  border: 2px solid var(--rim); color: var(--slate); background: var(--white);
}
.ps.done .ps-num   { background: var(--indigo); border-color: var(--indigo); color: var(--white); }
.ps.active .ps-num { background: var(--white); border-color: var(--indigo); color: var(--indigo); box-shadow: 0 0 0 4px var(--indigo-fog); }
.ps-label { font-size: 11px; font-weight: 600; color: var(--slate); white-space: nowrap; display: none; }
@media (min-width: 480px) { .ps-label { display: block; } }
.ps.done .ps-label, .ps.active .ps-label { color: var(--navy); }
.ps-line { flex: 1; height: 2px; background: var(--rim); border-radius: 2px; transition: .3s; margin: 0 4px; }
.ps-line.done { background: var(--indigo); }

.progress-info { display: flex; justify-content: space-between; align-items: center; }
.pi-step { font-size: 12px; font-weight: 600; color: var(--slate); }
.pi-pct  { font-size: 12px; font-weight: 700; color: var(--indigo); }

.form-card {
  background: var(--white); border-radius: var(--r28);
  box-shadow: var(--sm); width: 100%; max-width: 560px; overflow: hidden;
}
.fc-head {
  padding: 28px 28px 24px;
  border-bottom: 1px solid var(--mist);
}
.fc-step-label {
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--indigo-fog); border-radius: var(--r99);
  padding: 5px 12px; font-size: 11px; font-weight: 700;
  color: var(--indigo); text-transform: uppercase; letter-spacing: .07em;
  margin-bottom: 12px;
}
.fc-title { font-size: 26px; font-weight: 800; color: var(--navy); line-height: 1.15; }
.fc-sub   { font-size: 13px; color: var(--slate); margin-top: 5px; line-height: 1.6; }
.fc-body  { padding: 28px; }

.step-panel { display: none; }
.step-panel.active { display: block; animation: fadeIn .3s ease; }
@keyframes fadeIn { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:translateY(0)} }

.field { margin-bottom: 18px; }
.field-row { display: grid; gap: 14px; grid-template-columns: 1fr; }
@media (min-width: 420px) { .field-row.two   { grid-template-columns: 1fr 1fr; } }
@media (min-width: 420px) { .field-row.three { grid-template-columns: 1fr 1fr 1fr; } }

label {
  display: block; font-size: 11px; font-weight: 800;
  color: var(--slate); text-transform: uppercase;
  letter-spacing: .08em; margin-bottom: 7px;
}
.req { color: var(--indigo); }

.inp {
  width: 100%; padding: 13px 16px;
  border: 1.5px solid var(--rim); border-radius: var(--r12);
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 14px; font-weight: 500; color: var(--navy);
  background: var(--white); outline: none; transition: .2s;
  -webkit-appearance: none;
}
.inp:focus { border-color: var(--indigo); box-shadow: 0 0 0 4px var(--indigo-fog); }
.inp:hover:not(:focus) { border-color: var(--slate); }
.inp::placeholder { color: var(--rim); font-weight: 400; }

textarea.inp { resize: vertical; min-height: 100px; line-height: 1.6; }
select.inp {
  cursor: pointer; appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748B' stroke-width='2.5' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center;
}

.inp-prefix { position: relative; }
.inp-prefix .inp { padding-left: 46px; }
.inp-prefix-sym {
  position: absolute; left: 16px; top: 50%; transform: translateY(-50%);
  font-size: 14px; font-weight: 600; color: var(--slate); pointer-events: none;
}
.field-hint { font-size: 11px; color: var(--slate); margin-top: 6px; line-height: 1.5; }

.photo-upload {
  border: 2px dashed var(--rim); border-radius: var(--r20);
  padding: 36px 20px; text-align: center; cursor: pointer;
  transition: .2s; background: var(--cloud);
  position: relative; overflow: hidden;
}
.photo-upload:hover { border-color: var(--indigo); background: var(--indigo-fog); }
.photo-upload input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%; }
.pu-icon {
  width: 56px; height: 56px; border-radius: var(--r16);
  background: linear-gradient(135deg, var(--indigo-fog), var(--indigo-mid));
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 14px; font-size: 24px;
}
.pu-title   { font-size: 14px; font-weight: 700; color: var(--navy); margin-bottom: 4px; }
.pu-sub     { font-size: 12px; color: var(--slate); }
.pu-formats { display: inline-flex; gap: 6px; margin-top: 12px; }
.pu-fmt {
  padding: 3px 10px; border-radius: var(--r99);
  background: var(--white); border: 1px solid var(--rim);
  font-size: 10px; font-weight: 700; color: var(--slate); letter-spacing: .04em;
}
#photoPreview {
  display: none; width: 100px; height: 100px; border-radius: 50%;
  object-fit: cover; border: 3px solid var(--indigo);
  margin: 0 auto 10px; box-shadow: var(--sm);
}

.spec-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; }
@media (min-width: 420px) { .spec-grid { grid-template-columns: repeat(3,1fr); } }

.spec-chip {
  display: flex; flex-direction: column; align-items: center; gap: 7px;
  padding: 16px 12px; border-radius: var(--r16);
  border: 2px solid var(--rim); background: var(--cloud);
  cursor: pointer; transition: .2s; text-align: center; position: relative;
}
.spec-chip:hover { border-color: var(--indigo); background: var(--indigo-fog); }
.spec-chip.on    { border-color: var(--indigo); background: var(--indigo-fog); }
.spec-chip.on::after {
  content: '✓';
  position: absolute; top: 8px; right: 10px;
  font-size: 11px; font-weight: 800; color: var(--indigo);
}
.spec-emoji { font-size: 22px; line-height: 1; }
.spec-label { font-size: 12px; font-weight: 700; color: var(--navy); line-height: 1.2; }

.avail-grid { display: flex; flex-direction: column; gap: 8px; }
.avail-day {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 16px; border-radius: var(--r12);
  border: 1.5px solid var(--rim); background: var(--cloud); transition: .2s;
}
.avail-day.on { border-color: var(--indigo); background: var(--indigo-fog); }

.day-toggle { position: relative; width: 40px; height: 22px; flex-shrink: 0; cursor: pointer; }
.day-toggle input { opacity: 0; width: 0; height: 0; position: absolute; }
.toggle-track { position: absolute; inset: 0; border-radius: var(--r99); background: var(--rim); transition: .25s; }
.day-toggle input:checked ~ .toggle-track { background: var(--indigo); }
.toggle-thumb { position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: var(--white); box-shadow: var(--sd); transition: .25s; }
.day-toggle input:checked ~ .toggle-track .toggle-thumb { transform: translateX(18px); }
.day-name  { font-size: 13px; font-weight: 700; color: var(--navy); width: 70px; flex-shrink: 0; }
.day-slots { display: flex; gap: 6px; flex-wrap: wrap; flex: 1; }
.day-slot {
  padding: 5px 11px; border-radius: var(--r99);
  border: 1.5px solid var(--rim); background: var(--white);
  font-size: 11px; font-weight: 600; color: var(--slate);
  cursor: pointer; transition: .15s;
}
.day-slot.on { background: var(--indigo); border-color: var(--indigo); color: var(--white); }
.day-slot:hover:not(.on) { border-color: var(--indigo); color: var(--indigo); }

.price-preview {
  background: var(--indigo-fog);
  border-radius: var(--r16); padding: 18px 20px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; margin-top: 14px;
  border: 1px solid rgba(99,102,241,.15);
}
.pp-label    { font-size: 12px; font-weight: 600; color: var(--navy-3); }
.pp-numbers  { display: flex; align-items: baseline; gap: 4px; }
.pp-price    { font-size: 32px; font-weight: 800; color: var(--navy); }
.pp-unit     { font-size: 13px; color: var(--slate); }
.pp-payout   { text-align: right; }
.pp-payout-label { font-size: 10px; font-weight: 700; color: var(--indigo); text-transform: uppercase; letter-spacing: .06em; }
.pp-payout-val   { font-size: 18px; font-weight: 700; color: var(--indigo); }

.cert-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
.cert-item {
  display: flex; align-items: center; gap: 12px;
  padding: 11px 15px; border-radius: var(--r12);
  background: var(--indigo-fog); border: 1px solid rgba(99,102,241,.15);
}
.cert-icon   { font-size: 18px; }
.cert-name   { font-size: 13px; font-weight: 600; color: var(--indigo); flex: 1; }
.cert-remove {
  width: 26px; height: 26px; border-radius: 50%;
  background: rgba(99,102,241,.15); border: none;
  cursor: pointer; font-size: 13px; color: var(--indigo);
  display: flex; align-items: center; justify-content: center; transition: .2s;
}
.cert-remove:hover { background: rgba(239,68,68,.15); color: #EF4444; }
.add-cert-btn {
  width: 100%; padding: 12px; border-radius: var(--r12);
  border: 1.5px dashed var(--rim); background: transparent;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 13px; font-weight: 600; color: var(--slate);
  cursor: pointer; transition: .2s;
  display: flex; align-items: center; justify-content: center; gap: 8px;
}
.add-cert-btn:hover { border-color: var(--indigo); color: var(--indigo); background: var(--indigo-fog); }

.review-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 13px 0; border-bottom: 1px solid var(--mist); gap: 12px;
}
.review-row:last-child { border-bottom: none; }
.rr-label { font-size: 12px; font-weight: 700; color: var(--slate); text-transform: uppercase; letter-spacing: .06em; }
.rr-val   { font-size: 13px; font-weight: 600; color: var(--navy); text-align: right; max-width: 60%; }
.rr-edit  { font-size: 11px; font-weight: 700; color: var(--indigo); background: none; border: none; cursor: pointer; white-space: nowrap; transition: .2s; }
.rr-edit:hover { opacity: .7; }

.profile-preview {
  display: flex; align-items: center; gap: 16px;
  background: var(--cloud); border-radius: var(--r16);
  padding: 16px 18px; margin-bottom: 20px; border: 1px solid var(--mist);
}
.pp-av { width: 60px; height: 60px; border-radius: 50%; object-fit: cover; border: 3px solid var(--white); box-shadow: var(--sm); background: var(--indigo-fog); flex-shrink: 0; }
.pp-info-name { font-size: 16px; font-weight: 700; color: var(--navy); }
.pp-info-spec { font-size: 12px; color: var(--indigo); font-weight: 600; margin-top: 2px; }
.pp-info-loc  { font-size: 12px; color: var(--slate); margin-top: 2px; }

.terms-box {
  background: var(--cloud); border-radius: var(--r12);
  padding: 14px 16px; margin-bottom: 20px; border: 1px solid var(--mist);
}
.terms-check { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 10px; }
.terms-check:last-child { margin-bottom: 0; }
.terms-check input[type=checkbox] {
  width: 18px; height: 18px; flex-shrink: 0; margin-top: 1px;
  accent-color: var(--indigo); cursor: pointer;
}
.terms-check label {
  font-size: 12px; font-weight: 500; color: var(--navy-3);
  text-transform: none; letter-spacing: 0; margin-bottom: 0; cursor: pointer;
}
.terms-check label a { color: var(--indigo); font-weight: 700; text-decoration: none; }

.btn-row { display: flex; gap: 10px; margin-top: 28px; }
.btn-back {
  padding: 13px 22px; border-radius: var(--r99);
  border: 1.5px solid var(--rim); background: transparent;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 14px; font-weight: 600; color: var(--slate);
  cursor: pointer; transition: .2s; white-space: nowrap;
}
.btn-back:hover { border-color: var(--slate); color: var(--navy); }
.btn-next {
  flex: 1; padding: 14px 24px; border-radius: var(--r99);
  background: linear-gradient(135deg, var(--indigo), var(--indigo-c));
  color: var(--white); border: none; cursor: pointer;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 14px; font-weight: 700; transition: .25s;
  box-shadow: 0 6px 20px rgba(99,102,241,.35);
  display: flex; align-items: center; justify-content: center; gap: 8px;
}
.btn-next:hover { filter: brightness(1.07); box-shadow: 0 8px 28px rgba(99,102,241,.45); }
.btn-next svg { transition: transform .2s; }
.btn-next:hover svg { transform: translateX(3px); }
.btn-submit {
  flex: 1; padding: 14px 24px; border-radius: var(--r99);
  background: linear-gradient(135deg, var(--indigo-b), var(--indigo));
  color: var(--white); border: none; cursor: pointer;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 14px; font-weight: 700; transition: .25s;
  box-shadow: 0 6px 20px rgba(99,102,241,.4);
  display: flex; align-items: center; justify-content: center; gap: 8px;
}
.btn-submit:hover { box-shadow: 0 10px 28px rgba(99,102,241,.5); }

.success-screen {
  display: none; flex-direction: column; align-items: center;
  text-align: center; padding: 48px 28px;
}
.success-screen.on { display: flex; animation: fadeIn .4s ease; }
.success-icon {
  width: 80px; height: 80px; border-radius: 50%;
  background: linear-gradient(135deg, var(--indigo), var(--indigo-c));
  display: flex; align-items: center; justify-content: center;
  font-size: 34px; margin-bottom: 24px;
  box-shadow: 0 8px 30px rgba(99,102,241,.35);
  animation: popIn .5s cubic-bezier(.16,1,.3,1) both;
}
@keyframes popIn { from{transform:scale(0)} to{transform:scale(1)} }
.success-title { font-size: 32px; font-weight: 800; color: var(--navy); margin-bottom: 10px; }
.success-sub   { font-size: 14px; color: var(--slate); max-width: 360px; line-height: 1.7; }
.success-steps { display: flex; flex-direction: column; gap: 10px; margin-top: 28px; width: 100%; max-width: 400px; }
.ss {
  display: flex; align-items: center; gap: 13px;
  background: var(--cloud); border-radius: var(--r12);
  padding: 13px 16px; border: 1px solid var(--mist);
}
.ss-num {
  width: 28px; height: 28px; border-radius: 50%;
  background: linear-gradient(135deg, var(--indigo), var(--indigo-c));
  color: var(--white); font-size: 12px; font-weight: 800;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.ss-text { font-size: 13px; font-weight: 500; color: var(--navy-3); text-align: left; line-height: 1.45; }
.ss-text strong { color: var(--navy); font-weight: 700; }
.ss-icon { font-size: 18px; margin-left: auto; }
.success-btn {
  margin-top: 28px; padding: 14px 36px; border-radius: var(--r99);
  background: linear-gradient(135deg, var(--indigo), var(--indigo-c));
  color: var(--white); border: none; cursor: pointer;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 14px; font-weight: 700;
  box-shadow: var(--indigo-glow); transition: .2s;
}
.success-btn:hover { filter: brightness(1.08); }

.divider {
  display: flex; align-items: center; gap: 12px;
  color: var(--slate); font-size: 12px; margin: 18px 0;
}
.divider::before, .divider::after { content: ''; flex: 1; height: 1px; background: var(--rim); }

.social-btn {
  width: 100%; padding: 12px; border-radius: var(--r12);
  border: 1.5px solid var(--rim); background: var(--white);
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 13px; font-weight: 600; color: var(--navy);
  cursor: pointer; transition: .2s;
  display: flex; align-items: center; justify-content: center; gap: 10px;
}
.social-btn:hover { border-color: var(--slate); background: var(--cloud); }

.trust-row {
  display: flex; align-items: center; justify-content: center;
  gap: 18px; flex-wrap: wrap;
  margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--mist);
}
.trust-item {
  display: flex; align-items: center; gap: 6px;
  font-size: 11px; font-weight: 600; color: var(--slate);
}
.trust-item svg { color: var(--indigo); }

/* ── RESPONSIVE ────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .page-home { flex-direction: column; height: auto; overflow: visible; }
  .sidebar { width: 100%; min-width: unset; max-height: 55svh; overflow-y: auto; }
  .map-panel { height: 45svh; position: relative; }
  .map-panel #map { position: absolute; inset: 0; }

  .detail-hero { height: 260px; }
  .detail-body { padding: 20px 16px 100px; }
  .detail-info-grid { grid-template-columns: 1fr; }
}