/*
 * DREAMS CLINIC reusable design foundation.
 * Brand colors remain provisional until official identity files are supplied.
 */

@font-face {
	font-family: "Cormorant Garamond";
	font-style: normal;
	font-weight: 300 700;
	font-display: swap;
	src: url("../fonts/cormorant-garamond-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Manrope";
	font-style: normal;
	font-weight: 200 800;
	font-display: swap;
	src: url("../fonts/manrope-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Noto Sans Arabic";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url("../fonts/noto-sans-arabic.woff2") format("woff2");
	unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}

@font-face {
	font-family: "Noto Naskh Arabic";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url("../fonts/noto-naskh-arabic.woff2") format("woff2");
	unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}

:root {
	color-scheme: light;
	--dc-color-purple-900: #3b174d;
	--dc-color-purple-700: #511f68;
	--dc-color-purple-500: #742b82;
	--dc-color-magenta-700: #8c2a68;
	--dc-color-magenta-500: #a52e78;
	--dc-color-magenta-300: #b57a9e;
	--dc-color-magenta-200: #e7c5dc;
	--dc-color-magenta-100: #ead8e5;
	--dc-color-ink: #211b23;
	--dc-color-muted: #625a63;
	--dc-color-paper: #fcfafb;
	--dc-color-surface: #ffffff;
	--dc-color-surface-muted: #f6f2f5;
	--dc-color-line: #ded7df;
	--dc-color-success: #176b4a;
	--dc-color-warning: #704a0b;
	--dc-color-danger: #9d2626;
	--dc-color-focus: #3b174d;
	--dc-gradient-brand: linear-gradient(115deg, #511f68 0%, #a52e78 100%);
	--dc-font-display: "Cormorant Garamond", Georgia, serif;
	--dc-font-body: "Manrope", Arial, sans-serif;
	--dc-font-arabic-display: "Noto Naskh Arabic", "Manrope", sans-serif;
	--dc-font-arabic-body: "Noto Sans Arabic", "Manrope", sans-serif;
	--dc-type-display: clamp(3.25rem, 9vw, 8.5rem);
	--dc-type-title: clamp(2.5rem, 5.4vw, 5rem);
	--dc-type-heading: clamp(1.75rem, 3.4vw, 3.25rem);
	--dc-type-subheading: clamp(1.375rem, 2vw, 2rem);
	--dc-type-lead: clamp(1.125rem, 1.55vw, 1.5rem);
	--dc-type-body: 1rem;
	--dc-type-small: 0.875rem;
	--dc-leading-display: 0.94;
	--dc-leading-heading: 1.08;
	--dc-leading-body: 1.65;
	--dc-space-1: 0.25rem;
	--dc-space-2: 0.5rem;
	--dc-space-3: 0.75rem;
	--dc-space-4: 1rem;
	--dc-space-6: 1.5rem;
	--dc-space-8: 2rem;
	--dc-space-12: 3rem;
	--dc-space-16: 4rem;
	--dc-space-24: 6rem;
	--dc-space-32: 8rem;
	--dc-container-wide: 88rem;
	--dc-container-default: 72rem;
	--dc-container-narrow: 52rem;
	--dc-grid-columns: 12;
	--dc-grid-gap: clamp(1rem, 2vw, 2rem);
	--dc-page-gutter: clamp(1.25rem, 5vw, 5rem);
	--dc-duration-fast: 140ms;
	--dc-duration-standard: 240ms;
	--dc-duration-reveal: 720ms;
	--dc-ease-standard: cubic-bezier(0.22, 1, 0.36, 1);
	--dc-ease-emphasis: cubic-bezier(0.16, 1, 0.3, 1);
}

body {
	margin: 0;
	background: var(--dc-color-paper);
	color: var(--dc-color-ink);
	font-family: var(--dc-font-body);
	font-size: var(--dc-type-body);
	line-height: var(--dc-leading-body);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

[lang="ar"],
[lang^="ar-"] {
	font-family: var(--dc-font-arabic-body);
	line-height: 1.8;
}

[lang="ar"] .dc-type-display,
[lang^="ar-"] .dc-type-display,
[lang="ar"] .dc-type-title,
[lang^="ar-"] .dc-type-title,
[lang="ar"] .dc-type-heading,
[lang^="ar-"] .dc-type-heading {
	font-family: var(--dc-font-arabic-display);
	font-weight: 500;
	line-height: 1.25;
}

img,
svg,
video {
	max-inline-size: 100%;
	block-size: auto;
}

button,
input,
select,
textarea {
	font: inherit;
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--dc-color-focus);
	outline-offset: 4px;
}

::selection {
	background: var(--dc-color-purple-700);
	color: var(--dc-color-surface);
}

.dc-container {
	inline-size: min(var(--dc-container-default), calc(100% - 2 * var(--dc-page-gutter)));
	margin-inline: auto;
}

.dc-container--wide {
	inline-size: min(var(--dc-container-wide), calc(100% - 2 * var(--dc-page-gutter)));
}

.dc-container--narrow {
	inline-size: min(var(--dc-container-narrow), calc(100% - 2 * var(--dc-page-gutter)));
}

.dc-grid {
	display: grid;
	grid-template-columns: repeat(var(--dc-grid-columns), minmax(0, 1fr));
	gap: var(--dc-grid-gap);
}

.dc-stack {
	display: flex;
	flex-direction: column;
	gap: var(--dc-space-6);
}

.dc-eyebrow,
.dc-section-label {
	margin-block: 0 var(--dc-space-4);
	color: var(--dc-color-purple-700);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	line-height: 1.4;
	text-transform: uppercase;
}

.dc-type-display,
.dc-type-title,
.dc-type-heading,
.dc-type-lead {
	margin-block: 0;
}

.dc-type-display {
	font-family: var(--dc-font-display);
	font-size: var(--dc-type-display);
	font-weight: 400;
	letter-spacing: -0.045em;
	line-height: var(--dc-leading-display);
}

.dc-type-title {
	font-family: var(--dc-font-display);
	font-size: var(--dc-type-title);
	font-weight: 400;
	letter-spacing: -0.035em;
	line-height: 1;
}

.dc-type-heading {
	font-family: var(--dc-font-display);
	font-size: var(--dc-type-heading);
	font-weight: 400;
	letter-spacing: -0.025em;
	line-height: var(--dc-leading-heading);
}

.dc-type-subheading {
	font-size: var(--dc-type-subheading);
	font-weight: 600;
	line-height: 1.25;
}

.dc-type-lead {
	max-inline-size: 42rem;
	font-size: var(--dc-type-lead);
	line-height: 1.55;
}

.dc-button {
	position: relative;
	display: inline-flex;
	min-block-size: 3.25rem;
	align-items: center;
	justify-content: center;
	gap: var(--dc-space-3);
	padding-block: 0.75rem;
	padding-inline: 1.25rem;
	border: 1px solid transparent;
	color: var(--dc-color-ink);
	cursor: pointer;
	font-size: 0.875rem;
	font-weight: 650;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	transition: background-color var(--dc-duration-standard) var(--dc-ease-standard), border-color var(--dc-duration-standard) var(--dc-ease-standard), color var(--dc-duration-standard) var(--dc-ease-standard), transform var(--dc-duration-standard) var(--dc-ease-standard);
}

.dc-button:hover {
	transform: translateY(-2px);
}

.dc-button--primary {
	background: var(--dc-color-purple-900);
	color: var(--dc-color-surface);
}

.dc-button--primary:hover {
	background: var(--dc-color-purple-700);
	color: var(--dc-color-surface);
}

.dc-button--secondary {
	border-color: var(--dc-color-purple-700);
	background: transparent;
	color: var(--dc-color-purple-700);
}

.dc-button--secondary:hover {
	background: var(--dc-color-purple-700);
	color: var(--dc-color-surface);
}

.dc-button--quiet {
	padding-inline: 0;
	color: var(--dc-color-purple-700);
}

.dc-text-link,
.dc-nav-link {
	position: relative;
	width: fit-content;
	color: var(--dc-color-purple-700);
	font-weight: 600;
	text-decoration: none;
}

.dc-text-link::after,
.dc-nav-link::after {
	position: absolute;
	block-size: 1px;
	background: currentColor;
	content: "";
	inline-size: 100%;
	inset-block-end: -0.25em;
	inset-inline-start: 0;
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform var(--dc-duration-standard) var(--dc-ease-standard);
}

[dir="rtl"] .dc-text-link::after,
[dir="rtl"] .dc-nav-link::after {
	transform-origin: right center;
}

.dc-text-link:hover::after,
.dc-text-link:focus-visible::after,
.dc-nav-link:hover::after,
.dc-nav-link:focus-visible::after {
	transform: scaleX(1);
}

.dc-directional-icon {
	display: inline-block;
	transition: transform var(--dc-duration-standard) var(--dc-ease-standard);
}

[dir="rtl"] .dc-directional-icon {
	transform: scaleX(-1);
}

.dc-rule {
	margin-block: var(--dc-space-8);
	border: 0;
	border-block-start: 1px solid var(--dc-color-line);
}

.dc-media {
	position: relative;
	display: block;
	overflow: hidden;
	inline-size: 100%;
	background: var(--dc-color-surface-muted);
}

.dc-media--portrait {
	aspect-ratio: 4 / 5;
}

.dc-media--landscape {
	aspect-ratio: 3 / 2;
}

.dc-media--wide {
	aspect-ratio: 16 / 9;
}

.dc-media img,
.dc-media video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.dc-media-caption {
	margin-block-start: var(--dc-space-3);
	color: var(--dc-color-muted);
	font-size: var(--dc-type-small);
}

.dc-image-zoom img,
.dc-image-zoom__surface {
	transition: transform 900ms var(--dc-ease-standard);
}

.dc-image-zoom:hover img,
.dc-image-zoom:focus-within img,
.dc-image-zoom:hover .dc-image-zoom__surface,
.dc-image-zoom:focus-within .dc-image-zoom__surface {
	transform: scale(1.035);
}

.dc-field-label {
	display: block;
	margin-block-end: var(--dc-space-2);
	font-size: var(--dc-type-small);
	font-weight: 650;
}

.dc-field {
	display: block;
	inline-size: 100%;
	min-block-size: 3rem;
	margin-block-end: var(--dc-space-6);
	padding-block: 0.75rem;
	padding-inline: 0.875rem;
	border: 1px solid var(--dc-color-line);
	border-radius: 0;
	background: var(--dc-color-surface);
	color: var(--dc-color-ink);
}

.dc-field::placeholder {
	color: var(--dc-color-muted);
	opacity: 1;
}

.dc-field:focus-visible {
	border-color: var(--dc-color-purple-700);
}

.dc-slider-control {
	display: inline-grid;
	inline-size: 3rem;
	block-size: 3rem;
	place-items: center;
	border: 1px solid var(--dc-color-line);
	border-radius: 50%;
	background: var(--dc-color-surface);
	color: var(--dc-color-purple-900);
	cursor: pointer;
	transition: background-color var(--dc-duration-standard) var(--dc-ease-standard), color var(--dc-duration-standard) var(--dc-ease-standard), border-color var(--dc-duration-standard) var(--dc-ease-standard);
}

.dc-slider-control:hover {
	border-color: var(--dc-color-purple-900);
	background: var(--dc-color-purple-900);
	color: var(--dc-color-surface);
}

.dc-slide {
	opacity: 0;
	transition: opacity var(--dc-duration-reveal) var(--dc-ease-standard), transform var(--dc-duration-reveal) var(--dc-ease-standard);
}

.dc-slide.is-active {
	opacity: 1;
}

[data-dc-reveal="text"],
[data-dc-reveal="image"] {
	transition: opacity var(--dc-duration-reveal) var(--dc-ease-emphasis), transform var(--dc-duration-reveal) var(--dc-ease-emphasis);
}

[data-dc-reveal="image"] {
	transform: scale(1.025);
}

.dc-motion-ready [data-dc-reveal="text"]:not(.is-visible) {
	opacity: 0;
	transform: translateY(1.25rem);
}

.dc-motion-ready [data-dc-reveal="image"]:not(.is-visible) {
	opacity: 0.75;
	transform: scale(1.075);
}

.dc-transition-panel {
	transform: translateX(100%);
	transition: transform var(--dc-duration-reveal) var(--dc-ease-emphasis);
}

.dc-transition-panel.is-open {
	transform: translateX(0);
}

[dir="rtl"] .dc-transition-panel {
	transform: translateX(-100%);
}

[dir="rtl"] .dc-transition-panel.is-open {
	transform: translateX(0);
}

@media (max-width: 64rem) {
	:root {
		--dc-page-gutter: clamp(1.25rem, 4vw, 3rem);
		--dc-grid-columns: 8;
	}
}

@media (max-width: 40rem) {
	:root {
		--dc-page-gutter: 1.25rem;
		--dc-grid-columns: 4;
		--dc-grid-gap: 1rem;
		--dc-type-display: clamp(3rem, 16vw, 5rem);
		--dc-type-title: clamp(2.25rem, 11vw, 3.5rem);
	}

	.dc-button {
		min-block-size: 3rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}

	.dc-motion-ready [data-dc-reveal="text"],
	.dc-motion-ready [data-dc-reveal="image"] {
		opacity: 1 !important;
		transform: none !important;
	}
}