/* ============================================================================
   ASK HAVA — DESERT MODERN: provider profile  (desert_profile.css)
   Page styles for provider_profile.html. Pairs with desert.css (tokens +
   chrome) via desert_base.html — load AFTER desert.css.

   Class names are inherited from the Sandstone profile (prof/cover/head/side/
   claim/…) because tests and shared JS (favorites.js, sandstone_profile.js)
   pin them. We restyle, we do not rename.
   ========================================================================= */

/* legacy sandstone custom-property names used by the template's inline styles,
   remapped to Desert tokens so nothing renders unstyled. */
.prof{
  --accent:var(--orange-deep);
  --muted:rgba(23,19,16,.6);
  --hairline:rgba(23,19,16,.18);
}

.prof.wrap{max-width:1100px;margin:0 auto;padding:26px 32px 64px}
@media(max-width:700px){.prof.wrap{padding:20px 20px 110px}}

.prof .crumb{
  font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  opacity:.6;margin-bottom:16px;
}
.prof .crumb a:hover{color:var(--orange-deep)}

/* ---- cover photo ---- */
.prof .cover{
  height:240px;border:var(--d-border-thick);border-radius:var(--d-radius-lg);
  background-color:var(--sand);background-size:cover;background-position:center;
  position:relative;box-shadow:var(--d-shadow);
}
@media(max-width:700px){.prof .cover{height:170px}}
.prof .spon-tag{
  position:absolute;top:14px;left:14px;
  background:var(--orange);color:var(--black);border-radius:999px;
  font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  padding:6px 13px;
}

/* ---- identity + CTAs ---- */
.prof .head{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:18px;flex-wrap:wrap;margin-top:26px;
}
.prof .head h1{
  font-family:var(--disp);font-weight:800;
  font-size:clamp(30px,4.5vw,54px);
  line-height:.95;letter-spacing:-.02em;text-transform:uppercase;
}
.prof .head .sub{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  margin-top:10px;font-size:13.5px;font-weight:500;
}
.prof .sub>span:first-child{
  background:var(--black);color:var(--cream);
  font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  padding:5px 12px;
}
.prof .featured-tag{
  background:var(--orange);color:var(--black);border-radius:999px;
  font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  padding:5px 12px;
}
.prof .stars{font-family:var(--disp);font-weight:800;color:var(--orange-deep)}
.prof .rating-new{opacity:.6}
.prof .sub .open{font-weight:700;color:var(--orange-deep)}

.prof .actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.prof .actions a,
.prof .actions button{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--text);font-weight:700;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;
  padding:11px 20px;border-radius:999px;border:2px solid var(--black);
  background:transparent;color:inherit;cursor:pointer;
  transition:transform .12s ease,background .15s,color .15s,border-color .15s;
}
.prof .actions a:hover,
.prof .actions button:hover{transform:translateY(-2px)}
.prof .actions .primary{background:var(--black);color:var(--cream)}
.prof .actions .primary:hover{background:var(--orange);border-color:var(--orange)}
.prof .fav-save .heart{color:var(--orange-deep)}
.prof .fav-save .heart-on{display:none}
.prof .fav-save.is-saved{background:var(--orange);border-color:var(--orange);color:var(--black)}
.prof .fav-save.is-saved .heart{color:var(--black)}
.prof .fav-save.is-saved .heart-on{display:inline}
.prof .fav-save.is-saved .heart-off{display:none}

/* ---- two-column body ---- */
.prof .cols{
  display:grid;grid-template-columns:minmax(0,1.6fr) minmax(280px,1fr);
  gap:28px;margin-top:30px;align-items:start;
}
@media(max-width:840px){.prof .cols{grid-template-columns:1fr}}
.prof .about p{font-size:15.5px;line-height:1.65;max-width:64ch}

.prof .tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.prof .tags span{
  font-size:11.5px;font-weight:700;letter-spacing:.06em;
  border:1.5px solid var(--black);border-radius:999px;padding:6px 14px;
}

.prof .gallery{
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:22px;
}
@media(max-width:700px){.prof .gallery{grid-template-columns:1fr 1fr}}
.prof .gallery img{
  width:100%;aspect-ratio:4/3;object-fit:cover;
  border:2px solid var(--black);border-radius:12px;
}

/* ---- reviews ---- */
.prof .reviews{
  margin-top:26px;background:var(--cream);
  border:var(--d-border);border-radius:var(--d-radius);padding:20px 22px;
}
.prof .rev-source{
  font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:var(--orange-deep);margin-bottom:12px;
}
.prof .rev{
  font-size:14px;line-height:1.6;padding:10px 0;
  border-top:1.5px solid rgba(23,19,16,.12);
}
.prof .rev:first-of-type{border-top:none;padding-top:0}
.prof .rev-all{
  display:inline-block;margin-top:12px;
  font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  border-bottom:3px solid var(--orange);padding-bottom:2px;
}
.prof .rev-all:hover{color:var(--orange-deep)}

