/* ==========================================================================
   پنجره روشنایی — استایل اصلی سایت
   فایل: css/style.css
   طراحی: تیم طراحی و توسعه
   ========================================================================== */

/* ---------- 1. متغیرها و تنظیمات پایه ---------- */
:root {
    --green-900: #1c5a45;
    --green-700: #2E8B6F;
    --green-600: #37997b;
    --green-500: #4aa78a;
    --green-300: #7FC8A9;
    --green-100: #e6f4ee;
    --green-50: #f3faf7;

    --ink-900: #1f2a2e;
    --ink-700: #384a50;
    --ink-500: #5c6f75;
    --ink-300: #9aa9ae;

    --white: #ffffff;
    --bg: #fbfdfc;
    --border: #e3ece8;

    --shadow-sm: 0 2px 8px rgba(28, 90, 69, 0.06);
    --shadow-md: 0 8px 24px rgba(28, 90, 69, 0.08);
    --shadow-lg: 0 18px 40px rgba(28, 90, 69, 0.12);

    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 24px;

    --transition: 0.3s ease;

    --container: 1200px;
    --header-h: 78px;

    --font: 'Vazirmatn', 'Segoe UI', Tahoma, sans-serif;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--header-h) + 10px);
}

body {
    margin: 0;
    padding: 0;
    font-family: var(--font);
    font-size: 16px;
    line-height: 1.85;
    color: var(--ink-700);
    background: var(--bg);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    color: var(--green-700);
    text-decoration: none;
    transition: color var(--transition);
}

a:hover {
    color: var(--green-900);
}

ul,
ol {
    padding-right: 1.2rem;
    margin: 0;
}

h1,
h2,
h3,
h4 {
    color: var(--ink-900);
    font-weight: 700;
    line-height: 1.5;
    margin: 0 0 0.6em;
}

h1 {
    font-size: 2.6rem;
    font-weight: 800;
}

h2 {
    font-size: 2rem;
}

h3 {
    font-size: 1.2rem;
}

p {
    margin: 0 0 1rem;
}

/* ---------- 2. کلاس‌های عمومی ---------- */
.container {
    width: 100%;
    max-width: var(--container);
    margin: 0 auto;
    padding: 0 1.25rem;
}

.section {
    padding: 5.5rem 0;
    position: relative;
}

.section-head {
    text-align: center;
    max-width: 720px;
    margin: 0 auto 3rem;
}

.section-eyebrow {
    display: inline-block;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.5px;
    color: var(--green-700);
    background: var(--green-100);
    padding: 0.35rem 1rem;
    border-radius: 999px;
    margin-bottom: 1rem;
}

.section-title {
    font-size: 2rem;
    font-weight: 800;
    color: var(--ink-900);
    margin-bottom: 0.8rem;
    position: relative;
}

.section-sub {
    font-size: 1rem;
    color: var(--ink-500);
    margin: 0;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.85rem 1.8rem;
    border-radius: 999px;
    font-family: inherit;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    border: 2px solid transparent;
    transition: all var(--transition);
    text-align: center;
    white-space: nowrap;
}

.btn-primary {
    background: var(--green-700);
    color: var(--white);
    box-shadow: 0 6px 18px rgba(46, 139, 111, 0.3);
}

.btn-primary:hover {
    background: var(--green-900);
    color: var(--white);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(46, 139, 111, 0.35);
}

.btn-outline {
    background: transparent;
    color: var(--white);
    border-color: rgba(255, 255, 255, 0.7);
}

.btn-outline:hover {
    background: var(--white);
    color: var(--green-900);
    border-color: var(--white);
}

/* انیمیشن Reveal برای اسکرول */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.7s ease, transform 0.7s ease;
}

.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

/* ---------- 3. هدر ---------- */
.site-header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1000;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--border);
    transition: box-shadow var(--transition), background var(--transition);
}

.site-header.scrolled {
    box-shadow: var(--shadow-md);
    background: var(--white);
}

.header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    height: var(--header-h);
}

/* لوگو */
.logo {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    flex-shrink: 0;
}

.logo-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform var(--transition);
}

.logo:hover .logo-mark {
    transform: rotate(8deg);
}

.logo-text {
    display: flex;
    flex-direction: column;
    line-height: 1.25;
}

.logo-text strong {
    color: var(--green-900);
    font-size: 1.1rem;
    font-weight: 800;
}

.logo-text small {
    color: var(--ink-500);
    font-size: 0.72rem;
    font-weight: 500;
}

/* ناوبری */
.main-nav ul {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    list-style: none;
    padding: 0;
    margin: 0;
}

.main-nav a {
    display: block;
    padding: 0.55rem 0.9rem;
    font-size: 0.92rem;
    font-weight: 500;
    color: var(--ink-700);
    border-radius: 8px;
    position: relative;
    transition: color var(--transition), background var(--transition);
}

.main-nav a:hover,
.main-nav a.active {
    color: var(--green-700);
    background: var(--green-50);
}

.main-nav a.active::after {
    content: '';
    position: absolute;
    bottom: 2px;
    right: 0.9rem;
    left: 0.9rem;
    height: 2px;
    background: var(--green-700);
    border-radius: 2px;
}

/* دکمه CTA هدر */
.header-cta {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.6rem 1.2rem;
    background: var(--green-700);
    color: var(--white);
    border-radius: 999px;
    font-size: 0.88rem;
    font-weight: 600;
    box-shadow: 0 4px 14px rgba(46, 139, 111, 0.25);
    transition: all var(--transition);
    flex-shrink: 0;
}

.header-cta:hover {
    background: var(--green-900);
    color: var(--white);
    transform: translateY(-2px);
}

/* دکمه همبرگری */
.nav-toggle {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--white);
    cursor: pointer;
    transition: background var(--transition);
}

.nav-toggle span {
    display: block;
    width: 22px;
    height: 2px;
    margin: 0 auto;
    background: var(--green-900);
    border-radius: 2px;
    transition: transform var(--transition), opacity var(--transition);
}

.nav-toggle.open span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.nav-toggle.open span:nth-child(2) {
    opacity: 0;
}

.nav-toggle.open span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

/* ---------- 4. اسلایدر (Hero) ---------- */
.hero {
    position: relative;
    margin-top: var(--header-h);
    height: calc(100vh - var(--header-h));
    min-height: 560px;
    max-height: 820px;
    overflow: hidden;
    background: var(--green-900);
}

.hero-slider {
    position: relative;
    width: 100%;
    height: 100%;
}

.slide {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0;
    transform: scale(1.05);
    transition: opacity 1s ease, transform 6s ease;
    display: flex;
    align-items: center;
    pointer-events: none;
    z-index: 0;
}

.slide.active {
    opacity: 1;
    transform: scale(1);
    pointer-events: auto;
    z-index: 1;
}

.slide-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to left,
            rgba(15, 55, 42, 0.75) 0%,
            rgba(15, 55, 42, 0.45) 55%,
            rgba(15, 55, 42, 0.2) 100%);
    z-index: 1;
}

.slide-content {
    position: relative;
    z-index: 2;
    color: var(--white);
    max-width: 720px;
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.slide-eyebrow {
    display: inline-block;
    padding: 0.35rem 1rem;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.35);
    color: var(--white);
    font-size: 0.82rem;
    font-weight: 500;
    border-radius: 999px;
    margin-bottom: 1.2rem;
    backdrop-filter: blur(4px);
}

.slide-content h1,
.slide-content h2 {
    color: var(--white);
    font-size: 2.8rem;
    line-height: 1.35;
    margin-bottom: 1rem;
    font-weight: 800;
}

.slide-content h1 span,
.slide-content h2 span {
    color: var(--green-300);
    position: relative;
}

.slide-content p {
    font-size: 1.05rem;
    color: rgba(255, 255, 255, 0.88);
    max-width: 580px;
    margin-bottom: 2rem;
}

.slide-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem;
}

/* فلش‌های اسلایدر */
.slider-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.4);
    background: rgba(255, 255, 255, 0.12);
    color: var(--white);
    font-size: 1rem;
    cursor: pointer;
    backdrop-filter: blur(6px);
    transition: background var(--transition), transform var(--transition);
    display: flex;
    align-items: center;
    justify-content: center;
}

.slider-arrow:hover {
    background: rgba(255, 255, 255, 0.3);
    transform: translateY(-50%) scale(1.05);
}

.slider-arrow.prev {
    right: 1.5rem;
}

.slider-arrow.next {
    left: 1.5rem;
}

/* نقاط اسلایدر */
.slider-dots {
    position: absolute;
    bottom: 1.8rem;
    left: 0;
    right: 0;
    z-index: 5;
    display: flex;
    justify-content: center;
    gap: 0.55rem;
}

.slider-dots button {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: none;
    background: rgba(255, 255, 255, 0.45);
    cursor: pointer;
    padding: 0;
    transition: background var(--transition), transform var(--transition);
}

