/*
Theme Name: DIM Theme
Theme URI: https://datainmotion.co.th
Author: Data In Motion
Author URI: https://datainmotion.co.th
Description: ธีมบล็อก (Full Site Editing) สำหรับเว็บไซต์บริษัท ดาต้า อิน โมชั่น จำกัด รองรับการทำงานร่วมกับ Elementor
Version: 1.0.0
Requires at least: 6.5
Tested up to: 6.9
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dim-theme
Tags: full-site-editing, block-patterns, business, corporate, thai
*/

/* Keep footer links readable against the navy background. */
.dim-smooth-slider > .wp-block-columns::scroll-button(*),
.dim-smooth-slider .dim-slider-track::scroll-button(*) {
	content: none !important;
	display: none !important;
}
.dim-smooth-slider > .wp-block-columns,
.dim-smooth-slider .dim-slider-track {
	scroll-marker-group: none !important;
}
.dim-slide-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 3;
	width: 44px;
	height: 44px;
	border: 1px solid #e2e6ed;
	border-radius: 50%;
	background: #fff;
	color: #041978;
	box-shadow: 0 4px 16px #04197815;
	cursor: pointer;
	font: 24px/1 sans-serif;
}
.dim-slide-prev { left: 12px; }
.dim-slide-next { right: 12px; }
.dim-slide-arrow:disabled { opacity: .35; cursor: default; }
.dim-slide-arrow:not(:disabled):hover { background: #1e88e5; color: #fff; }
.dim-slide-dots { display: flex; justify-content: center; gap: 10px; margin: 22px auto 0; }
.dim-slide-dots button {
	width: 9px;
	height: 9px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: #1a1f2b;
	cursor: pointer;
	transition: width .25s ease, background-color .25s ease;
}
.dim-slide-dots button[aria-current="true"] { width: 26px; background: #1e88e5; }
.dim-slide-arrow:focus-visible, .dim-slide-dots button:focus-visible { outline: 2px solid #1e88e5; outline-offset: 4px; }

footer.wp-block-template-part a,
footer.wp-block-template-part a:visited,
footer.wp-block-template-part a:hover,
footer.wp-block-template-part a:focus {
	color: #ffffff;
}

/* Use one background for the full-width content sections. */
#service .dim-service-card {
	height: 100%;
	box-sizing: border-box;
	padding: 28px !important;
	border-radius: 20px !important;
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
#service > .wp-block-columns { gap: 24px; }
#service > .wp-block-columns + .wp-block-columns { margin-top: 24px !important; }
.dim-service-icon {
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	margin-bottom: 24px;
	border-radius: 16px;
	color: #0d47a1;
	background: #e8f1fb;
}
.dim-service-icon svg { width: 27px; height: 27px; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
	#service .dim-service-card:hover { transform: translateY(-5px); border-color: #1e88e5 !important; box-shadow: 0 14px 32px #04197812 !important; }
}
body:is(.home, .dim-section-page) :is(#products, #customers) .dim-brand-row { gap: 16px; padding-block: 12px; }
body:is(.home, .dim-section-page) :is(#products, #customers) .dim-brand-row figure.wp-block-image {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 144px;
	height: 96px;
	padding: 12px;
	box-sizing: border-box;
	flex: 0 0 144px;
	border-radius: 12px;
	background: #fff;
}
body:is(.home, .dim-section-page) :is(#products, #customers) .dim-brand-row img {
	width: 120px;
	height: 72px;
	max-width: 100%;
	object-fit: contain;
}
/* Customer marks need more room for names and detailed institutional seals. */
body:is(.home, .dim-section-page) #customers .dim-brand-row {
	max-width: 1120px;
	gap: 16px 20px;
	margin-inline: auto;
}
body:is(.home, .dim-section-page) #customers .dim-brand-row figure.wp-block-image {
	flex-basis: 180px;
	width: 180px;
	height: 116px;
	padding: 10px;
}
body:is(.home, .dim-section-page) #customers .dim-brand-row img {
	width: 156px;
	height: 94px;
}
body:is(.home, .dim-section-page) details.dim-acc > summary { display: block; padding-block: 22px; padding-right: 56px; }
body:is(.home, .dim-section-page) details.dim-acc > summary { position: relative; }
body:is(.home, .dim-section-page) details.dim-acc > summary::after { position: absolute; right: 24px; top: 28px; display: block; margin: 0; }
.dim-project-badges { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.dim-project-badges > span { padding: 4px 12px; background: #e8f1fb; color: #0d47a1; border-radius: 999px; font-size: 12px; font-weight: 500; line-height: 1.6; }
.dim-project-badges > span + span { background: #f6f8fb; color: #5b6472; }
.dim-project-caption { margin: 12px 4px 0 !important; color: #5b6472; font-size: 13px; line-height: 1.6; text-align: center; }
@media (max-width: 600px) {
	#service .dim-service-card { padding: 24px !important; }
	body:is(.home, .dim-section-page) :is(#products, #customers) .dim-brand-row { gap: 10px; }
	body:is(.home, .dim-section-page) :is(#products, #customers) .dim-brand-row figure.wp-block-image { flex-basis: 112px; width: 112px; height: 80px; padding: 10px; }
	body:is(.home, .dim-section-page) :is(#products, #customers) .dim-brand-row img { width: 92px; height: 60px; }
	body:is(.home, .dim-section-page) #customers .dim-brand-row { gap: 10px; }
	body:is(.home, .dim-section-page) #customers .dim-brand-row figure.wp-block-image { flex-basis: 138px; width: 138px; height: 96px; padding: 8px; }
	body:is(.home, .dim-section-page) #customers .dim-brand-row img { width: 120px; height: 78px; }
}

body:is(.home, .dim-section-page) {
	--dim-section-space: clamp(28px, 2.5vw, 44px);
}
body:is(.home, .dim-section-page) #works ~ :is(.wp-block-group, section) {
	padding-block: var(--dim-section-space) !important;
	scroll-margin-top: 100px;
}
/* The last panel already has its own padding; avoid adding its bottom margin
   to both sections' padding at every boundary. */
body:is(.home, .dim-section-page) #works ~ :is(.wp-block-group, section) > :last-child {
	margin-bottom: 0 !important;
}
body:is(.home, .dim-section-page) #works ~ :is(.wp-block-group, section) > :first-child {
	margin-top: 0 !important;
}
body:is(.home, .dim-section-page) #works ~ * h2.wp-block-heading {
	font-size: clamp(28px, 2.4vw, 40px);
	line-height: 1.3;
	margin-block: 12px 24px;
}
body:is(.home, .dim-section-page) #works ~ * h3.wp-block-heading {
	line-height: 1.4;
	margin-block: 0 16px;
}
#works .dim-hero-copy {
	padding-inline: clamp(16px, 2.2vw, 44px);
}
#works.dim-smooth-slider .dim-hero-copy { visibility: hidden; }
#works.dim-smooth-slider .dim-hero-copy.dim-copy-visible { visibility: visible; }
#works .dim-hero-copy > h3 {
	max-width: 22ch;
	margin-block: 0 24px;
	letter-spacing: -.025em;
	text-wrap: balance;
}
#works .dim-hero-copy > p { max-width: 58ch; margin-block: 0 24px; }
#works .dim-hero-copy .dim-hero-cta {
	display: inline-flex;
	align-items: center;
	min-height: 48px;
	padding: 10px 24px;
	border-radius: 999px;
	background: #041978;
	color: #fff;
	font-weight: 500;
	text-decoration: none;
	box-shadow: 0 6px 18px #04197818;
	transition: background-color .2s, box-shadow .2s;
}
#works .dim-hero-copy .dim-hero-cta:hover { background: #0d47a1; box-shadow: 0 8px 24px #04197828; }
#works .dim-hero-cta:focus-visible { outline: 3px solid #1e88e5; outline-offset: 4px; }
#works img.dim-fit-contain,
#works img.dim-hero-portrait { object-fit: contain; background: #f6f8fb; }
@media (max-width: 781px) {
	#works .dim-hero-copy { padding: 24px 8px 0; }
	#works .dim-hero-copy > h3 { font-size: 28px; margin-bottom: 16px; }
	#works .dim-hero-copy > p { font-size: 16px; line-height: 1.75; margin-bottom: 20px; }
}

