/* LOOK 1 · CLEAN — light, professional software-company style */
.look-clean{
  --bg:#FFFFFF;--bg2:#F4F7FB;--ink:#0B1220;--mute:#55627A;--line:#E4E9F1;--line2:#D2DAE6;--hover:#EEF2F8;
  --accent:#1D4ED8;--accent-h:#1E40AF;--on-accent:#FFFFFF;--ok:#0F9D63;--warn:#B7791F;--ico-bg:#E8EFFE;--tag-bg:#F7F9FC;
  --r:12px;--rl:22px;
  --hf:'Geist','Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--bf:'Geist','Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--mf:'Geist Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
}
.look-clean .top{background:rgba(255,255,255,.86)}
.look-clean .hero{padding:clamp(48px,7vw,96px) 0 clamp(56px,8vw,104px);background:
  radial-gradient(60% 50% at 85% 0%,rgba(29,78,216,.10),transparent 70%),
  radial-gradient(#DCE3EE 1px,transparent 1.2px) 0 0/24px 24px;
  -webkit-mask-image:none}
.look-clean .hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:center}
.look-clean .hero-copy{display:flex;flex-direction:column;gap:22px;align-items:flex-start}
.look-clean .hero h1{max-width:15ch}
.look-clean .hero .eyebrow{margin:0}
.look-clean .proof{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:6px}
.look-clean .proof li{display:flex;align-items:center;gap:8px;font-size:.92rem;color:var(--mute)}
.look-clean .proof li::before{content:"";width:18px;height:18px;border-radius:50%;background:var(--ico-bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.5l2.6 2.6L13 6.6' fill='none' stroke='%231D4ED8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat;flex:none}
@media (max-width:960px){.look-clean .hero-grid{grid-template-columns:minmax(0,1fr)}.look-clean .hero h1{max-width:none}}

/* dashboard picture */
.look-clean .dash{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 30px 60px -20px rgba(15,35,80,.25),0 6px 18px rgba(15,35,80,.06);overflow:hidden;min-width:0;animation:cl-float 7s ease-in-out infinite}
@keyframes cl-float{50%{transform:translateY(-8px)}}
.look-clean .dash-bar{display:flex;align-items:center;gap:6px;padding:12px 16px;background:var(--bg2);border-bottom:1px solid var(--line)}
.look-clean .dash-bar i{width:10px;height:10px;border-radius:50%;background:#CBD3E0}
.look-clean .dash-bar span{margin-left:10px;font:500 .72rem/1 var(--mf);color:var(--mute);letter-spacing:.04em}
.look-clean .dash-body{display:grid;grid-template-columns:58px minmax(0,1fr)}
.look-clean .d-side{padding:16px 12px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:12px;background:#FBFCFE}
.look-clean .d-side b{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,#22D3EE,#1D4ED8)}
.look-clean .d-side span{height:8px;border-radius:4px;background:var(--line)}
.look-clean .d-side span.on{background:var(--accent)}
.look-clean .d-main{padding:18px;min-width:0}
.look-clean .kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.look-clean .kpis div{border:1px solid var(--line);border-radius:12px;padding:10px 12px;min-width:0}
.look-clean .kpis small{display:block;font-size:.7rem;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.look-clean .kpis strong{font:700 1.45rem/1.2 var(--hf);letter-spacing:-.02em}
.look-clean .spark{display:block;width:100%;height:92px;margin:14px 0 6px}
.look-clean .rows li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 0;border-top:1px solid var(--line);font-size:.84rem}
.look-clean .rows li span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.look-clean .rows .p{font:600 .68rem/1 var(--mf);font-style:normal;letter-spacing:.04em;padding:5px 9px;border-radius:999px;white-space:nowrap}
.look-clean .p.amber{background:#FEF3C7;color:#92400E}.look-clean .p.green{background:#DCFCE7;color:#166534}.look-clean .p.blue{background:#DBEAFE;color:#1E40AF}
@media (prefers-reduced-motion:no-preference){
  .look-clean .spark .line{stroke-dasharray:1;stroke-dashoffset:1;animation:cl-draw 1.8s .5s ease forwards}
  @keyframes cl-draw{to{stroke-dashoffset:0}}
}
@media (prefers-reduced-motion:reduce){.look-clean .dash{animation:none}}
@media (max-width:420px){.look-clean .dash-body{grid-template-columns:44px minmax(0,1fr)}.look-clean .kpis strong{font-size:1.15rem}}

/* sections */
.look-clean .soft{background:var(--bg2)}
.look-clean .sec h2{max-width:22ch;margin-bottom:0}
.look-clean .svc{background:#fff;border:1px solid var(--line);border-radius:var(--rl);padding:26px;transition:transform .25s,box-shadow .25s,border-color .25s}
.look-clean .svc:hover,.look-clean .case:hover,.look-clean .tool:hover{transform:translateY(-4px);box-shadow:0 18px 40px -16px rgba(15,35,80,.22);border-color:var(--line2)}
.look-clean .case,.look-clean .tool{background:#fff;border:1px solid var(--line);border-radius:var(--rl);padding:26px;transition:transform .25s,box-shadow .25s,border-color .25s}
.look-clean .case-top{display:flex}
.look-clean .steps li{border-top:2px solid var(--ink);padding-top:16px}
.look-clean .steps .n{font:600 .8rem/1 var(--mf);color:var(--accent)}
.look-clean .tool.dashed{border:1.5px dashed var(--line2);box-shadow:none}
.look-clean .tool.dashed:hover{transform:none;box-shadow:none}
.look-clean .tool .status{color:var(--accent)}
.look-clean .skills li{background:#fff}

/* contact band */
.look-clean .contact{background:#0B1220;color:#fff;padding:clamp(64px,9vw,104px) 0;background-image:radial-gradient(60% 90% at 100% 0%,rgba(34,211,238,.20),transparent 70%),radial-gradient(50% 80% at 0% 100%,rgba(29,78,216,.35),transparent 70%)}
.look-clean .contact .in{display:flex;flex-direction:column;gap:22px;align-items:flex-start}
.look-clean .contact .eyebrow{color:#67E8F9;margin:0}
.look-clean .contact h2{max-width:20ch;font-size:clamp(1.9rem,4.2vw,3.1rem)}
.look-clean .contact .muted{color:#9FB0C8}
.look-clean .btn.light{background:#fff;color:#0B1220}.look-clean .btn.light:hover{background:#E6F6FF}
.look-clean .btn.outline{border-color:rgba(255,255,255,.35);color:#fff}.look-clean .btn.outline:hover{border-color:#67E8F9;color:#67E8F9}
.look-clean .foot{background:#0B1220;color:#8DA0BC;border-top:1px solid rgba(255,255,255,.1)}