/* Plenivida v7 — estrutura de layout.
   Uma grade única para os 13 slides: cortes iguais, margens iguais, ordem de leitura fixa.
   Hierarquia em todos: etiqueta > título > resumo > lista > nota.
   Carregado por último: só organiza posição e espaço, não muda texto, cor nem foto. */

:root{--px:clamp(40px,4.6vw,88px)}

/* Atalho de teclado: escondido de verdade até receber foco. */
.skip-link{top:12px;left:12px;transform:translateY(calc(-100% - 40px));transition:transform .2s}
.skip-link:focus{top:12px;transform:none}

/* ============ DESKTOP (1001px ou mais) ============ */
@media(min-width:1001px){

  /* Cada slide: ocupa a tela, margem de cima e de baixo iguais, nada colado na barra de navegação. */
  .canvas{width:100%;min-height:100svh;border-radius:0;border:0;box-shadow:none;
    padding:152px var(--px) 144px;column-gap:6vw}
  .canvas.split-page,.canvas.structure,.canvas.team-health,.canvas.team-safety{padding-inline:0;column-gap:0}

  /* Corte único: metade texto, metade foto. */
  .canvas .right-photo,.canvas .photo-mosaic{left:50%;right:0}
  .canvas .left-photo{left:0;right:50%}
  .canvas .solid-half,.canvas .dark-half{inset:0 50% 0 0}

  /* Equipes têm listas longas: texto 60%, foto 40%. */
  .team-health{grid-template-columns:50% 50%}
  .team-health .team-photo{inset:0 0 0 50%}
  .team-safety{grid-template-columns:50% 50%}
  .team-safety .team-photo{inset:0 50% 0 0}

  /* Coluna de texto: mesmo recuo em todos os slides, começa sempre na mesma altura. */
  .canvas.split-page,.canvas.structure,.canvas.team-health,.canvas.team-safety{align-content:start}
  .canvas .left-copy,.canvas .structure-copy,.canvas .team-copy,.canvas .right-sheet{
    padding-inline:var(--px);padding-block:0;left:auto}
  .canvas .right-sheet{grid-column:2}
  .canvas .left-copy,.canvas .structure-copy{grid-column:1}
  .team-health .team-copy{grid-column:1}
  .team-safety .team-copy{grid-column:2}

  /* Leitura: linhas de no máximo ~62 caracteres. */
  .canvas .content>p:not(.kicker):not(.sheet-label):not(.fine-print):not(.certificate){max-width:62ch}

  /* Segurança: o painel de vidro fica no pé da foto, alinhado com o fim da lista. */
  .safety-title{align-self:end;margin:0 var(--px)}
  .safety .right-sheet{grid-row:1}

  /* Faixa "in loco": alinhada às mesmas margens, abaixo das duas colunas. */
  .health .inloco{margin:48px var(--px) 0}

  /* Painéis de vidro sobre fotos: mesma distância das bordas e da barra de baixo. */
  .intro-glass,.management-glass,.check-glass,.mosaic-glass,.team-health .team-glass{right:var(--px);bottom:136px}
  .training-glass,.team-safety .team-glass{left:var(--px);right:auto;bottom:136px}
  .intro-glass,.check-glass,.mosaic-glass{max-width:calc(50% - var(--px) * 2)}
  .management-glass{width:auto;max-width:calc(50% - var(--px) * 2)}
  .training-glass{width:auto;max-width:calc(50% - var(--px) * 2)}
  .team-health .team-glass{width:auto;max-width:calc(50% - var(--px))}
  .team-safety .team-glass{width:auto;max-width:calc(50% - var(--px))}

  /* Logo, menu e barra de baixo na mesma margem do texto. */
  .page-header{inset:clamp(24px,3.5svh,46px) var(--px) auto}
  .viewer-top{right:var(--px)}
  .viewer-bottom{padding-inline:var(--px)}

  /* Cada slide para no topo ao rolar (suave, só perto do início). */
  html{scroll-snap-type:y proximity}
  .chapter{scroll-snap-align:start}

  /* Exames: título em largura total; resumo e lista alinhados na mesma coluna. */
  .exams .page-heading{display:grid;grid-template-columns:.85fr 1.15fr;gap:20px 48px;margin-bottom:56px;align-items:start}
  .exams .page-heading .kicker,.exams .page-heading h2{grid-column:1/-1}
  .exams .page-heading>p:last-child{grid-column:1/-1;margin:0!important}
  .exam-layout{grid-template-columns:.85fr 1.15fr;gap:48px;align-items:start}
  .exam-photo{min-height:620px;height:100%}

  /* Capa, soluções e contato: foto cobre tudo, texto na mesma margem. */
  .cover{padding-top:max(260px,30svh)}
  .overview{padding-top:152px}
  .contact{padding-inline:var(--px)}
}

