/*
Theme Name: DMD Bridge Architects
Theme URI: https://staging.dmdarchitects.com
Author: Donald MacDonald Architects LLC
Author URI: https://dmdarchitects.com
Description: Custom theme for Donald MacDonald Bridge Architects. Clean, minimal. Header and footer are custom; page content is managed by Elementor Pro.
Version: 2.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: Private — All Rights Reserved
Text Domain: dmd-theme
*/

/* ============================================================
   DMD ARCHITECTS — Main Stylesheet  v2.0
   Header + Footer only. Page content handled by Elementor Pro.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Assistant:wght@200;300;400;600;700&display=swap');

/* ── RESET ───────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-font-smoothing: antialiased; scroll-behavior: smooth; }
body {
  background: #fff;
  color: #1a1a1a;
  font-family: 'Assistant', Arial, sans-serif;
  font-size: 14px;
  line-height: 1.6;
  overflow-x: hidden;
  padding-top: 0;
}
img, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
address { font-style: normal; }

/* ── ELEMENTOR BODY OFFSET ───────────────────────────────── */
/* Push Elementor page content below the fixed header */
body.elementor-page {
  padding-top: 93px;
}
/* When sub-nav is present, Elementor pages need more offset */
body.elementor-page.has-subnav-page {
  padding-top: 125px;
}

/* WordPress admin bar offset */
.admin-bar .site-header { top: 32px; }
.admin-bar body.elementor-page { padding-top: calc(93px + 32px); }
.admin-bar body.elementor-page.has-subnav-page { padding-top: calc(125px + 32px); }
@media screen and (max-width: 782px) {
  .admin-bar .site-header { top: 46px; }
  .admin-bar body.elementor-page { padding-top: calc(93px + 46px); }
}

/* ── HEADER ──────────────────────────────────────────────── */
.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 9999; /* High z-index so it always sits above Elementor sections */
  background: rgba(255,255,255,0.85);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  height: 93px;
}

.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 40px;
  height: 93px;
  max-width: 1521px;
  margin: 0 auto;
}

/* Logo */
.site-logo { display: flex; align-items: center; }
.site-logo-img {
  width: 309px;
  height: 53px;
  object-fit: contain;
  display: block;
}

/* ── MAIN NAV ────────────────────────────────────────────── */
.main-nav { display: flex; align-items: center; }
.main-nav ul { display: flex; align-items: center; list-style: none; margin: 0; padding: 0; }
.main-nav li { list-style: none; margin: 0; padding: 0; display: flex; }

.main-nav a,
.main-nav li a {
  font-family: 'Assistant', Arial, sans-serif;
  font-size: 20px;
  font-weight: 400;
  letter-spacing: normal;
  text-transform: uppercase;
  color: #000;
  padding: 0 20px;
  height: 93px;
  display: flex;
  align-items: center;
  transition: color 0.2s;
  position: relative;
}

/* Bold-width pre-reserve trick — prevents layout shift on hover */
.main-nav a::after,
.main-nav li a::after {
  content: attr(title);
  display: block;
  font-weight: 700;
  text-transform: uppercase;
  visibility: hidden;
  height: 0;
  overflow: hidden;
  pointer-events: none;
  speak: never;
  user-select: none;
}

.main-nav a:hover,
.main-nav li a:hover,
.main-nav li.current-menu-item > a,
.main-nav li.current_page_item > a {
  color: #000;
  font-weight: 700;
}

/* ── SUB-NAV ─────────────────────────────────────────────── */
.sub-nav {
  position: absolute;
  right: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0 40px;
  height: 32px;
  margin-top: 20px;
  background: transparent;
}

.sub-nav a {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #888;
  padding: 0 16px;
  height: 32px;
  display: flex;
  align-items: center;
  transition: color 0.2s;
  position: relative;
}

/* Bold-width pre-reserve trick for sub-nav */
.sub-nav a::after {
  content: attr(title);
  display: block;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  visibility: hidden;
  height: 0;
  overflow: hidden;
  pointer-events: none;
  speak: never;
  user-select: none;
}

.sub-nav a:hover,
.sub-nav a.active,
.sub-nav li.current-menu-item > a,
.sub-nav li.current_page_item > a {
  color: #111;
  font-weight: 700;
}

/* ── HAMBURGER (mobile) ──────────────────────────────────── */
.nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 36px; height: 36px;
  background: none; border: none; cursor: pointer; padding: 4px;
}
.nav-toggle span {
  display: block; width: 22px; height: 2px; background: #333;
  transition: transform 0.25s, opacity 0.25s;
}

/* ── FOOTER ──────────────────────────────────────────────── */
.site-footer {
  background: transparent;
  padding: 48px 40px 28px;
  font-family: 'Assistant', Arial, sans-serif;
}
.footer-inner {
  display: flex;
  gap: 48px;
  flex-wrap: wrap;
  margin-bottom: 36px;
  max-width: 1521px;
}
.footer-col-label {
  display: block;
  font-family: 'Assistant', Arial, sans-serif;
  font-size: 16px; font-weight: 700;
  text-transform: uppercase;
  color: #000;
  margin-bottom: 14px;
}
.footer-col a {
  display: block;
  font-family: 'Assistant', Arial, sans-serif;
  font-size: 13px; font-weight: 400;
  color: #000;
  line-height: 2.1;
  transition: color 0.2s;
}
.footer-col a:hover { color: #cc2222; }
.footer-address { margin-left: auto; }
.footer-address-name {
  display: block;
  font-family: 'Assistant', Arial, sans-serif;
  font-size: 16px; font-weight: 700;
  text-transform: uppercase;
  color: #000; line-height: 1.2;
  margin-bottom: 10px;
}
.footer-address address,
.footer-address p {
  font-family: 'Assistant', Arial, sans-serif;
  font-size: 13px; font-weight: 400;
  color: #000; line-height: 1.9;
}
.footer-bottom {
  padding-top: 16px;
  font-family: 'Assistant', Arial, sans-serif;
  font-size: 11px; color: #bbb;
  letter-spacing: 0.05em;
}

/* ── MOBILE NAV ──────────────────────────────────────────── */
@media (max-width: 480px) {
  .nav-toggle { display: flex; }
  .main-nav {
    position: fixed; top: 93px; left: 0; right: 0;
    background: rgba(255,255,255,0.97);
    flex-direction: column; align-items: flex-start;
    transform: translateY(-110%); opacity: 0; pointer-events: none;
    transition: transform 0.3s ease, opacity 0.25s ease; z-index: 9998;
  }
  .main-nav.open { transform: translateY(0); opacity: 1; pointer-events: auto; }
  .main-nav a {
    width: 100%; height: auto !important;
    padding: 14px 24px; border-bottom: 1px solid #e0e0e0; font-size: 16px;
  }
  .sub-nav { display: none; }
  body.elementor-page { padding-top: 93px; }
  .footer-address { margin-left: 0; }
}

/* ── TABLET ──────────────────────────────────────────────── */
@media (max-width: 900px) {
  .projects-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 700px) {
  .header-inner { padding: 0 20px; }
  .site-footer { padding: 36px 20px 20px; }
  .footer-inner { gap: 32px; }
}