/* Três painéis verticais, com direção de cor própria para cada case. */
#portfolio .portfolio-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:50px;align-items:stretch}
#portfolio .portfolio-panel{padding:28px 24px 26px;margin:0;display:flex;flex-direction:column;border:0;border-radius:0;height:auto;overflow:hidden;min-width:0;isolation:isolate}
#portfolio .panel-labamba{background:#ffc15d!important;color:#452a18}
#portfolio .panel-lowice{background:#eee7dc!important;color:#302d29}
#portfolio .panel-creme{background:#e7cde1!important;color:#4e2450}
.panel-heading>span{font:10px/1.4 Arial,sans-serif;letter-spacing:.8px;text-transform:uppercase}
#portfolio .panel-heading h3{font:700 clamp(32px,3.1vw,48px)/1.05 var(--heading);letter-spacing:-1.3px;margin:15px 0 0;color:inherit}
#portfolio .portfolio-panel .panel-visual{position:relative;height:385px;min-height:385px;width:100%;margin:18px 0 16px;inset:auto;display:block;overflow:visible;aspect-ratio:auto;max-height:none}
#portfolio .panel-labamba .labamba-brigadeiro{width:77%;left:-9%;top:12px;right:auto}
#portfolio .panel-labamba .labamba-bueno{width:82%;right:-8%;top:115px;left:auto}
#portfolio .panel-caption{margin-top:auto;padding-top:21px;border-top:1px solid #0003;min-height:185px}
#portfolio .panel-caption h4{font:700 21px/1.2 var(--heading);letter-spacing:-.3px;margin:0 0 11px;color:inherit}
#portfolio .panel-caption p{font:14px/1.6 Arial,sans-serif;margin:0;color:inherit;max-width:none}
#portfolio .panel-caption>a{font:700 12px/1.4 var(--heading);display:inline-block;border-bottom:1px solid currentColor;padding-bottom:5px;margin-top:20px;color:inherit}
#portfolio .panel-caption small{display:block;font:10px/1.5 Arial,sans-serif;margin-top:14px;color:inherit}
#portfolio .panel-lowice .lowice-pack{width:130%;max-width:none;filter:drop-shadow(3px 10px 7px #30200e20);transition:transform .8s,opacity .8s,top .8s,left .8s,right .8s,width .8s}
#portfolio .panel-lowice .lowice-pink,#portfolio .panel-lowice[data-flavor=passion] .lowice-passion,#portfolio .panel-lowice[data-flavor=coco] .lowice-coco{width:130%;left:-26%;right:auto;top:75px;transform:rotate(-7deg);z-index:4;opacity:1}
#portfolio .panel-lowice .lowice-passion,#portfolio .panel-lowice[data-flavor=passion] .lowice-pink,#portfolio .panel-lowice[data-flavor=coco] .lowice-pink{width:88%;left:auto;right:-29%;top:0;transform:rotate(10deg);z-index:1;opacity:1}
#portfolio .panel-lowice .lowice-coco,#portfolio .panel-lowice[data-flavor=coco] .lowice-passion{width:80%;left:auto;right:-24%;top:180px;transform:rotate(8deg);z-index:2;opacity:1}
#portfolio .panel-lowice .flavor-controls{flex-direction:row;flex-wrap:wrap;gap:5px;margin-top:14px}
#portfolio .panel-lowice .flavor-controls button{font-size:10px;padding:7px 9px;border:1px solid #302d2940;color:#302d29;background:transparent}
#portfolio .panel-lowice .flavor-controls button[aria-pressed=true]{background:#302d29;color:#fff;border-color:#302d29}
#portfolio .panel-lowice .flavor-caption{position:static;font:9px/1.3 Arial,sans-serif;display:block;letter-spacing:0;margin-top:10px;color:#302d29}
#portfolio .creme-poster{padding:0 25px;box-sizing:border-box;display:flex;justify-content:center;align-items:center}
.creme-poster img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(5px 8px 8px #48204525);transform:rotate(-3deg);transition:transform .4s}
.creme-poster:hover img{transform:rotate(0deg) scale(1.02)}
@media(min-width:1500px){#portfolio>.container{width:min(1440px,calc(100% - 100px))}#portfolio .portfolio-panel{padding-inline:32px}#portfolio .portfolio-panel .panel-visual{height:450px;min-height:450px}}
@media(max-width:1050px) and (min-width:781px){#portfolio .portfolio-panel{padding:24px 17px}#portfolio .portfolio-panel .panel-visual{height:300px;min-height:300px}#portfolio .panel-labamba .labamba-bueno{top:95px}#portfolio .panel-caption{min-height:240px}#portfolio .creme-poster{padding-inline:12px}#portfolio .panel-caption p{font-size:13px}}
@media(max-width:780px){#portfolio .portfolio-columns{grid-template-columns:1fr;gap:20px;margin-top:30px}#portfolio .portfolio-panel{padding:26px}#portfolio .panel-heading h3{font-size:42px}#portfolio .portfolio-panel .panel-visual{height:auto;min-height:0;aspect-ratio:1/.98;max-height:500px;margin-top:20px}#portfolio .panel-labamba .labamba-bueno{top:29%}#portfolio .panel-lowice .panel-visual{aspect-ratio:1/1.06}#portfolio .panel-caption{min-height:0;padding-top:22px}#portfolio .creme-poster{aspect-ratio:1/1.35!important;padding-inline:30px}#portfolio .panel-lowice .lowice-pink,#portfolio .panel-lowice[data-flavor=passion] .lowice-passion,#portfolio .panel-lowice[data-flavor=coco] .lowice-coco{top:18%}#portfolio .panel-lowice .lowice-coco,#portfolio .panel-lowice[data-flavor=coco] .lowice-passion{top:48%}}
@media(prefers-reduced-motion:reduce){.creme-poster img{transition:none}}
/* Paleta infantil inspirada na referência: laranja, rosa e verde vivos. */
#portfolio .panel-labamba{background:#ffa323!important;color:#482709}
#portfolio .panel-lowice{background:#ff087b!important;color:#fff}
#portfolio .panel-creme{background:#08ae08!important;color:#fff}
#portfolio .portfolio-columns{gap:20px}
#portfolio .portfolio-panel{border-radius:10px}
#portfolio .panel-lowice .flavor-controls button{border-color:#ffffff90;color:white}
#portfolio .panel-lowice .flavor-controls button[aria-pressed=true]{background:#fff;color:#ae0754;border-color:#fff}
#portfolio .panel-lowice .flavor-caption{color:white}
#portfolio .panel-lowice .panel-caption,#portfolio .panel-creme .panel-caption{border-color:#ffffff60}
#portfolio .creme-poster{position:relative;display:block;padding:0}
#portfolio .creme-poster .creme-main{position:absolute;left:5%;top:0;width:69%;height:87%;object-fit:contain;transform:rotate(-5deg)}
#portfolio .creme-poster .creme-acai{position:absolute;width:86%;height:auto;right:-3%;bottom:2%;transform:rotate(4deg);filter:drop-shadow(3px 8px 9px #00350035)}
@media(max-width:780px){#portfolio .portfolio-columns{gap:24px}}
#portfolio .panel-lowice{background:#00b9df!important;color:#07334a}
#portfolio .panel-creme{background:#ff0081!important;color:#fff}
#portfolio .panel-lowice .flavor-controls button{color:#07334a;border-color:#07334a70}
#portfolio .panel-lowice .flavor-controls button[aria-pressed=true]{background:#c7ef00;color:#193005;border-color:#c7ef00}
#portfolio .panel-lowice .flavor-caption{color:#07334a}
#portfolio .panel-lowice .panel-caption{border-color:#07334a55}
#portfolio .panel-labamba .labamba-brigadeiro{width:66%;left:-4%;top:12px}
#portfolio .panel-labamba .labamba-bueno{width:70%;right:-1%;top:108px}
#portfolio{background:#fff!important;color:#262229}
#portfolio .section-intro h2,#portfolio.dark .section-intro h2 em,#portfolio>.container>.eyebrow,#portfolio .section-intro>p,#portfolio .portfolio-note,#portfolio .portfolio-cta>div>span,#portfolio .portfolio-cta strong{color:#262229!important}
#portfolio .portfolio-cta{border-color:#26222925}
#portfolio .portfolio-cta .button{background:#f60879;color:#fff}
/* Os três potes usam a mesma caixa; só transformações interpolam a troca. */
#portfolio .panel-lowice[data-flavor] .lowice-pack{position:absolute;inset:0 auto auto 0;width:100%;height:100%;max-width:100%;object-fit:contain;transform-origin:center;transform:translate(var(--pack-x),var(--pack-y)) rotate(var(--pack-angle)) scale(var(--pack-scale));opacity:1;z-index:var(--pack-layer);transition:transform .85s cubic-bezier(.22,.7,.24,1);will-change:transform}
#portfolio .panel-lowice .lowice-pink{--pack-x:0%;--pack-y:7%;--pack-angle:-5deg;--pack-scale:.78;--pack-layer:3}
#portfolio .panel-lowice .lowice-passion{--pack-x:-21%;--pack-y:-24%;--pack-angle:-9deg;--pack-scale:.46;--pack-layer:1}
#portfolio .panel-lowice .lowice-coco{--pack-x:23%;--pack-y:-15%;--pack-angle:9deg;--pack-scale:.46;--pack-layer:2}
#portfolio .panel-lowice[data-flavor=passion] .lowice-passion,#portfolio .panel-lowice[data-flavor=coco] .lowice-coco{--pack-x:0%;--pack-y:7%;--pack-angle:-5deg;--pack-scale:.78;--pack-layer:3}
#portfolio .panel-lowice[data-flavor=passion] .lowice-pink,#portfolio .panel-lowice[data-flavor=coco] .lowice-pink{--pack-x:-21%;--pack-y:-24%;--pack-angle:-9deg;--pack-scale:.46;--pack-layer:1}
#portfolio .panel-lowice[data-flavor=coco] .lowice-passion{--pack-x:23%;--pack-y:-15%;--pack-angle:9deg;--pack-scale:.46;--pack-layer:2}
#portfolio .panel-labamba .labamba-brigadeiro{width:60%;left:2%;top:4%}
#portfolio .panel-labamba .labamba-bueno{width:64%;right:2%;top:28%}
@media(max-width:780px){#portfolio .panel-labamba .panel-visual,#portfolio .panel-lowice .panel-visual{aspect-ratio:1/1.15;max-height:none}}
@media(prefers-reduced-motion:reduce){#portfolio .panel-lowice[data-flavor] .lowice-pack{transition:none}}
