/* ============================================================================
   DES website styles: matched to the finished DES Brand Kit v1.0 (Oct 2026)
   Source: DES Brand Kit/06 Brand Guidelines/Color Files/DES_brand-colors.css + DES_Brand_Guidelines.pdf
   Palette (official only): Navy #0A1931 | Steel Blue #8FB3D9 | Mist #E6EEF7 | Accent Blue #6E95C2
                            Mid Blue #5E86B3 | Sun #C9DAEC (logo only, not used here) | Slate #4E5D6E | White
   Type: Red Hat Display (self-hosted, SIL OFL 1.1, see assets/fonts/OFL.txt)
         Headlines 700-900 | Labels 600 letter-spaced caps | Text 400-500
   AA notes: Accent Blue (3.1:1) and Mid Blue (3.8:1) fail AA for small text on white, so they are used only
   for decoration (bars, rules, borders, focus rings). Small text uses Navy (17.5:1) or Slate (6.7:1 white, 5.8:1 Mist).
   ============================================================================ */
@font-face{font-family:"Red Hat Display";font-style:normal;font-weight:300 900;font-display:swap;
 src:url("../fonts/RedHatDisplay-VariableFont_wght.woff2") format("woff2"),url("../fonts/RedHatDisplay-VariableFont_wght.ttf") format("truetype")}
:root{
  --des-des-navy:#0A1931;--des-steel-blue:#8FB3D9;--des-mist:#E6EEF7;--des-accent-blue:#6E95C2;
  --des-mid-blue:#5E86B3;--des-sun:#C9DAEC;--des-slate:#4E5D6E;--des-white:#FFFFFF;
  --des-font-display:'Red Hat Display','Segoe UI',Arial,sans-serif;
  --des-font-body:'Red Hat Display',Calibri,Arial,sans-serif;
  --navy:var(--des-des-navy);--steel:var(--des-steel-blue);--mist:var(--des-mist);--accent:var(--des-accent-blue);
  --mid:var(--des-mid-blue);--slate:var(--des-slate);--white:var(--des-white);
  --radius:4px;--max:1140px;--logo-h:44px;--logo-x:25px /* clear space X = height of the D at 44px */}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--des-font-body);font-weight:400;font-size:1.0625rem;line-height:1.6;color:var(--navy);background:var(--white)}
