/* Step-by-step journey, scoped to the process section. */
.process { position: relative; overflow: hidden; background: #0e100e; }
.process-stage {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .86fr);
  align-items: center;
  gap: clamp(35px, 6vw, 95px);
  margin-top: clamp(30px, 4vw, 60px);
}
.process-visual {
  position: relative;
  isolation: isolate;
  display: grid;
  place-items: center;
  aspect-ratio: 1.45;
  min-height: 260px;
  overflow: hidden;
  background: radial-gradient(ellipse at 50% 50%, #302719 0%, #171710 38%, #10110e 75%);
}
.process-visual::before, .process-visual::after { content: ""; position: absolute; pointer-events: none; border-radius: 50%; }
.process-visual::before {
  width: 75%; height: 70%; left: 12.5%; top: 15%;
  background: radial-gradient(ellipse, rgba(205,165,93,.28), rgba(137,97,42,.10) 45%, transparent 72%);
  filter: blur(25px);
  animation: lp-process-glow 6s ease-in-out infinite;
}
.process-visual::after {
  width: 58%; height: 18%; left: 21%; bottom: 17%;
  background: radial-gradient(ellipse, rgba(0,0,0,.82), transparent 72%);
  filter: blur(9px);
}
.process-visual-icon {
  position: relative; z-index: 1;
  display: grid; place-items: center;
  width: clamp(125px, 13vw, 184px); aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 23%, rgba(235,207,151,.28), transparent 24%),
              radial-gradient(circle at 48% 36%, #544229 0%, #272115 44%, #0c0d0a 80%);
  box-shadow: inset 0 2px 3px rgba(253,228,177,.33), inset 0 -15px 20px rgba(0,0,0,.56),
              0 20px 35px rgba(0,0,0,.58), 0 0 42px rgba(202,159,87,.18);
  animation: lp-process-float 7s ease-in-out infinite;
}
.process-visual-icon i { color: #ebd19e; font-size: clamp(40px, 4.2vw, 58px); line-height: 1; text-shadow: 0 3px 8px #000, 0 0 19px rgba(233,190,109,.32); }
.process-counter { display: block; color: #c9ac74; font: 500 14px "Cormorant Garamond",serif; letter-spacing: .2em; }
.process-title { margin: 22px 0 16px; color: #f3eee3; font-size: clamp(25px, 2.5vw, 38px); line-height: 1.4; font-weight: 500; letter-spacing: -.05em; }
.process-copy { max-width: 370px; min-height: 3.8em; color: #b3afa3; font-size: 14px; line-height: 1.9; word-break: keep-all; }
.process-progress { width: min(100%, 280px); height: 2px; overflow: hidden; background: rgba(215,197,155,.16); margin-top: 30px; }
.process-progress span { display: block; height: 100%; width: 25%; background: #d2b57f; transition: width .65s cubic-bezier(.22,1,.36,1); }
.process-tabs { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; margin-top: clamp(35px, 5vw, 65px); }
.process-tabs button {
  appearance: none; display: flex; align-items: center; gap: 11px; text-align: left;
  min-height: 68px; padding: 16px 18px; border: 0; background: #1a1b16;
  color: #aaa69a; cursor: pointer; font: inherit; font-size: 13px;
  transition: background .25s, color .25s, transform .25s;
}
.process-tabs button[aria-pressed="true"] { background: #c6a971; color: #15130e; }
.process-tabs button span { font: 16px "Cormorant Garamond",serif; opacity: .72; }
.process-tabs button:hover { color: #f1d7a4; background: #29271e; }
.process-tabs button[aria-pressed="true"]:hover { color: #15130e; background: #d8bd88; }
.process-tabs button:focus-visible { outline: 2px solid #f0d59a; outline-offset: 3px; }
@keyframes lp-process-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes lp-process-glow { 0%,100% { opacity: .68; transform: scale(.96); } 50% { opacity: 1; transform: scale(1.05); } }
@media (max-width: 900px) {
  .process-stage { gap: 35px; }
  .process-visual-icon { width: clamp(120px, 19vw, 170px); }
  .process-tabs { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 600px) {
  .process-stage { grid-template-columns: 1fr; gap: 28px; }
  .process-visual { min-height: 210px; aspect-ratio: 1.5; }
  .process-visual-icon { width: clamp(112px, 32vw, 150px); }
  .process-visual-icon i { font-size: 42px; }
  .process-title { margin: 14px 0 10px; }
  .process-copy { min-height: 0; font-size: 13px; }
  .process-tabs { gap: 8px; margin-top: 32px; }
  .process-tabs button { min-height: 58px; padding: 13px 12px; font-size: 12px; gap: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .process-visual::before, .process-visual-icon { animation: none; }
  .process-progress span, .process-tabs button { transition: none; }
}

/* Pause decorative motion outside the viewport and after user interaction. */
.process-visual::before, .process-visual-icon { animation-play-state: paused; }
.process.is-in-view:not(.is-paused) .process-visual::before,
.process.is-in-view:not(.is-paused) .process-visual-icon { animation-play-state: running; }

/* The step is the focus: a clean luminous icon instead of a floating badge. */
.process-visual{border-radius:4px;background:radial-gradient(ellipse at 50% 50%,#302819 0%,#171710 44%,#10110e 78%)}.process-visual::after{display:none}.process-visual-icon{width:auto;aspect-ratio:auto;border-radius:0;background:none;box-shadow:none}.process-visual-icon i{font-size:clamp(65px,7vw,96px);filter:drop-shadow(0 8px 22px rgba(202,159,87,.35))}.process-tabs button{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;align-content:center}.process-tabs button span{grid-row:1 / 3;align-self:start;font-size:20px}.process-tabs button strong{font-size:14px;font-weight:600}.process-tabs button small{font-size:11px;line-height:1.6;opacity:.78;word-break:keep-all}.process-bottom{display:flex;justify-content:space-between;gap:25px;align-items:center;margin-top:36px}.process-bottom p{color:#9f9c91;font-size:11px;line-height:1.9}.process-bottom .button{flex-shrink:0}.process-toggle{margin-top:20px;padding:8px 0;background:transparent;color:#c9b58c;border:0;font-size:11px;cursor:pointer;text-decoration:underline;text-underline-offset:4px}.process-toggle:disabled{color:#8e897d;cursor:default;text-decoration:none}.process-toggle:focus-visible{outline:2px solid #f0d59a;outline-offset:4px}@media(max-width:600px){.process-visual-icon{width:auto}.process-visual-icon i{font-size:66px}.process-tabs button{min-height:80px;padding:14px 11px;gap:4px 7px}.process-tabs button span{font-size:17px}.process-tabs button strong{font-size:13px}.process-tabs button small{font-size:10px}.process-bottom{align-items:flex-start;flex-direction:column}.process-bottom .button{min-width:180px}}