/* ---- facts card ("Good to know") ---- */
.prof .side{
  background:var(--cream);border:var(--d-border);border-radius:var(--d-radius);
  padding:22px 22px 20px;box-shadow:var(--d-shadow);
}
.prof .side .d-side-h{
  font-family:var(--disp);font-weight:800;font-size:18px;line-height:1;
  text-transform:uppercase;letter-spacing:.01em;
  border-bottom:3px solid var(--orange);padding-bottom:10px;margin-bottom:14px;
}
.prof .side .row{
  display:flex;align-items:flex-start;gap:9px;
  font-size:14px;font-weight:500;padding:5px 0;
}
.prof .side .row svg{flex:none;margin-top:2px;color:var(--orange-deep)}
.prof .side .row a{color:var(--orange-deep);font-weight:700}
.prof .side .rowlab{
  flex:none;font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  background:var(--black);color:var(--cream);padding:3px 8px;margin-top:2px;
}

.prof .hours-table{margin-top:10px;border-top:1.5px solid rgba(23,19,16,.14);padding-top:10px}
.prof .hours-now{font-weight:700;color:var(--orange-deep);font-size:13.5px;margin-bottom:8px}
.prof .hrow{
  display:flex;justify-content:space-between;gap:14px;
  font-size:13px;padding:3px 0;
}
.prof .hrow .hd{font-weight:700;letter-spacing:.04em}
.prof .hrow .hv{font-weight:500;opacity:.85;text-align:right}

/* ---- claim / offer blocks ---- */
.prof .claim{
  margin-top:18px;background:var(--sand);
  border:var(--d-border);border-radius:var(--d-radius);padding:18px 20px;
  font-size:14px;
}
.prof .claim--lock{display:flex;gap:12px;align-items:flex-start}
.prof .claim .e{font-size:20px;line-height:1;flex:none}
.prof .claim b{font-weight:700}
.prof .claim-sub{font-size:12.5px;opacity:.7;margin-top:4px}
.prof .claim a{color:var(--orange-deep);font-weight:700}

/* ---- concierge CTA ---- */
.prof .ask-hava-cta{
  display:flex;align-items:center;justify-content:center;gap:10px;
  margin-top:18px;padding:15px 20px;
  background:var(--blue);color:var(--cream);
  border:var(--d-border);border-radius:999px;
  font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;
  transition:background .15s;
}
.prof .ask-hava-cta:hover{background:var(--blue-deep)}

/* ---- classes & schedule / venue events / while-you're-here ---- */
.prof .sec-head h2{
  font-family:var(--disp);font-weight:800;
  text-transform:uppercase;letter-spacing:.01em;line-height:1;
}
.prof .venue-classes li{background:var(--cream)}

.venue-events-region{margin-top:30px}
.venue-events-region h2{
  font-family:var(--disp);font-weight:800;font-size:clamp(20px,2.4vw,28px);
  line-height:1;text-transform:uppercase;letter-spacing:-.01em;margin-bottom:16px;
}
.venue-events-list{
  list-style:none;padding:0;margin:0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;
}
@media(max-width:1080px){.venue-events-list{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.venue-events-list{grid-template-columns:1fr}}

.prof .alsosee{margin-top:30px}
.prof .cat-strip{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px}
.prof .catchip{
  display:flex;align-items:center;gap:10px;
  background:var(--cream);border:var(--d-border);border-radius:14px;
  padding:12px 16px;min-width:200px;
  transition:transform .14s ease,box-shadow .14s ease;
}
.prof .catchip:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--black)}
.prof .catchip .e{font-size:20px;line-height:1}
.prof .catchip .t{font-weight:700;font-size:14px;line-height:1.2}
.prof .catchip .n{
  font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  opacity:.55;margin-top:2px;
}

/* ---- sticky mobile call/directions bar ---- */
.prof-sticky-cta{display:none}
@media(max-width:700px){
  .prof-sticky-cta{
    display:flex;gap:10px;position:fixed;left:0;right:0;z-index:70;
    bottom:calc(58px + env(safe-area-inset-bottom));
    padding:10px 16px;background:var(--black);border-top:3px solid var(--orange);
  }
  .prof-sticky-cta a{
    flex:1;text-align:center;
    font-weight:700;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;
    border:2px solid var(--cream);border-radius:999px;padding:11px 0;color:var(--cream);
  }
  .prof-sticky-cta a.primary{background:var(--orange);border-color:var(--orange);color:var(--black)}
}

@media(prefers-reduced-motion:reduce){
  .prof .actions a,.prof .actions button,.prof .catchip{transition:none}
  .prof .actions a:hover,.prof .actions button:hover,.prof .catchip:hover{transform:none}
}