/* pivot shared stylesheet. Every page links this. */

:root{
  --green:#9BF700; --grey:#8E9492; --bg:#0d0d0d;
  --line:rgba(255,255,255,.09); --line-strong:rgba(255,255,255,.16);
}
*{box-sizing:border-box}
::selection{background:var(--green);color:#0d0d0d}
html{scroll-behavior:smooth}
body{
  background:var(--bg); color:#fff; margin:0; font-weight:300;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
/* Tailwind is gone from this page, so the form honeypot needs its own rule.
   Without this the anti-spam field would be visible to real people. */
.hidden{display:none}

a{color:inherit}
h1,h2,h3{margin:0;font-weight:200;letter-spacing:-.035em;line-height:1.05;text-wrap:balance}
p{margin:0}
img{max-width:100%}

/* ---------- ambient field ---------- */
#field{position:fixed;inset:0;z-index:0;opacity:.45;pointer-events:none}
.glow{position:fixed;width:56vw;height:56vw;border-radius:50%;z-index:0;pointer-events:none;
      background:radial-gradient(circle,rgba(155,247,0,.13),transparent 68%);
      filter:blur(48px);top:-22vw;right:-14vw}

/* ---------- nav ---------- */
nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;
    justify-content:space-between;padding:1.1rem clamp(1.2rem,4vw,3rem);
    background:rgba(13,13,13,.88);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
nav img{height:2.5rem;width:auto;display:block}
@media(min-width:760px){nav img{height:3rem}}
.navlinks{display:flex;align-items:center;gap:1.6rem;font-size:.92rem;font-weight:400;color:#a8aea4}
.navlinks a{text-decoration:none;transition:color .2s;white-space:nowrap}
.navlinks a:hover,.navlinks a:focus-visible{color:#fff}

/* hamburger, shown only on narrow screens */
.menubtn{display:none;background:none;border:0;cursor:pointer;padding:.6rem;gap:5px;font-family:inherit;
         flex-direction:column;justify-content:center}
.menubtn span{display:block;width:22px;height:2px;background:#a8aea4;transition:background .2s}
.menubtn:hover span,.menubtn:focus-visible span{background:#fff}

@media(max-width:860px){
  nav{flex-wrap:wrap}
  .menubtn{display:flex}
  .navlinks{display:none;width:100%;flex-direction:column;align-items:flex-start;
            gap:0;margin-top:.9rem;border-top:1px solid var(--line)}
  .navlinks.open{display:flex}
  .navlinks a{width:100%;padding:1rem 0;border-bottom:1px solid var(--line);font-size:1rem}
  /* strip the trailing rule, but never from the button, which needs all four sides */
  .navlinks a:not(.navbtn):last-child{border-bottom:0}
  .navlinks a.navbtn{border:1px solid var(--green);width:auto;align-self:flex-start;
                     margin:1.1rem 0 .5rem;padding:.7rem 1.4rem;text-align:center}
}
.navbtn{color:var(--green);border:1px solid var(--green);padding:.52rem 1.15rem;
        font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;transition:all .2s}
.navbtn:hover,.navbtn:focus-visible{background:var(--green);color:#0d0d0d}

/* ---------- layout ---------- */
.sec{position:relative;z-index:2;max-width:78rem;margin:0 auto;padding:clamp(4rem,9vw,7rem) clamp(1.4rem,4vw,2.2rem)}
.sec + .sec{border-top:1px solid var(--line)}
#home{padding-top:clamp(7.5rem,14vw,10rem)}

.kicker{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--green);
        margin:0 0 1.8rem;font-weight:500}
h1{font-size:clamp(2.3rem,6.2vw,5rem);margin-bottom:1.7rem;max-width:19ch}
h1 em{font-style:normal;color:var(--green);font-weight:300}
h2{font-size:clamp(1.7rem,3.4vw,2.5rem);line-height:1.1;margin-bottom:1.5rem;max-width:24ch}
.lede{color:var(--grey);font-size:clamp(1rem,1.5vw,1.16rem);line-height:1.65;max-width:38rem}

/* ---------- situations ---------- */
.prompt{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:#6c716e;
        margin:clamp(2.6rem,5vw,4.4rem) 0 1.5rem;font-weight:500}
.cols{display:grid;grid-template-columns:1fr;gap:2.2rem}
@media(min-width:900px){.cols{grid-template-columns:1.15fr .85fr;gap:4.5rem;align-items:start}}
.list{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}
.item{border-bottom:1px solid var(--line)}
.btn{width:100%;background:none;border:0;padding:1.15rem 0;text-align:left;cursor:pointer;
     color:#9ea49b;font-family:inherit;font-size:clamp(1rem,1.4vw,1.14rem);font-weight:300;
     line-height:1.45;display:flex;gap:1.05rem;align-items:flex-start;transition:color .2s}
.btn:focus-visible{outline:none;color:#fff}
.dash{flex:none;width:16px;height:1px;background:#3d423b;margin-top:.8em;transition:background .2s,width .2s}
.item.on .btn,.btn:hover{color:#fff}
.item.on .dash,.btn:hover .dash{background:var(--green);width:28px}
.answer{min-height:6.5rem}
.answer p{color:#fff;font-size:1.02rem;line-height:1.75;font-weight:300;
          border-left:2px solid var(--green);padding-left:1.15rem;transition:opacity .18s ease}
@media(min-width:900px){.answer{min-height:0;position:sticky;top:6rem}}

/* ---------- buttons ---------- */
.cta{display:inline-flex;align-items:center;gap:.6rem;background:var(--green);color:#0d0d0d;
     text-decoration:none;font-weight:500;font-size:.88rem;padding:.95rem 1.75rem;
     transition:transform .18s,box-shadow .18s;border:0;cursor:pointer;font-family:inherit}
.cta:hover,.cta:focus-visible{transform:translateY(-2px);box-shadow:0 10px 30px -12px rgba(155,247,0,.5)}
.hero-cta{margin-top:clamp(2rem,4vw,3rem)}

/* ---------- Scott block ---------- */
.me{display:flex;align-items:center;gap:1.5rem;margin-top:clamp(3rem,6vw,5rem);
    padding-top:clamp(2rem,4vw,3rem);border-top:1px solid var(--line);max-width:38rem}
.me img{width:104px;height:104px;border-radius:50%;object-fit:cover;flex:none;display:block}
.me p{color:var(--grey);font-size:.93rem;line-height:1.65}
.me b{color:#fff;font-weight:400;display:block;margin-bottom:.3rem;font-size:1.02rem;letter-spacing:-.01em}

/* ---------- prose ---------- */
.prose p{color:var(--grey);font-size:clamp(1rem,1.5vw,1.14rem);line-height:1.8;max-width:40rem;margin-bottom:1.3rem}
.prose p:last-child{margin-bottom:0}
.prose b{color:#fff;font-weight:400}

/* ---------- service grid ---------- */
.svc{display:grid;grid-template-columns:1fr;margin-top:2.5rem;border-top:1px solid var(--line)}
@media(min-width:760px){.svc{grid-template-columns:1fr 1fr;column-gap:3rem}}
.svc div{padding:1.5rem 0;border-bottom:1px solid var(--line)}
.svc h3{margin:0 0 .45rem;font-size:1.04rem;font-weight:400;letter-spacing:-.012em;line-height:1.3}
.svc p{color:var(--grey);font-size:.94rem;line-height:1.62}

/* ---------- checklist ---------- */
.checks{display:grid;grid-template-columns:1fr;gap:1.5rem;margin-top:2.6rem}
@media(min-width:760px){.checks{grid-template-columns:1fr 1fr;gap:1.8rem 3rem}}
.checks div{border-left:2px solid rgba(155,247,0,.35);padding-left:1.15rem}
.checks h3{font-size:.99rem;font-weight:400;margin:0 0 .4rem;letter-spacing:-.01em;line-height:1.35}
.checks p{color:var(--grey);font-size:.92rem;line-height:1.62}

/* ---------- testimonials ---------- */
.quotes{display:grid;grid-template-columns:1fr;gap:1.6rem;margin-top:2.6rem}
@media(min-width:900px){.quotes{grid-template-columns:repeat(3,1fr);gap:2rem}}
.quote{border-left:2px solid rgba(155,247,0,.45);padding-left:1.3rem;display:flex;
       flex-direction:column;gap:.9rem}
.stars{display:flex;gap:.18rem;color:var(--green)}
.stars svg{display:block}
.quote p{color:#d6dad3;font-size:.98rem;line-height:1.7}
.quote footer{border:0;padding:0;position:static}
.quote cite{font-style:normal;color:#fff;font-size:.9rem;font-weight:400;display:block}
.quote span{color:#6c716e;font-size:.83rem;display:block;margin-top:.15rem}
.greview{display:inline-block;margin-top:2.4rem;color:var(--green);font-size:.9rem;
         text-decoration:none;border-bottom:1px solid rgba(155,247,0,.35);padding-bottom:2px}
.greview:hover,.greview:focus-visible{border-bottom-color:var(--green)}

/* ---------- faq ---------- */
.faq{margin-top:2.6rem;border-top:1px solid var(--line);max-width:46rem}
.faq div{border-bottom:1px solid var(--line);padding:1.5rem 0}
.faq h3{font-size:1.02rem;font-weight:400;margin:0 0 .6rem;letter-spacing:-.01em;line-height:1.4}
.faq p{color:var(--grey);font-size:.95rem;line-height:1.72}

/* ---------- contact ---------- */
.contact-grid{display:grid;grid-template-columns:1fr;gap:3rem}
@media(min-width:900px){.contact-grid{grid-template-columns:1fr 1fr;gap:4.5rem}}
.details{display:flex;flex-direction:column;gap:1rem;margin-top:2.4rem;font-size:.94rem}
.details div{display:flex;gap:1.1rem;align-items:flex-start}
.details span:first-child{color:var(--green);width:5rem;flex:none}
.details a,.details span:last-child{color:var(--grey);text-decoration:none;transition:color .2s}
.details a:hover,.details a:focus-visible{color:#fff}
form{display:flex;flex-direction:column;gap:1.2rem}
label{display:block;font-size:.68rem;color:var(--grey);letter-spacing:.14em;
      text-transform:uppercase;margin-bottom:.5rem}
input[type=text],input[type=email],textarea{
  width:100%;background:transparent;border:1px solid var(--line-strong);
  padding:.8rem 1rem;color:#fff;font-size:.94rem;font-family:inherit;font-weight:300;
  transition:border-color .2s}
input::placeholder,textarea::placeholder{color:rgba(255,255,255,.22)}
input:focus,textarea:focus{outline:none;border-color:var(--green)}
textarea{resize:vertical;min-height:7rem}
button[type=submit]{width:100%;justify-content:center;letter-spacing:.14em;
                    text-transform:uppercase;font-size:.72rem;font-weight:600;padding:1.1rem}

/* ---------- footer ---------- */
footer{position:relative;z-index:2;border-top:1px solid var(--line);
       padding:2rem clamp(1.4rem,4vw,2.2rem)}
.footin{max-width:72rem;margin:0 auto;display:flex;flex-direction:column;align-items:center;
        gap:1.2rem;font-size:.78rem;color:var(--grey);text-align:center}
@media(min-width:760px){.footin{flex-direction:row;justify-content:space-between;text-align:left}}
.footin img{height:1.75rem;width:auto}
.footin a{text-decoration:none;transition:color .2s}
.footin a:hover,.footin a:focus-visible{color:#fff}
.social{display:flex;align-items:center;gap:1.35rem}
.social a{display:inline-flex;align-items:center;color:var(--grey);transition:color .2s}
.social a:hover,.social a:focus-visible{color:#fff}
.social svg{display:block}

/* ---------- scroll reveal ---------- */
.rev{opacity:0;transform:translateY(22px);
     transition:opacity .7s cubic-bezier(.2,.6,.2,1),transform .7s cubic-bezier(.2,.6,.2,1)}
.rev.in{opacity:1;transform:none}
.rev.d1{transition-delay:.09s}.rev.d2{transition-delay:.18s}.rev.d3{transition-delay:.27s}

:focus-visible{outline:2px solid var(--green);outline-offset:3px}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important;animation:none!important}
  .rev{opacity:1!important;transform:none!important}
}

/* ================= interior pages ================= */
.crumb{display:inline-flex;align-items:center;gap:.5rem;color:var(--grey);font-size:.84rem;
       text-decoration:none;margin-bottom:2.2rem;transition:color .2s}
.crumb:hover,.crumb:focus-visible{color:#fff}

/* article */
.article{max-width:39rem;margin:0 auto;padding:clamp(7rem,13vw,9.5rem) clamp(1.4rem,5vw,2rem) 4rem;
         position:relative;z-index:2}
.article h1{font-size:clamp(2rem,5.2vw,3.1rem);line-height:1.07;margin-bottom:1.4rem;max-width:none}
.article .meta{color:#6c716e;font-size:.86rem;margin:0 0 3.2rem;padding-bottom:2rem;border-bottom:1px solid var(--line)}
.article p{color:#c9cec5;font-size:1.06rem;line-height:1.78;margin:0 0 1.5rem}
.article strong{color:#fff;font-weight:400}
.article h2{font-size:1.42rem;line-height:1.25;letter-spacing:-.022em;font-weight:300;color:#fff;
            margin:3.1rem 0 1.1rem;display:flex;gap:.85rem;align-items:baseline;max-width:none}
.article h2.plain{display:block}
.article .num{color:var(--green);font-size:.95rem;font-weight:400;flex:none;font-variant-numeric:tabular-nums}
.article .ask{border-left:2px solid var(--green);padding-left:1.1rem;color:#fff;font-size:1rem;margin:1.7rem 0 0}
.article hr{border:0;height:1px;background:var(--line);margin:3.2rem 0}
.qlist{counter-reset:q;list-style:none;margin:1.8rem 0 1.5rem;
       border:1px solid rgba(155,247,0,.28);background:rgba(155,247,0,.04);padding:1.8rem 1.9rem}
.qlist li{counter-increment:q;position:relative;padding-left:2.1rem;margin-bottom:1rem;
          color:#e2e6de;font-size:1rem;line-height:1.6}
.qlist li:last-child{margin-bottom:0}
.qlist li::before{content:counter(q);position:absolute;left:0;top:.05em;color:var(--green);
                  font-size:.85rem;font-variant-numeric:tabular-nums}

/* interior page shell */
.page{position:relative;z-index:2;max-width:52rem;margin:0 auto;
      padding:clamp(7rem,13vw,9.5rem) clamp(1.4rem,4vw,2.2rem) 4rem}
.page h1{font-size:clamp(2.1rem,5.4vw,3.4rem);margin-bottom:1.5rem;max-width:16ch}
.page .lede{max-width:40rem}
.page .prose p{max-width:40rem}
.steps{display:flex;flex-direction:column;gap:0;margin-top:2.6rem;border-top:1px solid var(--line)}
.steps > div{padding:1.5rem 0;border-bottom:1px solid var(--line);display:grid;gap:.3rem .9rem;
           grid-template-columns:1fr}
@media(min-width:760px){.steps > div{grid-template-columns:8rem 1fr;align-items:start}}
.steps b{color:var(--green);font-weight:400;font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;
         padding-top:.25rem}
.steps h3{margin:0 0 .35rem;font-size:1.04rem;font-weight:400;letter-spacing:-.012em}
.steps p{color:var(--grey);font-size:.95rem;line-height:1.65;margin:0}
.callout{border-left:2px solid var(--green);padding-left:1.3rem;margin:2.6rem 0;max-width:40rem}
.callout p{color:#fff;font-size:1.04rem;line-height:1.7;margin:0}