/* =========================================================
   m01.css — M01 Massagem Terapêutica em Águas Claras
   Complementa components.css do baseline.
   Apenas estilos específicos da M01 (não duplica o design system).
   ========================================================= */

/* =========================================================
   M01 HERO — Light hero (diferente da home dark)
   ========================================================= */
.m01-hero{
  padding:160px 0 96px;
  background:
    radial-gradient(ellipse at 80% 0%, var(--gold-soft) 0%, transparent 55%),
    var(--bg);
  border-bottom:1px solid var(--line);
}
.m01-hero__inner{max-width:880px}
.m01-hero h1{
  font-size:clamp(38px,5.5vw,72px);
  color:var(--ink);
  margin-bottom:24px;
  line-height:1.05;
}
.m01-hero h1 em{color:var(--gold);font-style:normal}
.m01-hero__sub{
  color:var(--ink-soft);
  font-size:clamp(17px,1.4vw,20px);
  line-height:1.6;
  max-width:680px;
  margin-bottom:36px;
}
.m01-hero__meta{
  display:flex;flex-wrap:wrap;gap:18px 28px;
  font-size:14px;color:var(--ink-soft);
  margin-top:32px;padding-top:28px;
  border-top:1px solid var(--line);
  max-width:680px;
}
.m01-hero__meta span{display:inline-flex;align-items:center;gap:8px}
.m01-hero__meta span::before{content:"";display:inline-block;width:14px;height:1px;background:var(--gold)}

/* =========================================================
   SECTION — Soft cream section variant
   ========================================================= */
.m01-section{padding:120px 0;position:relative}
.m01-section--cream{background:var(--surface)}
.m01-section--gold-tint{background:linear-gradient(180deg,var(--gold-soft) 0%,var(--bg) 100%)}
.m01-section__head{text-align:center;max-width:780px;margin:0 auto 64px}
.m01-section__head h2{font-size:clamp(32px,4.5vw,52px);margin-top:14px;color:var(--ink)}
.m01-section__head p{color:var(--ink-soft);font-size:18px;margin-top:20px}

/* =========================================================
   INDICATIONS — bullet list with serif numbers
   ========================================================= */
.m01-indications{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:20px 32px;max-width:880px;margin:0 auto;
}
.m01-indications li{
  display:flex;gap:18px;align-items:flex-start;
  padding:18px 0;border-bottom:1px solid var(--line);
  color:var(--ink-soft);font-size:16px;line-height:1.55;
}
.m01-indications li::before{
  content:"";flex:none;width:8px;height:8px;margin-top:10px;
  background:var(--gold);border-radius:50%;
}
.m01-indications li:last-child{border-bottom:0}

/* =========================================================
   LOCALE BLOCK (location data — confirmed fields only)
   ========================================================= */
.m01-locale{
  display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start;
}
.m01-locale__card{
  background:var(--bg);border:1px solid var(--line);
  border-radius:20px;padding:36px;
}
.m01-locale__row{
  padding:14px 0;border-bottom:1px solid var(--line);
  display:flex;align-items:flex-start;gap:24px;
}
.m01-locale__row:last-child{border-bottom:0}
.m01-locale__row strong{
  display:block;color:var(--ink);font-weight:500;
  font-size:13px;letter-spacing:0.18em;text-transform:uppercase;
  min-width:120px;color:var(--ink-soft);
}
.m01-locale__row span{color:var(--ink);font-size:15px;line-height:1.5}
.m01-locale__map{
  aspect-ratio:4/3;background:var(--gold-soft);
  border:1px solid var(--gold);border-radius:20px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  color:var(--gold);font-size:14px;text-align:center;padding:32px;
}
.m01-locale__map .icon{font-size:64px;margin-bottom:16px}
.m01-locale__map small{display:block;margin-top:12px;color:var(--ink-soft);font-size:12px}
@media(max-width:900px){
  .m01-locale{grid-template-columns:1fr;gap:32px}
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 768px) {
  .m01-hero{padding:120px 0 64px}
  .m01-section{padding:80px 0}
  .m01-section__head{margin-bottom:48px}
}