/* Project Details Modern (scoped) */
.pd-modern{
  /* Dark theme tokens */
  --bg: var(--bg-primary);
  --surface: var(--bg-card);
  --surface2: var(--bg-secondary);
  --border: var(--border-subtle);
  --border2: var(--border-normal);

  /* Use site primary as accent */
  --accent: var(--primary);
  --accent-light: var(--primary-light);
  --accent-glow: rgba(59,130,246,.10);

  --text: var(--text-heading);
  --muted: var(--text-muted);
  --muted2: var(--text-secondary);
  --white: var(--text-heading);
  --card-bg: var(--bg-card);

  background: var(--bg-secondary);
  color: var(--text);
  font-family: inherit;
  line-height: 1.6;
  overflow-x: hidden;
}

/* Safety: make links inherit inside modern area */
.pd-modern a{ color:inherit; text-decoration:none; }

.pd-hero{
  width:100%;
  min-height:520px;
  max-width:none;
  margin:0;
  padding:124px max(24px, calc((100% - 1280px) / 2 + 24px)) 48px;
  background:var(--page-hero-bg);
  position:relative;
  overflow:hidden;
  text-align:left;
  display:flex;
  flex-direction:column;
  justify-content:center;
  animation:pd-fadeUp .7s ease both;
}

.pd-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at calc(100% + 120px) -20%, var(--page-hero-glow-a) 0%, transparent 38%),
    radial-gradient(circle at -10% 130%, var(--page-hero-glow-b) 0%, transparent 32%);
  pointer-events:none;
}

.pd-hero::after{
  content:"\f07b";
  position:absolute;
  right:max(24px, calc((100% - 1280px) / 2 + 24px));
  top:50%;
  width:76px;
  height:76px;
  transform:translateY(-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--page-hero-icon-bg);
  border:1px solid var(--page-hero-icon-border);
  border-radius:var(--radius-xl);
  color:var(--primary-light);
  font-family:"Font Awesome 6 Free";
  font-size:2rem;
  font-weight:900;
  pointer-events:none;
}

/* Breadcrumb inside pd-hero */
.pd-breadcrumb {
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:6px;
  font-size:.8rem;
  color:var(--page-hero-crumb);
  margin-bottom:22px;
  position:relative;
  z-index:1;
}
.pd-breadcrumb a {
  color:var(--page-hero-crumb);
  text-decoration:none;
  transition:color .2s;
}
.pd-breadcrumb a:hover { color:var(--page-hero-crumb-h); }
.pd-breadcrumb .bc-sep { color:var(--page-hero-crumb-sep); font-size:.75rem; }
.pd-badge{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  width:max-content;
  background:rgba(59,130,246,.18);
  border:1px solid rgba(59,130,246,.28);
  border-radius:100px;
  padding:5px 14px;
  font-size:.75rem;
  color:var(--primary-light);
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  margin-bottom:14px;
  position:relative;
  z-index:1;
}
.pd-badge-dot{
  width:6px;height:6px;border-radius:50%;
  background:var(--accent);
}
.pd-hero h1{
  font-family:inherit;
  font-size:clamp(2rem, 4vw, 2.9rem);
  font-weight:800;
  line-height:1.15;
  color:var(--page-hero-title);
  max-width:860px;
  margin-bottom:14px;
  letter-spacing:0;
  position:relative;
  z-index:1;
}
.pd-hero-sub{
  font-size:1.05rem;
  color:var(--page-hero-text);
  max-width:580px;
  margin:0;
  line-height:1.75;
  font-weight:400;
  position:relative;
  z-index:1;
}

.pd-hero-image,
.pd-divider-image{
  max-width:none;
  margin:0;
  padding:64px max(24px, calc((100% - 1280px) / 2 + 24px)) 0;
  background:var(--bg-secondary);
}
.pd-hero-image{ animation:pd-fadeUp .7s .15s ease both; }

.pd-hero-image img{
  width:100%;
  max-width:1100px;
  height:520px;
  object-fit:cover;
  border-radius:16px;
  border:1px solid var(--border2);
  display:block;
  margin:0 auto;
}
.pd-divider-image img{
  width:100%;
  max-width:1100px;
  height:420px;
  object-fit:cover;
  border-radius:16px;
  border:1px solid var(--border);
  display:block;
  margin:0 auto;
}

