/*!
Theme Name: A&V Building Company
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: av-construction
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

av construction is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/* Extracted CSS */
:root{
  --bg:#f7f7fb;
  --surface:#ffffff;
  --surface2:#f5f6fa;
  --text:#0b1020;
  --muted:#5b6477;
  --line:rgba(12,18,32,.10);
  --shadow:0 18px 60px rgba(14,26,43,.12);
  --shadow2:0 10px 26px rgba(14,26,43,.10);
  --radius:22px;
  --radius2:16px;
  --accent:#b45309;   /* copper */
  --accent2:#92400e;
  --max:1200px;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  color:var(--text);
  background:
    radial-gradient(900px 650px at 14% -10%, rgba(180,83,9,.16), transparent 55%),
    radial-gradient(900px 650px at 92% 8%, rgba(99,102,241,.10), transparent 55%),
    radial-gradient(750px 520px at 55% 115%, rgba(146,64,14,.10), transparent 62%),
    linear-gradient(180deg, var(--bg) 0%, #ffffff 56%, var(--bg) 100%);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{color:inherit;text-decoration:none}
.container{max-width:var(--max); margin:0 auto; padding:0 18px}

header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  border-bottom:1px solid var(--line);
}
.nav{display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 0}
.brand{display:flex; align-items:center; gap:12px; min-width:260px}
.brand img{height:44px; width:auto}
.brand b{display:block; font-size:14px; letter-spacing:-.2px}
.brand span{display:block; font-size:12px; color:var(--muted)}
nav ul{display:flex; gap:6px; list-style:none; margin:0; padding:0; align-items:center}
nav a{display:inline-flex; align-items:center; padding:10px 12px; border-radius:12px; font-size:13px; color:var(--muted)}
nav a:hover{background:var(--surface2); color:var(--text)}
.cta{display:flex; gap:10px; align-items:center}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:11px 14px; border-radius:14px;
  border:1px solid var(--line);
  background:#fff;
  font-weight:650; font-size:13px; cursor:pointer;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
  white-space:nowrap;
}
.btn:hover{transform:translateY(-1px); box-shadow: var(--shadow2)}
.btn.primary{
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  color:white; border-color:transparent;
}
.btn.primary:hover{filter:brightness(1.03); box-shadow:0 16px 30px rgba(180,83,9,.18)}
.btn.soft{background:var(--surface2)}
.menuBtn{display:none}
.mobileMenu{display:none; padding:0 0 14px}
.mobileMenu a{display:block; padding:10px 12px; border-radius:12px; border:1px solid var(--line); background:#fff; margin:8px 0; color:var(--muted); font-size:13px}

/* HERO */
.hero{padding:28px 0 8px}
.heroShell{
  border:1px solid var(--line);
  background:#fff;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow:hidden;
}
.heroTop{
  padding:26px;
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap:18px;
  align-items:stretch;
}
.pill{
  display:inline-flex; align-items:center; gap:10px;
  padding:8px 12px; border-radius:999px;
  background:var(--surface2);
  border:1px solid rgba(180,83,9,.22);
  color:var(--muted); font-size:12px
}
.dot{width:8px;height:8px;border-radius:99px;background:var(--accent)}
h1{margin:12px 0 10px; font-size:44px; line-height:1.06; letter-spacing:-1px}
.sub{margin:0 0 14px; color:var(--muted); font-size:15px; max-width:80ch}
.chips{display:flex; flex-wrap:wrap; gap:10px; margin:12px 0 0; padding:0; list-style:none}
.chips li{
  padding:9px 11px; border-radius:999px;
  background:var(--surface2);
  border:1px solid rgba(12,18,32,.10);
  color:var(--muted); font-size:13px
}
.trust{
  display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; font-size:12px;
}
.badge{
  padding:8px 10px; border-radius:999px;
  background:rgba(180,83,9,.10);
  border:1px solid rgba(180,83,9,.22);
}
.badge.alt{
  background:rgba(12,18,32,.05);
  border:1px solid rgba(12,18,32,.10);
}
.heroActions{display:flex; gap:10px; flex-wrap:wrap; margin-top:14px}
.heroMedia{
  border-radius:18px;
  overflow:hidden;
  border:1px solid var(--line);
  background:#fff;
  box-shadow: var(--shadow2);
  height:100%;
  min-height:330px;
  position:relative;
}
.heroMedia img{width:100%; height:100%; object-fit:cover; display:block}
.heroMedia .cap{
  position:absolute; left:14px; bottom:14px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(12,18,32,.10);
  border-radius:14px;
  padding:10px 12px;
  font-size:12px;
  color:var(--muted);
  max-width:70%;
}
.heroBottom{
  border-top:1px solid var(--line);
  background:linear-gradient(180deg, #fff, var(--surface2));
  padding:16px 26px;
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:12px;
}
.stat{
  border:1px solid rgba(12,18,32,.10);
  border-radius:16px;
  background:#fff;
  padding:12px;
}
.stat b{display:block; font-size:14px}
.stat span{display:block; font-size:12px; color:var(--muted); margin-top:2px}

/* SECTIONS */
section{padding:44px 0}
.sectionHead{display:flex; align-items:flex-end; justify-content:space-between; gap:14px; margin-bottom:14px}
.sectionHead h2{margin:0; font-size:22px; letter-spacing:-.3px}
.sectionHead p{margin:0; color:var(--muted); font-size:13px; max-width:78ch}
.grid3{display:grid; grid-template-columns:repeat(3,1fr); gap:14px}
.card{
  border:1px solid var(--line);
  background:#fff;
  border-radius: var(--radius2);
  overflow:hidden;
  box-shadow: var(--shadow2);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.card:hover{transform:translateY(-2px); box-shadow: var(--shadow); border-color: rgba(180,83,9,.26)}
.card img{width:100%; height:220px; object-fit:cover; display:block; background:#fff}
.cardBody{padding:14px 16px 16px}
.cardBody h3{margin:0 0 6px; font-size:15px; letter-spacing:-.2px}
.cardBody p{margin:0; font-size:13px; color:var(--muted)}

.band{
  border:1px solid var(--line);
  background: linear-gradient(90deg, rgba(180,83,9,.10), rgba(99,102,241,.08));
  border-radius: var(--radius);
  padding:18px;
  box-shadow: var(--shadow2);
}
.bandGrid{display:grid; grid-template-columns: 1fr 1fr; gap:14px; align-items:center}
.band h3{margin:0 0 6px; font-size:18px; letter-spacing:-.3px}
.band p{margin:0; color:var(--muted); font-size:13px}
.band ul{margin:10px 0 0; padding-left:18px; color:var(--muted); font-size:13px}
.band li{margin:6px 0}
.bandImg{border-radius:18px; overflow:hidden; border:1px solid var(--line); background:#fff; box-shadow: var(--shadow2)}
.bandImg img{width:100%; height:280px; object-fit:cover; display:block; background:#fff}

/* CONTACT */
.formWrap{border:1px solid var(--line); background:#fff; border-radius: var(--radius); box-shadow: var(--shadow); overflow:hidden}
.formInner{display:grid; grid-template-columns: .92fr 1.08fr; gap:0}
.formSide{padding:20px; border-right:1px solid var(--line); background:linear-gradient(180deg, #ffffff, var(--surface2))}
.formSide h3{margin:0 0 8px; font-size:16px}
.formSide p{margin:0; color:var(--muted); font-size:13px}
form{padding:20px}
.formGrid{display:grid; grid-template-columns:1fr 1fr; gap:12px}
label{display:block; font-size:12px; color:var(--muted); margin:0 0 6px}
input, select, textarea{
  width:100%; padding:12px 12px; border-radius:12px;
  border:1px solid rgba(12,18,32,.14); background:#fff; color:var(--text); outline:none
}
input:focus, select:focus, textarea:focus{border-color:rgba(180,83,9,.55); box-shadow:0 0 0 5px rgba(180,83,9,.12)}
textarea{min-height:120px; resize:vertical}
.actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:12px}
.note{margin:10px 0 0; font-size:12px; color:var(--muted)}

.footer{padding:26px 0 40px; border-top:1px solid var(--line); color:var(--muted); font-size:12px}
.footRow{display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; align-items:center}
.error-404.not-found.text-center { min-height: 80vh;text-align: center;}
@media (max-width: 980px){
  nav ul{display:none}
  .menuBtn{display:inline-flex}
  .heroTop{grid-template-columns:1fr}
  .heroBottom{grid-template-columns:1fr 1fr}
  .grid3{grid-template-columns:1fr}
  .bandGrid{grid-template-columns:1fr}
  .formInner{grid-template-columns:1fr}
  .formSide{border-right:none; border-bottom:1px solid var(--line)}
  h1{font-size:36px}
  .heroMedia{min-height:260px}
  .nav .brand b, .nav .brand span, header .cta .primary, header .cta .soft, header nav { display:none;}
  ul.mobile-nav { list-style-type:none;padding:0px;}
}