/* pages-content: page-specific styles. Only the owning page agent edits this file. */
/* Owner: content pages — /about/, /expertise/*, /industries/*. All selectors prefixed .pc- */

/* ---- Shared helpers -------------------------------------------------------- */
/* Breadcrumbs on dark / photo heroes (base breadcrumbs use --ink for the current item) */
.on-dark .breadcrumbs [aria-current] { color: var(--on-dark); }
.on-dark .breadcrumbs a:hover { color: var(--on-dark); }

/* Portrait-ish crop for hero / organisation media */
.pc-media-tall { aspect-ratio: 3 / 2; }
@media (min-width: 1025px) { .pc-media-tall { aspect-ratio: 4 / 5; } }

/* Placeholder filling a .media frame (approved image still to come) */
.pc-ph-media { height: 100%; min-height: 0; padding: var(--s-5) var(--s-6); background-color: var(--surface-alt); }
.on-dark .pc-ph-media { background-color: rgba(255, 255, 255, .04); color: var(--on-dark-2); border-color: var(--rule-dark); }

/* Long section titles may run wider than the default 18ch */
.pc-wide-title { max-width: 22ch; }

.pc-note { margin-top: var(--s-5); max-width: 60ch; }
.pc-note--after { margin-top: clamp(32px, 4vw, 48px); }
.pc-note strong { font-weight: var(--fw-semibold); color: var(--ink); }

.pc-inquiry__title { margin-top: var(--s-4); }
.inquiry .eyebrow { color: var(--on-dark-2); }

/* ---- Expertise hero (dark, text + angled photo) ------------------------ */
.pc-hero { padding-bottom: clamp(56px, 7vw, 112px); }
.pc-hero::before { /* angled shard echoing the brand mark */
  content: ""; position: absolute; right: -8%; top: -10%; width: 52%; height: 130%;
  background: linear-gradient(160deg, rgba(169, 206, 244, .16), rgba(112, 202, 208, 0) 70%);
  clip-path: polygon(30% 0, 100% 0, 70% 100%, 0 100%);
  pointer-events: none;
}
.pc-hero .container { position: relative; }
.pc-hero__grid { display: grid; gap: clamp(32px, 5vw, 72px); grid-template-columns: minmax(0, 1fr); align-items: end; }
.pc-hero__kicker { display: flex; align-items: center; gap: var(--s-4); margin-bottom: var(--s-3); max-width: none; }
.pc-hero__kicker .eyebrow { margin: 0; }
.pc-hero__num { font-size: var(--fs-num); font-weight: var(--fw-light); line-height: 1; color: var(--aqua); font-variant-numeric: tabular-nums; }
.pc-hero__name {
  margin-bottom: var(--s-5); padding-bottom: var(--s-4); border-bottom: 1px solid var(--rule-dark-soft);
  font-family: var(--font-ui); font-size: .9375rem; font-weight: var(--fw-medium); letter-spacing: .06em; text-transform: uppercase;
  color: var(--on-dark);
}
.pc-hero__title { max-width: 16ch; }
.pc-hero .page-hero__lead { font-size: clamp(1.0625rem, 1.2vw, 1.1875rem); line-height: 1.6; max-width: 58ch; }
.pc-hero__media { min-width: 0; }
@media (min-width: 1025px) {
  .pc-hero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: center; }
}

/* ---- Services (numbered list) --------------------------------------------- */
.pc-services .numbered__text { max-width: 60ch; }
.pc-services .numbered__body { grid-column: 2; min-width: 0; }
@media (min-width: 1025px) { .pc-services .numbered__body { grid-column: auto; } }
.pc-services .numbered__item { transition: background-color var(--dur-med) ease-in-out; }
@media (min-width: 1025px) {
  .pc-services .numbered__item { padding-inline: var(--s-4); margin-inline: calc(-1 * var(--s-4)); }
  .pc-services .numbered__item:hover { background: rgba(228, 253, 252, .55); }
}

