/* ══════════════════════════════════════════
   HOME — Homepage-specific styles
   ══════════════════════════════════════════ */

/* ── Hero (4-column) ── */
.hero { height: 100vh; min-height: 680px; display: grid; grid-template-columns: repeat(4,1fr); position: relative; }
.hero-col { position: relative; overflow: hidden; cursor: pointer; }
.hero-col img { width: 100%; height: 100%; object-fit: cover; display: block; transform: scale(1.07); transition: transform 1s cubic-bezier(.25,.46,.45,.94), filter .8s; filter: brightness(.38) saturate(.6); }
.hero-col:hover img { transform: scale(1.0); filter: brightness(.6) saturate(.9); }
.hero-col-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(20,18,16,.93) 0%, rgba(20,18,16,.18) 55%, transparent 100%);
  transition: background .5s;
}
.hero-col:hover .hero-col-overlay { background: linear-gradient(to top, rgba(30,20,10,.97) 0%, rgba(30,20,10,.45) 55%, transparent 100%); }
.hero-col-num { position: absolute; top: 22px; right: 18px; font-family: 'Bebas Neue', sans-serif; font-size: 4.5rem; line-height: 1; color: rgba(196,154,85,.1); transition: color .4s; user-select: none; }
.hero-col:hover .hero-col-num { color: rgba(196,154,85,.32); }
.hero-col-tag { position: absolute; left: 30px; bottom: 160px; font-size: .57rem; letter-spacing: .35em; text-transform: uppercase; color: var(--gold); opacity: 0; transform: translateY(6px); transition: all .4s .05s; }
.hero-col:hover .hero-col-tag { opacity: 1; transform: translateY(0); }
.hero-col-line { position: absolute; left: 30px; bottom: 145px; width: 0; height: 1px; background: var(--gold); transition: width .55s cubic-bezier(.25,.46,.45,.94); }
.hero-col:hover .hero-col-line { width: 34px; }
.hero-col-title { position: absolute; left: 30px; bottom: 72px; font-family: 'Bebas Neue', sans-serif; font-size: clamp(1.45rem,2vw,2.1rem); letter-spacing: .06em; line-height: 1.1; color: var(--cream); transition: transform .45s; }
.hero-col:hover .hero-col-title { transform: translateY(-4px); }
.hero-col-sub { position: absolute; left: 30px; bottom: 16px; font-size: .71rem; color: var(--ash); line-height: 1.55; font-weight: 300; opacity: 0; transform: translateY(6px); transition: all .45s .1s; max-width: 215px; right: 16px; }
.hero-col:hover .hero-col-sub { opacity: 1; transform: translateY(0); }
.hero-col:not(:last-child)::after { content: ''; position: absolute; top: 0; right: 0; width: 1px; height: 100%; background: linear-gradient(to bottom, transparent, rgba(196,154,85,.22) 50%, transparent); z-index: 2; }

/* Hero overlay text */
.hero-overlay-text { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; pointer-events: none; z-index: 10; text-align: center; }
.hero-overlay-text h1 { font-family: 'Cormorant Garamond', serif; font-size: clamp(3.5rem,7vw,8.5rem); font-weight: 300; font-style: italic; line-height: .95; color: var(--cream); text-shadow: 0 4px 60px rgba(0,0,0,.7); opacity: 0; animation: fadeUp 1.2s .2s cubic-bezier(.25,.46,.45,.94) forwards; }
.hero-overlay-text h1 strong { display: block; font-family: 'Bebas Neue', sans-serif; font-style: normal; font-weight: 400; font-size: 1.12em; color: var(--gold); letter-spacing: .05em; }
.hero-overlay-text p { font-size: .66rem; letter-spacing: .44em; text-transform: uppercase; color: rgba(192,187,178,.7); margin-top: 20px; opacity: 0; animation: fadeUp 1.2s .65s cubic-bezier(.25,.46,.45,.94) forwards; }

