/* Site chrome: SiteNav (top, compact, mobile, dock, menu dialog), Blue CTA
   band, Ink footer, contact links and proof strip (brief 2.3 to 2.5). */

/* SiteNav: top state ------------------------------------------------------ */
.dc-site-header{position:relative;z-index:var(--z-nav)}
/* .dc-nav is a size container so the compact morph can place things in px of its width (100cqw, the window less any scroll bar). */
.dc-nav{position:fixed;top:0;left:0;right:0;z-index:var(--z-nav);display:flex;justify-content:center;pointer-events:none;container-type:inline-size}
.dc-nav__bar{pointer-events:auto;position:relative;z-index:0;width:min(1440px,100%);height:88px;padding:0 var(--margin);display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);color:var(--dc-ink);transition:color 320ms}
.dc-nav[data-theme=ink]:not(.is-compact) .dc-nav__bar{color:var(--dc-paper)}
.dc-nav__logo{display:flex;align-items:center;height:44px;color:inherit;text-decoration:none;flex:none}
.dc-nav__logo:hover{color:inherit}
.dc-nav__dc{font:900 26px/1 var(--font-display);letter-spacing:-.05em}
.dc-nav__slash{display:block;width:4px;height:24px;background:var(--dc-blue);transform:skewX(-18deg);margin:0 3px 0 7px;transition:background-color 320ms}
.dc-nav[data-theme=ink] .dc-nav__slash,.dc-nav.is-compact .dc-nav__slash{background:var(--dc-signal-blue)}
.dc-nav__word{font:300 11px/1.7 var(--font-body);letter-spacing:.32em;text-transform:uppercase;white-space:nowrap}
.dc-nav__right{display:flex;align-items:center;gap:36px}
.dc-nav__links{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.dc-nav__link{color:inherit;text-decoration:none;font:500 14px/1 var(--font-body);padding:6px 0;background:linear-gradient(currentColor,currentColor) no-repeat 0 100%/0% 1px;transition:background-size 280ms var(--ease-ui)}
.dc-nav__link:hover,.dc-nav__link[aria-current=page]{background-size:100% 1px;color:inherit}
.dc-nav__menu-btn{position:relative;display:none;align-items:center;height:44px;padding:0 16px;border:1px solid transparent;background:transparent;color:inherit;font:500 14px/1 var(--font-body);cursor:pointer}
/* The Menu button's outline is a layer over its own (transparent) border, so the compact bar can draw it 40px tall by transform (QA cycle 4). */
.dc-nav__menu-btn::before{content:'';position:absolute;inset:-1px;border:1px solid currentColor;pointer-events:none;transition:transform 640ms var(--ease-out)}
.dc-nav__progress{position:absolute;left:0;right:0;bottom:0;height:2px;opacity:0;transition:opacity 320ms}
.dc-nav__progress span{display:block;height:100%;background:var(--dc-signal-blue);transform-origin:0 50%;transform:scaleX(0)}
.dc-nav__phone{color:inherit;font:500 14px/1 var(--font-body);text-decoration:none}
.dc-nav__phone:hover{color:var(--dc-blue)}
.dc-nav--focused .dc-nav__right{gap:var(--space-6)}

/* Compact state: the floating Ink bar after 160px (Home: 55% of the viewport).
   QA cycle 4 (A1): the morph is drawn by clip-path, opacity and translate only;
   the bar's box never changes size or place, so scrolling past the top moves
   no layout. The Ink pill is a layer of the bar clipped from the whole bar to
   the compact shape (min(860px, 100% - 32px) wide, 56px tall, 14px from the
   top); the logo, the links, Menu and Start a project travel by translate to
   where the compact bar used to put them (20px in from the pill's left, 8px in
   from its right, the links 24px from Start a project); the progress line sits
   on the pill's bottom edge. Clicks outside the pill reach the page, as before.
   translate (not transform) leaves the magnetic button's own transform free.
   The right-hand group has no box of its own (display: contents), so when the
   fit rule swaps the links for Menu no box changes place (A2). */
.dc-nav.is-compact .dc-nav__bar{color:var(--dc-paper)}
.dc-nav.is-compact .dc-nav__progress{opacity:1}
.dc-nav.is-compact .dc-nav__link:focus-visible,.dc-nav.is-compact .dc-nav__menu-btn:focus-visible{outline-color:var(--dc-signal-blue)}
@media (min-width:760px){
	.dc-nav__bar::before{content:'';position:absolute;inset:0;z-index:-1;background:var(--dc-ink);opacity:0;clip-path:inset(0px 0px 0px 0px);pointer-events:auto;transition:clip-path 640ms var(--ease-out),opacity 320ms}
	.dc-nav.is-compact .dc-nav__bar{pointer-events:none}
	.dc-nav.is-compact .dc-nav__bar::before{opacity:1;clip-path:inset(14px calc((100% - min(860px, 100% - 32px)) / 2) 18px calc((100% - min(860px, 100% - 32px)) / 2))}
	.dc-nav[data-nav] .dc-nav__bar{justify-content:flex-start}
	.dc-nav[data-nav] .dc-nav__right{display:contents}
	.dc-nav[data-nav] .dc-nav__links,.dc-nav[data-nav] .dc-nav__menu-btn{margin-left:auto}
	.dc-nav[data-nav] .dc-nav__cta{margin-left:12px}
	.dc-nav__logo,.dc-nav__links,.dc-nav__menu-btn,.dc-nav__cta{pointer-events:auto;transition:translate 640ms var(--ease-out)}
	.dc-nav__cta{transition:translate 640ms var(--ease-out),transform 420ms var(--ease-out)}
	.dc-nav.is-compact .dc-nav__logo{translate:calc((min(1440px, 100cqw) - min(860px, 100cqw - 32px)) / 2 + 20px - var(--margin)) -2px}
	.dc-nav.is-compact .dc-nav__cta{translate:calc((min(860px, 100cqw - 32px) - min(1440px, 100cqw)) / 2 - 8px + var(--margin)) -2px}
	.dc-nav.is-compact .dc-nav__links,.dc-nav.is-compact .dc-nav__menu-btn{translate:calc((min(860px, 100cqw - 32px) - min(1440px, 100cqw)) / 2 + 4px + var(--margin)) -2px}
	.dc-nav.is-compact .dc-nav__menu-btn::before{transform:scaleY(.9091)}
	.dc-nav__progress{left:calc((100% - min(860px, 100% - 32px)) / 2);right:calc((100% - min(860px, 100% - 32px)) / 2);bottom:18px}
	/* A2: Start a project keeps its place and its one line whatever the links do,
	   and links that cannot fit are clipped rather than pushing it, so the fit
	   rule collapsing them into Menu moves nothing. Where the fit is decided by
	   measuring (up to 1023px), the links wait, invisible but in place, until
	   dc-core.js has measured them. */
	.dc-nav__links{min-width:0;overflow:clip;overflow-clip-margin:8px}
	.dc-nav__menu-btn,.dc-nav__cta{flex:none}
	.dc-nav__cta .dc-btn{white-space:nowrap}
}
@media (min-width:760px) and (max-width:1023px){html.dc-js .dc-nav[data-nav]:not([data-fit]) .dc-nav__links{visibility:hidden}}

/* Fit rule: links collapse into Menu while the CTA stays. */
.dc-nav.is-collapsed .dc-nav__links{display:none}
.dc-nav.is-collapsed .dc-nav__menu-btn{display:inline-flex}

/* Mobile: 68px top bar that scrolls away, thumb dock, menu dialog. */
@media (max-width:759px){
	.dc-nav,.dc-nav.is-compact{position:absolute}
	.dc-nav .dc-nav__bar,.dc-nav.is-compact .dc-nav__bar{width:100%;height:68px;margin:0;padding:0 20px;background-color:transparent;color:var(--dc-ink)}
	.dc-nav[data-theme=ink] .dc-nav__bar{color:var(--dc-paper)}
	.dc-nav .dc-nav__links,.dc-nav .dc-nav__cta,.dc-nav .dc-nav__progress{display:none}
	.dc-nav .dc-nav__menu-btn{display:inline-flex;height:44px}
	.dc-nav__dc{font-size:24px}
	.dc-nav__slash{height:22px;margin:0 7px 0 6px}
	.dc-nav__word{font-size:10px;line-height:1}
	.dc-nav--focused .dc-nav__right .dc-btn{display:none}
	/* A long section word never pushes Menu past the window edge: the word gives
	   way at its end (its trailing space first) while DC and the slash keep their size. */
	.dc-nav__logo{flex:0 1 auto;min-width:0}
	.dc-nav__dc,.dc-nav__slash{flex:none}
	.dc-nav__word{min-width:0;overflow:hidden}
}
html:not(.dc-js) .dc-nav__menu-btn,html:not(.dc-js) .dc-dock{display:none!important}
html:not(.dc-js) .dc-nav__links{flex-wrap:wrap}

.dc-dock{position:fixed;left:12px;right:12px;bottom:12px;z-index:var(--z-dock);display:none;gap:var(--space-2);transform:translateY(140%);visibility:hidden;transition:transform 560ms var(--ease-out),visibility 0s linear 560ms}
.dc-dock.is-visible{transform:none;visibility:visible;transition:transform 560ms var(--ease-out),visibility 0s}
.dc-dock__cta{flex:1;min-width:0}
html:not(.dc-menu-open) .dc-dock.is-context-hidden{visibility:hidden;transform:translateY(140%);transition:none;pointer-events:none}
@media(max-width:759px){.dc-dock{bottom:calc(12px + env(safe-area-inset-bottom,0px))}.dc-dock__cta{white-space:normal;text-align:center;font-size:14px;line-height:1.35;padding:12px}}
/* Keyboard focus never lands behind the fixed header or the mobile dock (accessibility S4).
   While the consent banner shows, its script sets the larger of these and its own height inline. */
@media (min-width:760px){html{scroll-padding-top:calc(var(--header-h) + 8px)}}
@media (max-width:759px){html{scroll-padding-bottom:96px}.dc-menu{scroll-padding-bottom:96px}}
@media (max-width:759px){.dc-dock{display:flex}}

.dc-menu{position:fixed;inset:0;z-index:var(--z-menu);background:var(--dc-ink);color:var(--dc-paper);display:flex;flex-direction:column;padding:28px var(--margin) 96px;overflow-y:auto;clip-path:polygon(122% 0%,124% 0%,104% 100%,102% 100%);transition:clip-path 640ms var(--ease-in-out)}
.dc-menu.is-open{clip-path:polygon(0% 0%,124% 0%,104% 100%,-20% 100%)}
.dc-menu[hidden]{display:none}
.dc-menu__head{position:relative}
.dc-menu__lockup{flex-wrap:nowrap}
.dc-menu__close{position:absolute;top:0;right:0;height:44px;padding:0 16px;border:1px solid var(--dc-ink-3);background:transparent;color:var(--dc-paper);font:500 14px/1 var(--font-body);cursor:pointer}
.dc-menu__close:hover{border-color:var(--dc-signal-blue)}
.dc-menu :focus-visible{outline-color:var(--dc-signal-blue)}
.dc-menu__nav{margin-top:auto;padding-top:var(--space-10)}
.dc-menu__list{list-style:none;margin:0;padding:0;border-bottom:1px solid var(--dc-ink-3)}
.dc-menu__list li{border-top:1px solid var(--dc-ink-3)}
.dc-menu__link{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-4);min-height:60px;padding:10px 0;color:var(--dc-paper);text-decoration:none;font:900 clamp(38px,4vw,40px)/1.05 var(--font-display);letter-spacing:-.03em}
.dc-menu__link:hover{color:var(--dc-paper)}
.dc-menu__link:hover span:first-child{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.12em}
.dc-menu__n{font:500 12px/1 var(--font-body);letter-spacing:.14em;color:var(--dc-silver)}
.dc-menu__link[aria-current=page] .dc-menu__n{color:var(--dc-signal-blue)}
.dc-menu__secondary{margin:var(--space-5) 0 0}
.dc-menu__secondary a{color:var(--dc-paper);font:600 18px/1.4 var(--font-body)}
.dc-menu__contact{margin:var(--space-5) 0 0;display:flex;flex-wrap:wrap;gap:8px 20px;font-size:14px}
.dc-menu__contact a{color:var(--dc-paper)}
html.dc-menu-open{overflow:hidden}
/* The consent banner steps aside while the menu dialog is open and returns when it closes (accessibility B4). */
html.dc-menu-open .dcs-consent{visibility:hidden}
@media (max-width:759px){.dc-menu__close{display:none}}
@media (min-width:760px){.dc-menu{padding-bottom:48px}.dc-menu__list{columns:2;column-gap:var(--space-10)}.dc-menu__list li{break-inside:avoid}}