main .wp-block-group.alignfull.has-surface-background-color,
main .wp-block-group.alignfull.has-sky-background-color {
	background-color: #ffffff !important;
}

/* Let the page content slide over the opening carousel. */
body:is(.home, .dim-section-page) #works.dim-slider ~ * {
	position: relative;
	z-index: 2;
	background-color: #ffffff !important;
	margin-block: 0 !important;
	/* A fading section also fades its background, exposing the sticky hero. */
	animation: none !important;
	opacity: 1 !important;
	transform: none !important;
}

@media (min-width: 782px) and (prefers-reduced-motion: no-preference) {
	body:is(.home, .dim-section-page) #works.dim-slider {
		position: sticky;
		top: var(--dim-header-height, 86px);
		z-index: 0;
		box-sizing: border-box;
		min-height: calc(100svh - var(--dim-header-height, 86px));
		padding-block: 28px !important;
		display: flex;
		flex-direction: column;
		justify-content: center;
		margin-block: 0;
	}

	body:is(.home, .dim-section-page) #works.dim-slider > .wp-block-columns {
		width: 94%;
		max-width: 1800px;
		flex-shrink: 0;
		margin-inline: auto;
	}

	body:is(.home, .dim-section-page) #works.dim-slider figure.wp-block-image img {
		height: clamp(380px, calc(100svh - 190px), 760px);
		max-height: none;
		border-radius: 14px !important;
	}

	body:is(.home, .dim-section-page) #works.dim-slider h3.wp-block-heading {
		font-size: clamp(30px, 2.3vw, 46px) !important;
		line-height: 1.25;
	}

	body:is(.home, .dim-section-page) #works.dim-slider p {
		font-size: clamp(16px, 1.05vw, 20px);
		line-height: 1.8;
	}

	body:is(.home, .dim-section-page) #works.dim-slider + * {
		box-shadow: 0 -18px 45px -30px rgba(4, 25, 120, 0.25);
	}
}