.slider-dots button.active {
    background: var(--white);
    transform: scale(1.25);
}

/* ---------- 5. درباره کلینیک ---------- */
.about {
    background: var(--white);
}

.about-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: center;
}

.about-image {
    position: relative;
    border-radius: var(--radius-lg);
    overflow: visible;
}

.about-image img {
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    width: 100%;
    object-fit: cover;
    aspect-ratio: 4 / 5;
}

.about-badge {
    position: absolute;
    bottom: -20px;
    right: -20px;
    background: var(--green-700);
    color: var(--white);
    border-radius: var(--radius-md);
    padding: 1rem 1.4rem;
    text-align: center;
    box-shadow: var(--shadow-md);
    line-height: 1.3;
}

.about-badge strong {
    display: block;
    font-size: 1.6rem;
    font-weight: 800;
}

.about-badge span {
    font-size: 0.8rem;
    opacity: 0.9;
}

.about-content .section-title {
    text-align: right;
    margin-bottom: 1rem;
}

.about-content p {
    color: var(--ink-500);
    font-size: 1rem;
}

.about-list {
    list-style: none;
    padding: 0;
    margin: 1.4rem 0 1.8rem;
}

.about-list li {
    position: relative;
    padding-right: 1.9rem;
    margin-bottom: 0.6rem;
    color: var(--ink-700);
    font-size: 0.95rem;
}

.about-list li::before {
    content: '✓';
    position: absolute;
    right: 0;
    top: 0;
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--green-100);
    color: var(--green-700);
    border-radius: 50%;
    font-size: 0.8rem;
    font-weight: 700;
}

/* ---------- 6. خدمات ---------- */
.services {
    background: var(--green-50);
}

.cards-grid {
    display: grid;
    gap: 1.5rem;
}

.services-grid {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.service-card {
    background: var(--white);
    border-radius: var(--radius-md);
    padding: 2rem 1.6rem;
    border: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
    transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
    position: relative;
    overflow: hidden;
}

.service-card::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--green-300), var(--green-700));
    transform: scaleX(0);
    transform-origin: right;
    transition: transform var(--transition);
}

.service-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-lg);
    border-color: var(--green-300);
}

.service-card:hover::after {
    transform: scaleX(1);
}

.service-icon {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: var(--green-100);
    color: var(--green-700);
    margin-bottom: 1.2rem;
    transition: background var(--transition), color var(--transition), transform var(--transition);
}

.service-card:hover .service-icon {
    background: var(--green-700);
    color: var(--white);
    transform: rotate(-6deg);
}

.service-card h3 {
    font-size: 1.1rem;
    margin-bottom: 0.5rem;
    color: var(--ink-900);
}

.service-card p {
    font-size: 0.92rem;
    color: var(--ink-500);
    margin: 0;
    line-height: 1.8;
}

/* ---------- 7. چرا پنجره روشنایی ---------- */
.why {
    background: var(--white);
}

.why-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.why-card {
    background: var(--green-50);
    border-radius: var(--radius-md);
    padding: 2rem 1.5rem;
    text-align: center;
    border: 1px solid var(--green-100);
    transition: transform var(--transition), box-shadow var(--transition), background var(--transition);
}

.why-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-md);
    background: var(--white);
}

.why-icon {
    font-size: 2.2rem;
    margin-bottom: 0.8rem;
    display: inline-block;
    transition: transform var(--transition);
}

.why-card:hover .why-icon {
    transform: scale(1.15) rotate(-5deg);
}

.why-card h3 {
    font-size: 1.05rem;
    color: var(--green-900);
    margin-bottom: 0.5rem;
}

.why-card p {
    font-size: 0.9rem;
    color: var(--ink-500);
    margin: 0;
}

/* ---------- 8. کادر درمان ---------- */
.team {
    background: var(--green-50);
}

.team-grid {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.team-card {
    background: var(--white);
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border);
    transition: transform var(--transition), box-shadow var(--transition);
}

.team-card:hover {
    transform: translateY(-8px);
    box-shadow: var(--shadow-lg);
}

.team-photo {
    position: relative;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: var(--green-100);
}

.team-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.team-card:hover .team-photo img {
    transform: scale(1.08);
}

.team-info {
    padding: 1.4rem 1.3rem 1.5rem;
    text-align: center;
    position: relative;
}

.team-tag {
    position: absolute;
    top: -14px;
    right: 50%;
    transform: translateX(50%);
    background: var(--green-300);
    color: var(--green-900);
    font-size: 0.72rem;
    font-weight: 700;
    padding: 0.18rem 0.8rem;
    border-radius: 999px;
    letter-spacing: 0.3px;
}

.team-info h3 {
    font-size: 1.05rem;
    margin: 0.4rem 0 0.3rem;
}

.team-role {
    color: var(--green-700);
    font-size: 0.88rem;
    font-weight: 600;
    margin-bottom: 0.6rem;
}

.team-desc {
    font-size: 0.85rem;
    color: var(--ink-500);
    margin: 0;
    line-height: 1.75;
}

/* ---------- 9. مراحل درمان ---------- */
.steps {
    background: var(--white);
}

.steps-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1.5rem;
    position: relative;
}

.step {
    position: relative;
    background: var(--green-50);
    border-radius: var(--radius-md);
    padding: 2.2rem 1.4rem 1.6rem;
    text-align: center;
    border: 1px solid var(--green-100);
    transition: transform var(--transition), box-shadow var(--transition), background var(--transition);
}

.step:hover {
    transform: translateY(-6px);
    background: var(--white);
    box-shadow: var(--shadow-md);
}

.step-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: var(--green-700);
    color: var(--white);
    font-size: 1.3rem;
    font-weight: 800;
    margin-bottom: 1rem;
    box-shadow: 0 6px 16px rgba(46, 139, 111, 0.3);
    transition: transform var(--transition), background var(--transition);
}

.step:hover .step-num {
    transform: scale(1.1);
    background: var(--green-900);
}

.step h3 {
    font-size: 1rem;
    color: var(--ink-900);
    margin-bottom: 0.4rem;
}

.step p {
    font-size: 0.88rem;
    color: var(--ink-500);
    margin: 0;
}

/* ---------- 10. نظرات مراجعان ---------- */
.testimonials {
    background: var(--green-50);
}

.testimonial-grid {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.testimonial-card {
    background: var(--white);
    border-radius: var(--radius-md);
    padding: 2rem 1.6rem 1.6rem;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border);
    position: relative;
    transition: transform var(--transition), box-shadow var(--transition);
}

.testimonial-card::before {
    content: '❝';
    position: absolute;
    top: -6px;
    right: 18px;
    font-size: 3.2rem;
    color: var(--green-300);
    opacity: 0.5;
    line-height: 1;
}

.testimonial-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-md);
}

.testimonial-badge {
    display: inline-block;
    background: var(--green-100);
    color: var(--green-700);
    font-size: 0.72rem;
    font-weight: 700;
    padding: 0.18rem 0.75rem;
    border-radius: 999px;
    margin-bottom: 1rem;
}

.testimonial-card p {
    font-size: 0.95rem;
    color: var(--ink-700);
    line-height: 1.9;
    margin-bottom: 1.2rem;
}

.testimonial-author {
    font-size: 0.85rem;
    color: var(--green-700);
    font-weight: 600;
    border-top: 1px dashed var(--border);
    padding-top: 0.9rem;
}

/* ---------- 11. مقالات ---------- */
.articles {
    background: var(--white);
}

.articles-grid {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.article-card {
    background: var(--white);
    border-radius: var(--radius-md);
    overflow: hidden;
    border: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
    transition: transform var(--transition), box-shadow var(--transition);
    display: flex;
    flex-direction: column;
}

.article-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-lg);
}

.article-image {
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: var(--green-100);
}

.article-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.article-card:hover .article-image img {
    transform: scale(1.08);
}

.article-body {
    padding: 1.4rem 1.4rem 1.6rem;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.article-meta {
    display: inline-block;
    align-self: flex-start;
    background: var(--green-100);
    color: var(--green-700);
    font-size: 0.72rem;
    font-weight: 700;
    padding: 0.2rem 0.7rem;
    border-radius: 999px;
    margin-bottom: 0.8rem;
}

.article-body h3 {
    font-size: 1.08rem;
    margin-bottom: 0.5rem;
    color: var(--ink-900);
}

.article-body p {
    font-size: 0.9rem;
    color: var(--ink-500);
    flex: 1;
    margin-bottom: 1rem;
}

.article-link {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--green-700);
    align-self: flex-start;
    transition: color var(--transition), transform var(--transition);
}

.article-link:hover {
    color: var(--green-900);
    transform: translateX(-4px);
}

/* ---------- 12. سوالات متداول ---------- */
.faq {
    background: var(--green-50);
}

.faq-list {
    max-width: 820px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
}

.faq-item {
    background: var(--white);
    border-radius: var(--radius-md);
    border: 1px solid var(--border);
    overflow: hidden;
    transition: box-shadow var(--transition), border-color var(--transition);
}