/* Blue CTA band (brief 2.4) ---------------------------------------------- */
.dc-band{background:var(--dc-blue);color:#fff;padding-block:var(--section-pad-chapter)}
@media (max-width:759px){.dc-band{padding-block:var(--section-pad-chapter-mobile)}}
.dc-band .dc-eyebrow{color:#fff}
.dc-band .dc-lockup{margin-top:36px}
.dc-band__line{margin:32px 0 0;font-family:var(--font-display);font-weight:800;font-size:clamp(24px,2.4vw,36px);line-height:1.15;letter-spacing:-.02em;max-width:24em}
.dc-band .wp-block-buttons,.dc-band__actions{margin-top:36px}
.dc-band .dc-contact-links{margin-top:var(--space-6)}
.dc-band a:not(.wp-block-button__link):not(.dc-btn){color:#fff}

/* Contact links and reassurance ------------------------------------------ */
.dc-contact-links__row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-4) 28px}
.dc-contact-links__row a{font:500 15px/1.4 var(--font-body);text-underline-offset:6px}
.dc-contact-links__row a:hover{text-decoration-thickness:2px}
.dc-contact-links__reassure{margin:var(--space-6) 0 0;font-size:15px;line-height:1.6;max-width:56ch}

/* Proof strip (brief 2.13 item 2): checkable facts only ------------------ */
.dc-proof-strip{display:flex;flex-wrap:wrap;gap:6px 10px;margin:44px 0 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.4);font-size:13px;line-height:1.5}
.dc-proof-strip a{color:inherit}
.dc-proof-strip--plain{margin:0;padding:0;border:0;color:var(--dc-graphite)}

