/* HourNerd: expanded services and a consistent, compact navigation. */
.nav { gap: 24px; }
.nav > a, .nav summary { font-size: 13px; white-space: nowrap; }
.nav-disclosure { position: relative; }
.nav-disclosure summary { display: flex; align-items: center; gap: 7px; cursor: pointer; list-style: none; padding: 12px 0; }
.nav-disclosure summary::-webkit-details-marker { display: none; }
.nav-disclosure summary::after { content: ''; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-2px); margin-left: 3px; }
.nav-disclosure[open] summary::after { transform: rotate(225deg) translate(-1px, -1px); }
.nav-disclosure summary:hover, .nav a[aria-current="page"] { color: var(--mint); }
.nav-menu { position: absolute; top: calc(100% + 9px); left: -18px; width: 310px; display: grid; gap: 2px; padding: 13px; background: #0d2337; border: 1px solid #355468; border-radius: 10px; box-shadow: 0 18px 45px #0005; z-index: 12; }
.nav-menu a { display: block; padding: 10px 12px; border-radius: 6px; white-space: normal; font-size: 13px; line-height: 1.5; }
.nav-menu a:hover, .nav-menu a:focus-visible { background: #214858; color: #a7f8df; }
.nav-menu .nav-all { color: var(--mint); border-top: 1px solid #355468; border-radius: 0; margin-top: 5px; padding-top: 13px; }
.nav-disclosure summary:focus-visible { outline: 2px solid var(--mint); outline-offset: 5px; border-radius: 3px; }
.service-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.service-card { min-height: 385px; }
.service-card h3 { max-width: none; }
.creative-service { border-top: 3px solid #299d86; }
.creative-service .service-icon { background: #e0f4ec; }
.creative-service .card-label { color: #568074; }
.creative-service .card-link { padding-top: 16px; }
.creative-bridge { background: #eaf3f0; }
.creative-intro { max-width: 770px; color: #58756e; margin-top: -16px; margin-bottom: 30px; }
.footer-main { grid-template-columns: 1.3fr 1fr 1fr .9fr; gap: 36px; }
.footer-main > div { min-width: 0; }
.footer-main > div:not(:first-child) { display: flex; flex-direction: column; gap: 9px; }
.footer-main a:not(.brand) { line-height: 1.55; }
.footer-main h4 { margin-bottom: 12px; }
.service-page .detail-hero { padding-bottom: 95px; }
.service-page .detail-hero h1 { max-width: 940px; }
.service-page .detail-section .detail-cards { margin-top: 34px; }
.service-page .detail-card { height: 100%; }
.service-scope-note { border-left: 3px solid #1c9e85; padding: 14px 20px; background: #edf7f3; color: #345f53; margin-top: 30px; max-width: 800px; font-size: 14px; }
@media (max-width: 1080px) {
  .nav-toggle { display: block; min-width: 44px; min-height: 44px; }
  .nav { display: none; position: absolute; left: 0; right: 0; top: 100px; padding: 18px 24px 25px; flex-direction: column; align-items: stretch; gap: 3px; background: #0a1c2c; border-bottom: 1px solid #34566e; max-height: calc(100dvh - 100px); overflow-y: auto; }
  .nav.open { display: flex; }
  .nav > a, .nav summary { padding: 11px 10px; font-size: 14px; }
  .nav summary { justify-content: space-between; }
  .nav-menu { position: static; width: auto; box-shadow: none; margin: 0 10px 9px; padding: 7px; }
  .nav-menu a { padding: 10px 12px; font-size: 13px; }
  .nav-cta { justify-content: center; margin-top: 9px; }
}
@media (max-width: 900px) {
  .nav { top: 88px; max-height: calc(100dvh - 88px); }
  .footer-main { grid-template-columns: 1fr 1fr; gap: 38px; }
}
@media (max-width: 820px) {
  .service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .service-card.featured { grid-column: auto; min-height: 385px; }
}
@media (max-width: 560px) {
  .nav { top: 76px; max-height: calc(100dvh - 76px); }
  .service-grid { grid-template-columns: 1fr; }
  .service-card, .service-card.featured { min-height: 330px; }
  .footer-main { grid-template-columns: 1fr; gap: 25px; }
  .service-page .detail-hero { padding: 60px 0; }
  .creative-intro { margin-top: -16px; }
}