/* ============================================================
   Ecopharmagri About page — page-only styles
   يعتمد على css/style.css للخطوط والألوان العامة والثيم.
   لا يحتوي على تنسيقات فوتر.
   ============================================================ */
.about-page-content{overflow:hidden;background:var(--body-bg);color:var(--body-text)}
.dark .about-page-content{background:var(--night-body);color:var(--night-text)}
.about-container{width:min(100% - 40px,1200px);margin-inline:auto}
.about-hero{position:relative;isolation:isolate;display:flex;align-items:center;min-height:clamp(510px,64vw,690px);overflow:hidden;background:#163d24;color:#fff}
.about-hero-image,.about-hero-overlay{position:absolute;inset:0;z-index:-2}
.about-hero-image{background-image:url('../images/Agencie-1.jpeg');background-size:cover;background-position:center 52%;transform:scale(1.02);animation:aboutHeroDrift 18s ease-in-out infinite alternate}
.about-hero-overlay{z-index:-1;background:linear-gradient(90deg,rgba(5,26,13,.88),rgba(7,39,19,.68) 45%,rgba(8,34,16,.25)),linear-gradient(0deg,rgba(3,20,10,.28),transparent 50%)}
[dir="rtl"] .about-hero-overlay{background:linear-gradient(270deg,rgba(5,26,13,.88),rgba(7,39,19,.68) 45%,rgba(8,34,16,.25)),linear-gradient(0deg,rgba(3,20,10,.28),transparent 50%)}
.about-hero-content{width:min(100% - 40px,1200px);margin-inline:auto;padding:90px 0 110px;max-width:1200px}
.eyebrow,.section-kicker{display:inline-flex;align-items:center;gap:9px;color:var(--brand-dark);font-size:.84rem;font-weight:900;letter-spacing:.02em}
.about-hero .eyebrow{padding:9px 14px;border:1px solid rgba(255,255,255,.26);border-radius:999px;background:rgba(255,255,255,.1);color:#fff;backdrop-filter:blur(8px)}
.eyebrow-dot{width:8px;height:8px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 5px rgba(245,158,11,.16)}
.about-hero h1{max-width:800px;margin:24px 0 17px;color:#fff;font-size:clamp(2.6rem,6.5vw,5.3rem);font-weight:900;line-height:1.2;letter-spacing:-.04em;text-wrap:balance}
.about-hero h1 span{color:#f8bd45}
.about-hero-content>p{max-width:640px;margin:0;color:#e2eee5;font-size:clamp(1rem,1.8vw,1.2rem);line-height:2}
.about-hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.about-button{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:49px;padding:12px 20px;border:1px solid transparent;border-radius:12px;font-size:.94rem;font-weight:900;transition:transform .25s,background .25s,border-color .25s,box-shadow .25s}
.about-button:hover{transform:translateY(-3px)}
.about-button-primary{background:var(--brand);color:#1f2a18;box-shadow:0 10px 25px rgba(245,158,11,.22)}
.about-button-primary:hover{background:#ffc34c;box-shadow:0 14px 30px rgba(245,158,11,.28)}
.about-button-glass{border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.08);color:#fff;backdrop-filter:blur(8px)}
.about-button-glass:hover{background:rgba(255,255,255,.17)}
.hero-side-note{position:absolute;inset-inline-end:clamp(20px,4vw,54px);bottom:34px;display:flex;align-items:center;gap:12px;color:rgba(255,255,255,.78);font-size:.76rem;font-weight:800;letter-spacing:.08em}
.hero-side-note span:first-child{color:#f8bd45;font-size:1.1rem}.hero-side-note i{display:block;width:42px;height:1px;background:rgba(255,255,255,.55)}
.about-breadcrumbs,.contact-breadcrumbs{display:flex;align-items:center;flex-wrap:wrap;gap:10px;width:min(100% - 40px,1200px);margin:0 auto;padding:18px 0;color:#748278;font-size:.86rem;font-weight:700}
.about-breadcrumbs a,.contact-breadcrumbs a{color:var(--brand-dark)}.dark .about-breadcrumbs,.dark .contact-breadcrumbs{color:#a9b9ad}.dark .about-breadcrumbs a,.dark .contact-breadcrumbs a{color:#9be1a8}
.about-section{padding:clamp(64px,8vw,110px) 0}
.about-intro-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.94fr);align-items:center;gap:clamp(35px,7vw,90px)}
.about-intro-copy h2,.feature-copy h2{margin:13px 0 18px;color:var(--body-text);font-size:clamp(2rem,4vw,3.2rem);font-weight:900;line-height:1.35;letter-spacing:-.025em}
.about-intro-copy h2 span{color:var(--brand-dark)}.dark .about-intro-copy h2,.dark .feature-copy h2{color:#f2f7f3}.dark .about-intro-copy h2 span{color:#f6b83f}
.about-intro-copy p,.feature-copy>p{color:#65746a;font-size:1rem;line-height:2.1}.dark .about-intro-copy p,.dark .feature-copy>p{color:#bdcbbf}
.about-intro-copy .intro-lead{color:var(--body-text);font-size:1.14rem;font-weight:800;line-height:1.95}.dark .about-intro-copy .intro-lead{color:#e1eee4}
.text-link{display:inline-flex;align-items:center;gap:10px;margin-top:12px;color:var(--brand-dark);font-weight:900}.text-link span{transition:transform .2s}.text-link:hover span{transform:translate(-3px,-3px)}.dark .text-link{color:#f6b83f}
.about-intro-visual{position:relative;min-height:480px;padding:12px 22px 28px 0}.intro-image-main{position:absolute;inset:0 12% 8% 0;overflow:hidden;border-radius:26px 110px 26px 26px;background:#e2ebe1;box-shadow:0 24px 50px rgba(16,57,29,.14)}
.intro-image-main img,.intro-image-small img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}.about-intro-visual:hover img{transform:scale(1.04)}
.intro-image-small{position:absolute;inset:auto auto 0 0;width:43%;height:43%;overflow:hidden;border:8px solid var(--body-bg);border-radius:22px;background:#dfe9df;box-shadow:0 18px 40px rgba(0,0,0,.14)}.dark .intro-image-small{border-color:var(--night-body)}
.intro-stamp{position:absolute;inset:36px 0 auto auto;display:flex;flex-direction:column;align-items:center;justify-content:center;width:112px;height:112px;border:1px solid rgba(255,255,255,.7);border-radius:50%;background:var(--brand);color:#26341d;box-shadow:0 12px 28px rgba(0,0,0,.14);transform:rotate(8deg)}.intro-stamp .stamp-leaf{font-size:1.6rem}.intro-stamp strong{font-size:1.08rem}.intro-stamp small{font-size:.68rem;font-weight:800}
.about-values{position:relative;background:var(--surface)}.dark .about-values{background:#0e2416}.section-heading{text-align:center;max-width:760px;margin:0 auto 38px}.section-heading h2{margin:12px 0 10px;color:var(--body-text);font-size:clamp(1.9rem,4vw,2.8rem);font-weight:900;line-height:1.4}.section-heading>p{margin:0;color:#738078;font-size:.98rem;line-height:1.9}.dark .section-heading h2{color:#f2f7f3}.dark .section-heading>p{color:#aebdb2}
.values-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.value-card{position:relative;isolation:isolate;min-height:300px;overflow:hidden;padding:30px;border:1px solid var(--border);border-radius:20px;background:var(--body-bg);transition:transform .3s,border-color .3s,box-shadow .3s}.value-card:hover{transform:translateY(-7px);border-color:rgba(38,122,55,.42);box-shadow:0 22px 45px rgba(15,60,29,.1)}.dark .value-card{border-color:var(--night-border);background:#112719}.value-card:after{position:absolute;z-index:-1;inset:auto -30px -70px auto;width:190px;height:190px;border:1px solid rgba(38,122,55,.13);border-radius:50%;content:""}.value-number{position:absolute;top:22px;inset-inline-end:25px;color:#b8c5ba;font-size:.82rem;font-weight:900;letter-spacing:.1em}.dark .value-number{color:#5f7867}.value-icon{display:grid;place-items:center;width:58px;height:58px;margin-bottom:24px;border-radius:17px;background:rgba(38,122,55,.1);color:var(--brand-dark);font-size:1.8rem;font-weight:900}.mission-card .value-icon{background:rgba(245,158,11,.16);color:#bd7908}.goals-card .value-icon{background:rgba(24,135,171,.12);color:#1680a2}.dark .value-icon{color:#9be1a8}.dark .mission-card .value-icon{color:#f6b83f}.dark .goals-card .value-icon{color:#8dd5e8}.value-card h3{margin:0 0 12px;font-size:1.35rem;font-weight:900}.value-card p{margin:0;color:#69786e;font-size:.94rem;line-height:2}.dark .value-card p{color:#b7c7bc}.value-line{display:block;width:48px;height:3px;margin-top:24px;border-radius:3px;background:var(--brand)}
.feature-grid{display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1fr);align-items:center;gap:clamp(35px,7vw,88px)}.feature-art{position:relative;min-height:440px;overflow:hidden;border-radius:24px;background:#dce8dc}.feature-art:after{position:absolute;inset:45% 0 0;background:linear-gradient(0deg,rgba(3,25,11,.8),transparent);content:""}.feature-art img{position:absolute;width:100%;height:100%;object-fit:cover;transition:transform .8s}.feature-art:hover img{transform:scale(1.04)}.feature-art-caption{position:absolute;z-index:1;inset:auto 28px 26px;color:#fff}.feature-art-caption span{display:block;margin-bottom:7px;color:#f7c35b;font-size:.84rem;font-weight:800}.feature-art-caption strong{font-size:1.65rem;font-weight:900}.feature-copy h2{font-size:clamp(1.9rem,3.6vw,2.7rem)}.check-list{display:grid;gap:13px;margin:25px 0 0;padding:0;list-style:none}.check-list li{display:flex;align-items:flex-start;gap:11px;color:var(--body-text);font-size:.95rem;font-weight:700;line-height:1.8}.dark .check-list li{color:#d9e7dc}.check-list li span{display:grid;place-items:center;flex:0 0 24px;width:24px;height:24px;margin-top:1px;border-radius:50%;background:rgba(38,122,55,.12);color:var(--brand-dark);font-size:.8rem}.dark .check-list li span{background:rgba(134,211,154,.15);color:#9be1a8}
.about-media-section{background:var(--surface)}.dark .about-media-section{background:#0e2416}.media-showcase{display:grid;grid-template-columns:1.12fr .88fr;gap:20px}.media-photo{position:relative;min-height:480px;overflow:hidden;margin:0;border-radius:22px;background:#dce8dc}.media-photo:after{position:absolute;inset:40% 0 0;background:linear-gradient(0deg,rgba(3,25,11,.78),transparent);content:""}.media-photo img{position:absolute;width:100%;height:100%;object-fit:cover;transition:transform .8s}.media-photo:hover img{transform:scale(1.045)}.media-photo figcaption{position:absolute;z-index:1;inset:auto 24px 24px;color:#fff}.media-photo figcaption span{display:block;margin-bottom:8px;color:#f8c45b;font-size:.78rem;font-weight:900}.media-photo figcaption strong{font-size:1.35rem;font-weight:900}.media-side{display:grid;grid-template-rows:1fr 1fr;gap:20px}.media-photo-small{min-height:220px}.video-panel{position:relative;min-height:220px;overflow:hidden;border-radius:22px;background:#102719;color:#fff}.video-panel video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.video-panel video[poster]{background:#102719}.video-panel-note{position:absolute;inset:auto 16px 16px;display:flex;align-items:center;gap:12px;padding:12px;border:1px solid rgba(255,255,255,.22);border-radius:14px;background:rgba(6,26,13,.76);backdrop-filter:blur(8px);pointer-events:none}.play-mark{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border-radius:50%;background:var(--brand);color:#25341d;font-size:.85rem}.video-panel-note strong,.video-panel-note small{display:block}.video-panel-note strong{font-size:.9rem}.video-panel-note small{margin-top:3px;color:#c7d7cb;font-size:.7rem}
.about-cta{padding:clamp(42px,6vw,75px) 0;background:linear-gradient(120deg,#123d22,#1d6132);color:#fff}.about-cta-inner{display:flex;align-items:center;justify-content:space-between;gap:28px}.about-cta .section-kicker{color:#f8c45b}.about-cta h2{margin:10px 0 8px;color:#fff;font-size:clamp(1.65rem,3.4vw,2.5rem);font-weight:900;line-height:1.4}.about-cta p{margin:0;color:#d2e5d6;line-height:1.9}.about-cta .about-button{flex:none}
.reveal{opacity:1;transform:none}.js-motion .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}.js-motion .reveal.is-visible{opacity:1;transform:translateY(0)}.js-motion .values-grid .value-card:nth-child(2){transition-delay:.09s}.js-motion .values-grid .value-card:nth-child(3){transition-delay:.18s}
@keyframes aboutHeroDrift{from{transform:scale(1.02) translateX(-.5%)}to{transform:scale(1.08) translateX(.5%)}}
@media(max-width:900px){.about-intro-grid,.feature-grid{grid-template-columns:1fr}.about-intro-visual{max-width:620px;width:100%;margin-inline:auto}.values-grid{grid-template-columns:1fr}.value-card{min-height:0}.media-showcase{grid-template-columns:1fr}.media-photo{min-height:360px}.media-side{grid-template-columns:1fr 1fr;grid-template-rows:1fr}.media-photo-small,.video-panel{min-height:250px}.feature-art{min-height:380px}.about-cta-inner{align-items:flex-start;flex-direction:column}}
@media(max-width:600px){.about-container,.about-hero-content,.about-breadcrumbs{width:min(100% - 28px,1200px)}.about-hero{min-height:590px}.about-hero-content{padding:72px 0 100px}.about-hero h1{font-size:clamp(2.35rem,11vw,3.6rem)}.about-hero-content>p{font-size:.98rem}.about-hero-actions{align-items:stretch;flex-direction:column;max-width:310px}.about-button{width:100%}.hero-side-note{bottom:20px;font-size:.65rem}.about-section{padding:58px 0}.about-intro-grid{gap:30px}.about-intro-visual{min-height:350px;padding:8px 12px 20px 0}.intro-image-main{inset:0 8% 7% 0;border-radius:20px 70px 20px 20px}.intro-image-small{width:44%;height:40%;border-width:5px;border-radius:16px}.intro-stamp{top:22px;width:88px;height:88px}.intro-stamp .stamp-leaf{font-size:1.2rem}.intro-stamp strong{font-size:.95rem}.intro-stamp small{font-size:.6rem}.section-heading{margin-bottom:27px}.value-card{padding:24px}.feature-art{min-height:310px}.feature-art-caption{inset-inline-start:20px;inset-inline-end:20px;bottom:20px}.feature-art-caption strong{font-size:1.25rem}.media-showcase{gap:14px}.media-photo{min-height:300px}.media-side{grid-template-columns:1fr;gap:14px}.media-photo-small,.video-panel{min-height:245px}.video-panel-note small{font-size:.64rem}.about-cta-inner{gap:22px}}
@media(prefers-reduced-motion:reduce){.about-hero-image{animation:none}.about-page-content *, .about-page-content *:before,.about-page-content *:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.js-motion .reveal{opacity:1;transform:none}}


  /* ABOUT ONLY: vision, mission and goals stacked in the existing section. */
  @media (min-width: 901px) {
    .about-page-content .about-values>.about-container {
      display: grid;
      grid-template-columns: minmax(220px, .38fr) minmax(0, 1fr);
      gap: clamp(25px, 5vw, 70px);
      align-items: center;
    }

    .about-page-content .about-values .section-heading {
      margin: 0;
      text-align: start;
    }

    .about-page-content .about-values .values-grid {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 14px;
    }

    .about-page-content .about-values .value-card {
      min-height: 0;
      display: grid;
      grid-template-columns: 58px minmax(0, 1fr);
      column-gap: 18px;
      align-items: start;
      padding: 22px 26px;
    }

    .about-page-content .about-values .value-icon {
      grid-column: 1;
      grid-row: 1 / span 3;
      margin: 0;
    }

    .about-page-content .about-values .value-card h3 {
      grid-column: 2;
      margin: 0 0 5px;
    }

    .about-page-content .about-values .value-card p {
      grid-column: 2;
      margin: 0;
    }

    .about-page-content .about-values .value-line {
      grid-column: 2;
      margin-top: 12px;
    }
  }

  
/* ==========================================
   ABOUT MEDIA — UNIFIED HORIZONTAL LAYOUT
========================================== */

.about-media-section .about-container {
    width: min(100% - 40px, 1280px);
    margin-inline: auto;
}

.about-media-section .section-heading {
    text-align: center;
    max-width: 780px;
    margin: 0 auto 42px;
}

/* Images and videos in one horizontal row */

.about-media-section .about-media-layout {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    width: 100%;
    align-items: start;
    direction: inherit;
}

/* Flatten gallery/video wrappers so each media card
   participates in the same parent grid */

.about-media-section .about-gallery-grid,
.about-media-section .about-videos-grid {
    display: contents;
}

/* Unified media cards */

.about-media-section .about-gallery-item,
.about-media-section .about-video-item {
    width: 100%;
    min-width: 0;
    margin: 0;
    overflow: hidden;
    border-radius: 18px;
    border: 1px solid rgba(140, 170, 145, .24);
    background: transparent;
}

/* Images */

.about-media-section .about-gallery-item a {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

.about-media-section .about-gallery-item img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    transition: transform .35s ease;
}

.about-media-section .about-gallery-item:hover img {
    transform: scale(1.04);
}

/* Videos */

.about-media-section .about-video-item video {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: contain;
    background: #000;
}

/* Unified captions */

.about-media-section .about-gallery-item figcaption,
.about-media-section .about-video-caption {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    min-height: 76px;
    padding: 14px 18px;
    color: inherit;
}

.about-media-section .about-gallery-item figcaption span,
.about-media-section .about-video-caption small {
    opacity: .7;
}

.about-media-section .about-gallery-item figcaption strong,
.about-media-section .about-video-caption strong {
    font-size: 15px;
    line-height: 1.5;
}

/* Tablet */

@media (max-width: 991px) {
    .about-media-section .about-media-layout {
        gap: 16px;
    }
}

/* Mobile */

@media (max-width: 640px) {
    .about-media-section .about-container {
        width: calc(100% - 28px);
    }

    .about-media-section .about-media-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 18px;
    }
}