/* v16 · vídeos da Naila de 09/11, 15h: pílulas no celular, conteúdos (Bloco 6) e planos (Bloco 7) */

/* Bloco 5 · no celular as pílulas ficam pequenas, duas por linha, num bloco compacto */
@media (max-width:599px){
  .cr-map .cr-pilulas{gap:7px}
  .cr-map .cr-pilulas li{padding:6px 10px;font-size:12px;letter-spacing:-.01em}
  .cr-map .cr-map__cartao{padding:38px 26px}  /* v20: era 30px 16px */
}

/* Bloco 6 · subtítulo numa linha só no computador; a frase de cada capa em evidência */
@media (min-width:900px){.cr-cont__cab p{max-width:none;white-space:nowrap}}
.cr-thumb__cartaz .cr-poster__linha{font-size:max(12px,7.4cqw);font-weight:700;line-height:1.18;color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.35)}

/* Bloco 7 · como na página da Sofia: "Faça parte", título e "Nos dois planos..." empilhados; nada na lateral */
.cr-ofe__faca{margin:0;font-weight:800;font-size:13px;letter-spacing:.2em;color:#CDB5E6}
.cr-ofe .cr-ofe__cab{grid-template-columns:minmax(0,1fr);gap:14px;align-items:start}
.cr-ofe .cr-ofe__lead{padding-top:0;border-top:0;margin-top:4px}

/* Bloco 7 · os dois cartões com a mesma largura e as mesmas linhas: preço, condição, lista e botão alinhados */
@media (min-width:860px){
  .cr-ofe .cr-ofe__planos{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:repeat(6,auto);row-gap:0;column-gap:20px}
  .cr-ofe .cr-plano{display:grid;grid-row:span 6;grid-template-rows:subgrid;row-gap:10px;align-content:start}
  .cr-ofe .cr-plano__lista{margin:14px 0 0}
  .cr-ofe .cr-plano .cr-bt{align-self:end}
  .cr-ofe .cr-plano__selo{justify-self:start}
}
.cr-plano__vista--vazio{display:block;min-height:1px}

/* Bloco 7 · no celular os cartões ficam bem menores */
@media (max-width:599px){
  .cr-ofe .cr-plano{padding:22px 20px;gap:6px;border-radius:22px}
  .cr-ofe .cr-plano__valor{font-size:52px}
  .cr-ofe .cr-plano__rs{font-size:18px}
  .cr-ofe .cr-plano__x{font-size:16px}
  .cr-ofe .cr-plano__preco{margin-top:8px}
  .cr-ofe .cr-plano__vista,.cr-ofe .cr-plano__det{font-size:14.5px}
  .cr-ofe .cr-plano__vista--vazio{display:none}
  .cr-ofe .cr-plano__lista{margin-top:10px;padding-top:14px;gap:8px}
  .cr-ofe .cr-plano__lista li{font-size:14px;padding-left:28px}
  .cr-ofe .cr-plano__lista li::before{width:19px;height:19px}
  .cr-ofe .cr-plano .cr-bt{margin-top:16px}
}

/* Bloco 6 · capas novas, coloridas e sem a Naila: o véu escuro vira um véu leve na cor de cada capa, só atrás do título */
.cr-faixa--capas .cr-thumb--arte::before,.cr-faixa--capas .cr-thumb--arte:has(.cr-cartaz--quebra)::before{
  background:linear-gradient(90deg,color-mix(in srgb,var(--c) 62%,#000) 0%,color-mix(in srgb,var(--c) 45%,transparent) 38%,transparent 66%)}

/* ===== ajustes do usuário no editor (envio 2026-11-09-154754) ===== */

/* #4 · celular: os pôsteres começam abaixo do botão, sem a linha de corte atravessando a abertura */
@media (max-width:599px){
  .cr-hero__parede{margin-top:22px}
  .cr-hero__parede::before{height:38%}
}

/* #3 · celular: "Aqui, a reprogramação vai até você." numa linha só */
@media (max-width:599px){
  .cr-zap__sub .cr-marca{white-space:nowrap;font-size:clamp(14px,4.2vw,19px)}
}

/* #2 · celular: "REPROGRAMAÇÃO DIÁRIA NO WHATSAPP" (e as outras pílulas dos entregáveis) numa linha só */
@media (max-width:599px){
  .cr-ent .cr-pilula{white-space:nowrap;font-size:11px;letter-spacing:.08em}
}

/* #1 · celular: o print no celular do item 1 estava pequeno demais para ler; o celular cresce e fica reto */
@media (max-width:599px){
  .cr-ent__item:first-child .cr-ent__midia--zap{aspect-ratio:auto;padding:28px 0}
  .cr-ent__midia--zap .cr-mini-fone{width:min(300px,86%);transform:none}
}

/* #8 e #9 · celular: os títulos dos entregáveis usam a largura toda (as 3 linhas valem só no computador) */
@media (max-width:899px){
  .cr-ent .cr-ent__texto .cr-h3,.cr-ent__item:nth-child(1) .cr-h3,.cr-ent__item:nth-child(3) .cr-h3{max-width:none}
}

/* #5 · computador: cada entregável centralizado, imagem e texto como um par no meio da página */
@media (min-width:1100px){
  .cr-ent__item{grid-template-columns:500px 490px;justify-content:center;column-gap:clamp(48px,4.5vw,80px)}
  .cr-ent__item:nth-child(even){grid-template-columns:490px 500px}
  /* envio 171841 · os desafios têm o texto mais estreito: a coluna acompanha o texto e o par fica no centro da página */
  .cr-ent__item:nth-child(3){grid-template-columns:500px fit-content(490px)}
  .cr-ent__item:nth-child(1) .cr-h3{max-width:none}
  .cr-ent__item:not(:first-child) .cr-ent__midia,.cr-ent__item:first-child .cr-ent__midia{width:500px;max-width:500px;margin:0}
}

/* #6 · método: a luz da janela com as folhas some suave antes do fim do bloco (o começo do bloco ficou na v17.css) */
.cr-met{padding-bottom:var(--sec)}  /* v19: era clamp(64px,7vw,104px) */
.cr-met .v4-janela--baixo{-webkit-mask-image:linear-gradient(to bottom,#000 55%,transparent 96%);mask-image:linear-gradient(to bottom,#000 55%,transparent 96%)}

/* #7 · Naila: a foto continua pequena, como a cliente pediu, mas o bloco ganha presença */
.cr-met .cr-naila{max-width:860px;gap:clamp(20px,3vw,36px)}
.cr-met .cr-naila__foto{width:clamp(132px,12vw,176px)}
.cr-met .cr-naila__nome{font-size:clamp(32px,1.6vw + 20px,48px)}
.cr-met .cr-naila__texto>p:not(.cr-selo){font-size:clamp(16.5px,.3vw + 15px,19px);max-width:48ch}

/* #11 · sem palavra sozinha na segunda linha nos subtítulos */
.cr-map__sub,.cr-zap__sub,.cr-cont__cab p,.cr-ofe__lead,.cr-met__sub{text-wrap:balance}
@media (max-width:599px){
  .cr-met .cr-naila__foto{display:none}  /* envio 171841: no celular, a Naila sem a foto */
  .cr-met .cr-naila__nome{font-size:28px}
  .cr-met .cr-naila__texto>p:not(.cr-selo){font-size:15.5px}
}
/* #4 · celular: a parede de pôsteres some em transparência no topo (sem faixa de cor lisa), então não aparece emenda */
@media (max-width:599px){
  .cr-hero__parede::before{display:none}
  .cr-hero__parede{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 34%);mask-image:linear-gradient(to bottom,transparent 0,#000 34%)}
}
