/* ==========================================================================
   DataSyn – component styles
   Ported from Prototyp/assets/styles.css. Colors/fonts come from theme.json
   presets; the short variables below are aliases for readability.
   Style guide: black = data, red = transformation, gold = value,
   grey = raw state, white = clarity.
   ========================================================================== */
:root {
	--ink: var(--wp--preset--color--ink, #141414);
	--ink-2: var(--wp--preset--color--ink-2, #3a3a3a);
	--grey: var(--wp--preset--color--grey, #8a8680);
	--line: var(--wp--preset--color--line, #e4e0d8);
	--paper: var(--wp--preset--color--paper, #faf8f4);
	--paper-2: var(--wp--preset--color--paper-2, #f2eee6);
	--white: #ffffff;
	--red: var(--wp--preset--color--red, #d7261e);
	--red-dark: var(--wp--preset--color--red-dark, #a81b15);
	--gold: var(--wp--preset--color--gold, #b8912f);
	--radius: 14px;
	--max: 1160px;
	--header-h: 78px;
	--brush: var(--wp--preset--font-family--brush, "Kaushan Script", cursive);
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 60px); }
body { margin: 0; }
img { max-width: 100%; height: auto; }
h1, h2, h3, h4 { margin: 0 0 16px; letter-spacing: -.01em; }
p { margin: 0 0 16px; }
.wp-site-blocks > main,
.wp-site-blocks > .wp-block-group { margin: 0; }
.entry-content > *, .wp-block-post-content > * { max-width: none; }
.skip-link:focus { z-index: 100000; }
:focus-visible { outline: 3px solid var(--red); outline-offset: 2px; }

.wrap { max-width: var(--max); margin-left: auto; margin-right: auto; padding-left: 24px; padding-right: 24px; }
.ds-section { padding: 88px 0; }
.ds-section.tight { padding: 56px 0; }
.alt { background: var(--white); }
.dark { background: var(--ink); color: #f3f1ec; }
.dark h1, .dark h2, .dark h3 { color: #fff; }
.dark .muted { color: #b9b4ab; }

.brush { font-family: var(--brush); font-weight: 400; color: var(--red); letter-spacing: 0; }
.eyebrow { font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--red); margin-bottom: 14px; }
.lead { font-size: 20px; color: var(--ink-2); max-width: 640px; }
.dark .lead { color: #cfcac1; }
.muted { color: var(--grey); }
.note { font-size: 14px; color: var(--grey); }
.center, .has-text-align-center { text-align: center; }
.center .lead { margin-left: auto; margin-right: auto; }
.section-head { max-width: 720px; margin-bottom: 48px; }
.section-head.center { margin-left: auto; margin-right: auto; }

/* ---------- Buttons ---------- */
.wp-block-buttons { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; margin: 0 0 8px; }
.wp-block-button__link { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; border: 2px solid transparent; transition: background-color .15s, color .15s; line-height: 1.3; }
.wp-block-button.btn-ghost .wp-block-button__link { background: transparent; border-color: var(--ink); color: var(--ink); }
.wp-block-button.btn-ghost .wp-block-button__link:hover { background: var(--ink); color: #fff; }
.dark .wp-block-button.btn-ghost .wp-block-button__link,
.cta-band .wp-block-button.btn-ghost .wp-block-button__link { border-color: #f3f1ec; color: #f3f1ec; }
.dark .wp-block-button.btn-ghost .wp-block-button__link:hover,
.cta-band .wp-block-button.btn-ghost .wp-block-button__link:hover { background: #f3f1ec; color: var(--ink); }
.btn-col { flex-direction: column; align-items: flex-start; }

.more a, a.more { font-weight: 700; text-decoration: none; color: var(--red); }
.more a:hover, a.more:hover { text-decoration: underline; }
.more a::after, a.more::after { content: " →"; }
.dark .more a { color: #ff6b63; }

/* ---------- Header ---------- */
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255, 255, 255, .96); backdrop-filter: blur(6px); border-bottom: 1px solid var(--line); }
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-header { top: 46px; } }
.site-header .header-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: var(--header-h); }
.site-header .logo { margin: 0; line-height: 0; }
.site-header .logo img { height: 52px; width: auto; }
.site-header .wp-block-navigation { gap: 28px; font-size: 16px; }
.site-header .wp-block-navigation-item__content { color: var(--ink-2); text-decoration: none; padding: 6px 0; border-bottom: 2px solid transparent; }
.site-header .wp-block-navigation-item__content:hover,
.site-header .current-menu-item > .wp-block-navigation-item__content { color: var(--ink); border-bottom-color: var(--red); }
.site-header .header-right { display: flex; align-items: center; gap: 28px; }
.site-header .header-cta { margin: 0; }
.site-header .header-cta .wp-block-button__link { padding: 10px 20px; font-size: 15px; }
.wp-block-navigation__responsive-container.is-menu-open { padding: 32px 24px; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 20px; }

/* ---------- Hero ---------- */
.hero { padding: 72px 0 88px; background: var(--white); overflow: hidden; }
.hero .hero-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 48px; align-items: center; }
.hero h1 .brush { font-size: 1.12em; }
.proof-line { margin-top: 18px; font-size: 14px; color: var(--grey); }
.hero-art { width: 100%; }
.hero-photo img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 18px; box-shadow: 0 30px 60px rgba(20, 20, 20, .18); }
.wp-block-image.photo { margin: 0; }
.wp-block-image.photo img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--radius); box-shadow: 0 20px 50px rgba(20, 20, 20, .12); }
.hero-art svg { width: 100%; height: auto; display: block; }
.page-hero { padding: 72px 0 56px; background: var(--white); border-bottom: 1px solid var(--line); }
.page-hero .lead { max-width: 760px; }

/* ---------- Stats ---------- */
.stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.stat { border-left: 3px solid var(--red); padding: 4px 0 4px 18px; }
.stat p { margin: 0; }
.stat b, .stat strong { display: block; font-size: 34px; line-height: 1.1; }
.stat span { font-size: 15px; color: var(--grey); }

/* ---------- Logo bar & chips ---------- */
.logobar-label { text-align: center; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--grey); margin-bottom: 22px; }
.logobar { display: flex; flex-wrap: wrap; gap: 14px 40px; justify-content: center; align-items: center; }
.logobar span { font-weight: 700; font-size: 17px; color: #9a958d; letter-spacing: .02em; white-space: nowrap; }
.logobar { gap: 18px 44px; }
.logobar img { height: 40px; width: auto; max-width: 150px; object-fit: contain; filter: grayscale(1); opacity: .65; transition: filter .2s ease, opacity .2s ease; vertical-align: middle; }
.logobar img:hover { filter: none; opacity: 1; }
.quote-logo { flex: none; display: grid; place-items: center; width: 92px; height: 48px; padding: 6px 8px; background: #fff; border: 1px solid var(--line); border-radius: 10px; }
.quote-logo img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.chips { display: flex; flex-wrap: wrap; gap: 10px; }
.chips.center { justify-content: center; }
.chip { border: 1px solid var(--line); background: var(--white); border-radius: 999px; padding: 7px 16px; font-size: 15px; }
.dark .chip { background: transparent; border-color: #4a4843; color: #e8e4dc; }

/* ---------- Grids & cards ---------- */
.grid + .grid { margin-top: 24px; }
.grid + .more, .grid + .center, .grid + h3, .grid + .note, .chips + .more, .chips + .note, .stack + .grid, .res-list + .note { margin-top: 28px; }
.stats + .note { margin: 12px 0 56px; }
.grid { display: grid; gap: 24px; }
.g1 { grid-template-columns: 1fr; }
.g2 { grid-template-columns: repeat(2, 1fr); }
.g3 { grid-template-columns: repeat(3, 1fr); }
.g4 { grid-template-columns: repeat(4, 1fr); }
.card { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 30px; display: flex; flex-direction: column; }
.alt .card { background: var(--paper); }
.card p { color: var(--ink-2); }
.card .more { margin-top: auto; margin-bottom: 0; }
.card .icon, .card svg.icon { width: 52px; height: 52px; margin-bottom: 18px; display: block; }
.card-dark, .dark .card { background: #1f1f1f; color: #f3f1ec; border-color: #333; }
.card-dark p, .dark .card p { color: #cfcac1; }
.tag { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--gold); margin-bottom: 10px; }
.tag.red { color: var(--red); }

/* ---------- Compare ---------- */
.compare { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: var(--white); }
.compare > div { padding: 34px; }
.compare > div:first-child { background: var(--paper-2); }
.compare ul { list-style: none; padding: 0; margin: 0; }
.compare li { padding: 9px 0 9px 30px; position: relative; border-bottom: 1px dashed var(--line); }
.compare li:last-child { border-bottom: none; }
.compare .bad li::before { content: "✕"; position: absolute; left: 0; color: var(--grey); font-weight: 700; }
.compare .good li::before { content: "✓"; position: absolute; left: 0; color: var(--red); font-weight: 700; }

/* ---------- Lists ---------- */
.checklist { list-style: none; padding: 0; margin: 0 0 22px; }
.checklist li { padding: 6px 0 6px 30px; position: relative; }
.checklist li::before { content: "✓"; position: absolute; left: 0; color: var(--red); font-weight: 700; }
.dark .checklist li::before, .cta-band .checklist li::before { color: #ff6b63; }

/* ---------- Steps ---------- */
.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; counter-reset: step; }
.steps.s3 { grid-template-columns: repeat(3, 1fr); }
.step { position: relative; padding-top: 64px; }
.step::before { counter-increment: step; content: counter(step); position: absolute; top: 0; left: 0; width: 46px; height: 46px; border-radius: 50%; border: 3px solid var(--red); display: grid; place-items: center; font-weight: 700; color: var(--red); background: var(--paper); }
.alt .step::before { background: var(--white); }
.step:not(:last-child)::after { content: ""; position: absolute; top: 22px; left: 58px; right: -14px; border-top: 2px dotted var(--red); }
.step h3 { font-size: 19px; }
.step p { font-size: 15px; color: var(--ink-2); }

/* ---------- Quotes (datasyn/testimonials) ---------- */
.quote { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 30px; position: relative; margin: 0; }
.alt .quote { background: var(--paper); }
.quote::before { content: "“"; font-family: Georgia, serif; font-size: 72px; line-height: 1; color: var(--red); position: absolute; top: 10px; left: 22px; }
.quote p { padding-top: 34px; font-size: 17px; }
.quote p + p { padding-top: 0; margin-top: 12px; }
.quote footer { font-size: 14px; color: var(--grey); }
.quote footer { display: flex; align-items: center; gap: 12px; }
.quote footer b { color: var(--ink); display: block; font-size: 15px; }
.quote-avatar { flex: 0 0 48px; width: 48px; height: 48px; border-radius: 50%; overflow: hidden; box-shadow: 0 0 0 2px var(--red); }
.quote-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.quote.short p { font-size: 16px; }

/* ---------- Case studies (datasyn/cases) ---------- */
.case { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; }
.case .case-cover { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: #fff; border-bottom: 1px solid var(--line); }
.case .case-cover img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; transition: transform .3s ease; }
.case a.case-cover:hover img { transform: scale(1.03); }
.case .case-top { background: var(--ink); color: #fff; padding: 26px 28px; }
.case .case-top .tag { color: #e0b85a; }
.case .case-top h3 { margin: 0; font-size: 20px; color: #fff; }
.case .case-body { padding: 24px 28px; display: flex; flex-direction: column; flex: 1; }
.case ul { padding-left: 18px; margin: 0 0 18px; color: var(--ink-2); font-size: 15px; }
.case li { margin-bottom: 6px; }
.case .more { margin-top: auto; margin-bottom: 0; }

/* ---------- Team (datasyn/team) ---------- */
.team { display: grid; grid-template-columns: repeat(6, 1fr); gap: 18px; }
.team.cols-3 { grid-template-columns: repeat(3, 1fr); }
.person { text-align: center; }
.avatar { width: 96px; height: 96px; border-radius: 50%; margin: 0 auto 12px; display: grid; place-items: center; font-weight: 700; font-size: 26px; color: var(--ink); background: var(--paper-2); border: 3px solid var(--white); box-shadow: 0 0 0 2px var(--red); overflow: hidden; }
.avatar img { width: 100%; height: 100%; object-fit: cover; }
.person b { display: block; font-size: 15px; }
.person span { font-size: 13px; color: var(--grey); }
.team-full { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.team-full .card { align-items: flex-start; }
.team-full .avatar { margin: 0 0 16px; width: 84px; height: 84px; font-size: 22px; }
.team-full .role { font-size: 14px; color: var(--red); font-weight: 700; margin-bottom: 10px; }
.team-full p { font-size: 15px; }

/* ---------- CTA band ---------- */
.cta-band { background: var(--ink); color: #f3f1ec; border-radius: 24px; padding: 56px; display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; align-items: center; position: relative; overflow: hidden; }
.cta-band h2 { color: #fff; }
.cta-band p { color: #cfcac1; }
.cta-band .enso-bg { position: absolute; right: -60px; top: -60px; width: 320px; opacity: .18; pointer-events: none; }
.cta-band .enso-bg svg { width: 100%; height: auto; }
.cta-band > div { position: relative; }

/* ---------- Split ---------- */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.split.wide-left { grid-template-columns: 1.2fr .8fr; }
.split.align-end { align-items: end; }
.split.contact { grid-template-columns: 1.3fr .7fr; align-items: start; }
.split-gap-bottom { margin-bottom: 40px; }

/* ---------- Stack (data pipeline) ---------- */
.stack { display: grid; grid-template-columns: repeat(5, 1fr); }
.stack-step { background: var(--white); border: 1px solid var(--line); padding: 22px 20px 22px 26px; position: relative; }
.stack-step:first-child { border-radius: var(--radius) 0 0 var(--radius); }
.stack-step:last-child { border-radius: 0 var(--radius) var(--radius) 0; }
.stack-step:not(:last-child)::after { content: ""; position: absolute; right: -11px; top: 50%; width: 20px; height: 20px; background: var(--white); border-top: 1px solid var(--line); border-right: 1px solid var(--line); transform: translateY(-50%) rotate(45deg); z-index: 1; }
.stack-step h3 { font-size: 18px; margin-bottom: 6px; }
.stack-step p { font-size: 14px; color: var(--ink-2); margin: 0; }
.stack-step.gold { background: var(--ink); color: #fff; border-color: var(--ink); }
.stack-step.gold h3 { color: #fff; }
.stack-step.gold p { color: #cfcac1; }
.stack-step.gold .tag { color: #e0b85a; }

/* ---------- Journey (partner) ---------- */
.journey { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; position: relative; }
.journey::before { content: ""; position: absolute; left: 4%; right: 4%; top: 30px; border-top: 3px dotted var(--red); z-index: 0; }
.station { position: relative; z-index: 1; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; }
.station .who { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; padding: 4px 10px; border-radius: 999px; margin-bottom: 12px; }
.station.partner .who { background: var(--paper-2); color: var(--ink-2); }
.station.ds .who { background: var(--red); color: #fff; }
.station.goal { background: var(--ink); color: #fff; border-color: var(--ink); }
.station.goal h3 { color: #fff; }
.station.goal p { color: #cfcac1; }
.station h3 { font-size: 18px; }
.station p { font-size: 14px; color: var(--ink-2); margin: 0; }

/* ---------- Partner cards (datasyn/partners) ---------- */
.partner-card .partner-head { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 14px; }
.partner-card .partner-logo { min-height: 64px; width: 160px; padding: 8px; }
.partner-card .partner-logo img { max-height: 56px; width: auto; }
.partner-card .icon { margin: 0; }
.partner-strip { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--line); }
.partner-strip p { margin: 0; }

/* ---------- Placeholders ---------- */
.ph { background: repeating-linear-gradient(135deg, var(--paper-2), var(--paper-2) 12px, #ebe6dc 12px, #ebe6dc 24px); border: 1px dashed #cfc8ba; border-radius: var(--radius); display: grid; place-items: center; color: var(--grey); font-size: 14px; text-align: center; padding: 20px; min-height: 180px; }
.ph p { margin: 0; }
.ph.tall { min-height: 320px; }
.ph.small { min-height: 120px; }
.ph.shot { min-height: 140px; margin-bottom: 18px; }
.dark .ph { background: #1f1f1f; border-color: #444; color: #8a8680; }

/* ---------- Resources (datasyn/resources) ---------- */
.res-group { margin-bottom: 40px; }
.res-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.res { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: var(--white); border: 1px solid var(--line); border-radius: 10px; padding: 14px 18px; text-decoration: none; font-size: 15px; }
.res:hover { border-color: var(--red); }
.res small { font-size: 12px; font-weight: 700; color: var(--grey); background: var(--paper-2); padding: 3px 8px; border-radius: 6px; white-space: nowrap; }
.res-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.res-card { display: flex; flex-direction: column; background: var(--white); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; text-decoration: none; transition: border-color .15s, transform .15s; }
.res-card:hover { border-color: var(--red); transform: translateY(-2px); }
.res-cover { display: block; aspect-ratio: 16 / 10; background: var(--paper-2); overflow: hidden; }
.res-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.res-meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; font-size: 15px; font-weight: 600; }
.res-meta small, .res small { font-size: 12px; font-weight: 700; color: var(--grey); background: var(--paper-2); padding: 3px 8px; border-radius: 6px; white-space: nowrap; }
.card .wp-block-image.shot { margin: 0 0 18px; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.card .wp-block-image.shot img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; object-position: top left; }
.certs .wp-block-image { margin: 0; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: #fff; }
.certs .wp-block-image img { display: block; width: 100%; height: auto; }
.video-embed { margin: 0; border-radius: var(--radius); overflow: hidden; }
.tabs { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 28px; }
.tabs a { text-decoration: none; padding: 8px 18px; border-radius: 999px; border: 1px solid var(--line); background: var(--white); font-size: 15px; }
.tabs a:hover { border-color: var(--red); color: var(--red); }

/* ---------- Anchor nav ---------- */
.anchor-nav { position: sticky; top: var(--header-h); z-index: 40; background: var(--paper); border-bottom: 1px solid var(--line); }
.admin-bar .anchor-nav { top: calc(var(--header-h) + 32px); }
.anchor-nav p { display: flex; gap: 26px; overflow-x: auto; margin: 0; padding: 14px 0; }
.anchor-nav a { text-decoration: none; white-space: nowrap; font-weight: 600; font-size: 15px; color: var(--ink-2); }
.anchor-nav a:hover { color: var(--red); }

/* ---------- Details (certificates) ---------- */
.wp-block-details.certs { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); padding: 22px 28px; }
.wp-block-details.certs summary { cursor: pointer; font-weight: 700; }
.wp-block-details.certs > .grid { margin-top: 20px; }

/* ---------- Calendly ---------- */
.calendly-box { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; min-height: 520px; }
.calendly-box .calendly-inline-widget { min-width: 320px; height: 720px; }
.calendly-fallback { font-size: 14px; color: var(--grey); margin-top: 12px; }

/* ---------- Forms (Contact Form 7) ---------- */
.wpcf7 form { display: grid; gap: 16px; }
.wpcf7 form p { margin: 0; }
.wpcf7 .row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.wpcf7 label { font-size: 14px; font-weight: 600; display: block; }
.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"], .wpcf7 select, .wpcf7 textarea { width: 100%; margin-top: 6px; padding: 13px 14px; border: 1px solid #cfc8ba; border-radius: 10px; font: inherit; font-weight: 400; background: var(--white); }
.wpcf7 textarea { min-height: 130px; resize: vertical; }
.wpcf7 .wpcf7-acceptance label { font-weight: 400; color: var(--ink-2); display: flex; gap: 10px; }
.wpcf7 input[type="submit"] { justify-self: start; cursor: pointer; background: var(--red); color: #fff; border: 0; border-radius: 999px; padding: 14px 26px; font: inherit; font-weight: 700; }
.wpcf7 input[type="submit"]:hover { background: var(--red-dark); }
.wpcf7 .wpcf7-not-valid-tip { font-size: 13px; color: var(--red); }
.form-box { max-width: 760px; }

/* ---------- Footer ---------- */
.site-footer { background: var(--ink); color: #cfcac1; padding: 64px 0 28px; font-size: 15px; margin-top: 0; }
.site-footer .cols { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 32px; margin-bottom: 40px; }
.site-footer h4 { color: #fff; font-size: 14px; letter-spacing: .12em; text-transform: uppercase; margin: 0 0 14px; }
.site-footer p { margin: 0 0 6px; }
.site-footer a { text-decoration: none; color: #cfcac1; }
.site-footer a:hover { color: #fff; }
.site-footer .foot-logo { background: #fff; border-radius: 10px; padding: 6px 10px; display: inline-block; margin-bottom: 14px; line-height: 0; }
.site-footer .foot-logo img { height: 44px; width: auto; }
.site-footer .bottom { border-top: 1px solid #333; padding-top: 22px; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; font-size: 13px; }

/* ---------- Responsive ---------- */
@media (max-width: 980px) {
	.hero .hero-grid, .split, .split.wide-left, .split.contact, .cta-band { grid-template-columns: 1fr; }
	.g3, .g4, .team-full, .res-list { grid-template-columns: 1fr 1fr; }
	.res-cards { grid-template-columns: repeat(3, 1fr); }
	.stats, .steps, .steps.s3, .journey { grid-template-columns: 1fr 1fr; }
	.stack { grid-template-columns: 1fr 1fr; gap: 12px; }
	.stack-step, .stack-step:first-child, .stack-step:last-child { border-radius: var(--radius); }
	.stack-step::after, .step::after, .journey::before { display: none; }
	.team, .team.cols-3 { grid-template-columns: repeat(3, 1fr); }
	.site-footer .cols { grid-template-columns: 1fr 1fr; }
	.site-header .header-cta { display: none; }
	.hero-art { max-width: 420px; margin: 0 auto; }
}
@media (max-width: 640px) {
	body { font-size: 16px; }
	.ds-section { padding: 64px 0; }
	.wrap { padding-left: 16px; padding-right: 16px; }
	.g2, .g3, .g4, .team-full, .res-list, .compare, .wpcf7 .row { grid-template-columns: 1fr; }
	.res-cards { grid-template-columns: 1fr 1fr; }
	.steps, .steps.s3, .stack, .journey, .stats { grid-template-columns: 1fr; }
	.team, .team.cols-3 { grid-template-columns: repeat(2, 1fr); }
	.cta-band { padding: 36px 24px; }
	.site-footer .cols { grid-template-columns: 1fr; }
	.site-header .logo img { height: 44px; }
}

/* ------------------------------------------------------------------ Gallery + lightbox (BP: ds-gallery) */
.wp-block-gallery.has-nested-images.ds-gallery { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 0; }
.wp-block-gallery.has-nested-images.ds-gallery.single { grid-template-columns: 1fr; }
.wp-block-gallery.has-nested-images.ds-gallery figure.wp-block-image:not(#ds) { width: auto; margin: 0; display: block; position: static; }
.wp-block-gallery.has-nested-images.ds-gallery figure.wp-block-image:first-child { grid-column: 1 / -1; }
.wp-block-gallery.has-nested-images.ds-gallery figure.wp-block-image:not(#ds) img {
	display: block; width: 100%; height: auto; flex: none; cursor: zoom-in;
	border: 1px solid var(--line); border-radius: 12px; background: #fff;
	box-shadow: 0 10px 30px rgba(20, 20, 20, .08); transition: transform .2s ease, box-shadow .2s ease;
}
.wp-block-gallery.has-nested-images.ds-gallery figure.wp-block-image:not(#ds):not(:first-child) img { aspect-ratio: 16 / 10; object-fit: cover; object-position: top left; }
.wp-block-gallery.has-nested-images.ds-gallery figure.wp-block-image:not(#ds) img:hover,
.wp-block-gallery.has-nested-images.ds-gallery figure.wp-block-image:not(#ds) img:focus-visible { transform: translateY(-2px); box-shadow: 0 16px 40px rgba(20, 20, 20, .14); outline: none; }
.wp-block-gallery.has-nested-images.ds-gallery figure.wp-block-image:not(#ds) img:focus-visible { box-shadow: 0 0 0 3px var(--red); }
.wp-block-gallery.has-nested-images.ds-gallery figure.wp-block-image::before { display: none; }
.wp-block-gallery.has-nested-images.ds-gallery figure.wp-block-image figcaption {
	position: static; background: none; color: var(--grey); text-shadow: none; max-height: none; overflow: visible;
	font-size: 14px; line-height: 1.4; text-align: left; padding: 8px 2px 0; margin: 0;
}
.dark .wp-block-gallery.has-nested-images.ds-gallery figure.wp-block-image:not(#ds) img { border-color: rgba(255, 255, 255, .15); box-shadow: 0 20px 50px rgba(0, 0, 0, .4); }
.dark .wp-block-gallery.has-nested-images.ds-gallery figure.wp-block-image figcaption { color: #bdb9b0; }

.ds-lightbox { position: fixed; inset: 0; z-index: 1000; display: none; align-items: center; justify-content: center; background: rgba(12, 12, 12, .92); padding: 56px 72px; }
.ds-lightbox.open { display: flex; }
.ds-lightbox figure { margin: 0; max-width: 100%; max-height: 100%; display: flex; flex-direction: column; align-items: center; }
.ds-lightbox img { max-width: 100%; max-height: calc(100vh - 150px); object-fit: contain; border-radius: 8px; background: #fff; }
.ds-lightbox figcaption { color: #e8e5de; font-size: 15px; margin-top: 12px; text-align: center; }
.ds-lightbox button { position: absolute; border: 0; background: rgba(255, 255, 255, .12); color: #fff; width: 48px; height: 48px; border-radius: 50%; font-size: 26px; line-height: 1; cursor: pointer; }
.ds-lightbox button:hover, .ds-lightbox button:focus-visible { background: var(--red); outline: none; }
.ds-lightbox .ds-lb-close { top: 14px; right: 14px; }
.ds-lightbox .ds-lb-prev { left: 14px; top: 50%; transform: translateY(-50%); }
.ds-lightbox .ds-lb-next { right: 14px; top: 50%; transform: translateY(-50%); }
.ds-lightbox .ds-lb-count { position: absolute; top: 24px; left: 24px; color: #bdb9b0; font-size: 14px; }
.ds-lightbox.single .ds-lb-prev, .ds-lightbox.single .ds-lb-next, .ds-lightbox.single .ds-lb-count { display: none; }
@media (max-width: 780px) {
	.ds-lightbox { padding: 64px 12px 24px; }
	.ds-lightbox .ds-lb-prev, .ds-lightbox .ds-lb-next { top: auto; bottom: 14px; transform: none; }
}
.center .wp-block-buttons { justify-content: center; }