.pd-section{
  max-width:1100px;
  margin:0 auto;
  padding:5rem 2.5rem;
  position:relative;
}
.pd-section-tag{
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:.6rem;
}
.pd-section-title{
  font-family:"Instrument Serif", ui-serif, Georgia, serif;
  font-size:clamp(2rem, 4vw, 2.8rem);
  font-weight:400;
  color:var(--text-heading);
  letter-spacing:-.015em;
  line-height:1.2;
  margin-bottom:.8rem;
}
.pd-section-subtitle{
  font-size:.9rem;
  color:var(--accent-light);
  font-weight:500;
  margin-bottom:1.2rem;
  letter-spacing:.02em;
}
.pd-section-body{
  font-size:1rem;
  color:var(--muted);
  line-height:1.8;
  max-width:650px;
  font-weight:300;
  margin-bottom:3rem;
}

.pd-features-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:1px;
  background:var(--border);
  border:1px solid var(--border);
  border-radius:16px;
  overflow:hidden;
}
.pd-feature-card{
  background:var(--bg-card);
  padding:2rem;
  transition:background .2s;
}

.pd-feature-icon{
  width:42px;height:42px;
  background:var(--accent-glow);
  border:1px solid rgba(59,130,246,.18);
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:1.1rem;
  font-size:1.05rem;
}
.pd-feature-card h4{
  font-size:1rem;
  font-weight:600;
  color:var(--text-heading);
  margin-bottom:.5rem;
}
.pd-feature-card p{
  font-size:.88rem;
  color:var(--muted);
  line-height:1.7;
  font-weight:300;
}

.pd-btn-group{
  display:flex;
  align-items:center;
  gap:1rem;
  flex-wrap:wrap;
  margin-top:2.5rem;
}

.pd-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  padding:.75rem 1.6rem;
  border-radius:10px;
  font-size:.9rem;
  font-weight:500;
  transition:all .2s;
  border:none;
  cursor:pointer;
}
.pd-btn-primary{
  background:var(--accent);
  color:#fff;
}
.pd-btn-primary:hover{
  background:var(--accent-light);
  transform:translateY(-2px);
  box-shadow:0 10px 26px rgba(59,130,246,.22);
}
.pd-btn-outline{
  background:transparent;
  color:var(--text);
  border:1px solid var(--border2);
}
.pd-btn-outline:hover{
  border-color: var(--accent);
  background: var(--accent-glow);
  color: var(--accent);
  transform:translateY(-2px);
}