/* ============ TABLET E CELULAR (até 1000px) ============ */
@media(max-width:1000px){
  /* Em telas médias o texto fica numa coluna de leitura (até 720px), alinhada com o logo. */
  :root{--g:max(22px,calc((100vw - 720px) / 2))}

  .page-header{padding-inline:var(--g)}
  .page-footer{padding-inline:var(--g)}
  .content,.right-sheet{padding-left:var(--g)!important;padding-right:var(--g)!important}
  .safety-title,.inloco,.contact-panel{margin-left:var(--g);margin-right:var(--g)}
  .service-panels,.exam-layout{padding-left:var(--g);padding-right:var(--g)}
  .cover-copy{margin-left:var(--g);margin-right:var(--g)}
  .intro-glass,.management-glass,.training-glass,.check-glass,.mosaic-glass,.team-glass{
    left:var(--g)!important;right:var(--g)!important;width:auto!important;max-width:none!important}

  /* Fotos em faixa larga: altura proporcional, sem ficar gigante nem achatada. */
  .canvas .right-photo,.canvas .left-photo,.canvas .team-photo,.canvas .exam-photo{
    height:clamp(320px,52vw,520px)}
  .management .right-photo{height:clamp(360px,56vw,560px)}

  /* Sem faixa vazia no fim de cada slide: o contador já está na barra fixa. */
  .canvas{padding-bottom:32px!important}
  .page-footer{display:none}
  .chapter:last-child .canvas{padding-bottom:96px!important}

  /* Linhas de leitura confortáveis em telas médias. */
  .canvas .content>p{max-width:none}
}

/* ============ TELA MÉDIA (701px a 1000px): listas em 2 colunas, galeria 2x2 ============ */
@media(min-width:701px) and (max-width:1000px){
  .people-grid,.team-safety .people-grid{grid-template-columns:1fr 1fr;gap:0 32px}
  .exam-grid,.two-list,.compact-points{grid-template-columns:1fr 1fr;gap:0 28px}
  .structure .facility-gallery{grid-template-columns:1fr 1fr;grid-template-rows:repeat(2,clamp(260px,36vw,360px))}
}

/* ============ CELULAR (até 700px): galeria menos comprida ============ */
@media(max-width:700px){
  .structure .facility-gallery{grid-template-rows:repeat(4,340px)}
}

/* ============ TÍTULOS EM DESTAQUE ============
   Título grande e firme, o resto discreto. Mesma lógica em todos os slides. */
.card-foot{justify-content:flex-end}
.exams-highlight{margin-top:0}

@media(min-width:1001px){
  .canvas h2{font-size:clamp(48px,4.7vw,80px)!important;line-height:1.04!important;letter-spacing:-.035em!important}
  .canvas .overview-heading h2,.canvas .page-heading h2,.canvas.contact h2{font-size:clamp(52px,5.4vw,92px)!important}
  .canvas .safety-title h2{font-size:clamp(36px,3.6vw,60px)!important}
  .canvas.team-health .team-copy h2{font-size:clamp(44px,4.2vw,70px)!important}
  .canvas.team-safety .team-copy h2{font-size:clamp(32px,3vw,50px)!important;line-height:1.14!important;letter-spacing:-.025em!important}
  .canvas h1{font-size:clamp(60px,7.2vw,120px)!important;line-height:1!important;letter-spacing:-.04em!important}
  .canvas h1 em{display:block;font-size:.5em!important;line-height:1.12;margin-top:.25em}
  .cover-copy{width:auto;max-width:72%;padding:40px 48px}
  /* Títulos e destaques afastados do resto do texto */
  .canvas .kicker{margin-bottom:26px}
  .canvas .left-copy h2,.canvas .structure-copy h2,.canvas .team-copy h2,.canvas .right-sheet h2{margin-bottom:12px}
}
@media(max-width:1000px){
  .canvas h2{font-size:clamp(38px,10.4vw,60px)!important;line-height:1.06!important;letter-spacing:-.03em!important}
  .canvas .safety-title h2{font-size:clamp(34px,9.2vw,52px)!important}
  .canvas.team-safety .team-copy h2{font-size:clamp(28px,7.6vw,42px)!important;line-height:1.16!important}
  .canvas.contact h2{font-size:clamp(44px,12vw,68px)!important}
  .canvas h1{font-size:clamp(48px,14vw,80px)!important;line-height:1!important;letter-spacing:-.04em!important}
  .canvas h1 em{display:block;font-size:.5em!important;line-height:1.12;margin-top:.25em}
}

