.pd-site .pd-design-index .hero{
      position: relative;
      min-height: 100svh;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      padding-bottom: clamp(4rem, 8vw, 6rem);
      overflow: hidden;
    }
.pd-site .pd-design-index .hero-bg{
      position: absolute;
      inset: 0;
      
      background-size: cover;
      background-position: center left;
      transform-origin: center;
    }
.pd-site .pd-design-index .hero-overlay{
      position: absolute;
      inset: 0;
      background: linear-gradient(to top, rgba(26,25,24,0.88) 0%, rgba(26,25,24,0.35) 45%, rgba(26,25,24,0.08) 100%);
    }
.pd-site .pd-design-index .hero-content{
      position: relative;
      z-index: 2;
      max-width: var(--wide);
      margin-inline: auto;
      padding-inline: clamp(1.25rem, 4vw, 3rem);
      width: 100%;
    }
.pd-site .pd-design-index .hero h1{
      font-size: var(--t-hero);
      font-weight: 700;
      color: #fff;
      line-height: 1.05;
      letter-spacing: -0.03em;
      max-width: 10ch;
      margin-bottom: var(--s-6);
    }
.pd-site .pd-design-index .hero h1 em{
      font-style: italic;
      background: var(--g-brand);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
.pd-site .pd-design-index .hero-sub{
      font-size: var(--t-lg);
      color: rgba(255,255,255,0.65);
      max-width: 440px;
      line-height: 1.65;
      margin-bottom: var(--s-10);
    }
.pd-site .pd-design-index .hero-stats{
      display: flex;
      gap: clamp(2rem, 4vw, 4rem);
      padding-top: var(--s-10);
      border-top: 1px solid rgba(255,255,255,0.15);
      margin-top: var(--s-10);
    }
.pd-site .pd-design-index .hero-stat-val{
      font-family: var(--heading);
      font-size: var(--t-3xl);
      font-weight: 400;
      color: #fff;
      line-height: 1;
      display: block;
    }
.pd-site .pd-design-index .hero-stat-lbl{
      font-size: var(--t-xs);
      color: rgba(255,255,255,0.45);
      letter-spacing: 0.08em;
      display: block;
      margin-top: var(--s-1);
    }
.pd-site .pd-design-index .hero-scroll{
      position: absolute;
      bottom: 2.5rem;
      right: clamp(1.25rem, 4vw, 3rem);
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: var(--s-2);
      color: rgba(255,255,255,0.4);
      font-size: var(--t-xs);
      letter-spacing: 0.1em;
      text-transform: uppercase;
      writing-mode: vertical-lr;
    }
.pd-site .pd-design-index .hero-scroll::after{
      content: '';
      width: 1px;
      height: 48px;
      background: linear-gradient(to bottom, rgba(255,255,255,0.4), transparent);
      display: block;
    }
.pd-site .pd-design-index .services-grid{
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      grid-template-rows: 420px 340px;
      gap: 16px;
    }
.pd-site .pd-design-index .services-grid .service-card:first-child{
      grid-column: span 2;
    }
.pd-site .pd-design-index .portfolio-preview{
      display: grid;
      grid-template-columns: 1.4fr 1fr 1fr;
      grid-template-rows: 320px 260px;
      gap: 12px;
    }
.pd-site .pd-design-index .portfolio-preview .pp-item:first-child{
      grid-row: span 2;
    }
.pd-site .pd-design-index .pp-item{
      position: relative;
      overflow: hidden;
      border-radius: var(--r-md);
      background: var(--sand);
    }
.pd-site .pd-design-index .pp-item img{
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform var(--ease-img);
    }
.pd-site .pd-design-index .pp-item:hover img{ transform: scale(1.05); }
.pd-site .pd-design-index .split-section{
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: clamp(3rem, 6vw, 6rem);
      align-items: center;
    }
.pd-site .pd-design-index .split-img-stack{
      position: relative;
      height: 520px;
    }
.pd-site .pd-design-index .split-img-main{
      position: absolute;
      top: 0; left: 0;
      width: 75%; height: 80%;
      object-fit: cover;
      border-radius: var(--r-lg);
      box-shadow: var(--sh-xl);
    }
.pd-site .pd-design-index .split-img-secondary{
      position: absolute;
      bottom: 0; right: 0;
      width: 58%; height: 52%;
      object-fit: cover;
      border-radius: var(--r-lg);
      box-shadow: var(--sh-lg);
      border: 5px solid var(--off-white);
    }
.pd-site .pd-design-index .split-img-badge{
      position: absolute;
      top: 42%;
      left: 68%;
      transform: translate(-50%, -50%);
      background: var(--white);
      border-radius: var(--r-lg);
      padding: var(--s-4) var(--s-5);
      box-shadow: var(--sh-lg);
      text-align: center;
      z-index: 5;
    }
.pd-site .pd-design-index .split-img-badge strong,.pd-site .pd-design-index .split-img-badge strong span{
      font-family: var(--heading);
      font-size: var(--t-3xl);
      font-weight: 700;
      display: block;
      line-height: 1;
      text-align: center;
      background: var(--g-brand);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
.pd-site .pd-design-index .split-img-badge span{
      font-size: var(--t-xs);
      color: var(--gray-500);
      font-weight: 500;
      display: block;
      text-align: center;
      line-height: 1.2;
      margin-top: var(--s-1);
    }
.pd-site .pd-design-index .testimonials-grid{
      margin-top: var(--s-20);
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: clamp(1.25rem, 2.5vw, 2rem);
    }
.pd-site .pd-design-index .case-preview-wrap{
      border-radius: var(--r-xl);
      overflow: hidden;
      position: relative;
      min-height: 480px;
      display: flex;
      align-items: flex-end;
    }
.pd-site .pd-design-index .case-preview-img{
      position: absolute;
      inset: 0;
      width: 100%; height: 100%;
      object-fit: cover;
      transition: transform var(--ease-img);
    }
.pd-site .pd-design-index .case-preview-wrap:hover .case-preview-img{ transform: scale(1.03); }
.pd-site .pd-design-index .case-preview-overlay{
      position: absolute;
      inset: 0;
      background: linear-gradient(to right, rgba(26,25,24,0.90) 0%, rgba(26,25,24,0.3) 60%, transparent 100%);
    }
.pd-site .pd-design-index .case-preview-content{
      position: relative;
      padding: clamp(2.5rem, 5vw, 4rem);
      max-width: 560px;
    }
@media (max-width: 1024px){.pd-site .pd-design-index .services-grid{
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto;
      }
.pd-site .pd-design-index .services-grid .service-card:first-child{ grid-row: auto; }
.pd-site .pd-design-index .services-grid .service-card:nth-child(2){ grid-column: auto; }
.pd-site .pd-design-index .portfolio-preview{ grid-template-columns: 1fr 1fr; }
.pd-site .pd-design-index .portfolio-preview .pp-item:first-child{ grid-row: auto; }
}
@media (max-width: 768px){.pd-site .pd-design-index .split-section{ grid-template-columns: 1fr; }
.pd-site .pd-design-index .split-img-stack{ height: 360px; }
.pd-site .pd-design-index .services-grid{ grid-template-columns: 1fr; }
.pd-site .pd-design-index .testimonials-grid{ grid-template-columns: 1fr; }
.pd-site .pd-design-index .hero-stats{ flex-wrap: wrap; gap: var(--s-6); }
}