.automotive-page {
  background:
    radial-gradient(circle at 12% 7%, rgba(35, 131, 197, .09), transparent 28rem),
    linear-gradient(180deg, #ffffff 0%, #f7fbfd 100%);
}

.automotive-page .breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  padding: 0;
  margin: 0 0 1rem;
  list-style: none;
  color: rgba(255,255,255,.76);
  font-size: .86rem;
}
.automotive-page .breadcrumbs a { color: rgba(255,255,255,.78); text-decoration: none; }
.automotive-page .breadcrumbs a:hover { color: #fff; }
.automotive-page .breadcrumbs li + li::before { content: "/"; margin-right: .45rem; color: rgba(255,255,255,.45); }

.auto-hero {
  position: relative;
  isolation: isolate;
  overflow: clip;
  color: white;
  background:
    radial-gradient(circle at 84% 18%, rgba(35,131,197,.36), transparent 28rem),
    radial-gradient(circle at 16% 86%, rgba(15,122,128,.22), transparent 32rem),
    linear-gradient(140deg, #071d2c 0%, #0d2a3e 58%, #163d54 100%);
}
.auto-hero::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(105deg, black 0%, rgba(0,0,0,.72) 55%, transparent 100%);
}
.auto-hero::after {
  position: absolute;
  right: -8rem;
  bottom: -13rem;
  z-index: -1;
  width: 34rem;
  height: 34rem;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 50%;
  content: "";
  box-shadow: inset 0 0 0 5rem rgba(255,255,255,.025);
}
.auto-hero__grid {
  display: grid;
  min-height: calc(100svh - var(--header-height));
  padding-block: clamp(4.75rem, 8vw, 7.75rem);
  gap: clamp(2rem, 4.8vw, 4.75rem);
  align-items: center;
  grid-template-columns: minmax(0, .9fr) minmax(24rem, 1.1fr);
}
.auto-hero h1 {
  color: white;
  font-size: clamp(2.45rem, 5.8vw, 5.75rem);
  letter-spacing: -.055em;
  line-height: .93;
}
.auto-hero .lead {
  max-width: 45rem;
  color: rgba(255,255,255,.8);
  margin-top: 1.05rem;
}
.auto-hero__actions,
.auto-final__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .85rem;
  margin-top: 2rem;
}
.auto-hero__tags {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  margin-top: 1.7rem;
}
.auto-hero__tags span {
  display: inline-flex;
  padding: .55rem .78rem;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: var(--radius-pill);
  color: rgba(255,255,255,.82);
  background: rgba(255,255,255,.08);
  font-size: .82rem;
  font-weight: 700;
}
.auto-hero__visual {
  display: grid;
  gap: 1rem;
  align-items: end;
}
.auto-hero__frame {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: var(--radius-2xl);
  background: rgba(255,255,255,.08);
  box-shadow: 0 40px 115px rgba(0,0,0,.32);
  transform: perspective(1400px) rotateY(-5deg) rotateX(2deg);
}
.auto-hero__frame img { width: 100%; }
.auto-signal-board {
  display: grid;
  gap: .8rem;
  grid-template-columns: repeat(3, 1fr);
}
.auto-signal-board div {
  min-height: 6.5rem;
  padding: 1rem;
  border: 1px solid rgba(255,255,255,.17);
  border-radius: var(--radius-lg);
  background: rgba(255,255,255,.08);
  box-shadow: 0 18px 50px rgba(0,0,0,.18);
  backdrop-filter: blur(14px);
}
.auto-signal-board small {
  display: block;
  margin-bottom: .5rem;
  color: #8de0e5;
  font-size: .73rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.auto-signal-board strong {
  display: block;
  color: white;
  font-size: .92rem;
  line-height: 1.35;
}

.auto-network,
.auto-visibility,
.auto-fit {
  padding-block: var(--section-space);
}
.auto-network__grid,
.auto-visibility__grid,
.auto-access__grid,
.auto-fit__grid {
  display: grid;
  gap: clamp(2rem, 5vw, 4.25rem);
  align-items: center;
  grid-template-columns: minmax(0, .92fr) minmax(24rem, 1.08fr);
}
.auto-network .lead,
.auto-visibility .lead,
.auto-access .lead,
.auto-fit .lead { color: var(--color-muted); }
.auto-network__visual,
.auto-visibility__visual,
.auto-access__visual,
.auto-fit__visual,
.auto-final__visual {
  margin: 0;
}
.auto-network__visual img,
.auto-visibility__visual img,
.auto-access__visual img,
.auto-fit__visual img,
.auto-final__visual img {
  border: 1px solid rgba(184,199,208,.72);
  border-radius: var(--radius-2xl);
  box-shadow: var(--shadow-lg);
}
.auto-network__visual .caption,
.auto-visibility__visual .caption {
  margin-top: .85rem;
}
.auto-friction-grid,
.auto-role-cards,
.auto-fit__cards {
  display: grid;
  gap: .85rem;
  margin-top: 1.65rem;
}
.auto-friction-grid article,
.auto-fit__cards article {
  display: grid;
  gap: .9rem;
  grid-template-columns: auto 1fr;
  padding: 1rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: white;
  box-shadow: var(--shadow-sm);
}
.auto-friction-grid span,
.auto-fit__cards span {
  display: grid;
  width: 2.35rem;
  height: 2.35rem;
  place-items: center;
  border-radius: 50%;
  color: white;
  background: var(--color-navy-950);
  font-weight: 800;
  font-size: .82rem;
}
.auto-friction-grid h3,
.auto-fit__cards h3 { margin-bottom: .25rem; }
.auto-friction-grid p,
.auto-fit__cards p { color: var(--color-muted); font-size: .95rem; }

.auto-loops {
  position: relative;
  overflow: clip;
  padding-block: var(--section-space);
  background:
    radial-gradient(circle at 15% 15%, rgba(35,131,197,.12), transparent 30rem),
    linear-gradient(180deg, var(--color-surface-blue), #fff);
}
.auto-section-heading {
  display: grid;
  max-width: 56rem;
  gap: 1rem;
  margin-bottom: clamp(2rem,4vw,3rem);
}
.auto-section-heading p:not(.eyebrow) {
  color: var(--color-muted);
  font-size: var(--text-body-lg);
}
.auto-loop-shell {
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(16rem, .36fr) minmax(0, 1fr);
  align-items: stretch;
}
.auto-loop-tabs {
  display: grid;
  gap: .85rem;
  align-content: start;
}
.auto-loop-tab {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .2rem .85rem;
  padding: 1rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  color: var(--color-navy-950);
  background: rgba(255,255,255,.76);
  box-shadow: var(--shadow-sm);
  text-align: left;
  transition: transform var(--duration-standard) var(--ease-emphasised), border-color var(--duration-fast), background var(--duration-fast), box-shadow var(--duration-standard);
}
.auto-loop-tab:hover,
.auto-loop-tab[aria-selected="true"] {
  transform: translateY(-2px);
  border-color: rgba(35,131,197,.34);
  background: white;
  box-shadow: var(--shadow-md);
}
.auto-loop-tab[aria-selected="true"] span { background: var(--color-brand-blue-700); }
.auto-loop-tab span {
  display: grid;
  width: 2.1rem;
  height: 2.1rem;
  grid-row: span 2;
  place-items: center;
  border-radius: 50%;
  color: white;
  background: var(--color-navy-950);
  font-size: .77rem;
  font-weight: 800;
}
.auto-loop-tab strong { align-self: end; }
.auto-loop-tab small { color: var(--color-muted); }
.auto-loop-panels {
  overflow: hidden;
  border: 1px solid rgba(184,199,208,.75);
  border-radius: var(--radius-2xl);
  background: white;
  box-shadow: var(--shadow-lg);
}
.auto-loop-panel {
  display: grid;
  min-height: 36rem;
  grid-template-columns: minmax(0, 1.04fr) minmax(20rem, .96fr);
}
.auto-loop-panel.is-entering {
  animation: auto-panel-enter 420ms var(--ease-emphasised) both;
}
.auto-loop-panel__media {
  display: grid;
  place-items: center;
  padding: clamp(1rem,2vw,1.5rem);
  background: linear-gradient(135deg, #f6fbfd, #eaf5f9);
}
.auto-loop-panel__media img {
  width: 100%;
  border-radius: var(--radius-xl);
}
.auto-loop-panel__copy {
  display: grid;
  align-content: center;
  padding: clamp(1.5rem, 4vw, 3rem);
}
.auto-loop-panel__copy p:not(.eyebrow) { color: var(--color-muted); }
@keyframes auto-panel-enter {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}

.auto-visibility {
  background: white;
}
.auto-role-cards {
  grid-template-columns: repeat(3, minmax(0,1fr));
}
.auto-role-cards article {
  min-height: 12rem;
  padding: 1.15rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  background: linear-gradient(180deg, white, #f7fbfd);
  box-shadow: var(--shadow-sm);
}
.auto-role-cards h3 { margin-bottom: .5rem; }
.auto-role-cards p { color: var(--color-muted); }

.auto-access {
  padding-block: var(--section-space);
  background:
    radial-gradient(circle at 88% 20%, rgba(15,122,128,.08), transparent 26rem),
    var(--color-surface-soft);
}
.auto-access__grid { grid-template-columns: minmax(24rem, 1.05fr) minmax(0, .95fr); }
.auto-access__copy .cluster { margin-top: 1.5rem; gap: .65rem 1.1rem; }
.auto-access__copy .link-arrow { font-size: .94rem; }

.auto-evidence {
  position: relative;
  isolation: isolate;
  overflow: clip;
  padding-block: var(--section-space);
  color: white;
  background: linear-gradient(145deg, #071d2c, #0d2a3e 58%, #17435b);
}
.auto-evidence::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  background: radial-gradient(circle at 78% 24%, rgba(35,131,197,.32), transparent 29rem);
}
.auto-evidence h2,
.auto-evidence h3 { color: white; }
.auto-evidence .lead,
.auto-evidence p { color: rgba(255,255,255,.78); }
.auto-evidence__grid {
  display: grid;
  gap: clamp(2rem,5vw,4rem);
  align-items: center;
  grid-template-columns: minmax(0,.86fr) minmax(24rem,1.14fr);
}
.auto-evidence__visual { margin: 0; }
.auto-evidence__visual img {
  border: 1px solid rgba(255,255,255,.16);
  border-radius: var(--radius-2xl);
  background: rgba(255,255,255,.08);
  box-shadow: 0 34px 100px rgba(0,0,0,.28);
}
.auto-evidence__note {
  padding: 1rem;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: var(--radius-lg);
  background: rgba(255,255,255,.08);
}
.auto-dark-link { color: #aee8e6; }
.auto-dark-link:hover { color: white; }

.auto-final {
  position: relative;
  overflow: hidden;
  padding-block: var(--section-space);
  color: white;
  background:
    radial-gradient(circle at 15% 25%, rgba(141,224,229,.14), transparent 27rem),
    linear-gradient(135deg, #0d2a3e, #102f43 60%, #092130);
}
.auto-final h2 { color: white; }
.auto-final p { color: rgba(255,255,255,.78); }
.auto-final__grid {
  display: grid;
  gap: clamp(2rem,5vw,4rem);
  align-items: center;
  grid-template-columns: minmax(0,.9fr) minmax(22rem,1.1fr);
}
.auto-final__copy { max-width: 47rem; }
.auto-final__visual img {
  border-color: rgba(255,255,255,.16);
  background: rgba(255,255,255,.08);
  box-shadow: 0 28px 90px rgba(0,0,0,.25);
}

@media (max-width: 68rem) {
  .auto-hero__grid,
  .auto-network__grid,
  .auto-visibility__grid,
  .auto-access__grid,
  .auto-fit__grid,
  .auto-evidence__grid,
  .auto-final__grid {
    grid-template-columns: 1fr;
  }
  .auto-hero__grid { min-height: auto; }
  .auto-hero__frame { transform: none; }
  .auto-loop-shell { grid-template-columns: 1fr; }
  .auto-loop-tabs { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .auto-loop-panel { grid-template-columns: 1fr; }
  .auto-role-cards { grid-template-columns: 1fr; }
}

@media (max-width: 44rem) {
  .auto-hero h1 { font-size: clamp(2.4rem, 15vw, 4.2rem); }
  .auto-signal-board,
  .auto-loop-tabs { grid-template-columns: 1fr; }
  .auto-loop-panel { min-height: auto; }
  .auto-loop-panel__copy { padding: 1.35rem; }
  .auto-friction-grid article,
  .auto-fit__cards article { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .auto-loop-panel.is-entering { animation: none; }
  .auto-loop-tab,
  .auto-hero__frame { transition: none; transform: none; }
}

/* Visual-guideline image pass: dealer-service photography now leads the page. */
.auto-hero__frame picture { display: block; }
.auto-hero__frame picture img {
  display: block;
  width: 100%;
  height: clamp(27rem, 46vw, 37rem);
  object-fit: cover;
  object-position: center;
}
.auto-photo-label {
  position: absolute;
  left: 1rem;
  bottom: 1rem;
  z-index: 2;
  max-width: min(26rem, calc(100% - 2rem));
  padding: .52rem .78rem;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: var(--radius-pill);
  color: rgba(255,255,255,.9);
  background: rgba(13,42,62,.78);
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}
@media (max-width: 44rem) {
  .auto-hero__frame picture img { height: 24rem; }
}

/* Step 5A: Automotive-owned sector structure */
.auto-records,
.auto-capabilities {
  padding-block: var(--section-space);
}

.auto-records {
  background:
    radial-gradient(circle at 12% 78%, rgba(35,131,197,.08), transparent 28rem),
    var(--color-surface-soft);
}

.auto-records__grid {
  display: grid;
  gap: clamp(2rem, 5vw, 4.25rem);
  align-items: center;
  grid-template-columns: minmax(24rem, 1.08fr) minmax(0, .92fr);
}

.auto-records__visual,
.auto-records__copy {
  min-width: 0;
}

.auto-records__visual {
  margin: 0;
}

.auto-records__visual img {
  width: 100%;
  border: 1px solid rgba(184,199,208,.72);
  border-radius: var(--radius-2xl);
  background: white;
  box-shadow: var(--shadow-lg);
}

.auto-loop-panels {
  min-width: 0;
}

.auto-loop-panel + .auto-loop-panel {
  border-top: 1px solid var(--color-border);
}

.auto-loop-shell.is-enhanced .auto-loop-panel + .auto-loop-panel {
  border-top: 0;
}

.auto-loop-facts {
  display: grid;
  gap: .72rem;
  margin: .4rem 0 0;
}

.auto-loop-facts div {
  display: grid;
  gap: .15rem;
  padding-top: .72rem;
  border-top: 1px solid rgba(184,199,208,.62);
}

.auto-loop-facts dt {
  color: var(--color-navy-950);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.auto-loop-facts dd {
  margin: 0;
  color: var(--color-muted);
  font-size: .92rem;
  line-height: 1.5;
}

.auto-capabilities {
  background:
    radial-gradient(circle at 86% 18%, rgba(15,122,128,.08), transparent 26rem),
    linear-gradient(180deg, #fff, #f7fbfd);
}

.auto-capability-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.auto-capability-grid a {
  display: grid;
  gap: .65rem;
  min-height: 11.5rem;
  padding: clamp(1.25rem, 2.5vw, 1.7rem);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  color: var(--color-navy-950);
  background: white;
  box-shadow: var(--shadow-sm);
  text-decoration: none;
  transition: transform var(--duration-standard) var(--ease-emphasised), border-color var(--duration-fast), box-shadow var(--duration-standard);
}

.auto-capability-grid a:hover,
.auto-capability-grid a:focus-visible {
  transform: translateY(-3px);
  border-color: rgba(35,131,197,.38);
  box-shadow: var(--shadow-md);
}

.auto-capability-grid strong {
  font-size: var(--text-h5);
  line-height: 1.2;
}

.auto-capability-grid span {
  color: var(--color-muted);
  line-height: 1.6;
}

.auto-visibility__copy .cluster {
  margin-top: 1.4rem;
  gap: .75rem 1.2rem;
}

.auto-visibility__copy .link-arrow {
  font-size: .94rem;
}

@media (max-width: 68rem) {
  .auto-records__grid {
    grid-template-columns: 1fr;
  }

  .auto-loop-panel {
    min-height: auto;
  }
}

@media (max-width: 44rem) {
  .auto-capability-grid {
    grid-template-columns: 1fr;
  }

  .auto-capability-grid a {
    min-height: 0;
  }

  .auto-loop-tab strong {
    font-size: .95rem;
  }
}


.auto-handoff,.auto-integration{padding:var(--section-space) 0}.auto-handoff{background:var(--color-surface-soft)}.auto-integration{background:linear-gradient(180deg,#fff,var(--color-surface-blue))}.auto-handoff__grid,.auto-integration__grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(24rem,1.1fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}.auto-integration__grid{grid-template-columns:minmax(24rem,1.05fr) minmax(0,.95fr)}.auto-handoff__visual,.auto-integration__visual{overflow:hidden;border:1px solid var(--color-border);border-radius:var(--radius-2xl);background:#fff;box-shadow:var(--shadow-md)}.auto-handoff__visual img,.auto-integration__visual img{display:block;width:100%;height:auto}.auto-system-cards{display:grid;gap:.8rem;margin:1.25rem 0}.auto-system-cards article{padding:1rem 1.1rem;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:#fff;box-shadow:var(--shadow-sm)}.auto-system-cards h3{margin:0;font-size:var(--text-h5)}.auto-system-cards p{margin:.35rem 0;color:var(--color-muted)}.auto-system-cards a{font-weight:var(--font-weight-bold)}.auto-final--text-led{padding:var(--section-space-compact) 0 var(--section-space)}.auto-final__panel{padding:clamp(2rem,5vw,4rem);border-radius:var(--radius-2xl);color:#fff;background:radial-gradient(circle at 80% 20%,rgba(126,214,208,.2),transparent 32%),linear-gradient(135deg,var(--color-navy-950),var(--color-brand-blue-800));box-shadow:var(--shadow-xl)}.auto-final__panel h2{color:#fff}.auto-final__panel p{max-width:52rem;color:rgba(255,255,255,.78)}.auto-loop-tabs{display:none}.auto-loop-shell.is-enhanced .auto-loop-tabs{display:grid}.auto-loop-shell:not(.is-enhanced){grid-template-columns:1fr}.auto-loop-shell:not(.is-enhanced) .auto-loop-panel{display:grid;margin-bottom:1rem}.auto-loop-shell:not(.is-enhanced) .auto-loop-panels{display:grid;gap:1rem;border:0;box-shadow:none;background:transparent}.auto-evidence .cluster{align-items:center}.auto-dark-link,.auto-dark-link:visited{color:#d8edf8}.auto-dark-link:hover{color:#fff}@media(max-width:72rem){.auto-handoff__grid,.auto-integration__grid{grid-template-columns:1fr}.auto-integration__visual{order:2}.auto-integration__copy{order:1}}@media(max-width:52rem){.auto-loop-shell.is-enhanced .auto-loop-tabs{grid-template-columns:1fr}}

.auto-network__principles{display:grid;gap:.8rem;margin-top:1.4rem}.auto-network__principles article{padding:1rem 1.1rem;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:#fff;box-shadow:var(--shadow-sm)}.auto-network__principles h3{margin:0;font-size:var(--text-h5)}.auto-network__principles p{margin:.35rem 0 0;color:var(--color-muted)}.auto-loop-facts{display:grid;gap:.7rem;margin:1rem 0 0}.auto-loop-facts>div{padding:.8rem .95rem;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-soft)}.auto-loop-facts dt{font-weight:var(--font-weight-bold);color:var(--color-navy-950)}.auto-loop-facts dd{margin:.2rem 0 0;color:var(--color-muted)}