/* ============ lote 2 — páginas de serviço & condição ============ */

/* ——— hero de página interior: tipografia lidera, a moldura viaja ——— */
.mm-pag-hero{overflow:hidden}
.mm-pag-hero-grid{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:clamp(30px,5vw,80px);align-items:center}
.mm-h1-pag{margin:14px 0 0;max-width:15ch;font:italic 500 clamp(46px,6.2vw,90px)/1.04 var(--tg-f-titulo);letter-spacing:-.02em}
.mm-lead-pag{margin:22px 0 0;max-width:46ch;font-size:clamp(17px,1.55vw,20px);line-height:1.55}
.mm-reg-pag{margin:18px 0 0;max-width:54ch;font-size:13px;line-height:1.65;opacity:.85}
.mm-pag-acoes{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:28px}
.mm-pag-acoes .mm-prova-nota{margin:0}
.mm-pag-fig{position:relative;margin:0 auto;width:min(100%,400px)}
.mm-pag-fig::before{
  content:"";position:absolute;inset:-18% -16%;border-radius:50%;
  background:radial-gradient(closest-side,rgba(238,203,151,.85),rgba(238,203,151,0) 74%);
  filter:blur(30px);
}
.mm-pag-fig::after{
  content:"";position:absolute;inset:-18% -16%;pointer-events:none;
  background:url("/assets/img/arte-grao-filme.webp") center/380px repeat;opacity:.2;
}
.mm-pag-fig .mm-fig{position:relative;z-index:1;width:100%}

/* ——— blocos textuais de duas colunas ——— */
.mm-oo-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(30px,4.5vw,72px);align-items:start;margin-top:clamp(24px,3.2vw,40px)}
.mm-oo-grid p{margin:0 0 14px}
.mm-oo-grid .mm-lead-pag{margin-top:0}

/* ficha técnica — o papel de bula da página */
.mm-fichatec{margin:0;border-top:1.5px solid rgba(43,33,26,.3)}
.mm-fichatec>div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:10px 0;border-bottom:1px solid rgba(43,33,26,.18);font-size:14.5px}
.mm-fichatec dt{font:600 11px/1.5 var(--tg-f-texto);letter-spacing:.13em;text-transform:uppercase;opacity:.85}
.mm-fichatec dd{margin:0;text-align:right;font-variant-numeric:tabular-nums}

/* ——— a ficha de perfil: desenho em linha tinta + pontos que abrem a ficha ——— */
.mm-ficha-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(30px,4.5vw,64px);align-items:center;margin-top:clamp(26px,3.5vw,44px)}
.mm-ficha-palco{position:relative;width:100%;max-width:400px;margin:0 auto}
.mm-ficha-quadro{position:relative}
.mm-ficha-svg{width:100%;height:auto;display:block;color:var(--tg-tinta)}
.mm-ficha-svg path{fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.mm-ficha-svg .mm-ficha-costa{opacity:.4;stroke-width:1.8}
.mm-ficha-tabs{position:absolute;inset:0;pointer-events:none}
.mm-ficha-ponto{
  position:absolute;right:calc(100% - var(--x));top:var(--y);transform:translate(9px,-50%);
  display:flex;align-items:center;gap:9px;min-height:44px;padding:4px 4px 4px 6px;
  background:none;border:0;cursor:pointer;pointer-events:auto;
  font:600 11.5px/1 var(--tg-f-texto);letter-spacing:.12em;text-transform:uppercase;color:var(--tg-tinta);
}
.mm-ficha-tag{white-space:nowrap}
.mm-ficha-dot{flex:none;width:13px;height:13px;border-radius:50%;border:2px solid var(--tg-tinta);background:var(--tg-fundo);transition:background-color .25s,border-color .25s,box-shadow .25s}
.mm-ficha-ponto:hover .mm-ficha-dot{border-color:var(--tg-acento)}
.mm-ficha-ponto:focus-visible{outline:2px solid var(--tg-acento);outline-offset:2px;border-radius:8px}
.mm-ficha-ponto[aria-selected="true"]{color:var(--tg-acento)}
.mm-ficha-ponto[aria-selected="true"] .mm-ficha-dot{background:var(--tg-acento);border-color:var(--tg-acento);box-shadow:0 0 0 7px rgba(178,55,39,.13)}
.mm-ficha-notas{margin-top:20px;border-top:1.5px solid rgba(43,33,26,.28);min-height:120px}
.mm-ficha-nota{padding-top:14px}
.mm-ficha-nota-tit{margin:0 0 6px;font:600 11px/1.4 var(--tg-f-texto);letter-spacing:.14em;text-transform:uppercase;color:var(--tg-acento)}
.mm-ficha-nota p{margin:0;font-size:15px;line-height:1.6}
.mm-ficha-dica{margin:12px 0 0;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--tg-acento)}
.mm-ficha-foto{max-width:360px;margin:0 auto}
.mm-ficha-cit{margin-top:clamp(30px,4vw,52px)}

