/* ============================================================
   Radiran A/C — Dynamic Sections (پنل-محور)
   هماهنگ با متغیرهای app.css اصلی
   ============================================================ */

/* ---------- HERO SLIDER (current Blade markup) ---------- */
.hero-copy-slide { min-width: 0; transform-origin: 50% 50%; }
.hero-copy-slide.is-active { animation-duration: var(--slide-speed, 700ms); animation-timing-function: var(--ease); animation-fill-mode: both; }
.hero-copy-slide.is-active[data-animation="fade"] { animation-name: rd-fade; }
.hero-copy-slide.is-active[data-animation="slide-up"] { animation-name: rd-slide-up; }
.hero-copy-slide.is-active[data-animation="zoom"] { animation-name: rd-zoom; }
.hero-copy-slide.is-active[data-animation="flip"] { animation-name: rd-flip; perspective: 900px; }
.hero-copy-slide.is-active[data-animation="glow"] { animation-name: rd-fade; }
.hero-copy-slide.is-active[data-animation="glow"] h1 { animation: rd-glow calc(var(--slide-speed, 700ms) * 2.4) ease-in-out infinite; }
.hero-copy-slide.is-active[data-animation="typewriter"] { animation-name: rd-fade; }
.hero-copy-slide.is-active[data-animation="typewriter"] .hero-slide-lead { overflow: hidden; white-space: nowrap; border-inline-end: 2px solid var(--teal); width: 0; animation: rd-typewriter calc(var(--slide-speed, 700ms) * 5) steps(40, end) .2s forwards, rd-caret .7s step-end infinite; }
.hero__inner > .hero__visual { animation: rd-visual-in 1s var(--ease) both; }

@keyframes rd-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes rd-slide-up { from { opacity: 0; transform: translateY(2.4rem); } to { opacity: 1; transform: none; } }
@keyframes rd-zoom { from { opacity: 0; transform: scale(.92); } to { opacity: 1; transform: scale(1); } }
@keyframes rd-flip { from { opacity: 0; transform: rotateY(38deg); } to { opacity: 1; transform: rotateY(0); } }
@keyframes rd-glow { 0%, 100% { text-shadow: 0 0 0 rgba(18, 219, 195, 0); } 50% { text-shadow: 0 0 34px rgba(18, 219, 195, .5); } }
@keyframes rd-typewriter { to { width: 100%; } }
@keyframes rd-caret { 50% { border-color: transparent; } }
@keyframes rd-visual-in { from { opacity: 0; transform: translateY(18px) scale(.97); } to { opacity: 1; transform: none; } }

.hero-slider__nav { grid-area: nav; grid-column: 1 / -1; display: flex; align-items: center; justify-content: center; gap: 1rem; margin-top: clamp(1.4rem, 3vw, 2.4rem); }
.hero-slider__arrow { width: 2.6rem; height: 2.6rem; display: grid; place-items: center; border: 1px solid var(--line-strong); border-radius: 50%; background: rgba(13, 17, 22, .6); color: var(--muted-strong); transition: color .25s ease, border-color .25s ease; }
.hero-slider__arrow:hover { color: var(--gold); border-color: rgba(220, 169, 79, .6); }
.hero-slider__dots { display: flex; gap: .55rem; }
.hero-slider__dot { width: .55rem; height: .55rem; padding: 0; border: none; border-radius: 50%; background: rgba(243, 246, 243, .25); transition: background .25s ease, transform .25s var(--ease); }
.hero-slider__dot.is-active { background: var(--gold); transform: scale(1.35); }

@media (max-width: 900px) {
    .hero__inner {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 1.2rem;
    }
    .hero__inner > .hero__visual { order: -1; width: 100%; }
    .hero-slider__nav { order: 2; }
}