.pd-band{ border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.pd-band-surface{ background: var(--surface2); }
.pd-band-radial{ position:relative; }
.pd-band-radial::before{
  content:"";
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:600px;
  height:600px;
  background:radial-gradient(circle, rgba(59,130,246,.08) 0%, transparent 70%);
  pointer-events:none;
}

.pd-result{
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.pd-result .pd-section-body{ text-align:center; }

.pd-reveal{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .65s ease, transform .65s ease;
}
.pd-reveal.pd-visible{
  opacity:1;
  transform:translateY(0);
}

@keyframes pd-fadeUp{
  from{ opacity:0; transform:translateY(24px); }
  to{ opacity:1; transform:translateY(0); }
}

/* Tech stack row */
.pd-tech-row{
  display:flex;
  align-items:center;
  gap:1rem;
  margin-top:2rem;
  margin-bottom:-.5rem;
  flex-wrap:wrap;
}
.pd-tech-label{
  font-size:.78rem;
  font-weight:600;
  color:var(--muted2);
  text-transform:uppercase;
  letter-spacing:.08em;
}
.pd-tech-tags{
  display:flex;
  gap:.5rem;
  flex-wrap:wrap;
}
.pd-tech-tags span{
  background:var(--accent-glow);
  border:1px solid rgba(59,130,246,.18);
  border-radius:6px;
  padding:.22rem .7rem;
  font-size:.8rem;
  font-weight:500;
  color:var(--accent);
}

/* Prev / Next project navigation */
.pd-project-nav{
  max-width:1100px;
  margin:0 auto;
  padding:3rem 2.5rem 4rem;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:1.5rem;
  border-top:1px solid var(--border);
}
.pd-nav-link{
  display:flex;
  flex-direction:column;
  gap:.5rem;
  padding:1.4rem 1.8rem;
  border:1px solid var(--border);
  border-radius:16px;
  transition:all .32s cubic-bezier(.22,1,.36,1);
  background:var(--surface);
  text-decoration:none;
  position:relative;
  overflow:hidden;
}
.pd-nav-link::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,rgba(59,130,246,.07) 0%, transparent 60%);
  opacity:0;
  transition:opacity .28s ease;
  pointer-events:none;
}
.pd-nav-link:hover{
  border-color:rgba(59,130,246,.45);
  transform:translateY(-4px);
  box-shadow:0 16px 40px rgba(59,130,246,.13), 0 4px 16px rgba(0,0,0,.18);
}
.pd-nav-link:hover::after{ opacity:1; }
.pd-nav-next{ text-align:right; }
.pd-nav-dir{
  font-size:.62rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--accent);
  display:flex;
  align-items:center;
  gap:.4rem;
}
.pd-nav-prev .pd-nav-dir{ flex-direction:row; }
.pd-nav-next .pd-nav-dir{ flex-direction:row-reverse; }
.pd-nav-title{
  font-size:1rem;
  font-weight:600;
  color:var(--text-heading);
  line-height:1.3;
  letter-spacing:-.01em;
}
.pd-nav-all{
  background:transparent;
  border:1px solid var(--border2);
  color:var(--muted2);
  padding:.9rem 1.8rem;
  border-radius:100px;
  font-size:.8rem;
  font-weight:600;
  letter-spacing:.02em;
  white-space:nowrap;
  transition:all .25s ease;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  text-decoration:none;
}
.pd-nav-all:hover{
  background:var(--accent);
  border-color:var(--accent);
  color:#fff;
  transform:translateY(-3px);
  box-shadow:0 10px 28px rgba(59,130,246,.22);
}
.pd-nav-placeholder{ min-width:0; }

/* Outcome list in result section */
.pd-outcome-list{
  list-style:none;
  padding:0;
  margin:1.6rem 0 2rem;
  display:flex;
  flex-direction:column;
  gap:.7rem;
}
.pd-outcome-item{
  display:flex;
  align-items:flex-start;
  gap:.75rem;
  font-size:.95rem;
  color:var(--text-secondary);
  line-height:1.5;
}
.pd-outcome-item i{
  color:var(--accent);
  font-size:.85rem;
  margin-top:.22rem;
  flex-shrink:0;
}

/* CTA box at end of result section */
.pd-cta-box{
  background: var(--surface);
  border: 1px solid var(--border2);
  border-top: 3px solid var(--accent);
  border-radius: 14px;
  padding: 2rem 2.2rem;
  margin-top: 2rem;
  position: relative;
  overflow: hidden;
}
.pd-cta-box::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,rgba(59,130,246,.06) 0%, transparent 55%);
  pointer-events:none;
}
.pd-cta-box .pd-btn-group{
  margin-top:1.4rem;
}
.pd-cta-prompt{
  font-size:1.05rem;
  font-weight:600;
  color:var(--text-heading);
  margin:0;
  line-height:1.5;
  position:relative;
}

/* ── META STRIP ─────────────────────────────── */
.pd-meta-strip{
  background:var(--surface);
  border-bottom:1px solid var(--border);
  padding:14px max(24px, calc((100% - 1280px) / 2 + 24px));
  display:flex;
  align-items:center;
  gap:2rem;
  flex-wrap:wrap;
}
.pd-meta-item{
  display:flex;
  align-items:center;
  gap:.5rem;
  font-size:.82rem;
  color:var(--muted2);
}
.pd-meta-item i{ color:var(--accent); font-size:.78rem; }
.pd-meta-item strong{ color:var(--text-heading); font-weight:600; }

/* ── PROCESS STEPS ──────────────────────────── */
.pd-process-strip{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--border);
  border:1px solid var(--border);
  border-radius:14px;
  overflow:hidden;
  margin-top:3rem;
}
.pd-process-step{
  background:var(--bg-card);
  padding:1.8rem 2rem;
  display:flex;
  flex-direction:column;
  gap:.6rem;
  transition:background .2s;
}
.pd-process-step:hover{ background:rgba(59,130,246,.04); }
.pd-process-num{
  font-size:2.4rem;
  font-weight:800;
  color:var(--accent);
  opacity:.28;
  line-height:1;
  font-variant-numeric:tabular-nums;
}
.pd-process-title{
  font-size:.95rem;
  font-weight:700;
  color:var(--text-heading);
}
.pd-process-desc{
  font-size:.83rem;
  color:var(--muted);
  line-height:1.65;
  font-weight:300;
}

