/* =====================================================================
   PlantOS website v2 — light and calm: near-white pages with a faint green glow and grid,
   dark headlines with one green accent phrase, white floating figure cards, pill buttons.
   Green is for accents and actions only, never for large areas.
   Loaded after plantos.css.
   ===================================================================== */
:root{--glow:#E8F5E9;--accent:#2E7D32;--accent-2:#43A047;--card-shadow:0 24px 50px -24px rgba(15,23,42,.28),0 2px 6px rgba(15,23,42,.04)}
body{background:radial-gradient(1100px 520px at 100% -80px,var(--glow),transparent 62%),radial-gradient(800px 420px at -10% 0,#F4F8F5,transparent 60%),var(--bg)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--glow:#10251A}}
:root[data-theme="dark"]{--glow:#10251A}
.btn{border-radius:999px}
.btn-primary{background:var(--accent);box-shadow:0 8px 20px -8px rgba(46,125,50,.55)}
.btn-primary:hover{background:var(--g-800)}
.btn-secondary{background:var(--surface);border:1px solid var(--line-strong)}
.site-header{background:rgba(255,255,255,.82);backdrop-filter:saturate(1.4) blur(12px)}
:root[data-theme="dark"] .site-header{background:rgba(10,16,28,.82)}

/* kicker: ● MEASURED, NOT ESTIMATED */
.kicker{display:inline-flex;align-items:center;gap:10px;color:var(--accent);font-weight:800;letter-spacing:.12em;font-size:13px;text-transform:uppercase}
.kicker::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--accent-2);box-shadow:0 0 0 5px rgba(67,160,71,.16);animation:kpulse 2.4s ease-in-out infinite}
@keyframes kpulse{50%{box-shadow:0 0 0 9px rgba(67,160,71,.06)}}
.display em,.h2 em,h1 em,h2 em{font-style:normal;color:var(--accent)}
.display{font-weight:850;letter-spacing:-.04em;line-height:1.02}

/* faint grid behind hero sections */
.gridbg{position:relative}
.gridbg::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(15,23,42,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(15,23,42,.045) 1px,transparent 1px);
  background-size:48px 48px;-webkit-mask-image:radial-gradient(ellipse at 70% 40%,#000 20%,transparent 70%);mask-image:radial-gradient(ellipse at 70% 40%,#000 20%,transparent 70%)}

/* ---------- v2 hero ---------- */
.hero2{padding:56px 0 80px;overflow:hidden}
.hero2 .split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:40px;align-items:center}
.hero2 h1{font-size:clamp(40px,5.2vw,66px);margin:18px 0 18px}
.hero2 .lead{font-size:19px;color:var(--ink-2);max-width:34em}
.hero2 .btn-row{margin-top:28px}
.hero2 .site{margin-top:14px;color:var(--ink-3);font-weight:600}
@media (max-width:980px){.hero2 .split{grid-template-columns:1fr}.hero2{padding-top:28px}}

.stage{position:relative;min-height:520px}
.stage .browser{position:absolute;right:-60px;top:20px;width:640px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:0 40px 80px -30px rgba(15,23,42,.35);overflow:hidden}
.stage .browser .bar{height:36px;display:flex;align-items:center;gap:7px;padding:0 14px;border-bottom:1px solid #EEF2F7;background:#FBFCFB}
.stage .browser .bar i{width:10px;height:10px;border-radius:50%;background:#CBD5E1}
.stage .browser .bar span{margin-left:10px;font-size:12px;color:#64748B}
.stage .browser img{display:block;width:100%;height:auto}
.shots .frame img{height:auto}
.stage .phone{position:absolute;right:18px;top:120px;width:220px;border-radius:34px;background:#0F172A;padding:9px;box-shadow:0 40px 70px -25px rgba(15,23,42,.55);transform:rotate(3deg)}
.stage .phone img{display:block;width:100%;height:auto;border-radius:26px}
.fcard{position:absolute;display:flex;gap:14px;align-items:center;background:rgba(255,255,255,.96);border:1px solid var(--line);border-radius:18px;padding:14px 18px;box-shadow:var(--card-shadow);z-index:3;color:#0F172A}
.fcard .ic{width:46px;height:46px;border-radius:12px;background:var(--accent);display:flex;align-items:center;justify-content:center;flex:none}
.fcard .ic svg{width:24px;height:24px;stroke:#fff;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.fcard .l{font-size:13.5px;color:#475569}.fcard .v{font-size:24px;font-weight:800;letter-spacing:-.02em;line-height:1.15;font-variant-numeric:tabular-nums}
.fcard .n{font-size:13px;font-weight:600;color:var(--accent)}
.fcard.live .l::after{content:" · live";color:var(--accent);font-weight:700}
.stage .f1{left:-10px;bottom:30px}.stage .f2{left:40px;top:0}
@media (max-width:980px){.stage{min-height:0;margin:10px 0 40px}.stage .browser{position:relative;right:auto;width:100%;top:0}.stage .phone{width:150px;right:-6px;top:auto;bottom:-10px}.stage .f2{top:-16px;left:8px}.stage .f1{left:8px;bottom:-24px}}
@media (max-width:560px){.fcard .v{font-size:19px}.fcard{padding:10px 12px}.fcard .ic{width:38px;height:38px}}

/* ---------- story at a glance ---------- */
.story{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;counter-reset:st;position:relative}
.story::before{content:"";position:absolute;left:6%;right:6%;top:30px;height:2px;background:linear-gradient(90deg,var(--line),var(--g-300),var(--line))}
.story .st{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:22px;box-shadow:0 18px 40px -30px rgba(15,23,42,.35)}
.story .st .when{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.story .st h3{margin:8px 0 6px;font-size:21px}.story .st p{color:var(--ink-2);font-size:15px}
.story .st .fig{margin-top:14px;padding-top:12px;border-top:1px dashed var(--line);font-weight:800;font-size:22px;font-variant-numeric:tabular-nums}
.story .st .fig small{display:block;font-size:12.5px;font-weight:500;color:var(--ink-3)}
.story .dot{width:44px;height:44px;border-radius:14px;background:var(--surface);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;margin-bottom:12px;color:var(--accent);box-shadow:var(--shadow)}
@media (max-width:900px){.story{grid-template-columns:1fr 1fr}.story::before{display:none}}
@media (max-width:560px){.story{grid-template-columns:1fr}}

/* ---------- live banner ---------- */
.livebar{background:var(--surface);border:1px solid var(--line);border-radius:26px;padding:26px;box-shadow:0 30px 70px -40px rgba(15,23,42,.35)}
.livebar .top{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
.livebar .tabs2{display:flex;gap:6px;flex-wrap:wrap}.livebar .tabs2 button{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:6px 14px;font-size:14px;cursor:pointer}
.livebar .tabs2 button[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.livebar .tiles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-top:18px}
.livebar .tile{border:1px solid var(--line);border-radius:16px;padding:16px;background:var(--bg-soft)}
.livebar .tile .k{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.livebar .tile .v{font-size:28px;font-weight:800;letter-spacing:-.02em;margin-top:6px;font-variant-numeric:tabular-nums;transition:color .3s}
.livebar .tile .v small{font-size:13px;font-weight:600;color:var(--ink-3)}
.livebar .tile .v.flash{color:var(--accent)}
.livebar .meter{height:8px;border-radius:99px;background:var(--line);margin-top:10px;overflow:hidden}.livebar .meter i{display:block;height:100%;background:var(--accent);border-radius:99px;transition:width .6s}
.livebar .meter.warn i{background:#F59E0B}
.livechip{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--ink-2)}
.livechip::before{content:"";width:8px;height:8px;border-radius:50%;background:#22C55E;animation:blink 1.2s steps(2,start) infinite}
@keyframes blink{to{visibility:hidden}}
@media (max-width:900px){.livebar .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- screenshot tour ---------- */
.shots{display:grid;grid-template-columns:240px minmax(0,1fr);gap:26px;align-items:start}
.shots .list{display:grid;gap:8px}.shots .list button{text-align:left;border:1px solid transparent;background:none;border-radius:14px;padding:12px 14px;cursor:pointer}
.shots .list button b{display:block;font-size:16px}.shots .list button span{font-size:13.5px;color:var(--ink-3)}
.shots .list button[aria-selected="true"]{background:var(--surface);border-color:var(--line);box-shadow:var(--shadow)}
.shots .frame{border-radius:18px;border:1px solid var(--line);overflow:hidden;background:#fff;box-shadow:0 40px 80px -40px rgba(15,23,42,.4)}
.shots .frame img{display:block;width:100%;height:auto}
@media (max-width:900px){.shots{grid-template-columns:1fr}.shots .list{grid-auto-flow:column;overflow-x:auto}}

/* ---------- animated code ---------- */
.codewin{background:#0B1220;color:#CBD5E1;border-radius:20px;overflow:hidden;box-shadow:0 40px 80px -40px rgba(15,23,42,.6);font:13.5px/1.65 var(--mono)}
.codewin .bar{display:flex;gap:7px;align-items:center;padding:12px 16px;background:#0F172A;border-bottom:1px solid #1E293B}
.codewin .bar i{width:10px;height:10px;border-radius:50%;background:#334155}.codewin .bar span{margin-left:8px;color:#64748B;font-size:12px}
.codewin pre{margin:0;padding:18px 20px;min-height:340px;white-space:pre-wrap;word-break:break-word}
.codewin .k{color:#86EFAC}.codewin .s{color:#FDE68A}.codewin .c{color:#64748B}.codewin .n{color:#93C5FD}
.codewin .cur{display:inline-block;width:8px;height:16px;background:#86EFAC;vertical-align:-3px;animation:blink 1s steps(2,start) infinite}

/* ---------- people (photos) ---------- */
.people{display:grid;grid-template-columns:1.3fr 1fr 1fr;grid-template-rows:220px 220px;gap:14px}
.people figure{margin:0;position:relative;border-radius:20px;overflow:hidden;background:var(--sunken)}
.people figure:first-child{grid-row:span 2}
.people img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.85) contrast(1.02)}
.people figure::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(15,23,42,.55)),linear-gradient(135deg,rgba(46,125,50,.10),transparent 60%)}
.people figcaption{position:absolute;left:14px;bottom:12px;right:14px;color:#fff;font-size:13.5px;font-weight:600;z-index:2}
@media (max-width:820px){.people{grid-template-columns:1fr 1fr;grid-template-rows:200px 200px 200px}.people figure:first-child{grid-column:span 2;grid-row:auto}}

/* ---------- industry pages: faint photo behind the page hero ---------- */
.page-hero.photo{position:relative;overflow:hidden}
.page-hero.photo::after{content:"";position:absolute;inset:0;background-image:var(--bgimg);background-size:cover;background-position:center;opacity:.10;filter:grayscale(.3);z-index:-1;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 55%);mask-image:linear-gradient(90deg,transparent 0%,#000 55%)}
.page-hero.photo{isolation:isolate}

/* ---------- light CTA band (replaces the dark green band) ---------- */
.cta-band{background:var(--surface)!important;color:var(--ink)!important;border:1px solid var(--line);box-shadow:0 40px 80px -50px rgba(15,23,42,.45)}
.cta-band::before,.cta-band::after{opacity:.6}
.cta-band h2{color:var(--ink)!important}.cta-band p{color:var(--ink-2)!important}
.cta-band .btn-secondary{color:var(--ink)!important;border-color:var(--line-strong)!important}

/* ---------- small things ---------- */
.feature-card{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:24px;box-shadow:0 20px 50px -40px rgba(15,23,42,.4);text-decoration:none;color:inherit;display:block}
.feature-card:hover{border-color:var(--g-300)}
.feature-card .h3{margin:10px 0 6px}
.social{display:flex;gap:10px;margin-top:6px}
.social a{width:36px;height:36px;border-radius:10px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--ink-2)}
.social a:hover{color:var(--accent);border-color:var(--g-300)}
.social svg{width:18px;height:18px;fill:currentColor}
.score{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;align-items:end;height:170px}
.score div{background:linear-gradient(180deg,var(--g-400),var(--accent));border-radius:8px 8px 3px 3px;position:relative}
.score div span{position:absolute;bottom:-22px;left:0;right:0;text-align:center;font-size:11.5px;color:var(--ink-3)}
.price-toggle{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:4px;background:var(--surface)}
.price-toggle button{border:0;background:none;border-radius:999px;padding:7px 16px;cursor:pointer;font-weight:600}
.price-toggle button[aria-pressed="true"]{background:var(--ink);color:#fff}

/* v1 classes in the v2 look */
.muted-part{color:var(--accent)!important}
.eyebrow{display:inline-flex;align-items:center;gap:10px;color:var(--accent)!important;font-weight:800!important;letter-spacing:.12em;font-size:13px!important;text-transform:uppercase;background:none!important;border:0!important;padding:0!important}
.eyebrow::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--accent-2);box-shadow:0 0 0 5px rgba(67,160,71,.16)}
.tier .price{display:block}.tier .price b{font-size:32px;white-space:nowrap;display:block}.tier .price span{display:block;font-size:13px;color:var(--ink-3)}