/*
Theme Name: DSG WordPress
Theme URI: https://www.dsg-it.com/
Author: Piper Strategies
Description: Custom theme for Diverse Systems Group (DSG). Pages are built from native WordPress blocks and edited in the block editor (Gutenberg), which shows each page as it appears on the live site. Layout structure is protected so content can be updated without breaking the approved DSG design.
Version: 1.0.1
Requires at least: 6.6
Requires PHP: 7.4
Text Domain: dsg
*/

html { scroll-behavior: smooth; }
body { margin: 0; }
.dsg-content > .wp-block-dsg-section { margin: 0; }

/* --------------------------------------------------------------------------
   HTML parity fixes — retained from v1.0.8
   Page-specific source CSS contains the approved DSG HTML styling. These
   additions only normalize WordPress output/state and do not restyle it.
   -------------------------------------------------------------------------- */

/* Preserve the exact HTML dropdown appearance while adding keyboard/click state. */
.site-nav .has-drop:focus-within .drop,
.site-nav .has-drop.is-open .drop {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.site-nav .drop-trigger:focus-visible,
.site-nav .drop a:focus-visible,
.site-nav .nav-links > a:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

/* WordPress must output the footer menus as the same flat links as the HTML. */
.site-footer .footer-main {
  display: grid !important;
  grid-template-columns: minmax(280px, 1fr) 340px 220px !important;
  gap: 72px !important;
  align-items: start !important;
}
.site-footer .footer-main > .footer-solutions,
.site-footer .footer-main > .footer-navigation {
  justify-self: end !important;
  width: 100% !important;
}
.site-footer .footer-main > .footer-solutions { max-width: 340px !important; }
.site-footer .footer-main > .footer-navigation { max-width: 220px !important; }
.site-footer .footer-main a { width: -moz-fit-content !important; width: fit-content !important; }

/* .wrap is a grid in the source footer. The copyright row is intentionally flex. */
.site-footer .f-bottom.wrap {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: auto !important;
  max-width: var(--max) !important;
  margin: 56px auto 0 !important;
  padding: 24px 40px 0 !important;
  gap: 12px !important;
}
.site-footer .f-bottom > span { min-width: 0; }
.site-footer .f-social {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 14px !important;
  margin-left: auto !important;
  width: auto !important;
  max-width: none !important;
  justify-self: auto !important;
}

.site-footer .f-social a { display: inline-flex !important; padding: 0 !important; }

@media (max-width: 1020px) {
  .site-footer .footer-main {
    grid-template-columns: 1fr 1fr !important;
    gap: 44px 56px !important;
  }
  .site-footer .footer-main > .footer-solutions,
  .site-footer .footer-main > .footer-navigation {
    justify-self: start !important;
    max-width: none !important;
  }
}
@media (max-width: 640px) {
  .site-footer .footer-main { grid-template-columns: 1fr !important; gap: 34px !important; }
  .site-footer .f-bottom.wrap {
    padding-left: 24px !important;
    padding-right: 24px !important;
    align-items: flex-start !important;
    flex-direction: column !important;
  }
  .site-footer .f-social { margin-left: 0 !important; justify-content: flex-start !important; }
}

/* --------------------------------------------------------------------------
   Footer parity — v1.0.7
   Matches the approved HTML company/contact block and guarantees all columns.
   -------------------------------------------------------------------------- */
.site-footer .footer-company .footer-contact {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  line-height: 1.72;
}
.site-footer .footer-company .footer-naics,
.site-footer .footer-company .footer-address,
.site-footer .footer-company .footer-contact-line {
  display: block;
  margin: 0;
}
.site-footer .footer-company .footer-contact-line {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0 .38em;
}
.site-footer .footer-company .footer-contact-line > a {
  display: inline !important;
  width: auto !important;
  padding: 0 !important;
}
.site-footer .footer-company .footer-dot {
  display: inline-block;
  color: inherit;
}
.site-footer .footer-solutions > a,
.site-footer .footer-navigation > a {
  display: block !important;
  width: -moz-fit-content !important;
  width: fit-content !important;
  padding: 4px 0 !important;
}

@media (max-width: 640px) {
  .site-footer .footer-main {
    gap: 40px !important;
  }
  .site-footer .footer-company .footer-contact-line {
    flex-wrap: nowrap;
  }
}


/* --------------------------------------------------------------------------
   Native desktop dropdown — v1.0.58
   The Primary Navigation is a real WordPress menu. These selectors support
   both the native walker classes and the legacy DSG Solutions class names.
   -------------------------------------------------------------------------- */
@media (min-width: 1021px) {
  .site-nav,
  .site-nav .nav-shell,
  .site-nav .nav-links,
  .site-nav .has-drop,
  .site-nav .dsg-solutions-dropdown {
    overflow: visible !important;
  }
  .site-nav .has-drop,
  .site-nav .dsg-solutions-dropdown {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    align-self: stretch !important;
  }
  .site-nav .has-drop > .drop-trigger,
  .site-nav .dsg-solutions-dropdown > .drop-trigger {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    height: 100% !important;
    color: inherit !important;
    position: relative !important;
  }
  .site-nav .has-drop > .drop-trigger::after,
  .site-nav .dsg-solutions-dropdown > .drop-trigger::after {
    content: "" !important;
    display: inline-block !important;
    width: 6px !important;
    height: 6px !important;
    border-right: 1.6px solid currentColor !important;
    border-bottom: 1.6px solid currentColor !important;
    transform: rotate(45deg) translateY(-2px) !important;
  }
  .site-nav .has-drop > .drop,
  .site-nav .dsg-solutions-menu {
    display: block !important;
    position: absolute !important;
    z-index: 99999 !important;
    top: 100% !important;
    left: -16px !important;
    min-width: 290px !important;
    padding: 10px !important;
    background: #fff !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(6px) !important;
  }
  .site-nav .has-drop:hover > .drop,
  .site-nav .has-drop:focus-within > .drop,
  .site-nav .has-drop.is-open > .drop,
  .site-nav .dsg-solutions-dropdown:hover > .dsg-solutions-menu,
  .site-nav .dsg-solutions-dropdown:focus-within > .dsg-solutions-menu,
  .site-nav .dsg-solutions-dropdown.is-open > .dsg-solutions-menu {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
  }
  .site-nav .has-drop > .drop > a,
  .site-nav .dsg-solutions-menu > a {
    display: block !important;
    width: 100% !important;
  }
}


/* --------------------------------------------------------------------------
   v1.0.19 native Gutenberg compatibility
   Real WordPress core blocks carry editorial content. These bridge rules keep
   the approved DSG HTML/CSS selectors working around core block wrappers.
   -------------------------------------------------------------------------- */
.dsg-content > .wp-block-group,
.dsg-content > .wp-block-cover,
.dsg-content > .wp-block-video{margin-block-start:0;margin-block-end:0}
.dsg-content .wp-block-group{box-sizing:border-box}
.dsg-content .wp-block-image{margin:0}
.dsg-content .photo>.wp-block-image,
.dsg-content .ph>.wp-block-image,
.dsg-content .hero-d>.wp-block-image,
.dsg-content .services-hero-d>.wp-block-image,
.dsg-content .hero-intro-image>.wp-block-image{width:100%;height:100%}
.dsg-content .photo>.wp-block-image img,
.dsg-content .ph>.wp-block-image img,
.dsg-content .hero-d>.wp-block-image img,
.dsg-content .services-hero-d>.wp-block-image img,
.dsg-content .hero-intro-image>.wp-block-image img{width:100%;height:100%;object-fit:cover}
.dsg-content .hero .wp-block-video{margin:0;width:100%;height:100%}
.dsg-content .hero .wp-block-video video{width:100%;height:min(78vh,720px);object-fit:cover;display:block}
.dsg-content .wp-block-button.btn{font:inherit}
.dsg-content .wp-block-button.btn>.wp-block-button__link{background:transparent!important;color:inherit!important;border:0!important;border-radius:inherit!important;box-shadow:none!important;padding:0!important;font:inherit!important;line-height:inherit!important;text-decoration:none!important;display:inline-flex;align-items:center;justify-content:center;min-height:inherit}
.dsg-content .wp-block-buttons.btns,
.dsg-content .wp-block-buttons.ctas,
.dsg-content .wp-block-buttons.flow-actions-stack,
.dsg-content .wp-block-buttons.services-hero-ctas,
.dsg-content .wp-block-buttons.product-actions{gap:14px}
.dsg-content .learn{position:relative;z-index:3}
.dsg-content .learn a{color:inherit;text-decoration:none}
.dsg-content .card,.dsg-content .post,.dsg-content .featured-text-post{position:relative}
.dsg-content .card .learn a::after,
.dsg-content .post .learn a::after,
.dsg-content .featured-text-post .learn a::after{content:"";position:absolute;inset:0;z-index:2}
.dsg-content .pillar.wp-block-cover{padding:0;min-height:400px}
.dsg-content .pillar.wp-block-cover .wp-block-cover__image-background{object-fit:cover}
.dsg-content .pillar.wp-block-cover.mission-card .wp-block-cover__image-background{object-position:52% center}
.dsg-content .pillar.wp-block-cover.quality-card .wp-block-cover__image-background{object-position:82% center}
.dsg-content .pillar.wp-block-cover.culture-card .wp-block-cover__image-background{object-position:center center}
.dsg-content .pillar.wp-block-cover>.wp-block-cover__background{display:none}
.dsg-content .dsg-mt-12{margin-top:12px!important}.dsg-content .dsg-mt-14{margin-top:14px!important}.dsg-content .dsg-mt-20{margin-top:20px!important}.dsg-content .dsg-mt-26{margin-top:26px!important}.dsg-content .dsg-mb-20{margin-bottom:20px!important}.dsg-content .dsg-max-720{max-width:720px}
.dsg-content .dsg-native-span{margin:0}
.dsg-content .product-pills.dsg-native-span,.dsg-content .chips.dsg-native-span{display:contents}
.dsg-content .orgs .wp-block-image{margin:0}
.dsg-content .orgs .wp-block-image img{display:block;max-width:100%;height:auto}
.dsg-content .mark.wp-block-html,.dsg-content .dsg-decorative-icon{margin:0}
.dsg-content .wp-block-list{padding-left:1.25em}
.dsg-content .contract-action a{font-weight:600;color:var(--royal);text-decoration:none}
/* Prevent WordPress layout-support block gaps from changing approved DSG spacing. */
/* v1.0.52: do not zero the margins of every Gutenberg flow child.
   That rule was overriding the approved page CSS for h2-to-paragraph and
   paragraph-to-component spacing. Neutralize WordPress block-gap on the
   container instead and let each DSG component own its explicit margins. */
.dsg-content .is-layout-flow{--wp--style--block-gap:0}
.dsg-content .wp-block-group,.dsg-content .wp-block-cover{--wp--style--block-gap:0}
.dsg-content .wp-block-buttons.is-layout-flex{gap:14px}
.dsg-content .product-pills > .dsg-native-span{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);border:1px solid var(--hairline);border-radius:999px;padding:7px 12px;background:#fff}


/* --------------------------------------------------------------------------
   v1.0.20 — native Gutenberg front-end parity bridge

   WordPress core may add layout-support classes and, on some installs,
   wp-block-group__inner-container wrappers to Group blocks. The approved DSG
   CSS was authored against the original HTML hierarchy. These rules remove
   core layout constraints without changing the native Gutenberg editor model.
   -------------------------------------------------------------------------- */

/* Never let WordPress global layout support narrow DSG's own structural grids. */
.dsg-content .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.dsg-content .wp-block-group.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Remove Gutenberg's automatic block-gap rhythm; DSG source CSS owns spacing. */
/* Do not zero explicit DSG margins here. WordPress block-gap is disabled on the
   structural containers, while the approved source CSS remains authoritative
   for heading, paragraph, list, and CTA spacing. */
.dsg-content :where(.wp-block-group,.wp-block-cover,.wp-block-buttons) {
  --wp--style--block-gap: 0;
}

/* Older/host-specific Group rendering may insert this extra wrapper. Flatten it
   visually so DSG grid/flex containers see their intended children again. */
.dsg-content .wp-block-group__inner-container {
  display: contents !important;
}

/* Core figure/button wrappers must not introduce their own geometry. */
.dsg-content figure,
.dsg-content .wp-block-image,
.dsg-content .wp-block-video,
.dsg-content .wp-block-buttons,
.dsg-content .wp-block-button {
  margin: 0 !important;
}

/* Structural Gutenberg Groups use the original DSG classes for layout. */
.dsg-content > .wp-block-group,
.dsg-content > .wp-block-cover,
.dsg-content .wrap.wp-block-group,
.dsg-content .sol-grid.wp-block-group,
.dsg-content .news-grid.wp-block-group,
.dsg-content .detail-grid.wp-block-group,
.dsg-content .element-grid.wp-block-group,
.dsg-content .pillar-grid.wp-block-group,
.dsg-content .flow-grid.wp-block-group,
.dsg-content .process-list.wp-block-group,
.dsg-content .orgs.wp-block-group,
.dsg-content .standards-grid.wp-block-group,
.dsg-content .news-feature-grid.wp-block-group,
.dsg-content .article-related-grid.wp-block-group,
.dsg-content .two-card-grid.wp-block-group,
.dsg-content .three-card-grid.wp-block-group,
.dsg-content .steps-grid.wp-block-group {
  width: 100% !important;
}

/* Preserve the approved max-width/padding on DSG .wrap containers. */
.dsg-content .wrap.wp-block-group {
  max-width: var(--max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Grid items generated as Group blocks must be allowed to shrink inside tracks. */
.dsg-content .sol-grid > .card,
.dsg-content .news-grid > .post,
.dsg-content .detail-grid > .wp-block-group,
.dsg-content .element-grid > .element-card,
.dsg-content .pillar-grid > .pillar,
.dsg-content .flow-grid > .step,
.dsg-content .news-feature-grid > .post,
.dsg-content .article-related-grid > .article-related-card {
  min-width: 0 !important;
}

/* If an older WP render adds an inner-container DOM node, mirror the handful
   of source selectors that depend on direct child relationships. */
.dsg-content .sol-grid > .wp-block-group__inner-container > .card { margin-top:0 !important; }
/* v1.0.69: preserve certification cell padding/borders when WordPress inserts
   wp-block-group__inner-container between .standards-grid and .standard-item. */
.dsg-content .standards-grid > .wp-block-group__inner-container > .standard-item {
  padding:28px 0 30px;
  border-bottom:1px solid rgba(20,27,77,.14);
}
.dsg-content .solutions .sol-grid > .wp-block-group__inner-container > .card:last-child,
.dsg-content .services-page .sol-grid > .wp-block-group__inner-container > .card:last-child { grid-column:auto !important; }

/* Hero video/image wrappers should occupy exactly the source element box. */
.dsg-content .hero .video-frame > .wp-block-group__inner-container,
.dsg-content .hero .statement > .wp-block-group__inner-container,
.dsg-content .photo > .wp-block-group__inner-container,
.dsg-content .ph > .wp-block-group__inner-container {
  width:100% !important;
}
.dsg-content .hero .wp-block-video,
.dsg-content .hero .wp-block-video video {
  width:100% !important;
}

/* Gutenberg buttons keep the approved anchor dimensions and hover behavior. */
.dsg-content .wp-block-button.btn {
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
}
.dsg-content .wp-block-button.btn > .wp-block-button__link {
  display:inline-block !important;
  padding:14px 30px !important;
  border-radius:6px !important;
  font-weight:600 !important;
  font-size:15px !important;
}
.dsg-content .wp-block-button.btn.btn-navy > .wp-block-button__link { background:var(--royal) !important; color:#fff !important; }
.dsg-content .wp-block-button.btn.btn-navy > .wp-block-button__link:hover { background:var(--navy) !important; }
.dsg-content .wp-block-button.btn.btn-line > .wp-block-button__link { background:transparent !important; color:var(--royal) !important; border:1.5px solid var(--royal) !important; }
.dsg-content .wp-block-button.btn.btn-line > .wp-block-button__link:hover { background:var(--royal) !important; color:#fff !important; }
.dsg-content .wp-block-button.btn.btn-white > .wp-block-button__link { background:#fff !important; color:var(--navy) !important; }
.dsg-content .wp-block-button.btn.btn-ghost > .wp-block-button__link { background:transparent !important; color:#fff !important; border:1.5px solid rgba(255,255,255,.85) !important; }

/* The source styles target .learn itself; Gutenberg wraps some of these in <p>. */
.dsg-content p.learn { margin:0 !important; }

/* Keep the home and landing-page card grids at their approved breakpoints. */
@media (min-width:1021px){
  .dsg-content .solutions .sol-grid,
  .dsg-content.services-page .sol-grid,
  .dsg-content .services-page .sol-grid { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
  .dsg-content .news-grid { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
}


/* --------------------------------------------------------------------------
   v1.0.21 — Gutenberg spacing / feature / image parity corrections
   -------------------------------------------------------------------------- */

/* Gutenberg should not manufacture spacing, but it must also not erase the
   margins explicitly defined by DSG's approved page CSS. */
.dsg-content .wp-block-group,
.dsg-content .wp-block-cover,
.dsg-content .wp-block-buttons,
.dsg-content .wp-block-list,
.dsg-content .wp-block-image,
.dsg-content .wp-block-video {
  --wp--style--block-gap: 0;
}

/* Restore the source section-heading rhythm that was lost to the v1.0.20
   blanket child-margin reset. */
.dsg-content .solutions .sol-head .eyebrow,
.dsg-content .news .head .eyebrow,
.dsg-content .product-copy .eyebrow,
.dsg-content .who .eyebrow,
.dsg-content .pillars .head .eyebrow,
.dsg-content .standards-head .eyebrow,
.dsg-content .values-band .eyebrow,
.dsg-content .cares .eyebrow {
  margin-bottom:22px !important;
}
.dsg-content .solutions .sol-head > p { margin-top:16px !important; }
.dsg-content .news .head .dsg-mt-12 { margin-top:12px !important; }
.dsg-content .who .dsg-mt-20 { margin-top:20px !important; }
.dsg-content .who .dsg-mt-26 { margin-top:26px !important; }

/* Product / Ryskview spacing must match the approved HTML. */
.dsg-content .product-copy h2 { margin:0 0 18px !important; }
.dsg-content .product-copy > p { margin:0 0 22px !important; }
.dsg-content .product-list { margin:28px 0 34px !important; }

/* Closing Solutions CTA: Gutenberg's Button wrapper must not collapse the
   source h3/p/button spacing. */
.dsg-content .solutions .solutions-more h3 { margin:0 0 14px !important; }
.dsg-content .solutions .solutions-more p { margin:0 0 26px !important; }
.dsg-content .services-page .solutions-more h3 { margin:0 0 14px !important; }
.dsg-content .services-page .solutions-more p { margin:0 0 26px !important; }

/* Every solution-card photo uses the identical frame regardless of the source
   image's native dimensions. */
.dsg-content .solutions .sol-grid .card .ph,
.dsg-content .services-page .sol-grid .card .ph {
  width:100% !important;
  aspect-ratio:16 / 10 !important;
  height:auto !important;
  min-height:0 !important;
  overflow:hidden !important;
  flex:none !important;
}
.dsg-content .solutions .sol-grid .card .ph > .wp-block-image,
.dsg-content .services-page .sol-grid .card .ph > .wp-block-image {
  width:100% !important;
  height:100% !important;
  margin:0 !important;
}
.dsg-content .solutions .sol-grid .card .ph img,
.dsg-content .services-page .sol-grid .card .ph img {
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  display:block !important;
}

/* Who We Are Mission / Quality / Culture features. Core Cover blocks add a
   wrapper and their own min-height logic; re-apply the approved card geometry. */
.dsg-content .pillar-grid { align-items:stretch !important; }
.dsg-content .pillar.wp-block-cover {
  min-height:400px !important;
  padding:0 !important;
  display:flex !important;
  align-items:flex-end !important;
  justify-content:stretch !important;
  overflow:hidden !important;
  position:relative !important;
}
.dsg-content .pillar.wp-block-cover > .wp-block-cover__image-background {
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
}
.dsg-content .pillar.wp-block-cover > .wp-block-cover__inner-container {
  position:relative !important;
  z-index:2 !important;
  width:100% !important;
  min-height:400px !important;
  display:flex !important;
  align-items:flex-end !important;
}
.dsg-content .pillar.wp-block-cover .pillar-copy {
  width:100% !important;
  padding:28px 26px 24px !important;
  align-self:flex-end !important;
}
.dsg-content .pillar.wp-block-cover.quality-card { --accent:var(--teal); }
.dsg-content .pillar.wp-block-cover.culture-card { --accent:var(--coral); }
.dsg-content .pillar.wp-block-cover.mission-card { --accent:var(--sky); }

/* Restore heading/copy spacing inside the approved feature cards. */
.dsg-content .pillar h3 { margin:0 !important; }
.dsg-content .pillar p { margin-top:18px !important; margin-bottom:0 !important; }

/* Who We Are methodology buttons: the source rules apply min-width to .btn,
   which is the Gutenberg wrapper now. Carry the width to the clickable anchor. */
.dsg-content .flow-exact .flow-actions-stack {
  margin-top:22px !important;
  gap:14px !important;
  align-items:flex-start !important;
}
.dsg-content .flow-exact .flow-actions-stack .wp-block-button.btn {
  min-width:248px !important;
  width:auto !important;
}
.dsg-content .flow-exact .flow-actions-stack .wp-block-button.btn > .wp-block-button__link {
  min-width:248px !important;
  width:100% !important;
  text-align:left !important;
  justify-content:flex-start !important;
}

/* Process features remain a true two-column layout with readable spacing. */
.dsg-content .flow-exact .process-list { gap:20px !important; }
.dsg-content .flow-exact .process-row { min-width:0 !important; }
.dsg-content .flow-exact .process-row .num { margin:0 !important; }
.dsg-content .flow-exact .process-row .process-copy h3 { margin:0 0 4px !important; }
.dsg-content .flow-exact .process-row .process-copy p { margin:0 !important; }

@media(max-width:1020px){
  .dsg-content .pillar.wp-block-cover,
  .dsg-content .pillar.wp-block-cover > .wp-block-cover__inner-container { min-height:360px !important; }
}
@media(max-width:640px){
  .dsg-content .pillar.wp-block-cover,
  .dsg-content .pillar.wp-block-cover > .wp-block-cover__inner-container { min-height:330px !important; }
  .dsg-content .flow-exact .flow-actions-stack .wp-block-button.btn,
  .dsg-content .flow-exact .flow-actions-stack .wp-block-button.btn > .wp-block-button__link {
    width:100% !important;
    min-width:0 !important;
  }
}

/* --------------------------------------------------------------------------
   v1.0.31 — SIMPLE SPACING + IMAGE GEOMETRY FIX
   Keeps the v1.0.30 eyebrow alignment, but returns hero spacing to the section
   (where the approved HTML had it) and restores the proven image/button rules.
   -------------------------------------------------------------------------- */
:root{ --dsg-hero-top:84px; }

/* HERO SPACING
   Put the vertical padding on the hero itself, not on a Gutenberg child Group.
   This is reliable whether WordPress inserts an inner-container wrapper or not. */
.dsg-content .page-hero{
  margin:0 !important;
  padding:84px 0 84px !important;
  background:#fff !important;
  border-bottom:1px solid var(--hairline,#E9ECF2) !important;
}
.dsg-content .sub-hero{
  margin:0 !important;
  padding:84px 0 88px !important;
  background:#fff !important;
  border-bottom:1px solid var(--hairline,#E9ECF2) !important;
}
.dsg-content .services-hero{
  margin:0 !important;
  padding:84px 0 74px !important;
  background:#fff !important;
  border-bottom:1px solid var(--hairline,#E9ECF2) !important;
}
.dsg-content .news-landing-hero{
  margin:0 !important;
  padding:84px 0 66px !important;
  background:#fff !important;
  border-bottom:1px solid var(--hairline,#E9ECF2) !important;
}

/* One top alignment across all interior heroes. */
.dsg-content .page-hero > .wrap,
.dsg-content .sub-hero > .wrap,
.dsg-content .services-hero > .wrap,
.dsg-content .news-landing-hero > .wrap{
  width:100% !important;
  max-width:1220px !important;
  margin:0 auto !important;
  padding:0 40px !important;
  box-sizing:border-box !important;
  display:grid !important;
  align-items:start !important;
}
.dsg-content .page-hero > .wrap{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr) !important;gap:70px !important;}
.dsg-content .sub-hero > .wrap{grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr) !important;gap:72px !important;}
.dsg-content .services-hero > .wrap{grid-template-columns:minmax(0,1.02fr) minmax(380px,.98fr) !important;gap:64px !important;}
.dsg-content .news-landing-hero > .wrap{grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr) !important;gap:72px !important;}

/* Keep the eyebrow system that is now working. */
.dsg-content .page-hero .eyebrow,
.dsg-content .sub-hero .eyebrow,
.dsg-content .services-hero .eyebrow,
.dsg-content .news-landing-hero .eyebrow{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:10px !important;
  margin:0 0 22px !important;
  padding:0 !important;
  font-family:'Albert Sans',system-ui,sans-serif !important;
  font-size:13px !important;
  line-height:16px !important;
  font-weight:600 !important;
  letter-spacing:.18em !important;
  text-transform:uppercase !important;
  color:var(--ink,#141B4D) !important;
}
.dsg-content .page-hero .eyebrow::before,
.dsg-content .sub-hero .eyebrow::before,
.dsg-content .services-hero .eyebrow::before,
.dsg-content .news-landing-hero .eyebrow::before{
  content:"" !important;
  display:block !important;
  flex:0 0 12px !important;
  width:12px !important;
  height:16px !important;
  margin:0 !important;
  background:var(--coral,#E85744) !important;
  border-radius:0 16px 16px 0 !important;
  transform:translateY(-1px) !important;
}

/* BUTTON RHYTHM
   Gutenberg's generic margin reset was erasing the approved 30px gap above
   hero CTAs. Restore that gap and put button padding on the clickable anchor. */
.dsg-content .sub-hero .wp-block-buttons.btns,
.dsg-content .services-hero .wp-block-buttons.services-hero-ctas,
.dsg-content .page-hero .wp-block-buttons.btns,
.dsg-content .news-landing-hero .wp-block-buttons.btns{
  margin-top:30px !important;
  gap:14px !important;
}
.dsg-content .sub-hero .wp-block-buttons .wp-block-button.btn,
.dsg-content .services-hero .wp-block-buttons .wp-block-button.btn,
.dsg-content .page-hero .wp-block-buttons .wp-block-button.btn,
.dsg-content .news-landing-hero .wp-block-buttons .wp-block-button.btn{
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  min-height:0 !important;
}
.dsg-content .sub-hero .wp-block-button.btn > .wp-block-button__link,
.dsg-content .services-hero .wp-block-button.btn > .wp-block-button__link,
.dsg-content .page-hero .wp-block-button.btn > .wp-block-button__link,
.dsg-content .news-landing-hero .wp-block-button.btn > .wp-block-button__link{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-sizing:border-box !important;
  min-height:50px !important;
  padding:14px 30px !important;
  border-radius:6px !important;
  font-size:15px !important;
  font-weight:600 !important;
  line-height:1.2 !important;
  white-space:nowrap !important;
}

/* D-SHAPED HERO IMAGES
   The image/figure is absolutely fitted to the frame. This prevents WordPress
   captions/intrinsic image height from creating the grey strip at the bottom. */
.dsg-content .page-hero .photo,
.dsg-content .sub-hero .photo,
.dsg-content .services-hero .services-hero-d,
.dsg-content .news-landing-hero .hero-links{
  position:relative !important;
  align-self:start !important;
  justify-self:stretch !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  border:0 !important;
  border-radius:0 112px 112px 0 !important;
  background:#EFF2F7 !important;
  box-sizing:border-box !important;
}
.dsg-content .page-hero .photo{height:380px !important;min-height:380px !important;}
.dsg-content .sub-hero .photo{height:430px !important;min-height:430px !important;}
.dsg-content .services-hero .services-hero-d,
.dsg-content .news-landing-hero .hero-links{height:420px !important;min-height:420px !important;}

.dsg-content .page-hero .photo > .wp-block-image,
.dsg-content .page-hero .photo .wp-block-image,
.dsg-content .sub-hero .photo > .wp-block-image,
.dsg-content .sub-hero .photo .wp-block-image,
.dsg-content .services-hero .services-hero-d > .wp-block-image,
.dsg-content .services-hero .services-hero-d .wp-block-image,
.dsg-content .news-landing-hero .hero-intro-image,
.dsg-content .news-landing-hero .hero-intro-image > .wp-block-image,
.dsg-content .news-landing-hero .hero-intro-image .wp-block-image{
  position:absolute !important;
  inset:0 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  min-height:100% !important;
  margin:0 !important;
  padding:0 !important;
}
.dsg-content .page-hero .photo img,
.dsg-content .sub-hero .photo img,
.dsg-content .services-hero .services-hero-d img,
.dsg-content .news-landing-hero .hero-intro-image img{
  position:absolute !important;
  inset:0 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  min-height:100% !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 !important;
  object-fit:cover !important;
  object-position:center center !important;
}
.dsg-content .page-hero .photo figcaption,
.dsg-content .sub-hero .photo figcaption,
.dsg-content .services-hero .services-hero-d figcaption,
.dsg-content .news-landing-hero .hero-intro-image figcaption,
.dsg-content .page-hero .photo .wp-element-caption,
.dsg-content .sub-hero .photo .wp-element-caption,
.dsg-content .services-hero .services-hero-d .wp-element-caption,
.dsg-content .news-landing-hero .hero-intro-image .wp-element-caption{
  display:none !important;
}

/* HOME + SOLUTIONS CARD IMAGES
   One 16:9 frame everywhere, including the Service Desk image. Any WordPress
   image caption is hidden inside cards so it cannot change the card height. */
.dsg-content .solutions .sol-grid .card .ph,
.dsg-content .solutions .services-intro-feature .card .ph,
.dsg-content.services-page .sol-grid .card .ph,
.dsg-content .services-page .sol-grid .card .ph{
  display:block !important;
  position:relative !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  aspect-ratio:16 / 9 !important;
  overflow:hidden !important;
  flex:none !important;
}
.dsg-content .solutions .card .ph > .wp-block-image,
.dsg-content .solutions .card .ph .wp-block-image,
.dsg-content.services-page .sol-grid .card .ph > .wp-block-image,
.dsg-content.services-page .sol-grid .card .ph .wp-block-image,
.dsg-content .services-page .sol-grid .card .ph > .wp-block-image,
.dsg-content .services-page .sol-grid .card .ph .wp-block-image{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  margin:0 !important;
  padding:0 !important;
}
.dsg-content .solutions .card .ph img,
.dsg-content.services-page .sol-grid .card .ph img,
.dsg-content .services-page .sol-grid .card .ph img{
  position:absolute !important;
  inset:0 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  min-height:100% !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:center center !important;
}
.dsg-content .solutions .card .ph figcaption,
.dsg-content .services-page .sol-grid .card .ph figcaption,
.dsg-content.services-page .sol-grid .card .ph figcaption,
.dsg-content .solutions .card .ph .wp-element-caption,
.dsg-content .services-page .sol-grid .card .ph .wp-element-caption,
.dsg-content.services-page .sol-grid .card .ph .wp-element-caption{
  display:none !important;
}

/* Contact keeps its intentionally taller visual. */
.dsg-content.contact-page .sub-hero .photo{height:auto !important;min-height:650px !important;align-self:stretch !important;}
.dsg-content.contact-page .sub-hero .photo img{min-height:650px !important;}

@media(max-width:1020px){
  .dsg-content .page-hero,
  .dsg-content .sub-hero,
  .dsg-content .services-hero,
  .dsg-content .news-landing-hero{padding-top:64px !important;}
  .dsg-content .page-hero{padding-bottom:64px !important;}
  .dsg-content .sub-hero{padding-bottom:64px !important;}
  .dsg-content .services-hero{padding-bottom:64px !important;}
  .dsg-content .news-landing-hero{padding-bottom:64px !important;}
  .dsg-content .page-hero > .wrap,
  .dsg-content .sub-hero > .wrap,
  .dsg-content .services-hero > .wrap,
  .dsg-content .news-landing-hero > .wrap{
    grid-template-columns:1fr !important;
    gap:42px !important;
    padding:0 24px !important;
  }
  .dsg-content .page-hero .photo,
  .dsg-content .sub-hero .photo,
  .dsg-content .services-hero .services-hero-d,
  .dsg-content .news-landing-hero .hero-links{height:360px !important;min-height:360px !important;}
  .dsg-content.contact-page .sub-hero .photo,
  .dsg-content.contact-page .sub-hero .photo img{height:380px !important;min-height:380px !important;}
}
@media(max-width:640px){
  .dsg-content .page-hero,
  .dsg-content .sub-hero,
  .dsg-content .services-hero,
  .dsg-content .news-landing-hero{padding:54px 0 56px !important;}
  .dsg-content .page-hero > .wrap,
  .dsg-content .sub-hero > .wrap,
  .dsg-content .services-hero > .wrap,
  .dsg-content .news-landing-hero > .wrap{padding:0 24px !important;gap:34px !important;}
  .dsg-content .page-hero .photo,
  .dsg-content .sub-hero .photo,
  .dsg-content .services-hero .services-hero-d,
  .dsg-content .news-landing-hero .hero-links{height:300px !important;min-height:300px !important;}
  .dsg-content .sub-hero .wp-block-buttons,
  .dsg-content .services-hero .wp-block-buttons{width:100% !important;}
  .dsg-content .sub-hero .wp-block-button.btn,
  .dsg-content .services-hero .wp-block-button.btn,
  .dsg-content .sub-hero .wp-block-button.btn > .wp-block-button__link,
  .dsg-content .services-hero .wp-block-button.btn > .wp-block-button__link{width:100% !important;}
  .dsg-content.contact-page .sub-hero .photo,
  .dsg-content.contact-page .sub-hero .photo img{height:300px !important;min-height:300px !important;}
}


/* --------------------------------------------------------------------------
   v1.0.33 — Home hero / Ryskview / News spacing refinements
   Focused follow-up to the stable v1.0.31 geometry and v1.0.32 navigation.
   -------------------------------------------------------------------------- */

/* HOME HERO
   Gutenberg's Buttons block was losing the source margin. Use padding on the
   button row so the separation from the headline is explicit and reliable. */
.dsg-content .hero .wp-block-buttons.ctas,
.dsg-content .hero .ctas {
  margin-top:0 !important;
  padding-top:30px !important;
  gap:14px !important;
}
.dsg-content .hero .wp-block-button.btn,
.dsg-content .hero .ctas .btn {
  transition:background-color .2s ease,color .2s ease,border-color .2s ease,transform .2s ease !important;
}
.dsg-content .hero .wp-block-button.btn.btn-white > .wp-block-button__link:hover,
.dsg-content .hero .btn-white:hover {
  background:var(--sky,#4EC3E8) !important;
  color:var(--navy,#141B4D) !important;
  transform:translateY(-2px) !important;
}
.dsg-content .hero .wp-block-button.btn.btn-ghost > .wp-block-button__link:hover,
.dsg-content .hero .btn-ghost:hover {
  background:#fff !important;
  color:var(--navy,#141B4D) !important;
  border-color:#fff !important;
  transform:translateY(-2px) !important;
}

/* RYSKVIEW SPOTLIGHT
   Match the approved HTML treatment: contained logo, centered inside the
   bordered white logo well instead of stretching to fill the whole card. */
.dsg-content .product-spotlight .product-logo {
  box-sizing:border-box !important;
  width:100% !important;
  min-height:110px !important;
  padding:18px 26px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#fff !important;
  border:1px solid var(--hairline,#E9ECF2) !important;
  border-radius:12px !important;
  overflow:hidden !important;
}
.dsg-content .product-spotlight .product-logo > .wp-block-group__inner-container,
.dsg-content .product-spotlight .product-logo > .wp-block-image,
.dsg-content .product-spotlight .product-logo figure.wp-block-image {
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
.dsg-content .product-spotlight .product-logo img {
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  max-height:74px !important;
  object-fit:contain !important;
  object-position:center !important;
  margin:0 auto !important;
}

/* Product Spotlight eyebrow uses exactly the same type scale and D mark as
   the rest of the DSG site. */
.dsg-content .product-spotlight .product-copy .eyebrow {
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  margin:0 0 22px !important;
  padding:0 !important;
  font-family:'Albert Sans',system-ui,sans-serif !important;
  font-size:13px !important;
  line-height:16px !important;
  font-weight:600 !important;
  letter-spacing:.18em !important;
  text-transform:uppercase !important;
  color:var(--ink,#141B4D) !important;
}
.dsg-content .product-spotlight .product-copy .eyebrow::before {
  content:"" !important;
  display:block !important;
  flex:0 0 12px !important;
  width:12px !important;
  height:16px !important;
  margin:0 !important;
  background:var(--coral,#E85744) !important;
  border-radius:0 16px 16px 0 !important;
  transform:translateY(-1px) !important;
}

/* HOME NEWS & INSIGHTS
   Add breathing room between the intro row and the cards. */
.dsg-content .news.news-pattern .head {
  margin-bottom:0 !important;
  padding-bottom:40px !important;
}

@media (max-width:640px){
  .dsg-content .hero .wp-block-buttons.ctas,
  .dsg-content .hero .ctas { padding-top:24px !important; }
  .dsg-content .product-spotlight .product-logo {
    min-height:96px !important;
    padding:16px 20px !important;
  }
  .dsg-content .product-spotlight .product-logo img { max-height:64px !important; }
  .dsg-content .news.news-pattern .head { padding-bottom:32px !important; }
}

/* --------------------------------------------------------------------------
   v1.0.34/1.0.35 — Home hero buttons match the site-wide CTA pattern
   Primary = solid DSG blue, secondary = white with DSG blue outline.
   Hover behavior matches the rest of the site: color change only, no lift.
   -------------------------------------------------------------------------- */
.dsg-content .hero .btn-white,
.dsg-content .hero .wp-block-button.btn.btn-white > .wp-block-button__link {
  background:var(--royal,#2847A8) !important;
  color:#fff !important;
  border:1px solid var(--royal,#2847A8) !important;
  box-shadow:none !important;
  transform:none !important;
}
.dsg-content .hero .btn-white:hover,
.dsg-content .hero .wp-block-button.btn.btn-white > .wp-block-button__link:hover {
  background:var(--navy,#141B4D) !important;
  color:#fff !important;
  border-color:var(--navy,#141B4D) !important;
  box-shadow:none !important;
  transform:none !important;
}
.dsg-content .hero .btn-ghost,
.dsg-content .hero .wp-block-button.btn.btn-ghost > .wp-block-button__link {
  background:#fff !important;
  color:var(--royal,#2847A8) !important;
  border:1px solid var(--royal,#2847A8) !important;
  box-shadow:none !important;
  transform:none !important;
}
.dsg-content .hero .btn-ghost:hover,
.dsg-content .hero .wp-block-button.btn.btn-ghost > .wp-block-button__link:hover {
  background:var(--royal,#2847A8) !important;
  color:#fff !important;
  border-color:var(--royal,#2847A8) !important;
  box-shadow:none !important;
  transform:none !important;
}



/* --------------------------------------------------------------------------
   v1.0.36 — Ryskview DSG lockup guard
   Keep the approved combined Ryskview + "A Product of Diverse Systems Group"
   lockup at the exact contained proportion used by the approved HTML design.
   -------------------------------------------------------------------------- */
.dsg-content .product-spotlight .product-logo {
  min-height:110px !important;
  padding:18px 26px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
.dsg-content .product-spotlight .product-logo img,
.dsg-content .product-spotlight .product-logo .wp-block-image img {
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  max-height:74px !important;
  object-fit:contain !important;
  object-position:center !important;
  aspect-ratio:auto !important;
  margin:0 auto !important;
}


/* --------------------------------------------------------------------------
   v1.0.37 — Home hero outline + Ryskview capability pills
   Final focused correction: keep the Home secondary CTA at a true 1px line
   and render Assess / Measure / Manage / Model as compact outlined pills even
   when Gutenberg inserts its native paragraph/inner-container markup.
   -------------------------------------------------------------------------- */
.dsg-content .hero .btn-ghost,
.dsg-content .hero .wp-block-button.btn.btn-ghost,
.dsg-content .hero .wp-block-button.btn.btn-ghost > .wp-block-button__link {
  box-shadow:none !important;
  outline:0 !important;
}
.dsg-content .hero .btn-ghost,
.dsg-content .hero .wp-block-button.btn.btn-ghost > .wp-block-button__link {
  border-width:1px !important;
  border-style:solid !important;
  border-color:var(--royal,#2847A8) !important;
}

.dsg-content .product-spotlight .product-pills,
.dsg-content .product-spotlight .product-pills > .wp-block-group__inner-container {
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:10px !important;
  margin:0 !important;
  padding:0 !important;
}
.dsg-content .product-spotlight .product-pills > span,
.dsg-content .product-spotlight .product-pills > .dsg-native-span,
.dsg-content .product-spotlight .product-pills > p.dsg-native-span,
.dsg-content .product-spotlight .product-pills > .wp-block-group__inner-container > span,
.dsg-content .product-spotlight .product-pills > .wp-block-group__inner-container > .dsg-native-span,
.dsg-content .product-spotlight .product-pills > .wp-block-group__inner-container > p.dsg-native-span {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
  width:auto !important;
  min-width:0 !important;
  min-height:38px !important;
  margin:0 !important;
  padding:7px 13px !important;
  background:#fff !important;
  border:1px solid var(--hairline,#E9ECF2) !important;
  border-radius:999px !important;
  color:var(--ink,#141B4D) !important;
  font-family:'Albert Sans',system-ui,sans-serif !important;
  font-size:12px !important;
  line-height:1 !important;
  font-weight:700 !important;
  letter-spacing:.12em !important;
  text-transform:uppercase !important;
  white-space:nowrap !important;
}

/* --------------------------------------------------------------------------
   v1.0.38 — Canonical interior hero top spacing
   Every interior hero now owns the vertical spacing. Gutenberg/content wrappers
   are explicitly zeroed so no page can accidentally add a second 84px offset.
   -------------------------------------------------------------------------- */
:root{ --dsg-interior-hero-top:84px; }

body main.dsg-content .page-hero,
body main.dsg-content .sub-hero,
body main.dsg-content .services-hero,
body main.dsg-content .news-landing-hero{
  margin-top:0 !important;
  padding-top:var(--dsg-interior-hero-top) !important;
}

/* The wrapper only provides the shared content well. It must never add
   vertical hero padding; that is what caused Solutions to sit lower than News. */
body main.dsg-content .page-hero > .wrap,
body main.dsg-content .sub-hero > .wrap,
body main.dsg-content .services-hero > .wrap,
body main.dsg-content .news-landing-hero > .wrap{
  padding-top:0 !important;
  padding-bottom:0 !important;
  padding-left:40px !important;
  padding-right:40px !important;
  margin-top:0 !important;
  align-items:start !important;
}

/* No Gutenberg Group or page-specific copy wrapper may reintroduce a top gap. */
body main.dsg-content .page-hero > .wrap > :first-child,
body main.dsg-content .sub-hero > .wrap > :first-child,
body main.dsg-content .services-hero > .wrap > :first-child,
body main.dsg-content .news-landing-hero > .wrap > :first-child,
body main.dsg-content .services-hero .sol-head,
body main.dsg-content .contact-hero-content{
  margin-top:0 !important;
  padding-top:0 !important;
  align-self:start !important;
}

@media(max-width:1020px){
  :root{ --dsg-interior-hero-top:64px; }
  body main.dsg-content .page-hero > .wrap,
  body main.dsg-content .sub-hero > .wrap,
  body main.dsg-content .services-hero > .wrap,
  body main.dsg-content .news-landing-hero > .wrap{
    padding-left:24px !important;
    padding-right:24px !important;
  }
}
@media(max-width:640px){
  :root{ --dsg-interior-hero-top:54px; }
}


/* --------------------------------------------------------------------------
   v1.0.51 — Who We Are: guide-card spacing + eyebrow parity
   Focused visual correction only. Methodology positioning is intentionally
   unchanged from v1.0.50.
   -------------------------------------------------------------------------- */

/* Gutenberg can neutralize the source .head bottom margin. Put the spacing on
   the image grid itself so the gap is reliable in the live block markup. */
.dsg-content .pillars .head {
  margin-bottom:0 !important;
}
.dsg-content .pillars .pillar-grid {
  padding-top:40px !important;
}

/* Every eyebrow on Who We Are uses the exact same geometry as the hero label.
   The explicit p.eyebrow support prevents paragraph typography from winning in
   native Gutenberg output. */
.dsg-content .page-hero .eyebrow,
.dsg-content .pillars .eyebrow,
.dsg-content .flow .eyebrow,
.dsg-content .standards-section .eyebrow,
.dsg-content .values-band .eyebrow,
.dsg-content .cares .eyebrow,
.dsg-content .page-hero p.eyebrow,
.dsg-content .pillars p.eyebrow,
.dsg-content .flow p.eyebrow,
.dsg-content .standards-section p.eyebrow,
.dsg-content .values-band p.eyebrow,
.dsg-content .cares p.eyebrow {
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:10px !important;
  margin:0 0 22px !important;
  padding:0 !important;
  font-family:'Albert Sans',system-ui,sans-serif !important;
  font-size:13px !important;
  line-height:16px !important;
  font-weight:600 !important;
  letter-spacing:.18em !important;
  text-transform:uppercase !important;
  color:var(--ink,#141B4D) !important;
}
.dsg-content .page-hero .eyebrow::before,
.dsg-content .pillars .eyebrow::before,
.dsg-content .flow .eyebrow::before,
.dsg-content .standards-section .eyebrow::before,
.dsg-content .values-band .eyebrow::before,
.dsg-content .cares .eyebrow::before {
  content:"" !important;
  display:block !important;
  flex:0 0 12px !important;
  width:12px !important;
  height:16px !important;
  margin:0 !important;
  background:var(--coral,#E85744) !important;
  border-radius:0 16px 16px 0 !important;
  transform:translateY(-1px) !important;
}

@media(max-width:640px){
  .dsg-content .pillars .pillar-grid { padding-top:32px !important; }
}

/* --------------------------------------------------------------------------
   v1.0.52 — Site-wide typography/component rhythm correction
   -------------------------------------------------------------------------- */

/* One eyebrow TYPE system site-wide, matching the interior hero. Contextual
   bottom margins remain component-owned (for example compact related cards). */
.dsg-content .eyebrow,
.dsg-content p.eyebrow,
.dsg-content div.eyebrow {
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:10px !important;
  padding:0 !important;
  font-family:'Albert Sans',system-ui,sans-serif !important;
  font-size:13px !important;
  line-height:16px !important;
  font-weight:600 !important;
  letter-spacing:.18em !important;
  text-transform:uppercase !important;
  color:var(--ink,#141B4D) !important;
}
.dsg-content .eyebrow::before,
.dsg-content p.eyebrow::before,
.dsg-content div.eyebrow::before {
  content:"" !important;
  display:block !important;
  flex:0 0 12px !important;
  width:12px !important;
  height:16px !important;
  margin:0 !important;
  background:var(--coral,#E85744) !important;
  border-radius:0 16px 16px 0 !important;
  transform:translateY(-1px) !important;
}

/* Approved page/component CSS now owns heading, paragraph, and component margins again. */

/* Keep WordPress from adding its own generic block rhythm while preserving the
   margins above. This is the safe replacement for the old child reset. */
.dsg-content :where(.is-layout-flow,.is-layout-constrained,.is-layout-flex,.is-layout-grid) {
  --wp--style--block-gap:0 !important;
}

/* --------------------------------------------------------------------------
   v1.0.53 — Tighter multiline heading leading
   The source page styles set body line-height to 1.7. Headings without their
   own line-height were inheriting that value, creating oversized gaps between
   wrapped heading lines. Keep paragraph leading unchanged and normalize only
   content headings site-wide.
   -------------------------------------------------------------------------- */
.dsg-content h1,
.dsg-content .wp-block-heading:is(h1) {
  line-height:1.08 !important;
}
.dsg-content h2,
.dsg-content .wp-block-heading:is(h2) {
  line-height:1.12 !important;
}
.dsg-content h3,
.dsg-content .wp-block-heading:is(h3) {
  line-height:1.20 !important;
}
.dsg-content h4,
.dsg-content .wp-block-heading:is(h4) {
  line-height:1.24 !important;
}



/* --------------------------------------------------------------------------
   v1.0.55 — Contracts button hover text, live Gutenberg-safe
   The Contracts content can exist as native Gutenberg button blocks OR as
   editable paragraph links after migration. Do not depend on the wrapper
   class being present on the same element as .dsg-content. Target the actual
   clickable elements used by the Contracts page and force the hover label
   white when the button fills DSG blue.
   -------------------------------------------------------------------------- */
.dsg-content .contract-action a:hover,
.dsg-content .contract-action a:focus-visible,
.dsg-content.contracts-page a.btn.btn-line:hover,
.dsg-content.contracts-page a.btn.btn-line:focus-visible,
.dsg-content .contracts-page a.btn.btn-line:hover,
.dsg-content .contracts-page a.btn.btn-line:focus-visible,
.dsg-content.contracts-page .wp-block-button.btn.btn-line > .wp-block-button__link:hover,
.dsg-content.contracts-page .wp-block-button.btn.btn-line > .wp-block-button__link:focus-visible,
.dsg-content .contracts-page .wp-block-button.btn.btn-line > .wp-block-button__link:hover,
.dsg-content .contracts-page .wp-block-button.btn.btn-line > .wp-block-button__link:focus-visible {
  background: var(--royal,#2847A8) !important;
  border-color: var(--royal,#2847A8) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  text-decoration: none !important;
}

/* Contracts hero button. Kept separate so its editable Gutenberg structure
   does not depend on the contract-card markup above. */
.dsg-content.contracts-page .sub-hero .btn-line:hover,
.dsg-content.contracts-page .sub-hero .btn-line:focus-visible,
.dsg-content .contracts-page .sub-hero .btn-line:hover,
.dsg-content .contracts-page .sub-hero .btn-line:focus-visible {
  background: var(--royal,#2847A8) !important;
  border-color: var(--royal,#2847A8) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}


/* v1.0.59 Homepage visibility: hide only on the live front end.
   Gutenberg keeps every section visible/editable so an editor can always find it. */
body.dsg-hide-home-solutions .dsg-content section.solutions,
body.dsg-hide-home-solutions .dsg-content .wp-block-group.solutions { display:none !important; }
body.dsg-hide-home-product_spotlight .dsg-content section.product-spotlight,
body.dsg-hide-home-product_spotlight .dsg-content .wp-block-group.product-spotlight,
body.dsg-hide-home-product_spotlight .dsg-content section.ryskview,
body.dsg-hide-home-product_spotlight .dsg-content .wp-block-group.ryskview { display:none !important; }
body.dsg-hide-home-who .dsg-content section.who,
body.dsg-hide-home-who .dsg-content .wp-block-group.who { display:none !important; }
body.dsg-hide-home-news .dsg-content section.news,
body.dsg-hide-home-news .dsg-content .wp-block-group.news { display:none !important; }


/* --------------------------------------------------------------------------
   v1.0.64 — Remove unintended content divider lines site-wide
   Several solution pages share the cybersecurity-page wrapper. A legacy
   cybersecurity rule added a bottom border to .detail-grid, which appeared as
   an extra horizontal line after the final paragraph on Service Desk and other
   solution pages. The approved DSG design does not use that divider.
   -------------------------------------------------------------------------- */
.dsg-content.sub-service .detail-grid,
.dsg-content .sub-service .detail-grid,
.dsg-content.cybersecurity-page .detail-grid,
.dsg-content .cybersecurity-page .detail-grid {
  border-bottom: 0 !important;
}


/* v1.0.71 — browser compatibility hardening.
   Page CSS is still the approved design source; these are conservative fallbacks
   for browsers that do not support optional visual effects. */
.site-nav{background:#fff;}
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))){
  .site-nav{background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);}
}
@supports (-webkit-backdrop-filter: blur(1px)){
  .site-nav{background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(10px);}
}

/* --------------------------------------------------------------------------
   v1.0.79 — Heading scale: one size per heading level across the site.

   Section titles (every H2 in page content, plus the "Partner with DSG" CTA):
   the site's most common style — 38px on desktop scaling to 26px on phones,
   weight 600. Previously they ranged from 24px to 58px and weight 500–700.
   Card and content subheadings (H3): 20px, matching the solution, element,
   contract, and certification cards. Previously 18.5–22px on news/article
   cards and content blocks.

   Deliberately unchanged: page hero H1 titles, the featured-story title on
   News & Insights, headings inside the Privacy Policy/legal copy, image-overlay
   pillar titles, numbered methodology step titles, and the "Integrated
   support…/Streamlined paths…" feature card.
   -------------------------------------------------------------------------- */
body main.dsg-content:not(.legal-page) h2:not(.news-featured-home h2),
body main.article-page .article-content h2,
body .cta h2 {
  font-size: clamp(26px, 3vw, 38px) !important;
  line-height: 1.12 !important;
  font-weight: 600 !important;
  letter-spacing: -.015em !important;
}
/* The home "Who we are" statement keeps its lighter weight, coral emphasis and
   open leading; only its size follows the scale. */
body main.dsg-content:not(.legal-page) .who h2:not(.news-featured-home h2) {
  font-weight: 500 !important;
  line-height: 1.32 !important;
}

body main.dsg-content .news-grid .post h3,
body main.article-page .article-related-card h3,
body main.article-page .article-steps h3,
body main.dsg-content .detail .content-block h3 {
  font-size: 20px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  letter-spacing: -.015em !important;
}

/* --------------------------------------------------------------------------
   v1.0.80 — Hero headers: one specification for every interior page.

   Desktop values come from the solution-page hero (used on 10 pages): title
   clamp(36px,4.5vw,60px) / 1.08, intro 17px / 1.8, 84px above and 88px below,
   and for photo heroes a 1.02fr / .98fr text/photo split with a 430px photo.
   Tablet and phone values reuse the site's existing shared hero rules (64px /
   64px and 54px / 56px spacing; 360px / 300px photos), now also applied to the
   text-only heroes. Previously desktop titles ranged 33–72px, intros
   16.5–20px, photos 380–430px, and bottom spacing 50–88px.

   Applies to: Who We Are, Solutions, Services, all solution pages, Contracts,
   CIO-SP3, Contact Us, News & Insights, articles, the Privacy Policy, standard
   client pages, and the 404 page. Unchanged by design: the home page's
   full-width video hero, and Contact Us's taller photo that sits beside the
   contact form. Rules are anchored to #main-content so they reliably override
   the older per-template rules.
   -------------------------------------------------------------------------- */
html body #main-content .page-hero h1,
html body #main-content .services-hero h1,
html body #main-content .sub-hero h1,
html body #main-content .news-landing-hero h1,
html body #main-content .legal-hero h1,
html body #main-content .dsg-standard-hero h1,
html body #main-content .article-hero h1 {
  font-size: clamp(36px, 4.5vw, 60px) !important;
  line-height: 1.08 !important;
  font-weight: 600 !important;
  letter-spacing: -.015em !important;
  margin-bottom: 22px !important;
}
html body #main-content .legal-hero h1 { margin-bottom: 0 !important; }

html body #main-content .page-hero p.lede,
html body #main-content .services-hero .sol-head p:not(.eyebrow),
html body #main-content .news-landing-hero .wrap > p:not(.eyebrow),
html body #main-content .news-landing-hero .wrap > div:not(.hero-links) p:not(.eyebrow),
html body #main-content .news-landing-hero .wrap > .wp-block-group__inner-container > div:not(.hero-links) p:not(.eyebrow),
html body #main-content .sub-hero .contact-form-intro,
html body #main-content .dsg-standard-hero .dsg-standard-deck,
html body #main-content .article-hero .article-lede {
  font-size: 17px !important;
  line-height: 1.8 !important;
}

html body #main-content .page-hero,
html body #main-content .services-hero,
html body #main-content .sub-hero,
html body #main-content .news-landing-hero,
html body #main-content .legal-hero,
html body #main-content .dsg-standard-hero,
html body #main-content .article-hero {
  padding-top: 84px !important;
  padding-bottom: 88px !important;
}
@media (max-width: 1020px) {
  html body #main-content .page-hero,
  html body #main-content .services-hero,
  html body #main-content .sub-hero,
  html body #main-content .news-landing-hero,
  html body #main-content .legal-hero,
  html body #main-content .dsg-standard-hero,
  html body #main-content .article-hero {
    padding-top: 64px !important;
    padding-bottom: 64px !important;
  }
}
@media (max-width: 640px) {
  html body #main-content .page-hero,
  html body #main-content .services-hero,
  html body #main-content .sub-hero,
  html body #main-content .news-landing-hero,
  html body #main-content .legal-hero,
  html body #main-content .dsg-standard-hero,
  html body #main-content .article-hero {
    padding-top: 54px !important;
    padding-bottom: 56px !important;
  }
}

/* Photo heroes on desktop: same text/photo split and photo height. Tablet and
   phone photo sizes stay on the existing shared rules (360px / 300px). */
@media (min-width: 1021px) {
  html body #main-content .page-hero .wrap,
  html body #main-content.services-page .services-hero .wrap,
  html body #main-content.news-page .news-landing-hero .wrap {
    grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr) !important;
    gap: 72px !important;
  }
  html body #main-content .page-hero .photo,
  html body #main-content .page-hero .photo img,
  html body #main-content.services-page .services-hero .services-hero-d,
  html body #main-content.news-page .news-landing-hero .hero-links {
    height: 430px !important;
    min-height: 430px !important;
  }
}
@media (max-width: 1020px) {
  html body #main-content.services-page .services-hero .services-hero-d { height: 360px !important; min-height: 360px !important; }
}
@media (max-width: 640px) {
  html body #main-content.services-page .services-hero .services-hero-d { height: 300px !important; min-height: 300px !important; }
}
/* Hero label ("eyebrow") above the title: explicit guard so it always stays
   13px, whatever the intro-text rules above match. */
html body #main-content .page-hero .eyebrow,
html body #main-content .services-hero .eyebrow,
html body #main-content .sub-hero .eyebrow,
html body #main-content .news-landing-hero .eyebrow,
html body #main-content .legal-hero .eyebrow,
html body #main-content .dsg-standard-hero .eyebrow {
  font-size: 13px !important;
  line-height: 16px !important;
  letter-spacing: .18em !important;
}
.dsg-404-page .dsg-404-actions { margin-top: 30px; }

/* v1.0.83 — Footer "Partner with DSG" buttons wrap on phones on every page.
   On pages using the home stylesheet (Home and client-created pages) the
   button group could not shrink, so "View Our Contracts" ran off the screen. */
@media (max-width: 640px) {
  html body .cta > .wrap { flex-wrap: wrap !important; }
  html body .cta .btns { flex-shrink: 1 !important; max-width: 100% !important; min-width: 0 !important; }
}