.work-hero{padding:88px 40px 0;background-color:#fff;background-image:radial-gradient(circle,#d0d0d0 1.2px,transparent 1.2px);background-size:22px 22px;border-bottom:1px solid var(--border);position:relative;overflow:hidden}
.crosshair{position:absolute;width:16px;height:16px;opacity:0.2;pointer-events:none}
.crosshair::before,.crosshair::after{content:'';position:absolute;background:var(--orange)}
.crosshair::before{width:1px;height:100%;left:50%;top:0}
.crosshair::after{width:100%;height:1px;top:50%;left:0}
.ch-tl{top:20px;left:20px}.ch-tr{top:20px;right:20px}.ch-bl{bottom:0;left:20px}.ch-br{bottom:0;right:20px}
.hero-inner{max-width:600px;margin-bottom:56px}
.hero-eyebrow{font-size:10.5px;font-weight:500;letter-spacing:0.12em;color:var(--orange);text-transform:uppercase;margin-bottom:16px}
.hero-title{font-family:var(--font-d);font-size:56px;font-weight:900;color:var(--dark);line-height:1.05;letter-spacing:-0.03em;margin-bottom:14px}
.hero-title em{color:var(--orange);font-style:italic}
.hero-sub{font-size:15px;color:var(--mid);line-height:1.7}
.pinned-frames{position:relative;height:100px;margin:0 -40px;overflow:hidden}
.frame{position:absolute;background:var(--white);border:1px solid var(--border);border-radius:6px;padding:10px 14px;box-shadow:2px 4px 16px rgba(0,0,0,0.08);display:flex;align-items:center;gap:10px;white-space:nowrap;opacity:0;animation:frameIn 0.5s ease forwards}
.frame::before{content:'';width:8px;height:8px;background:var(--orange);border-radius:50%;position:absolute;top:-4px;left:50%;transform:translateX(-50%)}
.frame::after{content:'';position:absolute;top:-16px;left:50%;width:1px;height:12px;background:rgba(0,0,0,0.15);transform:translateX(-50%)}
.frame-emoji{font-size:15px}.frame-text{font-size:11px;font-weight:500;color:var(--dark)}.frame-tag{font-size:10px;color:var(--orange);font-weight:500}
.frame:nth-child(1){left:40px;bottom:16px;animation-delay:0.3s}
.frame:nth-child(2){left:220px;bottom:28px;animation-delay:0.45s}
.frame:nth-child(3){left:400px;bottom:10px;animation-delay:0.6s}
.frame:nth-child(4){left:570px;bottom:24px;animation-delay:0.75s}
.frame:nth-child(5){left:740px;bottom:14px;animation-delay:0.9s}
.frame:nth-child(6){left:900px;bottom:20px;animation-delay:1.05s}
@keyframes frameIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.case-studies{padding:80px 40px;background:var(--bg)}
.cs-section-header{margin-bottom:56px}
.cs-card{display:grid;grid-template-columns:1fr 1fr;background:var(--white);border:1px solid var(--border);border-radius:16px;overflow:hidden;margin-bottom:28px;transition:box-shadow 0.25s var(--ease-out),transform 0.25s var(--ease-bounce);text-decoration:none}
.cs-card:hover{box-shadow:0 16px 56px rgba(0,0,0,0.1);transform:translateY(-4px)}
.cs-card.reverse{direction:rtl}.cs-card.reverse>*{direction:ltr}
.cs-visual{min-height:300px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:40px}
.cs-visual-grid{position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,0.1) 1px,transparent 1px);background-size:18px 18px;z-index:1}
.cs-visual-content{position:relative;z-index:2;text-align:center}
.cs-big-icon{font-size:56px;display:block;margin-bottom:14px}
.cs-metric-big{font-family:var(--font-d);font-size:34px;font-weight:900;color:rgba(255,255,255,0.95);line-height:1;letter-spacing:-0.02em}
.cs-metric-sub{font-size:11px;color:rgba(255,255,255,0.55);margin-top:6px}
.visual-seam{background:linear-gradient(145deg,#0a1628,#1a2a4a,#0f2060)}
.visual-biotech{background:linear-gradient(145deg,#0d1b2a,#1b3a5c,#0f3460)}
.visual-agri{background:linear-gradient(145deg,#0a1f0a,#1e4620,#2d6a1e)}
.visual-agency{background:linear-gradient(145deg,#2a0e00,#6b2800,#cc4a00)}
.visual-hmi{background:linear-gradient(145deg,#0d0d1a,#1a1a3a,#2a2a5a)}
.cs-content{padding:44px 48px;display:flex;flex-direction:column;justify-content:center}
.cs-tag{display:inline-flex;align-items:center;gap:8px;font-size:10px;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:var(--orange);margin-bottom:16px}
.cs-tag::before{content:'';width:24px;height:1px;background:var(--orange)}
.cs-name{font-family:var(--font-d);font-size:28px;font-weight:700;color:var(--dark);letter-spacing:-0.02em;margin-bottom:6px}
.cs-client{font-size:12px;font-weight:500;color:var(--light);margin-bottom:16px}
.cs-desc{font-size:14px;color:var(--mid);line-height:1.75;margin-bottom:24px}
.cs-pills{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:28px}
.cs-pill{font-size:11px;font-weight:500;color:var(--dark);background:var(--bg);border:1px solid var(--border);padding:4px 12px;border-radius:100px}
.cs-cta{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--orange);width:fit-content;transition:gap 0.2s var(--ease-bounce)}
.cs-cta:hover{gap:14px}
.selected-section{background:var(--dark);padding:80px 40px;position:relative;overflow:hidden}
.selected-section::before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,117,31,0.05) 1px,transparent 1px);background-size:22px 22px;pointer-events:none}
.selected-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:44px;position:relative;z-index:1}
.sel-card{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.07);border-radius:10px;padding:24px 20px;transition:background 0.2s,border-color 0.2s,transform 0.2s var(--ease-bounce)}
.sel-card:hover{background:rgba(255,117,31,0.08);border-color:rgba(255,117,31,0.2);transform:translateY(-4px)}
.sel-icon{font-size:24px;margin-bottom:14px;display:block}
.sel-tag{font-size:10px;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:var(--orange);margin-bottom:8px}
.sel-name{font-size:14px;font-weight:600;color:#f0f0f0;margin-bottom:7px;line-height:1.3}
.sel-desc{font-size:12px;color:rgba(255,255,255,0.38);line-height:1.6}
@media(max-width:900px){
  .work-hero{padding:64px 20px 0}.hero-title{font-size:38px}.pinned-frames{display:none}
  .case-studies,.selected-section{padding:56px 20px}
  .cs-card{grid-template-columns:1fr}.cs-card.reverse{direction:ltr}
  .cs-visual{min-height:200px}.cs-content{padding:28px 24px}
  .selected-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:540px){.selected-grid{grid-template-columns:1fr}.cs-name{font-size:22px}}