.faq-item:hover {
    border-color: var(--green-300);
    box-shadow: var(--shadow-sm);
}

.faq-item.open {
    border-color: var(--green-500);
    box-shadow: var(--shadow-md);
}

.faq-question {
    width: 100%;
    background: none;
    border: none;
    padding: 1.2rem 1.4rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 600;
    color: var(--ink-900);
    cursor: pointer;
    text-align: right;
    transition: color var(--transition);
}

.faq-question:hover {
    color: var(--green-700);
}

.faq-icon {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--green-100);
    color: var(--green-700);
    font-size: 1.2rem;
    font-weight: 700;
    transition: transform var(--transition), background var(--transition), color var(--transition);
}

.faq-item.open .faq-icon {
    transform: rotate(45deg);
    background: var(--green-700);
    color: var(--white);
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease;
}

.faq-answer p {
    padding: 0 1.4rem 1.3rem;
    margin: 0;
    font-size: 0.92rem;
    color: var(--ink-500);
    line-height: 1.9;
}

/* ---------- 13. گالری ---------- */
.gallery {
    background: var(--white);
}

.gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1.2rem;
}

.gallery-item {
    position: relative;
    border: none;
    padding: 0;
    background: var(--green-100);
    border-radius: var(--radius-md);
    overflow: hidden;
    cursor: pointer;
    aspect-ratio: 4 / 3;
    box-shadow: var(--shadow-sm);
    transition: transform var(--transition), box-shadow var(--transition);
}

.gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.gallery-item::after {
    content: '🔍';
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    color: var(--white);
    background: rgba(28, 90, 69, 0.45);
    opacity: 0;
    transition: opacity var(--transition);
}

.gallery-item:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
}

.gallery-item:hover img {
    transform: scale(1.08);
}

.gallery-item:hover::after {
    opacity: 1;
}

/* ---------- 14. تماس با ما ---------- */
.contact {
    background: var(--green-50);
}

.contact-grid {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 2.5rem;
    align-items: start;
}

.contact-info {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.contact-item {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    background: var(--white);
    padding: 1.2rem 1.3rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
    transition: transform var(--transition), box-shadow var(--transition);
}

.contact-item:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}

.contact-item .icon {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: var(--green-100);
    color: var(--green-700);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
}

.contact-item h4 {
    margin: 0 0 0.2rem;
    font-size: 0.95rem;
    color: var(--ink-900);
}

.contact-item p {
    margin: 0;
    font-size: 0.88rem;
    color: var(--ink-500);
    line-height: 1.7;
}

.contact-form {
    background: var(--white);
    padding: 2rem;
    border-radius: var(--radius-lg);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-md);
}

.contact-form h3 {
    font-size: 1.3rem;
    margin-bottom: 0.4rem;
    color: var(--ink-900);
}

.contact-form .form-sub {
    font-size: 0.9rem;
    color: var(--ink-500);
    margin-bottom: 1.5rem;
}

.form-group {
    margin-bottom: 1.1rem;
}

.form-group label {
    display: block;
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--ink-700);
    margin-bottom: 0.4rem;
}

.form-group input,
.form-group select,
.form-group textarea {
    width: 100%;
    padding: 0.85rem 1rem;
    font-family: inherit;
    font-size: 0.92rem;
    color: var(--ink-700);
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 10px;
    transition: border-color var(--transition), box-shadow var(--transition), background var(--transition);
    outline: none;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
    border-color: var(--green-500);
    background: var(--white);
    box-shadow: 0 0 0 3px rgba(74, 167, 138, 0.15);
}

.form-group textarea {
    min-height: 120px;
    resize: vertical;
}

.form-group input.error,
.form-group select.error,
,
.form-group textarea.error {
    border-color: #d9534f;
    background: #fdf3f3;
}

.form-error {
    display: none;
    font-size: 0.8rem;
    color: #c0392b;
    margin-top: 0.3rem;
}

.form-error.show {
    display: block;
}

.contact-form .btn-primary {
    width: 100%;
    padding: 0.95rem;
    font-size: 1rem;
}

.form-message {
    display: none;
    margin-top: 1rem;
    padding: 0.9rem 1.1rem;
    border-radius: 10px;
    font-size: 0.9rem;
    font-weight: 500;
}

.form-message.success {
    display: block;
    background: var(--green-100);
    color: var(--green-900);
    border: 1px solid var(--green-300);
}

.form-message.error {
    display: block;
    background: #fdf1f0;
    color: #a33a30;
    border: 1px solid #f0c9c5;
}

/* ---------- 15. فوتر ---------- */
.site-footer {
    background: #143d2f;
    color: rgba(255, 255, 255, 0.82);
    padding: 4rem 0 0;
    margin-top: 0;
    position: relative;
}

.site-footer::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--green-300), var(--green-700), var(--green-300));
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
    gap: 2.5rem;
    padding-bottom: 3rem;
}

.footer-col h4 {
    color: var(--white);
    font-size: 1rem;
    font-weight: 700;
    margin: 0 0 1.1rem;
    position: relative;
    padding-bottom: 0.6rem;
}

.footer-col h4::after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 34px;
    height: 2px;
    background: var(--green-300);
    border-radius: 2px;
}

.footer-logo {
    margin-bottom: 1rem;
}

.footer-logo .logo-text strong {
    color: var(--white);
}

.footer-logo .logo-text small {
    color: rgba(255, 255, 255, 0.6);
}

.footer-desc {
    font-size: 0.9rem;
    line-height: 1.85;
    color: rgba(255, 255, 255, 0.7);
    margin: 0;
    max-width: 320px;
}

.footer-links,
.footer-contact {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li,
.footer-contact li {
    margin-bottom: 0.6rem;
    font-size: 0.9rem;
}

.footer-links a,
.footer-contact a {
    color: rgba(255, 255, 255, 0.75);
    transition: color var(--transition), padding var(--transition);
    display: inline-block;
}

.footer-links a:hover,
.footer-contact a:hover {
    color: var(--green-300);
    padding-right: 4px;
}

.footer-contact li {
    color: rgba(255, 255, 255, 0.75);
    line-height: 1.8;
}

.footer-social {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 1rem;
}

.footer-social a {
    display: inline-block;
    padding: 0.4rem 0.9rem;
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.85);
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 999px;
    transition: background var(--transition), color var(--transition), border-color var(--transition);
}

.footer-social a:hover {
    background: var(--green-700);
    color: var(--white);
    border-color: var(--green-700);
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding: 1.4rem 0;
}

.footer-bottom .container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
}

.footer-bottom p {
    margin: 0;
    font-size: 0.82rem;
    color: rgba(255, 255, 255, 0.65);
}

.footer-note {
    font-size: 0.78rem !important;
    color: rgba(255, 255, 255, 0.45) !important;
}

/* ---------- 16. دکمه بازگشت به بالا ---------- */
.back-to-top {
    position: fixed;
    bottom: 1.6rem;
    left: 1.6rem;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: none;
    background: var(--green-700);
    color: var(--white);
    font-size: 1.3rem;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 22px rgba(28, 90, 69, 0.35);
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: opacity var(--transition), visibility var(--transition), transform var(--transition), background var(--transition);
    z-index: 900;
}

.back-to-top.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.back-to-top:hover {
    background: var(--green-900);
    transform: translateY(-4px);
}

/* ---------- 17. دکمه تماس شناور موبایل ---------- */
.mobile-call-btn {
    display: none;
    position: fixed;
    bottom: 1.4rem;
    left: 1.4rem;
    z-index: 950;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 0.85rem 1.2rem;
    background: var(--green-700);
    color: var(--white);
    border-radius: 999px;
    font-size: 0.9rem;
    font-weight: 600;
    box-shadow: 0 8px 22px rgba(28, 90, 69, 0.4);
    transition: background var(--transition), transform var(--transition);
}

.mobile-call-btn:hover {
    background: var(--green-900);
    color: var(--white);
    transform: translateY(-2px);
}

.mobile-call-btn svg {
    flex-shrink: 0;
}

/* ---------- 18. Lightbox ---------- */
.lightbox {
    position: fixed;
    inset: 0;
    background: rgba(10, 30, 24, 0.92);
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--transition), visibility var(--transition);
}

.lightbox.open {
    opacity: 1;
    visibility: visible;
}

.lightbox img {
    max-width: 90vw;
    max-height: 85vh;
    border-radius: var(--radius-md);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
    transform: scale(0.95);
    transition: transform var(--transition);
}

.lightbox.open img {
    transform: scale(1);
}

.lightbox-close {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.3);
    background: rgba(255, 255, 255, 0.12);
    color: var(--white);
    font-size: 1.8rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background var(--transition), transform var(--transition);
}

.lightbox-close:hover {
    background: rgba(255, 255, 255, 0.25);
    transform: rotate(90deg);
}

