/* ============================================================
   PROCESS REFINED — Maio 2026
   Cards menores, ricos em detalhes, hover premium.
   Carregar APÓS oryzo-overlay.css/premium-visual.css.
   ============================================================ */

/* ─── Track: gap maior, alinhamento limpo ─── */
.home-process .process-track{
  gap:18px !important;
  margin-block-start:clamp(48px, 6vw, 72px) !important;
}

/* Linha conectora superior reposicionada ao centro do círculo menor */
.home-process .process-track::before{
  top:34px !important;
  left:54px !important;
  right:54px !important;
  background:rgba(255,237,215,0.08) !important;
}
.home-process .process-track__line{
  top:34px !important;
  left:54px !important;
}
.home-process .process-track.is-animated .process-track__line{
  width:calc(100% - 108px) !important;
}

/* ─── Card v2 — menor + mais detalhado ─── */
.home-process .process-step.process-step--v2{
  position:relative;
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  text-align:left;
  gap:14px;
  padding:26px 22px 24px !important;
  min-height:auto;
  background:linear-gradient(180deg, rgba(56,36,22,0.55) 0%, rgba(40,26,16,0.85) 100%) !important;
  border:1px solid rgba(255,237,215,0.07) !important;
  border-radius:14px !important;
  overflow:hidden;
  isolation:isolate;
  cursor:default;
  transition:
    transform .65s cubic-bezier(.16,1,.3,1),
    border-color .55s ease,
    box-shadow .65s cubic-bezier(.16,1,.3,1),
    background .55s ease !important;
}

/* Glow halo radial dourado (oculto, revela no hover) */
.process-step--v2::before{
  content:'';
  position:absolute;inset:0;border-radius:inherit;
  background:radial-gradient(120% 80% at 50% 0%, rgba(232,200,122,0.18) 0%, transparent 65%);
  opacity:0;
  transition:opacity .65s ease;
  pointer-events:none;
  z-index:0;
}

/* Watermark — número gigante atrás */
.process-step--v2 .process-step__watermark{
  position:absolute;
  top:-18px;right:-8px;
  font-family:'Cormorant Garamond', Georgia, serif;
  font-size:clamp(96px, 9vw, 140px);
  font-weight:300;
  font-style:italic;
  line-height:.8;
  color:rgba(232,200,122,0.06);
  letter-spacing:-0.04em;
  pointer-events:none;
  z-index:0;
  transition:color .6s ease, transform .8s cubic-bezier(.16,1,.3,1);
  user-select:none;
}

/* Number circle MENOR (44px ao invés de 60px) */
.home-process .process-step--v2 .process-step__num{
  position:relative;
  width:42px !important;
  height:42px !important;
  border-radius:999px !important;
  border:1px solid rgba(232,200,122,.45) !important;
  background:#1a0f08 !important;
  display:flex;
  align-items:center;justify-content:center;
  font-family:'DM Sans', sans-serif !important;
  font-size:13px !important;
  font-weight:600 !important;
  letter-spacing:.04em !important;
  color:rgba(232,200,122,.9) !important;
  z-index:2;
  transition:transform .6s cubic-bezier(.16,1,.3,1), border-color .5s ease, box-shadow .5s ease, background .5s ease !important;
}

/* Quando track anima: number active dourado */
.home-process .process-track.is-animated .process-step--v2 .process-step__num{
  background:linear-gradient(135deg, #e8c87a 0%, #c8a84b 60%, #9a7c2e 100%) !important;
  border-color:transparent !important;
  color:#1a0f08 !important;
  box-shadow:0 6px 20px -4px rgba(200,168,75,.45) !important;
}

/* Title compacto */
.home-process .process-step--v2 .process-step__title{
  position:relative;z-index:2;
  font-family:'DM Sans', sans-serif !important;
  font-size:11px !important;
  font-weight:600 !important;
  letter-spacing:.22em !important;
  text-transform:uppercase !important;
  color:rgba(232,200,122,.92) !important;
  margin:0 !important;
  line-height:1 !important;
}

/* Desc curta + clamp */
.home-process .process-step--v2 .process-step__desc{
  position:relative;z-index:2;
  font-family:'Cormorant Garamond', Georgia, serif !important;
  font-size:clamp(15px, 1.05vw, 17px) !important;
  font-weight:400 !important;
  line-height:1.4 !important;
  color:rgba(255,237,215,.78) !important;
  max-width:none !important;
  margin:0 !important;
  text-align:left !important;
}

/* Bottom rule (linha dourada que reveala no hover) */
.process-step--v2 .process-step__rule{
  position:absolute;
  inset-inline:22px;
  inset-block-end:14px;
  height:1px;
  background:linear-gradient(90deg, var(--gold, #c8a84b) 0%, transparent 100%);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .7s cubic-bezier(.16,1,.3,1);
  z-index:2;
}

/* ─── HOVER — card transforma ─── */
.process-step--v2:hover{
  transform:translateY(-6px);
  border-color:rgba(232,200,122,0.32) !important;
  box-shadow:
    0 18px 42px -16px rgba(0,0,0,.7),
    0 0 0 1px rgba(232,200,122,.10),
    0 0 36px -8px rgba(200,168,75,.25) !important;
  background:linear-gradient(180deg, rgba(72,46,28,0.65) 0%, rgba(48,30,18,0.92) 100%) !important;
}
.process-step--v2:hover::before{ opacity:1; }
.process-step--v2:hover .process-step__watermark{
  color:rgba(232,200,122,0.16);
  transform:translate(-4px, 4px) scale(1.05);
}
.process-step--v2:hover .process-step__num{
  transform:scale(1.08) rotate(-3deg) !important;
  box-shadow:0 8px 26px -4px rgba(200,168,75,.55) !important;
}
.process-step--v2:hover .process-step__rule{ transform:scaleX(1); }

/* ─── Responsivo ─── */
@media (max-width: 980px){
  .home-process .process-track{
    flex-direction:column !important;
    gap:14px !important;
  }
  .home-process .process-track::before,
  .home-process .process-track__line{ display:none !important; }
  .home-process .process-step.process-step--v2{
    flex-direction:row;
    align-items:center;
    gap:18px;
    padding:18px 20px !important;
    text-align:left;
  }
  .home-process .process-step--v2 .process-step__watermark{
    font-size:90px;top:-10px;right:-4px;
  }
  .home-process .process-step--v2 > .process-step__num{ flex-shrink:0; }
  .home-process .process-step--v2 .process-step__title{
    flex-shrink:0;min-width:120px;
  }
  .home-process .process-step--v2 .process-step__desc{ flex:1; }
  .process-step--v2 .process-step__rule{
    inset-inline:20px;inset-block-end:8px;
  }
}

@media (prefers-reduced-motion: reduce){
  .process-step--v2,
  .process-step--v2::before,
  .process-step--v2 .process-step__watermark,
  .process-step--v2 .process-step__num,
  .process-step--v2 .process-step__rule{
    transition:none !important;
  }
}
