/* PENTA Defence — corporate content pages (Kurumsal, Savunma Sanayi, İnşaat & Mühendislik, Global Ağ).
   Additive rules only: every colour / font comes from the tokens in base.css, so both themes work. */

/* Hero plate whose subject sits high in the frame (defence: products on tripods) */
.pg-hero-top .bg-plate { object-position: 50% 0; }

/* Headings and body copy outside .section-head */
.pg-intro { margin: 22px 0 clamp(32px, 4vw, 56px); max-width: 1180px; color: var(--ink); font-family: var(--font-display); font-size: clamp(22px, 1.9vw, 34px); line-height: 1.32; letter-spacing: var(--track-head); }
.pg-h2 { margin-top: 14px; font-size: clamp(30px, 3vw, 56px); line-height: 1.04; letter-spacing: var(--track-head); font-weight: 450; }
.pg-text { margin-top: 20px; max-width: 560px; font-size: 18px; line-height: 1.5; }
.pg-actions { margin-top: 28px; }

/* Values + mission / vision */
.pg-value { min-height: 168px; justify-content: space-between; }
.pg-value .n { font-size: 14px; }
.pg-mission { margin-top: 16px; }
.pg-mission .card-meta { margin-bottom: 4px; }
.pg-mission p { color: var(--ink); font-size: clamp(18px, 1.3vw, 22px); line-height: 1.45; }

/* Business lines: photo tiles inside the wrap */
.pg-tiles { margin-top: 8px; }
.prod.pg-tile { aspect-ratio: 16 / 10; }
.pg-tile .prod-text { max-width: 560px; }
.pg-tile-text { margin-top: 12px; font-size: 17px; line-height: 1.45; color: var(--space-copy); }
.pg-tile .btn-ghost { margin-top: 18px; }

/* Five-column card grid (certificates, architecture layers) */
.pg-grid-5 { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.pg-cert h3 { font-family: var(--font-mono); font-size: clamp(19px, 1.35vw, 23px); font-weight: 500; letter-spacing: 0; }
.pg-cert p { color: var(--ink); }
.pg-cert-valid { margin-top: auto; padding-top: 14px; border-top: 1px solid var(--divider); font-family: var(--font-mono); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--body); }
.pg-spec { color: var(--ink); }

/* Numbered steps (defence concept, construction method) */
.pg-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 22px; border-top: 1px solid var(--divider); }
.pg-steps li { display: flex; flex-direction: column; gap: 10px; padding: 22px 20px 6px 0; }
.pg-steps li + li { padding-left: 20px; border-left: 1px solid var(--divider); }
.pg-steps .n { font-family: var(--font-mono); font-size: 13px; letter-spacing: .06em; color: var(--accent-text); }
.pg-steps strong { font-family: var(--font-display); font-weight: 500; font-size: clamp(22px, 1.7vw, 30px); line-height: 1.12; color: var(--ink); }
.pg-steps span:not(.n) { font-size: 16px; line-height: 1.5; color: var(--body); }
.pg-steps.is-chain strong { font-size: clamp(26px, 2.6vw, 48px); line-height: 1.02; letter-spacing: var(--track-head); }
.pg-steps.is-chain li { position: relative; }
.pg-steps.is-chain li + li::before { content: ""; position: absolute; left: -5px; top: -5px; width: 9px; height: 9px; background: var(--accent); transform: rotate(45deg); }

/* Data fusion & C2 backbone band (always dark, like the photo tiles) */
.prod.pg-band { aspect-ratio: 1808 / 560; margin-top: 16px; }
.pg-band h3 { max-width: 26ch; }

/* Real product tiles for the architecture layers */
.pg-mini-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 16px; }
.prod.pg-mini { aspect-ratio: 1 / 1; }
.pg-mini .prod-cutout { left: 50%; right: auto; top: 8%; transform: translateX(-50%); max-width: 72%; max-height: 54%; }
.pg-mini h3 { font-size: clamp(24px, 1.9vw, 34px); }
.pg-mini .btn-ghost { margin-top: 16px; }

/* Solution areas: the integrated system card spans two columns */
.pg-areas > li { display: flex; }
.pg-areas > li > .card { flex: 1; }
.pg-area-wide { grid-column: span 2; }
.pg-areas .link-accent { margin-top: auto; padding-top: 14px; }

/* Machine park list fills its column */
.lines.pg-lines { max-width: none; }

/* Headquarters facts */
.pg-facts { margin: 0; border-top: 1px solid var(--divider); }
.pg-facts > div { display: grid; grid-template-columns: minmax(110px, 30%) 1fr; gap: 8px 16px; padding: 16px 0; border-bottom: 1px solid var(--divider); }
.pg-facts dt { font-family: var(--font-mono); font-size: 12px; line-height: 24px; letter-spacing: .06em; text-transform: uppercase; color: var(--body); }
.pg-facts dd { margin: 0; color: var(--ink); font-size: 19px; line-height: 1.4; }
.pg-facts a { color: var(--accent-text); }
.pg-facts a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Offices */
.pg-office h3 { font-size: clamp(24px, 1.9vw, 32px); }
.pg-office.is-hq { box-shadow: 0 0 0 1px var(--accent); }

@media (max-width: 1280px) {
  .pg-grid-5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1024px) {
  .pg-grid-5, .pg-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pg-steps li:nth-child(3) { padding-left: 0; border-left: 0; }
  .pg-steps.is-chain li:nth-child(3)::before { display: none; }
  .pg-mini-grid { grid-template-columns: 1fr 1fr; }
  .prod.pg-tile { aspect-ratio: 4 / 3; }
  .prod.pg-band { aspect-ratio: 16 / 9; }
}
@media (max-width: 767px) {
  .pg-grid-5, .pg-steps, .pg-mini-grid { grid-template-columns: 1fr; }
  .pg-steps li, .pg-steps li + li { padding: 18px 0 14px; border-left: 0; }
  .pg-steps li + li { border-top: 1px solid var(--divider); }
  .pg-steps.is-chain li + li::before { left: 0; }
  .pg-area-wide { grid-column: auto; }
  .prod.pg-tile, .prod.pg-band { aspect-ratio: 4 / 5; }
  .pg-tile:first-child .prod-plate { object-position: 50% 0; }
  .prod.pg-mini { aspect-ratio: 1 / 1; }
  .pg-value { min-height: 0; }
  .pg-facts > div { grid-template-columns: 1fr; }
  .grid-4.pg-offices { grid-template-columns: 1fr 1fr; gap: 10px; }
  .pg-office { padding: 16px; }
  .pg-office h3 { font-size: 22px; }
  .pg-office p { font-size: 14px; }
  /* The four-step defence chain stays a compact 2 × 2 grid on phones */
  .pg-steps.is-chain { grid-template-columns: 1fr 1fr; }
  .pg-steps.is-chain li { padding: 18px 12px 14px 0; }
  .pg-steps.is-chain li:nth-child(even) { padding-left: 14px; border-left: 1px solid var(--divider); }
  .pg-steps.is-chain li:nth-child(2) { border-top: 0; }
  .pg-steps.is-chain li:nth-child(even)::before { left: -5px; }
  .pg-steps.is-chain strong { font-size: 24px; }
}