h1,h2,h3{font-family:var(--des-font-display);line-height:1.15;color:var(--navy);margin:0 0 .6em}
h1{font-weight:900;font-size:clamp(2rem,4.6vw,3.2rem);text-transform:uppercase;letter-spacing:.01em}
h2{font-weight:800;font-size:clamp(1.55rem,3vw,2.15rem)}
h3{font-weight:700;font-size:1.25rem}
p{margin:0 0 1em}
strong,b{font-weight:600}
a{color:var(--navy);text-decoration-color:var(--mid);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{text-decoration-color:var(--navy)}
img{max-width:100%;height:auto}
.container{max-width:var(--max);margin:0 auto;padding:0 1.25rem}
.skip{position:absolute;left:-999px;top:0;background:var(--white);padding:.5rem 1rem;z-index:100}.skip:focus{left:1rem}
:focus-visible{outline:3px solid var(--mid);outline-offset:2px}
.geo :focus-visible,.site-footer :focus-visible,.cta-band :focus-visible{outline-color:var(--steel)}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* labels: 600, letter-spaced caps */
.eyebrow{font-family:var(--des-font-display);text-transform:uppercase;letter-spacing:.18em;font-size:.8rem;font-weight:600;color:var(--slate);margin-bottom:.55rem}
.eyebrow-light{color:var(--steel)}
/* three stacked bars (Cover C4 motif) in official colors */
.bars{display:flex;flex-direction:column;gap:5px;margin-bottom:1.1rem}
.bars span{display:block;height:7px}
.bars span:nth-child(1){width:92px;background:var(--navy)}
.bars span:nth-child(2){width:64px;background:var(--mid)}
.bars span:nth-child(3){width:37px;background:var(--steel)}
.cta-band .bars span:nth-child(1){background:var(--white)}
/* header: light header logo, clear space X on all sides */
.site-header{background:var(--white);border-bottom:1px solid var(--mist);position:sticky;top:0;z-index:50}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--logo-x);padding:var(--logo-x) 1.25rem}
.brand{display:block;line-height:0;flex:none}
.brand img{height:var(--logo-h);width:auto}
.nav-toggle{display:none;background:none;border:2px solid var(--navy);color:var(--navy);border-radius:var(--radius);padding:.45rem .8rem;font:inherit;font-weight:600;text-transform:uppercase;letter-spacing:.12em;font-size:.82rem;cursor:pointer}
.nav ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:1.5rem}
.nav a{text-decoration:none;color:var(--navy);font-weight:600;font-size:.86rem;text-transform:uppercase;letter-spacing:.12em}
.nav a:hover{box-shadow:inset 0 -2px 0 var(--mid)}
.nav a[aria-current="page"]{box-shadow:inset 0 -3px 0 var(--steel)}
.btn{display:inline-block;background:var(--navy);color:var(--white)!important;text-decoration:none;font-family:var(--des-font-display);font-weight:600;text-transform:uppercase;letter-spacing:.12em;font-size:.86rem;padding:.85rem 1.4rem;border-radius:var(--radius);border:2px solid var(--navy);cursor:pointer}
.btn:hover{background:var(--slate);border-color:var(--slate)}
.btn-steel{background:var(--steel);border-color:var(--steel);color:var(--navy)!important}.btn-steel:hover{background:var(--white);border-color:var(--white)}
.btn-outline-light{background:transparent;border-color:var(--white);color:var(--white)!important}.btn-outline-light:hover{background:var(--white);color:var(--navy)!important;border-color:var(--white)}
.nav .btn{padding:.6rem 1rem;font-size:.8rem}
.nav .btn:hover{box-shadow:none}
@media (max-width:1100px){.nav ul{gap:1.1rem}.nav a{letter-spacing:.08em}}
@media (max-width:1000px){
 .nav-wrap{padding:16px 1.25rem}
 .nav-toggle{display:block}
 .nav{position:absolute;left:0;right:0;top:100%;background:var(--white);border-bottom:3px solid var(--steel);display:none}
 .nav.open{display:block}
 .nav ul{flex-direction:column;align-items:stretch;gap:0;padding:.5rem 1.25rem 1rem}
 .nav li a{display:block;padding:.8rem 0;border-bottom:1px solid var(--mist)}
 .nav li:last-child a{border:0;margin-top:.75rem;text-align:center}
 .nav a[aria-current="page"]{box-shadow:inset 4px 0 0 var(--steel);padding-left:.75rem}
}
/* geometric navy hero (Cover C4): solid DES Navy, Steel Blue diagonal stripe, Mid Blue facet */
.geo{position:relative;color:var(--mist);padding-bottom:110px;isolation:isolate;background:transparent}
.geo::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--steel);clip-path:polygon(0 0,100% 0,100% calc(100% - 64px),0 100%)}
.geo::after{content:"";position:absolute;inset:0;z-index:-1;background:var(--navy);clip-path:polygon(0 0,100% 0,100% calc(100% - 84px),0 calc(100% - 18px))}
.geo-facet{position:absolute;top:0;right:0;width:38%;height:60%;background:var(--mid);opacity:.35;clip-path:polygon(100% 0,100% 100%,0 0);z-index:0;pointer-events:none}
.geo>.container{position:relative;z-index:1}
.geo h1{color:var(--white)}
.geo .lead{color:var(--mist)}
.geo a:not(.btn){color:var(--white);text-decoration-color:var(--steel)}
.hero{padding-top:4.5rem}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:3rem;align-items:center}
.lead{font-size:1.2rem;font-weight:400}
.actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.6rem}
.hero-media{margin:0;position:relative;aspect-ratio:16/10;background:var(--navy);border:3px solid var(--steel)}
.hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.page-hero{padding:3.5rem 0 100px}
.page-hero .lead{max-width:960px}
@media (max-width:900px){.hero{padding-top:3rem}.hero-grid{grid-template-columns:1fr;gap:2rem}
 .geo{padding-bottom:70px}.geo::before{clip-path:polygon(0 0,100% 0,100% calc(100% - 30px),0 100%)}.geo::after{clip-path:polygon(0 0,100% 0,100% calc(100% - 42px),0 calc(100% - 12px))}}