/* ── DELIVERABLES ───────────────────────────── */
.pd-deliverables{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:.65rem;
  margin:1.8rem 0 2rem;
}
.pd-deliverable{
  display:flex;
  align-items:flex-start;
  gap:.75rem;
  padding:1.1rem 1.2rem;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:11px;
  transition:border-color .2s,background .2s;
}
.pd-deliverable:hover{
  border-color:rgba(59,130,246,.3);
  background:rgba(59,130,246,.03);
}
.pd-deliverable i{
  color:var(--accent);
  font-size:.85rem;
  margin-top:.18rem;
  flex-shrink:0;
}
.pd-deliverable-text{
  font-size:.875rem;
  color:var(--text-secondary);
  line-height:1.5;
  font-weight:400;
}

/* ── RESULT NUMBERS ─────────────────────────── */
.pd-result-numbers{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--border);
  border:1px solid var(--border);
  border-radius:14px;
  overflow:hidden;
  margin-bottom:2rem;
  width:100%;
}
.pd-result-num{
  background:var(--bg-card);
  padding:1.8rem;
  text-align:center;
}
.pd-result-num-value{
  font-size:clamp(1.9rem,4vw,2.8rem);
  font-weight:800;
  color:var(--accent-light);
  line-height:1;
  display:block;
  margin-bottom:.4rem;
  letter-spacing:-.02em;
}
.pd-result-num-label{
  font-size:.8rem;
  color:var(--muted2);
  font-weight:500;
  line-height:1.3;
}

/* ── SCROLL INDICATOR ───────────────────────── */
.pd-scroll-hint{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.4rem;
  color:var(--muted);
  font-size:.68rem;
  text-transform:uppercase;
  letter-spacing:.1em;
  margin-top:2.5rem;
  animation:pd-bounce 2.2s ease infinite;
  cursor:default;
  position:relative;
  z-index:1;
}
.pd-scroll-hint i{ font-size:1rem; color:var(--accent); }
@keyframes pd-bounce{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-5px); }
}

/* ── QUOTE BLOCK ────────────────────────────── */
.pd-quote{
  background:linear-gradient(135deg,rgba(59,130,246,.06),rgba(59,130,246,.02));
  border:1px solid rgba(59,130,246,.15);
  border-left:3px solid var(--accent);
  border-radius:0 12px 12px 0;
  padding:1.6rem 2rem;
  margin:2rem 0;
}
.pd-quote p{
  font-size:1rem;
  color:var(--text-heading);
  font-style:italic;
  line-height:1.75;
  margin:0 0 .65rem;
  font-weight:300;
}
.pd-quote cite{
  font-size:.75rem;
  color:var(--accent);
  font-style:normal;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.06em;
}

/* ── SECTION DIVIDER LABEL ──────────────────── */
.pd-step-label{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--accent);
  background:var(--accent-glow);
  border:1px solid rgba(59,130,246,.2);
  border-radius:100px;
  padding:.3rem .9rem;
  margin-bottom:1.2rem;
}

/* ═══════════════════════════════════════════════════
   NEW PROFESSIONAL SECTIONS — Project Detail Pages
   ═══════════════════════════════════════════════════ */

/* ── BRIEF CARD (what the client came with) ─── */
.pd-brief-card{
  background:linear-gradient(135deg,rgba(59,130,246,.07) 0%,rgba(59,130,246,.02) 100%);
  border:1px solid rgba(59,130,246,.2);
  border-left:3px solid var(--accent);
  border-radius:0 14px 14px 0;
  padding:2rem 2.5rem;
  margin:2rem 0;
}
.pd-brief-card-label{
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:.75rem;
  display:flex;
  align-items:center;
  gap:.45rem;
}
.pd-brief-card p{
  font-size:1.05rem;
  color:var(--text-heading);
  line-height:1.8;
  font-style:italic;
  font-weight:300;
  margin:0;
}

