.hero-services-btn { transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease; }
.hero-services-btn:hover { background: var(--orange) !important; border-color: var(--orange) !important; color: #fff !important; }
.hero-call-btn { transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease; }
.hero-call-btn:hover { transform: translateY(-2px); }

/* RECENT PROJECTS GRID */
.recent-projects-section { padding: 80px 32px; background: var(--navy); }
.recent-projects-section h2 { color: #fff; }
.recent-projects-section .subhead { color: rgba(255,255,255,0.75); }
.recent-projects-section .project-popup-card { border-color: transparent; }
.recent-projects-section .project-popup-card:hover { box-shadow: 0 16px 32px rgba(0,0,0,0.35); }
.recent-projects-grid { max-width: 1140px; margin: 36px auto 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
@media (max-width: 900px) { .recent-projects-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .recent-projects-grid { grid-template-columns: 1fr; } }
.project-popup-card {
 background: #fff; border-radius: 6px; overflow: hidden; cursor: pointer;
 border: 1px solid var(--border); transition: transform 0.2s ease, box-shadow 0.2s ease;
 display: flex; flex-direction: column;
}
.project-popup-card:hover { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(10,29,58,0.12); }
.project-popup-img { aspect-ratio: 4/3; background: #d4d8de; }
.project-popup-body { padding: 18px 18px 22px; }
.project-popup-tag {
 display: inline-block; font-family: 'Inter'; font-size: 10px; font-weight: 600;
 letter-spacing: 1.5px; text-transform: uppercase; color: var(--orange); margin-bottom: 8px;
}
.project-popup-card h3 {
 font-family: 'Montserrat'; font-size: 16px; font-weight: 600;
 color: var(--navy); margin: 0 0 6px; letter-spacing: -0.01em; line-height: 1.3;
}
.project-popup-card .project-meta {
 font-size: 12px; color: var(--grey); margin: 0 0 14px;
}
.project-popup-link {
 font-family: 'Inter'; font-size: 12px; font-weight: 600; color: var(--navy);
 letter-spacing: 0.5px; text-transform: uppercase; display: inline-flex; align-items: center; gap: 4px;
}
.project-popup-card:hover .project-popup-link { color: var(--orange); }

/* PROJECT MODAL */
.project-modal {
 border: none; border-radius: 8px; padding: 0; max-width: 880px; width: 92vw;
 max-height: 88vh; overflow: hidden; background: #fff;
}
.project-modal::backdrop { background: rgba(10,29,58,0.7); backdrop-filter: blur(2px); }
.project-modal-inner { display: grid; grid-template-columns: 1fr 1fr; max-height: 88vh; }
@media (max-width: 760px) { .project-modal-inner { grid-template-columns: 1fr; } }
.project-modal-img { background: #d4d8de; min-height: 280px; }
.project-modal-body { padding: 36px 32px; overflow-y: auto; max-height: 88vh; }
.project-modal-tag {
 display: inline-block; font-family: 'Inter'; font-size: 10px; font-weight: 600;
 letter-spacing: 1.5px; text-transform: uppercase; color: var(--orange); margin-bottom: 12px;
}
.project-modal-body h2 {
 font-family: 'Montserrat'; font-size: 24px; font-weight: 600;
 color: var(--navy); margin: 0 0 18px; letter-spacing: -0.01em; line-height: 1.25;
}
.project-modal-meta {
 display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
 padding: 16px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); margin-bottom: 20px;
}
.project-modal-meta > div { font-size: 12px; color: var(--grey); line-height: 1.6; }
.project-modal-meta strong {
 display: block; font-family: 'Inter'; font-size: 10px; font-weight: 600;
 letter-spacing: 1px; text-transform: uppercase; color: var(--navy); margin-bottom: 4px;
}
.project-modal-body h4 {
 font-family: 'Montserrat'; font-size: 13px; font-weight: 600;
 color: var(--navy); margin: 16px 0 8px; text-transform: uppercase; letter-spacing: 1px;
}
.project-modal-body p { font-size: 14px; color: var(--grey); line-height: 1.7; margin: 0 0 10px; }
.project-modal-close {
 position: absolute; top: 14px; right: 14px; z-index: 10;
 width: 36px; height: 36px; border-radius: 50%; border: none;
 background: rgba(255,255,255,0.95); color: var(--navy); cursor: pointer;
 font-size: 24px; line-height: 1; display: flex; align-items: center; justify-content: center;
 box-shadow: 0 2px 8px rgba(0,0,0,0.15); transition: background 0.15s ease;
}
.project-modal-close:hover { background: var(--orange); color: #fff; }

/* WORD ROTATOR (cycles 3 words: leaving fades DOWN, incoming fades from ABOVE.
   Slot width animates to fit the active word so the rest of the line never has a gap.) */
.word-rotator {
 position: relative;
 display: inline-block;
 vertical-align: bottom;
 height: 1.18em;
 line-height: 1.18;
 overflow: hidden;
 width: 5ch; /* fallback before JS measures */
 transition: width 0.55s ease;
}
.word-rotator > .word {
 position: absolute;
 left: 0;
 top: 0;
 color: var(--orange);
 white-space: nowrap;
 opacity: 0;
 transform: translateY(-110%);
 transition: opacity 0.7s ease, transform 0.7s ease;
}
.word-rotator > .word.active {
 opacity: 1;
 transform: translateY(0);
}
.word-rotator > .word.leaving {
 opacity: 0;
 transform: translateY(110%);
}

/* MODAL IMAGE TRIO (1 hero top + 2 thumbs bottom) */
.modal-image-trio {
 display: grid;
 grid-template-columns: 1fr 1fr;
 grid-template-rows: 2fr 1fr;
 gap: 4px;
 min-height: 280px;
 background: #fff;
}
.modal-image-trio > div { background: var(--placeholder); }
.modal-image-trio > div:first-child { grid-column: span 2; }
/* ---- Theme helpers (added by the WordPress build) ---- */
.skip-link{position:absolute;left:-9999px;top:0;z-index:1000;background:var(--navy);color:#fff;padding:10px 16px;}
.skip-link:focus{left:8px;top:8px;}
.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}
.nav-toggle{display:none;}
@media (max-width:900px){
  /* Hamburger button (white, sits to the right after the phone CTA) */
  .nav-toggle{display:inline-flex;align-items:center;justify-content:center;background:transparent;border:0;cursor:pointer;flex-direction:column;gap:5px;padding:10px;color:#fff;order:3;}
  .nav-toggle-bar,.nav-toggle-bar::before,.nav-toggle-bar::after{display:block;width:24px;height:2px;background:currentColor;content:"";transition:transform .25s ease,background .25s ease;}
  .nav-toggle-bar{position:relative;}
  .nav-toggle-bar::before{position:absolute;top:-7px;}
  .nav-toggle-bar::after{position:absolute;top:7px;}
  /* Hamburger morphs to an X when open */
  .nav-toggle[aria-expanded="true"] .nav-toggle-bar{background:transparent;}
  .nav-toggle[aria-expanded="true"] .nav-toggle-bar::before{transform:translateY(7px) rotate(45deg);}
  .nav-toggle[aria-expanded="true"] .nav-toggle-bar::after{transform:translateY(-7px) rotate(-45deg);}

  /* Keep the phone CTA on the right, hamburger just after it */
  .header-cta{order:2;margin-left:auto;margin-right:4px;}

  /* Collapsed nav */
  .main-nav{display:none;}

  /* Expanded nav drops below the header as a solid navy panel */
  .main-nav.is-open{
    display:flex;flex-direction:column;align-items:stretch;gap:0;
    position:absolute;top:100%;left:0;right:0;
    background:rgba(10,29,58,0.97);
    -webkit-backdrop-filter:blur(10px) saturate(140%);
    backdrop-filter:blur(10px) saturate(140%);
    border-top:2px solid var(--orange);
    box-shadow:0 18px 34px rgba(0,0,0,0.32);
    padding:8px 22px 18px;
  }
  .main-nav.is-open > a,
  .main-nav.is-open .has-sub > a{
    width:100%;padding:14px 0;font-size:13px;
    border-bottom:1px solid rgba(255,255,255,0.08);
  }
  .main-nav.is-open .has-sub{width:100%;}
  .main-nav.is-open .has-sub > a::after{margin-left:auto;}

  /* Submenus expand inline (hover doesn't exist on touch) */
  .main-nav.is-open .submenu{
    position:static;transform:none;min-width:0;
    opacity:1;visibility:visible;pointer-events:auto;
    background:transparent;border:0;box-shadow:none;
    -webkit-backdrop-filter:none;backdrop-filter:none;
    padding:2px 0 6px 14px;
  }
  .main-nav.is-open .submenu a{padding:9px 0;}
}