/* ===== Vedhya Library — About page styles ===== */

/* Page hero tweaks */
.page-hero h1{font-size:clamp(2.8rem,6vw,5rem)}
.page-hero .lead{font-size:1.18rem}
.ph-strip{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:34px}
.ph-chip{background:#fff;border:1px solid var(--line);border-radius:100px;padding:10px 20px;font-weight:600;font-size:.9rem;color:var(--ink-2);box-shadow:var(--shadow-sm);display:inline-flex;gap:8px;align-items:center}
.ph-chip .ico{width:17px;height:17px;color:var(--brand)}

.sec{padding:110px 0}
.sec-head{margin-bottom:60px}

/* STORY */
.story{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.story-media{position:relative}
.story-media .m1{border-radius:24px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/4.6}
.story-media .m1 img{width:100%;height:100%;object-fit:cover}
.story-media .m2{position:absolute;bottom:-34px;right:-24px;width:52%;border-radius:20px;overflow:hidden;border:6px solid var(--bg);box-shadow:var(--shadow);aspect-ratio:1}
.story-media .m2 img{width:100%;height:100%;object-fit:cover}
.story-media .exp{position:absolute;top:-26px;left:-24px;background:var(--accent);color:#fff;border-radius:20px;padding:18px 22px;box-shadow:var(--shadow);text-align:center}
.story-media .exp b{font-family:var(--serif);font-size:2rem;display:block;line-height:1}
.story-media .exp span{font-size:.72rem;letter-spacing:.08em;opacity:.85}
.story-copy p{color:var(--ink-2);margin-bottom:16px}
.story-copy .sign{font-family:var(--serif);font-style:italic;font-size:1.4rem;color:var(--brand);margin-top:8px}

/* MVV cards */
.mvv{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.mvv-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:36px 30px;transition:transform .4s var(--ease),box-shadow .4s;will-change:transform}
.mvv-card:hover{box-shadow:var(--shadow)}
.mvv-card .ic{width:60px;height:60px;border-radius:16px;background:var(--grad);color:#fff;display:grid;place-items:center;margin-bottom:22px}
.mvv-card .ic .ico{width:26px;height:26px}
.mvv-card h3{font-size:1.35rem;margin-bottom:10px}
.mvv-card p{color:var(--muted);font-size:.96rem}

/* VALUES list */
.values{background:var(--bg-soft);border-block:1px solid var(--line)}
.val-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.val-list{display:flex;flex-direction:column;gap:8px}
.val-item{display:flex;gap:18px;padding:20px 0;border-bottom:1px solid var(--line)}
.val-item:last-child{border-bottom:0}
.val-num{font-family:var(--serif);font-style:italic;font-size:1.5rem;color:var(--brand);flex-shrink:0;width:44px}
.val-item h4{font-size:1.15rem;margin-bottom:4px;font-weight:600}
.val-item p{color:var(--muted);font-size:.94rem}
.val-media{border-radius:24px;overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/4.4}
.val-media img{width:100%;height:100%;object-fit:cover}

/* TIMELINE */
.timeline{max-width:820px;margin:0 auto;position:relative;padding-left:34px}
.timeline::before{content:"";position:absolute;left:8px;top:8px;bottom:8px;width:2px;background:linear-gradient(var(--brand-2),transparent)}
.tl-item{position:relative;padding-bottom:44px}
.tl-item:last-child{padding-bottom:0}
.tl-item::before{content:"";position:absolute;left:-34px;top:4px;width:18px;height:18px;border-radius:50%;background:var(--bg);border:3px solid var(--brand);box-shadow:0 0 0 5px var(--cream)}
.tl-year{font-family:var(--serif);font-style:italic;color:var(--brand);font-size:1.3rem;margin-bottom:4px}
.tl-item h4{font-size:1.2rem;margin-bottom:6px;font-weight:600}
.tl-item p{color:var(--muted)}

/* STATS band */
.stats-band{position:relative;overflow:hidden;border-radius:34px;margin:0 28px;padding:70px 40px}
.stats-band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.stats-band::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(26,23,18,.9),rgba(31,92,77,.75))}
.stats-inner{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);gap:30px;text-align:center;color:#fff}
.stats-inner .s h3{font-family:var(--serif);font-size:3rem;color:#fff;font-weight:600}
.stats-inner .s p{color:rgba(255,255,255,.8);font-size:.9rem;text-transform:uppercase;letter-spacing:.08em;font-weight:600}

/* TEAM */
.team{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.member{text-align:center}
.member .ph{border-radius:20px;overflow:hidden;aspect-ratio:1;margin-bottom:16px;position:relative;box-shadow:var(--shadow-sm)}
.member .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.member:hover .ph img{transform:scale(1.08)}
.member h4{font-size:1.1rem;font-weight:600}
.member span{color:var(--brand);font-size:.88rem;font-weight:600}

/* CTA */
.cta-band{margin:0 28px;border-radius:34px;position:relative;overflow:hidden;padding:80px 40px;text-align:center}
.cta-band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cta-band::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(26,23,18,.86),rgba(31,92,77,.72))}
.cta-band>*{position:relative;z-index:2}
.cta-band h2{font-size:clamp(2.1rem,4vw,3.4rem);color:#fff;margin-bottom:16px}
.cta-band p{color:rgba(255,255,255,.9);font-size:1.12rem;max-width:54ch;margin:0 auto 32px}
.cta-band .btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

@media(max-width:940px){
  .story,.val-grid{grid-template-columns:1fr}
  .story-media,.val-media{max-width:440px;margin:0 auto 40px}
  .mvv{grid-template-columns:1fr}
  .stats-inner{grid-template-columns:1fr 1fr;gap:40px}
  .team{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
  .team{grid-template-columns:1fr}
  .stats-inner{grid-template-columns:1fr 1fr}
}