/* ===========================================================
   Jurix — About page (extends home.css)
   =========================================================== */

/* ---------- HERO ---------- */
.a-hero{padding:184px 0 64px;}
.a-hero-grid{display:grid;grid-template-columns:1.04fr .96fr;align-items:center;gap:46px;}
.a-hero h1{font-family:var(--serif);font-weight:500;font-size:clamp(48px,6vw,76px);line-height:1.04;letter-spacing:-.02em;color:var(--ink-2);}
.a-hero h1 em{font-style:italic;font-weight:500;background:linear-gradient(92deg,#C89541,#8D621A);-webkit-background-clip:text;background-clip:text;color:transparent;}
.a-hero .lede{margin:24px 0 30px;max-width:420px;font-size:15px;}
.a-frame{padding:8px;border-radius:30px;background:linear-gradient(150deg,#F2E2BE,#E6CFA0);box-shadow:0 30px 60px -30px rgba(40,30,10,.4);}
.a-frame img{width:100%;height:auto;border-radius:24px;display:block;}

/* ---------- PROBLEM (cream band) ---------- */
.aprob{background:linear-gradient(180deg,#F0E6D1,#EFE3CD);padding:64px 0 70px;text-align:center;}
.aprob .sec-head{align-items:center;}
.aprob .sub{font-size:14px;color:var(--muted);max-width:560px;margin:14px auto 0;line-height:1.5;letter-spacing:-.01em;}
.prob-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:44px 0;margin:46px 0 40px;}
.prob-item{display:flex;flex-direction:column;align-items:center;gap:14px;padding:0 24px;position:relative;}
.prob-item:not(:nth-child(3n))::after{content:"";position:absolute;right:0;top:8px;bottom:8px;width:1px;background:var(--line);}
.prob-item .tile{width:46px;height:46px;border-radius:12px;background:#FFFDF8;}
.prob-item .tile svg{width:22px;height:22px;}
.prob-item span{font-family:var(--serif);font-size:21px;font-weight:500;color:var(--ink-2);letter-spacing:-.01em;}
.aprob .built{font-size:clamp(20px,2.6vw,28px);font-weight:600;letter-spacing:-.02em;color:var(--gold-2);font-family:var(--sans);}

/* ---------- APPROACH ---------- */
.approach{padding:64px 0;}
.approach .sec-head{align-items:center;text-align:center;}
.approach .sub{font-size:14px;color:var(--muted);max-width:620px;margin:14px auto 40px;line-height:1.5;letter-spacing:-.01em;}
.appr-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:18px;}
.appr-card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:22px 20px;display:flex;flex-direction:column;gap:34px;min-height:130px;}
.appr-card .tile{width:42px;height:42px;border-radius:11px;}
.appr-card .tile svg{width:21px;height:21px;}
.appr-card span{font-family:var(--serif);font-size:18px;font-weight:500;color:var(--ink-2);letter-spacing:-.01em;}

/* ---------- MISSION / VISION ---------- */
.mv{padding:24px 0 56px;}
.mv-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;}
.mvcard{border-radius:24px;padding:38px;border:1px solid var(--line);background:linear-gradient(150deg,#FFFCF8,#F7F1E9);min-height:300px;display:flex;flex-direction:column;align-items:flex-start;text-align:left;}
.mvcard .tile{width:54px;height:54px;border-radius:15px;margin-bottom:26px;}
.mvcard .lbl{font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:.06em;color:var(--gold-2);margin-bottom:10px;}
.mvcard h3{font-family:var(--serif);font-size:clamp(26px,2.8vw,32px);font-weight:500;color:var(--ink-2);letter-spacing:-.02em;line-height:1.12;}
.mvcard h3 em{font-style:italic;color:var(--gold-2);}
.mvcard .mrule{height:1px;background:var(--line);margin:18px 0;}
.mvcard p{font-size:14px;color:var(--muted);line-height:1.55;margin:0;max-width:440px;letter-spacing:-.01em;}

/* ---------- VALUES ---------- */
.values{padding:56px 0;}
.values-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;align-items:start;}
.values .intro .h-serif{margin-top:14px;}
.vals{display:flex;flex-direction:column;}
.val{display:flex;gap:18px;padding:18px 0;border-top:1px solid var(--line-soft);align-items:flex-start;}
.val:first-child{border-top:0;padding-top:0;}
.val .vn{width:42px;height:42px;border-radius:50%;background:#F4E8CF;color:var(--gold);font-family:var(--serif);font-size:18px;display:flex;align-items:center;justify-content:center;flex:none;}
.val h5{margin:0 0 4px;font-family:var(--serif);font-size:19px;font-weight:600;color:var(--ink-2);letter-spacing:-.01em;}
.val p{margin:0;font-size:13.5px;color:var(--muted);line-height:1.45;}

/* ---------- LEADERSHIP ---------- */
.lead{padding:56px 0 70px;}
.lead .sec-head{align-items:center;text-align:center;margin-bottom:14px;}
.lead-sub{text-align:center;max-width:660px;margin:0 auto 44px;font-size:14.5px;color:var(--muted);line-height:1.6;letter-spacing:-.01em;}
.team-row{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.team-row.two{grid-template-columns:1fr 1fr;gap:26px;}
.lcard{display:flex;gap:22px;align-items:flex-start;background:linear-gradient(150deg,#FFFCF8,#F7F1E9);border:1px solid var(--line);border-radius:24px;padding:30px;transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s;}
.lcard:hover{transform:translateY(-3px);box-shadow:0 24px 50px -32px rgba(40,30,10,.5);}
.lcard .ph{width:112px;height:112px;flex:none;border-radius:50%;padding:4px;background:linear-gradient(150deg,#E9C97E,#C8943F);}
.lcard .ph img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block;background:#e8e4dd;}
.lc-body{display:flex;flex-direction:column;flex:1;}
.lc-body .nm{font-family:var(--serif);font-size:24px;font-weight:500;color:var(--ink-2);letter-spacing:-.01em;}
.lc-body .role{font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-2);margin-top:4px;}
.lc-body .bio{margin:14px 0 16px;font-size:13.5px;color:var(--muted);line-height:1.6;letter-spacing:-.01em;}
.lc-link{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--gold-2);margin-top:auto;}
.lc-link svg{width:16px;height:16px;transition:transform .2s;}
.lcard:hover .lc-link svg{transform:translateX(3px);}
.lead-cta{display:flex;justify-content:center;margin-top:42px;}
@media (max-width:760px){
  .team-row.two{grid-template-columns:1fr;}
  .lcard{flex-direction:column;align-items:center;text-align:center;}
  .lc-body{align-items:center;}
  .lc-link{margin:14px auto 0;}
}

/* ---------- JOURNEY (cream band) ---------- */
.journey{background:linear-gradient(180deg,#F0E6D1,#EFE3CD);padding:60px 0 70px;}
.journey .sec-head{align-items:center;text-align:center;margin-bottom:48px;}
.tl{display:grid;grid-template-columns:repeat(5,1fr);position:relative;gap:0;}
.tl::before{content:"";position:absolute;left:6.5px;right:calc(20% - 6.5px);top:62px;height:2px;background:var(--line);}
.tl::after{content:"";position:absolute;left:6.5px;top:62px;width:0;height:2px;background:var(--gold-2);transition:width 1.8s ease;}
.tl.in::after{width:60%;}
.tl-item{display:flex;flex-direction:column;gap:0;padding-right:20px;}
.tl-item .q{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--gold-2);margin-bottom:18px;}
.tl-item .dot{width:13px;height:13px;border-radius:50%;background:var(--line);position:relative;z-index:2;margin-bottom:18px;}
.tl-item.in .dot{background:var(--gold-2);box-shadow:0 0 0 4px rgba(154,106,35,.18);}
.tl-item .tile{width:48px;height:48px;border-radius:13px;background:#FFFDF8;margin-bottom:14px;}
.tl-item .tile svg{width:22px;height:22px;}
.tl-item .yr{font-family:var(--serif);font-size:26px;font-weight:500;color:var(--ink-2);letter-spacing:-.01em;margin-bottom:6px;}
.tl-item p{font-size:13px;color:var(--muted);line-height:1.4;margin:0;}

/* ---------- FUTURE ---------- */
.future{padding:78px 0 88px;text-align:center;}
.future .sec-head{align-items:center;margin-bottom:8px;}
.future h2{font-family:var(--serif);font-weight:500;font-size:clamp(36px,4.8vw,56px);line-height:1.06;letter-spacing:-.02em;color:var(--ink-2);margin-top:16px;}
.future h2 em{font-style:italic;font-weight:500;background:linear-gradient(92deg,#C89541,#8D621A);-webkit-background-clip:text;background-clip:text;color:transparent;}
.future .sub{font-size:14.5px;color:var(--muted);max-width:560px;margin:16px auto 0;line-height:1.55;letter-spacing:-.01em;}
.future .cta-actions{justify-content:center;margin-top:28px;}

/* ============= RESPONSIVE ============= */
@media (max-width:1080px){
  .appr-grid{grid-template-columns:repeat(3,1fr);}
  .values-grid{grid-template-columns:1fr;gap:30px;}
}
@media (max-width:900px){
  .a-hero-grid{grid-template-columns:1fr;}
  .a-hero-art{order:-1;}
  .a-hero{padding-top:130px;}
  .mv-grid{grid-template-columns:1fr;}
  .team-row{grid-template-columns:1fr 1fr;gap:34px 24px;}
  .tl{grid-template-columns:1fr 1fr;gap:34px 24px;}
  .tl::before,.tl::after{display:none;}
}
@media (max-width:620px){
  .prob-grid{grid-template-columns:1fr 1fr;gap:30px 0;}
  .prob-item:not(:nth-child(3n))::after{display:none;}
  .prob-item:nth-child(odd)::after{content:"";position:absolute;right:0;top:8px;bottom:8px;width:1px;background:var(--line);}
  .appr-grid{grid-template-columns:1fr 1fr;}
  .team-row{grid-template-columns:1fr;}
  .tl{grid-template-columns:1fr;}
}