/* ---------- 19. واکنش‌گرایی: تبلت (≤ 1024px) ---------- */
@media (max-width: 1024px) {
    .header-inner {
        gap: 1rem;
    }

    .main-nav ul {
        gap: 0.1rem;
    }

    .main-nav a {
        padding: 0.5rem 0.7rem;
        font-size: 0.86rem;
    }

    .about-grid {
        grid-template-columns: 1fr 1fr;
        gap: 2.5rem;
    }

    .footer-grid {
        grid-template-columns: 1.4fr 1fr 1fr;
        gap: 2rem;
    }

    .footer-grid .footer-col:last-child {
        grid-column: 1 / -1;
    }
}

/* ---------- 20. واکنش‌گرایی: تبلت کوچک و موبایل بزرگ (≤ 900px) ---------- */
@media (max-width: 900px) {
    :root {
        --header-h: 70px;
    }

    h1 {
        font-size: 2rem;
    }

    h2 {
        font-size: 1.6rem;
    }

    .section-title {
        font-size: 1.55rem;
    }

    /* منوی موبایل */
    .nav-toggle {
        display: flex;
        order: 3;
    }

    .header-cta {
        display: none;
    }

    .main-nav {
        position: fixed;
        top: var(--header-h);
        right: 0;
        left: 0;
        background: var(--white);
        border-bottom: 1px solid var(--border);
        box-shadow: var(--shadow-md);
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.35s ease;
        z-index: 999;
    }

    .main-nav.open {
        max-height: 480px;
    }

    .main-nav ul {
        flex-direction: column;
        align-items: stretch;
        padding: 1rem 1.25rem 1.4rem;
        gap: 0.3rem;
    }

    .main-nav a {
        padding: 0.75rem 1rem;
        font-size: 0.98rem;
        border-radius: 10px;
    }

    .main-nav a.active::after {
        display: none;
    }

    /* اسلایدر */
    .hero {
        height: 78vh;
        min-height: 480px;
    }

    .slide-content h1,
    .slide-content h2 {
        font-size: 2rem;
    }

    .slide-content p {
        font-size: 0.98rem;
    }

    .slider-arrow {
        width: 42px;
        height: 42px;
    }

    .slider-arrow.prev {
        right: 1rem;
    }

    .slider-arrow.next {
        left: 1rem;
    }

    /* درباره */
    .about-grid {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }

    .about-image {
        max-width: 520px;
        margin: 0 auto;
    }

    .about-badge {
        right: 10px;
        bottom: -14px;
        padding: 0.8rem 1.1rem;
    }

    .about-content .section-title {
        text-align: right;
    }

    /* تماس */
    .contact-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }

    /* فوتر */
    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 2rem;
    }

    .footer-grid .footer-col:last-child {
        grid-column: 1 / -1;
    }

    .mobile-call-btn {
        display: inline-flex;
    }

    /* دکمه بازگشت به بالا در موبایل بالاتر می‌رود تا با دکمه تماس تداخل نداشته باشد */
    .back-to-top {
        bottom: 5.2rem;
        left: 1.4rem;
    }
}

/* ---------- 21. واکنش‌گرایی: موبایل (≤ 640px) ---------- */
@media (max-width: 640px) {
    body {
        font-size: 15px;
    }

    .section {
        padding: 3.5rem 0;
    }

    .container {
        padding: 0 1rem;
    }

    h1 {
        font-size: 1.7rem;
    }

    h2 {
        font-size: 1.35rem;
    }

    .section-title {
        font-size: 1.3rem;
    }

    .section-head {
        margin-bottom: 2rem;
    }

    .section-eyebrow {
        font-size: 0.78rem;
        padding: 0.3rem 0.85rem;
    }

    .btn {
        padding: 0.75rem 1.4rem;
        font-size: 0.88rem;
    }

    /* هدر */
    .logo-text strong {
        font-size: 1rem;
    }

    .logo-text small {
        font-size: 0.68rem;
    }

    .logo-mark svg {
        width: 34px;
        height: 34px;
    }

    /* اسلایدر */
    .hero {
        height: 72vh;
        min-height: 440px;
    }

    .slide-content h1,
    .slide-content h2 {
        font-size: 1.55rem;
    }

    .slide-content p {
        font-size: 0.9rem;
        margin-bottom: 1.4rem;
    }

    .slide-actions {
        flex-direction: column;
        align-items: stretch;
        gap: 0.6rem;
    }

    .slide-actions .btn {
        width: 100%;
    }

    .slider-arrow {
        width: 36px;
        height: 36px;
        font-size: 0.85rem;
    }

    .slider-dots {
        bottom: 1rem;
    }

    .slider-dots button {
        width: 9px;
        height: 9px;
    }

    /* کارت‌های خدمات */
    .service-card {
        padding: 1.6rem 1.3rem;
    }

    .service-icon {
        width: 52px;
        height: 52px;
    }

    /* مراحل */
    .steps-list {
        grid-template-columns: 1fr;
    }

    .step {
        padding: 1.7rem 1.2rem 1.3rem;
    }

    /* FAQ */
    .faq-question {
        padding: 1rem 1.1rem;
        font-size: 0.92rem;
    }

    .faq-answer p {
        padding: 0 1.1rem 1.1rem;
        font-size: 0.88rem;
    }

    /* گالری */
    .gallery-grid {
        grid-template-columns: 1fr 1fr;
        gap: 0.8rem;
    }

    /* فرم تماس */
    .contact-form {
        padding: 1.5rem 1.2rem;
    }

    .contact-form h3 {
        font-size: 1.15rem;
    }

    /* فوتر */
    .footer-grid {
        grid-template-columns: 1fr;
        gap: 1.8rem;
    }

    .footer-grid .footer-col:last-child {
        grid-column: auto;
    }

    .footer-bottom .container {
        flex-direction: column;
        text-align: center;
    }

    /* Lightbox */
    .lightbox {
        padding: 1rem;
    }

    .lightbox-close {
        top: 0.8rem;
        right: 0.8rem;
        width: 40px;
        height: 40px;
        font-size: 1.5rem;
    }

    .lightbox img {
        max-width: 95vw;
        max-height: 80vh;
    }

    /* دکمه‌های شناور */
    .mobile-call-btn {
        bottom: 1rem;
        left: 1rem;
        padding: 0.75rem 1rem;
        font-size: 0.85rem;
    }

    .back-to-top {
        bottom: 4.6rem;
        left: 1rem;
        width: 42px;
        height: 42px;
        font-size: 1.1rem;
    }
}

/* ---------- 22. واکنش‌گرایی: موبایل خیلی کوچک (≤ 380px) ---------- */
@media (max-width: 380px) {
    .gallery-grid {
        grid-template-columns: 1fr;
    }

    .slide-content h1,
    .slide-content h2 {
        font-size: 1.35rem;
    }

    .header-inner {
        gap: 0.5rem;
    }
}

/* ---------- 23. حالت کاهش حرکت ---------- */
@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }

    .reveal {
        opacity: 1;
        transform: none;
    }
}
/* اصلاح نهایی: کارت‌های روشن و رنگ سبز پاستیلی */
.why-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.why-card, .service-card, .team-card, .article-card {
    background: #f5fbf7;
    border-color: #dcefe4;
    color: #384a50;
}
.why-card:hover, .service-card:hover, .team-card:hover, .article-card:hover {
    background: #ffffff;
}
.hero-slider .slide:first-child .slide-overlay {
    background: linear-gradient(to left,
      rgba(15,55,42,.48) 0%,
      rgba(15,55,42,.24) 55%,
      rgba(15,55,42,.08) 100%);
}
@media (max-width: 900px) {
    .why-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
    .why-grid { grid-template-columns: 1fr; }
}


/* =====================================================================
   پنجره روشنایی — بازطراحی ویژه بخش اول صفحه (بدون تغییر کارت‌های پاستیلی)
   ===================================================================== */
