.elementor-kit-8{--e-global-color-primary:#24A59F;--e-global-color-secondary:#0F172B;--e-global-color-text:#45556C;--e-global-color-accent:#C78D70;--e-global-typography-primary-font-family:"Alibaba";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Alibaba";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Alibaba";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Alibaba";--e-global-typography-accent-font-weight:500;}.elementor-kit-8 e-page-transition{background-color:#FFBC7D;}.elementor-kit-8 h1{font-size:60px;font-weight:900;}.elementor-kit-8 h2{font-size:48px;font-weight:900;}.elementor-kit-8 h3{font-size:36px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1280px;}.e-con{--container-max-width:1280px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-8 h1{font-size:36px;}.elementor-kit-8 h2{font-size:36px;}.elementor-kit-8 h3{font-size:30px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS */:root {
    --brand: #C68C70;
    --brand-dark: #a86d51;
    --brand-soft: rgba(198, 140, 112, .12);
    --brand-line: rgba(198, 140, 112, .28);
    --teal: #298E8C;
    --text: #0f172a;
    --muted: #64748b;
}

html {
    scroll-behavior: smooth;
}

body {
    color: var(--text);
    background:
        radial-gradient(circle at top right, rgba(198, 140, 112, .09), transparent 20%),
        radial-gradient(circle at bottom left, rgba(41, 142, 140, .06), transparent 22%),
        linear-gradient(180deg, #fbf8f6 0%, #f6f1ee 100%);
}

.hero-gradient {
    background:
        radial-gradient(circle at top right, rgba(198, 140, 112, .22), transparent 18%),
        radial-gradient(circle at left center, rgba(41, 142, 140, .10), transparent 14%),
        linear-gradient(180deg, #fffaf7 0%, #f7f1ed 100%);
}

.grid-noise {
    position: relative;
}

.grid-noise::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .35;
    background-image:
        linear-gradient(rgba(198, 140, 112, .05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(198, 140, 112, .05) 1px, transparent 1px);
    background-size: 36px 36px;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, .9), transparent 92%);
}

.sharp-card {
    position: relative;
    overflow: hidden;
    background: rgba(255, 255, 255, .78);
    backdrop-filter: blur(18px);
    border: 1px solid rgba(198, 140, 112, .18);
    box-shadow: 0 18px 45px rgba(15, 23, 42, .08);
    clip-path: polygon(0 0,
            calc(100% - 22px) 0,
            100% 22px,
            100% 100%,
            22px 100%,
            0 calc(100% - 22px));
    transition: transform .45s ease, box-shadow .45s ease, border-color .45s ease;
}

.sharp-card-free {
    position: relative;
    overflow: hidden;
    background: rgba(255, 255, 255, .78);
    backdrop-filter: blur(18px);
    border: 1px solid rgba(198, 140, 112, .18);
    box-shadow: 0 18px 45px rgba(15, 23, 42, .08);
    clip-path: polygon(0 0,
            calc(100% - 22px) 0,
            100% 22px,
            100% 100%,
            22px 100%,
            0 calc(100% - 22px));
    transition: transform .45s ease, box-shadow .45s ease, border-color .45s ease;
}

.sharp-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 26px 70px rgba(15, 23, 42, .14);
    border-color: rgba(198, 140, 112, .32);
}

.sharp-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(120deg,
            transparent 20%,
            rgba(198, 140, 112, .18),
            transparent 70%);
    opacity: 0;
    transition: opacity .45s ease;
}

.sharp-card:hover::before {
    opacity: 1;
}

.sharp-card-secondary {
    position: relative;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.78);
    backdrop-filter: blur(18px);
    border: 1px solid rgba(112, 195, 198, 0.18);
    box-shadow: 0 18px 45px rgba(15, 36, 42, 0.08);
    clip-path: polygon(0 0,
            calc(100% - 22px) 0,
            100% 22px,
            100% 100%,
            22px 100%,
            0 calc(100% - 22px));
    transition: transform .45s ease, box-shadow .45s ease, border-color .45s ease;
}

.sharp-card-secondary:hover {
    transform: translateY(-6px);
    box-shadow: 0 26px 70px rgba(15, 34, 42, 0.14);
    border-color: rgba(112, 195, 198, .32);
}

.sharp-card-secondary::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(120deg,
            transparent 20%,
            rgba(112, 192, 198, 0.18),
            transparent 70%);
    opacity: 0;
    transition: opacity .45s ease;
}

.sharp-card-secondary:hover::before {
    opacity: 1;
}

.brand-gradient {
    background: linear-gradient(135deg, #C68C70 0%, #d6a893 50%, #f0d8cc 100%);
}

.brand-gradient-secondary {
    background: linear-gradient(135deg, #37c4bd 0%, #24A59F 50%, #0e7a75 100%);
}

.brand-text {
    background: linear-gradient(135deg, #C68C70 0%, #a86d51 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.brand-text-secondary {
    background: linear-gradient(135deg, #24A59F 0%, #0e7a75 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.section-label {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .6rem 1rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, .72);
    border: 1px solid rgba(198, 140, 112, .18);
    color: #a86d51;
    font-weight: 700;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
}

.section-label .dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--brand);
    box-shadow: 0 0 0 6px rgba(198, 140, 112, .14);
}

.hero-panel {
    background:
        radial-gradient(circle at top right, rgba(198, 140, 112, .20), transparent 30%),
        linear-gradient(180deg, rgba(255, 255, 255, .86), rgba(255, 255, 255, .72));
    border: 1px solid rgba(198, 140, 112, .18);
    box-shadow: 0 30px 80px rgba(15, 23, 42, .10);
    clip-path: polygon(0 0,
            calc(100% - 26px) 0,
            100% 26px,
            100% 100%,
            26px 100%,
            0 calc(100% - 26px));
}

.hero-chip {
    background: rgba(198, 140, 112, .10);
    border: 1px solid rgba(198, 140, 112, .18);
    color: #9f6650;
}

.soft-line {
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(198, 140, 112, .35), transparent);
}

.float-badge {
    background: rgba(255, 255, 255, .78);
    backdrop-filter: blur(14px);
    border: 1px solid rgba(198, 140, 112, .18);
    box-shadow: 0 16px 40px rgba(15, 23, 42, .10);
    clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 16px 100%, 0 calc(100% - 16px));
}