/* Ink footer (brief 2.5) ------------------------------------------------- */
.dc-footer{background:var(--dc-ink);color:var(--dc-silver);padding:72px 0 28px}
@media (max-width:759px){.dc-footer{padding-bottom:100px}}
.dc-footer__cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:40px var(--gutter);padding-bottom:56px;border-bottom:1px solid var(--dc-ink-3)}
.dc-footer__brand{display:flex;flex-direction:column;gap:var(--space-5)}
.dc-footer__logo{display:inline-block;width:fit-content}
.dc-footer__logo img{width:163px;height:36px}
.dc-footer__line{font-size:14px;line-height:1.6;max-width:30ch}
.dc-footer__head{margin:0 0 12px;font:500 11px/1.4 var(--font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--dc-silver)}
.dc-footer__sub{margin:16px 0 2px;font:500 11px/1.4 var(--font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--dc-signal-blue)}
.dc-footer__head+.dc-footer__sub{margin-top:0}
.dc-footer ul{list-style:none;margin:0;padding:0}
.dc-footer a{color:var(--dc-paper);text-decoration:none;font-size:14px;line-height:2.1}
.dc-footer a:hover{color:var(--dc-signal-blue)}
.dc-footer :focus-visible{outline-color:var(--dc-signal-blue)}
.dc-footer__nap{font-style:normal;display:flex;flex-direction:column;font-size:14px;line-height:2.1;color:var(--dc-paper)}
.dc-footer__social{display:flex;gap:var(--space-4);margin-top:12px}
.dc-footer__legal{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--space-4);padding-top:24px;font-size:12px;line-height:1.6}
.dc-footer__legalline{max-width:72ch}
.dc-footer__legalnav{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-5)}
.dc-footer__legalnav ul{display:flex;flex-wrap:wrap;gap:8px 20px}
.dc-footer__legalnav a,.dc-footer__legalnav button{color:var(--dc-silver);font-size:12px;line-height:1.6;background:none;border:0;padding:0;cursor:pointer;text-decoration:none}
.dc-footer__legalnav a:hover,.dc-footer__legalnav button:hover{color:#fff}
/* Cookie settings opens the panel on every page, with or without a live tool (compliance-checklist.md A4, C14). */
.dc-footer__cookie{display:list-item}
.dc-footer .dc-footer__home{height:44px;display:flex;align-items:center;gap:8px;border:1px solid var(--dc-ink-3);color:var(--dc-paper);padding:0 14px;font:500 12px/1 var(--font-body);letter-spacing:.14em;text-transform:uppercase;transition:border-color var(--dur-micro)}
.dc-footer .dc-footer__home:hover{border-color:var(--dc-signal-blue);color:var(--dc-paper)}
.dc-footer__homeslash{display:block;width:3px;height:14px;background:var(--dc-signal-blue);transform:skewX(-18deg)}

/* Global Industries navigation, shared on every route. */
#dc-panel-industries{width:560px;display:grid;grid-template-columns:1fr 1fr;max-height:calc(100vh - 115px);overflow:auto}#dc-panel-industries[hidden]{display:none}#dc-panel-industries a{height:100%;font-size:13px}#dc-panel-industries a span{color:#2545c4}
.dc-services__panel{max-width:calc(100vw - 32px)}

/* Keep the primary navigation available when JavaScript is unavailable. */
@media(max-width:759px){
 html:not(.dc-js) .dc-nav{position:relative}
 html:not(.dc-js) .dc-nav .dc-nav__bar{height:auto;min-height:68px;align-items:flex-start;flex-wrap:wrap;padding-block:12px;background:var(--dc-paper);color:var(--dc-ink)}
 html:not(.dc-js) .dc-nav__right{width:100%;flex-direction:column;align-items:flex-start;gap:12px}
 html:not(.dc-js) .dc-nav .dc-nav__links{display:flex;gap:12px 20px}
 html:not(.dc-js) .dc-nav .dc-nav__cta{display:block}
 html:not(.dc-js) .dc-nav--focused .dc-nav__right .dc-btn{display:inline-flex}
 html:not(.dc-js) .dc-nav [data-services-toggle]{display:none}
}
/* WhatsApp Business contact point (global.md 4 and 12): label, number link and username stay together as one item in every flex row or column. */
.dc-wa-line{overflow-wrap:anywhere}
.dc-contact-links__row .dc-wa-line{font:500 15px/1.4 var(--font-body)}
.dc-faq-search__card-lines .dc-wa-line{font-size:14px}
.dc-success__wa{margin:var(--space-4) 0 0;font-size:15px}