/* Dark brand styles for B-HANDY */
:root{
  --brand:#A3C644;
  --ink:#F7FAF7;
  --bg:#0A0A0A;
  --muted:#9CA3AF;
  --card:#121212;
  --line:#1F1F1F;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg)}
img{max-width:100%;display:block}

.container{max-width:1100px;margin:0 auto;padding:0 20px}
.section{padding:72px 0 64px}
.kicker{color:var(--brand);text-transform:uppercase;letter-spacing:.12em;font-weight:800;font-size:14px;margin:0 0 6px}
.section-title{font-size:clamp(24px,4.2vw,40px);margin:0 0 22px;font-weight:800}
.accent{color:var(--brand)}
.muted{color:var(--muted)}

.btn{display:inline-block;padding:12px 18px;border-radius:10px;text-decoration:none;font-weight:800;border:2px solid var(--brand)}
.btn.primary{background:var(--brand);color:#0b0b0b;border-color:var(--brand)}
.btn.line{background:transparent;color:var(--ink)}

.site-header{position:sticky;top:0;background:#0B0B0B;backdrop-filter:saturate(120%) blur(8px);border-bottom:1px solid var(--line);z-index:10}
.nav{display:flex;align-items:center;gap:16px;min-height:64px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-weight:800}
.brand img{width:36px;height:36px;border-radius:6px;object-fit:cover;border:2px solid var(--brand)}
nav{margin-left:auto;display:flex;gap:18px;align-items:center}
nav a{color:var(--ink);text-decoration:none;font-weight:600;opacity:.9}
nav .cta{background:var(--brand);padding:10px 14px;border-radius:8px;color:#0b0b0b;font-weight:800}

#nav-toggle{display:none}
.hamburger{display:none;cursor:pointer;font-size:22px;color:var(--ink)}

@media (max-width:780px){
  nav{display:none;position:absolute;top:64px;left:0;right:0;background:#0B0B0B;border-bottom:1px solid var(--line);flex-direction:column;padding:12px}
  #nav-toggle:checked ~ nav{display:flex}
  .hamburger{display:block;margin-left:auto}
}

.hero{background:#0A0A0A;padding:110px 0 90px;text-align:center}
.hero .hero-logo{max-width:220px;margin:0 auto 20px;border-radius:12px;border:3px solid var(--brand)}
.hero .actions{display:flex;gap:12px;margin:18px 0 10px;flex-wrap:wrap;justify-content:center}
.badges{list-style:none;display:flex;gap:16px;margin:12px 0 0;padding:0;flex-wrap:wrap;justify-content:center}
.badges li{background:#121212;color:#D1D5DB;border:1px solid var(--line);padding:8px 12px;border-radius:999px;font-size:14px}

.divider{height:10px;background:linear-gradient(90deg,var(--brand),#7FB02D,var(--brand));border-top:1px solid #000;border-bottom:1px solid #000}

.grid{display:grid;gap:18px}
.services{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;box-shadow:0 2px 10px rgba(0,0,0,.25)}
.card-title{margin:0 0 6px;font-size:20px;color:var(--brand)}

.about{display:grid;grid-template-columns:1.2fr .8fr;gap:28px;align-items:center}
.about .stamp{width:160px;height:160px;border:6px solid var(--brand);border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:28px;color:var(--brand)}
@media (max-width:860px){.about{grid-template-columns:1fr}}

.gallery{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.gallery .ph{background:repeating-linear-gradient(45deg,#111,#111 10px,#161616 10px,#161616 20px);aspect-ratio:4/3;border-radius:12px;border:1px dashed #333}

.reviews{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
blockquote{margin:0;padding:16px 18px;border-left:6px solid var(--brand);background:#0E0E0E;border:1px solid var(--line);border-radius:12px;box-shadow:0 1px 4px rgba(0,0,0,.3)}
blockquote cite{display:block;color:var(--muted);margin-top:8px}

.contact .contact-form{display:grid;gap:12px;max-width:720px}
.contact .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.contact input,.contact textarea{width:100%;padding:12px 14px;border-radius:10px;border:1px solid #333;background:#0E0E0E;color:var(--ink)}
.contact input::placeholder,.contact textarea::placeholder{color:#777}
.contact button{width:fit-content}
.contact .contact-alt a{color:var(--brand)}

.site-footer{border-top:1px solid var(--line);background:#0B0B0B}
.foot{display:grid;gap:14px;padding:22px 0;grid-template-columns:1.4fr 1fr 1fr;align-items:center}
.id{display:flex;align-items:center;gap:12px}
.id img{width:40px;height:40px;border-radius:8px;object-fit:cover;border:2px solid var(--brand)}
.copy{color:var(--muted);font-size:14px;text-align:right}
.links{display:flex;gap:14px;justify-content:center}
@media (max-width:860px){.foot{grid-template-columns:1fr} .copy{text-align:left} .links{justify-content:flex-start}}

/* Sticky mobile CTA */
@media (max-width: 899px){
  body{ padding-bottom: 84px; }
  .sticky-cta{
    position: fixed; left: 0; right: 0; bottom: 0;
    background: rgba(10,10,10,.98);
    border-top: 1px solid var(--line);
    padding: 10px 14px;
    display: flex; gap: 10px; justify-content: center; align-items: center;
    z-index: 999;
  }
  .sticky-cta .btn{
    flex: 1; max-width: 460px; border-radius: 999px; text-align: center; padding: 14px 18px;
    font-weight: 800;
  }
  .sticky-cta .btn.call{ border-color: var(--brand); color: var(--ink); }
  .sticky-cta .btn.quote{ background: var(--brand); color:#0b0b0b; border-color: var(--brand); }
}
@media (min-width: 900px){
  .sticky-cta{ display: none; }
}
