/*
Theme Name: DMD Brand
Description: Custom theme of Diana Muza's site (formerly dmdbrand.com, later dianamuza.com). Replaces Oberon, WPBakery and Slider Revolution. Front page built from custom blocks in the block editor. Values measured on the old site.
Version: 1.0.0
Author: WWC
Text Domain: dianamuza
Requires at least: 6.5
Requires PHP: 8.0
*/

/* ---------- Icon fonts (subsets of free fonts: Font Awesome 4 / SIL OFL, Elegant Icons / MIT, Linearicons Free / CC BY-SA 4.0) ---------- */
@font-face { font-family: "dmd-fa"; src: url("fonts/dmd-fa.woff2") format("woff2"); font-display: block; }
@font-face { font-family: "dmd-elegant"; src: url("fonts/dmd-elegant.woff2") format("woff2"); font-display: block; }
@font-face { font-family: "dmd-lnr"; src: url("fonts/dmd-lnr.woff2") format("woff2"); font-display: block; }

.dmd-i { display: inline-block; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; text-rendering: auto; -webkit-font-smoothing: antialiased; }
/* Font on the element itself (not only the glyph), so the icon font sets the line height as before */
.dmd-i-right, .dmd-i-play { font-family: "dmd-fa"; }
.dmd-i-pin, .dmd-i-phone, .dmd-i-monitor, .dmd-i-instagram, .dmd-i-up, .dmd-i-arrow-l, .dmd-i-arrow-r { font-family: "dmd-elegant"; }
.dmd-i-diamond { font-family: "dmd-lnr"; }
.dmd-i-right::before { content: "\f105"; }
.dmd-i-play::before { content: "\f04b"; }
.dmd-i-pin::before { content: "\e01d"; }
.dmd-i-phone::before { content: "\e00b"; }
.dmd-i-monitor::before { content: "\e00e"; }
.dmd-i-instagram::before { content: "\e09a"; }
.dmd-i-up::before { content: "\36"; }
.dmd-i-arrow-l::before { content: "\23"; }
.dmd-i-arrow-r::before { content: "\24"; }
.dmd-i-diamond::before { content: "\e845"; }

/* ---------- Basics ---------- */
:root {
	--pink: #f2a8ac;
	--dark: #4b4b55;
	--text: #81818b;
	--line: #c7c7c9;
	--grid-width: 1300px;
}
@media (max-width: 1440px) { :root { --grid-width: 1100px; } }
@media (max-width: 1200px) { :root { --grid-width: 950px; } }
@media (max-width: 1024px) { :root { --grid-width: 768px; } }
@media (max-width: 768px) { :root { --grid-width: 600px; } }
@media (max-width: 600px) { :root { --grid-width: calc(100% - 60px); } }
@media (max-width: 480px) { :root { --grid-width: calc(100% - 50px); } }
@media (max-width: 320px) { :root { --grid-width: 95%; } }

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
	font-family: "Open Sans", sans-serif;
	font-size: 15px;
	line-height: 26px;
	font-weight: 400;
	color: var(--text);
	text-align: left;
	background-color: #f9f9f9;
	overflow-x: hidden;
	/* As on the old site (Oberon body rule): grayscale smoothing on macOS. Without it Safari and Chrome on a Mac
	   draw the text with subpixel smoothing and it looks bolder. No effect on Windows and Linux. */
	-webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; border: 0; }
p { margin: 0 0 25px; }
h2 {
	margin: 0;
	font-family: Montserrat, sans-serif;
	font-size: 38px;
	line-height: 1.27777778em;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--dark);
}
h4 {
	margin: 0;
	font-family: Montserrat, sans-serif;
	font-size: 16px;
	line-height: 26px;
	font-weight: 700;
	text-transform: uppercase;
	color: var(--dark);
}
.dmd-center { text-align: center; }