/* ── CLIENT CONTEXT PILLS ─────────────────────── */
.pd-context-pills{
  display:flex;
  gap:.6rem;
  flex-wrap:wrap;
  margin:1.5rem 0 2rem;
}
.pd-context-pill{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.35rem 1rem;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:100px;
  font-size:.78rem;
  font-weight:500;
  color:var(--text-secondary);
}
.pd-context-pill i{
  color:var(--accent);
  font-size:.72rem;
}

/* ── SCOPE GRID (received / built) ───────────── */
.pd-scope-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.5rem;
  margin:2rem 0;
}
.pd-scope-card{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:14px;
  padding:1.8rem 2rem;
}
.pd-scope-card-label{
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:1.1rem;
  display:flex;
  align-items:center;
  gap:.4rem;
}
.pd-scope-card ul{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:.65rem;
}
.pd-scope-card li{
  display:flex;
  align-items:flex-start;
  gap:.65rem;
  font-size:.875rem;
  color:var(--text-secondary);
  line-height:1.55;
}
.pd-scope-card li i{
  color:var(--accent);
  font-size:.78rem;
  margin-top:.22rem;
  flex-shrink:0;
}

/* ── 4-STEP TIMELINE ──────────────────────────── */
.pd-timeline{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1px;
  background:var(--border);
  border:1px solid var(--border);
  border-radius:16px;
  overflow:hidden;
  margin:2.5rem 0;
}
.pd-timeline-step{
  background:var(--bg-card);
  padding:2rem 1.6rem;
  transition:background .2s;
  position:relative;
}
.pd-timeline-step:hover{ background:rgba(59,130,246,.04); }
.pd-timeline-num{
  font-size:2.6rem;
  font-weight:800;
  color:var(--accent);
  opacity:.18;
  line-height:1;
  margin-bottom:.55rem;
  font-variant-numeric:tabular-nums;
}
.pd-timeline-icon{
  width:36px;height:36px;
  background:rgba(59,130,246,.1);
  border:1px solid rgba(59,130,246,.22);
  border-radius:9px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:.88rem;
  color:var(--accent);
  margin-bottom:.9rem;
}
.pd-timeline-label{
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--accent);
  opacity:.8;
  margin-bottom:.25rem;
}
.pd-timeline-title{
  font-size:.94rem;
  font-weight:700;
  color:var(--text-heading);
  margin-bottom:.5rem;
  line-height:1.3;
}
.pd-timeline-desc{
  font-size:.82rem;
  color:var(--muted);
  line-height:1.65;
  font-weight:300;
}

/* ── IMAGE GALLERY ────────────────────────────── */
.pd-gallery{
  max-width:none;
  margin:0;
  padding:5rem max(24px,calc((100% - 1280px)/2 + 24px));
  background:var(--bg-primary);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.pd-gallery-inner{
  max-width:1100px;
  margin:0 auto;
}
.pd-gallery-label{
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:.5rem;
}
.pd-gallery-title{
  font-family:"Instrument Serif",ui-serif,Georgia,serif;
  font-size:clamp(1.6rem,3vw,2.2rem);
  font-weight:400;
  color:var(--text-heading);
  margin-bottom:2rem;
  line-height:1.2;
}
.pd-gallery-grid{
  display:grid;
  grid-template-columns:2fr 1fr;
  grid-template-rows:auto auto;
  gap:12px;
}
.pd-gallery-img{
  border-radius:12px;
  overflow:hidden;
  border:1px solid var(--border);
  position:relative;
}
.pd-gallery-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .4s ease;
}
.pd-gallery-img:hover img{ transform:scale(1.04); }
.pd-gallery-img--main{
  grid-row:1/3;
  height:440px;
}
.pd-gallery-img--sm{ height:212px; }