/* ---- Delivery stages stepper ---------------------------------------------- */
.pc-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-6); grid-template-columns: minmax(0, 1fr); }
.pc-step { position: relative; min-width: 0; padding-left: 64px; }
.pc-step::before { /* connector */
  content: ""; position: absolute; left: 21px; top: 44px; bottom: calc(-1 * var(--s-6)); width: 1px; background: var(--rule-strong);
}
.pc-step:last-child::before { display: none; }
.pc-step__num {
  position: absolute; left: 0; top: 0;
  display: grid; place-items: center; width: 44px; height: 44px;
  border: 1px solid var(--prussian); background: var(--surface-alt);
  font-family: var(--font-ui); font-size: .875rem; font-weight: var(--fw-medium); letter-spacing: .04em; color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.pc-step:first-child .pc-step__num { background: var(--prussian); color: var(--white); }
.pc-step__title { font-size: var(--fs-h3); font-weight: var(--fw-regular); line-height: 1.2; padding-top: 8px; }
.pc-step__text { margin-top: var(--s-3); color: var(--ink-2); max-width: 44ch; }
@media (min-width: 768px) {
  .pc-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
  .pc-step { padding-left: 0; padding-top: 72px; }
  .pc-step::before { left: 44px; right: calc(-1 * var(--gap)); top: 22px; bottom: auto; width: auto; height: 1px; }
  .pc-step:last-child::before { display: block; right: 0; background: linear-gradient(90deg, var(--rule-strong), transparent); }
  .pc-step__title { padding-top: 0; }
}

/* ---- Related project feature card ----------------------------------------- */
.pc-feature { display: grid; gap: var(--s-6); grid-template-columns: minmax(0, 1fr); align-items: center; margin-top: var(--s-5); padding-top: var(--s-6); border-top: 1px solid var(--rule); }
.pc-feature .card__media { margin-bottom: 0; }
.pc-feature__body { display: flex; flex-direction: column; gap: var(--s-4); }
.pc-feature__title { font-size: var(--fs-h2); max-width: 16ch; }
.pc-feature__text { font-size: var(--fs-body); }
.pc-feature__body .btn { margin-top: var(--s-3); }
.pc-feature__pair { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-3); }
.pc-feature__second { display: none; }
@media (min-width: 641px) {
  .pc-feature__pair { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); align-items: end; }
  .pc-feature__second { display: block; aspect-ratio: 4 / 5; }
}
@media (min-width: 1025px) {
  .pc-feature { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--s-8); }
}

/* ---- Industry hero: full-bleed photo with title, intro strip below ----------- */
.pc-shero__stage { min-height: clamp(400px, 58vh, 600px); padding-block: clamp(32px, 5vw, 56px) clamp(40px, 5vw, 72px); }
.pc-shero .page-hero__media picture { display: block; width: 100%; height: 100%; }
.pc-shero__stage .breadcrumbs { margin-bottom: clamp(48px, 9vw, 120px); }
.pc-shero__kicker { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3) var(--s-4); margin-bottom: var(--s-4); max-width: none; }
.pc-shero__kicker .eyebrow { margin: 0; }
.pc-shero__name {
  font-family: var(--font-ui); font-size: var(--fs-eyebrow); font-weight: var(--fw-medium); letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase; color: var(--on-dark); padding-left: var(--s-4); border-left: 1px solid var(--rule-dark);
}
.pc-shero__title { font-size: var(--fs-h1); max-width: 18ch; }
.pc-intro {
  display: grid; gap: var(--s-6); grid-template-columns: minmax(0, 1fr);
  padding-block: clamp(40px, 6vw, 88px);
}
.pc-intro__lead { font-size: var(--fs-lead); line-height: 1.55; color: var(--ink); max-width: 62ch; }
.pc-intro__aside { display: flex; flex-direction: column; align-items: flex-start; gap: 0; }
.pc-intro__aside .pc-note { width: 100%; }
@media (min-width: 1025px) {
  .pc-intro { grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); column-gap: var(--s-8); align-items: start; }
  .pc-intro__aside { padding-top: 6px; padding-left: var(--s-6); border-left: 1px solid var(--rule); min-height: 100%; }
}

/* Section head with a lead paragraph: title left, lead + action right */
@media (min-width: 1025px) {
  .pc-head--lead { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); align-items: start; }
  .pc-head--lead .section-head__title { grid-row: 2 / span 2; }
  .pc-head--lead .section-head__lead { grid-column: 2; padding-top: 10px; }
  .pc-head--lead .section-head__actions { grid-column: 2; justify-self: start; }
}

