/* ===== 4. O consultório (co-) — a casa, em foto larga ===== */
.co-sec{background:var(--creme);padding-left:0;padding-right:0;padding-top:0}
.co-sec > .wf-dentro{padding-left:var(--pad);padding-right:var(--pad);max-width:calc(var(--largura) + var(--pad) * 2)}

/* a imagem larga, com o título por cima: abre da moldura para a tela inteira com a rolagem */
.co-largo{--a:1;position:relative;height:min(100svh,54vw);min-height:34rem;overflow:clip;isolation:isolate;
  clip-path:inset(calc((1 - var(--a)) * 3rem) calc((1 - var(--a)) * var(--pad) * 1.6) 0 round calc((1 - var(--a)) * 24px))}
.co-largo-img{position:absolute;inset:0;z-index:-2}
.co-largo-img img{width:100%;height:100%;object-fit:cover;object-position:50% 55%;transform:scale(calc(1.12 - var(--a) * .12));transform-origin:50% 65%}
.co-largo::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(20deg,rgba(29,19,13,.82) 0%,rgba(42,28,19,.5) 32%,rgba(42,28,19,0) 62%),linear-gradient(0deg,rgba(29,19,13,.35),rgba(29,19,13,0) 30%)}
.co-cab{position:absolute;left:var(--pad);bottom:clamp(2.5rem,7vh,5.5rem);max-width:min(46rem,60vw)}
.co-cab .wf-rotulo{color:var(--texto-claro)}
.co-cab .wf-tit{margin-top:1.3rem}
.co-cab .wf-tit .l{color:var(--texto-claro)}
.co-cab .wf-tit .f{color:var(--marfim);font-size:clamp(2.8rem,1.3rem + 4.4vw,6rem);text-shadow:0 2px 30px rgba(29,19,13,.35)}
.co-cab-fonte{margin-top:1.2rem;font-size:var(--t-mini);letter-spacing:.04em;color:var(--texto-claro)}
.co-largo-leg{position:absolute;right:var(--pad);bottom:1.2rem;font-size:var(--t-mini);color:#fff;opacity:.88;text-shadow:0 1px 8px rgba(0,0,0,.45)}

/* mosaico */
.co-sec > .co-mosaico{margin-top:clamp(4rem,8vw,7.5rem)}
.co-mosaico{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(1rem,2.4vw,2.5rem);row-gap:clamp(1.5rem,3vw,3rem);margin-top:clamp(4rem,8vw,7.5rem);align-items:start}
.co-f{margin:0;position:relative}
.co-f img{width:100%;height:auto;border-radius:var(--raio);box-shadow:var(--sombra)}
.co-f figcaption{position:absolute;left:1rem;bottom:.9rem;font-size:var(--t-mini);color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.5)}
.co-orq{grid-column:1 / span 5;grid-row:1 / span 2;align-self:stretch}
.co-orq img{height:100%;object-fit:cover;object-position:40% 60%}
.co-conta{grid-column:7 / span 6;grid-row:1;align-self:center;padding-top:1rem}
.co-mesa{grid-column:6 / span 7;grid-row:2;align-self:end}
.co-sala{grid-column:1 / span 8;grid-row:3;margin-top:clamp(1rem,3vw,3rem)}
.co-lado{grid-column:9 / span 4;grid-row:3;align-self:end;display:grid;gap:1.8rem}
.co-lara{font-family:var(--f-titulo);font-weight:300;font-size:clamp(1.3rem,1rem + .8vw,1.75rem);line-height:1.25;color:var(--cafe)}
.co-lara span{display:block;margin-top:.7rem;font-family:var(--f-texto);font-size:var(--t-mini);letter-spacing:.04em;color:var(--texto-suave)}