/* Título em duas linhas de leitura: frase principal em cima, frase em itálico embaixo. */
.canvas h2 em{display:block;margin-top:.08em}

/* CAPA: título em uma linha, vidro mais leve */
.cover-copy h1 .h1-line{display:block;white-space:nowrap}
.cover-copy{width:fit-content!important;max-width:calc(100% - 2 * var(--g, 18px));background:linear-gradient(115deg,#fffaff8c,#f8f0fc4d)!important;-webkit-backdrop-filter:blur(8px)!important;backdrop-filter:blur(8px)!important;box-shadow:none!important}
@media(min-width:1001px){
  .cover-copy{max-width:none;padding:28px 40px!important}
  .cover-copy h1{font-size:clamp(44px,5.2vw,86px)!important}
  .cover-copy h1 em{font-size:.52em!important;margin-top:.12em}
}
@media(max-width:1000px){
  .cover-copy{padding:20px 22px!important}
  .cover-copy h1{font-size:clamp(24px,7.2vw,60px)!important;letter-spacing:-.03em!important}
  .cover-copy h1 em{font-size:.62em!important;margin-top:8px}
}

/* PLENI CHECK: mosaico 2x2 com as 4 fotos */
.checkup .facility-gallery{grid-template-rows:1fr 1fr;gap:4px}
@media(max-width:1000px){
  .checkup .facility-gallery{order:3;grid-template-columns:1fr 1fr;grid-template-rows:repeat(2,clamp(280px,52vw,460px));gap:4px}
}
@media(max-width:700px){
  .checkup .facility-gallery{grid-template-rows:repeat(2,300px)}
}

/* CAPA no celular/tablet: foto em faixa no topo (rosto inteiro) que se dissolve num fundo roxo; título na transição */
@media(max-width:1000px){
  .canvas.cover{background:#2a1735}
  .cover .full-photo{inset:0 0 auto 0;height:max(420px,68svh)}
  .cover .full-photo img{height:100%!important;top:0!important;animation:none!important;transform:none!important;object-position:70% 50%!important}
  .cover .photo-wash{inset:0 0 auto 0;height:max(420px,68svh);background:linear-gradient(180deg,#2a173540 0,transparent 25%,transparent 55%,#2a1735 100%)}
  .cover-copy{margin-top:calc(max(420px,68svh) - 96px)!important;margin-bottom:96px!important}
}
@media(min-width:701px) and (max-width:1000px){
  .cover .full-photo,.cover .photo-wash{height:max(520px,62svh)}
  .cover .full-photo img{object-position:90% 50%!important}
  .cover-copy{margin-top:calc(max(520px,62svh) - 96px)!important}
}

/* FOTOS INTEIRAS no celular/tablet: a moldura segue a proporção da foto (sem cortar rosto) */
@media(max-width:1000px){
  .fit-photo img{height:100%!important;top:0!important;animation:none!important;transform:none!important}
  /* Segurança: panorama na horizontal, abaixo de uma faixa roxa com a logo */
  .safety .left-photo{height:calc(56.25vw + 91px)!important;background:#2a1735;margin-top:-91px}
  .safety .left-photo img{top:91px!important;height:calc(100% - 91px)!important}
  .safety .safety-title{margin-top:22px!important}
  /* Capacitação: foto vertical inteira */
  .training .left-photo.fit-training{height:min(125vw,820px)!important}
  /* Equipe de saúde: recepção inteira */
  .team-health .team-photo.fit-team{height:min(112vw,760px)!important}
  /* A citação fica abaixo da foto, sem cobrir o rosto */
  .team-health .team-glass{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;top:auto!important;margin:20px var(--g) 8px!important}
}

/* EQUIPE DE SAÚDE: foto inteira fixa na metade direita + citação em box flutuante de vidro */
.team-side,.team-sticky{display:contents}
@media(min-width:1001px){
  .team-side{display:block;position:absolute;inset:0 0 0 50%;z-index:1;background:#efe4f5}
  .team-sticky{display:block;position:sticky;top:0;height:100svh;max-height:100%;overflow:clip}
  .team-sticky .team-photo{position:absolute!important;inset:0!important;height:100%!important}
  .team-sticky .team-photo img{height:100%!important;top:0!important;animation:none!important;transform:none!important;object-position:30% 35%!important}
  .team-sticky .team-glass{position:absolute!important;left:var(--px)!important;right:var(--px)!important;bottom:104px!important;top:auto!important;width:auto!important;max-width:none!important;margin:0!important;padding:24px 28px!important;transform:none!important}
}

/* SEGURANÇA no desktop: foto panorâmica inteira na horizontal; título logo abaixo (sem vidro por cima) */
@media(min-width:1001px){
  .safety .left-photo{position:relative!important;inset:auto!important;grid-column:1;grid-row:1;align-self:start;width:auto!important;height:auto!important;aspect-ratio:1376/768;margin:0 var(--px) 0 0}
  .safety .left-photo img{height:100%!important;top:0!important;animation:none!important;transform:none!important}
  .safety .safety-title{position:relative!important;inset:auto!important;transform:none!important;grid-column:1;grid-row:2;align-self:start;width:auto!important;margin:40px var(--px) 0!important;padding:0!important;background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
  .safety .safety-title:before{display:none}
  .safety .right-sheet{grid-column:2;grid-row:1 / span 2}
  .safety .page-brand img{filter:none!important}
}
@media(min-width:1001px){
  .canvas .safety-title h2{font-size:clamp(30px,2.9vw,48px)!important;line-height:1.12!important}
  .safety .safety-title>p:last-child{margin-top:18px}
}

/* Slide 2: foto da recepção (retrato) — logo inteira no mobile/tablet */
@media(max-width:1000px){.intro .right-photo.fit-reception img{object-position:50% 28%!important}}

/* Slide 12: foto retrato do profissional de capacete — sem zoom do parallax */
.team-safety .team-photo.fit-tech img{height:100%!important;top:0!important;animation:none!important;transform:none!important;object-position:50% 45%!important}
@media(max-width:1000px){.team-safety .team-photo.fit-tech{height:min(125vw,820px)!important}}

/* Slide 10: mosaico de espaços da clínica (7 fotos) */
.structure .facility-gallery.space-mosaic{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(8,1fr);gap:4px;
  grid-template-areas:"R R A" "R R A" "E C A" "E C K" "D C K" "D C K" "W M H" "W M H"}
.space-mosaic .sp-r{grid-area:R}.space-mosaic .sp-a{grid-area:A}.space-mosaic .sp-e{grid-area:E}
.space-mosaic .sp-c{grid-area:C}.space-mosaic .sp-k{grid-area:K}.space-mosaic .sp-d{grid-area:D}.space-mosaic .sp-h{grid-area:H}.space-mosaic .sp-w{grid-area:W}.space-mosaic .sp-m{grid-area:M}
.space-mosaic .image-field img{height:100%!important;top:0!important;animation:none!important;transform:none!important}
.space-mosaic .facility-photo figcaption{padding:34px 12px 10px;font-size:13px;line-height:1.3}
@media(max-width:1000px){
  .structure .facility-gallery.space-mosaic{order:3;width:100%;height:auto;aspect-ratio:720/1000}}
@media(max-width:700px){
  .structure .facility-gallery.space-mosaic{aspect-ratio:auto;height:auto;grid-template-columns:1fr 1fr;grid-template-rows:210px 300px 300px 230px 210px 300px;
    grid-template-areas:"R R" "A E" "K C" "D D" "W W" "M H"}}

/* Slide 8: dupla de fotos de treinamento (pedido da Gabi) */
.duo-photo{display:grid;grid-template-columns:1.2fr 1fr;gap:4px;background:#faf6fb;overflow:clip}
.duo-photo .image-field{position:relative!important;inset:auto!important;height:100%;min-height:0;overflow:clip}
.duo-photo .image-field img{height:100%!important;top:0!important;animation:none!important;transform:none!important}
@media(max-width:1000px){.training .left-photo.duo-photo{position:relative;inset:auto;height:min(112vw,780px)!important}}
@media(min-width:1001px){.canvas .left-photo.duo-photo{position:absolute}}
.duo-photo:after{content:"";position:absolute;inset:0 0 auto 0;height:30%;background:linear-gradient(180deg,#2a1735a6,#2a173500);pointer-events:none;z-index:2}
@media(max-width:1000px){.duo-photo:after{height:26%}}

/* Slide 9: trio Pleni Check (pressão, bioimpedância, glicemia) */
.checkup .facility-gallery.check-trio{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;grid-template-areas:"P N" "G B"}
.check-trio .ck-p{grid-area:P}.check-trio .ck-b{grid-area:B}.check-trio .ck-g{grid-area:G}.check-trio .ck-n{grid-area:N}
.check-trio .image-field img{height:100%!important;top:0!important;animation:none!important;transform:none!important}
@media(max-width:1000px){.checkup .facility-gallery.check-trio{grid-template-rows:repeat(2,clamp(280px,52vw,460px))}}
@media(max-width:700px){.checkup .facility-gallery.check-trio{grid-template-rows:repeat(2,300px)}}
.check-trio .ck-g img{object-position:45% 10%!important}
.check-trio .ck-b img{object-position:50% 6%!important}

/* Slide 13: fachada mais aberta (imagem inteira no mobile/tablet; sem a porta em destaque no desktop) */
@media(max-width:1000px){
  .contact .full-photo,.contact-wash{height:calc(100vw*9/16 + 76px)!important;min-height:0!important}
  .contact .full-photo img{width:100%!important;height:calc(100vw*9/16)!important;top:auto!important;bottom:0!important;animation:none!important;transform:none!important;object-position:50% 50%!important}
  .contact-wash{background:linear-gradient(180deg,#241a2b 0,#241a2b 24%,#241a2b00 52%),linear-gradient(0deg,#241a2b,transparent 26%)!important}
  .contact .contact-copy{margin-top:calc(100vw*9/16 + 76px - 125px)!important}
}
@media(min-width:1001px){
  .contact .full-photo img{height:100%!important;top:0!important;animation:none!important;transform:none!important;object-position:50% 12%!important}
}

/* ============ Contato (último slide): barrinha discreta de empresas e credenciadoras ============ */
.trust-bar{background:#e9dcef;border-radius:12px;padding:20px 26px 10px;color:#4e245b}
.trust-bar .trust-title{margin:0 0 14px;font-size:clamp(18px,1.6vw,23px);line-height:1.35;letter-spacing:-.01em;color:#35283e}
.trust-bar .trust-title em{display:inline;margin:0;font-size:1.06em;color:#7f388d}
.trust-bar .trust-line{display:grid;grid-template-columns:132px minmax(0,1fr);align-items:center;gap:6px 16px;padding:10px 0;border-top:1px solid #4e245b1f}
.trust-bar .trust-label{font-size:12px;line-height:1.3;letter-spacing:.14em;text-transform:uppercase;color:#7f388d}
.trust-bar ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px}
.trust-bar li{width:92px;height:36px;display:flex;align-items:center;justify-content:center;margin:0}
.trust-bar li.wide{width:120px}
.trust-bar li.sq{width:44px}
.trust-bar li img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;mix-blend-mode:multiply}
.trust-bar li.chip{background:#2a1735;border-radius:6px;padding:4px 8px;width:100px}
.trust-bar li.chip img,.trust-bar li.sq img[src*="tmf"]{mix-blend-mode:normal}
.trust-bar li.sq img[src*="tmf"],.trust-bar li.sq img[src*="ami"],.trust-bar li.sq img[src*="chiquinho"]{border-radius:4px}
@media(min-width:1001px){
  .trust-bar{grid-column:1/-1;margin-top:clamp(36px,5svh,64px)}
}
@media(max-width:1000px){
  .trust-bar{margin:10px var(--g) 30px;padding:18px 18px 8px}
  .trust-bar .trust-line{grid-template-columns:1fr}
  .trust-bar ul{gap:12px 22px}
  .trust-bar li{width:88px}
  .trust-bar li.wide{width:118px}
  .trust-bar li.sq{width:36px}
  .trust-bar li.chip{width:96px}
}
.trust-bar li.mid{width:84px}
@media(max-width:1000px){.trust-bar li.mid{width:84px}}
@media(max-width:1000px){.trust-bar .trust-title{font-size:19px;margin-bottom:12px}}