/* Tarhestan — Student testimonials carousel. Colors follow the site's brand (maroon).
 * Works without JavaScript (native swipe/scroll); the script adds arrows, dots and autoplay. */

.tt{
	--tt-brand:#82151d;
	--tt-brand-hi:#bf1e2e;
	--tt-ink:#1f1518;
	--tt-muted:#6b5a5d;
	--tt-line:#ecdfe0;
	--tt-soft:#fbf6f6;
	--tt-grad:linear-gradient(to right,rgba(130,21,29,.81) 0%,rgb(191,30,46) 50%,rgba(130,21,29,.81) 100%);
	--tt-cols:3;
	direction:rtl;text-align:right;color:var(--tt-ink);
	padding:clamp(3rem,6vw,5rem) 1rem;
	font-family:inherit;line-height:1.9;
}
.tt--cols-2{--tt-cols:2}
.tt *,.tt *::before,.tt *::after{box-sizing:border-box}

/* ---------- Heading ---------- */
.tt__head{max-width:46rem;margin:0 auto 2.5rem;text-align:center}
.tt__title{margin:0;font-size:clamp(1.6rem,3.2vw,2.3rem);font-weight:900;line-height:1.5;color:var(--tt-ink)}
.tt__title::after{content:"";display:block;width:56px;height:4px;margin:.9rem auto 0;border-radius:4px;background:var(--tt-grad)}
.tt__sub{margin:1rem 0 0;font-size:clamp(.95rem,1.4vw,1.1rem);color:var(--tt-muted)}

/* ---------- Carousel ---------- */
.tt__slider{position:relative;max-width:var(--th-max,1320px);margin:0 auto}
.tt__grid{
	list-style:none;margin:0;padding:.5rem .25rem 1.5rem;
	display:flex;gap:1.5rem;overflow-x:auto;
	scroll-snap-type:x mandatory;scroll-behavior:smooth;
	-webkit-overflow-scrolling:touch;scrollbar-width:none;
}
.tt__grid::-webkit-scrollbar{display:none}
.tt__card{
	flex:0 0 calc((100% - (var(--tt-cols) - 1) * 1.5rem) / var(--tt-cols));
	min-width:0;display:flex;margin:0;scroll-snap-align:center;
}

/* ---------- Card ---------- */
.tt__figure{
	position:relative;margin:0;width:100%;height:100%;display:flex;flex-direction:column;
	padding:2.25rem 1.75rem 1.75rem;background:#fff;
	border:1px solid var(--tt-line);border-radius:22px;
	box-shadow:0 18px 40px -28px rgba(130,21,29,.4);
	transition:transform .25s ease,box-shadow .25s ease;
}
.tt__figure:hover{transform:translateY(-4px);box-shadow:0 24px 50px -26px rgba(130,21,29,.5)}
.tt__figure::before{
	content:"\201D";position:absolute;top:.5rem;inset-inline-end:1.25rem;
	font:900 4.5rem/1 Georgia,serif;color:var(--tt-brand);opacity:.13;pointer-events:none;
}
.tt__quote{margin:0;flex:1}
.tt__quote p{margin:0;font-size:1rem;line-height:2;color:var(--tt-ink)}
/* Long testimonies are shortened by the script to 5 lines until the reader opens them. */
.tt__quote.is-clamped p{max-height:10em;overflow:hidden}
.tt__more{
	align-self:flex-start;margin-top:.6rem;padding:0;border:0;background:none;cursor:pointer;
	font:inherit;font-size:.92rem;font-weight:800;color:var(--tt-brand);
	text-decoration:underline;text-underline-offset:4px;
	background-color: #ffffff!important;
}
.tt__more:hover{color:var(--tt-brand-hi)}
.tt__more:focus-visible{outline:2px solid var(--tt-brand-hi);outline-offset:3px;border-radius:4px}
.tt__more[hidden]{display:none}

.tt__who{display:flex;align-items:center;gap:.9rem;margin:1.5rem 0 0;padding-top:1.25rem;border-top:1px solid var(--tt-line)}
.tt__avatar{flex:none;width:56px;height:56px;border-radius:50%;object-fit:cover;background:var(--tt-soft)}
.tt__avatar--text{display:grid;place-items:center;background:var(--tt-grad);color:#fff;font-size:1.3rem;font-weight:800;line-height:1}
.tt__meta{display:flex;flex-direction:column;min-width:0}
.tt__name{font-style:normal;font-weight:800;color:var(--tt-ink);line-height:1.5}
.tt__field{font-size:.88rem;color:var(--tt-brand);line-height:1.6}

/* ---------- Arrows and dots (added by the script) ---------- */
.tt__arrow{
	position:absolute;top:calc(50% - 1.5rem);z-index:2;display:grid;place-items:center;
	width:52px;height:52px;margin:0;padding:0;border:0;border-radius:50%;
	background:var(--tt-grad)!important;color:#fff!important;
	box-shadow:0 12px 30px -10px rgba(0,0,0,.25);
	transition:background .2s ease,color .2s ease,transform .2s ease;
}
.tt__arrow:hover{background:var(--tt-grad);color:#fff}
.tt__arrow:active{transform:scale(.95)}
.tt__arrow:focus-visible{outline:2px solid var(--tt-brand-hi);outline-offset:3px}
.tt__arrow .th-i{width:20px;height:20px}
.tt__arrow--next{left:-22px}
.tt__arrow--prev{right:-22px}
.tt__arrow--prev .th-i{transform:scaleX(-1)}

.tt__dots{display:flex;justify-content:center;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}
.tt__dot{position:relative;width:10px;height:10px;margin:0;padding:0;border:0;border-radius:999px;background:#d9c4c6;cursor:pointer;transition:width .3s ease,background .3s ease}
.tt__dot::before{content:"";position:absolute;inset:-10px -6px} /* larger touch target */
.tt__dot[aria-current="true"]{width:28px;background:var(--tt-brand-hi)}
.tt__dot:focus-visible{outline:2px solid var(--tt-brand-hi);outline-offset:3px}

.tt:not(.is-ready) .tt__arrow,
.tt:not(.is-ready) .tt__dots{display:none}

/* ---------- Tablet ---------- */
@media (max-width:991px){
	.tt{--tt-cols:2}
	.tt__arrow--next{left:-14px}
	.tt__arrow--prev{right:-14px}
}

/* ---------- Phone: arrows hidden, swipe + dots ---------- */
@media (max-width:767px){
	.tt{--tt-cols:1}
	.tt__grid{margin-inline:-1rem;padding:.5rem 1rem 1.25rem;gap:1rem}
	.tt__card{flex-basis:86%}
	.tt__figure{padding:2rem 1.35rem 1.5rem}
	.tt__quote p{font-size:.95rem}
	.tt__arrow{display:none}
}

@media (prefers-reduced-motion:reduce){
	.tt__grid{scroll-behavior:auto}
	.tt__figure,.tt__arrow,.tt__dot{transition:none}
	.tt__figure:hover{transform:none}
}