/* ---- Expertise link cards (industry pages) ------------------------------- */
.pc-bl-cards { display: grid; gap: 0; grid-template-columns: minmax(0, 1fr); border-bottom: 1px solid var(--rule); }
.pc-bl-card {
  position: relative; display: flex; flex-direction: column; gap: var(--s-3); min-width: 0;
  padding: var(--s-6) 0; border-top: 1px solid var(--rule-strong);
  color: var(--ink); text-decoration: none;
  transition: background-color var(--dur-med) ease-in-out;
}
.pc-bl-card::after { /* hairline grows left → right on hover */
  content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 2px; background: var(--prussian);
  transform: scaleX(0); transform-origin: left; transition: transform var(--dur-slow) var(--ease-out);
}
.pc-bl-card:hover::after, .pc-bl-card:focus-visible::after { transform: scaleX(1); }
.pc-bl-card__num { font-size: var(--fs-num); font-weight: var(--fw-light); line-height: 1; color: var(--aqua-ink); font-variant-numeric: tabular-nums; }
.pc-bl-card__title { font-size: var(--fs-h3); font-weight: var(--fw-regular); line-height: 1.2; max-width: 18ch; }
.pc-bl-card__text { color: var(--ink-2); font-size: 1rem; max-width: 44ch; }
.pc-bl-card__go { display: inline-flex; margin-top: auto; padding-top: var(--s-3); color: var(--aqua-ink); }
.pc-bl-card:hover .btn__arrow { transform: translateX(6px); }
@media (min-width: 768px) {
  .pc-bl-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 0; }
  .pc-bl-card { padding: var(--s-6) var(--gap) var(--s-6) 0; }
  .pc-bl-card + .pc-bl-card { padding-left: var(--gap); border-left: 1px solid var(--rule); }
  .pc-bl-card + .pc-bl-card::after { left: 0; }
}
@media (min-width: 1025px) {
  .pc-bl-card { padding-block: var(--s-7); }
  .pc-bl-card:hover { background: rgba(228, 253, 252, .5); }
}

/* ---- Evidence cards -------------------------------------------------------- */
.pc-evidence .card__title a { color: inherit; }
.pc-card-row { border-bottom: 1px solid var(--rule); align-items: center; }
@media (min-width: 768px) { .pc-card-row { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } }
.pc-card-row .card__text { font-size: var(--fs-body); }

/* ---- About: organisation --------------------------------------------------- */
.pc-about-hero { padding-bottom: clamp(32px, 4vw, 56px); }
.pc-about-hero__title { max-width: 14ch; }
.pc-org { display: grid; gap: clamp(32px, 5vw, 80px); grid-template-columns: minmax(0, 1fr); align-items: start; padding-top: var(--s-6); border-top: 1px solid var(--rule); }
.pc-org__body > * + * { margin-top: var(--s-5); }
.pc-org__body p { color: var(--ink-2); }
.pc-org__body .pc-org__lead { color: var(--ink); }
.pc-org__lines { max-width: 52ch; }
.pc-org__lines > li { padding-block: 2px; }
.pc-org__lines .link-arrow { width: 100%; justify-content: space-between; color: var(--ink); }
@media (min-width: 1025px) {
  .pc-org { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  .pc-org__media { position: sticky; top: calc(var(--header-h-compact) + var(--stripe-h) + 32px); }
}

/* ---- About: Know. Connect. Build. (light variant of the homepage band) ----- */
.pc-kcb__head {
  display: grid; gap: var(--s-5); grid-template-columns: minmax(0, 1fr); align-items: end;
  padding-bottom: var(--s-6); border-bottom: 1px solid var(--rule-strong);
}
.pc-kcb__title { font-size: var(--fs-h2); }
@media (min-width: 1025px) {
  .pc-kcb__head { grid-template-columns: minmax(0, 1fr) auto; }
  .pc-kcb__head > .eyebrow { grid-column: 1 / -1; }
}
.pc-kcb__grid { display: grid; gap: var(--s-7); grid-template-columns: minmax(0, 1fr); padding-top: clamp(32px, 4vw, 56px); }
.pc-kcb__item { min-width: 0; }
.pc-kcb__num { display: block; font-family: var(--font-ui); font-size: var(--fs-eyebrow); font-weight: var(--fw-medium); letter-spacing: var(--tracking-eyebrow); color: var(--ink-3); }
.pc-kcb__word { margin-top: var(--s-3); font-size: var(--fs-mega); font-weight: var(--fw-light); line-height: 1; letter-spacing: -.03em; color: var(--teal-deep); }
.pc-kcb__text { margin-top: clamp(16px, 2vw, 28px); color: var(--ink-2); max-width: 40ch; }
@media (min-width: 768px) {
  .pc-kcb__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
  .pc-kcb__item + .pc-kcb__item { padding-left: var(--gap); border-left: 1px solid var(--rule); }
}