/* Hero scroll indicator */
.hero-scroll { position: absolute; bottom: 34px; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 9px; z-index: 11; opacity: 0; animation: fadeUp 1s 1.3s forwards; }
.hero-scroll span { font-size: .55rem; letter-spacing: .35em; text-transform: uppercase; color: rgba(192,187,178,.45); }
.scroll-bar { width: 1px; height: 46px; background: linear-gradient(to bottom, var(--gold), transparent); animation: scrollPulse 2.2s ease-in-out infinite; }
@keyframes scrollPulse { 0%,100% { opacity: .3; transform: scaleY(1); } 50% { opacity: 1; transform: scaleY(.65) translateY(8px); } }

/* ── About ── */
.about { display: grid; grid-template-columns: 1fr 1fr; background: var(--warm-white); color: var(--bark); min-height: 88vh; }
.about-img { position: relative; overflow: hidden; }
.about-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s cubic-bezier(.25,.46,.45,.94); }
.about-img:hover img { transform: scale(1.04); }
.about-badge { position: absolute; bottom: 52px; right: -16px; width: 126px; height: 126px; background: var(--gold); border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; box-shadow: -8px 8px 40px rgba(0,0,0,.22); animation: glow 4s ease-in-out infinite; }
.about-badge strong { font-family: 'Bebas Neue', sans-serif; font-size: 2.7rem; color: var(--bark); line-height: 1; }
.about-badge small { font-size: .46rem; letter-spacing: .18em; font-weight: 500; color: var(--timber); text-align: center; padding: 0 8px; margin-top: 2px; }
@keyframes glow { 0%,100% { box-shadow: -8px 8px 40px rgba(0,0,0,.22); } 50% { box-shadow: -12px 12px 55px rgba(196,154,85,.38); } }
.about-content { padding: 90px 72px; display: flex; flex-direction: column; justify-content: center; }
.about-content .label { font-size: .57rem; letter-spacing: .42em; color: var(--wood); margin-bottom: 20px; }
.about-content .label::before { width: 26px; background: var(--gold); }
.about-content h2 { font-family: 'Cormorant Garamond', serif; font-size: clamp(2.2rem,3.5vw,4rem); font-weight: 300; line-height: 1.1; color: var(--bark); margin-bottom: 26px; }
.about-content h2 em { color: var(--wood); font-style: italic; }
.about-content p { font-size: .9rem; line-height: 1.88; color: var(--timber); font-weight: 300; max-width: 450px; margin-bottom: 16px; }
.about-pillars { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 40px; }
.pillar { padding: 20px 18px; border: 1px solid rgba(74,46,18,.11); background: rgba(255,255,255,.5); transition: all .4s; position: relative; overflow: hidden; }
.pillar::after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background: var(--gold); transition: width .4s; }
.pillar:hover::after { width: 100%; }
.pillar:hover { background: #fff; box-shadow: 0 8px 30px rgba(74,46,18,.08); transform: translateY(-2px); }
.pillar img { width: 30px; height: 30px; margin-bottom: 9px; filter: sepia(1) saturate(1.5) hue-rotate(5deg); }
.pillar h4 { font-family: 'Cormorant Garamond', serif; font-size: .98rem; font-weight: 600; color: var(--bark); margin-bottom: 5px; }
.pillar p { font-size: .74rem !important; color: var(--timber) !important; margin: 0 !important; line-height: 1.55 !important; font-weight: 300 !important; }

/* ── Services ── */
.services { background: var(--charcoal); padding: 120px 72px; position: relative; overflow: hidden; }
.services-bg { position: absolute; top: 30px; right: -10px; font-family: 'Bebas Neue', sans-serif; font-size: 13rem; color: rgba(196,154,85,.03); pointer-events: none; user-select: none; white-space: nowrap; letter-spacing: .05em; }
.services-header { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 64px; }
.services-header h2 { font-family: 'Cormorant Garamond', serif; font-size: clamp(2.5rem,4vw,5rem); font-weight: 300; font-style: italic; line-height: 1.05; }
.services-header p { max-width: 270px; font-size: .8rem; line-height: 1.8; color: var(--ash); font-weight: 300; }
.services-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; background: rgba(196,154,85,.07); }
.svc { background: var(--charcoal); padding: 50px 38px; position: relative; overflow: hidden; transition: background .5s; }
.svc::before { content: ''; position: absolute; inset: 0; background: var(--timber); transform: scaleY(0); transform-origin: bottom; transition: transform .55s cubic-bezier(.25,.46,.45,.94); z-index: 0; }
.svc:hover::before { transform: scaleY(1); }
.svc > * { position: relative; z-index: 1; }
.svc-num { font-family: 'Bebas Neue', sans-serif; font-size: 3.2rem; color: rgba(196,154,85,.12); line-height: 1; margin-bottom: 14px; transition: color .4s; }
.svc:hover .svc-num { color: rgba(196,154,85,.42); }
.svc h3 { font-family: 'Bebas Neue', sans-serif; font-size: 1.5rem; letter-spacing: .05em; color: var(--cream); margin-bottom: 12px; transition: color .3s; }
.svc:hover h3 { color: var(--gold-light); }
.svc p { font-size: .79rem; line-height: 1.8; color: var(--ash); font-weight: 300; transition: color .3s; }
.svc:hover p { color: var(--cream); }
.svc-link { display: inline-flex; align-items: center; gap: 9px; margin-top: 22px; font-size: .62rem; letter-spacing: .28em; text-transform: uppercase; color: var(--gold); opacity: 0; transform: translateX(-8px); transition: all .4s .08s; text-decoration: none; }
.svc-link::after { content: '\2192'; font-size: .88rem; letter-spacing: 0; }
.svc:hover .svc-link { opacity: 1; transform: translateX(0); }

