/* HERO */
.hero { position: relative; height: 100svh; min-height: 540px; display: flex; align-items: flex-end; overflow: hidden; }
.hero-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.hero-ov { position: absolute; inset: 0; background: linear-gradient(160deg, rgba(30,20,15,.1) 0%, rgba(30,20,15,.65) 100%); z-index: 1; }
.hero-c { position: relative; z-index: 2; padding: 0 3rem 5rem; max-width: 640px; }
.eyebrow { font-size: .64rem; letter-spacing: .24em; text-transform: uppercase; color: var(--clay); margin-bottom: .9rem; }
.hero-c h1 { font-family: var(--serif); font-size: clamp(2.6rem,6vw,5rem); font-weight: 400; line-height: 1.1; color: #fff; margin-bottom: 1.8rem; }
.hero-c h1 em { font-style: italic; color: var(--clay); }

/* COLLECTIONS */
.svc { display: grid; grid-template-columns: 1fr 1fr; }
.svc-l { background: var(--linen); padding: 5rem 4rem; display: flex; flex-direction: column; gap: 2.4rem; }
.svc-l h2 { font-family: var(--serif); font-size: clamp(1.8rem,3vw,2.8rem); font-weight: 400; line-height: 1.18; }
.svc-l p { font-size: .95rem; line-height: 1.85; color: var(--dusk); max-width: 400px; }
.svc-list { list-style: none; color: var(--bark); }
.svc-list li { padding: .9rem 0; border-top: 1px solid var(--smoke); font-size: .92rem; }
.svc-list li:last-child { border-bottom: 1px solid var(--smoke); }
.svc-list li a { display: flex; justify-content: space-between; align-items: center; color: var(--bark); text-decoration: none; }
.svc-list li:hover a { color: var(--clay); }
.ar { transition: transform .25s; }
.svc-list li:hover .ar { transform: translateX(5px); }
.svc-r { display: flex; align-items: stretch; overflow: hidden; }
.svc-r img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* PHILOSOPHY */
.phi { display: grid; grid-template-columns: 1fr 1fr; }
.phi-img {  height: 600px ; object-fit: cover; object-position: center 20px  }
.phi-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.phi-t { background: var(--bark); color: var(--linen); padding: 5rem 4.5rem; display: flex; flex-direction: column; justify-content: center; gap: 1.2rem; }
.phi-t .label { color: var(--clay); margin-bottom: 0; }
.phi-t h2 { font-family: var(--serif); font-size: clamp(1.8rem,3vw,2.8rem); font-weight: 400; line-height: 1.22; }
.phi-t p { font-size: .95rem; line-height: 1.85; color: rgba(240,235,227,.68); max-width: 420px; }

/* PROCESS */
.proc { background: var(--linen); padding: 5rem 3rem; }
.proc h2 { font-family: var(--serif); font-size: clamp(1.8rem,3vw,2.6rem); font-weight: 400; text-align: center; margin-bottom: .4rem; }
.proc-sub { text-align: center; font-size: .92rem; color: var(--dusk); margin-bottom: 3.5rem; }
.psteps { display: grid; grid-template-columns: repeat(4,1fr); gap: 2rem; }
.ps { text-align: center; padding: 1.2rem .8rem; }
.psn { font-family: var(--serif); font-size: 2.8rem; font-weight: 400; color: var(--smoke); line-height: 1; margin-bottom: .7rem; }
.ps h3 { font-family: var(--serif); font-size: 1.1rem; font-weight: 400; margin-bottom: .5rem; }
.ps p { font-size: .9rem; line-height: 1.8; color: var(--dusk); }

/* RESPONSIVE */
@media (max-width: 900px) {
  .svc, .phi { grid-template-columns: 1fr; }
  .svc-r { min-height: 280px; }
  .svc-r img { height: 280px; }
    .phi {
    display: flex;
    flex-direction: column;
  }

  .phi-t {
    order: 1;
    padding: 3rem 1.4rem;
  }

  .phi-img {
    order: 2;
    min-height: 260px;
  }

  .phi-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

@media (max-width: 520px) {
  .hero-c { padding: 0 1.2rem 3rem; }
  .wgrid { grid-template-columns: 1fr; }
  .psteps { grid-template-columns: 1fr; }
}