/* ============================================================
   Digital You CIC — QA round 2 (Luke's screenshot round, 17 Jul PM)
   Loads @986: after qa-visual (985), before a11y (999).
   §1 header balance · §2 site-wide 110% scale · §3 cred-band align
   §4 chip tooltips site-wide · §5 blog-card badge spacing
   §6 form fields 100% · §7 values numbers→icons (11) + icons (46)
   §8 believe bands 50/50 (15,16) · §9 offer items centred (14)
   §10 barrier icon spacing (13) · §11 casewrap symmetric (13)
   §12 res-latest symmetric (16) · §13 post-meta spacing
   §14 button wrapper hover squares killed
   Author: lukeduff.co.uk
   ============================================================ */

/* ---- §1 header: logo stops flex-growing, nav links centre the gap ---- */
@media (min-width:1025px){
  .dy-header .dy-logo{flex-grow:0!important;flex-shrink:0!important;width:auto!important}
  .dy-header .elementor-widget-navigation-menu{flex-grow:1!important;width:auto!important}
  .dy-header .hfe-nav-menu{justify-content:center!important}
}

/* ---- §2 default scale = the 110% browser zoom Luke prefers (desktop only) ---- */
@media (min-width:1200px){
  body{zoom:1.1}
  /* vw units ignore zoom — rescale the blog's full-bleed related band
     (dycic-blog.php: width:100vw) or it overflows by exactly 10% */
  .single-post .page-content .dycic-related{
    width:calc(100vw / 1.1)!important;
    margin:64px calc(50% - 50vw / 1.1) -72px!important;
  }
}

/* ---- §3 home cred band: 4th (taller) item was vertically centred → top-align all ---- */
.elementor-10 .cred-band .inner{align-items:start!important}
/* a touch more air under the icon blobs */
.elementor-10 .cred-item{gap:18px!important}

/* ---- §4 "Who we work with" chip tooltips on EVERY page (attrs via dycic-qa2.js) ---- */
.chips{overflow:visible!important}
.chips .elementor-widget-heading.chip{overflow:visible}
.chip[data-tip]{position:relative;cursor:help;outline:none}
.chip[data-tip]:focus-visible{box-shadow:0 0 0 3px rgba(22,190,207,.55)}
.chip[data-tip]::after{
  content:attr(data-tip);
  position:absolute;left:50%;bottom:calc(100% + 10px);transform:translateX(-50%) translateY(4px);
  min-width:170px;max-width:240px;padding:9px 13px;
  background:#103f73;color:#fff;font-size:13px;font-weight:600;line-height:1.35;
  text-align:center;border-radius:12px;box-shadow:0 10px 26px rgba(9,32,60,.34);
  opacity:0;pointer-events:none;transition:opacity .16s ease,transform .16s ease;z-index:40;white-space:normal;
}
.chip[data-tip]::before{
  content:"";position:absolute;left:50%;bottom:calc(100% + 4px);transform:translateX(-50%) translateY(4px);
  border:6px solid transparent;border-top-color:#103f73;opacity:0;transition:opacity .16s ease,transform .16s ease;z-index:41;
}
.chip[data-tip]:hover::after,.chip[data-tip]:focus::after,.chip[data-tip]:focus-visible::after,
.chip[data-tip]:hover::before,.chip[data-tip]:focus::before,.chip[data-tip]:focus-visible::before{
  opacity:1;transform:translateX(-50%) translateY(0);
}
@media (hover:none){ .chip[data-tip]{cursor:pointer} }
@media (prefers-reduced-motion:reduce){ .chip[data-tip]::after,.chip[data-tip]::before{transition:none} }

/* ---- §5 blog cards: air between the category badge and the title ---- */
.elementor-10 .ins-chip{margin-bottom:18px!important}
.rl-card .rl-tag{margin-bottom:20px!important}

/* ---- §6 form fields fill their card, on every form ---- */
.form-card .ff-el-form-control,.fluentform .ff-el-form-control{width:100%!important}
.form-card .fluentform,.form-card .frm-fluent-form,.form-card .ff-t-container,
.form-card .ff-el-group,.form-card > .elementor-widget{width:100%!important;max-width:100%!important}

/* ---- §7 values: number pills → circular icon badges (page 11),
        matching badges injected on the pastel cards (page 46).
        Same masked data-URI technique as dycic-icons.css. ---- */