/* ——— seção em acento cheio: a regra aplicada ao procedimento ——— */
.mm-sec-acento{background:var(--tg-acento);color:var(--tg-fundo)}
.mm-sec-acento .mm-eyebrow{color:var(--tg-fundo);opacity:.9}
.mm-sec-acento .mm-h2{color:var(--tg-fundo)}
.mm-sec-acento .mm-h2 em{color:var(--tg-luz)}
.mm-sec-acento .mm-fio path{stroke:var(--tg-fundo);opacity:.45}
.mm-sec-acento .mm-cit p{color:var(--tg-fundo)}
.mm-sec-acento .mm-cit cite{color:var(--tg-luz);opacity:.9}
.mm-sec-acento .mm-dep{background:rgba(43,33,26,.16)}
.mm-sec-acento .mm-dep-autor{opacity:.92}
.mm-sex-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(30px,5vw,76px);align-items:center}
.mm-sex-grid .mm-lead-pag{margin-top:18px}
.mm-sex-grid .mm-cit{margin-top:26px}

/* ——— pergunta honesta (migração) ——— */
.mm-mig{max-width:720px}
.mm-mig p{margin:0 0 14px}
.mm-mig .mm-lead-pag{margin-top:0}
.mm-mig-acao{margin:22px 0 0}

/* ——— espelho de mão: auto-identificação do melasma ——— */
.mm-e-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(30px,4.5vw,68px);align-items:center;margin-top:clamp(24px,3.2vw,40px)}
.mm-e-grid p{margin:0 0 14px}
.mm-e-grid .mm-lead-pag{margin-top:0}
.mm-mao{position:relative;margin:0;padding:clamp(30px,4vw,46px) clamp(26px,3.6vw,44px);background:var(--tg-fundo)}
.mm-mao-borda{position:absolute;inset:-6px;overflow:visible;pointer-events:none}
.mm-mao-borda path{fill:none;stroke:var(--tg-acento);stroke-width:1.6;vector-effect:non-scaling-stroke;opacity:.55}
.mm-mao-tit{margin:0 0 10px;font:italic 500 clamp(21px,2.3vw,27px)/1.2 var(--tg-f-titulo)}
.mm-mao ol{margin:0;padding:0;list-style:none;counter-reset:mao}
.mm-mao li{position:relative;margin:0;padding:9px 0 9px 34px;font-size:15.5px;line-height:1.55;counter-increment:mao}
.mm-mao li::before{content:"0" counter(mao);position:absolute;left:0;top:11px;font:italic 500 15px/1 var(--tg-f-titulo);color:var(--tg-acento)}
.mm-mao li+li{border-top:1px solid rgba(43,33,26,.14)}
.mm-mao-pe{margin:16px 0 0;font-size:13px;opacity:.85}

