/* ================================================================
   SECTION 03 — IR METHOD
   Technical field, grid and glow are independent CSS layers.
   ================================================================ */

.method{min-height:880px;position:relative;isolation:isolate;overflow:hidden;padding:clamp(92px,9vw,140px) 0 120px;background:#050806}
.method::before{content:"IR METHOD";position:absolute;z-index:-1;left:-.02em;bottom:-.12em;white-space:nowrap;font:800 clamp(150px,22vw,360px)/.7 "Barlow Condensed",sans-serif;letter-spacing:-.055em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.035);pointer-events:none}
.method-grid-bg{position:absolute;z-index:-3;inset:0;opacity:1;background:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),radial-gradient(circle at 72% 45%,rgba(8,213,43,.14),transparent 28%);background-size:48px 48px,48px 48px,auto;mask-image:linear-gradient(90deg,rgba(0,0,0,.35),#000 42%,#000)}
.method-grid-bg::before{content:"";position:absolute;inset:10% 5% 8% 43%;border:1px solid rgba(8,213,43,.12);transform:perspective(900px) rotateX(61deg) rotateZ(-8deg);background:linear-gradient(90deg,transparent 49.8%,rgba(8,213,43,.13) 50%,transparent 50.2%),radial-gradient(circle at center,transparent 0 12%,rgba(8,213,43,.13) 12.2% 12.6%,transparent 12.8%);box-shadow:inset 0 0 90px rgba(8,213,43,.04)}
.method-grid-bg::after{content:"";position:absolute;width:42vw;aspect-ratio:1;right:2%;top:12%;border-radius:50%;background:radial-gradient(circle,rgba(8,213,43,.13),transparent 66%);filter:blur(18px)}

.method-layout{position:relative;display:grid;grid-template-columns:minmax(300px,.82fr) minmax(0,1.5fr);gap:clamp(50px,8vw,125px);align-items:start}
.method-layout>div:first-child{position:relative;z-index:2}
.method .section-label{color:#8e9890}
.method .section-title{width:max-content;max-width:100%;font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-size:clamp(61px,5.15vw,82px);font-weight:800;line-height:.86;letter-spacing:-.032em;text-wrap:balance}
.method .section-title em{font-style:normal;color:var(--green)}

.method-steps{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:start;gap:0;padding-top:48px}
.method-steps::before{content:"";position:absolute;left:6%;right:4%;top:94px;height:1px;background:linear-gradient(90deg,var(--green),rgba(8,213,43,.12));transform-origin:left}
.method-steps article{--step-y:0px;min-height:390px;position:relative;padding:20px 18px;border-left:1px solid rgba(255,255,255,.15);display:flex;flex-direction:column;background:linear-gradient(180deg,rgba(255,255,255,.025),transparent 65%);transform:translateY(var(--step-y));transition:border-color .25s ease,background-color .25s ease,transform .45s cubic-bezier(.2,.8,.2,1)}
.method-steps article:nth-child(2){--step-y:46px}
.method-steps article:nth-child(3){--step-y:92px}
.method-steps article:nth-child(4){--step-y:138px}
.method-steps article::before{content:"";position:absolute;left:-5px;top:42px;width:9px;height:9px;border:1px solid var(--green);border-radius:50%;background:#050806;box-shadow:0 0 0 5px rgba(8,213,43,.06)}
.method-steps article:hover{border-color:var(--green);background:rgba(8,213,43,.035);transform:translateY(calc(var(--step-y) - 8px))}
.method-steps span{font:700 14px var(--font-ui);color:var(--green)}
.method-steps article>i{width:100%;height:2px;margin:22px 0 82px;position:relative;background:rgba(255,255,255,.1);transform:none}
.method-steps article>i::after{content:"";position:absolute;inset:0 auto 0 0;width:36%;background:var(--green);transform-origin:left}
.method-steps small{text-transform:uppercase;font-size:7px;letter-spacing:.18em;color:#69736b}
.method-steps h3{margin:6px 0 13px;font:800 clamp(34px,3vw,47px)/.9 "Barlow Condensed",sans-serif;text-transform:uppercase}
.method-steps p{font-size:10px;line-height:1.62;color:#919a93}
.method-footer{position:relative;margin-top:145px;display:flex;align-items:center;gap:18px;text-transform:uppercase;font:700 8px var(--font-ui);letter-spacing:.14em;color:#747e76}
.method-footer i{flex:1;height:1px;background:linear-gradient(90deg,var(--green),rgba(255,255,255,.12));transform-origin:left}

@media (max-width:1050px){
  .method-layout{grid-template-columns:1fr;gap:40px}
  .method .section-title{max-width:720px}
  .method-steps{padding-top:20px}
  .method-footer{margin-top:135px}
}

@media (max-width:640px){
  .method{padding-block:82px;min-height:auto}
  .method-layout{width:calc(100% - 40px)}
  .method .section-title{font-size:clamp(48px,13.5vw,57px);line-height:.9}
  .method-grid-bg::before{inset:20% -40% 10% 20%}
  .method-steps{grid-template-columns:1fr 1fr;gap:10px}
  .method-steps::before{display:none}
  .method-steps article,.method-steps article:nth-child(n){--step-y:0px;min-height:285px;padding:17px;transform:none;border:1px solid rgba(255,255,255,.12)}
  .method-steps article::before{top:19px;left:auto;right:17px}
  .method-steps article>i{margin:18px 0 42px}
  .method-steps article:hover{transform:translateY(-5px)}
  .method-footer{display:none}
}
