/* ==========================================================================
   DD Inc. — unified header for the React (SPA) routes
   The compiled app ships its own header with the old menu (Home / About /
   Our Services / Journal). This file hides it and styles the replacement
   header injected by spa-header.js, so /services/*, /Presentation etc.
   carry exactly the same menu as the rebuilt static pages.
   Everything is scoped to .ddhdr so it cannot collide with the app's CSS.
   Added 2026-07-26.
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&family=Playfair+Display:wght@400;500;600;700&display=swap");

/* the app's own header — replaced */
body.ddhdr-on header.fixed{ display:none !important; }

.ddhdr{
  --hdr-cream:#faf8f6;
  --hdr-navy:#00122c;
  --hdr-ink:#0b1b38;
  --hdr-gold:#c98a38;
  position:fixed;
  top:0; left:0; right:0;
  z-index:1000;
  background:var(--hdr-navy);
  border-bottom:1px solid rgba(201,138,56,.18);
  font-family:"DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}
.ddhdr *{ box-sizing:border-box; }
.ddhdr a{ text-decoration:none; color:inherit; }

.ddhdr-inner{
  display:flex; align-items:center; gap:32px;
  height:88px;
  width:100%; max-width:1360px;
  margin-inline:auto; padding-inline:40px;
}

.ddhdr-brand{ display:flex; align-items:center; gap:14px; flex:0 0 auto; }
.ddhdr-brand img{ width:56px; height:auto; display:block; }
.ddhdr-rule{ width:1px; height:44px; background:var(--hdr-gold); opacity:.55; }
.ddhdr-txt{ display:flex; flex-direction:column; gap:3px; }
.ddhdr-name{
  font-family:"Playfair Display", Georgia, serif;
  font-size:27px; font-weight:600; line-height:1;
  color:#ffffff; letter-spacing:.01em;
}
.ddhdr-name span{ font-size:20px; font-weight:500; }
.ddhdr-tag{ font-size:11.5px; color:var(--hdr-gold); line-height:1; }

.ddhdr-nav{ display:flex; align-items:center; gap:34px; margin-left:auto; }
.ddhdr-item{ position:relative; }
.ddhdr-link{
  font-size:12.5px; font-weight:500; letter-spacing:.11em; text-transform:uppercase;
  color:#faf8f6; background:none; border:0; padding:0;
  font-family:inherit; cursor:pointer;
  display:inline-flex; align-items:center; gap:7px; white-space:nowrap;
  transition:color .18s ease;
}
.ddhdr-link:hover{ color:var(--hdr-gold); }
.ddhdr-link.is-active{ position:relative; }
.ddhdr-link.is-active::after{
  content:""; position:absolute; left:0; right:0; bottom:-9px;
  height:2px; background:var(--hdr-gold);
}
.ddhdr-caret{
  width:7px; height:7px;
  border-right:1.4px solid currentColor; border-bottom:1.4px solid currentColor;
  transform:translateY(-2px) rotate(45deg);
}

.ddhdr-menu{
  position:absolute; top:calc(100% + 18px); left:50%;
  transform:translateX(-50%) translateY(-6px);
  min-width:270px;
  background:var(--hdr-navy);
  border:1px solid rgba(201,138,56,.28);
  padding:8px 0;
  opacity:0; visibility:hidden;
  transition:opacity .18s ease, transform .18s ease, visibility .18s;
}
.ddhdr-item.open .ddhdr-menu{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.ddhdr-menu a{ display:block; padding:11px 22px; font-size:13px; color:#fff; }
.ddhdr-menu a:hover{ background:rgba(201,138,56,.14); color:var(--hdr-gold); }

.ddhdr-cta{
  flex:0 0 auto;
  display:inline-flex; align-items:center; gap:10px;
  background:transparent; color:#d08329;
  border:1px solid var(--hdr-gold);
  font-size:13px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  padding:13px 22px;
  transition:background-color .18s ease, color .18s ease;
}
.ddhdr-cta:hover{ background:var(--hdr-gold); color:var(--hdr-navy); }
.ddhdr-arrow{ display:inline-block; width:22px; height:1.5px; background:currentColor; position:relative; }
.ddhdr-arrow::after{
  content:""; position:absolute; right:0; top:50%;
  width:7px; height:7px;
  border-top:1.5px solid currentColor; border-right:1.5px solid currentColor;
  transform:translateY(-50%) rotate(45deg);
}

.ddhdr-burger{ display:none; background:none; border:0; padding:8px; cursor:pointer; margin-left:auto; }
.ddhdr-burger span{ display:block; width:24px; height:2px; background:#ffffff; margin:5px 0; }

@media (max-width:1360px){ .ddhdr-inner{ gap:22px; } .ddhdr-nav{ gap:24px; } .ddhdr-link{ font-size:11.5px; letter-spacing:.08em; } }
@media (max-width:1180px){
  .ddhdr-inner{ gap:16px; } .ddhdr-nav{ gap:17px; }
  .ddhdr-link{ font-size:11px; letter-spacing:.06em; }
  .ddhdr-cta{ padding:13px 16px; font-size:11.5px; }
  .ddhdr-brand img{ width:48px; } .ddhdr-name{ font-size:23px; }
}
@media (max-width:980px){
  .ddhdr-inner{ padding-inline:28px; }
  .ddhdr-nav, .ddhdr-cta{ display:none; }
  .ddhdr-burger{ display:block; }
  .ddhdr.open .ddhdr-nav{
    display:flex; position:absolute; top:88px; left:0; right:0;
    flex-direction:column; align-items:flex-start; gap:0;
    background:var(--hdr-navy); padding:14px 28px 22px;
  }
  .ddhdr.open .ddhdr-nav .ddhdr-link{ color:#fff; padding:13px 0; }
  .ddhdr.open .ddhdr-menu{
    position:static; transform:none; opacity:1; visibility:visible;
    border:0; background:transparent; min-width:0; padding:0 0 8px 14px;
  }
}
@media (prefers-reduced-motion:reduce){ .ddhdr *{ transition:none !important; } }