/* ——— o capítulo do sol: trilha anos 80 → hoje ——— */
.mm-cap--sol{background:#F0E0C6;overflow:hidden}
.mm-cap--sol::after{content:"";position:absolute;inset:0;z-index:0;background:url("/assets/img/arte-grao-filme.webp") center/420px repeat;opacity:.15;pointer-events:none}
.mm-cap--sol .mm-cap-inner{z-index:1}
.mm-cap--sol .mm-fio path{opacity:.4}
.mm-sol-trilha{
  --solfio:clamp(22px,3vw,32px);
  list-style:none;margin:clamp(28px,4vw,46px) 0 0;padding:var(--solfio) 0 0;
  border-top:1.5px solid rgba(43,33,26,.34);
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,3vw,36px);
}
.mm-sol-trilha li{position:relative;margin:0;padding-top:22px}
.mm-sol-trilha li::before{content:"";position:absolute;top:calc(-1 * var(--solfio) - 5px);left:0;width:10px;height:10px;border-radius:50%;background:var(--tg-acento)}
.mm-sol-ano{display:block;margin:0 0 12px;font:italic 500 clamp(22px,2.8vw,32px)/1.1 var(--tg-f-titulo);letter-spacing:-.01em}
.mm-sol-leg{margin:10px 0 0;font-size:13.5px;line-height:1.5;opacity:.85}
.mm-sol-fecha{margin:clamp(26px,3.5vw,40px) 0 0;max-width:62ch;font-size:clamp(16px,1.7vw,19px);line-height:1.6}
.mm-sol-fecha b{color:var(--tg-acento)}

/* ——— dois assuntos: melasma × pinta ——— */
.mm-duas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:clamp(26px,3.5vw,42px)}
.mm-duas>div{padding:clamp(8px,1.5vw,14px) clamp(24px,3.4vw,44px)}
.mm-duas>div:first-child{border-right:1.5px solid rgba(43,33,26,.26);padding-left:0}
.mm-duas>div:last-child{padding-right:0}
.mm-duas-tit{margin:0 0 10px;font:600 11px/1.4 var(--tg-f-texto);letter-spacing:.13em;text-transform:uppercase;opacity:.85}
.mm-duas-big{margin:0 0 12px;font:italic 500 clamp(24px,2.9vw,35px)/1.14 var(--tg-f-titulo)}
.mm-duas p{margin:0;font-size:15px;line-height:1.62}

/* ——— série "não é normal": a noite do espelho ——— */
.mm-sec-noite{background:var(--tg-noite);color:var(--tg-fundo)}
.mm-sec-noite .mm-eyebrow{color:var(--tg-luz);opacity:.9}
.mm-sec-noite .mm-fio path{stroke:var(--tg-luz);opacity:.4}
.mm-sec-noite .mm-cit p{color:var(--tg-luz)}
.mm-sec-noite .mm-cit cite{color:var(--tg-fundo);opacity:.85}
.mm-sec-noite .mm-link{color:var(--tg-luz)}
.mm-sec-noite .mm-fig-nota{opacity:.75}
.mm-nn-grid{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:clamp(30px,5vw,76px);align-items:center}
.mm-nn-fig{max-width:300px}
.mm-nn-sub{margin:24px 0 0;max-width:52ch;font-size:15.5px;opacity:.92}

/* ——— fundos das peças do kit neste lote (alternância de temperatura) ——— */
.mm-cuida,.mm-veja{background:color-mix(in srgb,var(--tg-apoio) 58%,var(--tg-fundo))}

/* ——— celular ——— */
@media (max-width:900px){
  .mm-pag-hero-grid{grid-template-columns:1fr;gap:36px}
  .mm-h1-pag{font-size:clamp(38px,11.5vw,56px);max-width:16ch}
  .mm-pag-fig{width:min(74vw,300px)}
  .mm-oo-grid,.mm-e-grid,.mm-sex-grid,.mm-ficha-grid,.mm-nn-grid{grid-template-columns:1fr}
  .mm-ficha-palco{max-width:330px}
  .mm-ficha-foto{max-width:min(72vw,320px);margin-inline:auto}
  .mm-nn-fig{max-width:min(66vw,260px);margin:0 auto}
  .mm-duas{grid-template-columns:1fr}
  .mm-duas>div{padding:14px 0}
  .mm-duas>div:first-child{border-right:0;border-bottom:1.5px solid rgba(43,33,26,.26);padding-bottom:22px}
  .mm-duas>div:last-child{padding-top:22px}
  .mm-sol-trilha{gap:12px}
  .mm-sol-ano{font-size:19px}
  .mm-sol-leg{font-size:12px}
}
@media (max-width:560px){
  .mm-pag-acoes{flex-direction:column;align-items:stretch}
  .mm-pag-acoes .mm-botao{width:100%}
  .mm-pag-acoes .mm-prova-nota{text-align:center}
  .mm-ficha-ponto{font-size:10px;gap:7px}
}