/* ── TRANSFORMATION / BEFORE-AFTER ───────────── */
.pd-transform-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.5rem;
  margin:2rem 0;
}
.pd-transform-card{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:14px;
  padding:2rem;
  position:relative;
  overflow:hidden;
}
.pd-transform-card::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:3px;
}
.pd-transform-card--before::before{ background:rgba(239,68,68,.55); }
.pd-transform-card--after::before{ background:linear-gradient(90deg,var(--accent),var(--accent-light)); }
.pd-transform-label{
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  margin-bottom:1.1rem;
  display:flex;
  align-items:center;
  gap:.4rem;
}
.pd-transform-card--before .pd-transform-label{ color:rgba(239,68,68,.8); }
.pd-transform-card--after .pd-transform-label{ color:var(--accent); }
.pd-transform-card ul{
  list-style:none;
  padding:0;margin:0;
  display:flex;
  flex-direction:column;
  gap:.75rem;
}
.pd-transform-card li{
  display:flex;
  align-items:flex-start;
  gap:.65rem;
  font-size:.875rem;
  color:var(--text-secondary);
  line-height:1.55;
}
.pd-transform-card--before li i{ color:rgba(239,68,68,.65); margin-top:.18rem; flex-shrink:0; font-size:.8rem; }
.pd-transform-card--after li i{ color:var(--accent); margin-top:.18rem; flex-shrink:0; font-size:.8rem; }

/* ── IMPACT / IMPACT BAND ─────────────────────── */
.pd-impact-band{
  background:linear-gradient(135deg,rgba(59,130,246,.06) 0%,rgba(59,130,246,.02) 100%);
  border:1px solid rgba(59,130,246,.15);
  border-radius:16px;
  padding:2.5rem;
  margin:2rem 0;
  text-align:center;
}
.pd-impact-band h4{
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--accent);
  margin-bottom:1.5rem;
}
.pd-impact-stats{
  display:flex;
  gap:2rem;
  justify-content:center;
  flex-wrap:wrap;
}
.pd-impact-stat{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.3rem;
}
.pd-impact-stat-val{
  font-size:clamp(1.8rem,3.5vw,2.6rem);
  font-weight:800;
  color:var(--accent-light);
  line-height:1;
  letter-spacing:-.02em;
}
.pd-impact-stat-label{
  font-size:.78rem;
  color:var(--muted2);
  font-weight:500;
}

/* ── INTRO SPLIT (two columns) ───────────────── */
.pd-intro-split{
  display:grid;
  grid-template-columns:1.15fr 1fr;
  gap:3rem;
  align-items:start;
  margin-bottom:2.5rem;
}
.pd-intro-split .pd-section-body{ margin-bottom:0; }

/* ── RESPONSIVE ─────────────────────────────── */
@media (max-width: 768px){
  .pd-hero{
    min-height:0;
    padding:112px 24px 52px;
  }
  .pd-hero::after{ display:none; }
  .pd-hero h1{ font-size:clamp(1.85rem, 9vw, 2.55rem); }
  .pd-hero-image, .pd-divider-image{ padding:48px 24px 0; }
  .pd-hero-image img, .pd-divider-image img{ height:240px; }
  .pd-section{ padding:4rem 1.2rem; }
  .pd-features-grid{ grid-template-columns:1fr; }
  .pd-process-strip{ grid-template-columns:1fr; }
  .pd-result-numbers{ grid-template-columns:1fr 1fr; }
  .pd-deliverables{ grid-template-columns:1fr; }
  .pd-meta-strip{ gap:.8rem; padding:12px 24px; }
  .pd-project-nav{
    grid-template-columns:1fr 1fr;
    padding:2rem 1.2rem 2.5rem;
    gap:1rem;
  }
  .pd-nav-all{
    grid-column:1/-1;
    order:-1;
    border-radius:12px;
    padding:.85rem 1.2rem;
  }
  .pd-nav-link{ padding:1.1rem 1.2rem; border-radius:12px; }
  .pd-nav-title{ font-size:.9rem; }
  .pd-scope-grid{ grid-template-columns:1fr; }
  .pd-timeline{ grid-template-columns:1fr 1fr; }
  .pd-transform-grid{ grid-template-columns:1fr; }
  .pd-intro-split{ grid-template-columns:1fr; gap:1.5rem; }
  .pd-gallery{ padding:4rem 24px; }
  .pd-gallery-grid{ grid-template-columns:1fr; }
  .pd-gallery-img--main{ height:260px; grid-row:auto; }
  .pd-gallery-img--sm{ height:200px; }
  .pd-impact-stats{ gap:1.2rem; }
}
@media (max-width:480px){
  .pd-timeline{ grid-template-columns:1fr; }
  .pd-result-numbers{ grid-template-columns:1fr; }
}