.co-num{display:flex;align-items:baseline;gap:.9rem;font-size:var(--t-mini);letter-spacing:.08em;text-transform:uppercase;color:var(--texto-suave);font-weight:600}
.co-num span{font-family:var(--f-titulo);font-weight:800;font-size:clamp(3rem,2rem + 2.6vw,4.6rem);line-height:.9;letter-spacing:-.04em;color:var(--madeira);text-transform:none}
.co-num + .co-num{margin-top:.9rem}
.co-num-p{flex-wrap:wrap;row-gap:.3rem}
.co-num-p q{flex-basis:100%;text-transform:none;letter-spacing:0;font-weight:400;font-size:var(--t-corpo);color:var(--texto-suave)}
.co-num-p span{font-size:clamp(2rem,1.4rem + 1.6vw,3rem);color:var(--caramelo)}
.co-cit{margin-top:1.6rem}
.co-cit-forte{font-family:var(--f-titulo);font-weight:800;font-size:clamp(2rem,1.2rem + 2.4vw,3.6rem);line-height:1;letter-spacing:-.035em;color:var(--cafe)}
.co-cit-ctx{margin-top:1.2rem;max-width:30em;color:var(--texto-suave)}
.co-cit footer{margin-top:.8rem;font-size:var(--t-mini);letter-spacing:.04em;color:var(--texto-suave)}

/* ela e a casa: painel café */
.co-alma{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(1rem,2.4vw,2.5rem);align-items:center;margin-top:clamp(6rem,11vw,10rem);padding:0 clamp(1.5rem,4vw,4rem) clamp(2.5rem,5vw,4.5rem);border-radius:calc(var(--raio) + 8px);background:radial-gradient(60% 90% at 85% 10%,color-mix(in oklab,var(--madeira) 55%,transparent),transparent),radial-gradient(50% 70% at 10% 100%,color-mix(in oklab,var(--caramelo) 30%,transparent),transparent),var(--cafe)}
.co-xic{grid-column:1 / span 5;margin-top:clamp(-6rem,-8vw,-3.5rem)}
.co-xic img{box-shadow:0 30px 60px -20px rgba(0,0,0,.55)}
.co-alma-txt{grid-column:7 / span 6;padding-top:clamp(2.5rem,5vw,4.5rem)}
.co-fala p{font-family:var(--f-titulo);font-weight:300;font-size:clamp(2rem,1.2rem + 2.6vw,3.8rem);line-height:1.05;letter-spacing:-.03em;color:var(--texto-claro)}
.co-fala strong{font-weight:800;color:var(--champanhe)}
.co-fala footer{margin-top:1rem;font-size:var(--t-mini);letter-spacing:.04em;color:var(--texto-claro-suave)}
.co-info{list-style:none;margin-top:2.4rem;display:grid;gap:1.1rem;border-top:1px solid rgba(239,230,218,.18);padding-top:1.6rem}
.co-info li{color:var(--texto-claro-suave)}
.co-info strong{display:block;font-size:var(--t-mini);letter-spacing:.08em;text-transform:uppercase;color:var(--champanhe);font-weight:700}
.co-leg{margin-top:2rem;font-size:var(--t-mini);color:var(--texto-claro-suave)}

@media (max-width:980px){
  .co-largo{height:min(100svh,138vw);min-height:30rem;clip-path:none}
  .co-largo::before{background:linear-gradient(0deg,rgba(29,19,13,.9) 0%,rgba(29,19,13,.62) 34%,rgba(29,19,13,0) 62%)}
  .co-largo-img img{transform:none;object-position:60% 30%}
  .co-cab{left:var(--pad);right:var(--pad);bottom:3.2rem;max-width:none}
  .co-cab .wf-tit .f{font-size:clamp(2.6rem,11vw,3.6rem)}
  .co-largo-leg{left:var(--pad);right:auto;bottom:1rem}
  .co-mosaico{grid-template-columns:repeat(6,minmax(0,1fr))}
  .co-orq{grid-column:1 / span 5;grid-row:auto;align-self:start}
  .co-orq img{height:auto}
  .co-conta{grid-column:1 / -1;grid-row:auto;padding-top:0}
  .co-mesa{grid-column:2 / -1;grid-row:auto}
  .co-sala{grid-column:1 / -1;grid-row:auto;margin-top:0}
  .co-lado{grid-column:1 / -1;grid-row:auto;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:end;gap:1.2rem}
  .co-alma{grid-template-columns:minmax(0,1fr);padding:0 1.25rem 2.2rem}
  .co-xic{grid-column:1;width:82%;margin-top:-3rem}
  .co-alma-txt{grid-column:1;padding-top:2rem}
}
