/* Woodcock AI: waste & recycling hub. Mobile-first; builds on installers.css. */
.wr-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:26px}
.wr-stat{display:flex;flex-direction:column;gap:6px;padding:16px;border-radius:var(--r2);background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01));border:1px solid var(--line);min-width:0}
.wr-stat b{font:800 clamp(28px,8vw,44px)/1 var(--h);letter-spacing:-.03em;background:linear-gradient(135deg,#ffb36b,var(--ember));-webkit-background-clip:text;background-clip:text;color:transparent}
.wr-stat span{font-size:13.5px;color:var(--muted);line-height:1.4}
.wr-stat a{margin-top:auto;font-size:12px;color:var(--dim);text-decoration:underline;text-underline-offset:2px}
/* yard map */
.wm{display:grid;gap:14px;margin-top:26px}
.wm-stage{position:relative;border-radius:20px;overflow:hidden;border:1px solid var(--line2);background:#05080c;aspect-ratio:1521/960;box-shadow:0 30px 80px -40px rgba(0,0,0,.9)}
.wm-stage img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.05) brightness(1.08)}
.wm-note{position:absolute;right:8px;bottom:8px;font-size:10.5px;color:rgba(255,255,255,.55);background:rgba(0,0,0,.45);padding:3px 7px;border-radius:6px}
.wm-pin{position:absolute;transform:translate(-50%,-50%);width:44px;height:44px;border:0;background:none;cursor:pointer;display:grid;place-items:center;padding:0}
.wm-pin span{position:relative;z-index:1;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font:800 12.5px/1 var(--h);color:#04161a;background:linear-gradient(135deg,var(--teal2),var(--teal));box-shadow:0 0 0 3px rgba(4,22,26,.6);transition:transform .2s}
.wm-pin i{position:absolute;width:26px;height:26px;border-radius:50%;background:rgba(79,212,208,.45);animation:wmPing 2.2s infinite}
.wm-pin[aria-pressed=true] span{transform:scale(1.18);color:#fff;background:linear-gradient(135deg,#ff8a3d,#ff4d2e)}
.wm-pin[aria-pressed=true] i{background:rgba(255,106,43,.5)}
@keyframes wmPing{0%{transform:scale(1);opacity:.9}80%,100%{transform:scale(2.2);opacity:0}}
.wm-side{display:grid;gap:12px;min-width:0}
.wm-chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px;scroll-snap-type:x mandatory}
.wm-chips::-webkit-scrollbar{display:none}
.wm-chip{flex:none;scroll-snap-align:start;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px 0 8px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--muted);font:600 13.5px/1 var(--h);cursor:pointer;white-space:nowrap}
.wm-chip .n{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:rgba(79,212,208,.15);color:var(--teal2);font-size:12px}
.wm-chip[aria-pressed=true]{color:#fff;border-color:rgba(255,120,60,.55);background:rgba(255,106,43,.12)}
.wm-chip[aria-pressed=true] .n{background:linear-gradient(135deg,#ff8a3d,#ff4d2e);color:#fff}
.wm-panel{padding:18px;border-radius:var(--r2);background:linear-gradient(180deg,rgba(17,26,36,.92),rgba(9,15,22,.96));border:1px solid var(--line2);min-height:260px}
.wm-panel.in{animation:inFade .35s ease}
.wm-panel h3{display:flex;align-items:center;gap:10px;font:800 21px/1.15 var(--h);margin-bottom:8px}
.wm-panel h3 svg{width:34px;height:34px;padding:7px;border-radius:10px;flex:none;color:#fff;background:linear-gradient(135deg,#ff8a3d,#ff4d2e)}
.wm-panel p{color:var(--muted);font-size:15px;margin-bottom:12px}
.wm-panel h4{font:700 12px/1 var(--h);letter-spacing:.12em;text-transform:uppercase;color:var(--teal2);margin:6px 0 10px}
.wm-panel ul{list-style:none;display:grid;gap:8px;margin-bottom:14px}
.wm-panel li{display:flex;gap:10px;font-size:14.5px;color:#dbe5ec}
.wm-panel li svg{width:18px;height:18px;flex:none;margin-top:2px;color:var(--teal2)}
.wm-mods{display:flex;flex-wrap:wrap;gap:6px}
.wm-mods span{font:600 12.5px/1 var(--h);padding:8px 10px;border-radius:999px;background:rgba(79,212,208,.1);border:1px solid rgba(79,212,208,.3);color:#cdeff0}
/* lithium */
.wr-li-grid{display:grid;gap:24px}
.wr-li-grid>*{min-width:0}
.wr-list{list-style:none;display:grid;gap:12px;margin:22px 0 16px}
.wr-list li{display:flex;gap:12px;padding:14px;border-radius:var(--r2);border:1px solid var(--line);background:rgba(255,255,255,.02)}
.wr-list .ic{width:38px;height:38px;border-radius:11px;flex:none;display:grid;place-items:center;background:rgba(79,212,208,.12);color:var(--teal2)}
.wr-list .ic.hot{background:rgba(255,106,43,.14);color:#ff9a5a}
.wr-list .ic svg{width:20px;height:20px}
.wr-list b{display:block;font:700 15.5px/1.25 var(--h);color:#fff;margin-bottom:3px}
.wr-list span{font-size:14.5px;color:var(--muted)}
.wr-fine{display:flex;gap:8px;font-size:13px;color:var(--dim);line-height:1.5}
.wr-fine svg{width:16px;height:16px;flex:none;margin-top:2px;color:#ffb36b}
.wr-li-fig{position:relative;border-radius:var(--r2);overflow:hidden;border:1px solid var(--line2)}
.wr-li-fig img{width:100%;height:auto;display:block;aspect-ratio:8/5;object-fit:cover}
.wr-li-fig figcaption .in-alert{position:absolute}
/* timeline */
.tl{display:grid;gap:18px;margin-top:26px}
.tl>*{min-width:0}
.tl-phone{position:sticky;top:76px;z-index:2;justify-self:center;width:min(100%,340px);padding:8px;border-radius:26px;background:#0b1118;border:1px solid var(--line2);box-shadow:0 30px 70px -30px rgba(0,0,0,.9)}
.tl-screen{position:relative;border-radius:19px;overflow:hidden;aspect-ratio:16/10;background:#000}
.tl-screen video{width:100%;height:100%;object-fit:cover;display:block}
.tl-state{position:absolute;left:8px;top:8px;font:700 11.5px/1 var(--h);letter-spacing:.06em;text-transform:uppercase;padding:6px 9px;border-radius:999px;background:rgba(0,0,0,.6);color:#cfe}
.tl[data-s="1"] .tl-state,.tl[data-s="2"] .tl-state{background:rgba(255,77,61,.85);color:#fff}
.tl-card{position:absolute;left:8px;right:8px;bottom:8px;display:flex;gap:10px;align-items:center;padding:8px 10px;border-radius:12px;background:rgba(10,16,23,.9);border:1px solid rgba(255,120,60,.45);transition:transform .3s,opacity .3s}
.tl-card svg{width:26px;height:26px;padding:5px;border-radius:8px;flex:none;color:#fff;background:linear-gradient(135deg,#ff8a3d,#ff4d2e)}
.tl-card b{display:block;font:700 13px/1.25 var(--h);color:#fff}
.tl-card em{font-style:normal;font-size:11.5px;color:var(--dim)}
.tl[data-s="0"] .tl-card{border-color:var(--line)}
.tl[data-s="0"] .tl-card svg{background:rgba(255,255,255,.12)}
.tl-bar{height:3px;border-radius:3px;background:rgba(255,255,255,.08);margin:8px 6px 2px;overflow:hidden}
.tl-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--teal2),#ff8a3d);transition:width .4s}
.tl-steps{list-style:none;display:grid;gap:8px;counter-reset:s}
.tl-step{border-radius:var(--r2);border:1px solid var(--line);background:rgba(255,255,255,.02);transition:border-color .25s,background .25s}
.tl-step button{width:100%;display:flex;align-items:center;gap:12px;min-height:54px;padding:12px 14px;background:none;border:0;color:inherit;text-align:left;cursor:pointer}
.tl-t{flex:none;min-width:52px;font:700 12.5px/1 var(--h);color:var(--teal2);font-variant-numeric:tabular-nums}
.tl-h{font:700 16px/1.25 var(--h);color:#fff}
.tl-step p{display:none;padding:0 14px 14px 78px;font-size:14.5px;color:var(--muted)}
.tl-step.on{border-color:rgba(255,120,60,.5);background:rgba(255,106,43,.07)}
.tl-step.on p{display:block;animation:inFade .3s ease}
.tl-step.on .tl-t{color:#ff9a5a}
.tl-ctrl{display:flex;justify-content:center;margin-top:16px}
/* fpp */
.wr-fpp-card{display:grid;gap:22px;padding:22px;border-radius:24px;border:1px solid var(--line2);background:radial-gradient(80% 60% at 100% 0,rgba(79,168,177,.12),transparent 70%),linear-gradient(180deg,rgba(17,26,36,.9),rgba(9,15,22,.95))}
.wr-fpp-card>*{min-width:0}
.wr-fpp-card .wr-fine{margin-top:14px;padding:12px;border-radius:12px;background:rgba(255,179,107,.06);border:1px solid rgba(255,179,107,.25);color:#e6d4c2}
.wr-fpp-list{list-style:none;display:grid;gap:10px;counter-reset:f}
.wr-fpp-list li{counter-increment:f;position:relative;padding:14px 14px 14px 52px;border-radius:14px;border:1px solid var(--line);background:rgba(0,0,0,.18)}
.wr-fpp-list li::before{content:counter(f);position:absolute;left:14px;top:14px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font:800 12px/1 var(--h);color:#04161a;background:linear-gradient(135deg,var(--teal2),var(--teal))}
.wr-fpp-list b{display:block;font:700 15.5px/1.25 var(--h);color:#fff;margin-bottom:4px}
.wr-fpp-list span{font-size:14.5px;color:var(--muted)}
.wr-src{grid-column:1/-1;font-size:13px;color:var(--dim)}
.wr-src a{color:var(--teal2);text-decoration:underline;text-underline-offset:2px}
.wr-final-card{text-align:center;padding:30px 20px;border-radius:24px;border:1px solid rgba(255,120,60,.35);background:radial-gradient(70% 80% at 50% 0,rgba(255,106,43,.18),transparent 70%),rgba(9,15,22,.9)}
.wr-final-card h2{font:800 clamp(30px,7vw,48px)/1.08 var(--h);letter-spacing:-.02em;margin:12px 0}
.wr-final-card .lead{max-width:620px;margin:0 auto}
.wr-final-card .in-btns{max-width:460px;margin:22px auto 14px}
.wr-final-card .wr-fine{justify-content:center}
@media (min-width:640px){
  .wr-stats{grid-template-columns:repeat(4,1fr)}
  .in-btns.wr,.wr-final-card .in-btns{grid-template-columns:1fr 1fr}
}
@media (min-width:1000px){
  .wm{grid-template-columns:1.55fr 1fr;align-items:start}
  .wm-chips{flex-wrap:wrap;overflow:visible}
  .wr-li-grid{grid-template-columns:1.05fr .95fr;align-items:center;gap:56px}
  .tl{grid-template-columns:1fr 1.1fr;gap:48px;align-items:start}
  .tl-phone{width:100%;max-width:520px;top:110px}
  .wr-fpp-card{grid-template-columns:1fr 1.15fr;padding:40px;gap:40px}
  .wr-final-card{padding:56px 40px}
}
@media (prefers-reduced-motion:reduce){.wm-pin i{animation:none}}
@media (max-width:999px){.tl-card{padding:7px 9px}.tl-card b{font-size:12px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.tl-card em{font-size:11px}}
