/* Core-technology / inner page styles. Globals live in style.css. */
:root{--max:1160px}
body{line-height:1.7}

  /* HERO */
  .phero{position:relative;overflow:hidden;padding:96px 0 90px;color:#fff}
  .phero-bg{position:absolute;inset:0;z-index:-2}
  .phero-bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);animation:zoom 18s ease-in-out infinite alternate}
  @keyframes zoom{to{transform:scale(1.14)}}
  .phero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(9,26,15,.9) 30%,rgba(9,26,15,.62) 70%,rgba(9,26,15,.4))}
  .crumb{font-size:.86rem;color:#cfe0d8;margin-bottom:16px}
  .crumb a:hover{color:var(--lime)}
  .phero h1{font-size:clamp(2.4rem,5vw,3.8rem);max-width:16ch;margin-bottom:18px}
  .phero p{font-size:1.14rem;color:#dbe8df;max-width:56ch;margin-bottom:30px}
  .phero .mini{display:flex;gap:14px;flex-wrap:wrap}
  .phero .mini .m{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:14px;padding:12px 20px;backdrop-filter:blur(6px)}
  .phero .mini .m b{font-family:var(--head);font-weight:600;font-size:1.5rem;display:block;line-height:1}
  .phero .mini .m span{font-size:.78rem;color:#cfe0d8}

  /* SECTIONS */
  section.sec{padding:72px 0;position:relative}
  .alt{background:var(--bg-2)}
  .shead{max-width:640px;margin-bottom:36px}
  .shead.c{margin:0 auto 44px;text-align:center}
  .shead h2{font-size:clamp(1.7rem,3vw,2.4rem);margin-bottom:12px}
  .shead h2 .g{display:inline}
  .lead-p{font-size:1.05rem;color:var(--muted);max-width:70ch}

  /* OVERVIEW + HOW split */
  .split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(34px,5vw,72px);align-items:center}
  .split .txt{position:relative}
  .step-badge{width:54px;height:54px;border-radius:15px;background:var(--accent-grad);color:#04140c;font-family:var(--head);font-weight:600;font-size:1.25rem;display:grid;place-items:center;margin-bottom:20px;box-shadow:0 12px 26px rgba(42,157,71,.35)}
  .figure{position:relative;isolation:isolate}
  .figure .frame{position:relative;border-radius:24px;overflow:hidden;border:7px solid #fff;box-shadow:0 30px 64px var(--shadow-lg)}
  .figure .frame img{width:100%;height:400px;object-fit:cover;transition:transform 1.1s cubic-bezier(.16,1,.3,1)}
  .figure:hover .frame img{transform:scale(1.06)}
  .figure .deco{position:absolute;z-index:-1;border-radius:28px;background:var(--accent-grad);opacity:.16;inset:26px -22px -22px 26px}
  .figure .dots{position:absolute;top:-18px;right:-14px;width:96px;height:96px;z-index:-1;background-image:radial-gradient(var(--green) 1.7px,transparent 1.7px);background-size:14px 14px;opacity:.4}
  .figure .fbadge{position:absolute;left:-20px;bottom:28px;z-index:2;background:#fff;border:1px solid var(--line);border-radius:16px;padding:13px 18px;display:flex;gap:13px;align-items:center;box-shadow:0 18px 42px var(--shadow-lg);animation:floaty 6s ease-in-out infinite}
  @keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
  .figure .fbadge .ic{width:44px;height:44px;flex:0 0 auto;border-radius:12px;background:var(--accent-grad);display:grid;place-items:center;font-size:21px;box-shadow:0 8px 18px rgba(42,157,71,.32)}
  .figure .fbadge b{font-family:var(--head);font-weight:600;font-size:1.15rem;display:block;line-height:1;color:var(--text)}
  .figure .fbadge small{font-size:.74rem;color:var(--muted)}
  .split.rev .figure{order:-1}
  .split.rev .figure .deco{inset:26px 26px -22px -22px}
  .split.rev .figure .dots{right:auto;left:-14px}
  .split.rev .figure .fbadge{left:auto;right:-20px}

  /* BENEFITS */
  .ben-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  .ben{display:flex;gap:14px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px 22px;transition:.25s}
  .ben:hover{border-color:rgba(42,157,71,.4);transform:translateY(-4px);box-shadow:0 16px 36px var(--shadow)}
  .ben .ck{flex:0 0 auto;width:34px;height:34px;border-radius:10px;background:var(--accent-grad);display:grid;place-items:center;box-shadow:0 8px 18px rgba(42,157,71,.3)}
  .ben .ck svg{width:16px;height:16px;stroke:#04140c}
  .ben p{font-size:.96rem}

  /* POWERING dark band */
  .power{background:linear-gradient(160deg,#0d2715,#17491f);color:#fff}
  .power .shead h2{color:#fff}
  .power .shead p{color:#a9c3b1}
  .power .eyebrow{color:var(--lime)}
  .power .eyebrow::before{background:var(--lime)}
  .pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
  .pcard{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:26px 22px;backdrop-filter:blur(4px);transition:.3s}
  .pcard:hover{transform:translateY(-6px);border-color:rgba(156,192,60,.5);background:rgba(255,255,255,.09)}
  .pcard .ic{width:54px;height:54px;border-radius:14px;background:var(--accent-grad);display:grid;place-items:center;font-size:25px;margin-bottom:16px;box-shadow:0 10px 24px rgba(42,157,71,.35)}
  .pcard .num{font-family:var(--head);font-weight:600;font-size:1.15rem;color:var(--lime);margin-bottom:4px}
  .pcard h3{font-size:1.08rem;margin-bottom:8px}
  .pcard p{font-size:.86rem;color:#a9c3b1}

  /* CTA */
  .cta{position:relative;overflow:hidden;background:var(--accent-grad);text-align:center;padding:70px 0}
  .cta::before{content:"";position:absolute;inset:0;background:var(--cta-img,none) center/cover;opacity:.14;mix-blend-mode:multiply}
  .cta h2{position:relative;color:#04140c;font-size:clamp(1.8rem,3.4vw,2.6rem);margin-bottom:22px;max-width:20ch;margin-inline:auto}
  .cta .btn{position:relative;background:#04140c;color:#eafff2}

  /* FOOTER */

  /* System chips (integrated platform page) */
  .sys{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:8px}
  .sys .chip{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:40px;padding:11px 20px;font-family:var(--head);font-weight:600;font-size:.92rem;transition:.25s}
  .sys .chip:hover{border-color:var(--green);transform:translateY(-4px);box-shadow:0 14px 30px var(--shadow)}
  .sys .chip .ic{width:32px;height:32px;border-radius:9px;background:var(--accent-grad);display:grid;place-items:center;font-size:16px}

  @media(max-width:820px){.split,.ben-grid,.pgrid{grid-template-columns:1fr}.split.rev .figure{order:0}.figure{margin-top:10px}.pgrid{grid-template-columns:1fr 1fr}}
  @media(max-width:520px){.pgrid{grid-template-columns:1fr}.ben[style]{grid-column:auto!important}}