.hero {
    isolation: isolate;
    background: #164d3d;
    min-height: 620px;
    max-height: 880px;
}
.hero::after {
    content: "";
    pointer-events: none;
    position: absolute;
    inset: auto 0 0;
    height: 100px;
    z-index: 3;
    background: linear-gradient(to top, rgba(5, 40, 30, .14), transparent);
}
.hero .slide {
    background-color: #174c3b;
    overflow: hidden;
}
.hero .slide:nth-child(2) { background-color: #1a5449; }
.hero .slide:nth-child(3) { background-color: #1d5647; }
.hero .slide::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
      radial-gradient(ellipse at 22% 30%, rgba(167, 240, 192, .33) 0%, transparent 39%),
      radial-gradient(ellipse at 69% 75%, rgba(83, 183, 144, .26) 0%, transparent 45%),
      linear-gradient(120deg, rgba(20, 92, 69, .76), rgba(12, 60, 47, .84));
}
.hero .slide::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background-image: linear-gradient(rgba(255,255,255,.065) 1px,transparent 1px),
                      linear-gradient(90deg,rgba(255,255,255,.065) 1px,transparent 1px);
    background-size: 80px 80px;
    mask-image: linear-gradient(to right, rgba(0,0,0,.45),transparent 90%);
    -webkit-mask-image: linear-gradient(to right,rgba(0,0,0,.45),transparent 90%);
    opacity: .34;
}
.hero .slide-overlay {
    background: linear-gradient(to left, rgba(9,52,39,.48), rgba(14,61,46,.30) 46%, rgba(15,64,47,.12) 100%);
    z-index: 1;
}
/* Only the first slide stays a little brighter as requested. */
.hero .slide:first-child .slide-overlay {
    background: linear-gradient(to left, rgba(7,51,36,.36), rgba(9,55,39,.22) 54%, rgba(10,62,44,.08));
}
.hero .slide-content {
    z-index: 4;
    width: 100%;
    max-width: var(--container);
    padding-top: 3.1rem;
    padding-bottom: 3.6rem;
    margin: 0 auto;
    position: relative;
}
.hero .slide-content > .slide-eyebrow,
.hero .slide-content > h1,
.hero .slide-content > h2,
.hero .slide-content > p,
.hero .slide-content > .slide-actions,
.hero .slide-content > .hero-promises {
    max-width: min(620px, 53%);
}
.hero .slide-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .7rem;
    border: 1px solid rgba(211, 255, 228, .3);
    background: rgba(220, 255, 232, .12);
    padding: .55rem 1.15rem;
    font-size: .86rem;
    font-weight: 600;
    color: #e2ffed;
    margin-bottom: 1.55rem;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.11);
}
.hero-eyebrow-dot {
    flex: none;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #adf6c9;
    box-shadow: 0 0 0 5px rgba(173,246,201,.13), 0 0 16px rgba(173,246,201,.55);
}
.hero .slide-content h1,
.hero .slide-content h2 {
    font-size: clamp(2.75rem, 4vw, 4.85rem);
    font-weight: 800;
    line-height: 1.42;
    letter-spacing: -.045em;
    margin: 0 0 1.35rem;
    text-wrap: balance;
    text-shadow: 0 10px 38px rgba(0,32,22,.1);
}
.hero .slide-content h1 span,
.hero .slide-content h2 span {
    color: #b6f4cc;
    display: inline;
    background-image: linear-gradient(120deg, #e5ffeb 0%, #a2e8c4 80%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.hero .slide-content p {
    position: relative;
    padding-right: 1.15rem;
    border-right: 3px solid rgba(176, 240, 198, .83);
    color: rgba(245, 255, 249, .93);
    font-size: clamp(.96rem, 1.13vw, 1.11rem);
    line-height: 2.08;
    margin-bottom: 2rem;
    font-weight: 400;
}
.hero .slide-actions {
    gap: 1rem;
    margin-bottom: 2.15rem;
}
.hero .slide-actions .btn {
    min-height: 55px;
    padding: .9rem 1.65rem;
    border-radius: 15px;
    font-size: .97rem;
    font-weight: 700;
    gap: .55rem;
    box-shadow: none;
    transition: transform .28s ease, background .28s ease, border-color .28s ease, box-shadow .28s ease;
}
.hero .slide-actions .btn-primary {
    background: #b2efc9;
    border-color: #b2efc9;
    color: #114c38;
    box-shadow: 0 12px 30px rgba(7, 40, 29, .16);
}
.hero .slide-actions .btn-primary:hover {
    background: #d3f9e1;
    border-color: #d3f9e1;
    color: #0e4935;
    transform: translateY(-3px);
    box-shadow: 0 16px 34px rgba(7,40,29,.22);
}
.hero .slide-actions .btn-outline {
    background: rgba(255,255,255,.08);
    border-color: rgba(237,255,244,.48);
    color: #fff;
    backdrop-filter: blur(8px);
}
.hero .slide-actions .btn-outline:hover {
    background: rgba(255,255,255,.18);
    border-color: rgba(255,255,255,.85);
    transform: translateY(-3px);
    color: #fff;
}
.hero .slide-actions .btn-primary::after {
    content: "↖";
    font-size: 1.1rem;
    line-height: 1;
}
.hero .hero-promises {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    column-gap: 1.4rem;
    row-gap: .7rem;
    color: rgba(243,255,248,.81);
    font-size: .83rem;
    font-weight: 500;
}
.hero .hero-promises > span {display: inline-flex;align-items: center;gap: .45rem;white-space: nowrap;}
.hero-promise-check {
    width: 19px;
    height: 19px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #b9f4d0;
    background: rgba(175, 241, 195, .13);
    font-size: .75rem;
}
/* A luminous four-pane window: beautiful even before real clinic photos arrive. */
.hero-composition {
    position: absolute;
    left: clamp(42px, 8.7%, 170px);
    top: 49%;
    transform: translateY(-50%);
    width: clamp(315px, 34vw, 485px);
    height: clamp(360px, 37vw, 535px);
    z-index: 3;
    pointer-events: none;
    filter: drop-shadow(0 23px 35px rgba(3, 39, 28, .17));
}
.hero-halo {
    position: absolute;
    width: 105%;
    aspect-ratio: 1;
    left: -2%;
    top: 1%;
    border-radius: 50%;
    border: 1px solid rgba(223,255,236,.18);
    background: radial-gradient(circle, rgba(177,245,207,.16), rgba(177,245,207,.045) 53%, transparent 70%);
    box-shadow: 0 0 0 34px rgba(223,255,236,.025),0 0 0 68px rgba(223,255,236,.014);
}
.hero-arch {
    position: absolute;
    inset: 3% 12% 7% 12%;
    overflow: hidden;
    border: 11px solid rgba(247,255,247,.82);
    border-bottom-width: 13px;
    border-radius: 48% 48% 22px 22px / 37% 37% 22px 22px;
    background: linear-gradient(157deg, #dfffe9 2%, #b8ecd2 30%, #7fcca9 63%, #419477 100%);
    box-shadow: inset 0 0 0 3px rgba(19,86,63,.13), inset 0 7px 28px rgba(255,255,255,.25),0 20px 58px rgba(2,40,29,.25), 0 0 0 8px rgba(255,255,255,.07);
}
.hero-arch::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(117deg,rgba(255,255,255,.56) 0%,rgba(255,255,255,.12) 32%,transparent 32.3%,transparent 65%,rgba(255,255,255,.13) 65.2%,transparent 75%);
    z-index: 5;
}
.hero-sun {
    position: absolute;
    width: 44%;
    aspect-ratio: 1;
    background: #efffdf;
    border-radius: 50%;
    top: 23%;
    left: 24%;
    box-shadow: 0 0 0 22px rgba(249,255,214,.14),0 0 80px 40px rgba(255,253,215,.35);
    opacity: .95;
}
.hero-hill {
    position: absolute;
    height: 52%;
    border-radius: 50% 50% 0 0 / 60% 60% 0 0;
    width: 155%;
    left: -20%;
    bottom: -22%;
    background: #58aa87;
}
.hero-hill-back { transform: rotate(-11deg); bottom: -11%; left: -53%;background: linear-gradient(150deg,#7bc8a3,#379372); }
.hero-hill-front { transform: rotate(15deg); left: 12%;background: linear-gradient(150deg,#65ae8e,#25745c);bottom:-22%; }
.hero-mullion {position: absolute;z-index:6;background:rgba(255,255,253,.84);box-shadow: 0 0 0 2px rgba(44,116,83,.1);}
.hero-mullion-v { width: 10px; top: 0;bottom:0;left:calc(50% - 5px); }
.hero-mullion-h { height: 10px;top: 54%;left:0;right:0; }
.hero-spark {position: absolute;color: #e4ffe9;filter:drop-shadow(0 0 14px rgba(193,255,221,.7));}
.hero-spark-one {top: 4%;right: 0%;font-size:2rem;}
.hero-spark-two {left: 1%;bottom: 17%;font-size:2.5rem;}
.hero-floating-note {
    position: absolute;
    bottom: 1%;
    left: -5%;
    display: inline-flex;
    align-items: center;
    gap: .8rem;
    direction: rtl;
    border-radius: 16px;
    padding: .85rem 1.1rem;
    background: rgba(253,255,250,.93);
    border: 1px solid rgba(255,255,255,.75);
    box-shadow: 0 17px 44px rgba(10,57,40,.18);
    color: #1b654b;
    font-size: .88rem;
    font-weight: 700;
    white-space: nowrap;
    backdrop-filter: blur(12px);
}
.hero-note-mark {
    background: #e2f9ec;
    color: #28865b;
    width: 31px;
    height: 31px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
}
.hero .slider-arrow {
    border-color: rgba(218,254,229,.32);
    background: rgba(241,255,246,.12);
    backdrop-filter: blur(12px);
    width: 43px;
    height: 43px;
}
.hero .slider-arrow:hover {background:rgba(241,255,246,.28);}
.hero .slider-dots {bottom: 1.65rem;gap:.45rem;}
.hero .slider-dots button {
    border-radius: 6px;
    height: 7px;
    width: 8px;
    background: rgba(225,255,231,.42);
    transition: width .3s ease, background .3s ease;
}
.hero .slider-dots button.active {width: 35px;background: #b5f3ca; transform:none;}
.hero-scroll-hint {
    position: absolute;
    z-index: 5;
    right: max(5.2%, calc((100vw - var(--container))/2 + 1.25rem));
    bottom: 1.35rem;
    display: flex;
    align-items: center;
    gap:.65rem;
    color: rgba(236,255,243,.87);
    font-size: .82rem;
    font-weight: 500;
    transition: color .25s ease;
}
.hero-scroll-hint:hover {color:#fff;}
.hero-scroll-line {width: 24px;height: 1px;background:rgba(219,255,231,.58);}
.hero-scroll-arrow {font-size:1.2rem;}
@media (max-width: 1120px) {
    .hero-composition {left: 5%; width: 35vw;height: 42vw;}
    .hero .slide-content > .slide-eyebrow,
    .hero .slide-content > h1,
    .hero .slide-content > h2,
    .hero .slide-content > p,
    .hero .slide-content > .slide-actions,
    .hero .slide-content > .hero-promises {max-width: 56%;}
    .hero .slide-content h1,.hero .slide-content h2 {font-size:clamp(2.45rem,4.25vw,3.9rem);}
}
@media (max-width: 900px) {
    .hero {height: calc(100svh - var(--header-h));min-height:630px;}
    .hero-composition {opacity:.33; left:-8%; top:45%; width:54vw;height:63vw;filter:none;}
    .hero-floating-note {display:none;}
    .hero .slide-content > .slide-eyebrow,
    .hero .slide-content > h1,
    .hero .slide-content > h2,
    .hero .slide-content > p,
    .hero .slide-content > .slide-actions,
    .hero .slide-content > .hero-promises {max-width: 85%;}
    .hero .slide-content h1,.hero .slide-content h2 {font-size:clamp(2.4rem,6.1vw,3.6rem);}
}
@media (max-width: 640px) {
    .hero {height: calc(100svh - var(--header-h));min-height:600px; max-height:850px;}
    .hero .slide-content {padding-top: 1.1rem;padding-bottom:3.8rem;}
    .hero .slide-content > .slide-eyebrow,
    .hero .slide-content > h1,
    .hero .slide-content > h2,
    .hero .slide-content > p,
    .hero .slide-content > .slide-actions,
    .hero .slide-content > .hero-promises {max-width: 100%;}
    .hero .slide-content h1,.hero .slide-content h2 {font-size:clamp(2.2rem,8vw,3.1rem);line-height:1.48; margin-bottom:1rem;}
    .hero .slide-eyebrow {font-size:.76rem;margin-bottom:1.1rem;}
    .hero .slide-content p {font-size:.94rem;line-height:1.95;margin-bottom:1.4rem;}
    .hero .slide-actions {flex-direction:row;gap:.7rem;margin-bottom:1.45rem;}
    .hero .slide-actions .btn {min-height:49px;border-radius:12px;font-size:.84rem;padding:.7rem 1.05rem;flex:1;white-space:normal;}
    .hero .hero-promises {font-size:.75rem;gap:.55rem 1rem;}
    .hero-composition {opacity:.12;left:-40%;top:47%;width:95vw;height:117vw;}
    .hero .slider-arrow {width:36px;height:36px;font-size:.78rem;top:auto;bottom:1.2rem;transform:none;}
    .hero .slider-arrow.prev {right:1rem;}
    .hero .slider-arrow.next {left:auto;right:3.9rem;}
    .hero .slider-arrow:hover {transform:none;}
    .hero .slider-dots {bottom:2rem;}
    .hero-scroll-hint {display:none;}
}
@media (max-width: 380px) {
    .hero .slide-content h1,.hero .slide-content h2 {font-size:2rem;}
    .hero .slide-content p {font-size:.88rem;}
    .hero .hero-promises {font-size:.7rem;}
}
@media (prefers-reduced-motion: reduce) {
    .hero .slide-actions .btn {transition:none;}
}

/* ===== Clinical visual reset: contemporary, calm, non-religious ===== */
:root {
  --green-900: #234f57;
  --green-700: #347f83;
  --green-600: #388b8e;
  --green-500: #5a9da1;
  --green-300: #93c6c4;
  --green-100: #e9f4f3;
  --green-50: #f3f9f8;
  --border: #deebea;
  --bg: #fcfdfd;
}
.hero .slide, .hero .slide:nth-child(2), .hero .slide:nth-child(3) {
  background-color:#e8f4f3;
  background-image:none !important;
}
.hero .slide::before {
  background: radial-gradient(ellipse at 15% 75%,rgba(139,200,205,.22),transparent 48%),
              radial-gradient(ellipse at 89% 15%,rgba(200,229,225,.53),transparent 44%),
              linear-gradient(115deg,#f6fbfa,#e8f4f2 60%,#e6f0f3);
}
.hero .slide::after {
  background-image:linear-gradient(rgba(44,112,117,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(44,112,117,.04) 1px,transparent 1px);
  opacity:.35;mask-image:none;-webkit-mask-image:none;
}
.hero .slide-overlay,.hero .slide:first-child .slide-overlay{background:none !important;}
.hero-composition,.hero-halo,.hero-arch,.hero-sun,.hero-hill,.hero-mullion,.hero-spark,.hero-floating-note{display:none !important;}
.hero .slide-content {display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding-top:2.5rem;padding-bottom:4rem;}
.hero .slide-content > .slide-eyebrow,
.hero .slide-content > h1,
.hero .slide-content > h2,
.hero .slide-content > p,
.hero .slide-content > .slide-actions,
.hero .slide-content > .hero-promises{max-width:min(650px,75%);}
.hero .slide-eyebrow {background:#ffffffce;border:1px solid #c5e0df;color:#36747a;box-shadow:0 3px 15px rgba(44,91,102,.05);}
.hero-eyebrow-dot {background:#64a8a9;box-shadow:0 0 0 5px rgba(98,169,169,.13);}
.hero .slide-content h1,.hero .slide-content h2 {color:#234f57;text-shadow:none;font-size:clamp(2.7rem,4.1vw,4.8rem);}
.hero .slide-content h1 span,.hero .slide-content h2 span {
  color:#31838b;background:none;-webkit-text-fill-color:currentColor;
}
.hero .slide-content p {color:#4c6d73;border-color:#73b6b4;font-weight:500;}
.hero .slide-actions .btn-primary {background:#287c83;color:white;border-color:#287c83;box-shadow:0 10px 26px rgba(40,124,131,.18);}
.hero .slide-actions .btn-primary:hover{background:#24656d;color:#fff;border-color:#24656d;}
.hero .slide-actions .btn-outline{background:#fff;color:#296b72;border-color:#b7d8d8;backdrop-filter:none;}
.hero .slide-actions .btn-outline:hover{background:#edf7f6;color:#245b61;border-color:#7fb9b9;}
.hero .hero-promises{color:#55757b;}
.hero-promise-check{background:#d4eeeb;color:#257f82;}
.hero .slider-arrow{background:#ffffffdf;color:#367d83;border-color:#c9e1e0;box-shadow:0 3px 13px rgba(35,79,87,.07);}
.hero .slider-arrow:hover{background:white;}
.hero .slider-dots button{background:#a2c8c9;}
.hero .slider-dots button.active{background:#327e85;}
.hero-scroll-hint{color:#50777c;}.hero-scroll-hint:hover{color:#24575d;}.hero-scroll-line{background:#8dbbbd;}
/* Medical infographic panel: clean data, not symbolic architectural artwork */
.hero .slide-content::after{
  content:'✚  مراقبت تخصصی  •  مشاوره محرمانه  •  پیگیری درمان';
  direction:rtl;
  position:absolute;
  top:50%;left:4%;transform:translateY(-50%);
  width:min(25vw,315px);min-height:145px;
  border-radius:24px;
  display:flex;align-items:center;justify-content:center;text-align:center;
  padding:2rem;line-height:2.2;
  font-size:clamp(1rem,1.4vw,1.25rem);font-weight:700;
  color:#2b6f76;background:rgba(255,255,255,.82);border:1px solid #cce5e3;
  box-shadow:0 18px 48px rgba(46,105,111,.10);
}
.services-grid {grid-template-columns:repeat(3,minmax(0,1fr));}
.service-card,.why-card,.team-card,.article-card{background:#f8fcfb;border-color:#deebea;color:#384a50;}
@media(max-width:1000px){.services-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:900px){.hero .slide-content::after{display:none}.hero .slide-content>.slide-eyebrow,.hero .slide-content>h1,.hero .slide-content>h2,.hero .slide-content>p,.hero .slide-content>.slide-actions,.hero .slide-content>.hero-promises{max-width:100%;}}
@media(max-width:640px){.hero .slide-content h1,.hero .slide-content h2{font-size:clamp(2.05rem,7vw,3.05rem);} .hero .slide-actions .btn{box-shadow:none;}}
@media(max-width:620px){.services-grid{grid-template-columns:1fr;}}

/* ===== Refinement: coherent clinic branding, subtle hero circle, slate footer ===== */
.logo-mark svg {filter:drop-shadow(0 2px 4px rgba(45,105,115,.08));}
.logo-text strong {color:#315b67;}
.hero .slide-content {isolation:isolate;}
.hero .slide-content::before {
    content:"";
    position:absolute;
    z-index:-1;
    width:clamp(240px,35vw,460px);
    aspect-ratio:1;
    border-radius:50%;
    right:0;
    top:50%;
    transform:translate(20%,-50%);
    border:1px solid rgba(74,151,161,.19);
    background:radial-gradient(circle,rgba(190,225,225,.24) 0%,rgba(219,240,238,.09) 62%,transparent 73%);
    box-shadow:0 0 0 22px rgba(110,180,185,.035), 0 0 0 53px rgba(110,180,185,.025);
    pointer-events:none;
}
.hero .slide-content::after {display:none !important;}
.site-footer {background:#2a424c;color:rgba(246,251,252,.88);}
.site-footer::before {height:3px;background:linear-gradient(90deg,#88b9c0,#bcd6da,#88b9c0);}
.site-footer .footer-col h4::after {background:#9dc5c9;}
.site-footer .footer-desc,.site-footer .footer-links a,.site-footer .footer-contact {color:rgba(247,252,253,.78);}
.site-footer .footer-logo .logo-text strong {color:#f7fcfd;}
@media(max-width:640px){
 .hero .slide-content::before {width:290px;right:12%;top:37%;transform:translate(10%,-50%);opacity:.65;}
}


/* ===== User-approved clinic photo hero (warm, clinical, accessible) ===== */
:root { --green-900:#164e46; --green-700:#247a69; --green-600:#318c78; --green-500:#64a992; --green-300:#b1d7bd; --green-100:#e9f5ec; --green-50:#f6faf5; --bg:#fdfbf8; --border:#e5eae3; }
.hero {background:#f7f5ef;}
.hero .slide,.hero .slide:nth-child(2),.hero .slide:nth-child(3){background:#f7f5ef!important;background-image:none!important;}
.hero .slide::before,.hero .slide::after{display:none!important;}
.hero .slide .clinic-photo{position:absolute;inset:0 0 0 auto;width:58%;background-image:url('../images/clinic-hero.jpg');background-size:cover;background-position:center;z-index:0;}
.hero .slide-overlay,.hero .slide:first-child .slide-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,250,242,.04) 20%,rgba(254,251,246,.30) 44%,#fdfbf7 59%,#fdfbf7 100%)!important;z-index:1;}
.hero .slide-content{position:relative;z-index:3;width:100%;max-width:1200px;margin:auto;align-items:flex-end!important;text-align:right;padding:2rem 5.2rem 3.5rem 1.25rem;isolation:initial;}
.hero .slide-content::before,.hero .slide-content::after{display:none!important;}
.hero .slide-content>.slide-eyebrow,.hero .slide-content>h1,.hero .slide-content>h2,.hero .slide-content>p,.hero .slide-content>.slide-actions,.hero .slide-content>.hero-promises{width:45%;max-width:510px;}
.hero .slide-content h1,.hero .slide-content h2{font-size:clamp(2.25rem,3.7vw,4rem);color:#1c3030;line-height:1.5;letter-spacing:-.5px;text-shadow:none;}
.hero .slide-content h1 span,.hero .slide-content h2 span{color:#257a66!important;-webkit-text-fill-color:currentColor!important;}
.hero .slide-content p{font-weight:400;color:#546561;border-right:0;padding-right:0;line-height:2.05;font-size:1rem;}
.hero .slide-eyebrow{background:#eff8ef;border-color:#d7e7db;color:#2a7c67;box-shadow:none;}
.hero .hero-promises{margin-top:.5rem;color:#354d49;gap:1rem;}
.hero .hero-promise-check{background:#e3f1e7;color:#2e7e69;}
.hero .slide-actions .btn-primary{background:#216e5f;border-color:#216e5f;color:white;box-shadow:0 8px 20px rgba(33,110,95,.16);}
.hero .slide-actions .btn-outline{background:#fff;color:#216e5f;border:1px solid #d6e5d9;}
.hero .slider-arrow{background:#fff;color:#287968;border-color:#e3ece4;}
.hero .slider-dots button.active{background:#267963;}
.logo-mark svg rect:nth-child(1),.logo-mark svg rect:nth-child(4){fill:#276f63;}
.logo-mark svg rect:nth-child(2),.logo-mark svg rect:nth-child(3){fill:#a2c9bd;}
.logo-text strong{color:#235b50;}
.site-footer{background:#2d4744;color:#f8faf7;}
.site-footer::before{background:linear-gradient(90deg,#b9d6bb,#e7dfc9,#b9d6bb);}
.service-card,.why-card,.team-card,.article-card{background:#f9fbf7;border-color:#e4ebe4;}
@media(max-width:1000px){.hero .slide-content{padding-right:2.2rem;}.hero .slide-content>.slide-eyebrow,.hero .slide-content>h1,.hero .slide-content>h2,.hero .slide-content>p,.hero .slide-content>.slide-actions,.hero .slide-content>.hero-promises{width:51%;max-width:520px;}.hero .slide .clinic-photo{width:59%;}}
@media(max-width:700px){
 .hero{height:auto;min-height:720px;max-height:none;}
 .hero .slide{min-height:720px;}
 .hero .slide .clinic-photo{inset:0 0 auto 0;height:46%;width:100%;background-position:center 55%;}
 .hero .slide-overlay,.hero .slide:first-child .slide-overlay{background:linear-gradient(to bottom,rgba(251,248,243,.02) 10%,rgba(253,251,247,.25) 30%,#fdfbf7 46%,#fdfbf7 100%)!important;}
 .hero .slide-content{align-items:stretch!important;justify-content:flex-end;padding:280px 1.3rem 4.2rem;min-height:720px;text-align:right;}
 .hero .slide-content>.slide-eyebrow,.hero .slide-content>h1,.hero .slide-content>h2,.hero .slide-content>p,.hero .slide-content>.slide-actions,.hero .slide-content>.hero-promises{width:100%;max-width:none;}
 .hero .slide-content h1,.hero .slide-content h2{font-size:clamp(1.85rem,6vw,2.6rem);margin-bottom:.55rem;}
 .hero .slide-content p{font-size:.88rem;margin-bottom:1.2rem;}
 .hero .slide-eyebrow{align-self:flex-start;}
 .hero .hero-promises{font-size:.7rem;gap:.5rem;margin-top:0;}
 .hero .slider-dots{bottom:1.4rem;}
 .hero .slider-arrow{top:27%;bottom:auto;}
}
@media(max-width:400px){.hero .slide-content{padding-top:258px;}.hero,.hero .slide,.hero .slide-content{min-height:740px;}.hero .slide-actions .btn{font-size:.82rem;padding:.65rem .7rem;}}

/* ===== 2026 update: clear left-side clinic photo and right-aligned text ===== */
.hero .slide .clinic-photo {
  inset: 0 auto 0 0 !important; left: 0 !important; right: auto !important;
  width: 56% !important; background-image: url('../images/clinic-interior.jpg') !important;
  background-position: center center !important; opacity: 1 !important;
}
.hero .slide-overlay,.hero .slide:first-child .slide-overlay {
  background: linear-gradient(to right,rgba(253,251,247,0) 0%,rgba(253,251,247,.03) 30%,rgba(253,251,247,.65) 52%,#fdfbf7 65%,#fdfbf7 100%) !important;
}
.hero .slide-content {align-items:flex-start !important; text-align:right !important; padding-right: 1.25rem !important; padding-left:2rem !important;}
.hero .slide-content > .slide-eyebrow,.hero .slide-content > h1,.hero .slide-content > h2,.hero .slide-content > p,.hero .slide-content > .slide-actions,.hero .slide-content > .hero-promises {width:46%;max-width:540px;}
.hero .slide-content > .slide-eyebrow {align-self:flex-start;}
.about-image img {object-position:center; background:#f1f5ef;}
@media(max-width:1000px){.hero .slide-content{padding-right:1.25rem!important;}.hero .slide-content>.slide-eyebrow,.hero .slide-content>h1,.hero .slide-content>h2,.hero .slide-content>p,.hero .slide-content>.slide-actions,.hero .slide-content>.hero-promises{width:49%;}}
@media(max-width:700px){
  .hero .slide .clinic-photo{inset:0 0 auto 0!important; width:100%!important; height:46%!important; left:0!important;right:0!important;}
  .hero .slide-overlay,.hero .slide:first-child .slide-overlay{background:linear-gradient(to bottom,rgba(253,251,247,0) 10%,rgba(253,251,247,.04) 32%,#fdfbf7 46%,#fdfbf7 100%)!important;}
  .hero .slide-content{padding:280px 1.3rem 4.2rem!important;align-items:stretch!important;}
  .hero .slide-content>.slide-eyebrow,.hero .slide-content>h1,.hero .slide-content>h2,.hero .slide-content>p,.hero .slide-content>.slide-actions,.hero .slide-content>.hero-promises{width:100%;max-width:100%;}
}

/* ===== اصلاح نهایی: تفکیک قطعی عکس و متن بدون فید یا همپوشانی ===== */
.hero .slide {background:#fdfbf7!important;}
.hero .slide .clinic-photo {
    position:absolute!important; left:0!important; right:auto!important; top:0!important; bottom:0!important;
    width:51%!important; height:100%!important; background:url('../images/clinic-interior.jpg') center/cover no-repeat!important;
    opacity:1!important; filter:none!important; border-radius:0!important; z-index:0!important;
}
.hero .slide-overlay,.hero .slide:first-child .slide-overlay {display:none!important; background:none!important;}
.hero .slide-content {
    position:relative!important; display:flex!important; flex-direction:column!important; justify-content:center!important;
    align-items:flex-start!important; width:100%!important; max-width:1200px!important;
    padding:2.7rem 1.25rem 3.9rem!important; margin-inline:auto!important; text-align:right!important;
    overflow:visible!important; z-index:2!important;
}
.hero .slide-content>.slide-eyebrow,.hero .slide-content>h1,.hero .slide-content>h2,
.hero .slide-content>p,.hero .slide-content>.slide-actions,.hero .slide-content>.hero-promises {
    box-sizing:border-box!important; width:44%!important; max-width:500px!important; min-width:0!important;
    margin-left:auto!important; margin-right:0!important; overflow-wrap:break-word!important;
}
.hero .slide-content>.slide-eyebrow {width:fit-content!important; max-width:44%!important; border-radius:999px!important;}
.hero .slide-content>h1,.hero .slide-content>h2 {font-size:clamp(2rem,3.15vw,3.45rem)!important; line-height:1.5!important;}
.hero .slide-content>.slide-actions {display:flex!important; flex-wrap:wrap!important; gap:.65rem!important;}
.hero .slide-content>.hero-promises {display:flex!important; flex-wrap:wrap!important;}
.hero .slide-content::before,.hero .slide-content::after,.hero .slide-eyebrow::before,.hero .slide-eyebrow::after{display:none!important;}
.hero .slide-eyebrow {white-space:normal!important;}
.hero .slider-arrow {z-index:5!important;}
.article-card .article-image img {width:100%;height:100%;object-fit:cover;}
.article-source{font-size:.76rem!important;color:#65766c!important;margin-top:.55rem!important;}
@media(max-width:850px) and (min-width:701px){
 .hero .slide-content>h1,.hero .slide-content>h2{font-size:2.15rem!important;}
 .hero .slide-content>.slide-eyebrow,.hero .slide-content>h1,.hero .slide-content>h2,
 .hero .slide-content>p,.hero .slide-content>.slide-actions,.hero .slide-content>.hero-promises {width:45%!important;}
}
@media(max-width:700px){
 .hero,.hero .slide,.hero .slide-content{min-height:760px!important;}
 .hero .slide .clinic-photo{left:0!important;right:0!important;top:0!important;bottom:auto!important;width:100%!important;height:39%!important;background-position:center!important;}
 .hero .slide-content{justify-content:flex-end!important; padding:320px 1.3rem 4rem!important;}
 .hero .slide-content>.slide-eyebrow,.hero .slide-content>h1,.hero .slide-content>h2,
 .hero .slide-content>p,.hero .slide-content>.slide-actions,.hero .slide-content>.hero-promises{width:100%!important;max-width:100%!important;}
 .hero .slide-content>.slide-eyebrow{width:fit-content!important;max-width:100%!important;}
 .hero .slide-content>h1,.hero .slide-content>h2{font-size:clamp(1.75rem,6.1vw,2.5rem)!important;}
}

/* کارت‌های روایت با طراحی نزدیک‌تر به تجربه خواندن، بدون انتساب ساختگی */
.testimonial-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.testimonial-card { padding: 2rem 1.65rem 1.55rem; background: #fffdf9; border: 1px solid #e6e9df; border-radius: 22px; box-shadow: 0 10px 30px rgba(42,76,65,.055); }
.testimonial-card::before { content: none; }
.testimonial-card h3 { font-size: 1.16rem; line-height: 1.8; color: #2b4c48; margin: .55rem 0 .85rem; }
.testimonial-card p { line-height: 2.05; color: #52635e; font-size: .95rem; min-height: 140px; }
.review-kicker { display: inline-flex; align-items: center; gap: .5rem; font-size: .78rem; font-weight: 700; color: #527e70; }
.review-kicker::before { content: ''; height: 7px; width: 7px; border-radius: 50%; background: #c09f76; }
.testimonial-author { border-top: 1px solid #e5ece7; color: #667c70; font-size: .82rem; }
.reviews-editorial-note { text-align: center; margin: 1.5rem 0 0; color: #7a827d; font-size: .75rem; }
@media (max-width: 960px) { .testimonial-grid { grid-template-columns: 1fr; } .testimonial-card p { min-height: 0; } }

/* ===== صفحه اول نهایی، روشن و دقیقاً دو ستون مستقل ===== */
.hero { background: #fdfbf7!important; }
.hero .slide { background:#fdfbf7!important; }
.hero .slide .clinic-photo { left:0!important;right:auto!important;top:0!important;bottom:0!important;width:50%!important;height:100%!important;opacity:1!important;filter:none!important;background: url('../images/clinic-interior.jpg') center / cover no-repeat!important;border-radius:0!important; }
.hero .slide-overlay { display:none!important; }
.hero .slide-content { box-sizing:border-box!important; max-width:1200px!important; width:100%!important; min-height:600px!important; padding:2.5rem 1.5rem 3.5rem!important; display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:flex-start!important;direction:rtl!important;text-align:right!important; }
.hero .slide-content>.slide-eyebrow,.hero .slide-content>h1,.hero .slide-content>h2,.hero .slide-content>p,.hero .slide-content>.slide-actions,.hero .slide-content>.hero-promises { box-sizing:border-box!important;width:46%!important;max-width:480px!important;margin-left:auto!important;margin-right:0!important;min-width:0!important;overflow-wrap:anywhere!important; }
.hero .slide-content>.slide-eyebrow { width:fit-content!important;max-width:46%!important;white-space:normal!important; }
.hero .slide-content>h1,.hero .slide-content>h2 {font-size:clamp(1.9rem,3.2vw,3.2rem)!important;line-height:1.48!important; }
.hero .slide-content>.slide-actions {display:flex!important;flex-wrap:wrap!important;gap:.65rem!important;}
.hero .slide-content::before,.hero .slide-content::after,.hero .slide-eyebrow::before,.hero .slide-eyebrow::after { display:none!important; }
.hero .slide .clinic-photo::before,.hero .slide .clinic-photo::after{display:none!important;}
.hero .slider-arrow {z-index:5!important;}
.btn-consult-call{background:#fff;border:1px solid #cddfd3;color:#216e5f;margin-top:.6rem;}
.btn-consult-call:hover{background:#edf6ef;color:#164e46;}
.contact-form .form-sub {max-width:48ch;}
@media(min-width:701px) and (max-width:1100px){
 .hero .slide-content>.slide-eyebrow,.hero .slide-content>h1,.hero .slide-content>h2,.hero .slide-content>p,.hero .slide-content>.slide-actions,.hero .slide-content>.hero-promises{width:45%!important;max-width:440px!important;}
 .hero .slide-content>.slide-eyebrow{width:fit-content!important;max-width:45%!important;}
 .hero .slide-content>h1,.hero .slide-content>h2{font-size:clamp(1.7rem,3vw,2.6rem)!important;}
}
@media(max-width:700px){
 .hero,.hero .slide{height:auto!important;min-height:780px!important;max-height:none!important;}
 .hero .slide .clinic-photo {top:0!important;left:0!important;right:0!important;bottom:auto!important;width:100%!important;height:38%!important;background-position:center!important;}
 .hero .slide-content{min-height:780px!important;padding:315px 1.2rem 4rem!important;justify-content:flex-end!important;align-items:stretch!important;}
 .hero .slide-content>.slide-eyebrow,.hero .slide-content>h1,.hero .slide-content>h2,.hero .slide-content>p,.hero .slide-content>.slide-actions,.hero .slide-content>.hero-promises{width:100%!important;max-width:100%!important;}
 .hero .slide-content>.slide-eyebrow{width:fit-content!important;max-width:100%!important;}
 .hero .slide-content>h1,.hero .slide-content>h2{font-size:clamp(1.75rem,6vw,2.4rem)!important;}
 .hero .slider-arrow{top:19%!important;}
}