/* ===========================================================
   EDC — playful layer (brought back from the original liquid glass design)
   1. Colourful gradient pools across the page background
   2. Coloured tiles (lilac, blue, peach, purple) with the white line graphic
   3. Flowing ribbon line art behind heroes and the services section
   Loaded last on every page. Neumorphic shadows and click behaviour are kept.
=========================================================== */
:root{
  --lines:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 240 260%22%3E%3Cg fill=%22none%22 stroke=%22%23fff%22 stroke-width=%221.6%22 stroke-opacity=%22.95%22 transform=%22rotate%2832 120 130%29%22%3E%3Crect x=%2220%22 y=%2210%22 width=%22200%22 height=%22240%22 rx=%2296%22/%3E%3Crect x=%2238%22 y=%2228%22 width=%22164%22 height=%22204%22 rx=%2280%22/%3E%3Crect x=%2256%22 y=%2246%22 width=%22128%22 height=%22168%22 rx=%2264%22/%3E%3C/g%3E%3C/svg%3E");
  --tint-lilac:linear-gradient(135deg,#F4ECFA 0%,#DCC7EC 100%);
  --tint-blue:linear-gradient(135deg,#ECF8FD 0%,#C2E3F3 100%);
  --tint-peach:linear-gradient(135deg,#FFF4EB 0%,#FAD3BA 100%);
  --tint-purple:radial-gradient(ellipse at 10% 0,#A57CC4 0%,transparent 60%),linear-gradient(120deg,#6E3C8C 0%,#8A58A7 65%,#A887C2 100%);
  --ink-lilac:#5B2F77;--ink-blue:#1C5F7E;--ink-peach:#963815;
  --tile-shadow:10px 10px 24px #CDBFDC,-9px -9px 20px #FFFFFF;
  --tile-shadow-lg:16px 16px 34px #C5B6D6,-12px -12px 26px #FFFFFF;
}

/* 1. Playful background: soft purple, blue and peach pools that repeat down the page */
/* Background colour pools.
   They sit on the page itself as a tile that repeats straight down. Every pool fades out
   completely inside its tile, so there is no edge anywhere, whatever the browser,
   window size or page length. */
html{
  background-color:#EEE7F5;
  background-image:
    radial-gradient(900px 500px at 72% 380px,rgba(186,140,230,.85),rgba(186,140,230,0) 70%),
    radial-gradient(700px 480px at 100% 820px,rgba(110,198,232,.68),rgba(110,198,232,0) 70%),
    radial-gradient(760px 500px at 0% 1100px,rgba(255,180,138,.72),rgba(255,180,138,0) 70%),
    radial-gradient(820px 480px at 30% 1580px,rgba(186,140,230,.66),rgba(186,140,230,0) 70%),
    radial-gradient(700px 440px at 96% 1560px,rgba(255,180,138,.62),rgba(255,180,138,0) 70%);
  background-repeat:repeat-y;
  background-size:100% 2000px;
  background-position:0 0;
  background-attachment:scroll;
}
body{background:transparent}
/* Header: no band of its own at the top of the page, so the background runs straight through.
   Once the page scrolls it becomes a solid raised bar so the menu stays readable. */
.site-header{background:transparent;box-shadow:none;transition:background-color .25s ease,box-shadow .25s ease}
.site-header.scrolled{background:#EEE7F5;box-shadow:0 12px 24px -14px #BEB1CF}
@media (max-width:900px){.site-header.open{background:#EEE7F5}}
/* Sections from the restored design sit on the shared background instead of painting their own */
html body .edc-showcase,html body .edc-showcase .v-hero,html body .edc-showcase .v-services,html body .edc-showcase .v-approach,html body .edc-showcase .v-journey,html body .edc-showcase .v-cta-section,html body .edc-showcase .designed-content>.section{background:transparent!important}

/* 3. Ribbon line art */
.hero{isolation:isolate;overflow:visible;overflow-x:clip}
.hero::before{content:"";position:absolute;inset:-40px 0 auto auto;width:78%;height:120%;background:url('../images/design/connection-ribbon.svg') center/contain no-repeat;opacity:.72;filter:blur(0.5px);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 18%,#000 72%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 18%,#000 72%,transparent 100%);z-index:-1;pointer-events:none}
.edc-showcase .v-services{position:relative;isolation:isolate;overflow:visible}
.edc-showcase .v-services:before{content:"";display:block!important;position:absolute;inset:230px 0 25px;background:url('../images/design/connection-ribbon.svg') center/cover no-repeat;opacity:.52;filter:blur(0.5px);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 20%,#000 80%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 20%,#000 80%,transparent 100%);z-index:-1;pointer-events:none}

/* 2. Coloured tiles with the line graphic ---------------------------------- */
/* Reference-site cards, cycling lilac / blue / peach */
.card,.quote,.snapshot-item{background-image:var(--lines),var(--tint-lilac);background-repeat:no-repeat,no-repeat;background-position:right -70px bottom -95px,0 0;background-size:220px 238px,100% 100%;box-shadow:var(--tile-shadow);overflow:hidden}
.grid > .card:nth-child(3n+2),.bento > .card:nth-child(3n+2),.quote-row > .quote:nth-child(3n+2),.snapshot > .snapshot-item:nth-child(3n+2){background-image:var(--lines),var(--tint-blue)}
.grid > .card:nth-child(3n),.bento > .card:nth-child(3n),.quote-row > .quote:nth-child(3n),.snapshot > .snapshot-item:nth-child(3n){background-image:var(--lines),var(--tint-peach)}
.card:hover{box-shadow:var(--tile-shadow-lg)}
.card::before{background:#FBF8FD;box-shadow:3px 3px 7px rgba(123,68,154,.18),-3px -3px 7px #fff}
.card h3,.quote p{color:var(--ink-lilac)}
.grid > .card:nth-child(3n+2) h3,.quote-row > .quote:nth-child(3n+2) p{color:var(--ink-blue)}
.grid > .card:nth-child(3n) h3,.quote-row > .quote:nth-child(3n) p{color:var(--ink-peach)}
.grid > .card:nth-child(3n+2)::after{background:var(--blue)}
.grid > .card:nth-child(3n)::after{background:var(--orange)}
.card p,.snapshot-item p{color:#54445F}
.snapshot-item:hover{box-shadow:inset 5px 5px 11px rgba(123,68,154,.22),inset -5px -5px 11px rgba(255,255,255,.8)}
.snapshot-band{background-image:radial-gradient(ellipse at 100% 0,rgba(134,207,230,.35),transparent 55%),radial-gradient(ellipse at 0 100%,rgba(255,196,160,.35),transparent 55%);background-color:#EEE7F5}
/* Steps: tinted, lighter touch */
.step{background-image:var(--tint-lilac)}
.steps > .step:nth-child(3n+2){background-image:var(--tint-blue)}
.steps > .step:nth-child(3n){background-image:var(--tint-peach)}
.step::before{background:#fff;box-shadow:inset 3px 3px 6px rgba(123,68,154,.18),inset -3px -3px 6px #fff}
/* Call-to-action band: purple tile with white lines */
.cta-band{background-image:var(--lines),var(--tint-purple);background-repeat:no-repeat;background-position:right -40px bottom -110px,0 0,0 0;background-size:320px 346px,100% 100%,100% 100%;box-shadow:10px 10px 24px #BEB1CF,-9px -9px 20px #fff,inset 2px 2px 5px #9D68BC,inset -3px -3px 6px #58306F}
.cta-band h2{color:#fff;-webkit-text-fill-color:#fff}
.cta-band p{color:#F3E8FA}
.cta-band .badge{background:#7B449A;color:#fff;box-shadow:5px 5px 12px #58306F,-4px -4px 10px #9D68BC}
.cta-band .btn-primary{background:#F4EEF9;color:var(--purple-deep);box-shadow:6px 6px 14px #58306F,-5px -5px 12px #9D68BC}
.cta-band .btn-outline{background:#7B449A;color:#fff;box-shadow:5px 5px 12px #58306F,-4px -4px 10px #9D68BC}
.cta-band .btn-outline:hover{box-shadow:inset 4px 4px 9px #58306F,inset -4px -4px 9px #9D68BC}
/* Hero photo frame and badges pick up a little colour */
.hero-art{background:linear-gradient(145deg,#F7F1FB,#E4D5F0)}
.kicker{background:linear-gradient(120deg,#F7F1FB,#EDE2F5)}

/* Restored services section and page: coloured tiles like the original design */
.edc-showcase .v-service.v-service-1,.edc-showcase .v-service.v-service-4{background:var(--tint-lilac)}
.edc-showcase .v-service.v-service-2,.edc-showcase .v-service.v-service-5{background:var(--tint-blue)}
.edc-showcase .v-service.v-service-3{background:var(--tint-peach)}
.edc-showcase .v-service.v-service-6{background:var(--tint-purple)}
.edc-showcase .v-service{box-shadow:var(--tile-shadow)}
.edc-showcase .v-service:hover{box-shadow:var(--tile-shadow-lg)}
.edc-showcase .v-service-2 p,.edc-showcase .v-service-5 p{color:#2F5A6E}
.edc-showcase .v-service-3 p{color:#7A4533}
.edc-showcase .v-service-1 p,.edc-showcase .v-service-4 p{color:#5C4570}
.edc-showcase .v-icon,.edc-showcase .service-link b{background:#FBF8FD;box-shadow:4px 4px 9px rgba(123,68,154,.18),-3px -3px 8px #fff}
.edc-showcase .v-service-6 .v-icon,.edc-showcase .v-service-6 .service-link b{background:#7B449A;box-shadow:5px 5px 12px #58306F,-4px -4px 10px #9D68BC}
.edc-showcase .card-lines{opacity:.95}
.edc-showcase .card-lines i{border-color:rgba(255,255,255,.95);box-shadow:none}
.edc-showcase .v-service-6 .card-lines{opacity:.35}
.edc-showcase .v-service-6 .card-lines i{border-color:#fff}
.edc-showcase .journey-cards article{background:var(--tint-lilac);box-shadow:var(--tile-shadow)}
.edc-showcase .journey-cards article:nth-child(2){background:var(--tint-peach)}
.edc-showcase .journey-cards article:nth-child(3){background:var(--tint-blue)}
.edc-showcase .journey-number,.edc-showcase .journey-connector{background:#FBF8FD}
.edc-showcase .v-trust .wrap{background:linear-gradient(120deg,#F7F1FB,#EEE4F6 60%,#E9F2FA)}
.edc-showcase .trust-icon.purple{background:var(--tint-lilac)}
.edc-showcase .trust-icon.orange{background:var(--tint-peach)}
.edc-showcase .trust-icon.blue{background:var(--tint-blue)}
.edc-showcase .canvas-message{background:linear-gradient(130deg,#FBF7FD,#F1E7F8 55%,#E8F3FA)}
.edc-showcase .approach-glass{background:linear-gradient(130deg,#FBF7FD,#EFE4F7)}
.edc-showcase .filter-bar{background:linear-gradient(120deg,#E4D8EE,#EEE7F5,#DEEBF3)}
.edc-showcase .v-cta{background-image:var(--lines),var(--tint-purple);background-repeat:no-repeat;background-position:right 30% bottom -140px,0 0,0 0;background-size:360px 390px,100% 100%,100% 100%}
.edc-showcase .floating-chip.chip-together{background:linear-gradient(135deg,#EBF8FD,#D6EEF8)}
/* Match the source site's button behaviour inside the restored section */
.edc-showcase .button{transition:box-shadow .2s ease,transform .2s ease,background .2s ease}
.edc-showcase .v-cta .button:active{box-shadow:inset 4px 4px 9px #BEB1CF,inset -4px -4px 9px #fff}
/* Line up the restored section with the rest of the page */
.edc-showcase .wrap{max-width:1180px;padding-left:28px;padding-right:28px;margin-left:auto;margin-right:auto}
@media (max-width:620px){
  .hero::before{width:100%;opacity:.35}
  .card,.quote,.snapshot-item{background-size:170px 184px,100% 100%;background-position:right -60px bottom -80px,0 0}
  .edc-showcase .wrap{padding-left:20px;padding-right:20px}
}
@media (prefers-contrast:more){.card,.quote,.snapshot-item,.step{background-image:none;background-color:#F4EEF9}}
/* Services page: trust bar sits below the simplified hero instead of overlapping the photo */
.hero + .edc-showcase .v-trust{margin-top:36px}

/* ---------- One button behaviour across the whole site ----------
   Rest: raised. Hover: pressed in. Click: pressed in further. No lift and no colour change. */
html body .btn,html body .edc-showcase .button,html body .nav a.btn{transition:box-shadow .2s ease,background-color .2s ease,color .2s ease;transform:none}
html body .btn:hover,html body .btn:active,html body .edc-showcase .button:hover,html body .edc-showcase .button:active,html body .nav a.btn:hover,html body .nav a.btn:active,html body .cta-band .btn:hover,html body .cta-band .btn:active,html body .edc-showcase .button.primary:hover,html body .edc-showcase .button.primary:active,html body .edc-showcase .v-cta .button:hover,html body .edc-showcase .v-cta .button:active{transform:none}
/* Purple buttons on the light page */
html body .btn-primary,html body .nav a.btn-primary,html body .edc-showcase .button.primary{background:#7B449A;color:#fff;box-shadow:10px 10px 22px #BEB1CF,-9px -9px 20px #FFFFFF,inset 2px 2px 5px #9D68BC,inset -3px -3px 6px #58306F}
html body .btn-primary:hover,html body .nav a.btn-primary:hover,html body .edc-showcase .button.primary:hover{background:#7B449A;color:#fff;box-shadow:inset 5px 5px 10px #58306F,inset -4px -4px 9px #9D68BC}
html body .btn-primary:active,html body .nav a.btn-primary:active,html body .edc-showcase .button.primary:active{background:#7B449A;color:#fff;box-shadow:inset 8px 8px 16px #4E2A63,inset -6px -6px 12px #9D68BC}
/* Light buttons on the light page */
html body .btn-outline{background:var(--surface);color:var(--purple-deep);box-shadow:5px 5px 12px #CFC4DD,-5px -5px 12px #FFFFFF}
html body .btn-outline:hover{box-shadow:inset 5px 5px 11px #CFC4DD,inset -5px -5px 11px #FFFFFF}
html body .btn-outline:active{box-shadow:inset 8px 8px 16px #C3B6D3,inset -7px -7px 14px #FFFFFF}
/* Light buttons sitting on purple boxes */
html body .cta-band .btn-primary,html body .edc-showcase .v-cta .button{background:#F4EEF9;color:#5E3378;box-shadow:6px 6px 14px #58306F,-5px -5px 12px #9D68BC}
html body .cta-band .btn-primary:hover,html body .edc-showcase .v-cta .button:hover{background:#F4EEF9;color:#5E3378;box-shadow:inset 4px 4px 9px #BEB1CF,inset -4px -4px 9px #FFFFFF}
html body .cta-band .btn-primary:active,html body .edc-showcase .v-cta .button:active{background:#F4EEF9;color:#5E3378;box-shadow:inset 7px 7px 14px #B3A4C6,inset -6px -6px 12px #FFFFFF}
/* Purple outline buttons on purple boxes */
html body .cta-band .btn-outline{background:#7B449A;color:#fff;box-shadow:5px 5px 12px #58306F,-4px -4px 10px #9D68BC}
html body .cta-band .btn-outline:hover{box-shadow:inset 4px 4px 9px #58306F,inset -4px -4px 9px #9D68BC}
html body .cta-band .btn-outline:active{box-shadow:inset 7px 7px 14px #4E2A63,inset -6px -6px 12px #9D68BC}
/* Arrow circles inside buttons follow the button */
html body .edc-showcase .button:hover .button-arrow,html body .edc-showcase .button:active .button-arrow{transform:none}
/* Small round and pill controls */
html body .lang-btn:active,html body .menu-btn:active{box-shadow:inset 7px 7px 14px #C3B6D3,inset -6px -6px 12px #FFFFFF}
html body .menu-btn:hover{box-shadow:inset 5px 5px 11px #CFC4DD,inset -5px -5px 11px #FFFFFF}
@media (prefers-reduced-motion:reduce){html body .btn,html body .edc-showcase .button{transition:none}}

/* ---------- Navigation spacing: keep clear space between the logo and "Home" ---------- */
.site-header .logo{flex:none}
.site-header .wrap > nav.nav{margin-left:44px;gap:18px}
.site-header .nav-links{gap:6px}
@media (max-width:1180px) and (min-width:901px){
  .site-header .wrap > nav.nav{margin-left:28px;gap:12px}
  .site-header .nav-links{gap:0}
  .site-header .nav-links a{padding:9px 12px;font-size:.9rem}
  .site-header .logo img{height:40px}
  .nav-cta .btn{padding:11px 16px}
  .lang-btn{padding:9px 12px}
}
@media (max-width:1040px) and (min-width:901px){
  .site-header .nav-links a{padding:8px 9px;font-size:.86rem}
  .lang-icon{display:none}
}
@media (max-width:900px){.site-header .wrap > nav.nav{margin-left:16px;gap:0}}
@media (max-width:640px){.site-header .wrap > nav.nav{margin-left:8px}}
@media (max-width:370px){
  .site-header .wrap{padding-left:12px;padding-right:12px;gap:6px}
  .site-header .logo img{height:30px}
  .site-header .wrap > nav.nav{margin-left:6px}
  .nav-cta{gap:6px}
  .nav-cta .btn{padding:9px 11px;font-size:.76rem}
  .lang-btn{padding:8px 9px;font-size:.76rem}
  .menu-btn{width:38px;height:38px}
}

/* ---------- Even spacing in the navigation bar ----------
   Every item (the six links, the language button and "Get in touch") is a pill of the same
   height, with the same 8px gap between each pill at every screen size. */
.site-header .wrap > nav.nav,.site-header .nav-links,.site-header .nav-cta{gap:8px}
.site-header .nav-links a,.site-header .lang-btn,.site-header .nav-cta .btn{height:40px;box-sizing:border-box;display:inline-flex;align-items:center;line-height:1}
.site-header .nav-links a,.site-header .lang-btn{padding:0 16px}
.site-header .nav-cta .btn{padding:0 20px}
@media (max-width:1180px) and (min-width:901px){
  .site-header .nav-links a,.site-header .lang-btn{padding:0 11px;height:36px}
  .site-header .nav-cta .btn{padding:0 15px;height:36px}
}
@media (max-width:1040px) and (min-width:901px){
  .site-header .nav-links a,.site-header .lang-btn{padding:0 8px;font-size:.84rem}
  .site-header .nav-cta .btn{padding:0 12px;font-size:.84rem}
}
@media (max-width:900px){.site-header .nav-links a{height:auto;padding:9px 16px}}
@media (max-width:640px){
  .site-header .lang-btn{padding:0 11px;height:36px;font-size:.8rem}
  .site-header .nav-cta .btn{padding:0 14px;height:36px;font-size:.82rem}
}
@media (max-width:370px){
  .site-header .nav-cta{gap:6px}
  .site-header .lang-btn{padding:0 9px;height:32px;font-size:.76rem}
  .site-header .nav-cta .btn{padding:0 11px;height:32px;font-size:.76rem}
}

/* ---------- Floating EDC logo ----------
   Replaces the floating rings and star badges. The logo sits on a raised light disc so its
   purple letters stay visible on purple sections, and drifts gently up and down. */
.logo-float{display:grid;place-items:center;border-radius:50%;background:#F7F2FB;
  box-shadow:12px 12px 26px rgba(62,28,86,.28),-8px -8px 20px rgba(255,255,255,.55),inset 3px 3px 6px #FFFFFF,inset -4px -4px 8px #DCCDE9;
  animation:edc-logo-float 6s cubic-bezier(.45,.05,.55,.95) infinite;will-change:transform;pointer-events:none;z-index:3}
.logo-float img{width:78%;height:auto;display:block}
.logo-float--sm{width:64px;height:64px}
.logo-float--md{width:150px;height:150px}
.logo-float--xl{width:250px;height:250px}
/* A gentle bob with a slight sway: a bigger lift than before, eased so it never jerks */
@keyframes edc-logo-float{
  0%,100%{transform:translateY(0) rotate(0deg)}
  25%{transform:translateY(-10px) rotate(-2.5deg)}
  50%{transform:translateY(-18px) rotate(0deg)}
  75%{transform:translateY(-10px) rotate(2.5deg)}
}
.hero-art-wrap .logo-float,.approach-art .logo-float{box-shadow:8px 8px 18px #CDBFDC,-7px -7px 16px #FFFFFF,inset 2px 2px 4px #FFFFFF,inset -3px -3px 6px #E2D6EC}
/* Top photos: in place of the orange star badge */
.hero-logo{position:absolute;left:-22px;bottom:-22px;animation-delay:-2s}
/* Services page: "Big on care" photo, in place of the small rings */
.edc-showcase .approach-logo{position:absolute;right:-20px;bottom:-14px;animation-delay:-4s}
/* Services page: purple call to action, in place of the three rings; chip sits below the logo */
.edc-showcase .cta-sculpture{flex-direction:column;align-items:center;gap:22px}
html body .edc-showcase .cta-sculpture .floating-chip{position:static;transform:none}
@media (max-width:620px){
  .logo-float--xl{width:180px;height:180px}
  .logo-float--md{width:110px;height:110px}
  .edc-showcase .cta-sculpture{height:auto;align-items:flex-start;margin-top:26px}
  .hero-logo{left:auto;right:14px;bottom:14px;width:54px;height:54px}
}
@media (prefers-reduced-motion:reduce){.logo-float{animation:none}}

/* ---------- Top-section line graphics reach the screen edge ----------
   The graphic box now runs past the right edge of the screen and the image fills it
   (instead of shrinking to fit), so the lines always continue off-screen at any window
   width. Its left side fades in softly so there's no cut-off edge there either. */
.hero::before{
  inset:-40px -12% auto auto;width:90%;
  background-size:cover;background-position:left center;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 18%,#000 72%,transparent 100%),linear-gradient(to right,transparent 0,#000 22%,#000 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to bottom,transparent 0,#000 18%,#000 72%,transparent 100%),linear-gradient(to right,transparent 0,#000 22%,#000 100%);
  mask-composite:intersect;
}
@media (max-width:620px){.hero::before{width:130%;inset:-40px -20% auto auto}}

/* ---------- SEO additions (Oct 2026) ---------- */
/* kicker now sits inside the H1 for keyword-rich headings; keep it looking exactly as before */
h1 > .kicker{display:flex;width:-moz-fit-content;width:fit-content;margin:0 0 1.1em;font-family:var(--sans);font-size:.8rem;font-weight:700;font-style:normal;
  line-height:1.6;letter-spacing:.06em;word-spacing:normal;text-transform:uppercase;color:var(--purple);-webkit-text-fill-color:var(--purple);
  background:linear-gradient(120deg,#F7F1FB,#EDE2F5);-webkit-background-clip:border-box;background-clip:border-box;text-shadow:none;max-width:none}
.h3-size{font-size:clamp(1.25rem,1.6vw,1.5rem);letter-spacing:-.03em;line-height:1.2}
/* FAQ accordions */
.faq-list{display:grid;gap:16px;max-width:880px;margin-top:22px}
.faq{border-radius:22px;background-image:var(--tint-lilac);box-shadow:var(--tile-shadow);overflow:hidden}
.faq-list > .faq:nth-child(3n+2){background-image:var(--tint-blue)}
.faq-list > .faq:nth-child(3n){background-image:var(--tint-peach)}
.faq summary{cursor:pointer;list-style:none;padding:20px 58px 20px 24px;font-weight:700;color:var(--ink);position:relative;font-size:1.05rem;line-height:1.35}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);width:30px;height:30px;border-radius:50%;display:grid;place-items:center;
  background:var(--surface);box-shadow:var(--nm-raised-sm);color:var(--purple);font-size:1.2rem;font-weight:700;transition:transform .2s ease}
.faq[open] summary::after{content:"\2212"}
.faq summary:focus-visible{outline:3px solid var(--purple);outline-offset:-3px;border-radius:22px}
.faq-a{padding:0 24px 20px}
.faq-a p{margin:0;color:var(--ink-soft);max-width:70ch}
.faq-a a,.contact-details a,.lst-source a,.prose a{color:var(--purple);text-decoration:underline;text-underline-offset:3px}
/* footer: five columns + contact line */
.footer-grid--5{grid-template-columns:1.6fr 1fr 1fr .8fr 1fr;gap:30px}
.footer-grid--5 .footer-logo span{white-space:nowrap}
.footer-contact a{display:block;margin:10px 0 0;color:#fff;font-weight:600;font-size:.95rem}
.footer-bottom a{color:inherit;text-decoration:underline;text-underline-offset:3px}
@media (max-width:1100px){.footer-grid--5{grid-template-columns:1fr 1fr 1fr}}
@media (max-width:820px){.footer-grid--5{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.footer-grid--5{grid-template-columns:1fr}}
/* contact details card */
.contact-details{padding:28px 28px 12px!important}
.contact-details::before,.contact-details::after{display:none}
.contact-details p{margin:0 0 14px}
/* careers form */
.careers-form{display:grid;gap:14px;margin-top:14px}
.careers-form label{display:grid;gap:6px;font-weight:600;font-size:.92rem;color:var(--ink)}
.careers-form input,.careers-form select,.careers-form textarea{width:100%;padding:13px 15px;font:inherit;font-weight:400;border:0;border-radius:14px;background:var(--surface);box-shadow:var(--nm-inset);color:var(--ink)}
.careers-form button{justify-self:start;margin-top:6px}
.card:has(.careers-form)::before,.card:has(.careers-form)::after{display:none}
.lst-group-head .lst-region-link{font-weight:600;color:var(--purple);font-size:.92rem;text-decoration:underline;text-underline-offset:3px}
h1 > .kicker::before{color:var(--orange);-webkit-text-fill-color:var(--orange)}
.region-link{color:inherit;text-decoration:underline;text-decoration-color:rgba(123,68,154,.35);text-underline-offset:3px}
.region-link:hover{color:var(--purple)}

/* ---------- Mobile optimisation (Oct 2026) ---------- */
.faq-a,.contact-details,.footer-contact,.lst-source,.prose{overflow-wrap:anywhere}
.lst-group-head{flex-wrap:wrap;row-gap:6px}
.hero-grid > *,.split > *,.grid > *,.wrap > form,form > div,form label{min-width:0}
@media (max-width:620px){
  /* iOS zooms into form fields under 16px */
  input,select,textarea{font-size:16px!important}
  /* comfortable tap targets in the header */
  .site-header .logo{min-height:44px}
  .site-header .lang-btn,.site-header .nav-cta .btn{min-height:44px}
  .float-badge,.lst-tag{font-size:12px}
  .faq summary{padding:18px 58px 18px 20px;font-size:1rem}
  .faq-a{padding:0 20px 20px}
  .footer-grid a{padding:4px 0;margin-bottom:6px}
  .footer-bottom{flex-direction:column;align-items:flex-start}
  /* showcase sections (home + services): lift tiny text to readable sizes */
  .edc-showcase .v-eyebrow,.edc-showcase .v-cta .v-eyebrow{font-size:11px;letter-spacing:.08em}
  .edc-showcase .filter-chip{font-size:12.5px}
  .edc-showcase .filter-chip span{font-size:11px}
  .edc-showcase .service-meta{font-size:11.5px}
  .edc-showcase .service-link,.edc-showcase .v-service-6 .service-link{font-size:13px}
  .edc-showcase .button{font-size:14px}
  .edc-showcase .hero-link,.edc-showcase .text-link,.edc-showcase .v-section-head>.text-link{font-size:13px}
  .edc-showcase .approach-points p{font-size:14px}
  .edc-showcase .approach-glass{font-size:12.5px}
  .edc-showcase .approach-glass strong{font-size:14px}
  .edc-showcase .floating-chip,.edc-showcase .cta-sculpture .floating-chip{font-size:12px}
  .edc-showcase .v-trust a{font-size:12px}
  .edc-showcase .trust-intro{font-size:13px}
}
@media (max-width:380px){
  .wrap{padding-left:18px;padding-right:18px}
}
@media (max-width:620px){
  .edc-showcase .hero-assurance span,.edc-showcase .hero-assurance strong{font-size:12px}
  .edc-showcase .service-meta,.edc-showcase .v-eyebrow,.edc-showcase .v-cta .v-eyebrow{font-size:12px}
  .lst-card .lst-tag{font-size:12px}
  .site-header .menu-btn{width:44px;height:44px}
}
@media (max-width:370px){ .site-header .menu-btn{width:42px;height:42px} }
@media (min-width:371px) and (max-width:430px){
  .site-header .wrap{padding-left:16px;padding-right:16px}
  .site-header .logo img{height:34px}
  .site-header .wrap > nav.nav{margin-left:6px}
  .site-header .nav-cta{gap:6px}
  .site-header .lang-btn{padding-left:9px;padding-right:9px}
  .site-header .nav-cta .btn{padding-left:13px;padding-right:13px}
}
@media (min-width:621px) and (max-width:850px){
  .edc-showcase .v-eyebrow,.edc-showcase .v-cta .v-eyebrow,.edc-showcase .service-meta,.edc-showcase .v-trust a,.edc-showcase .floating-chip,.edc-showcase .cta-sculpture .floating-chip{font-size:12px}
  .edc-showcase .filter-chip{font-size:12.5px}
  .edc-showcase .filter-chip span{font-size:11px}
  .edc-showcase .service-link,.edc-showcase .v-service-6 .service-link,.edc-showcase .hero-link,.edc-showcase .text-link,.edc-showcase .v-section-head>.text-link{font-size:13px}
  .edc-showcase .button{font-size:14px}
  .edc-showcase .approach-points p{font-size:14px}
  .edc-showcase .hero-assurance span,.edc-showcase .hero-assurance strong{font-size:12px}
}
.lst-card .lst-tag{font-size:12px}
@media (max-width:1024px){ input,select,textarea{font-size:16px!important} }
@media (max-width:850px){
  .edc-showcase .journey-cards p{font-size:13.5px}
  .edc-showcase .approach-glass{font-size:12.5px}
  .edc-showcase .approach-glass strong{font-size:14px}
}
@media (max-width:560px){
  .footer-grid--5{grid-template-columns:1fr 1fr;gap:26px 18px}
  .footer-grid--5 > div:first-child{grid-column:1 / -1}
  .footer-grid--5 a{font-size:.88rem}
}