/* Página de case (clone Framer): fundo do design system, blocos editoriais
   injetados por pyl-case.js (.pcs) e travas de tamanho pra telas largas. */
@font-face{font-family:'PCS Mono';src:url('/ds/space-mono.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}

/* ── fundo igual ao da home: cinza claro + pattern + degradê lilás suave ── */
html body,#main .framer-B9KKm.framer-17nslh7{
  background-color:#eeeeee;
  background-image:radial-gradient(55% 45% at 90% 0%,#e6e0f5 0%,transparent 70%),radial-gradient(45% 40% at 0% 100%,#e2e8f5 0%,transparent 70%),image-set(url('/ds/bg-pattern-light.png') 1x,url('/ds/bg-pattern-light@2x.png') 2x);
  background-size:auto,auto,64px 64px;background-repeat:no-repeat,no-repeat,repeat}

/* ── blocos editoriais ── */
.pcs{--ink:#121212;--body:#4a4a4a;--mute:#767676;--card:#ffffff;--chip:#f1f0f4;
  container-type:inline-size;box-sizing:border-box;width:var(--pcs-w,100%);max-width:100%;flex:none;position:relative;z-index:1;
  color:var(--ink);font-size:clamp(15px,.36vw + 10px,18px);line-height:1.55;text-align:left;pointer-events:auto}
.pcs *{box-sizing:border-box;margin:0;padding:0}
.pcs ul,.pcs ol{list-style:none}
.pcs .pcs-eyebrow,.pcs .pcs-label,.pcs .pcs-n,.pcs dt{font-family:'PCS Mono',ui-monospace,monospace!important;font-size:clamp(11px,.12vw + 9.4px,13px);letter-spacing:.08em;text-transform:uppercase;color:var(--mute);line-height:1.3}
.pcs .pcs-eyebrow{display:inline-flex;align-items:center;gap:.6em;margin-bottom:1.1em}
.pcs .pcs-eyebrow::before{content:'';width:.55em;height:.55em;border-radius:50%;background:var(--ink)}
.pcs .pcs-h2{font-size:clamp(26px,1.5vw + 10px,46px);line-height:1.08;letter-spacing:-.02em;font-weight:400;max-width:22ch}
.pcs .pcs-h3{font-size:clamp(22px,1vw + 10px,36px);line-height:1.1;letter-spacing:-.015em;font-weight:400;margin-bottom:1.1em}
.pcs .pcs-p{color:var(--body);max-width:62ch}
.pcs-card{background:var(--card);border-radius:clamp(18px,1.4vw,26px);padding:clamp(22px,2.6vw,48px)}
.pcs-pastel{background:radial-gradient(60% 70% at 15% 20%,#d6f1e6 0%,transparent 60%),radial-gradient(55% 60% at 85% 15%,#f0d9ec 0%,transparent 60%),radial-gradient(70% 70% at 80% 90%,#c9c6f3 0%,transparent 60%),radial-gradient(60% 60% at 10% 90%,#cfe3f4 0%,transparent 60%),#e4e1ea}

/* A: contexto e desafio */
.pcs-a{padding:clamp(8px,1vw,24px) 0}
.pcs-rows{display:grid;gap:1.6em;margin-top:1.8em}
.pcs-row{display:grid;gap:.5em}

/* B: ficha + entregas */
.pcs-ficha{display:grid;grid-template-columns:1fr 1fr;gap:1.3em 1.2em;margin-bottom:2em}
.pcs-ficha dd{margin-top:.35em;color:var(--ink);display:flex;flex-wrap:wrap;gap:.25em .5em}
.pcs-ficha dd span:not(:last-child)::after{content:','}
.pcs-chips{display:flex;flex-wrap:wrap;gap:.5em;margin-top:.9em}
.pcs-chips li{display:inline-flex;align-items:center;gap:.6em;background:var(--chip);border-radius:999px;padding:.5em 1em;font-size:.94em;color:var(--ink)}
.pcs-chips .pcs-n{font-size:.78em;color:var(--mute)}

/* C: processo */
.pcs-steps{display:grid;gap:.75em}
.pcs-step{background:var(--card);border-radius:clamp(14px,1vw,20px);padding:clamp(18px,1.8vw,32px);display:grid;gap:.45em;align-content:start}
.pcs-step h4{font-size:1.18em;font-weight:400;line-height:1.2;margin-top:.5em}
.pcs-step p{color:var(--body);font-size:.95em}

/* D: resultado + chamada */
.pcs .pcs-lead{font-size:clamp(20px,.9vw + 9px,32px);line-height:1.3;letter-spacing:-.01em;max-width:34ch}
.pcs-hl{display:grid;gap:.5em;margin-top:1.6em}
.pcs-hl li{display:flex;align-items:center;gap:.8em;background:#ffffffa6;border-radius:14px;padding:.75em 1em;color:var(--ink)}
.pcs-hl svg{width:1.25em;height:1.25em;flex:none}
.pcs-cta{display:grid;gap:1.2em;margin-top:2.2em;align-items:end}
.pcs-cta-t{font-size:clamp(20px,.7vw + 10px,30px);line-height:1.15;margin-bottom:.3em}
.pcs-cta .pcs-p{max-width:40ch}
.pcs-btns{display:flex;flex-wrap:wrap;gap:.6em}
.pcs a.pcs-btn{display:inline-flex;align-items:center;gap:.5em;border-radius:999px;padding:.85em 1.35em;font-size:.95em;line-height:1;text-decoration:none;background:#121212;color:#fff;cursor:pointer;transition:background .2s}
.pcs a.pcs-btn:hover{background:#2c2c2c}
.pcs a.pcs-btn svg{width:.8em;height:.8em}
.pcs a.pcs-ghost{background:#ffffffb3;color:#121212}
.pcs a.pcs-ghost:hover{background:#fff}

@container (min-width:560px){
  .pcs-row{grid-template-columns:clamp(110px,26%,190px) 1fr;gap:1.2em}
  .pcs-ficha{grid-template-columns:repeat(4,minmax(0,1fr))}
  .pcs-steps{grid-template-columns:1fr 1fr}
}
@container (min-width:820px){
  .pcs-cta{grid-template-columns:minmax(0,1fr) auto}
}

/* imagens em pé (posts 4:5) não passam da altura da tela */
@media (min-width:768px){
  [data-framer-name=Imgaeproject]>[data-pcs-portrait]{max-width:min(100%,calc(80vh * var(--pcs-ratio,.8)))}
}
[data-framer-name=Imgaeproject]>[data-pcs-hide],[data-pcs-hide]{display:none!important}

/* ── telas largas: nada cresce sem teto ── */
/* título do case: cabe em uma linha (nomes longos quebravam em duas e encostavam na foto de capa) */
.framer-cbpm1x p.framer-text{font-size:min(var(--framer-font-size,120px),128px,calc(58vw / (var(--pcs-tl,8) * .66)))!important;white-space:nowrap!important}
@media (min-width:2200px){.framer-cbpm1x p.framer-text{font-size:min(var(--framer-font-size,120px),128px,calc(1120px / (var(--pcs-tl,8) * .66)))!important}}
/* "próximo case": nome cabe na largura (nomes longos como DR. RAFAEL PAMPLONA estouravam) */
[data-framer-name=next] a[role=button]>div{font-size:min(clamp(40px,8.3vw,136px),calc(min(950px,100vw - 40px) / (var(--pcs-nl,8) * .66)))!important;min-height:0!important;line-height:1!important;white-space:nowrap!important}
@media (min-width:2200px){
  [data-framer-name=Imgaeproject]>[class$=-container]{max-width:1040px}
  [data-framer-name=Imgaeproject]>[data-pcs-portrait]{max-width:min(1040px,calc(80vh * var(--pcs-ratio,.8)))}
}
/* integração: links do site no fim do bloco de resultado (mesmas rotas do rodapé) */
.pcs-links{display:flex;flex-wrap:wrap;gap:.4em 1.4em;margin-top:2em;padding-top:1.4em;font-size:clamp(13px,.9vw,15px)}
.pcs-links a{color:#121212;text-decoration:underline;text-underline-offset:3px;opacity:.75}
.pcs-links a:hover{opacity:1}

/* ── acabamento (QA de responsividade) ── */
/* cor de destaque herdada do template (vermelho) vira a tinta do design system */
[style*="color: rgb(255, 72, 72)"],[style*="color:rgb(255, 72, 72)"]{color:#121212!important}
[style*="background: rgb(255, 72, 72)"],[style*="background:rgb(255, 72, 72)"]{background:#121212!important}
:root:not([data-v2-theme=light]) [style*="color: rgb(255, 72, 72)"],:root:not([data-v2-theme=light]) [style*="color:rgb(255, 72, 72)"]{color:#fcfcfc!important}
[style*="text-color: rgb(255, 73, 73)"],[style*="text-color:rgb(255, 73, 73)"],[style*="text-color: rgb(255, 72, 72)"],[style*="text-color:rgb(255, 72, 72)"]{--framer-text-color:#121212!important}

/* ultrawide: a página vira uma composição de 1920px centralizada (painel de info,
   coluna de fotos, miniaturas e cabeçalho), em vez de espalhar pelos cantos da tela */
@media (min-width:2200px){
  .framer-j44d8 .framer-ozybli,.framer-j44d8 .framer-2i0wwq,.framer-j44d8 .framer-1jg3ys5{left:calc(50% - 960px)!important;right:auto!important;width:1920px!important}
  .framer-j44d8 .framer-1h5109u{max-width:420px}
  .framer-j44d8 .framer-1h5109u .framer-1p6hcfn{max-width:262px}
  .framer-B9KKm .framer-um322p{left:calc(50% - 960px)!important}
  [data-framer-name=Imgaeproject]>[class$=-container]{max-width:960px}
  [data-framer-name=Imgaeproject]>[data-pcs-portrait]{max-width:min(960px,calc(80vh * var(--pcs-ratio,.8)))}
}

/* E: outros cases */
.pcs-e{padding:clamp(8px,1vw,24px) 0}
.pcs-e-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1em 2em;margin-bottom:1.4em}
.pcs-e .pcs-h3{margin-bottom:0}
.pcs a.pcs-more{display:inline-flex;align-items:center;gap:.5em;font-size:.94em;color:#121212;text-decoration:none;border-radius:999px;padding:.7em 1.15em;background:#ffffffb3;transition:background .2s}
.pcs a.pcs-more:hover{background:#fff}
.pcs a.pcs-more svg{width:.75em;height:.75em}
.pcs-rel{display:grid;gap:1.2em}
.pcs a.pcs-rel-a{display:block;color:#121212;text-decoration:none}
.pcs-rel-img{display:block;aspect-ratio:4/3;border-radius:clamp(12px,1vw,18px);overflow:hidden;background:#e4e1ea}
.pcs-rel-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.22,1,.36,1)}
.pcs a.pcs-rel-a:hover .pcs-rel-img img{transform:scale(1.05)}
.pcs-rel-meta{display:flex;flex-direction:column;gap:.35em;margin-top:.8em}
.pcs-rel-name{font-size:1.08em;line-height:1.2}
@container (min-width:560px){.pcs-rel{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* título do case: no topo à direita (no rodapé ele batia na header flutuante e na foto de capa) */
.framer-j44d8 .framer-cbpm1x{bottom:auto!important;top:clamp(24px,2.4vw,56px)!important}
@media (min-width:2200px){.framer-j44d8 .framer-cbpm1x{right:calc(50% - 960px + 32px)!important;width:1150px!important}}

/* animação Rive do autor do template: não aparece no site da Pylons */
[data-framer-name="huyml.riv"]{display:none!important}

/* tablet: o Framer fixava a altura das fotos (16:9) e a imagem em pé vazava por cima do bloco
   seguinte; a moldura acompanha a proporção real da foto, como no desktop */
[data-framer-name=Imgaeproject]>[class$=-container]:not([data-pcs-hide]){height:auto!important;aspect-ratio:auto!important}