/* ── Page hero adjustment ── */
    .xp-hero {
      position: relative;
      padding: clamp(7rem, 14vh, 11rem) 0 clamp(3rem, 6vh, 5rem);
      overflow: hidden;
      background: #0a0a0b;
    }
    .xp-hero-inner {
      position: relative;
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 3rem;
      align-items: end;
    }
    .xp-hero-tag {
      font-family: var(--pp);
      font-size: .65rem;
      letter-spacing: .4em;
      text-transform: uppercase;
      color: var(--red);
      margin-bottom: 1.2rem;
      display: flex;
      align-items: center;
      gap: .7rem;
    }
    .xp-hero-tag::before {
      content: '';
      width: 28px;
      height: 1px;
      background: var(--red);
    }
    .xp-hero h1 {
      font-family: var(--sf);
      font-size: clamp(3.5rem, 9vw, 8rem);
      font-weight: 700;
      line-height: 1.02;
      letter-spacing: -.015em;
      text-transform: uppercase;
      color: var(--white);
    }
    .xp-hero h1 em {
      font-style: normal;
      color: var(--red);
    }
    .xp-hero-sub {
      font-family: var(--pp);
      font-size: clamp(.85rem, 1.1vw, 1rem);
      color: rgba(255,255,255,.55);
      max-width: 520px;
      line-height: 1.6;
      margin-top: 1.4rem;
    }
    .xp-hero-meta {
      display: flex;
      flex-direction: column;
      gap: .4rem;
      align-items: flex-end;
      font-family: var(--pp);
      font-size: .58rem;
      letter-spacing: .22em;
      text-transform: uppercase;
      color: rgba(255,255,255,.35);
    }
    .xp-hero-meta b {
      font-family: var(--sf);
      font-size: 3rem;
      letter-spacing: 0;
      color: var(--red);
      line-height: 1;
    }

    /* ── Category section ─ sadece gri/siyah ton ayırımı ── */
    .xp-cat {
      padding: clamp(5rem, 10vh, 8rem) 0 clamp(5rem, 10vh, 8rem);
    }
    .xp-cat[data-cat="main"]      { background: #050505; }
    .xp-cat[data-cat="hubs"]      { background: #0d0d0f; }
    .xp-cat[data-cat="lab"]       { background: #050505; }
    .xp-cat[data-cat="dna"]       { background: #0d0d0f; }
    .xp-cat[data-cat="editorial"] { background: #050505; }
    .xp-cat[data-cat="agency"]    { background: #0d0d0f; }
    .xp-cat-head {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 1.5rem 3rem;
      align-items: start;
      margin-bottom: 2.8rem;
    }
    .xp-cat-titlewrap {
      display: flex;
      flex-direction: column;
      gap: .9rem;
      min-width: 0;
    }
    .xp-cat-title {
      font-family: var(--sf);
      font-size: clamp(2rem, 4vw, 3.2rem);
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .005em;
      line-height: 1.08;
      color: var(--white);
      margin: 0;
    }
    .xp-cat-title em {
      font-style: normal;
      color: var(--red);
    }
    .xp-cat-desc {
      font-family: var(--pp);
      font-size: .78rem;
      color: rgba(255,255,255,.55);
      letter-spacing: .015em;
      max-width: 56ch;
      line-height: 1.65;
      margin: 0;
    }
    .xp-cat-index {
      font-family: var(--sf);
      font-size: clamp(2.4rem, 5vw, 4rem);
      font-weight: 700;
      line-height: .9;
      letter-spacing: -.02em;
      color: rgba(255,255,255,.08);
      display: flex;
      align-items: baseline;
      gap: .3rem;
      white-space: nowrap;
    }
    .xp-cat-index sup {
      font-family: var(--pp);
      font-size: .55rem;
      font-weight: 500;
      letter-spacing: .28em;
      color: rgba(255,255,255,.28);
      text-transform: uppercase;
      top: 0;
      align-self: flex-start;
      padding-top: .3rem;
    }

    /* ── Card grid ── */
    .xp-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
      gap: 1rem;
    }

    /* ── CARD ── */
    .xp-card {
      display: flex;
      flex-direction: column;
      gap: 1rem;
      padding: 1.8rem 1.5rem 1.5rem;
      min-height: 19rem;
      text-decoration: none;
      color: var(--white);
      background: #0a0a0a;
      border: 1px solid rgba(255,255,255,.06);
      position: relative;
      overflow: hidden;
      transition: background .35s, border-color .35s;
    }
    .xp-card:hover {
      background: #0d0d0d;
      border-color: rgba(255,255,255,.12);
    }
    .xp-card::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 1px;
      background: var(--red);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform .45s cubic-bezier(.22,1,.36,1);
    }
    .xp-card:hover::before { transform: scaleX(1); }

    .xp-card-top {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
    }
    .xp-card-ico {
      font-family: var(--pp);
      font-size: .42rem;
      letter-spacing: .22em;
      text-transform: uppercase;
      color: rgba(255,255,255,.22);
      display: inline-flex;
      align-items: center;
      gap: .5rem;
      width: auto; height: auto;
      border: none;
      background: none;
    }
    .xp-card-ico i {
      font-size: .62rem;
      color: rgba(255,255,255,.3);
      transition: color .3s;
    }
    .xp-card:hover .xp-card-ico i { color: var(--red); }
    .xp-card-arrow {
      font-size: .55rem;
      color: rgba(255,255,255,.25);
      transition: color .3s, transform .3s;
    }
    .xp-card:hover .xp-card-arrow {
      color: var(--red);
      transform: translate(3px, -3px);
    }

    .xp-card-title {
      font-family: var(--sf);
      font-size: clamp(1.5rem, 2.2vw, 1.95rem);
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: -.02em;
      line-height: 1.1;
      color: var(--white);
      margin: 2rem 0 0;
      transition: color .35s ease;
    }
    .xp-card:hover .xp-card-title { color: var(--red); }

    /* Row 3 */
    .xp-card-desc {
      font-family: var(--pp);
      font-size: .62rem;
      line-height: 1.7;
      color: rgba(255,255,255,.3);
      max-width: 340px;
      margin: 0;
      transition: color .3s;
    }
    .xp-card:hover .xp-card-desc { color: rgba(255,255,255,.55); }

    .xp-card-tags {
      display: flex;
      gap: .4rem;
      flex-wrap: wrap;
    }
    .xp-card-tag {
      font-family: var(--pp);
      font-size: .4rem;
      letter-spacing: .22em;
      text-transform: uppercase;
      color: rgba(255,255,255,.35);
      padding: .24rem .55rem;
      border: 1px solid rgba(255,255,255,.07);
      transition: color .3s, border-color .3s;
    }
    .xp-card:hover .xp-card-tag { color: rgba(255,255,255,.55); }
    .xp-card-tag.tag-new {
      color: var(--red);
      border-color: rgba(233,32,56,.32);
    }
    .xp-card-tag.tag-tr {
      color: #f7b500;
      border-color: rgba(247,181,0,.28);
    }
    .xp-card-tag.tag-lab {
      color: rgba(233,32,56,.85);
      border-color: rgba(233,32,56,.25);
    }

    .xp-card-path {
      margin-top: auto;
      font-family: var(--pp);
      font-size: .44rem;
      letter-spacing: .22em;
      text-transform: uppercase;
      color: rgba(233,32,56,.8);
      display: inline-flex;
      align-items: center;
      gap: .45rem;
      padding-top: .9rem;
      border-top: 1px solid rgba(255,255,255,.04);
      transition: color .3s ease, letter-spacing .3s ease;
    }
    .xp-card:hover .xp-card-path {
      color: var(--red);
      letter-spacing: .26em;
    }
    .xp-card-path i {
      font-size: .42rem;
      color: rgba(233,32,56,.45);
      transition: color .3s;
    }
    .xp-card:hover .xp-card-path i { color: var(--red); }
    .xp-card-path strong {
      color: rgba(255,255,255,.45);
      font-weight: 400;
      letter-spacing: .12em;
    }

    .xp-card-featured {
      background: #0e0e10;
    }
    .xp-card-featured:hover {
      background: #121214;
    }

    /* ── Responsive ── */
    @media (max-width: 900px) {
      .xp-cat { padding: clamp(3.5rem, 7vh, 5rem) 0; }
      .xp-hero-inner { grid-template-columns: 1fr; gap: 1.8rem; }
      .xp-cat-head { grid-template-columns: 1fr auto; gap: .8rem 1rem; }
      .xp-cat-desc { max-width: 100%; }
      .xp-cat-index { font-size: 2rem; }
      .xp-cat-index sup { font-size: .48rem; letter-spacing: .2em; }
      .xp-grid { grid-template-columns: 1fr; gap: .8rem; }
      .xp-card { min-height: 16rem; padding: 1.5rem 1.3rem 1.2rem; }
      .xp-card-title { font-size: 1.5rem; margin-top: 1.4rem; }
    }