/* =========================================================
   Samaia — inner page components (About / Services / Portfolio / Contact)
   Built strictly on the existing token system in styles.css
   ========================================================= */

/* ---------- Page hero ---------- */
.page-hero{
  position:relative;min-height:56vh;
  display:flex;align-items:flex-end;
  background-size:cover;background-position:center;
  padding:180px 0 80px;color:#fff;overflow:hidden;
}
.page-hero::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,.35) 45%,rgba(15,14,12,.78) 100%);
}
.page-hero .container{position:relative;z-index:1}
.page-hero-title{
  font-size:clamp(2.6rem,5.4vw,4.6rem);line-height:1.05;margin:0 0 1rem;max-width:800px;
}
.page-hero-lead{
  font-size:1.05rem;letter-spacing:.05em;max-width:600px;opacity:.9;margin:0 0 1.6rem;
}
.breadcrumb-line{
  display:flex;align-items:center;gap:12px;
  font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:#d9cdb4;
}
.breadcrumb-line a{color:#fff;text-decoration:none;transition:color .3s}
.breadcrumb-line a:hover{color:var(--gold)}
.breadcrumb-line i{font-size:.6rem;color:var(--gold)}

/* ---------- Vision / Mission ---------- */
.vm-card{
  background:#fff;padding:52px 42px;height:100%;position:relative;overflow:hidden;
  border:1px solid rgba(0,0,0,.06);transition:all .4s ease;
}
.vm-card::before{
  content:"";position:absolute;left:0;top:0;width:100%;height:3px;
  background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .5s ease;
}
.vm-card:hover{transform:translateY(-8px);box-shadow:0 30px 60px rgba(0,0,0,.08)}
.vm-card:hover::before{transform:scaleX(1)}
.vm-card i{font-size:2.1rem;color:var(--gold);display:block;margin-bottom:20px}
.vm-card h3{font-size:1.8rem;margin-bottom:14px}
.vm-card p{color:var(--muted);line-height:1.8;margin:0}

/* ---------- Stats band ---------- */
.stats-band{background:var(--charcoal);color:#fff;padding:90px 0}
.stat-item{text-align:center;padding:10px 0}
.stat-item .stat-num{
  font-family:'Cormorant Garamond',serif;font-size:clamp(2.8rem,5vw,4.2rem);
  line-height:1;color:#f2ead9;
}
.stat-item .stat-num sup{font-size:.5em;color:var(--gold);top:-.6em}
.stat-item p{
  margin:12px 0 0;letter-spacing:.28em;text-transform:uppercase;
  font-size:.7rem;color:var(--sand);
}

/* ---------- Team ---------- */
.team-card{
  background:#fff;border:1px solid rgba(0,0,0,.06);height:100%;
  padding:44px 30px 36px;text-align:center;transition:all .4s ease;
}
.team-card:hover{transform:translateY(-8px);box-shadow:0 30px 60px rgba(0,0,0,.08)}
.team-avatar{
  width:104px;height:104px;border-radius:50%;margin:0 auto 22px;
  background:linear-gradient(145deg,var(--beige),#fff);
  border:1px solid rgba(184,153,104,.4);
  display:grid;place-items:center;
  font-family:'Cormorant Garamond',serif;font-size:2.1rem;color:var(--gold-dark);
  transition:all .4s ease;
}
.team-card:hover .team-avatar{background:var(--gold);color:#fff;border-color:var(--gold)}
.team-card h5{font-size:1.4rem;margin-bottom:4px}
.team-card .team-role{
  display:block;letter-spacing:.26em;text-transform:uppercase;
  font-size:.66rem;color:var(--gold-dark);margin-bottom:14px;
}
.team-card p{color:var(--muted);font-size:.92rem;line-height:1.7;margin:0}

/* ---------- Timeline ---------- */
.timeline{position:relative;max-width:860px;margin:0 auto;padding-left:0}
.timeline::before{
  content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;
  background:linear-gradient(180deg,transparent,rgba(184,153,104,.5) 8%,rgba(184,153,104,.5) 92%,transparent);
}
.tl-item{position:relative;width:50%;padding:0 48px 56px 0;text-align:right}
.tl-item:nth-child(even){margin-left:50%;padding:0 0 56px 48px;text-align:left}
.tl-item::before{
  content:"";position:absolute;top:8px;right:-5px;width:10px;height:10px;
  border-radius:50%;background:var(--gold);box-shadow:0 0 0 5px rgba(184,153,104,.18);
}
.tl-item:nth-child(even)::before{right:auto;left:-5px}
.tl-year{
  font-family:'Cormorant Garamond',serif;font-size:1.9rem;color:var(--gold);
  line-height:1;display:block;margin-bottom:8px;
}
.tl-item h6{font-size:1.2rem;font-family:'Cormorant Garamond',serif;margin-bottom:6px}
.tl-item p{color:var(--muted);font-size:.93rem;margin:0;line-height:1.7}
@media(max-width:767px){
  .timeline::before{left:8px}
  .tl-item,.tl-item:nth-child(even){
    width:100%;margin-left:0;padding:0 0 44px 40px;text-align:left;
  }
  .tl-item::before,.tl-item:nth-child(even)::before{left:3px;right:auto}
}

/* ---------- CTA banner ---------- */
.cta-banner{
  position:relative;padding:120px 0;
  background-size:cover;background-position:center;background-attachment:fixed;
  text-align:center;color:#fff;
}
.cta-banner::before{content:"";position:absolute;inset:0;background:rgba(15,14,12,.68)}
.cta-banner .container{position:relative;z-index:1}
.cta-banner h2{font-size:clamp(2rem,4vw,3.2rem);max-width:760px;margin:0 auto 1rem}
.cta-banner p{color:#d9cdb4;max-width:560px;margin:0 auto 2rem;line-height:1.75}
@media(max-width:991px){.cta-banner{background-attachment:scroll}}

/* ---------- Services: detail rows ---------- */
.service-detail{padding:40px 0}
.sd-image{position:relative;overflow:hidden}
.sd-image img{width:100%;height:100%;min-height:380px;object-fit:cover;display:block;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.sd-image:hover img{transform:scale(1.05)}
.sd-image::after{
  content:"";position:absolute;inset:14px;border:1px solid rgba(232,215,140,.4);pointer-events:none;
}
.sd-list{list-style:none;padding:0;margin:1.4rem 0 0}
.sd-list li{
  padding:10px 0;color:var(--charcoal);display:flex;gap:12px;align-items:flex-start;
  border-bottom:1px solid rgba(0,0,0,.06);font-size:.97rem;
}
.sd-list i{color:var(--gold);margin-top:3px}

/* ---------- Services: technology chips ---------- */
.tech-strip{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.tech-chip{
  padding:13px 26px;border:1px solid rgba(184,153,104,.4);background:#fff;
  font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--charcoal);
  display:inline-flex;align-items:center;gap:10px;transition:all .35s ease;
}
.tech-chip i{color:var(--gold)}
.tech-chip:hover{background:var(--charcoal);color:#fff;border-color:var(--charcoal)}

/* ---------- Portfolio page ---------- */
.folio-filters{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:44px}
.folio-filter{
  padding:11px 26px;border:1px solid rgba(0,0,0,.14);background:transparent;
  font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--charcoal);
  cursor:pointer;transition:all .35s ease;
}
.folio-filter:hover{border-color:var(--gold);color:var(--gold-dark)}
.folio-filter.is-active{background:var(--charcoal);border-color:var(--charcoal);color:#fff}
.folio-card{cursor:pointer}
.folio-card.is-hidden{display:none}
.folio-meta .folio-year{
  display:inline-block;margin-top:6px;font-size:.62rem;letter-spacing:.24em;
  text-transform:uppercase;color:rgba(255,255,255,.75);
}
.lightbox-caption-extra{
  display:flex;gap:18px;flex-wrap:wrap;margin-top:10px;
  font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:#c9b89a;
}
.lightbox-caption-extra span i{color:var(--gold);margin-right:6px}

/* ---------- Contact page ---------- */
.contact-hero-cards{margin-top:-70px;position:relative;z-index:2}
.ch-card{
  background:#fff;border:1px solid rgba(0,0,0,.06);padding:34px 28px;height:100%;
  text-align:center;transition:all .4s ease;box-shadow:0 24px 60px rgba(0,0,0,.06);
}
.ch-card:hover{transform:translateY(-6px)}
.ch-card i{font-size:1.7rem;color:var(--gold);display:block;margin-bottom:14px}
.ch-card h6{font-family:'Cormorant Garamond',serif;font-size:1.25rem;margin-bottom:6px}
.ch-card p,.ch-card a{color:var(--muted);font-size:.92rem;margin:0;text-decoration:none;transition:color .3s}
.ch-card a:hover{color:var(--gold-dark)}
.map-wrap.map-tall{height:420px}

/* ---------- Generic ---------- */
.section-tight{padding:80px 0}
.bg-beige{background:var(--beige)}
.bg-white{background:#fff}
.bg-ivory{background:var(--ivory)}