/* ===== Mobile (≤800px): sistema único, carregado por último =====
   Grade: todo o conteúdo fica a 24px da borda da tela.
   Painéis: margem 8px + padding 16px (conteúdo também a 24px). Fora de painel: margem 24px.
   Ritmo: seção 56px · título→texto 14px · texto→conteúdo 28px · entre cartões 16px.
   Tipografia: h1 42 · h2 32 · h3 22 (destaque 26) · parágrafo 16 · introdução 18. */
@media(max-width:800px){
  :root{--g:24px;--pm:8px;--pp:16px;--sec:56px;--r-panel:28px;--r-card:24px;--r-photo:18px;--gap-title:14px;--gap-block:28px;--gap-card:16px}

  /* Tipografia */
  body main h1{font-size:42px!important;line-height:1.08!important}
  body main h2{font-size:32px!important;line-height:1.12!important;margin:0!important}
  body main h3{font-size:22px!important;line-height:1.2!important}
  .journey-story h3,.body-copy h3,.team-body h3,.team-heading h3,.protocol-grid>article:first-child h3,.signature strong{font-size:26px!important}
  body :is(main,footer) p{font-size:16px!important;line-height:1.65!important}
  .hero-copy>p,.split-heading>p,.center-heading>p,.concern-intro p,.quick-tab p,.team-heading>p,.faq-grid>div:first-child>p,.about-copy .lead,.contact-invitation p,.journey-story>p,.body-copy p,.experience-intro p{font-size:18px!important;line-height:1.6!important}

  /* Grade e painéis */
  .wrap{width:calc(100% - (var(--g) * 2))!important;max-width:none!important;margin-inline:auto!important;padding-inline:0!important}
  .section{padding-block:var(--sec)!important}
  #queixas,#como-funciona,#corporais,#sobre,#faq,#espaco,.quick,.hero.wrap{margin:var(--pm)!important;padding:40px var(--pp)!important;border-radius:var(--r-panel)!important;width:auto!important}
  #queixas>.wrap,#como-funciona>.wrap,#corporais>.wrap,#sobre>.wrap,#faq>.wrap,#espaco>.wrap{width:100%!important;margin:0!important}
  [data-cut]{margin-inline:var(--pm)}
  [data-cut]>.cut-tab{position:static!important;padding:0!important}

  /* Blocos de título de seção */
  .split-heading,.center-heading,.team-heading{display:block!important;text-align:left!important;margin:0 0 var(--gap-block)!important;padding:0!important;border:0!important}
  .split-heading>p,.center-heading>p,.team-heading>p{margin:var(--gap-title) 0 0!important;max-width:none!important;text-align:left!important}

  /* Botões */
  body .button,body .text-link{min-height:52px;font-size:14px!important}

  /* Cartões e fotos: regra única */
  .treatment-card,.body-feature,.team-card,.protocol-grid>article,.experience-card,.quote-stack>article,.concern-list>button{border-radius:var(--r-card)!important;padding:14px!important}
  .treatment-media,.body-media,.team-media,.protocol-photo,.concern-photo,.video-media,.space-gallery .media,.quick-tile,.experience-photo{border-radius:var(--r-photo)!important}

  /* Carrosséis: sangram até a borda do painel ou da tela e alinham o primeiro item ao texto */
  [data-rail],.facial-grid{margin-inline:calc(var(--bleed,24px) * -1)!important;padding-inline:var(--bleed,24px)!important;scroll-padding-inline:var(--bleed,24px);gap:var(--gap-card)!important}
  [data-rail]>*{flex:0 0 82%!important}
  .quick-tiles[data-rail],.concern-list[data-rail],.space-gallery[data-rail],.commitments[data-rail]{--bleed:16px}
  .experience-cards[data-rail],.quote-stack[data-rail],.facial-grid{--bleed:24px}
  .rail-dots{margin-top:20px!important}

  /* HERO */
  .hero.wrap{padding:28px var(--pp) var(--pp)!important;gap:24px!important;margin-top:12px!important}
  .hero.wrap .hero-copy{padding:0!important}
  .hero h1{margin:0 0 var(--gap-title)!important}
  .hero-copy>p{margin:0!important}
  .hero-tab{padding:0!important;gap:12px!important}
  .hero-tab .actions{width:100%!important;flex-direction:column!important;gap:12px!important}
  .hero-tab .actions>*{width:100%!important}
  .hero.wrap .hero-composition{aspect-ratio:4/4.4!important;border-radius:20px!important}

  /* POR ONDE COMEÇAR */
  .quick{padding:36px var(--pp) var(--pp)!important}
  .quick>.quick-tab{padding:0 0 var(--gap-block)!important}
  .quick-tab p{margin:var(--gap-title) 0 0!important}
  .quick-tile{aspect-ratio:4/4.2!important}

  /* EXPERIÊNCIA */
  .experience-composition{display:flex!important;flex-direction:column;gap:var(--gap-block)!important}
  .experience-visual{position:relative}
  .experience-photo{aspect-ratio:1/1.1!important;height:auto!important;border-radius:var(--r-card)!important}
  .experience-caption{position:relative!important;inset:auto!important;width:auto!important;margin:-48px 12px 0!important;padding:20px!important;transform:none!important}
  .experience-content{display:flex;flex-direction:column;gap:var(--gap-block)}
  .experience-intro p{margin:var(--gap-title) 0 20px!important}
  .experience-card{padding:24px!important}

  /* QUEIXAS */
  #queixas{display:flex;flex-direction:column}
  #queixas>.wrap.concern-layout,#queixas .concern-browser{display:contents}
  #queixas .concern-intro{order:1;margin:0 0 var(--gap-block)!important;display:block!important}
  #queixas .concern-intro p{margin:var(--gap-title) 0 0!important}
  #queixas .concern-intro .section-footnote{display:block;margin:12px 0 0!important}
  #queixas>.cut-tab{order:2;margin:0 0 20px!important}
  #queixas .concerns-tab .segmented{width:100%!important;min-width:0!important}
  #queixas .concern-list{order:3}
  #queixas .concern-list+.rail-dots{order:4}
  #queixas .concern-bottom{order:5;margin-top:var(--gap-block)!important}
  #queixas #filter-status{order:6}

  /* COMO FUNCIONA */
  #como-funciona .split-heading{margin-bottom:var(--gap-block)!important}
  .journey-tab{display:none!important}
  .journey-widget{gap:var(--gap-card)!important}
  .journey-tabs{grid-template-columns:1fr 1fr!important;gap:10px!important}
  .journey-tabs button{min-height:56px!important;padding:12px!important;font-size:14px!important}
  .journey-stage{grid-template-columns:1fr!important;gap:0!important;padding:12px!important;border-radius:var(--r-card)!important}
  .journey-stage .journey-photo{aspect-ratio:4/3.2!important;min-height:0!important;height:auto!important;border-radius:var(--r-photo)!important}
  .journey-story{padding:22px 10px 12px!important;max-width:none!important}
  .journey-story>p{margin:var(--gap-title) 0 0!important}
  .journey-story .journey-note{margin:16px 0 22px!important}

  /* FAIXA DA MARCA */
  .band{margin:var(--pm)!important}
  .band .band-media{height:320px!important;border-radius:var(--r-panel)!important}
  .band-tab{padding:26px 16px 32px!important;margin:0!important}

  /* TRATAMENTOS FACIAIS */
  .facial-grid>.treatment-card{flex:0 0 82%!important}
  .treatment-media{aspect-ratio:4/4.4!important;height:auto!important;margin:0 0 18px!important}
  .treatment-card h3,.treatment-card p{padding-inline:6px!important}
  .treatment-facts{padding:16px 6px 0!important}

  /* CORPORAIS */
  .body-feature{display:block!important;margin:0 0 var(--gap-card)!important}
  .body-feature .body-media{aspect-ratio:4/3.4!important;height:auto!important;min-height:0!important;margin:0 0 20px!important}
  .body-copy{padding:0 8px 8px!important}
  .body-copy p{margin:var(--gap-title) 0 22px!important;max-width:none!important}

  /* PROTOCOLOS */
  .protocol-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:var(--gap-card)!important}
  .protocol-grid>article{min-width:0}
  .protocol-grid>article .protocol-photo,.protocol-grid>article:first-child .protocol-photo,.protocol-grid>article:not(:first-child) .protocol-photo{aspect-ratio:4/3!important;min-height:0!important;height:auto!important;width:100%!important}
  .protocol-grid>article .protocol-editorial-copy,.protocol-grid>article:first-child .protocol-editorial-copy{padding:22px 8px 10px!important}

  /* SOBRE E EQUIPE */
  .about-grid{display:flex!important;flex-direction:column;gap:var(--gap-block)!important}
  .about-portrait .portrait-media{aspect-ratio:1/1.06!important;border-radius:var(--r-card)!important}
  .about-portrait .portrait-caption{padding:14px 4px 0!important}
  .about-copy h2{margin-bottom:var(--gap-title)!important}
  .team-heading{margin:var(--sec) 0 var(--gap-block)!important}
  .team-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:var(--gap-card)!important}
  .team-grid>.team-card{display:block!important}
  .team-grid>.team-card .team-media{aspect-ratio:1/1!important;margin:0 0 20px!important}
  .team-body{padding:0 8px 8px!important;max-width:none!important}

  /* ESPAÇO E COMPROMISSOS */
  .space-gallery[data-rail]>*,.space-gallery[data-rail] .media{flex:0 0 82%!important}
  .commitments{margin-top:var(--gap-block)!important}
  .commitments[data-rail]>div{flex:0 0 74%!important}

  /* DEPOIMENTOS */
  .testimonial-grid{display:flex!important;flex-direction:column;gap:var(--gap-card)!important}
  .testimonial-grid .video-media{aspect-ratio:4/3.4!important;min-height:0!important;height:auto!important;border-radius:var(--r-card)!important}
  .quote-stack[data-rail]>article{padding:24px!important}

  /* FAQ */
  .faq-grid{display:flex!important;flex-direction:column;gap:var(--gap-block)!important}
  .faq-list summary{padding-block:22px!important;font-size:18px!important}

  /* CONTATO */
  .contact-invitation{padding:32px 24px!important;border-radius:var(--r-panel)!important}
  .contact-invitation .button,.contact-invitation .contact-tab{width:100%}
  .contact-grid{display:flex!important;flex-direction:column;gap:var(--gap-block)!important;margin-top:var(--gap-block)!important}
  .contact-grid .map-media{aspect-ratio:4/3.2!important;min-height:0!important;height:auto!important;border-radius:var(--r-card)!important}

  /* RODAPÉ */

  /* Carrosséis alinhados ao início (nada centralizado, nada cortado à esquerda) */
  [data-rail]{justify-content:flex-start!important;align-content:flex-start!important;align-items:stretch!important}

  /* Nenhum texto pequeno: rótulos e dados curtos a partir de 14px, textos de leitura a partir de 16px */
  body main :is(small,dt,.section-footnote,.photo-caption,.story-note,.quote-person,.tile-pill,.team-role,.chips span,.badge){font-size:14px!important;line-height:1.45!important}
  body main :is(dd,li,.treatment-facts dd,.team-facts dd){font-size:16px!important;line-height:1.5!important}
  body main dt{font-size:14px!important;letter-spacing:.08em}
  .concern-list small{font-size:16px!important}
  .contact-details dl>div{display:block!important;padding:18px 0!important}
  .contact-details dt{margin:0 0 6px!important}
  .contact-details dd{margin:0!important}

  /* Molduras de foto: nunca mais largas que o contêiner (min-height antigo × aspect-ratio) */
  .media{min-height:0!important;max-width:100%!important}
  .contact-invitation[data-cut]{margin-inline:0!important}

  /* Painéis: padding inferior igual ao das laterais */
  #queixas,#como-funciona,#corporais,#sobre,#faq,#espaco,.quick,.hero.wrap{padding-bottom:var(--pp)!important}
  .journey-story .journey-action{width:100%}

  /* Faixa da marca: não aparece no celular */
  .band{display:none!important}

  /* Cabeçalho (também tem .wrap): largura total da pílula e padding próprio */
  .site-header{padding:16px var(--pm) 0!important}
  .site-header .header-inner{width:100%!important;max-width:none!important;margin:0!important;height:76px!important;padding:0 14px 0 24px!important;box-sizing:border-box}

  /* Títulos de bloco com o mesmo tamanho dos títulos de seção */
  body main .team-heading h3,body main .contact-details h3{font-size:32px!important;line-height:1.12!important;margin:0 0 var(--gap-title)!important}

  /* Todas as fotos: mesma proporção (quadrada) e largura total do cartão */
  .hero.wrap .hero-composition,.quick-tile,.experience-photo,.treatment-media,.body-media,.protocol-photo,.journey-photo,.about-portrait .portrait-media,.team-media,.video-media,.space-gallery .media,
  body #concern-list>button>.concern-photo,body #concern-list[data-active-category]>button>.concern-photo,body #concern-list[data-active-category]>button:first-child>.concern-photo{aspect-ratio:1/1!important;width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;flex:none!important}
  body #concern-list>button>.concern-photo{display:block;position:relative}
  .hero.wrap .hero-composition{aspect-ratio:1/1!important}
  .protocol-grid>article .protocol-photo,.protocol-grid>article:first-child .protocol-photo,.protocol-grid>article:not(:first-child) .protocol-photo,.journey-stage .journey-photo,.testimonial-grid .video-media,.body-feature .body-media,.team-grid>.team-card .team-media,.treatment-media,.experience-photo,.about-portrait .portrait-media{aspect-ratio:1/1!important}
  .space-gallery[data-rail] .media{aspect-ratio:1/1!important;height:auto!important}
  body .segmented button,body .segmented button.selected{font-size:15px!important}

  .quick-tiles[data-rail]>*,.space-gallery[data-rail]>*,.space-gallery[data-rail] .media{flex:0 0 82%!important}

  /* Equipe: painel próprio no celular */
  #equipe{margin:var(--pm)!important;padding:40px var(--pp) var(--pp)!important;border-radius:var(--r-panel)!important;background:var(--panel)}
  #equipe>.wrap{width:100%!important;margin:0!important}
  #equipe .team-heading{margin:0 0 var(--gap-block)!important}
  #sobre{padding-bottom:var(--pp)!important}

  /* Painel que abre com foto: topo igual às laterais */
  #sobre{padding-top:var(--pp)!important}

  /* Experiência: foto em largura total da tela, sem raio no topo */
  #experiencia{padding-top:0!important}


  #experiencia .experience-visual{margin:0 calc(var(--g) * -1)!important;width:auto!important;max-width:none!important}
  #experiencia .experience-visual .experience-photo{width:100%!important;max-width:100%!important;margin:0!important;border-radius:0 0 var(--r-card) var(--r-card)!important}
  #experiencia .experience-caption{margin:-56px var(--g) 0!important}

  /* "Por onde começar?": faixa em largura total, sem raio */
  .quick{margin:0!important;border-radius:0!important;padding:40px var(--g) 32px!important}
  .quick[data-rail],.quick .quick-tiles[data-rail]{--bleed:24px}
  .quick::before,.quick::after{border-radius:0!important}

  /* Experiência: foto até as bordas, sem sobra à direita e sem vão exagerado abaixo do cartão */
  #experiencia .experience-visual{padding:0!important;min-height:0!important;margin-top:0!important}
  #experiencia .experience-composition{gap:40px!important}
  #experiencia{padding-bottom:var(--sec)!important}
}