/* ==========================================================================
   BLUE INC — COMPONENTE COMPARTILHADO DO SLIDER DE EMPREENDIMENTOS
   --------------------------------------------------------------------------
   Usado pela home e pelo bloco "Confira outros empreendimentos" das páginas
   internas. Ajustes visuais feitos aqui refletem nos dois contextos.
   ========================================================================== */

.project-slider-component{
  --navy:#2e3191;
  --navy-d:#22246b;
  --navy-dd:#171849;
  --navy-l:#4a4db8;
  --cyan:#39c1d7;
  --cyan-d:#219fb4;
  --grey-l:#e6e7f2;
  --ink-2:#5b5f7a;
  --status-comercializacao:#12a45e;
  --status-breve:#777c88;
  --status-obras:#7fdae8;
  --status-entregue:#5145a5;
  --shadow:0 18px 48px -18px rgba(23,24,73,.26);
  --shadow-lg:0 34px 90px -28px rgba(23,24,73,.4);
}

.slider{position:relative}
.slider__nav{display:flex;gap:.7rem}
.snav{
  width:48px;height:48px;border:0;background:transparent;cursor:pointer;position:relative;padding:0;
  transition:transform .25s var(--ease)
}
.snav::before{
  content:"";position:absolute;inset:0;background:var(--navy);
  box-shadow:0 10px 22px -10px rgba(23,24,73,.55);transition:background .3s var(--ease)
}
.snav--prev::before{clip-path:polygon(100% 0,100% 100%,0 50%)}
.snav--next::before{clip-path:polygon(0 0,0 100%,100% 50%)}
.snav--next:not(:disabled)::before{background:var(--cyan)}
.snav:hover:not(:disabled){transform:scale(1.08)}
.snav:hover:not(:disabled)::before{background:var(--cyan)}
.snav:disabled{opacity:.28;cursor:default}

.track{
  display:flex;gap:1.7rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
  margin-right:calc(50% - 50vw);padding:8px 0 2.4rem 4px;scrollbar-width:none
}
.track::-webkit-scrollbar{display:none}

.ecard{
  flex:0 0 clamp(290px,33%,370px);scroll-snap-align:start;cursor:pointer;
  position:relative;display:flex;flex-direction:column;background:#fff;box-shadow:var(--shadow);overflow:hidden;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 30px),calc(100% - 30px) 100%,0 100%);
  transition:transform .45s var(--ease),box-shadow .45s var(--ease)
}
.ecard:hover{transform:translateY(-9px);box-shadow:var(--shadow-lg)}
.ecard.is-out{display:none}
.ecard::before{
  content:"";position:absolute;right:0;bottom:0;width:64px;height:64px;background:var(--cyan);
  opacity:0;clip-path:polygon(100% 0,100% 100%,0 100%);transition:opacity .4s var(--ease);z-index:1
}
.ecard:hover::before{opacity:1}
.ecard__img{position:relative;isolation:isolate;aspect-ratio:16/11;overflow:hidden;background:var(--grey-l)}
.ecard__img img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.ecard__img .ecard__gallery-layer{
  position:absolute;inset:0;opacity:0;transition:opacity .72s var(--ease),transform .9s var(--ease)
}
.ecard__img .ecard__gallery-layer.is-front{opacity:1}
.ecard:hover .ecard__img img{transform:scale(1.08)}
.ecard__img::after{
  content:"";position:absolute;z-index:1;top:-35%;bottom:-35%;left:-70%;width:42%;
  pointer-events:none;opacity:0;transform:skewX(-20deg);
  background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.12) 28%,rgba(255,255,255,.62) 50%,rgba(127,218,232,.22) 68%,transparent 100%);
  filter:blur(1px);mix-blend-mode:screen
}
@media(hover:hover) and (pointer:fine){
  .ecard:hover .ecard__img::after{animation:ecardImageShine .95s cubic-bezier(.22,.7,.2,1) both}
}
@keyframes ecardImageShine{
  0%{left:-70%;opacity:0}
  16%{opacity:.9}
  82%{opacity:.68}
  100%{left:135%;opacity:0}
}

