body.page-home #field{ opacity:0.9; }

/* ---------- HERO ---------- */
.hero{ min-height:100vh; display:flex; flex-direction:column; justify-content:center; padding:120px clamp(24px,6vw,64px) 60px; max-width:1180px; margin:0 auto; }
.hero-symbol{ position:relative; width:100px; height:64px; margin-bottom:30px; }
.hero-symbol img{ width:100%; height:100%; animation:float 6s ease-in-out infinite; filter:drop-shadow(0 0 30px rgba(139,92,246,0.35)); }
@keyframes float{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-6px); } }

.hero h1{ font-size:clamp(2.6rem, 6vw, 4.6rem); max-width:16ch; margin-top:26px; color:var(--ink); }
.hero h1 .grad{ background:var(--grad-primary); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero p.sub{ margin-top:22px; max-width:52ch; font-size:1.08rem; }
.hero-cta{ margin-top:38px; display:flex; align-items:center; gap:28px; flex-wrap:wrap; }
.hero-cta .btn-primary{ padding:15px 28px; font-size:0.9rem; }
.explore{ font-size:0.9rem; color:var(--ink); border-bottom:1px solid var(--line); padding-bottom:2px; }

.scroll-hint{
  position:absolute; bottom:34px; left:50%; transform:translateX(-50%);
  font-family:'IBM Plex Mono', monospace; font-size:0.65rem; letter-spacing:0.2em; color:var(--muted);
  display:flex; flex-direction:column; align-items:center; gap:10px;
}
.scroll-hint .stem{ width:1px; height:32px; background:linear-gradient(var(--blue), transparent); animation:drop 2.2s ease-in-out infinite; }
@keyframes drop{ 0%{opacity:0.15;} 50%{opacity:1;} 100%{opacity:0.15;} }

/* ---------- SERVICE ROWS ---------- */
.services{ padding:40px 0; }
.row{
  display:grid; grid-template-columns:0.85fr 1fr; align-items:center; gap:clamp(24px,6vw,80px);
  max-width:1180px; margin:0 auto; padding:min(13vh,140px) clamp(24px,6vw,64px);
  border-top:1px solid var(--line);
}
.row.reverse .visual{ order:2; }
.row.reverse .copy{ order:1; }

.visual{ display:flex; align-items:center; justify-content:center; position:relative; }
.visual img{ height:min(100vh, 200px); width:auto; filter:drop-shadow(0 0 36px var(--glow)); }
.visual::after{
  content:''; position:absolute; inset:-14%;
  background:radial-gradient(circle at center, var(--glow), transparent 70%);
  opacity:0.35; z-index:-1;
}

.index{ font-family:'IBM Plex Mono', monospace; font-size:0.72rem; letter-spacing:0.1em; color:var(--accent); }
.copy h2{ font-size:clamp(1.6rem, 3vw, 2.2rem); margin:14px 0 16px; color:var(--ink); }
.copy p{ max-width:42ch; }
.copy .tags{ margin-top:22px; display:flex; gap:10px; flex-wrap:wrap; }
.tag{
  font-family:'IBM Plex Mono', monospace; font-size:0.66rem; letter-spacing:0.05em;
  padding:6px 12px; border:1px solid var(--line); color:var(--muted); border-radius:20px;
}
.tag.on{ color:var(--accent); border-color:color-mix(in srgb, var(--accent) 45%, transparent); }

@media (max-width:760px){
  .row{ grid-template-columns:1fr; text-align:left; padding:70px 22px; }
  .row.reverse .visual{ order:1; } .row.reverse .copy{ order:2; }
  .visual img{ width:min(190px, 55%); height:auto; }
}