.dmd-page { position: relative; overflow-x: clip; background-color: #f9f9f9; }
.dmd-content { position: relative; background-color: #f8f8f8; }

/* ---------- Desktop header ---------- */
.dmd-header { position: absolute; top: 0; left: 0; width: 100%; z-index: 110; }
.dmd-header-bar,
.dmd-sticky-bar { display: flex; align-items: center; justify-content: space-between; height: 75px; padding: 0 37px 0 41px; }
.dmd-logo { display: block; height: 50px; }
.dmd-logo img { display: block; height: 50px; width: auto; max-width: none; }
.dmd-main-nav { height: 100%; min-width: 0; margin-left: 4px; }
.dmd-nav { display: flex; height: 100%; margin: 0; padding: 0; list-style: none; }
.dmd-nav-item { position: relative; height: 100%; }
/* Gap of up to 100 px before the language item (owner's wish of 2026-11-05, first 70, then 30 more): the menu items sit 100 px further left,
   the language item keeps its place. When space runs short only the gap shrinks, so the width below which the
   ☰ menu shows stays the same (window.dmdCheckMenu in header.php leaves the gap out). */
.dmd-nav > .dmd-nav-item { flex-shrink: 0; }
.dmd-nav > .dmd-lang { order: 2; }
.dmd-nav::after { content: ""; order: 1; flex: 0 1 auto; width: 100px; min-width: 0; }
.dmd-nav-item > a {
	display: flex;
	align-items: center;
	height: 100%;
	padding: 0 13px;
	font-family: Montserrat, sans-serif;
	font-size: 13px;
	line-height: 1.2em;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #fff;
	transition: color .15s ease-out;
}
.dmd-header .dmd-nav-item:hover > a { color: var(--dark); }

/* Dropdown menu */
.dmd-sub {
	position: absolute;
	top: 100%;
	left: -13px;
	z-index: 10;
	visibility: hidden;
	opacity: 0;
	transform: translateY(30px);
	transition: transform .3s, opacity .3s;
}
.dmd-nav-item:hover .dmd-sub { transform: translateY(0); }
.dmd-sub.is-open { visibility: visible; opacity: 1; }
.dmd-sub ul { display: inline-block; vertical-align: middle; margin: 0; padding: 10px 0 13px; list-style: none; background-color: #fff; }
.dmd-sub li { display: block; width: 240px; }
.dmd-sub a {
	position: relative;
	left: 0;
	display: block;
	margin: 0 10px;
	padding: 14.84375px 19px 14px;
	font-family: Montserrat, sans-serif;
	font-size: 12px;
	line-height: 16px;
	font-weight: 400;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--text);
	border-bottom: 1px solid transparent;
	overflow: hidden;
	transition: color .15s ease-out, left .2s ease-out;
}
.dmd-sub li:last-child a { border-bottom: 0; }
.dmd-sub a:hover { color: var(--pink); }

/* Sticky bar */
.dmd-sticky { position: fixed; top: 0; left: 0; width: 100%; height: 64px; z-index: 100; transform: translateY(-100%); transition: transform .33s ease; }
.dmd-sticky.is-visible { transform: translateY(0); }
.dmd-sticky-bar { height: 100%; background-color: #fff; }
.dmd-sticky .dmd-nav-item > a { color: var(--dark); }
.dmd-sticky .dmd-nav-item:hover > a { color: var(--pink); }

/* ---------- Mobile header ---------- */
.dmd-mobile-header { display: none; position: relative; z-index: 101; }
.dmd-mobile-header-inner { position: relative; height: 100px; background-color: #fff; }
.dmd-mobile-header-grid { position: relative; width: var(--grid-width); height: 100%; margin: 0 auto; }
.dmd-mobile-opener { position: relative; z-index: 2; float: left; display: flex; align-items: center; height: 100%; padding-right: 10px; font-size: 15px; color: #000; }
.dmd-mobile-opener:hover { color: var(--pink); }
/* Animated burger: same size and position as the old \f0c9 glyph (measured: bars 12.875 x 2.125 px with
   .375 px round corners, tops at 45.25, 49.625 and 53.875 px in the 100 px header).
   Open: the middle bar fades out, the top and bottom bars turn around their left ends until the right ends
   meet in an X; angle = asin(8.625 / 12.875) = 42.06 deg, so both bars cross exactly at their middles.
   Closing runs the same transition backwards.
   Layout boxes are rounded to whole pixels, transforms are not: the box is 16 px high (starts at a whole
   pixel), the bars are 13 x 2 px and get their exact place and size from translateY and scale. */
.dmd-burger { position: relative; display: block; width: 13px; height: 16px; }
.dmd-burger > span { position: absolute; top: 0; left: 0; width: 13px; height: 2px; border-radius: .35px; background-color: currentColor; transform-origin: 0 50%; transition: transform .3s ease-in-out, opacity .3s ease-in-out; }
.dmd-burger > span:nth-child(1) { transform: translateY(3.3125px) rotate(0) scale(.990385, 1.0625); }
.dmd-burger > span:nth-child(2) { transform: translateY(7.6875px) scale(.990385, 1.0625); }
.dmd-burger > span:nth-child(3) { transform: translateY(11.9375px) rotate(0) scale(.990385, 1.0625); }
.dmd-mobile-opener.is-open .dmd-burger > span:nth-child(1) { transform: translateY(3.3125px) rotate(42.06deg) scale(.990385, 1.0625); }
.dmd-mobile-opener.is-open .dmd-burger > span:nth-child(2) { opacity: 0; }
.dmd-mobile-opener.is-open .dmd-burger > span:nth-child(3) { transform: translateY(11.9375px) rotate(-42.06deg) scale(.990385, 1.0625); }
@media (prefers-reduced-motion: reduce) { .dmd-burger > span { transition: none; } }
.dmd-mobile-logo { position: absolute; top: 10px; left: calc(50% - 40px); display: block; height: 80px; }
.dmd-mobile-logo img { display: block; height: 80px; width: auto; max-width: none; }
.dmd-mobile-nav { display: none; overflow: hidden; background-color: #fff; }
.dmd-mobile-nav-grid { width: var(--grid-width); margin: 0 auto; }
.dmd-mobile-nav ul { margin: 0; padding: 0; list-style: none; }
.dmd-mobile-nav li { position: relative; }
.dmd-mobile-nav a {
	display: block;
	position: relative;
	padding: 9px 0;
	font-family: Montserrat, sans-serif;
	font-size: 12px;
	line-height: 17px;
	font-weight: 400;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--text);
	border-bottom: 1px solid var(--line);
}
.dmd-mobile-nav a:hover { color: var(--pink); }
.dmd-mobile-nav-grid > ul > li > a { font-size: 13px; font-weight: 700; }
.dmd-mobile-nav-grid > ul > li:last-child:not(.is-open) > a { border-bottom: 0; }
.dmd-mobile-sub { display: none; overflow: hidden; margin-left: 20px !important; padding-left: 15px !important; }
.dmd-mobile-arrow { position: absolute; top: 0; right: 0; width: 50px; height: 35px; padding-right: 10px; line-height: 35px; text-align: right; cursor: pointer; }
.dmd-mobile-arrow.is-placed { right: auto; width: auto; padding: 0 15px; text-align: left; } /* left set by js/dmd.js: 50 px after the text */
.dmd-mobile-arrow .dmd-i { transition: transform .2s ease-in-out; }
.has-sub.is-open > .dmd-mobile-arrow .dmd-i { transform: rotate(90deg); }
.dmd-mobile-header.is-animated .dmd-mobile-header-inner { position: fixed; top: 0; left: 0; width: 100%; transform: translateY(-100%); }
.dmd-mobile-header.is-animated.is-visible .dmd-mobile-header-inner { transform: translateY(0); transition: transform .4s ease-in-out; }

/* ---------- Language switcher (inc/languages.php) ---------- */
/* Desktop: last menu item; the dropdown opens to the left so it stays inside the window. */
.dmd-lang .dmd-sub { left: auto; right: 0; }
.dmd-lang .dmd-sub li { width: auto; min-width: 100px; }
/* Phone: current code at the right of the header; a tap shows the other codes one after another, top to bottom. */
.dmd-lang-mobile { position: relative; z-index: 2; float: right; display: flex; align-items: center; height: 100%; }
.dmd-lang-current,
.dmd-lang-list a {
	display: block;
	font-family: Montserrat, sans-serif;
	font-size: 13px;
	line-height: 17px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #000;
}
.dmd-lang-current { padding: 12px 0 12px 12px; transition: color .15s ease-out; }
.dmd-lang-current:hover,
.dmd-lang-mobile.is-open .dmd-lang-current { color: var(--pink); }
.dmd-lang-list { position: absolute; top: calc(50% + 20px); right: -12px; margin: 0; padding: 0; list-style: none; visibility: hidden; transition: visibility 0s .4s; }
.dmd-lang-mobile.is-open .dmd-lang-list { visibility: visible; transition: none; }
.dmd-lang-list li { opacity: 0; transform: translateY(-8px); transition: opacity .2s ease-out, transform .2s ease-out; transition-delay: calc((3 - var(--i, 0)) * 40ms); }
.dmd-lang-mobile.is-open .dmd-lang-list li { opacity: 1; transform: translateY(0); transition-delay: calc(var(--i, 0) * 90ms); }
.dmd-lang-list a { min-width: 48px; padding: 9px 12px; text-align: center; background-color: #fff; border-bottom: 1px solid var(--line); box-shadow: 0 6px 12px -6px rgba(0, 0, 0, .18); }
.dmd-lang-list li:last-child a { border-bottom: 0; }
.dmd-lang-list a:hover { color: var(--pink); }
@media (prefers-reduced-motion: reduce) { .dmd-lang-list, .dmd-lang-list li { transition: none !important; } }

@media (max-width: 1024px) {
	.dmd-header, .dmd-sticky { display: none; }
	.dmd-mobile-header { display: block; }
}
/* New (bug of the old site fixed): if the menu does not fit on one line, use the ☰ menu as on phones */
.dmd-nav-item > a { white-space: nowrap; }
.dmd-narrow .dmd-header, .dmd-narrow .dmd-sticky { display: none; }
.dmd-narrow .dmd-mobile-header { display: block; }

/* ---------- Slider ---------- */
.dmd-slider { position: relative; width: 100%; height: 100vh; overflow: hidden; background-color: transparent; }
.dmd-slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; z-index: 1; }
.dmd-slide.is-active { z-index: 3; }
.dmd-slide.is-previous { z-index: 2; opacity: 1; }
.dmd-slide-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; }
.dmd-layer { position: absolute; top: 0; left: 0; opacity: 0; white-space: nowrap; will-change: transform, opacity; }
.dmd-layer-rotate img { display: block; width: 100%; height: 100%; max-width: none; }
.dmd-layer-text { font-family: Montserrat, sans-serif; font-weight: 700; text-transform: uppercase; color: #fff; }
.dmd-shadow { text-shadow: 1px 1px 3px rgba(0, 0, 0, .25); }
.dmd-layer-button { font-family: Roboto, sans-serif; font-weight: 500; color: #fff; text-align: center; border: 1px solid rgba(255, 255, 255, .35); transition: border-color .3s ease-in-out; }
.dmd-layer-button:hover { border-color: rgba(255, 255, 255, .75); }
.dmd-arrow { position: absolute; top: 50%; z-index: 100; display: block; width: 30px; height: 30px; font-size: 30px; line-height: 30px; color: #fff; text-align: center; transition: left .15s ease-in-out; }
.dmd-arrow .dmd-i { display: block; line-height: 30px; }
.dmd-arrow-left { left: 15px; transform: translate(20px, -50%); }
.dmd-arrow-right { left: calc(100% - 15px); transform: translate(-50px, -50%); }
.dmd-arrow-left:hover { left: 9px; }
.dmd-arrow-right:hover { left: calc(100% - 9px); }
.dmd-bullets { position: absolute; bottom: 20px; left: 50%; z-index: 100; height: 10px; transform: translateX(-50%); }
.dmd-bullet { position: absolute; top: 0; width: 10px; height: 10px; margin: 0 4px; background-color: var(--pink); cursor: pointer; transition: background-color .15s ease-out; }
.dmd-bullet.is-active, .dmd-bullet:hover { background-color: #fff; }
@media (max-width: 1024px) { .dmd-arrow { display: none; } }

/* ---------- Sections ---------- */
/* The row is 30 px wider than the window; percentage content widths refer to this width (as before). */
.dmd-row { position: relative; margin: 0 -15px; padding: 0; background-repeat: no-repeat; background-position: 0 0; }
.dmd-bg-white { background-color: #fff; }
.dmd-inner { position: relative; width: var(--grid-width); margin: 0 auto; }
.dmd-column { margin: 0 -15px; padding: 0 15px; }
.dmd-space { display: block; }
.dmd-space-large { height: 140px; }
.dmd-space-about { height: 140px; }
.dmd-only-small { display: none; }
@media (max-width: 1199px) {
	.dmd-only-large { display: none; }
	.dmd-only-small { display: block; }
}
@media (max-width: 768px) {
	.dmd-space-large { height: 100px; }
	.dmd-space-about { height: 50px; }
}
@media (max-width: 320px) {
	.dmd-column { margin: 0; }
}

/* About */
.dmd-about { background-size: cover; background-position: center; }
/* Background modes of the "Section" block: top left (default), cover (like About), tiled (like the icons) */
.dmd-bg-cover { background-size: cover; background-position: center; }
.dmd-bg-tile { background-repeat: repeat; }
.dmd-two { display: table; width: 100%; table-layout: fixed; }
.dmd-two-cell { display: table-cell; width: 50%; vertical-align: middle; }
.dmd-two-left .dmd-two-padding { padding: 0 15% 0 25%; }
.dmd-two-right .dmd-two-padding { padding: 0 0 0 5%; }
@media (min-width: 1024px) and (max-width: 1280px) {
	.dmd-two-left .dmd-two-padding { padding: 0 5% 0 15%; }
}
@media (min-width: 768px) and (max-width: 1024px) {
	.dmd-two-left .dmd-two-padding { padding: 0 5% 0 15%; }
}
@media (max-width: 768px) {
	.dmd-two, .dmd-two-cell { display: block; width: 100%; }
}
@media (min-width: 600px) and (max-width: 768px) {
	.dmd-two-left .dmd-two-padding { padding: 0 16% 40px 16%; }
	.dmd-two-right .dmd-two-padding { padding: 50px 16% 0 16%; }
}
@media (min-width: 480px) and (max-width: 600px) {
	.dmd-two-left .dmd-two-padding { padding: 0 30px 15px 30px; }
	.dmd-two-right .dmd-two-padding { padding: 35px 30px 0 30px; }
}
@media (max-width: 480px) {
	.dmd-two-left .dmd-two-padding { padding: 70px 20px 15px 20px; }
	.dmd-two-right .dmd-two-padding { padding: 35px 20px 0 20px; }
}
.dmd-image-card { position: relative; overflow: hidden; box-shadow: 0 6px 24px rgba(0, 0, 0, .09); transition: all .3s; }
.dmd-image-card img { display: block; vertical-align: middle; }
.dmd-image-card::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 100; background-color: rgba(255, 255, 255, .06); opacity: 0; transition: opacity .2s; }
.dmd-image-card:hover { transform: translateY(-15px); box-shadow: 0 10px 30px rgba(0, 0, 0, .15); }
.dmd-image-card:hover::after { opacity: 1; }
.dmd-text p:last-child { margin-bottom: 0; }
.dmd-button {
	display: inline-block;
	vertical-align: middle;
	padding: 17px 44px;
	font-family: Montserrat, sans-serif;
	font-size: 13px;
	line-height: 1.4em;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--dark);
	background-color: transparent;
	border: 1px solid #a4a4ab;
	transition: color .15s ease-out, background-color .15s ease-out, border-color .15s ease-out;
}
.dmd-button span { display: table-cell; vertical-align: middle; }
.dmd-button:hover { color: #fff; background-color: var(--pink); border-color: var(--pink); }

/* Honeypot field of the forms (inc/form-guard.php): off the screen, never shown */
.dmd-guard-field { position: absolute !important; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* Image grid */
/* Visible at once (owner's wish of 2026-11-04): the old fade-in waited for every image of the grid,
   and with lazy loading that hid whole grids while scrolling. Each image now shows as soon as it is loaded. */
.dmd-grid { position: relative; }
.dmd-tile { position: absolute; top: 0; left: 0; overflow: hidden; }
.dmd-tile-image { position: relative; height: 100%; overflow: hidden; }
.dmd-tile-zoom { height: 100%; transform: rotate(.01deg) scale(1.005); transition: all .3s ease-in-out; }
.dmd-tile:hover .dmd-tile-zoom { transform: scale(1.1); }
.dmd-tile img { display: block; width: 100%; height: auto; max-width: 100%; vertical-align: top; }
.dmd-tile-link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; cursor: pointer; }
@supports (-moz-appearance: none) { .dmd-tile { transform: scale(1.01); } }

/* Video */
.dmd-video-row { background-image: none; }
.dmd-video-field { padding: 250px 50px; background-size: cover; background-position: 0 0; background-repeat: no-repeat; }
.dmd-play { display: block; width: 65px; height: 65px; margin: 0 auto; font-size: 30px; line-height: 65px; color: var(--pink); }
.dmd-play-ring { position: relative; display: block; width: 100%; height: 100%; border: 3px solid var(--pink); border-radius: 50%; color: var(--pink); transition: background-color .15s ease, color .15s ease; }
.dmd-play-ring:hover { background-color: var(--pink); color: #fff; }
.dmd-play-ring .dmd-i { position: absolute; top: 50%; left: calc(50% + 4px); line-height: 30px; transform: translate(-50%, -50%); }

/* Icons */
.dmd-icons-row { background-repeat: repeat; }
.dmd-icons-gap { height: 30px; }
.dmd-icons { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.dmd-icon { width: 25%; padding: 0 15px 55px; text-align: center; }
.dmd-icon-circle { display: inline-block; width: 104px; height: 104px; margin-bottom: 23px; vertical-align: middle; border: 2px solid var(--line); border-radius: 50%; overflow: hidden; transition: background-color .15s ease-in-out, border-color .15s ease-in-out; }
.dmd-icon-circle:hover { border-color: var(--pink); }
.dmd-icon-element { display: inline-block; width: 100px; line-height: 100px; transition: transform .5s cubic-bezier(.6, 0, .26, .99), opacity .2s; }
.dmd-icon-element img { height: 35px; width: auto; vertical-align: middle; }
.dmd-icon-element:first-child { filter: invert(66%) sepia(100%) saturate(0%) hue-rotate(323deg) brightness(97%) contrast(97%); }
.dmd-icon-element:last-child { filter: invert(70%) sepia(29%) saturate(384%) hue-rotate(308deg) brightness(98%) contrast(99%); opacity: 0; }
.dmd-icon-circle:hover .dmd-icon-element { transform: translateY(-100%); }
.dmd-icon-circle:hover .dmd-icon-element:first-child { opacity: 0; }
.dmd-icon-circle:hover .dmd-icon-element:last-child { opacity: 1; }
.dmd-icon-font { position: relative; line-height: 100px; text-align: center; }
.dmd-icon-font .dmd-i { display: block; font-size: 35px; line-height: 100px; color: var(--line); transition: transform .5s cubic-bezier(.6, 0, .26, .99), opacity .2s, color .05s ease-out; }
.dmd-icon-font .dmd-i + .dmd-i { position: absolute; top: 100%; left: 0; width: 100%; color: var(--pink); opacity: 0; }
.dmd-icon-font:hover .dmd-i { transform: translateY(-100%); }
.dmd-icon-font:hover .dmd-i:first-child { opacity: 0; }
.dmd-icon-font:hover .dmd-i + .dmd-i { opacity: 1; }
@media (max-width: 767px) {
	.dmd-icon { width: 100%; }
}

/* Contact */
.dmd-contact { text-align: center; }
@media (min-width: 1200px) { .dmd-contact { width: calc((100% + 30px) * .6666666667 - 30px); margin-left: calc((100% + 30px) * .1666666667); } }
.dmd-divider-holder { line-height: 0; font-size: 0; }
.dmd-divider { display: block; width: 50px; height: 0; margin: 15px auto 20px; border-bottom: 2px solid var(--line); }
.dmd-contact-subtitle { margin-bottom: 30px; }
.wpcf7-form p { margin: 0 0 25px; }
.wpcf7-form-control.wpcf7-text,
.wpcf7-form-control.wpcf7-textarea {
	width: 100%;
	margin: 0 0 5px;
	padding: 15px;
	font-family: Montserrat, sans-serif;
	font-size: 13px;
	font-weight: 400;
	color: var(--text);
	background-color: #fff;
	border: 1px solid transparent;
	border-radius: 0;
	outline: 0;
	vertical-align: middle;
	-webkit-appearance: none;
	appearance: none;
}
.wpcf7-form-control.wpcf7-text:focus,
.wpcf7-form-control.wpcf7-textarea:focus { border: 1px solid #ededed; }
.wpcf7-form-control::placeholder { color: var(--text); opacity: 1; }
input.wpcf7-form-control.wpcf7-submit {
	display: inline-block;
	width: auto;
	height: 45px;
	margin: 0 0 0 64px;
	padding: 0 56px;
	font-family: inherit;
	font-size: 12px;
	line-height: 45px;
	font-weight: 700;
	text-transform: uppercase;
	color: #fff;
	background-color: var(--pink);
	border: none;
	border-radius: 0;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	transition: all .15s ease-out;
}
input.wpcf7-form-control.wpcf7-submit:hover { background-color: #444; }
.wpcf7 form .wpcf7-response-output { margin-top: 2em; }

/* ---------- Subpages built from standard blocks (page.php, look of the blocks in css/standard-blocks.css) ---------- */
/* As before every row is 30 px wider than the window and the content sits in the grid of that row.
   Top-level blocks get the grid width directly, so percentages are converted to the window width here. */
:root { --grid-width-page: var(--grid-width); --grid-width-row: var(--grid-width); }
@media (max-width: 600px) { :root { --grid-width-page: calc(100% - 30px); } }
@media (max-width: 480px) { :root { --grid-width-page: calc(100% - 20px); } }
@media (max-width: 320px) { :root { --grid-width-page: calc((100% + 30px) * .95 - 30px); --grid-width-row: calc(95% - 30px); } }
.dmd-blocks > * { width: var(--grid-width-page); margin-left: auto; margin-right: auto; }
/* The short separator starts where the grid starts */
.dmd-blocks > .wp-block-separator { width: 30px; margin-left: calc((100% - var(--grid-width-page)) / 2); }
/* Paragraphs 25 px apart; the last one of a run has no gap below (as in the old text blocks) */
.dmd-blocks p:not(:has(+ p, + ul, + ol)) { margin-bottom: 0; }
/* Hero: full width plus 15 px on each side; its padding in % refers to the window width as before */
.dmd-blocks > .is-style-dmd-hero { width: auto; margin-left: -15px; margin-right: -15px; }
.dmd-blocks .is-style-dmd-hero > * { width: var(--grid-width-row); margin-left: auto !important; margin-right: auto !important; }
/* Parallax row (Our Process): also 30 px wider than the window, its content spans the whole row */
.dmd-blocks > .is-style-dmd-parallax { width: auto; margin-left: -15px; margin-right: -15px; }
.dmd-blocks .is-style-dmd-parallax > * { margin-top: 0; margin-bottom: 0; }
/* Full width rows and the carousel (Retreat): across the whole window, no grid */
.dmd-blocks > .is-style-dmd-full-width,
.dmd-blocks > .dmd-carousel { width: auto; margin-left: 0; margin-right: 0; }
/* Process steps: full window width, one after the other without gaps */
.dmd-blocks > .dmd-process-step { width: 100%; margin: 0; }
/* Columns: 30 px apart, side by side from 768 px, stacked below without gaps */
.dmd-blocks .wp-block-columns { gap: 0 30px; margin-top: 0; margin-bottom: 0; }
@media (min-width: 768px) {
	.dmd-blocks .wp-block-columns { flex-wrap: nowrap !important; }
	.dmd-blocks .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column { flex-basis: 0 !important; flex-grow: 1; }
}
/* Styles "DMD Two thirds" / "DMD One third" (column): old 2/3 and 1/3 columns of a row 30 px wider than its grid, 15 px padding each side */
@media (min-width: 768px) {
	.dmd-blocks .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column.is-style-dmd-two-thirds { flex: 0 0 calc((100% + 30px) * 2 / 3 - 30px) !important; }
	.dmd-blocks .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column.is-style-dmd-one-third { flex: 0 0 calc((100% + 30px) / 3 - 30px) !important; }
}
@media (max-width: 767px) {
	.dmd-blocks .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column { flex-basis: 100% !important; }
}
/* Style "DMD Stacked below 992 px": side by side only from 992 px (old "md" columns, About Me) */
@media (max-width: 991px) {
	.dmd-blocks .wp-block-columns.is-style-dmd-stack-992:not(.is-not-stacked-on-mobile) { flex-wrap: wrap !important; }
	.dmd-blocks .wp-block-columns.is-style-dmd-stack-992:not(.is-not-stacked-on-mobile) > .wp-block-column { flex-basis: 100% !important; }
}

/* ---------- Footer ---------- */
.dmd-footer-top { padding: 120px 132px; background-color: #f0f0f0; }
.dmd-footer-columns { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.dmd-footer-column { width: 50%; padding: 0 15px; text-align: left; }
.dmd-footer-title { padding: 10px 0 17px; margin-bottom: 25px; }
.dmd-footer-title::after { content: ""; display: block; width: 30px; height: 2px; margin-top: 19px; background: var(--line); }
.dmd-footer-title-insta { margin-bottom: 37px; }
.dmd-icon-list-item { position: relative; display: table; table-layout: fixed; width: 100%; height: 26px; margin-bottom: 6px; }
.dmd-icon-list-icon { display: table-cell; width: 37px; vertical-align: middle; }
.dmd-icon-list-icon .dmd-i { display: block; margin-right: 12px; font-size: 15px; color: var(--text); text-align: center; }
.dmd-icon-list-text { display: table-cell; position: relative; margin: 0; vertical-align: middle; font-size: 14px; line-height: 26px; color: var(--text); }
.dmd-icon-list-link:hover .dmd-icon-list-text { color: #d399b2; }
.dmd-footer-bottom { padding: 24px 37px; background-color: #1c1c1c; color: var(--text); text-align: left; }
.dmd-footer-bottom-inner { display: flex; margin: 0 -15px; }
.dmd-footer-bottom-column { width: 50%; padding: 0 15px; }
@media (max-width: 1024px) { .dmd-footer-top { padding: 120px 30px; } }
@media (max-width: 768px) {
	.dmd-footer-bottom-inner { flex-wrap: wrap; }
	.dmd-footer-bottom-column { width: 100%; }
	.dmd-footer-columns { margin: 0; }
	.dmd-footer-column { padding: 0; }
	.dmd-footer-column:not(:last-child) { margin-bottom: 20px; }
}
@media (max-width: 480px) { .dmd-footer-column { width: 100%; } }

/* ---------- Back to top button ---------- */
.dmd-to-top { position: fixed; right: 46px; bottom: 46px; z-index: 10000; width: 46px; overflow: hidden; white-space: nowrap; background-color: var(--pink); opacity: 0; visibility: hidden; transform: translateZ(0); transition: all .2s cubic-bezier(.6, 0, .26, .99); }
.dmd-to-top.is-on { opacity: 1; visibility: visible; }
.dmd-to-top-icons { position: relative; z-index: 300; display: block; overflow: hidden; }
.dmd-to-top-icon { display: block; width: 46px; height: 46px; line-height: 46px; text-align: center; font-size: 20px; color: #fff; transition: all .3s cubic-bezier(.6, 0, .26, .99); }
.dmd-to-top-icon .dmd-i { line-height: inherit; margin-right: 2px; }
.dmd-to-top-icon:last-child { position: absolute; top: 0; left: 0; transform: translateY(100%); }
.dmd-to-top:hover .dmd-to-top-icon:first-child { transform: translateY(-100%); }
.dmd-to-top:hover .dmd-to-top-icon:last-child { transform: translateY(0); }
.dmd-to-top-circle-holder { position: absolute; top: -1px; left: -1px; width: calc(100% + 2px); height: calc(100% + 2px); z-index: 10; }
.dmd-to-top-circle { position: absolute; width: 0; height: 0; border-radius: 50%; background-color: var(--dark); opacity: 0; transform: translate(-50%, -50%); transition: width 0s .3s, height 0s .3s, opacity .3s cubic-bezier(.15, .7, .54, .99); }
.dmd-to-top:hover .dmd-to-top-circle { width: 200px; height: 200px; opacity: 1; transition: width 1s, height 1s, opacity .4s cubic-bezier(.15, .7, .54, .99); }

/* ---------- Video lightbox ---------- */
.dmd-lightbox { position: fixed; inset: 0; z-index: 9500; }
.dmd-lightbox[hidden] { display: none; }
.dmd-lightbox-backdrop { position: absolute; inset: 0; background-color: #000; opacity: .7; animation: dmd-fade-in .2s ease-out; }
@keyframes dmd-fade-in { from { opacity: 0; } to { opacity: .7; } }
.dmd-lightbox-box { position: absolute; left: 50%; top: max(0px, calc((100vh - 620px) / 2)); transform: translateX(-50%); }
.dmd-lightbox-video { width: 960px; height: 540px; max-width: calc(100vw - 32px); max-height: calc((100vw - 32px) * .5625); background: #000; }
.dmd-lightbox-video iframe { display: block; width: 100%; height: 100%; border: 0; }
.dmd-lightbox-close { position: absolute; right: 0; bottom: -40px; width: 30px; height: 30px; opacity: 0; }