/* ---------- PROJECTS GRID ---------- */
.projects-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); gap: 1.2rem; }
.project-tile { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: .55rem; padding: clamp(1.4rem, 3vw, 2rem); border: 1px solid var(--line); border-radius: 1.2rem; background: linear-gradient(160deg, var(--ink-soft), rgba(13, 17, 22, .35)); transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease); }
.project-tile::before { content: ''; position: absolute; inset: 0; opacity: .1; background: radial-gradient(120% 90% at 85% 0%, currentColor, transparent 60%); pointer-events: none; }
.project-tile--teal { color: var(--teal); }
.project-tile--gold { color: var(--gold); }
.project-tile--blue { color: var(--blue); }
.project-tile:hover { transform: translateY(-6px); border-color: currentColor; box-shadow: 0 24px 60px rgba(0, 0, 0, .45); }
.project-tile__code { font: 600 .66rem/1 var(--sans); letter-spacing: .18em; color: var(--muted); }
.project-tile__type { font: 600 .6rem/1.3 var(--sans); letter-spacing: .16em; color: currentColor; }
.project-tile h3 { margin: .3rem 0 0; color: var(--text); font-size: clamp(1.02rem, 1.6vw, 1.22rem); line-height: 1.5; }
.project-tile p { margin: 0; color: var(--muted-strong); font-size: .82rem; }
.project-tile small { margin-top: .5rem; color: var(--muted); font-size: .76rem; line-height: 1.8; }
.project-tile__arrow { position: absolute; top: 1.2rem; left: 1.2rem; color: currentColor; font-size: 1rem; opacity: .7; transition: transform .35s var(--ease); }
.project-tile:hover .project-tile__arrow { transform: translate(-3px, -3px); }

/* ---------- BRANDS STRIP ---------- */
.brands-strip { display: flex; flex-wrap: wrap; gap: .9rem; }
.brand-chip { display: inline-flex; align-items: center; gap: .7rem; min-height: 3.4rem; padding: .6rem 1.4rem; border: 1px solid var(--line); border-radius: 999px; background: rgba(13, 17, 22, .5); transition: border-color .3s var(--ease), transform .3s var(--ease), background .3s var(--ease); }
.brand-chip:hover { border-color: rgba(220, 169, 79, .55); background: rgba(13, 17, 22, .85); transform: translateY(-2px); }
.brand-chip img { height: 2.1rem; width: auto; object-fit: contain; filter: grayscale(1) brightness(1.5); opacity: .8; transition: filter .3s ease, opacity .3s ease; }
.brand-chip:hover img { filter: none; opacity: 1; }
.brand-chip strong { color: var(--muted-strong); font-size: .84rem; letter-spacing: .04em; }
.brand-chip:hover strong { color: var(--gold-soft); }

/* ---------- TESTIMONIALS ---------- */
.testimonials-rail { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17.5rem), 1fr)); gap: 1.2rem; }
.testimonial-card { display: flex; flex-direction: column; gap: 1rem; padding: clamp(1.4rem, 2.6vw, 1.9rem); border: 1px solid var(--line); border-radius: 1.3rem; background: linear-gradient(165deg, var(--ink-soft), rgba(13, 17, 22, .4)); transition: transform .35s var(--ease), border-color .35s var(--ease); }
.testimonial-card:hover { transform: translateY(-5px); border-color: rgba(18, 219, 195, .4); }
.testimonial-card__stars { display: flex; gap: .15rem; font-size: .85rem; color: rgba(243, 246, 243, .2); }
.testimonial-card__stars .is-on { color: var(--gold); }
.testimonial-card blockquote { margin: 0; color: var(--muted-strong); font-size: .92rem; line-height: 1.95; }
.testimonial-card footer { margin-top: auto; display: flex; align-items: center; gap: .8rem; }
.testimonial-card__avatar { width: 2.7rem; height: 2.7rem; border-radius: 50%; object-fit: cover; border: 1px solid rgba(220, 169, 79, .45); }
.testimonial-card__avatar--initials { display: grid; place-items: center; color: var(--gold); font-weight: 700; background: rgba(220, 169, 79, .12); }
.testimonial-card footer strong { display: block; color: var(--text); font-size: .86rem; }
.testimonial-card footer small { color: var(--muted); font-size: .7rem; }

/* ---------- FAQ ---------- */
.faq-list { display: grid; gap: .8rem; max-width: 56rem; }
.faq-item { border: 1px solid var(--line); border-radius: 1rem; background: rgba(13, 17, 22, .5); overflow: hidden; transition: border-color .3s var(--ease); }
.faq-item[open] { border-color: rgba(18, 219, 195, .4); }
.faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.05rem 1.35rem; color: var(--text); font-size: .95rem; cursor: pointer; list-style: none; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item__icon { display: grid; place-items: center; width: 1.7rem; height: 1.7rem; border: 1px solid var(--line-strong); border-radius: 50%; color: var(--teal); font-size: 1rem; transition: transform .3s var(--ease), color .3s ease; }
.faq-item[open] .faq-item__icon { transform: rotate(45deg); color: var(--gold); }
.faq-item > p { margin: 0; padding: 0 1.35rem 1.2rem; color: var(--muted-strong); font-size: .86rem; line-height: 2; }
