:root { --brand:#0f172a; }
.nav-link{ color:#334155; }
.nav-link:hover{ text-decoration:underline; }
.card{ background:#fff; border:1px solid #e2e8f0; border-radius:1rem; padding:1rem; transition:.2s; }
.card:hover{ box-shadow:0 6px 24px rgba(2,6,23,.06); transform: translateY(-1px); }
.card-title{ font-weight:700; margin-bottom:.25rem; }
.card-text{ color:#475569; font-size:.95rem; }
.label{ display:block; font-size:.9rem; color:#334155; margin-bottom:.35rem; }
.input{ width:100%; border:1px solid #e2e8f0; border-radius:.9rem; padding:.75rem 1rem; outline:none; }
.input:focus{ border-color:#94a3b8; box-shadow:0 0 0 3px rgba(148,163,184,.25); }
.svc{ display:grid; grid-template-columns:120px 1fr; gap:1rem; align-items:center; background:#fff; border:1px solid #e2e8f0; border-radius:1rem; padding:1rem; }
.svc-img{ width:100%; height:100px; object-fit:cover; border-radius:.75rem; }
.ba{ background:#fff; border:1px solid #e2e8f0; border-radius:1rem; padding:1rem; }
.ba-container{ position:relative; width:100%; aspect-ratio:16/10; overflow:hidden; border-radius:.75rem; --pos:50%; }
.ba-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ba-img.after{ clip-path: polygon(var(--pos) 0, 100% 0, 100% 100%, var(--pos) 100%); }
.ba-slider{ position:absolute; inset:0; width:100%; height:100%; opacity:0; }
.ba-labels{ display:flex; justify-content:space-between; margin-top:.5rem; font-size:.85rem; color:#475569; }