.pill{
  position:absolute;top:14px;left:14px;z-index:2;
  display:inline-flex;align-items:center;gap:.45rem;padding:.4rem .8rem .4rem .62rem;
  border:1px solid rgba(255,255,255,.4);color:#fff;
  font-size:.66rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  -webkit-backdrop-filter:blur(10px) saturate(160%);backdrop-filter:blur(10px) saturate(160%)
}
.pill::before{
  content:"";width:8px;height:8px;background:currentColor;flex:none;
  clip-path:polygon(50% 0,100% 100%,0 100%)
}
.pill--verde{background:var(--status-comercializacao)}
.pill--ciano{background:var(--status-breve);color:#fff}
.pill--azul{background:var(--status-obras);color:var(--navy-dd)}
.pill--entregue{background:var(--status-entregue)}
.pill--destaque{top:52px;background:var(--navy-dd);border-color:rgba(127,218,232,.7)}
.pill--destaque::before{background:var(--cyan)}

.ecard__body{padding:1.4rem 1.5rem 2.1rem;position:relative;z-index:2;display:flex;flex:1;flex-direction:column}
.ecard__cat{font-size:.78rem;color:var(--navy-l);font-weight:600;margin:0 0 .35rem}
.ecard__body h3{
  font-size:1.3rem;margin:0 0 .3rem;
  background:linear-gradient(102deg,var(--navy-dd) 0%,var(--navy) 46%,var(--cyan-d) 88%,var(--cyan) 118%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent
}
.ecard__loc{font-size:.9rem;color:var(--ink-2);margin:0}
.ecard__progress{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.38rem .8rem;margin:.95rem 0 1.15rem}
.ecard__progress span,.ecard__progress b{font-size:.72rem;line-height:1;color:var(--ink-2)}
.ecard__progress b{font-weight:600;color:var(--navy)}
.ecard__progress i{grid-column:1/-1;display:block;height:7px;background:var(--grey-l);border-radius:999px;overflow:hidden}
.ecard__progress i::after{
  content:"";display:block;width:var(--progress);height:100%;border-radius:inherit;
  background:linear-gradient(90deg,var(--navy-l),var(--cyan));transition:width 1.15s var(--ease)
}
[data-status="breve"] .ecard__progress{display:none}
.track.has-progress-motion .ecard__progress i::after{width:0}
.track.has-progress-motion .ecard.is-progress-visible .ecard__progress i::after{width:var(--progress)}
.ecard__go{
  display:inline-flex;align-items:center;align-self:flex-start;gap:.45rem;margin-top:auto;
  font-weight:600;font-size:.9rem;color:var(--navy)
}
.ecard__go::after{
  content:"";width:12px;height:12px;background:var(--cyan);
  clip-path:polygon(0 0,100% 50%,0 100%);transition:transform .3s var(--ease)
}
.ecard:hover .ecard__go::after{transform:translateX(5px)}
.ecard__go--site{
  padding:.55rem .7rem;border:1px solid rgba(46,49,145,.28);
  transition:color .28s var(--ease),background .28s var(--ease),border-color .28s var(--ease),transform .28s var(--ease)
}
.ecard__go--site::after{display:none}
.ecard__go--site:hover,.ecard__go--site:focus-visible{color:#fff;background:var(--navy);border-color:var(--navy);transform:translateY(-1px)}
.ecard__go--site:focus-visible{outline:2px solid rgba(57,193,215,.65);outline-offset:2px}
.ecard__site-icon{position:relative;width:15px;height:15px;border:1.5px solid currentColor;border-radius:50%;flex:none}
.ecard__site-icon::before{content:"";position:absolute;inset:2px 4px;border:1px solid currentColor;border-top:0;border-bottom:0;border-radius:50%}
.ecard__site-icon::after{content:"";position:absolute;left:1px;right:1px;top:50%;border-top:1px solid currentColor;transform:translateY(-50%)}

.project-related{
  position:relative;padding:clamp(5rem,9vw,8rem) 0;background:#f5f6fb;overflow:hidden
}
.project-related::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:var(--texture-triangles);background-size:190px 165px;
  -webkit-mask-image:radial-gradient(100% 95% at 100% 0%,#000,transparent 65%);
  mask-image:radial-gradient(100% 95% at 100% 0%,#000,transparent 65%)
}
.project-related>.project-wrap{position:relative}
.project-related__head{
  display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;margin-bottom:2.2rem
}
.project-related__head .project-title{max-width:14ch}
.project-related .portfolio-toolbar{
  display:flex;align-items:center;gap:clamp(1rem,2vw,1.7rem);margin-bottom:1.2rem
}
.project-related .chips{display:flex;flex:1 1 auto;flex-wrap:wrap;gap:.7rem}
.project-related .chip{
  --c:var(--navy);--on:#fff;
  position:relative;overflow:hidden;cursor:pointer;
  display:inline-flex;align-items:center;gap:.55rem;
  padding:.62rem 1.2rem;border:1.5px solid var(--grey-l);border-radius:0;
  background:rgba(255,255,255,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  font-weight:600;font-size:.86rem;color:var(--navy-d);
  transition:color .3s var(--ease),border-color .3s var(--ease),background .3s var(--ease)
}
.project-related .chip::before{
  content:"";width:9px;height:9px;background:var(--c);flex:none;
  clip-path:polygon(0 0,100% 50%,0 100%);transition:transform .3s var(--ease)
}
.project-related .chip::after{
  content:"";position:absolute;right:-16px;top:-16px;width:40px;height:40px;
  background:var(--c);opacity:0;clip-path:polygon(100% 0,100% 100%,0 0);
  transition:opacity .3s var(--ease)
}
.project-related .chip:hover{border-color:var(--c);color:var(--c)}
.project-related .chip:hover::before{transform:translateX(3px)}
.project-related .chip:hover::after{opacity:.16}
.project-related .chip.is-on{background:var(--c);border-color:var(--c);color:var(--on)}
.project-related .chip.is-on::before{background:currentColor}
.project-related .chip.is-on::after{opacity:0}
.project-related .chip--verde{--c:var(--status-comercializacao)}
.project-related .chip--ciano{--c:var(--status-breve);--on:#fff}
.project-related .chip--azul{--c:var(--status-obras);--on:var(--navy-dd)}
.project-related .chip--indigo{--c:var(--status-entregue)}
.project-related .slider__bar{
  display:flex;flex:none;align-items:center;gap:clamp(1rem,2vw,1.6rem);margin-left:auto
}
.project-related .resultado{margin:0;white-space:nowrap;font-size:.9rem;color:var(--ink-2)}
.project-related .resultado b{color:var(--navy);font-size:1.05rem}

@media(max-width:700px){
  .ecard{flex-basis:min(82vw,320px)}
  .project-related__head{align-items:flex-start;flex-direction:column}
  .project-related .portfolio-toolbar{align-items:stretch;flex-direction:column}
  .project-related .chips{
    flex-wrap:nowrap;overflow-x:auto;margin-inline:calc(50% - 50vw);
    padding:0 max(1rem,calc((100vw - 100%)/2)) .45rem;scrollbar-width:none
  }
  .project-related .chips::-webkit-scrollbar{display:none}
  .project-related .chip{flex:none;white-space:nowrap}
  .project-related .slider__bar{width:100%;justify-content:space-between;margin-left:0}
}
@media(prefers-reduced-motion:reduce){
  .ecard__img::after{display:none}
}