/* ============================================================
   KAPTIS GROUP — homepage design language layer (CR spec)
   Lime #D2FA64 on near-black #0B0B0B / off-white #F4F3EF.
   Loaded ONLY by index.html after styles.css. Every rule is
   scoped under body.home — sub-pages never see this sheet.
   ============================================================ */

body.home{
  --accent:#D2FA64;
  --bg:#0B0B0B;
  --bg-alt:#F4F3EF;
  --ink:#F4F3EF;
  --text-invert:#0B0B0B;
  --mut:rgba(244,243,239,.55);
  --line:rgba(244,243,239,.18);
  --navy:#F4F3EF;          /* legacy var remapped so inherited bits go light */
  --phys-ink:#F4F3EF;      /* physics canvas: light glyphs */
  --phys-accent:#D2FA64;   /* physics canvas: lime shapes */
  background:var(--bg);
  color:var(--ink);
}
body.home a{color:var(--accent)}
body.home ::selection{background:var(--accent);color:#0B0B0B}
body.home .grain{opacity:.28}

/* ---------- labels: (01.) studio micro-details ---------- */
body.home .label{
  font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--mut);
}
body.home .label s{opacity:.45}
body.home .label span{color:var(--ink)}

/* ---------- header: transparent, blend-difference ---------- */
body.home .site-head{
  background:none;backdrop-filter:none;border-bottom:0;
  mix-blend-mode:difference;
}
body.home .site-head .brand{color:#fff}
body.home .site-head .brand span{color:#fff;font-weight:300}
body.home .site-nav{display:none}
body.home .site-head .btn-ghost{
  background:none;border-color:rgba(255,255,255,.4);color:#fff;
}
body.home .head-meta{
  display:flex;gap:2.2em;margin-left:auto;align-items:center;
  font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:#fff;
}
body.home .head-meta .loc-time{font-variant-numeric:tabular-nums}
@media (max-width:760px){body.home .head-meta .head-coords{display:none}}

/* ---------- buttons: pill + lime sweep ---------- */
body.home .btn{
  border-radius:999px;border:1px solid rgba(244,243,239,.45);
  color:var(--ink);background:transparent;overflow:hidden;
  padding:14px 28px;font-weight:500;position:relative;z-index:0;
  transition:color .3s ease-out;
}
body.home .btn::before{
  content:"";position:absolute;left:0;right:0;bottom:0;top:100%;
  background:var(--accent);z-index:-1;
  transition:top .3s ease-out;
}
body.home .btn:hover{color:#0B0B0B}
body.home .btn:hover::before{top:0}
body.home .btn:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
body.home .btn-pill{
  background:rgba(11,11,11,.35);backdrop-filter:blur(4px);
  border-color:rgba(244,243,239,.5);
}
body.home .btn-solid{background:var(--accent);border-color:var(--accent);color:#0B0B0B}
body.home .btn-solid::before{background:#0B0B0B}
body.home .btn-solid:hover{color:var(--accent)}

/* ---------- hero ---------- */
body.home .hero{border-bottom:1px solid var(--line)}
body.home .hero-bg{
  background:
    radial-gradient(52vw 46vh at 82% 12%,rgba(210,250,100,.07),transparent 62%),
    radial-gradient(60vw 50vh at 12% 88%,rgba(244,243,239,.05),transparent 60%);
  opacity:1;
}
body.home .hero::after{
  background:linear-gradient(180deg,transparent 55%,#0B0B0B 100%);
}
body.home .hero-kicker{color:var(--mut);letter-spacing:.22em}
body.home .wordmark{
  color:var(--ink);font-weight:500;
  font-size:clamp(3.5rem,11vw,11rem);
}
body.home .wordmark span + span{
  color:transparent;-webkit-text-stroke:2px var(--accent);
}
body.home .tagline{color:var(--ink);font-weight:300}
body.home .tagline strong{font-weight:500;color:var(--accent)}
body.home .scroll-cue{color:var(--mut)}
body.home .cue-line{background:linear-gradient(var(--accent),transparent)}

/* ---------- intro ---------- */
body.home .intro{position:relative}
body.home .intro-statement{color:var(--ink);overflow-wrap:anywhere}
body.home .intro-statement strong{font-weight:500;color:var(--accent)}
body.home .intro-time{
  position:absolute;top:clamp(80px,12vw,160px);right:var(--pad,72px);
  font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--mut);font-variant-numeric:tabular-nums;
}
@media (max-width:760px){body.home .intro-time{display:none}}

/* ---------- units ---------- */
body.home .unit{border-top:1px solid var(--line);color:var(--ink)}
body.home .unit:hover{background:rgba(244,243,239,.045)}
body.home .unit-no{color:var(--accent)}
body.home .unit-marquee{
  color:transparent;-webkit-text-stroke:1.5px rgba(244,243,239,.28);
}
body.home .unit:hover .unit-marquee{-webkit-text-stroke-color:var(--accent)}
body.home .unit-dev .unit-marquee{-webkit-text-stroke-color:rgba(244,243,239,.2)}
body.home .unit h3{color:var(--ink)}
body.home .unit li{color:var(--mut)}
body.home .unit li::before{color:var(--accent)}
body.home .unit:hover li{color:var(--ink)}
body.home .unit li:hover{color:var(--ink)}
body.home .unit-cta{color:var(--accent)}
body.home .unit-visual{
  box-shadow:0 18px 50px rgba(0,0,0,.5);
  outline:1px solid rgba(244,243,239,.12);outline-offset:-1px;
}
body.home .unit:hover .unit-visual{box-shadow:0 28px 80px rgba(0,0,0,.65)}

/* ---------- aspirations ---------- */
body.home .aspirations{border-top:1px solid var(--line)}
body.home .aspiration-marquee{color:var(--ink)}

/* ---------- contact: the light band ---------- */
body.home .contact{
  background:var(--bg-alt);color:#0B0B0B;
}
body.home .contact .label{color:rgba(11,11,11,.5)}
body.home .contact .label span{color:#0B0B0B}
body.home .contact h2{color:#0B0B0B}
body.home .contact h2 em{font-family:var(--serif);font-style:italic;font-weight:400}
body.home .contact-mail{
  color:rgba(11,11,11,.65);border-bottom-color:rgba(11,11,11,.3);
}
body.home .contact-mail:hover{color:#0B0B0B;border-bottom-color:#0B0B0B}

/* ---------- footer ---------- */
body.home .site-foot{border-top:1px solid var(--line)}
body.home .foot-nav a{color:var(--mut)}
body.home .foot-nav a:hover{color:var(--ink)}
body.home .foot-note{color:var(--mut)}
body.home .to-top{
  color:var(--mut);font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;
}
body.home .to-top:hover{color:var(--accent)}

/* ---------- modal (kept for deep links) ---------- */
body.home .modal{background:rgba(11,11,11,.6)}
body.home .modal-card{background:#161616;color:var(--ink);box-shadow:0 30px 80px rgba(0,0,0,.6)}
body.home .modal-card h2{color:var(--ink)}
body.home .modal-sub{color:var(--mut)}

/* ---------- page transition ---------- */
body.home .pg-trans{background:#0B0B0B}
body.home .pg-trans-word{color:var(--accent)}

/* ---------- cursor ---------- */
body.home .cur-ring{border-color:var(--accent)}
body.home .cur-ring.on{border-color:var(--accent)}

/* ---------- full-screen menu ---------- */
.fs-menu{
  position:fixed;inset:0;z-index:140;background:#0B0B0B;
  display:flex;flex-direction:column;
  padding:20px var(--pad,72px) 28px;
  clip-path:inset(0 0 100% 0);
  visibility:hidden;
  transition:clip-path .7s cubic-bezier(.76,0,.24,1),visibility 0s .7s;
}
.fs-menu.open{
  clip-path:inset(0 0 0% 0);visibility:visible;
  transition:clip-path .7s cubic-bezier(.76,0,.24,1),visibility 0s;
}
.fs-top{display:flex;align-items:center;justify-content:space-between}
.fs-top .brand{color:var(--ink);font-weight:700;font-size:20px;letter-spacing:-.02em}
.fs-top .brand span{color:var(--accent);font-weight:300;margin-left:.35em}
.fs-close{
  font-family:var(--sans);font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;
  background:none;border:1px solid rgba(244,243,239,.45);border-radius:999px;
  color:var(--ink);padding:12px 24px;cursor:pointer;
  transition:background .3s,color .3s;
}
.fs-close:hover{background:var(--accent);color:#0B0B0B;border-color:var(--accent)}
.fs-links{
  flex:1;display:flex;flex-direction:column;justify-content:center;
  gap:clamp(6px,1.4vh,16px);position:relative;
}
.fs-link{
  position:relative;display:flex;align-items:baseline;gap:.4em;
  font-size:clamp(2rem,6.5vw,6rem);font-weight:500;letter-spacing:-.02em;
  line-height:1.02;color:var(--ink);
  width:max-content;max-width:100%;
  transition:opacity .3s;
}
.fs-link .fs-no{
  font-size:.8rem;letter-spacing:.1em;color:var(--mut);
  align-self:center;margin-right:.6em;
}
.fs-link em{font-family:var(--serif);font-style:italic;font-weight:400}
.fs-links.hovering .fs-link{opacity:.3}
.fs-links.hovering .fs-link:hover{opacity:1}
.fs-link:hover{color:var(--accent)}
.fs-thumb{
  position:absolute;right:4vw;top:50%;transform:translateY(-50%) scale(.96);
  width:clamp(200px,24vw,380px);aspect-ratio:16/11;border-radius:12px;overflow:hidden;
  opacity:0;pointer-events:none;transition:opacity .35s,transform .35s;
  outline:1px solid rgba(244,243,239,.15);
}
.fs-link:hover .fs-thumb{opacity:1;transform:translateY(-50%) scale(1)}
.fs-thumb img{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:760px){.fs-thumb{display:none}}
.fs-foot{
  display:flex;align-items:center;gap:2em;flex-wrap:wrap;
  font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mut);
}
.fs-foot a{color:var(--ink)}
.fs-foot a:hover{color:var(--accent)}
.fs-foot .fs-mail{margin-left:auto}
@media (prefers-reduced-motion:reduce){
  .fs-menu{transition:none}
  .fs-menu.open{transition:none}
}
body.home.menu-open{overflow:hidden}