/* FAQ and INDUSTRIES. Quiet, dark pages in the contact page's palette: no canvas, a still gradient behind,
   hairline rows, one green accent. Solid surfaces only. */
html:has(body[data-page=faq]),html:has(body[data-page=industries]){--bg:#030504;--fg:#EEF1EF;--fg2:#A9B0AC;--mute:#6F7672;--line:rgba(255,255,255,.12);background:#030504}
html:has(body[data-page=faq]) .brand img,html:has(body[data-page=industries]) .brand img{filter:invert(1)}
html:has(body[data-page=faq]) .links,html:has(body[data-page=industries]) .links{background:#111614;border-color:rgba(255,255,255,.08)}
html:has(body[data-page=faq]) .links a:hover,html:has(body[data-page=industries]) .links a:hover,
html:has(body[data-page=faq]) .talk,html:has(body[data-page=industries]) .talk{color:#0b0d0c}
body[data-page=faq],body[data-page=industries]{background:#030504 radial-gradient(80% 55% at 78% 8%,#0b2a1d 0%,#030504 62%) no-repeat;color:var(--fg);min-height:100vh}

.inf{--w:min(1320px,100% - 4rem);--g:#16C47F;position:relative;z-index:2;display:flex;flex-direction:column;min-height:100vh}
.inf section{width:var(--w);margin:0 auto;position:relative}
.inf em{font-style:normal;color:var(--g)}
.inf a:focus-visible,.inf button:focus-visible,.inf summary:focus-visible{outline:2px solid var(--g);outline-offset:4px}
.in-eye{display:flex;align-items:center;gap:.7rem;font-size:.9rem;font-weight:500;color:#CFD6D2}
.in-eye i{width:7px;height:7px;border-radius:50%;background:var(--g);box-shadow:0 0 12px 2px rgba(22,196,127,.55)}

/* hero */
.in-hero{min-height:clamp(440px,62vh,720px);display:flex;flex-direction:column;justify-content:flex-end;padding:9rem 0 4rem}
.in-hero .in-eye{margin-bottom:1.8rem}
.in-h{font-weight:500;font-size:clamp(2.8rem,5.2vw,4.9rem);line-height:.98;letter-spacing:-.055em;max-width:18ch}
.in-h .ln{display:block;overflow:hidden;padding:.04em 0 .12em;margin:-.04em 0 -.12em}
.in-h .ln>span{display:inline-block;will-change:transform}
.in-lede{max-width:34rem;color:var(--fg2);font-size:1.08rem;line-height:1.55;margin-top:1.8rem}
.in-lede a,.in-a a{color:var(--g);border-bottom:1px solid rgba(22,196,127,.35);transition:border-color .4s}
.in-lede a:hover,.in-a a:hover{border-color:var(--g)}

/* FAQ: one column of questions you can scan; answers open in place */
.in-faq{display:grid;grid-template-columns:4fr 8fr;gap:4rem;padding:2rem 0 10vh;align-items:start}
.in-faq aside{position:sticky;top:7.5rem;color:var(--fg2);font-size:.98rem;line-height:1.55;max-width:20rem}
.in-faq aside b{display:block;color:var(--fg);font-weight:500;font-size:1.25rem;letter-spacing:-.02em;margin-bottom:.6rem}
.in-faq aside a{color:var(--g)}
.in-qs{border-top:1px solid var(--line);grid-column:2}
.in-q{border-bottom:1px solid var(--line)}
.in-q summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:1.6rem 0;cursor:none;font-size:clamp(1.12rem,1.5vw,1.32rem);font-weight:500;letter-spacing:-.02em;line-height:1.3;transition:color .4s var(--e)}
.in-q summary::-webkit-details-marker{display:none}
.in-q summary:hover,.in-q[open] summary{color:var(--g)}
.in-q summary i{flex:none;position:relative;width:2.4rem;height:2.4rem;border-radius:50%;border:1px solid var(--line);transition:background .5s var(--e),border-color .5s,transform .6s var(--e)}
.in-q summary i:before,.in-q summary i:after{content:'';position:absolute;left:50%;top:50%;width:11px;height:1.5px;margin:-.75px 0 0 -5.5px;background:currentColor;border-radius:2px;transition:transform .6s var(--e)}
.in-q summary i:after{transform:rotate(90deg)}
.in-q[open] summary i{background:var(--g);border-color:var(--g);color:#03130b}
.in-q[open] summary i:after{transform:rotate(0)}
.in-q.closing summary{color:var(--fg)}
.in-q.closing summary i{background:none;border-color:var(--line);color:var(--fg)}
.in-q.closing summary i:after{transform:rotate(90deg)}
.in-a{overflow:hidden}
.in-a>div{padding:0 4rem 1.8rem 0;color:var(--fg2);font-size:1.02rem;line-height:1.65;max-width:46rem}
.in-a p+p,.in-a p+ul,.in-a ul+p{margin-top:.8rem}
.in-a ul{list-style:none;display:grid;gap:.45rem}
.in-a li{position:relative;padding-left:1.1rem}
.in-a li:before{content:'';position:absolute;left:0;top:.68em;width:5px;height:5px;border-radius:50%;background:var(--g)}
.in-a strong{color:var(--fg);font-weight:500}

/* INDUSTRIES: one row per industry */
.in-list{border-top:1px solid var(--line);margin-bottom:4rem}
.in-row{display:grid;grid-template-columns:5fr 7fr;gap:3rem;padding:2.6rem 0;border-bottom:1px solid var(--line)}
.in-row h2{font-weight:500;font-size:clamp(1.6rem,2.4vw,2.2rem);letter-spacing:-.04em;line-height:1.05}
.in-row .tg{color:var(--g);margin-top:.6rem;font-size:1rem}
.in-row p.d{color:var(--fg2);font-size:1.02rem;line-height:1.6;max-width:40rem}
.in-row ul{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.3rem}
.in-row li{padding:.5rem .95rem;border-radius:99px;background:#0E1412;border:1px solid rgba(255,255,255,.08);font-size:.9rem;color:#DDE2DF}
.in-row .go{display:inline-flex;align-items:center;gap:.5rem;margin-top:1.4rem;color:var(--fg);font-size:.95rem;border-bottom:1px solid var(--line);padding-bottom:.2rem;transition:color .4s,border-color .4s}
.in-row .go:hover{color:var(--g);border-color:var(--g)}

/* closing call to action */
.in-cta{padding:6rem 0 18vh;border-top:1px solid var(--line);display:grid;grid-template-columns:7fr 5fr;gap:3rem;align-items:end}
.in-faq+.in-cta{border-top:0}
.in-cta h2{font-weight:500;font-size:clamp(2rem,3.4vw,3.2rem);line-height:1.02;letter-spacing:-.045em;margin-top:1.4rem;max-width:16ch}
.in-cta p{color:var(--fg2);line-height:1.55;margin-bottom:1.8rem;max-width:26rem}
.in-btn{display:inline-flex;align-items:center;gap:1rem;background:var(--g);color:#03130b;padding:.55rem .6rem .55rem 1.6rem;border-radius:99px;font:500 1rem var(--d);box-shadow:0 10px 40px -12px rgba(22,196,127,.7);transition:box-shadow .5s var(--e)}
.in-btn i{display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:50%;background:#03130b;color:var(--g);font-style:normal;transition:transform .6s var(--e)}
.in-btn:hover{box-shadow:0 16px 60px -8px rgba(22,196,127,.95)}
.in-btn:hover i{transform:rotate(-45deg)}

@media (hover:none){.in-q summary{cursor:pointer}}
@media (max-width:900px){
  .inf{--w:calc(100% - 2.5rem)}
  .in-hero{min-height:56vh;padding:7rem 0 2.6rem}
  .in-h{font-size:clamp(2.4rem,11vw,3.4rem)}
  .in-faq{grid-template-columns:1fr;gap:2rem;padding:1rem 0 12vh}
  .in-faq aside{position:static}
  .in-qs{grid-column:1}
  .in-q summary{gap:1rem;padding:1.3rem 0}
  .in-q summary i{width:2.1rem;height:2.1rem}
  .in-a>div{padding-right:0}
  .in-row{grid-template-columns:1fr;gap:1.2rem;padding:2rem 0}
  .in-cta{grid-template-columns:1fr;gap:1rem;padding:4rem 0 12vh}
}
@media (prefers-reduced-motion:reduce){.in-q summary,.in-q summary i,.in-q summary i:before,.in-q summary i:after{transition:none}}
