/*
Theme Name: FIF-T Contracting
Theme URI: https://www.fif-t.com/
Author: FIF-T Contracting
Description: Stable classic theme with auto-setup and a detailed block-styled Services page. Yellow–orange accent and CSS-only hero background (no assets needed).
Version: 2.0
Text Domain: fif-t-contracting
*/
:root{
  --accent:#f7b733; /* yellow–orange */
  --text:#222;
  --muted:#555;
  --bg:#fffdfa;
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.55}

header{background:var(--accent);padding:16px 24px;display:flex;align-items:center;justify-content:center}
header nav ul{list-style:none;margin:0;padding:0;display:flex;gap:18px;flex-wrap:wrap}
header nav a{color:#111;text-decoration:none;font-weight:700}
header nav a:hover{text-decoration:underline}

.hero{
  position:relative;
  /* Layered gradients to simulate a soft, construction-toned “blurred” background */
  background:
    radial-gradient(1200px 600px at 20% 20%, rgba(240,200,110,.55), transparent 60%),
    radial-gradient(900px 500px at 80% 30%, rgba(200,160,80,.45), transparent 65%),
    radial-gradient(1000px 600px at 50% 80%, rgba(170,130,60,.40), transparent 60%),
    linear-gradient(180deg, #e9d28e 0%, #cfae63 100%);
  text-align:center;
  padding:120px 20px;
  color:#111;
  isolation:isolate;
}
.hero:after{
  content:"";
  position:absolute; inset:0;
  backdrop-filter: blur(2px); /* gentle softening */
  opacity:.6;
  pointer-events:none;
}
.hero .card{
  position:relative;
  display:inline-block;
  background:rgba(255,255,255,.92);
  padding:28px 30px;
  border-radius:14px;
  box-shadow:0 10px 30px rgba(0,0,0,.08);
}
.hero h1{margin:.2rem 0 .4rem;font-size:2rem}
.hero p{margin:.2rem 0 .8rem;color:var(--muted)}

.cta{
  display:inline-block;background:var(--accent);
  padding:12px 18px;border-radius:10px;font-weight:800;
  border:2px solid #111;color:#111;text-decoration:none
}
.cta:hover{filter:brightness(.95)}

main{padding:28px 24px;max-width:1100px;margin:0 auto}
h1,h2{margin-top:0}

.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.gallery img{width:100%;border-radius:10px;display:block}

.service-card{
  background:#fff;border:2px solid #111;border-radius:14px;
  padding:16px;box-shadow:0 6px 16px rgba(0,0,0,.06)
}
.badge{display:inline-block;background:var(--accent);padding:6px 10px;border-radius:10px;border:2px solid #111;font-weight:700}
.note{background:#fff3cd;border:1px solid #ffe08a;padding:12px;border-radius:8px}
.kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin:16px 0}
.kpi .box{background:#fff;border:1px dashed #111;padding:10px;border-radius:10px;text-align:center}

footer{background:#222;color:#fff;text-align:center;padding:20px;margin-top:40px}
footer a{color:#fff}