.elementor-11 .services .svc .num{
  display:inline-flex!important;width:56px;height:56px;padding:0!important;border-radius:50%;
  align-items:center;justify-content:center;position:relative;overflow:hidden;
  margin-bottom:24px!important;
}
.elementor-11 .services .svc .num .elementor-heading-title{font-size:0!important;line-height:0!important}
.elementor-11 .services .svc .num::after{
  content:"";position:absolute;inset:0;margin:auto;width:28px;height:28px;
  background-color:currentColor;
  -webkit-mask:var(--dy-vic) no-repeat center / contain;
          mask:var(--dy-vic) no-repeat center / contain;
}
/* open & transparent — speech bubble */
.elementor-11 .n1{--dy-vic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M21%207v8a2%202%200%200%201-2%202H9l-5%204V7a2%202%200%200%201%202-2h13a2%202%200%200%201%202%202Z%22%2F%3E%3C%2Fsvg%3E")}
/* people first — heart */
.elementor-11 .n2{--dy-vic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%2020.5C7%2016.5%204%2013.6%204%2010.4%204%208%205.9%206%208.2%206c1.6%200%203%20.9%203.8%202.2C12.8%206.9%2014.2%206%2015.8%206%2018.1%206%2020%208%2020%2010.4c0%203.2-3%206.1-8%2010.1Z%22%2F%3E%3C%2Fsvg%3E")}
/* community driven — people */
.elementor-11 .n3{--dy-vic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%228.5%22%20r%3D%222.7%22%2F%3E%3Cpath%20d%3D%22M3.8%2019.5a5.2%205.2%200%200%201%2010.4%200%22%2F%3E%3Ccircle%20cx%3D%2216.6%22%20cy%3D%229.6%22%20r%3D%222.2%22%2F%3E%3Cpath%20d%3D%22M15.7%2019.5a4.9%204.9%200%200%201%204.8-4.6%22%2F%3E%3C%2Fsvg%3E")}
/* collaboration — linked rings */
.elementor-11 .n4{--dy-vic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223.3%22%20y%3D%228.4%22%20width%3D%2210.4%22%20height%3D%227.2%22%20rx%3D%223.6%22%2F%3E%3Crect%20x%3D%2210.3%22%20y%3D%228.4%22%20width%3D%2210.4%22%20height%3D%227.2%22%20rx%3D%223.6%22%2F%3E%3C%2Fsvg%3E")}
/* practical action — bolt */
.elementor-11 .n5{--dy-vic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M13%202.5%205%2013.5h6l-1%208%208-11h-6l1-8Z%22%2F%3E%3C%2Fsvg%3E")}
/* sustainable impact — sprout */
.elementor-11 .n6{--dy-vic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%2021v-7%22%2F%3E%3Cpath%20d%3D%22M12%2014c0-4%203-7%208-7%200%204-3%207-8%207Z%22%2F%3E%3Cpath%20d%3D%22M12%2014c0-3.4-2.4-6-7-6%200%203.4%202.4%206%207%206Z%22%2F%3E%3C%2Fsvg%3E")}

/* page 46 pastel value cards have no .num — inject the same badges.
   position:static beats the sheen layer's absolute .svc::before */
.elementor-46 .values .svc-grid > .svc::before{
  content:""!important;display:block!important;position:static!important;inset:auto!important;
  flex:0 0 auto;width:56px!important;height:56px!important;border-radius:50%!important;
  margin:0 0 20px!important;opacity:1!important;transform:none!important;box-shadow:none!important;
  background-repeat:no-repeat;background-position:center;background-size:28px 28px;
}
.elementor-46 .values .svc-grid > .svc:nth-child(1)::before{background-color:var(--turquoise,#16becf);background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23103f73%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M21%207v8a2%202%200%200%201-2%202H9l-5%204V7a2%202%200%200%201%202-2h13a2%202%200%200%201%202%202Z%22%2F%3E%3C%2Fsvg%3E")}
.elementor-46 .values .svc-grid > .svc:nth-child(2)::before{background-color:var(--heather,#7b5fb0);background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%2020.5C7%2016.5%204%2013.6%204%2010.4%204%208%205.9%206%208.2%206c1.6%200%203%20.9%203.8%202.2C12.8%206.9%2014.2%206%2015.8%206%2018.1%206%2020%208%2020%2010.4c0%203.2-3%206.1-8%2010.1Z%22%2F%3E%3C%2Fsvg%3E")}
.elementor-46 .values .svc-grid > .svc:nth-child(3)::before{background-color:var(--blue,#144e8c);background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%228.5%22%20r%3D%222.7%22%2F%3E%3Cpath%20d%3D%22M3.8%2019.5a5.2%205.2%200%200%201%2010.4%200%22%2F%3E%3Ccircle%20cx%3D%2216.6%22%20cy%3D%229.6%22%20r%3D%222.2%22%2F%3E%3Cpath%20d%3D%22M15.7%2019.5a4.9%204.9%200%200%201%204.8-4.6%22%2F%3E%3C%2Fsvg%3E")}
.elementor-46 .values .svc-grid > .svc:nth-child(4)::before{background-color:var(--turquoise,#16becf);background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23103f73%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223.3%22%20y%3D%228.4%22%20width%3D%2210.4%22%20height%3D%227.2%22%20rx%3D%223.6%22%2F%3E%3Crect%20x%3D%2210.3%22%20y%3D%228.4%22%20width%3D%2210.4%22%20height%3D%227.2%22%20rx%3D%223.6%22%2F%3E%3C%2Fsvg%3E")}
.elementor-46 .values .svc-grid > .svc:nth-child(5)::before{background-color:var(--heather,#7b5fb0);background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M13%202.5%205%2013.5h6l-1%208%208-11h-6l1-8Z%22%2F%3E%3C%2Fsvg%3E")}
.elementor-46 .values .svc-grid > .svc:nth-child(6)::before{background-color:var(--blue,#144e8c);background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%2021v-7%22%2F%3E%3Cpath%20d%3D%22M12%2014c0-4%203-7%208-7%200%204-3%207-8%207Z%22%2F%3E%3Cpath%20d%3D%22M12%2014c0-3.4-2.4-6-7-6%200%203.4%202.4%206%207%206Z%22%2F%3E%3C%2Fsvg%3E")}

/* ---- §8 believe bands: stacked text-over-image → 50/50 split (15 Work-with-us, 16 Ideas) ---- */
@media (min-width:1000px){
  .elementor-15 .believe-inner,
  .elementor-16 .believe-inner{
    display:grid!important;grid-template-columns:1fr 1fr;column-gap:64px;
    max-width:1160px!important;width:100%;text-align:left!important;
    align-items:center;align-content:center;
  }
  .elementor-15 .believe-inner > .elementor-widget,
  .elementor-16 .believe-inner > .elementor-widget{grid-column:1;width:100%;max-width:100%}
  .elementor-15 .believe-inner > .elementor-widget-image,
  .elementor-16 .believe-inner > .elementor-widget-image{grid-column:2;grid-row:1/span 8;align-self:center;justify-self:stretch;margin:0}
  .elementor-15 .believe-inner .elementor-widget-image img,
  .elementor-16 .believe-inner .elementor-widget-image img{width:100%;height:auto;border-radius:18px}
  .elementor-15 .believe .eyebrow,.elementor-16 .believe .eyebrow{text-align:left!important}
  .elementor-15 .believe h2,.elementor-16 .believe h2{text-align:left}
  .elementor-15 .believe p,.elementor-16 .believe p{text-align:left;margin-left:0!important;margin-right:0!important;max-width:none}
}

/* ---- §9 offer cards (14): content vertically centred in the card ---- */
.elementor-14 .offer-item{align-items:center!important}
.elementor-14 .offer-item .tick{margin-top:0!important}

/* ---- §10 four-barriers cards (13): more air under the icon badge ---- */
.elementor-13 .services .svc .num{margin-bottom:28px!important}

/* ---- §11 "In practice" band (13): matching space above and below the card ---- */
.elementor-13 .casewrap{padding:88px 0!important}

/* ---- §12 resources "Latest insights" (16): symmetric band padding ---- */
.elementor-16 .res-latest{padding:88px 0!important}

/* ---- §13 blog posts: air between the category/date pills and the body copy ---- */
.single-post .dycic-post-meta{margin:14px 0 30px!important}

/* ---- §14 square flash behind buttons on hover: kill every wrapper hover
        decoration; the rounded pill (inner <a>) keeps its own lift+shadow ---- */
.elementor-widget-button.btn:not(.white):not(.outline):hover,
.elementor-widget-button.btn.white:hover,
.elementor-widget-button.btn.outline:hover,
.hero .elementor-widget-button.btn.outline:hover,
.hero .elementor-widget-button.btn.white:hover{
  background:none!important;box-shadow:none!important;transform:none!important;backdrop-filter:none!important;
}
.hero .elementor-widget-button.btn.outline,
.hero .elementor-widget-button.btn.white{backdrop-filter:none!important;box-shadow:none!important;background:none!important}
