/* Cohen Lawyers - insights-index template */
:root { --neutral-bg: #F9F8F6; }
body { font-size: 16px; line-height: 1.6; }
ul { list-style: none; }
button { font-family: inherit; }
:focus-visible { outline: 3px solid var(--black); outline-offset: 2px; }
.btn { font-family: var(--font-ui); min-height: 48px; }
.btn--ghost { color: var(--white); border-color: var(--white); }
.btn--ghost:hover { background: var(--white); color: var(--black); }
.page-hero { position: relative; min-height: 44vh; display: flex; align-items: flex-end; overflow: hidden; background: #0a0a0a; }
.page-hero__bg { position: absolute; inset: 0; background-image: url('../assets/photography/Cohen_Lawyers_Services_Image_8.png'); background-size: cover; background-position: center 15%; transform: scale(1.04); transition: transform 8s var(--ease-cinematic); }
.page-hero__bg.is-loaded { transform: scale(1); }
.page-hero__overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.4) 100%); }
.page-hero__content { position: relative; z-index: 2; width: 100%; padding: 140px 48px 80px; max-width: 720px; }
.page-hero__eyebrow { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-ui); font-size: 10px; font-weight: 400; letter-spacing: 0.38em; text-transform: uppercase; color: var(--paper-40); margin-bottom: 24px; opacity: 0; animation: fadeUp 500ms var(--ease-cinematic) 200ms forwards; }
.page-hero__h1 { font-family: var(--font-ui); font-weight: 700; font-style: normal; font-size: clamp(40px, 6vw, 76px); letter-spacing: -0.02em; line-height: 1.08; color: var(--white); margin-bottom: 20px; opacity: 0; animation: fadeUp 600ms var(--ease-cinematic) 500ms forwards; }
.breadcrumb__list { color: var(--ink-40); }
.articles-section { background: var(--white); }
.articles__filter { display: flex; align-items: center; gap: 8px; margin-bottom: 48px; flex-wrap: wrap; }
.filter-btn { font-family: var(--font-ui); font-size: 11px; font-weight: 400; letter-spacing: 0.1em; text-transform: uppercase; padding: 8px 16px; border: 1px solid rgba(0,0,0,0.15); background: transparent; cursor: pointer; transition: background var(--d-fast) var(--ease-out), color var(--d-fast) var(--ease-out), border-color var(--d-fast) var(--ease-out); border-radius: 0; color: var(--ink-60); }
.filter-btn.is-active, .filter-btn:hover { background: var(--black); color: var(--white); border-color: var(--black); }
.articles__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; }
.article-card { background: var(--neutral-bg); display: flex; flex-direction: column; overflow: hidden; position: relative; cursor: pointer; }
.article-card__img-wrap { aspect-ratio: 16/9; overflow: hidden; }
.article-card__img { width: 100%; height: 100%; object-fit: cover; transition: transform 400ms var(--ease-cinematic); }
.article-card:hover .article-card__img { transform: scale(1.04); }
.article-card__body { padding: 28px; flex-grow: 1; display: flex; flex-direction: column; }
.article-card__cat { font-family: var(--font-ui); font-size: 10px; font-weight: 400; letter-spacing: 0.38em; text-transform: uppercase; color: var(--ink-40); margin-bottom: 12px; }
.article-card__h2 { font-family: var(--font-ui); font-weight: 700; font-style: normal; font-size: clamp(15px, 1.3vw, 18px); letter-spacing: -0.01em; line-height: 1.3; color: var(--black); margin-bottom: 12px; }
.article-card__excerpt { font-family: var(--font-ui); font-weight: 300; font-size: clamp(12px, 0.9vw, 14px); line-height: 1.7; color: var(--ink-60); flex-grow: 1; margin-bottom: 20px; }
.article-card__meta { display: flex; align-items: center; justify-content: space-between; }
.article-card__date { font-family: var(--font-ui); font-size: 11px; font-weight: 300; color: var(--ink-40); }
.article-card__link { font-family: var(--font-ui); font-size: 11px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; display: inline-flex; align-items: center; gap: 5px; border-bottom: 1px solid rgba(0,0,0,0.2); padding-bottom: 1px; transition: border-color var(--d-fast) var(--ease-out), gap var(--d-fast) var(--ease-cinematic); }
.article-card__link:hover { border-color: var(--black); gap: 8px; }
.article-card__link::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.article-card.is-hidden { display: none; }
.articles__search { position: relative; max-width: 480px; margin-bottom: 32px; }
.articles__search-input { width: 100%; padding: 13px 44px 13px 16px; font-family: var(--font-ui); font-size: 14px; font-weight: 300; color: var(--black); background: var(--neutral-bg); border: 1px solid var(--ink-08); outline: none; transition: border-color var(--d-fast) var(--ease-out); }
.articles__search-input:focus { border-color: rgba(0,0,0,0.28); }
.articles__search-input::placeholder { color: var(--ink-40); }
.articles__search-icon { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); pointer-events: none; color: var(--ink-40); }
.articles__search-count { font-family: var(--font-ui); font-size: 12px; font-weight: 300; color: var(--ink-40); margin-bottom: 20px; min-height: 18px; }
input[type="search"]::-webkit-search-cancel-button { filter: grayscale(1) opacity(0.4); cursor: pointer; }
.articles__pagination { display: flex; align-items: center; gap: 4px; }
.articles__pagination--top { margin-left: auto; }
.articles__pagination--bottom { justify-content: center; margin-top: 48px; }
.page-btn { font-family: var(--font-ui); font-size: 12px; font-weight: 400; min-width: 36px; height: 36px; padding: 0 10px; border: 1px solid rgba(0,0,0,0.15); background: transparent; color: var(--ink-60); cursor: pointer; transition: background var(--d-fast) var(--ease-out), color var(--d-fast) var(--ease-out), border-color var(--d-fast) var(--ease-out); display: inline-flex; align-items: center; justify-content: center; }
.page-btn.is-active { background: var(--black); color: var(--white); border-color: var(--black); }
.page-btn:hover:not(.is-active):not([disabled]) { background: var(--neutral-bg); border-color: rgba(0,0,0,0.3); color: var(--black); }
.page-btn[disabled] { opacity: 0.3; cursor: default; }
.article-card[data-paged-out] { display: none; }
.featured-section { background: var(--black); color: var(--white); }
.featured__inner { display: grid; grid-template-columns: 1fr 1fr; min-height: 480px; }
.featured__img-wrap { overflow: hidden; position: relative; }
.featured__img { width: 100%; height: 100%; object-fit: cover; }
.featured__overlay { position: absolute; inset: 0; background: linear-gradient(to right, transparent 50%, var(--black) 100%); }
.featured__content { padding: 64px 64px 64px 48px; display: flex; flex-direction: column; justify-content: center; }
.featured__cat { font-family: var(--font-ui); font-size: 10px; font-weight: 400; letter-spacing: 0.38em; text-transform: uppercase; color: var(--paper-40); margin-bottom: 20px; }
.featured__h2 { font-family: var(--font-ui); font-weight: 700; font-style: normal; font-size: clamp(28px, 3.2vw, 44px); letter-spacing: -0.02em; line-height: 1.2; color: var(--white); margin-bottom: 20px; }
.featured__h2 em { font-family: var(--font-display); font-weight: 400; font-style: normal; }
.featured__excerpt { font-family: var(--font-ui); font-weight: 300; font-size: clamp(12px, 0.9vw, 14px); line-height: 1.7; color: var(--paper-60); margin-bottom: 32px; }
.featured__meta { display: flex; align-items: center; gap: 24px; margin-bottom: 32px; }
.featured__author { font-family: var(--font-ui); font-size: 12px; font-weight: 400; color: var(--paper-60); }
.featured__date { font-family: var(--font-ui); font-size: 12px; font-weight: 300; color: var(--paper-40); }
.featured__link { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-ui); font-size: 12px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; border-bottom: 1px solid rgba(255,255,255,0.3); padding-bottom: 2px; transition: border-color var(--d-fast) var(--ease-out), gap var(--d-fast) var(--ease-cinematic); }
.featured__link:hover { border-color: var(--white); gap: 12px; }
.cta-section { border-top: 1px solid var(--paper-08); }
.cta__h2 { font-style: normal; line-height: 1.1; }
.cta__h2 em { font-style: normal; }
.cta__phone { font-family: var(--font-ui); font-size: 14px; font-weight: 300; color: var(--paper-60); }

@media (max-width: 1024px) {
  .nav { padding: 20px 32px; }
  .container { padding-inline: 32px; }
  .section { padding-block: 64px; }
  .articles__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 880px) {
  .featured__inner { grid-template-columns: 1fr; }
  .featured__img-wrap { min-height: 300px; }
  .featured__overlay { background: linear-gradient(to top, var(--black) 0%, transparent 60%); }
  .featured__content { padding: 40px 32px; }
  .page-hero__bg { background-position: 72% 15%; }
}

@media (max-width: 640px) {
  .nav { padding: 16px 24px; }
  .container { padding-inline: 24px; }
  .section { padding-block: 48px; }
  .page-hero__content { padding: 110px 24px 64px; }
  .breadcrumb { padding: 14px 24px; }
  .articles__grid { grid-template-columns: 1fr; }
  .articles__filter { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 4px; scrollbar-width: none; }
  .articles__filter::-webkit-scrollbar { display: none; }
  .filter-btn { flex-shrink: 0; }
  .articles__pagination--top { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .reveal-up { transition-duration: 0.01ms !important; }
  .page-hero__eyebrow, .page-hero__h1 { opacity: 1 !important; animation: none !important; }
}