/* ── Mission / Vision ── */
.mv { display: grid; grid-template-columns: 1fr 1fr; }
.mv-block { padding: 100px 72px; position: relative; overflow: hidden; }
.mv-block:first-child { background: var(--bark); border-right: 1px solid rgba(196,154,85,.12); }
.mv-block:last-child { background: var(--timber); }
.mv-block::before { position: absolute; top: -20px; right: -10px; font-family: 'Bebas Neue', sans-serif; font-size: 17rem; opacity: .032; color: var(--gold); line-height: 1; pointer-events: none; user-select: none; }
.mv-block:first-child::before { content: 'M'; }
.mv-block:last-child::before { content: 'V'; }
.mv-block .label { color: var(--gold); }
.mv-block .label::before { background: var(--gold); }
.mv-block h3 { font-family: 'Cormorant Garamond', serif; font-size: clamp(1.8rem,2.6vw,3rem); font-weight: 300; font-style: italic; color: var(--cream); margin-bottom: 20px; line-height: 1.2; }
.mv-block p { font-size: .88rem; line-height: 1.88; color: var(--ash); font-weight: 300; max-width: 380px; }
.mv-block blockquote { font-family: 'Cormorant Garamond', serif; font-size: 1.15rem; font-style: italic; color: var(--gold); border-left: 2px solid var(--gold); padding-left: 20px; margin-top: 32px; line-height: 1.6; font-weight: 300; }

/* ── Clients ── */
.clients { background: var(--warm-white); padding: 100px 72px; color: var(--bark); }
.clients-head { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 52px; }
.clients-head h2 { font-family: 'Cormorant Garamond', serif; font-size: clamp(1.9rem,3.2vw,3.8rem); font-weight: 300; font-style: italic; }
.clients-count { font-family: 'Bebas Neue', sans-serif; font-size: 3.8rem; color: var(--gold); line-height: 1; }
.clients-count small { display: block; font-family: 'DM Sans', sans-serif; font-size: .57rem; letter-spacing: .28em; text-transform: uppercase; color: var(--wood); margin-top: 3px; }
.clients-grid { display: grid; grid-template-columns: repeat(6,1fr); gap: 2px; background: rgba(74,46,18,.07); }
.client { background: var(--warm-white); padding: 32px 20px; display: flex; align-items: center; justify-content: center; transition: all .35s; }
.client:hover { background: #fff; box-shadow: 0 6px 28px rgba(74,46,18,.09); z-index: 1; position: relative; }
.client img { max-width: 150px; max-height: 105px; width: 100%; height: auto; object-fit: contain; filter: grayscale(100%) opacity(.65); transition: filter .4s; }
.client:hover img { filter: grayscale(0%) opacity(1); }