/* Consultation panel sits outside the sticky hero's content stack. */
.dim-consultation { position: relative; z-index: 2; margin: 0; padding: clamp(40px, 5vw, 80px) 24px; background: #e8f1fb; color: #041978; }
.dim-consultation-inner { max-width: 980px; margin-inline: auto; text-align: center; }
.dim-consultation-label { font-size: 12px; letter-spacing: .18em; font-weight: 600; color: #0d47a1; margin: 0 0 16px; }
.dim-consultation h2 { font-size: clamp(28px, 3vw, 44px); line-height: 1.3; margin: 0 0 20px; text-wrap: balance; }
.dim-consultation-inner > p:not(.dim-consultation-label) { max-width: 680px; margin: 0 auto 28px; color: #5b6472; line-height: 1.8; }
.dim-consultation-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.dim-consultation-actions a { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 24px; box-sizing: border-box; border: 1px solid #041978; border-radius: 999px; text-decoration: none; font-weight: 500; }
.dim-consultation-primary { background: #041978; color: #fff; }
.dim-consultation-phone { background: transparent; color: #041978; }
.dim-consultation-actions a:hover { background: #0d47a1; border-color: #0d47a1; color: #fff; }
.dim-consultation-actions a:focus-visible { outline: 3px solid #1e88e5; outline-offset: 4px; }
body:is(.home, .dim-section-page) #works ~ :is(.wp-block-group, section) { scroll-margin-top: calc(var(--dim-header-height, 86px) + 16px); }
@media (max-width: 781px) {
 header .dim-nav-center { flex-wrap: nowrap !important; justify-content: flex-start !important; gap: 4px; overflow-x: auto; max-width: 100%; min-width: 0; padding-block: 4px; overscroll-behavior-x: contain; scrollbar-width: none; }
 header .dim-nav-center::-webkit-scrollbar { display: none; }
 header .dim-nav-center > .wp-block-button { flex: 0 0 auto; }
 header .dim-nav-center .wp-element-button { min-height: 44px; box-sizing: border-box; display: inline-flex; align-items: center; white-space: nowrap; padding: 8px 14px !important; font-size: 14px; }
 header .dim-lang-toggle .wp-element-button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; }
 header .dim-logo-link img, header .custom-logo { max-width: 76px; height: auto; }
 header .wp-block-group.alignfull { padding-inline: 16px !important; gap: 8px; }
 body:is(.home, .dim-section-page) #works.dim-slider { padding: 20px 12px 28px !important; }
 #works.dim-slider > .wp-block-columns { width: 100%; max-width: 100%; }
 #works.dim-slider > .wp-block-columns > .wp-block-column > .wp-block-columns { padding-inline: 0 !important; gap: 0; }
 #works.dim-slider figure.wp-block-image img { height: clamp(240px, 72vw, 360px); aspect-ratio: auto; border-radius: 14px !important; }
 #works.dim-slider .dim-slide-arrow { top: clamp(140px, calc(36vw + 20px), 200px); width: 44px; height: 44px; }
 #works .dim-hero-copy { padding-inline: 8px; }
 #works .dim-hero-copy > h3 { font-size: clamp(24px, 6vw, 30px) !important; }
 .dim-slide-dots { gap: 4px; }
 .dim-slide-dots button, .dim-slide-dots button[aria-current="true"] { width: 28px; height: 28px; background: transparent; display: grid; place-items: center; }
 .dim-slide-dots button::after { content: ''; width: 8px; height: 8px; background: #1a1f2b; border-radius: 999px; }
 .dim-slide-dots button[aria-current="true"]::after { width: 22px; background: #1e88e5; }
 .dim-consultation { padding: 40px 20px; }
 .dim-consultation-actions { flex-direction: column; }
 .dim-consultation-actions a { width: 100%; }
 footer.wp-block-template-part p, footer.wp-block-template-part a { overflow-wrap: anywhere; }
}

/* Contact page: a focused form and a clear company information card. */
body.dim-contact-page main { padding: clamp(32px, 4vw, 64px) 24px 64px !important; background: linear-gradient(180deg, #f6f8fb, #fff 520px); }
body.dim-contact-page main > .wp-block-post-title,
body.dim-contact-page main > .entry-content { max-width: 1120px !important; margin-inline: auto !important; }
body.dim-contact-page main > .wp-block-post-title { color: #041978; font-size: clamp(36px, 4vw, 54px); line-height: 1.2; letter-spacing: -.025em; margin-bottom: 32px !important; }
body.dim-contact-page .entry-content > .wp-block-columns { max-width: none; gap: 32px; align-items: flex-start; }
body.dim-contact-page main .wp-block-columns,
body.dim-contact-page main .wp-block-column { animation: none !important; opacity: 1 !important; transform: none !important; }
body.dim-contact-page .entry-content > .wp-block-columns > .wp-block-column:first-child { flex-basis: 62% !important; padding: 32px; border: 1px solid #e2e6ed; border-radius: 24px; background: #fff; box-shadow: 0 8px 32px #04197808; box-sizing: border-box; }
body.dim-contact-page .entry-content > .wp-block-columns > .wp-block-column:last-child { flex-basis: 38% !important; }
body.dim-contact-page main h2 { color: #041978; font-size: clamp(24px, 2.5vw, 32px); line-height: 1.35; margin: 0 0 24px; }
body.dim-contact-page main h2::after { display: none !important; }
body.dim-contact-page main p { line-height: 1.8; }
body.dim-contact-page .wp-block-column:first-child > p { color: #5b6472; margin: 0 0 28px; font-size: 15px; }
body.dim-contact-page .wpcf7-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
body.dim-contact-page .wpcf7-form > p { grid-column: 1 / -1; margin: 0; min-width: 0; }
body.dim-contact-page .wpcf7-form > p:nth-of-type(1), body.dim-contact-page .wpcf7-form > p:nth-of-type(2) { grid-column: span 1; }
body.dim-contact-page .wpcf7-form label { display: block; color: #1a1f2b; font-size: 14px; font-weight: 500; }
body.dim-contact-page .wpcf7-form label > br { display: none; }
body.dim-contact-page .wpcf7-form-control-wrap { display: block; margin-top: 8px; }
body.dim-contact-page .wpcf7-form input:not([type='hidden']):not([type='submit']), body.dim-contact-page .wpcf7-form textarea { width: 100%; min-width: 0; box-sizing: border-box; border: 1px solid #d7deea; border-radius: 12px; padding: 12px 14px; min-height: 48px; background: #f9fbfe; color: #1a1f2b; font: inherit; font-size: 16px; transition: border-color .2s, box-shadow .2s; }
body.dim-contact-page .wpcf7-form textarea { height: 150px; min-height: 120px; resize: vertical; }
body.dim-contact-page .wpcf7-form input:focus-visible, body.dim-contact-page .wpcf7-form textarea:focus-visible { outline: none; border-color: #1e88e5; box-shadow: 0 0 0 3px #1e88e51f; background: #fff; }
body.dim-contact-page .wpcf7-form input[aria-invalid='true'], body.dim-contact-page .wpcf7-form textarea[aria-invalid='true'] { border-color: #c62828; }
body.dim-contact-page .wpcf7-submit { min-height: 48px; padding: 12px 28px; border: 0; border-radius: 999px; background: #041978; color: #fff; font: inherit; font-weight: 500; cursor: pointer; }
body.dim-contact-page .wpcf7-submit:hover { background: #0d47a1; }
body.dim-contact-page .wpcf7-submit:disabled { opacity: .6; cursor: wait; }
body.dim-contact-page .wpcf7-response-output { grid-column: 1 / -1; margin: 0 !important; border-radius: 12px; }
body.dim-contact-page .wpcf7-not-valid-tip { font-size: 13px; margin-top: 6px; }
body.dim-contact-page .wp-block-column:last-child > .has-sky-background-color { padding: 32px !important; border-radius: 24px !important; background: #e8f1fb !important; border: 1px solid #dce8f7; }
body.dim-contact-page main h3 { font-size: 22px; line-height: 1.5; color: #041978; margin: 0 0 20px; }
body.dim-contact-page .wp-block-column:last-child p { font-size: 15px; color: #5b6472; }
body.dim-contact-page main a { overflow-wrap: anywhere; text-underline-offset: 4px; }
body.dim-contact-page main a[href^='tel:'], body.dim-contact-page main a[href^='mailto:'] { display: inline-flex; align-items: center; min-height: 44px; color: #0d47a1; font-weight: 500; text-decoration: none; }
body.dim-contact-page main a:hover { text-decoration: underline; }
@media (max-width: 781px) {
 body.dim-contact-page main { padding: 28px 16px 40px !important; }
 body.dim-contact-page main > .entry-content { padding-inline: 0; }
 body.dim-contact-page .entry-content > .wp-block-columns { gap: 24px; }
 body.dim-contact-page .entry-content > .wp-block-columns > .wp-block-column:first-child,
 body.dim-contact-page .wp-block-column:last-child > .has-sky-background-color { padding: 24px !important; border-radius: 20px !important; }
 body.dim-contact-page .wpcf7-form { grid-template-columns: 1fr; gap: 18px; }
 body.dim-contact-page .wpcf7-form > p:nth-of-type(1), body.dim-contact-page .wpcf7-form > p:nth-of-type(2) { grid-column: 1 / -1; }
 body.dim-contact-page .wpcf7-submit { width: 100%; }
}
body.dim-contact-page .wpcf7-form-control-wrap[data-name='your-email'] { position: relative; }
body.dim-contact-page .wpcf7-form-control-wrap[data-name='your-email']::before { content: '@'; position: absolute; top: 12px; left: 14px; color: #0d47a1; font: 600 21px/28px sans-serif; pointer-events: none; }
body.dim-contact-page .wpcf7-form input[name='your-email'] { padding-left: 44px !important; }
body.dim-contact-page .wpcf7-form input::placeholder { color: #8793a8; font-weight: 400; }
.dim-email-help { display: block; margin-top: 8px; color: #5b6472; font-size: 12px; font-weight: 400; line-height: 1.6; }

/* Direct contact page replaces the form with real contact channels. */
body.dim-contact-page main > .wp-block-post-title { display: none; }
body.dim-contact-page .dim-direct-contact { max-width: 1120px; margin-inline: auto; }
.dim-direct-top { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; margin-bottom: 40px; }
.dim-direct-intro { padding: 20px 0; }
body.dim-contact-page .dim-direct-intro h1 { margin: 16px 0 24px; color: #041978; font-size: clamp(36px, 4vw, 56px); line-height: 1.23; letter-spacing: -.025em; text-wrap: balance; }
.dim-direct-eyebrow { color: #0d47a1; font-size: 12px; font-weight: 600; letter-spacing: .15em; margin: 0; }
body.dim-contact-page .dim-direct-lead { color: #5b6472; font-size: 18px; line-height: 1.85; max-width: 44ch; margin: 0 0 28px; }
.dim-direct-note { display: inline-block; padding-left: 14px; border-left: 3px solid #1e88e5; color: #5b6472; font-size: 14px; }
.dim-direct-channels { display: grid; gap: 20px; }
body.dim-contact-page a.dim-direct-channel { display: flex; align-items: center; gap: 20px; min-height: 160px; padding: 28px; border: 1px solid #e2e6ed; border-radius: 22px; background: #fff; color: #041978; text-decoration: none; box-shadow: 0 6px 24px #04197806; transition: border-color .2s, box-shadow .2s; }
body.dim-contact-page a.dim-direct-channel:hover { text-decoration: none; border-color: #1e88e5; box-shadow: 0 10px 28px #04197812; }
body.dim-contact-page a.dim-direct-channel:focus-visible { outline: 3px solid #1e88e5; outline-offset: 4px; }
.dim-direct-icon { display: grid; place-items: center; flex: 0 0 52px; width: 52px; height: 52px; background: #e8f1fb; border-radius: 16px; color: #0d47a1; }
.dim-direct-icon svg { width: 26px; height: 26px; }
.dim-direct-channel > span:nth-child(2) { min-width: 0; }
.dim-direct-label { display: block; color: #0d47a1; font-size: 12px; font-weight: 600; letter-spacing: .06em; margin: 0 0 8px; }
.dim-direct-channel strong { display: block; font-size: clamp(18px, 1.7vw, 24px); line-height: 1.45; font-weight: 600; overflow-wrap: anywhere; }
.dim-direct-hint { display: block; margin-top: 8px; color: #5b6472; font-size: 13px; font-weight: 400; }
.dim-direct-arrow { margin-left: auto; align-self: flex-start; color: #1e88e5; font-size: 22px; }
.dim-direct-location { display: grid; grid-template-columns: .85fr 1.15fr; overflow: hidden; border: 1px solid #dce8f7; border-radius: 24px; background: #e8f1fb; }
.dim-direct-address { padding: 36px; }
.dim-direct-address > .dim-direct-icon { background: #fff; margin-bottom: 24px; }
body.dim-contact-page .dim-direct-address h2 { font-size: 24px; margin: 12px 0 20px; line-height: 1.5; }
body.dim-contact-page .dim-direct-address > p:last-child { color: #5b6472; font-size: 15px; line-height: 1.9; margin-bottom: 0; }
.dim-direct-map { min-height: 360px; background: #dce8f7; }
.dim-direct-map iframe { display: block; width: 100%; height: 100%; min-height: 360px; border: 0; }
@media (max-width: 781px) {
 .dim-direct-top { grid-template-columns: 1fr; gap: 28px; margin-bottom: 28px; }
 .dim-direct-intro { padding: 0; }
 body.dim-contact-page .dim-direct-lead { font-size: 16px; }
 body.dim-contact-page a.dim-direct-channel { padding: 24px 20px; min-height: 136px; gap: 14px; }
 .dim-direct-channel strong { font-size: 18px; }
 .dim-direct-location { grid-template-columns: 1fr; }
 .dim-direct-address { padding: 28px 24px; }
 .dim-direct-map, .dim-direct-map iframe { min-height: 300px; }
}
@media (max-width: 380px) {
 .dim-direct-channel > .dim-direct-icon { flex-basis: 40px; width: 40px; height: 40px; border-radius: 12px; }
 .dim-direct-arrow { display: none; }
 .dim-direct-channel strong { font-size: 17px; }
}
/* Project navigation should clear the sticky header in both languages. */
#data-group-works { scroll-margin-top: calc(var(--dim-header-height, 86px) + 20px); animation: none !important; opacity: 1 !important; transform: none !important; }

/* Deep indigo gives the white DigiTech event logo sufficient contrast. */
.dim-aibox .wp-block-column.dim-col-logo {
	background: #21134f;
}

/* Readable introduction with the original three-column gallery arrangement. */
body.dim-aibox-page { background: #f6f8fb; }
body.dim-aibox-page main { padding-block: 0 !important; }
body.dim-aibox-page .entry-content > .wp-block-group:first-child {
 background: linear-gradient(135deg, #f0f3fb, #fff) !important;
 padding: 40px max(24px, calc((100vw - 1160px) / 2)) 36px !important;
 box-sizing: border-box;
}
body.dim-aibox-page .dim-head-row { margin: 0 0 24px !important; }
body.dim-aibox-page .dim-head-row > p:not(.dim-back) { color: #041978 !important; font-size: 17px !important; font-weight: 500; letter-spacing: .02em !important; }
body.dim-aibox-page .dim-back a { width: 52px; height: 52px; background: #041978; color: #fff; border-color: #041978; font-size: 25px; box-shadow: 0 4px 12px #04197820; }
body.dim-aibox-page .dim-back a:hover { background: #0d47a1; color: #fff; }
body.dim-aibox-page .dim-back a:focus-visible { outline: 3px solid #1e88e5; outline-offset: 4px; }
body.dim-aibox-page h1.wp-block-heading { color: #041978 !important; font-size: clamp(36px, 4.5vw, 56px) !important; line-height: 1.2 !important; margin: 0 0 24px !important; letter-spacing: -.025em; }
body.dim-aibox-page .entry-content > .wp-block-group:first-child > p { max-width: 800px; margin: 0 !important; color: #444f64 !important; font-size: 18px; line-height: 1.95; }
body.dim-aibox-page .dim-aibox {
 max-width: 1160px; width: calc(100% - 48px); margin: 0 auto !important;
 padding: 28px 0 48px !important; background: transparent !important;
}
body.dim-aibox-page .dim-aibox > .wp-block-columns {
 display: flex !important; flex-wrap: nowrap !important; gap: 6px !important; align-items: stretch;
}
body.dim-aibox-page .dim-aibox .dim-col-logo {
 padding: 24px; box-sizing: border-box;
 background: #21134f;
}
body.dim-aibox-page .dim-col-logo figure.wp-block-image { width: 320px; max-width: 80%; }
body.dim-aibox-page .dim-col-logo figure.wp-block-image img { width: 100%; max-width: 100%; margin: 0; height: auto; }
body.dim-aibox-page .dim-aibox .wp-block-column { gap: 6px !important; min-width: 0; }
body.dim-aibox-page .dim-aibox figure.wp-block-image { overflow: hidden; border-radius: 0; }
body.dim-aibox-page .dim-aibox .dim-col-tall img { height: 400px; }
body.dim-aibox-page .dim-aibox .dim-col-short img { height: 240px; }
body.dim-aibox-page .dim-aibox,
body.dim-aibox-page .dim-aibox .wp-block-column { animation: none !important; opacity: 1 !important; transform: none !important; }
@media (max-width: 900px) {
 body.dim-aibox-page .dim-aibox > .wp-block-columns { flex-wrap: wrap !important; }
}
@media (max-width: 600px) {
 body.dim-aibox-page .entry-content > .wp-block-group:first-child { padding: 24px 20px 28px !important; }
 body.dim-aibox-page .entry-content > .wp-block-group:first-child > p { font-size: 16px; line-height: 1.85; }
 body.dim-aibox-page .dim-aibox { width: calc(100% - 32px); padding-top: 20px !important; }
 body.dim-aibox-page .dim-aibox .dim-col-logo { min-height: 180px; }
}

/* CAT / C smart Wi-Fi case study. */
body.dim-works-page { background: #f6f8fb; }
body.dim-works-page main { padding-block: 0 !important; }
body.dim-works-page .entry-content > .wp-block-group:first-child {
 background: linear-gradient(135deg, #f0f3fb, #fff) !important;
 padding: 36px max(24px, calc((100vw - 980px) / 2)) 40px !important;
 box-sizing: border-box;
}
body.dim-works-page .dim-head-row { gap: 24px !important; margin: 0 0 32px !important; }
body.dim-works-page .dim-back a { width: auto; min-height: 50px; height: auto; padding: 10px 20px; box-sizing: border-box; gap: 12px; background: #041978; border-color: #041978; color: #fff; font-size: 16px; font-weight: 500; }
body.dim-works-page .dim-back a > span:first-child { font-size: 22px; }
body.dim-works-page .dim-back a:hover { background: #0d47a1; color: #fff; }
body.dim-works-page .dim-back a:focus-visible { outline: 3px solid #1e88e5; outline-offset: 4px; }
body.dim-works-page .dim-head-row figure { background: #fff; padding: 10px 16px; border: 1px solid #e2e6ed; border-radius: 12px; }
body.dim-works-page .dim-head-row figure img { width: 112px !important; height: auto; display: block; }
body.dim-works-page h1.wp-block-heading { color: #041978 !important; font-size: clamp(28px, 3vw, 40px) !important; line-height: 1.5 !important; margin: 0 0 24px !important; letter-spacing: -.015em; text-wrap: balance; }
body.dim-works-page .entry-content > .wp-block-group:first-child > p { font-size: 15px !important; color: #5b6472 !important; margin: 0; line-height: 1.8; }
body.dim-works-page .dim-article { padding: 40px 24px 56px !important; background: #fff !important; }
body.dim-works-page .dim-article > p { max-width: 780px; margin: 0 auto 28px !important; text-align: left; text-indent: 0; font-size: 18px; line-height: 1.95; color: #364156; }
body.dim-works-page .dim-article > p.dim-lead { font-size: 20px; color: #1a1f2b; line-height: 1.9; margin-bottom: 36px !important; }
body.dim-works-page .dim-article figure.wp-block-image { max-width: 980px; margin: 32px auto !important; }
body.dim-works-page .dim-article figure.wp-block-image img { box-shadow: 0 8px 28px #04197810; border-radius: 16px; }
body.dim-works-page .dim-article figure figcaption { font-size: 14px; color: #5b6472; line-height: 1.7; margin: 12px 8px 0; }
body.dim-works-page .dim-chips { max-width: 780px; margin: 28px auto !important; gap: 8px; }
body.dim-works-page .dim-chips .wp-element-button { padding: 7px 14px; font-size: 13px; border-radius: 999px; }
body.dim-works-page .dim-callout { max-width: 780px; padding: 28px !important; margin: 32px auto !important; box-sizing: border-box; }
body.dim-works-page .dim-callout p { margin: 0; font-size: 19px !important; line-height: 1.9 !important; text-align: left; text-indent: 0; }
body.dim-works-page .dim-article,
body.dim-works-page .dim-article > * { animation: none !important; opacity: 1 !important; transform: none !important; }
@media (max-width: 600px) {
 body.dim-works-page .entry-content > .wp-block-group:first-child { padding: 24px 20px 28px !important; }
 body.dim-works-page .dim-head-row { gap: 12px !important; }
 body.dim-works-page .dim-back a { padding: 10px 14px; font-size: 14px; }
 body.dim-works-page .dim-head-row figure { padding: 8px 12px; }
 body.dim-works-page .dim-head-row figure img { width: 88px !important; }
 body.dim-works-page .dim-article { padding: 28px 20px 40px !important; }
 body.dim-works-page .dim-article > p { font-size: 16px; line-height: 1.9; margin-bottom: 24px !important; }
 body.dim-works-page .dim-article > p.dim-lead { font-size: 18px; }
 body.dim-works-page .dim-callout { padding: 20px !important; }
 body.dim-works-page .dim-callout p { font-size: 17px !important; }
}

/* Shared masthead for case-study and gallery detail pages. */
body.dim-works-page .dim-head-row,
body.dim-aibox-page .dim-head-row { gap: 16px !important; min-height: 52px; margin-bottom: 28px !important; }
body.dim-works-page .dim-back { display: flex; align-items: center; gap: 16px; }
body.dim-works-page .dim-back a,
body.dim-aibox-page .dim-back a { display: inline-flex; justify-content: center; align-items: center; width: 52px; min-width: 52px; height: 52px; min-height: 52px; padding: 0; border-radius: 50%; background: #041978; border: 1px solid #041978; color: #fff; font-size: 25px; box-sizing: border-box; }
body.dim-works-page .dim-back a > span:first-child { font-size: 25px; }
body.dim-works-page .dim-case-category,
body.dim-aibox-page .dim-head-row > p:not(.dim-back) { color: #041978 !important; font-size: 17px !important; font-weight: 500; letter-spacing: .02em !important; line-height: 1.5; }
body.dim-works-page .dim-head-row figure { margin-left: auto !important; background: transparent; border: 0; border-left: 1px solid #dce2ef; border-radius: 0; padding: 4px 0 4px 20px; }
body.dim-works-page .dim-head-row figure img { width: 96px !important; }
@media (max-width: 600px) {
 body.dim-works-page .dim-head-row,
 body.dim-aibox-page .dim-head-row { gap: 12px !important; flex-wrap: wrap !important; }
 body.dim-works-page .dim-back { gap: 12px; }
 body.dim-works-page .dim-case-category,
 body.dim-aibox-page .dim-head-row > p:not(.dim-back) { font-size: 15px !important; }
 body.dim-works-page .dim-head-row figure { padding-left: 12px; }
 body.dim-works-page .dim-head-row figure img { width: 72px !important; }
}
body.dim-section-page .entry-content > :is(div,section)[id] { padding-block: clamp(28px, 3vw, 48px) !important; scroll-margin-top: calc(var(--dim-header-height, 86px) + 16px); }
body.dim-section-page main h1.wp-block-heading { font-size: clamp(28px, 2.5vw, 40px); line-height: 1.35; color: #041978; }