/* sections: Navy and White dominate, Mist panels */
.section{padding:4rem 0}.section.alt{background:var(--mist)}
.section-head{max-width:780px;margin-bottom:2rem}
.section-head p:not(.eyebrow){color:var(--slate)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.card{background:var(--white);border:1px solid var(--mist);border-top:5px solid var(--navy);padding:1.5rem}
.card:nth-child(2){border-top-color:var(--mid)}.card:nth-child(3){border-top-color:var(--steel)}
.card h3{margin-bottom:.4rem}
.card .tag{font-size:.76rem;font-weight:600;color:var(--slate);text-transform:uppercase;letter-spacing:.18em}
.card ul,.checklist{margin:.5rem 0 1rem;padding-left:1.2rem;color:var(--slate)}.card li,.checklist li{margin:.25rem 0}
.card a{font-weight:600}
.clients{display:flex;flex-wrap:wrap;gap:.6rem;list-style:none;padding:0;margin:0}
.clients li{background:var(--white);border-left:4px solid var(--steel);padding:.55rem 1rem;font-weight:500}
.two{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:start}
.two p{color:var(--slate)}
@media (max-width:900px){.cards{grid-template-columns:1fr}.two{grid-template-columns:1fr}}
/* CTA band */
.cta-band{background:var(--navy);color:var(--white);padding:3rem 0;border-top:6px solid var(--steel)}
.cta-band h2{color:var(--white)}.cta-band p{color:var(--mist);margin:0}
.cta-band .btn{background:var(--steel);color:var(--navy)!important;border-color:var(--steel)}
.cta-band .btn:hover{background:var(--white);border-color:var(--white)}
.cta-band .btn-outline-light{background:transparent;color:var(--white)!important;border-color:var(--white)}
.cta-band .btn-outline-light:hover{background:var(--white);color:var(--navy)!important}
.cta-inner{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1.5rem 2rem}
.cta-inner .bars{margin:0}
@media (max-width:900px){.cta-inner{grid-template-columns:1fr}}
.phase{border-left:5px solid var(--steel);padding:.25rem 0 .25rem 1.25rem;margin:2rem 0}
.phase:nth-of-type(1){border-left-color:var(--navy)}.phase:nth-of-type(2){border-left-color:var(--mid)}
.toc{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.25rem}
.geo .toc a{border:1px solid var(--steel);padding:.4rem .9rem;text-decoration:none;font-weight:600;color:var(--white);font-size:.9rem}
.geo .toc a:hover{background:var(--steel);color:var(--navy)}
/* contact */
.contact-list{list-style:none;padding:0;margin:0 0 1.5rem}.contact-list li{margin:0 0 1rem}
.contact-list strong{display:block;font-size:.76rem;text-transform:uppercase;letter-spacing:.18em;font-weight:600;color:var(--slate)}
.big-tel{font-size:1.6rem;font-weight:800;text-decoration:none;color:var(--navy)}
form .row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media (max-width:600px){form .row{grid-template-columns:1fr}}
label{display:block;font-weight:600;margin-bottom:.3rem}
input,textarea{width:100%;font:inherit;padding:.7rem .8rem;border:1px solid var(--slate);border-radius:var(--radius);background:var(--white);color:var(--navy)}
input:focus,textarea:focus{border-color:var(--navy)}
textarea{min-height:150px;resize:vertical}
.field{margin-bottom:1rem}.req{color:var(--navy);font-weight:800}
.hint{font-size:.9rem;color:var(--slate)}
.form-status{margin-top:1rem;font-weight:600}
/* footer: DES Navy band, Steel Blue accent + rule (Cover C4 footer) */
.site-footer{background:var(--navy);color:var(--mist);font-size:.98rem}
.footer-accent{height:6px;width:31%;background:var(--steel)}
.site-footer .container{padding-top:2.75rem}
.site-footer a{color:var(--white);text-decoration-color:var(--steel)}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr .8fr;gap:2rem}
.site-footer h2{color:var(--steel);font-size:.78rem;text-transform:uppercase;letter-spacing:.18em;font-weight:600}
.site-footer ul{list-style:none;padding:0;margin:0}.site-footer li{margin:.3rem 0}
.foot-bar{border-top:1px solid var(--steel);margin-top:2.5rem}
.foot-bar .container{padding:1rem 1.25rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.foot-line{margin:0;text-transform:uppercase;letter-spacing:.12em;font-size:.74rem;font-weight:600;color:var(--white)}
.foot-line a{text-decoration:none}
.foot-copy{margin:0;font-size:.8rem;color:var(--mist)}
@media (max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.foot-grid{grid-template-columns:1fr}.footer-accent{width:55%}}
/* v5/v6: photos, phases, RFP box, select */
.btn-outline{background:transparent;color:var(--navy)!important;border-color:var(--navy)}.btn-outline:hover{background:var(--navy);color:var(--white)!important}
.cta-band .btn.btn-outline{background:transparent;color:var(--white)!important;border-color:var(--white)}.cta-band .btn.btn-outline:hover{background:var(--white);color:var(--navy)!important}
.more-line{margin:1.75rem 0 0;color:var(--slate)}.more-line a{font-weight:600}
.phase-desc{color:var(--slate);max-width:820px}
.phase{scroll-margin-top:110px}#rfp,#proposal{scroll-margin-top:110px}
.rfp-box{display:grid;grid-template-columns:1fr auto;gap:1.5rem 2rem;align-items:center;background:var(--mist);border-left:6px solid var(--navy);padding:2rem}
.rfp-box h2{margin-bottom:.4rem}.rfp-box p:not(.eyebrow){color:var(--slate);margin:0}
select{width:100%;font:inherit;padding:.7rem .8rem;border:1px solid var(--slate);border-radius:var(--radius);background:var(--white);color:var(--navy)}
select:focus{border-color:var(--navy)}

@media (max-width:900px){.rfp-box{grid-template-columns:1fr}}
@media (max-width:600px){.rfp-box{padding:1.5rem}}

/* v7/v8: About history + assessment cards (brand double-wave accent in Accent Blue), Contact next-steps box */
.history{max-width:760px;margin:0 auto;text-align:center}
.history .bars{align-items:center}
.history p:not(.eyebrow){color:var(--slate);font-size:1.12rem}
.approach{margin-top:3.5rem}
.approach h2{text-align:center;margin-bottom:1.75rem}
.approach-sub{text-align:center;color:var(--slate);margin:-1rem auto 1.75rem;max-width:760px}
.assess{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem}
.assess a{display:flex;flex-direction:column;height:100%;text-decoration:none;color:var(--navy);background:var(--mist);border-top:5px solid var(--steel);padding:1.25rem 1.25rem 1.3rem}
.assess li:nth-child(1) a{border-top-color:var(--navy)}.assess li:nth-child(2) a{border-top-color:var(--mid)}
.assess a:hover .step-title,.assess a:hover .assess-more{text-decoration:underline;text-decoration-color:var(--mid);text-decoration-thickness:2px;text-underline-offset:3px}
.svc-wave{display:block;margin-bottom:.8rem}
.svc-wave path{fill:none;stroke:var(--accent);stroke-width:2.2;stroke-linecap:round}
.step-tag{font-size:.74rem;font-weight:600;text-transform:uppercase;letter-spacing:.18em;color:var(--slate);margin-bottom:.3rem}
.step-title{font-family:var(--des-font-display);font-weight:800;font-size:1.2rem;margin-bottom:.45rem}
.step-desc{color:var(--slate);font-size:.97rem;line-height:1.5;margin-bottom:.9rem}
.assess-more{margin-top:auto;font-weight:600;font-size:.95rem}
@media (max-width:1000px){.assess{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.assess{grid-template-columns:1fr}}
.page-hero-short{padding-bottom:96px}.page-hero-short h1{margin-bottom:.2em}
.next-box{background:var(--mist);border-left:6px solid var(--steel);padding:1.5rem 1.75rem;margin-top:.5rem}
.next-box h3{margin-bottom:.4rem}
.next-box .checklist{margin-bottom:0}
.next-steps{counter-reset:s;list-style:none;padding:0;margin:.6rem 0 1.6rem}
.next-steps li{counter-increment:s;position:relative;padding-left:2.9rem;margin:.9rem 0;color:var(--slate);min-height:2rem}
.next-steps li::before{content:counter(s);position:absolute;left:0;top:-.05rem;width:2rem;height:2rem;border-radius:50%;background:var(--navy);color:var(--white);font-weight:800;font-size:.95rem;display:grid;place-items:center}
/* v9: brand-kit seals (About: primary seal; footer: reverse seal on navy) */
.about-seal{display:block;width:220px;height:220px;margin:0 auto 1.5rem}
.foot-brand{display:flex;align-items:center;gap:1.25rem}
.foot-brand p{margin:0}
.foot-seal{flex:none;width:120px;height:120px}
@media (max-width:900px){.foot-brand{grid-column:1 / -1}}
@media (max-width:600px){.about-seal{width:160px;height:160px}}
@media (max-width:520px){.foot-brand{flex-direction:column;align-items:flex-start;gap:1rem}}
