/* ==========================================
   ARTHEMIS CAPITAL - About Page (Stylised)
   ========================================== */

/* --- Hero --- */
.page-hero{min-height:52vh;display:flex;align-items:flex-end;border-bottom:none}
.page-hero .hero-bg{background:linear-gradient(180deg,rgba(8,14,28,0.34) 0%,rgba(8,14,28,0.16) 28%,rgba(8,14,28,0.32) 58%,rgba(8,14,28,0.72) 100%),url('../images/news/arthemiscapital_7.jpeg') center/cover no-repeat}


/* --- Intro Section --- */
.about-intro-section{padding:0 0 50px;background:linear-gradient(180deg,#f5efe5 0%,#fcfaf6 100%)}
.about-intro-card{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(300px,0.78fr);gap:34px;align-items:center;padding:42px 40px;background:linear-gradient(135deg,rgba(255,255,255,0.99),rgba(247,242,234,0.97));border:1px solid rgba(17,28,48,0.06);box-shadow:0 24px 60px rgba(21,19,14,0.10);position:relative;z-index:2;overflow:hidden}
.about-intro-card::before{content:'';position:absolute;top:-40px;left:-40px;width:200px;height:200px;background:radial-gradient(circle,rgba(198,154,83,0.08),transparent 70%);pointer-events:none}
.about-intro-card::after{content:'';position:absolute;bottom:-60px;right:-60px;width:280px;height:280px;background:radial-gradient(circle,rgba(19,37,69,0.06),transparent 70%);pointer-events:none}
.about-intro-copy{position:relative;z-index:1}
.about-intro-copy h2{font-size:2.15rem;line-height:1.34;color:#1b2233;margin-bottom:20px;position:relative; text-align: initial;}
.about-intro-copy h2::after{content:'';display:block;width:60px;height:3px;background:linear-gradient(90deg,var(--gold),var(--gold-bright));margin-top:16px}
.about-intro-copy p{font-size:0.96rem;color:#3a3f4d;line-height:1.9;margin-bottom:16px; text-align: initial;}
.about-intro-visual{position:relative;z-index:1}
.about-intro-image{min-height:380px;background:linear-gradient(180deg,rgba(11,18,32,0.08),rgba(11,18,32,0.22)),url('../images/image8.jpeg') center/cover no-repeat;border:1px solid rgba(17,28,48,0.06);box-shadow:0 12px 40px rgba(0,0,0,0.12);position:relative}
.about-intro-image::after{content:'';position:absolute;bottom:-8px;right:-8px;width:100%;height:100%;border:2px solid rgba(198,154,83,0.18);z-index:-1}

/* --- What We Do Section --- */
.about-firm-section{padding:50px 0 56px;background:linear-gradient(180deg,#fff 0%,#faf6f0 100%)}
.about-firm-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,0.82fr);gap:32px;align-items:center;padding-bottom:32px;border-bottom:1px solid rgba(17,28,48,0.06)}
.about-intro-text h2{font-size:3rem;font-weight:400;color:#1a2035;line-height:1.08;margin-bottom:18px;position:relative; text-align: initial;}
.about-intro-text h2::after{content:'';display:block;width:50px;height:3px;background:linear-gradient(90deg,var(--gold),var(--gold-bright));margin-top:14px}
.about-intro-text p{font-size:1rem;color:#3a3f4d;line-height:1.9;margin-bottom:14px;max-width:700px; text-align: initial;}
.about-firm-map{min-height:260px;border-left:1px solid rgba(17,28,48,0.06);background:url('../images/image12.jpeg') center/cover no-repeat;filter:saturate(0.38) brightness(1.08);position:relative}
.about-firm-map::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(198,154,83,0.06),transparent 50%)}

.work-list-panel{padding-top:34px}
.work-list{display:grid;grid-template-columns:repeat(2,1fr);gap:16px 32px;max-width:960px}
.value-item{display:flex;gap:16px;align-items:center;padding:14px 18px;background:rgba(255,255,255,0.8);border:1px solid rgba(17,28,48,0.05);transition:var(--transition);position:relative;overflow:hidden}
.value-item::before{content:'';position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(180deg,var(--gold),var(--gold-dark));transition:width 0.35s ease}
.value-item:hover::before{width:4px}
.value-item:hover{box-shadow:0 4px 20px rgba(0,0,0,0.06);transform:translateX(4px)}
.value-bar{width:3px;min-height:1.5rem;background:linear-gradient(180deg,var(--gold),var(--gold-dark));box-shadow:2px 0 12px rgba(198,154,83,0.18);flex-shrink:0;border-radius:2px}
.value-item h4{font-size:0.95rem;color:#2b2a38;line-height:1.4;font-weight:500; text-align: initial;}

/* --- Mission & Vision Section --- */
.mission-section{padding:0 0 56px;background:linear-gradient(180deg,#faf6f0 0%,#f5efe5 100%)}
.mission-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.mission-card{background:linear-gradient(135deg,#ffffff 0%,#f8f3eb 100%);border:1px solid rgba(198,154,83,0.2);padding:38px 36px;box-shadow:0 12px 40px rgba(0,0,0,0.10);position:relative;overflow:hidden;transition:var(--transition)}
.mission-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--gold-dark),var(--gold-bright),var(--gold-dark))}
.mission-card::after{content:'';position:absolute;bottom:-40px;right:-40px;width:180px;height:180px;background:radial-gradient(circle,rgba(198,154,83,0.08),transparent 70%);pointer-events:none}
.mission-card:hover{transform:translateY(-4px);box-shadow:0 16px 50px rgba(0,0,0,0.14)}
.mission-card h2{font-size:1.55rem;color:#1a2035;font-weight:400;margin-bottom:16px;letter-spacing:0.5px}
.mission-card p{color:#3a3f4d;line-height:1.88;font-size:0.94rem; text-align: initial;}

/* --- Geographic Reach Section --- */
.reach-section{padding:20px 0 100px;background:linear-gradient(180deg,#f5efe5 0%,#fff 100%)}
.reach-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,1fr);gap:0;align-items:stretch;border:1px solid rgba(17,28,48,0.06);background:#fff;box-shadow:0 20px 60px rgba(21,19,14,0.10);overflow:hidden}
.reach-copy{padding:40px 38px;position:relative}
.reach-copy::after{content:'';position:absolute;top:40px;left:0;width:4px;height:40px;background:linear-gradient(180deg,var(--gold),var(--gold-bright))}
.reach-copy{padding-left:28px}
.reach-copy h2{font-size:2.1rem;font-weight:400;color:#1a2035;margin-bottom:18px;padding-left:16px}
.reach-copy p{font-size:0.96rem;color:#3a3f4d;line-height:1.88;margin-bottom:14px;padding-left:16px; text-align: initial;}

.reach-tags{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0;padding-left:16px}
.reach-tag{padding:12px 24px;background:linear-gradient(135deg,#0b1220,#17253f);color:var(--gold-light);font-family:'Montserrat',sans-serif;font-size:0.74rem;letter-spacing:1.4px;text-transform:uppercase;font-weight:500;border:1px solid rgba(198,154,83,0.25);transition:var(--transition);position:relative;overflow:hidden}
.reach-tag::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(198,154,83,0.1),transparent);opacity:0;transition:opacity 0.3s ease}
.reach-tag:hover{border-color:rgba(198,154,83,0.5);transform:translateY(-2px);box-shadow:0 4px 16px rgba(198,154,83,0.15)}
.reach-tag:hover::before{opacity:1}

.reach-image{position:relative;min-height:400px;overflow:hidden}
.reach-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.6s ease}
.reach-image:hover img{transform:scale(1.03)}
.reach-image::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,18,32,0.05),rgba(11,18,32,0.15));pointer-events:none}

/* --- Responsive --- */
@media(max-width:1024px){
  .about-intro-card,
  .about-firm-layout,
  .reach-layout{grid-template-columns:1fr}
  .about-firm-map{border-left:none;border-top:1px solid rgba(17,28,48,0.06)}
  .work-list{grid-template-columns:1fr}
  .reach-image{min-height:300px}
}

@media(max-width:768px){
  .page-hero{min-height:360px}
  .page-hero-content{padding:96px 20px 40px}
  .page-hero h1{font-size:2.4rem}
  .about-intro-card{grid-template-columns:1fr;gap:22px;padding:24px}
  .about-intro-copy h2{font-size:1.7rem}
  .about-intro-image{min-height:260px}
  .about-intro-image::after{display:none}
  .about-firm-section{padding:32px 0 40px}
  .about-intro-text h2{font-size:2.25rem}
  .value-item{padding:12px 14px}
  .value-item h4{font-size:0.9rem}
  .mission-grid{grid-template-columns:1fr}
  .mission-card{padding:30px 26px}
  .reach-layout{grid-template-columns:1fr}
  .reach-copy{padding:28px 22px}
  .reach-copy::after{display:none}
  .reach-copy h2{font-size:1.7rem;padding-left:0}
  .reach-copy p{padding-left:0}
  .reach-tags{padding-left:0}
  .reach-image{min-height:250px}
}