.btn-brand {
    background: linear-gradient(135deg, #C68C70 0%, #b9785a 100%);
    color: white;
    box-shadow: 0 16px 30px rgba(198, 140, 112, .28);
    transition: transform .3s ease, box-shadow .3s ease;
}

.btn-brand:hover {
    transform: translateY(-2px);
    box-shadow: 0 20px 40px rgba(198, 140, 112, .34);
}

.btn-outline-brand {
    border: 1px solid rgba(198, 140, 112, .28);
    color: #9f6650;
    background: rgba(255, 255, 255, .62);
    transition: background .3s ease, transform .3s ease;
}

.btn-outline-brand:hover {
    background: rgba(198, 140, 112, .08);
    transform: translateY(-2px);
}

.reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .7s ease, transform .7s ease;
}

.reveal.in-view {
    opacity: 1;
    transform: translateY(0);
}

.image-stack {
    position: relative;

    perspective: 2000px;
}

.image-card {
    position: absolute;
    overflow: hidden;

    transition:
        transform .8s cubic-bezier(.2, .8, .2, 1),
        box-shadow .6s ease,
        opacity 1s ease;

    box-shadow:
        0 40px 80px rgba(15, 23, 32, .18);

    clip-path: polygon(0 0,
            calc(100% - 30px) 0,
            100% 30px,
            100% 100%,
            30px 100%,
            0 calc(100% - 30px));
}

.image-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;

    transition:
        transform 1.5s ease,
        filter .8s ease;
}

.image-overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(to top,
            rgba(15, 23, 32, .55),
            transparent 45%);

    mix-blend-mode: multiply;
}

.image-main {
    width: 78%;
    aspect-ratio: 3 / 4;

    top: 0;
    right: 0;

    z-index: 10;

    transform:
        rotate(-4deg) translateY(60px);

    opacity: 0;

    animation:
        imageRevealMain 1.4s cubic-bezier(.22, 1, .36, 1) forwards;
}

.image-float {
    width: 48%;
    aspect-ratio: 4 / 5;

    z-index: 20;

    border: 8px solid rgba(255, 255, 255, .8);

    transform:
        rotate(8deg) translateY(100px);

    opacity: 0;

    animation:
        imageRevealFloat 1.8s cubic-bezier(.22, 1, .36, 1) forwards;
}

.image-stack:hover .image-main {
    transform:
        rotate(-2deg) translateY(20px) scale(1.02);
}

.image-stack:hover .image-float {
    transform:
        rotate(4deg) translateY(-10px) scale(1.03);
}

.image-stack:hover img {
    transform: scale(1.08);
    filter: saturate(1.1) contrast(1.05);
}

@keyframes imageRevealMain {

    0% {
        opacity: 0;

        transform:
            rotate(-12deg) translateY(160px) scale(.9);
    }

    100% {
        opacity: 1;

        transform:
            rotate(-4deg) translateY(60px) scale(1);
    }
}

@keyframes imageRevealFloat {

    0% {
        opacity: 0;

        transform:
            rotate(18deg) translateX(-120px) translateY(160px) scale(.8);
    }

    100% {
        opacity: 1;

        transform:
            rotate(8deg) translateX(0) translateY(0) scale(1);
    }
}

.animate-fade-up {
    opacity: 0;
    transform: translateY(40px);

    animation:
        fadeUp 1s ease forwards;

    animation-delay: 1.1s;
}

@keyframes fadeUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fit-content {
    width: fit-content;
    max-width: 100%;
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Alibaba';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url('https://sadafclinic.com/wp-content/uploads/2026/05/Alibaba-Regular.woff2') format('woff2'),
		url('https://sadafclinic.com/wp-content/uploads/2026/05/Alibaba-Regular.woff') format('woff');
}
@font-face {
	font-family: 'Alibaba';
	font-style: normal;
	font-weight: 200;
	font-display: auto;
	src: url('https://sadafclinic.com/wp-content/uploads/2026/05/Alibaba-Light.woff2') format('woff2'),
		url('https://sadafclinic.com/wp-content/uploads/2026/05/Alibaba-Light.woff') format('woff');
}
@font-face {
	font-family: 'Alibaba';
	font-style: normal;
	font-weight: 600;
	font-display: auto;
	src: url('https://sadafclinic.com/wp-content/uploads/2026/05/Alibaba-Bold.woff2') format('woff2'),
		url('https://sadafclinic.com/wp-content/uploads/2026/05/Alibaba-Bold.woff') format('woff');
}
@font-face {
	font-family: 'Alibaba';
	font-style: normal;
	font-weight: 900;
	font-display: auto;
	src: url('https://sadafclinic.com/wp-content/uploads/2026/05/Alibaba-Black.woff2') format('woff2'),
		url('https://sadafclinic.com/wp-content/uploads/2026/05/Alibaba-Black.woff') format('woff');
}
/* End Custom Fonts CSS */