:root {
  --ink: #f5f2ea;
  --muted: #c2c1ba;
  --muted-2: #a2a29b;
  --line: rgba(245, 242, 234, 0.2);
  --paper: #0a0a0a;
  --panel: #121212;
  --accent: #5eead4;
  --blue: #0879d9;
  --display: "Helvetica Neue", "PingFang SC", sans-serif;
  --serif: "Georgia", "Songti SC", "STSong", serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--display); font-size: 16px; line-height: 1.55; }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }
.noise { position: fixed; inset: 0; z-index: 20; pointer-events: none; opacity: .03; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E"); }
.section-shell { width: min(1440px, calc(100% - 64px)); margin: 0 auto; }
.ruled-section { padding: 120px 0; border-top: 1px solid var(--line); }
.serif { color: var(--accent); font-family: inherit; font-weight: inherit; }
.italic { font-style: italic; }
.accent { color: var(--accent); }
.latin-script { font-family: var(--serif); }
latin-text { display: inline; }
.eyebrow, .section-index { color: var(--muted); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }
.section-index { white-space: nowrap; }
.display-title { margin: 0; font-size: clamp(38px, 5.2vw, 76px); font-weight: 400; line-height: 1.14; letter-spacing: -.04em; }
.section-heading { display: grid; grid-template-columns: 1fr 3fr; gap: 32px; margin-bottom: 80px; }
.section-heading > p { width: min(480px, 100%); margin: 0 0 0 auto; color: var(--muted); }

.site-header { position: fixed; inset: 0 0 auto; z-index: 10; height: 72px; padding: 0 32px; display: flex; align-items: center; justify-content: space-between; background: linear-gradient(to bottom, rgba(10,10,10,.94), rgba(10,10,10,.62), transparent); backdrop-filter: blur(4px); }
.brand { font-size: 19px; font-weight: 700; letter-spacing: -.04em; }
.brand span { color: var(--accent); }
.site-nav { display: flex; gap: 28px; font-size: 12px; }
.site-nav a { color: var(--muted); transition: color .2s; }
.site-nav a:hover, .site-nav a.is-active { color: var(--ink); }
.site-nav a.is-active::before { content: "• "; color: var(--accent); }
.menu-button { display: none; border: 0; background: transparent; }
:where(a, button, [tabindex]:not([tabindex="-1"])):focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; border-radius: 2px; }
.home .project-visual:focus-visible { outline-offset: 6px; box-shadow: 0 0 0 3px var(--paper), 0 0 0 5px var(--accent); }
.home .project-visual:focus-visible .project-cover-art { transform: scale(1.035); }
.home .project-row:focus-visible { outline-offset: -3px; padding-inline: 18px; background: rgba(94,234,212,.1); }

.hero.section-shell { width: 100%; padding-left: max(32px, calc((100vw - 1440px) / 2)); padding-right: max(32px, calc((100vw - 1440px) / 2)); }
.hero { position: relative; isolation: isolate; overflow: clip; min-height: 100svh; padding-top: 104px; padding-bottom: 32px; display: flex; flex-direction: column; }
.hero::before,
.hero::after { content: none; }
.hero > * { position: relative; z-index: 1; }
.hero-kicker { display:flex; justify-content:space-between; padding-bottom:14px; border-bottom:1px solid var(--line); color:var(--muted); font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
.hero-stage { flex:1; display:grid; grid-template-columns:repeat(12,1fr); grid-template-rows:1fr auto; gap:24px; align-items:center; padding:34px 0 30px; }
.hero-title { position: relative; margin: auto 0; font-size: clamp(82px, 14.5vw, 212px); line-height: .8; letter-spacing: -.07em; font-weight: 500; }
.hero-title::after { display: none; }
.hero-title span { display: block; }
.hero-title { grid-column:1 / 9; grid-row:1 / 3; align-self:center; }
.hero-title span:last-child { margin-left: 13%; color: var(--accent); }
.hero-intro { grid-column:7 / 13; grid-row:2; max-width:620px; padding-top:20px; border-top:1px solid var(--line); }
.hero-experience { margin:0 0 12px; font-size:clamp(20px,2vw,30px); line-height:1.3; letter-spacing:-.025em; }
.hero-statement { margin:0; color:var(--muted); font-size:clamp(14px,1.25vw,18px); line-height:1.68; letter-spacing:-.01em; }
.hero-bottom { display:grid; grid-template-columns:1fr 1fr; align-items:end; gap:40px; border-top:1px solid var(--line); padding-top:20px; }
.hero-name { margin: 0 0 8px; font-size: 18px; }
.availability { color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.availability i { display: inline-block; width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 16px var(--accent); }
.hero-focus { margin:0; text-align:right; font-size:14px; letter-spacing:.08em; }
.hero-focus i { margin:0 10px; color:var(--accent); font-style:normal; }
.scroll-cue { display: flex; justify-content: space-between; margin-top: 42px; color: var(--muted); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.scroll-cue i { color: var(--accent); font-size: 18px; font-style: normal; animation: bob 1.8s infinite ease-in-out; }

/* Homepage visual language: a restrained system of signal, line and marker. */
.home .brand::after { content:""; display:inline-block; width:6px; height:6px; margin:0 0 1px 6px; border-radius:50%; background:var(--accent); box-shadow:0 0 14px rgba(94,234,212,.68); }
.home .section-index { display:flex; align-items:center; gap:10px; }
.home .section-index::before { content:""; width:20px; height:1px; background:var(--accent); box-shadow:8px 0 0 rgba(94,234,212,.34); }
.home .hero-background { position:absolute; z-index:-2; inset:0; width:100%; height:100%; max-width:none; object-fit:cover; object-position:center; opacity:1; pointer-events:none; }
/* Venetian blinds: the backdrop is sliced into slats that the cursor can push.
   Built by app.js; without JS the plain .hero-background image shows instead.
   No color/overlay is applied here — the original artwork stays true, only the
   geometry (rotateX) reacts to the cursor. */
.hero-blinds { position:absolute; inset:0; z-index:-1; overflow:hidden; pointer-events:none; perspective:1100px; perspective-origin:50% 50%; }
.hero-blind { position:absolute; left:0; width:100%; background-repeat:no-repeat; transform-origin:center center; backface-visibility:hidden; will-change:transform; }
.home .project-meta span:first-child { display:flex; align-items:center; gap:9px; }
.home .project-meta span:first-child::after { content:""; width:5px; height:5px; border:1px solid var(--accent); border-radius:50%; box-shadow:0 0 0 4px rgba(94,234,212,.08); }
.home .capability { position:relative; overflow:hidden; }
.home .capability::after { content:""; position:absolute; top:24px; right:26px; width:44px; height:44px; border:1px solid rgba(94,234,212,.5); transform:rotate(45deg); }
.home .capability:nth-child(2)::after { border-radius:50%; box-shadow:inset 0 0 0 11px #0a0a0a, inset 0 0 0 12px rgba(94,234,212,.34); transform:none; }
.home .capability:nth-child(3)::after { width:42px; height:42px; border-radius:50% 50% 0; transform:rotate(45deg); }
.home .capability:nth-child(4)::after { width:48px; height:24px; border-width:0 0 1px 1px; transform:rotate(-45deg); }

/* Homepage legibility — lift informationally-primary small text to a readable
   muted with enough size, while pure metadata stays one step fainter so the
   hierarchy (ink → muted → muted-2) reads clearly on the dark paper. */
.home .about-grid p:not(:first-child),
.home .section-heading > p,
.home .project-copy > p:not(.eyebrow),
.home .project-result span,
.home .timeline article p,
.home .row-detail,
.home .approach-flow p,
.home .capability small,
.home .contact-action { color: var(--muted); font-size: clamp(13.5px, 1.05vw, 16px); line-height: 1.72; }
.home .project-meta span:last-child,
.home .timeline article time { color: var(--muted-2); font-size: clamp(11.5px, 0.85vw, 13px); letter-spacing: .02em; }
.home .approach-flow li > span { color: var(--accent); font-weight: 500; font-size: clamp(11px, 0.9vw, 12.5px); letter-spacing: .06em; opacity: 1; }

/* About echoes the hero's oversized left-set type: the statement occupies the
   left part of the page while the right side stays quiet, and the profile
   notes close in a narrow column at the bottom left. */
.about {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: 100%;
  margin: 0;
  padding-right: max(32px, calc((100vw - 1440px) / 2));
  padding-left: max(32px, calc((100vw - 1440px) / 2));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: clamp(40px, 6vh, 80px);
  min-height: 100svh;
}
.about::before {
  content: "";
  position: absolute;
  z-index: -2;
  inset: 0;
  background: linear-gradient(180deg, #0a0a0a 0%, #0a0a0a 34%, #0d1314 62%, #172223 82%, #223031 100%);
  pointer-events: none;
}
.about-topline {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 32px;
}
.about-topline p { margin: 0; }
.about-note { color: var(--muted-2); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }
.about-stage {
  position: relative;
  display: grid;
  grid-template-columns: minmax(420px, .9fr) minmax(600px, 1.1fr);
  gap: clamp(44px, 6vw, 100px);
  align-items: center;
}
.about-head {
  align-self: center;
}
.about .about-title {
  margin: 0;
  font-size: clamp(50px, 5.1vw, 72px);
  font-weight: 500;
  line-height: 1.08;
  letter-spacing: -.05em;
  text-align: left;
}
.about-title span { display: block; white-space: nowrap; }
.about-title span:last-child { margin-left: 0; }
.about-title { position: relative; z-index: 1; }
.about-profile {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  justify-self: start;
  align-items: start;
  width: min(100%, 470px);
}
.about-portrait {
  position: relative;
  justify-self: start;
  width: min(100%, 300px);
  margin: 0;
}
.about-portrait-art { position: relative; }
.about-portrait img {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 28px 48px rgba(0,0,0,.35));
}
.about-copy { width: 100%; }
.about-identity {
  display: flex;
  gap: 14px;
  align-items: baseline;
  margin-top: 28px;
}
.about-identity strong { font-size: 22px; font-weight: 500; letter-spacing: -.02em; }
.about-identity span { color: var(--muted-2); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.about-brief {
  display: grid;
  gap: 12px;
  width: 100%;
}
.about-brief p { margin: 0; color: var(--muted); font-size: clamp(14px, 1.25vw, 18px); line-height: 1.7; }

@media (max-width: 1050px) {
  .about-stage { grid-template-columns: 1fr; }
  .about-profile { width: min(100%, 560px); }
}

.project-card { border-top: 1px solid var(--line); padding: 18px 0 100px; }
.project-meta { display: grid; grid-template-columns: 1fr 2fr 1fr; color: var(--muted); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.project-meta span:last-child { text-align: right; }
.project-card-body { display: grid; grid-template-columns: .88fr 1.12fr; gap: clamp(32px, 6vw, 96px); margin-top: 42px; align-items: center; }
.project-card-body.reverse { grid-template-columns: 1.12fr .88fr; }
.project-card-body.reverse .project-copy { order: 2; }
.project-copy h3 { margin: 14px 0 24px; max-width: 680px; font-size: clamp(32px, 4.1vw, 62px); font-weight: 400; line-height: 1.15; letter-spacing: -.04em; }
.project-copy > p:not(.eyebrow) { max-width: 580px; color: var(--muted); }
.project-result { display: flex; align-items: baseline; gap: 16px; margin: 36px 0; }
.project-result strong { color: var(--accent); font-family: var(--serif); font-size: 42px; font-weight: 400; font-style: italic; }
.project-result span { color: var(--muted); font-size: 12px; }
.text-link { display: inline-flex; gap: 16px; padding-bottom: 6px; border-bottom: 1px solid var(--ink); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.text-link span { color: var(--accent); }
.project-visual { position: relative; min-height: 620px; overflow: hidden; border-radius: 2px; background: #e5ecf7; }
.visual-note { position: absolute; right: 20px; bottom: 16px; color: rgba(10,10,10,.6); font-size: 9px; line-height: 1.3; letter-spacing: .12em; text-align: right; }
.philips-visual { background:radial-gradient(circle at 68% 42%,rgba(23,102,211,.22),transparent 34%),radial-gradient(circle at 26% 78%,rgba(94,234,212,.08),transparent 27%),linear-gradient(145deg,#15243a,#0b1018 70%); }
.philips-visual::before { content: "SERVICE / STATUS / CLOSURE"; position: absolute; z-index:1; left: 24px; top: 22px; color: rgba(209,228,255,.68); font-size: 9px; letter-spacing: .16em; }
.project-cover-art { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.2,.7,.2,1); }
.project-visual:hover .project-cover-art { transform:scale(1.035); }
.philips-cover-art { inset:0; width:100%; height:100%; object-fit:cover; object-position:center; opacity:1; filter:none; }
.philips-visual .visual-note { color:rgba(209,228,255,.54); }
.phone { width: 31%; max-width: 210px; aspect-ratio: .5; padding: 8px; border: 2px solid #121212; border-radius: 28px; background: #111; box-shadow: 0 28px 60px rgba(25,55,90,.2); transform: rotate(-5deg) translateY(34px); }
.phone-b { transform: rotate(5deg) translateY(-30px); }
.phone-screen { height: 100%; padding: 36px 13px 18px; display: flex; flex-direction: column; gap: 14px; border-radius: 20px; color: #111; background: #f6f7f9; }
.phone-screen::before { content: ""; position: absolute; }
.phone-screen .mini-logo { color: var(--blue); font-size: 9px; font-weight: 700; }
.phone-screen b { font-size: 16px; }
.phone-screen i { display: block; height: 58px; border-radius: 8px; background: white; box-shadow: 0 5px 20px rgba(0,0,0,.05); }
.status-screen { color: white; background: linear-gradient(165deg, #076ec7 0 32%, #f5f7f8 32%); }
.status-screen b { font-size: 14px; }
.status-screen em { margin: 32px 0 0; color: var(--blue); font: 30px var(--serif); }
.lynk-visual { background:radial-gradient(circle at 55% 28%,rgba(255,61,127,.22),transparent 28%),linear-gradient(145deg,#17171a,#050506); }
.lynk-cover-art { object-position:center; }
.lynk-visual .visual-note { color:rgba(255,255,255,.54); }
.volvo-home-visual { background:#b7b7b7; }
.volvo-cover-art { object-position:center; }
.project-list { border-top: 1px solid var(--line); }
.project-row { display: grid; grid-template-columns: .24fr 1.32fr .46fr .68fr .12fr; gap: 28px; align-items: center; min-height: 176px; border-bottom: 1px solid var(--line); transition: background .25s, padding .25s; }
.project-row:hover { padding: 0 18px; background: var(--accent); color: #090909; }
.project-number { color: var(--muted); font: italic 28px var(--serif); }
.project-row p { margin: 0 0 4px; color: var(--muted); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.project-row h3 { margin: 0; font-size: clamp(24px, 2.65vw, 39px); font-weight: 400; letter-spacing: -.03em; }
.row-detail { color: var(--muted); font-size: 12px; }
.row-arrow { font-size: 22px; }
.project-row:hover p, .project-row:hover .project-number, .project-row:hover .row-detail { color: rgba(0,0,0,.64); }
.project-symbol { display: block; justify-self: center; width: 132px; height: 112px; }
.project-symbol img { display: block; width: 100%; height: 100%; object-fit: contain; }

.capability-grid { display: grid; grid-template-columns: repeat(2, 1fr); }
.capability { min-height: 310px; padding: 26px; border-top: 1px solid var(--line); border-right: 1px solid var(--line); }
.capability:nth-child(even) { border-right: 0; }
.capability > span { color: var(--accent); font: italic 24px var(--serif); }
.capability-project { margin: 52px 0 12px; color: var(--accent) !important; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.capability > span + h3 { margin-top: 52px; }
.capability h3 { max-width: 520px; margin: 0 0 18px; font-size: clamp(25px, 2.45vw, 36px); font-weight: 400; line-height: 1.3; letter-spacing: -.035em; }
.capability p { max-width: 430px; color: var(--muted); }
.capability small { display: block; margin-top: 34px; color: var(--muted); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }

/* Capabilities: 深色背景上的圆角半透明卡片，减少线条，高亮色保持原 accent。 */
#capabilities {
  width: 100%;
  margin: 0;
  background: #0a0a0a;
}
#capabilities > .section-heading,
#capabilities > .capability-grid {
  width: min(1440px, calc(100% - 64px));
  margin-right: auto;
  margin-left: auto;
}
#capabilities .capability-grid { gap: 24px; }
#capabilities .capability {
  display: flex;
  flex-direction: column;
  min-height: 260px;
  padding: 28px 30px 26px;
  border: 1px solid rgba(245, 242, 234, .08);
  border-radius: 20px;
  background: rgba(255, 255, 255, .04);
  transition: background-color .3s ease, border-color .3s ease;
}
#capabilities .capability small { margin-top: auto; padding-top: 28px; }
#capabilities .capability:hover {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(94, 234, 212, .45);
}
/* 装饰图形恢复为原浅青绿 accent，在深色卡片上自然高亮。 */
#capabilities .capability::after { border-color: rgba(94, 234, 212, .42); }
#capabilities .capability:nth-child(2)::after {
  box-shadow: inset 0 0 0 11px #0a0a0a, inset 0 0 0 12px rgba(94, 234, 212, .34);
}
#capabilities .capability:hover::after { border-color: rgba(94, 234, 212, .85); }
#capabilities .section-index::before { box-shadow: 8px 0 0 rgba(94, 234, 212, .34); }
#capabilities:hover .section-index::before { width: 34px; box-shadow: 14px 0 0 rgba(94, 234, 212, .4); }

.process-list { margin: 0; padding: 0; list-style: none; counter-reset: step; }
.process-list li { display: grid; grid-template-columns: .3fr .7fr 1fr; gap: 24px; align-items: center; min-height: 112px; border-top: 1px solid var(--line); }
.process-list li:last-child { border-bottom: 1px solid var(--line); }
.process-list span { color: var(--accent); font: italic 22px var(--serif); }
.process-list h3 { margin: 0; font-size: 28px; font-weight: 400; }
.process-list p { margin: 0; color: var(--muted); }
.ai-proof { margin-top: 64px; padding: 36px; color: #0b0b0b; background: var(--accent); }
.ai-proof .eyebrow { color: rgba(0,0,0,.58); }
.workflow { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 40px; }
.workflow span { font-size: clamp(20px, 2.6vw, 38px); line-height: 1; }
.workflow small { color: rgba(0,0,0,.6); font: 11px var(--display); }
.workflow i { font-style: normal; }
.approach-strip { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.approach-flow { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; padding: 0; list-style: none; }
.approach-flow li { position: relative; min-height: 210px; padding: 26px 28px 30px 0; border-right: 1px solid var(--line); }
.approach-flow li + li { padding-left: 28px; }
.approach-flow li:last-child { border-right: 0; }
.approach-flow li:not(:last-child)::after { content: "→"; position: absolute; z-index: 1; top: 50%; right: -10px; width: 20px; color: var(--accent); background: var(--paper); text-align: center; transform: translateY(-50%); }
.approach-flow span { color: var(--accent); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.approach-flow strong { display: block; margin-top: 70px; font-size: clamp(21px, 2vw, 29px); font-weight: 400; }
.approach-flow p { margin: 8px 0 0; color: var(--muted); font-size: 12px; }
.approach-rule { display: grid; grid-template-columns: 1fr 3fr; gap: 28px; padding: 24px 0; border-top: 1px solid var(--line); }
.approach-rule span { color: var(--accent); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.approach-rule p { max-width: 760px; margin: 0; color: var(--muted); }

.timeline { position: relative; }
.timeline::before { content: ""; position: absolute; top: 0; bottom: 0; left: 219px; width: 1px; background: linear-gradient(to bottom, transparent, rgba(94,234,212,.55) 8%, rgba(94,234,212,.2) 92%, transparent); }
.timeline article { position: relative; display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 0; min-height: 168px; padding: 34px 0; border-top: 1px solid var(--line); }
.timeline article:last-child { border-bottom: 1px solid var(--line); }
.timeline article::before { content: ""; position: absolute; z-index: 2; top: 39px; left: 213px; width: 13px; height: 13px; border: 4px solid var(--paper); border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 1px rgba(94,234,212,.5), 0 0 18px rgba(94,234,212,.35); }
.timeline article::after { content: none; }
.timeline-meta { display: flex; flex-direction: column; gap: 12px; padding-right: 42px; }
.timeline-meta > span { order: 2; color: var(--accent); font-size: 10px; letter-spacing: .14em; }
.timeline time { order: 1; color: var(--muted-2); font: italic 13px var(--serif); letter-spacing: .02em; }
.timeline-entry { position: relative; z-index: 1; padding-left: 48px; }
.timeline-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; }
.timeline h3 { margin: 0; font-size: clamp(25px, 2.3vw, 34px); font-weight: 400; letter-spacing: -.025em; }
.home .timeline .timeline-role { flex: 0 0 auto; margin: 0; color: var(--accent); font-size: 11px; line-height: 1.3; letter-spacing: .08em; text-transform: uppercase; }
.home .timeline .timeline-summary { max-width: 760px; margin: 22px 0 24px; color: var(--muted); font-size: clamp(15px, 1.2vw, 18px); line-height: 1.6; }
.timeline-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.timeline-tags li { padding: 6px 12px; border-radius: 999px; color: #071513; background: var(--accent); font-size: 10px; font-weight: 500; letter-spacing: .04em; }
.timeline-tags li::before { content: none; }

.contact { min-height: 100svh; padding: 110px 0 28px; display: flex; flex-direction: column; justify-content: space-between; }
.contact-title { margin: 40px 0; max-width: 1180px; font-size: clamp(38px, 5vw, 72px); font-weight: 400; line-height: 1.08; letter-spacing: -.035em; }
.contact-title span { display: inline-block; margin-top: 12px; font-size: 1.75em; }
.contact-title span { color: var(--accent); }
.contact-title .contact-subtitle { display: block; margin-top: 18px; font-size: .38em; line-height: 1.35; letter-spacing: .01em; }
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; padding: 28px 0 70px; border-top: 1px solid var(--line); font-size: 20px; }
.contact-grid p { margin: 0; }
.contact-action { max-width: 520px; margin-top: 18px !important; color: var(--muted); font-size: 14px; font-weight: 300; }
.contact-links { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; text-align: right; }
.contact-links a { border-bottom: 1px solid var(--line); transition: color .2s, border-color .2s; }
.contact-links a:hover { color: var(--accent); border-color: var(--accent); }
.contact-links a:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.footer-line { display: flex; justify-content: space-between; color: var(--muted); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }

.reveal { opacity: 1; transform: none; }
:where(.hero, .case-hero) .reveal,
.section-heading.reveal,
.case-section-head.reveal,
figure.reveal,
.project-card.reveal,
.project-row.reveal,
.about .display-title.reveal,
.about-topline.reveal,
.about-brief.reveal,
.contact-title.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .8s ease, transform .8s cubic-bezier(.2,.7,.2,1);
}
:where(.hero, .case-hero) .reveal.is-visible,
.section-heading.reveal.is-visible,
.case-section-head.reveal.is-visible,
figure.reveal.is-visible,
.project-card.reveal.is-visible,
.project-row.reveal.is-visible,
.about .display-title.reveal.is-visible,
.about-topline.reveal.is-visible,
.about-brief.reveal.is-visible,
.contact-title.reveal.is-visible { opacity: 1; transform: none; }
@keyframes bob { 50% { transform: translateY(7px); } }

/* Case study */
.case-header { border-bottom: 1px solid var(--line); }
.reading-progress { position: fixed; inset: 0 0 auto; z-index: 30; height: 2px; background: var(--accent); transform: scaleX(0); transform-origin: left; }
.case-hero { min-height: 94svh; padding: 130px 0 70px; display: flex; flex-direction: column; justify-content: space-between; }
.case-hero h1 { max-width: 1200px; margin: 30px 0 50px; font-size: clamp(58px, 8.4vw, 126px); line-height: 1.02; letter-spacing: -.055em; font-weight: 500; }
.case-hero h1 span { color: var(--accent); font-family: inherit; font-style: italic; font-weight: inherit; }
.case-lede { display: grid; grid-template-columns: 1fr 1.5fr; gap: 48px; align-items: end; }
.case-lede > p { max-width: 720px; margin: 0; font-size: clamp(18px, 2.15vw, 30px); line-height: 1.38; }
.case-facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
.case-facts div { border-top: 1px solid var(--line); padding-top: 12px; }
.case-facts small { display: block; color: var(--muted); text-transform: uppercase; letter-spacing: .1em; }
.case-facts b { font-weight: 400; }
.case-snapshot { position:relative; padding:54px 0 64px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.case-snapshot::before { content:""; position:absolute; inset:0 calc(50% - 50vw); z-index:-1; background:radial-gradient(circle at 78% 20%,rgba(94,234,212,.09),transparent 34%); pointer-events:none; }
.case-snapshot-head { display:flex; align-items:end; justify-content:space-between; gap:32px; margin-bottom:34px; }
.case-snapshot-head p { margin:0; }
.case-snapshot-head h2 { max-width:620px; margin:0; font-size:clamp(22px,2.2vw,32px); line-height:1.2; font-weight:400; letter-spacing:-.025em; text-align:right; }
.case-snapshot-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); border-top:1px solid var(--line); }
.case-snapshot-grid article { min-height:190px; padding:20px 18px 18px 0; border-right:1px solid var(--line); }
.case-snapshot-grid article:nth-child(1),.case-snapshot-grid article:nth-child(3) { grid-column:span 3; }
.case-snapshot-grid article:nth-child(2),.case-snapshot-grid article:nth-child(4),.case-snapshot-grid article:nth-child(5) { grid-column:span 2; }
.case-snapshot-grid.six-up article { grid-column:span 4; }
.case-snapshot-grid.eight-up article { grid-column:span 3; border-bottom:1px solid var(--line); }
.case-snapshot-grid.eight-up article:nth-child(4n) { border-right:0; }
.case-snapshot-grid.eight-up article:nth-child(n+5) { border-bottom:0; }
.case-snapshot-grid article:last-child { border-right:0; padding-right:0; padding-left:18px; }
.case-snapshot-grid article + article { padding-left:18px; }
.case-snapshot-grid span { display:block; margin-bottom:36px; color:var(--accent); font-size:10px; letter-spacing:.14em; text-transform:uppercase; }
.case-snapshot-grid strong { display:block; font-size:clamp(15px,1.35vw,19px); line-height:1.45; font-weight:400; }
.case-snapshot-grid p { margin:12px 0 0; color:var(--muted); font-size:12px; line-height:1.6; }
.case-story-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); border-top:1px solid var(--line); }
.case-story-grid article { min-height:190px; padding:24px 26px 28px 0; border-bottom:1px solid var(--line); }
.case-story-grid article:nth-child(1),.case-story-grid article:nth-child(4) { grid-column:span 5; }
.case-story-grid article:nth-child(2),.case-story-grid article:nth-child(3) { grid-column:span 7; padding-left:30px; border-left:1px solid var(--line); }
.case-story-grid article:nth-child(3) { padding-left:0; padding-right:30px; border-left:0; }
.case-story-grid article:nth-child(4) { padding-left:30px; border-left:1px solid var(--line); }
.case-story-grid span { display:block; margin-bottom:30px; color:var(--accent); font-size:12px; letter-spacing:.14em; text-transform:uppercase; }
.case-story-grid strong { display:block; max-width:760px; font-size:clamp(18px,1.8vw,26px); line-height:1.42; font-weight:400; letter-spacing:-.018em; }
.case-story-grid p { max-width:720px; margin:14px 0 0; color:var(--muted); font-size:14px; line-height:1.75; }
.case-fact-label { margin:42px 0 14px; color:var(--accent); font-size:10px; letter-spacing:.14em; text-transform:uppercase; }
.lynk-case .case-snapshot::before { background:radial-gradient(circle at 82% 18%,rgba(255,61,127,.12),transparent 34%); }
.volvo-case .case-snapshot::before { background:linear-gradient(90deg,rgba(155,199,229,.035),transparent 48%),radial-gradient(circle at 80% 20%,rgba(155,199,229,.1),transparent 34%); }
.iconnect-case .case-snapshot::before { background:radial-gradient(circle at 78% 20%,rgba(62,126,255,.13),transparent 35%); }
.jordan-case .case-snapshot::before { background:radial-gradient(circle at 82% 22%,rgba(255,91,36,.12),transparent 34%); }
@media (max-width:1100px) {
  .case-story-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .case-story-grid article,.case-story-grid article:nth-child(n) { grid-column:span 1; min-height:180px; padding:22px 22px 24px 0; border-left:0; border-right:1px solid var(--line); }
  .case-story-grid article:nth-child(even) { padding-left:22px; padding-right:0; border-right:0; }
  .case-snapshot-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .case-snapshot-grid article,.case-snapshot-grid article:nth-child(1),.case-snapshot-grid article:nth-child(2),.case-snapshot-grid article:nth-child(3),.case-snapshot-grid article:nth-child(4) { grid-column:span 1; min-height:160px; border-bottom:1px solid var(--line); }
  .case-snapshot-grid article:nth-child(even) { border-right:0; }
  .case-snapshot-grid article:nth-child(5) { grid-column:span 2; min-height:140px; padding-left:0; border-right:0; }
  .case-snapshot-grid.six-up article,.case-snapshot-grid.six-up article:nth-child(5) { grid-column:span 1; min-height:160px; padding-left:18px; border-right:1px solid var(--line); }
  .case-snapshot-grid.six-up article:nth-child(odd) { padding-left:0; }
  .case-snapshot-grid.six-up article:nth-child(even) { border-right:0; }
  .case-snapshot-grid.eight-up article { grid-column:span 1; min-height:160px; padding-left:18px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
  .case-snapshot-grid.eight-up article:nth-child(odd) { padding-left:0; }
  .case-snapshot-grid.eight-up article:nth-child(even) { border-right:0; }
  .case-snapshot-grid.eight-up article:nth-child(n+7) { border-bottom:0; }
  .case-snapshot-grid span { margin-bottom:20px; }
}
.case-cover { position: relative; min-height: 82svh; overflow: hidden; background: #dce7f5; }
.case-cover .phone { position: absolute; width: min(220px, 20vw); }
.case-cover .phone-a { left: 20%; top: 16%; transform: rotate(-8deg); }
.case-cover .phone-b { right: 20%; bottom: 10%; transform: rotate(7deg); }
.case-cover-word { position: absolute; left: 4%; bottom: 1%; color: #0768bb; font-size: clamp(80px, 17vw, 260px); font-weight: 600; line-height: .75; letter-spacing: -.08em; opacity: .15; }
.weconnect-figma-cover { display:block; min-height:clamp(780px, 74vw, 960px); padding:clamp(52px,6vw,92px) clamp(20px,4vw,64px) clamp(40px,5vw,72px); background:#101112; isolation:isolate; }
.weconnect-figma-cover::before { content:""; position:absolute; z-index:0; inset:0; pointer-events:none; background:linear-gradient(120deg,rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(30deg,rgba(255,255,255,.015) 1px,transparent 1px); background-size:92px 92px; mask-image:linear-gradient(180deg,#000,transparent 72%); }
.weconnect-figma-cover::after { display:none; }
.weconnect-figma-intro { position:relative; z-index:2; width:min(100%,1120px); margin:0 auto; color:#f5f2f8; }
.weconnect-figma-intro > span { display:block; margin-bottom:18px; color:var(--accent); font-size:10px; letter-spacing:.14em; }
.weconnect-figma-intro h2 { max-width:580px; margin:0; font-size:clamp(28px,3.3vw,50px); line-height:1.13; letter-spacing:-.045em; }
.weconnect-figma-intro p { max-width:440px; margin:18px 0 0; color:rgba(235,234,242,.64); font-size:14px; line-height:1.75; }
.weconnect-figma-cover-inner { position:relative; z-index:1; width:min(100%,1120px); display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); align-items:start; gap:clamp(16px,2.8vw,42px); margin:clamp(32px,4vw,58px) auto 0; }
.weconnect-figma-screen { position:relative; z-index:3; width:100%; max-width:240px; margin:0; justify-self:center; }
.weconnect-figma-screen:nth-child(n), .weconnect-figma-screen img { transform:none !important; rotate:none; skew:none; }
.weconnect-figma-screen img { display:block; width:100%; height:auto; border:1px solid rgba(255,255,255,.22); border-radius:20px; box-shadow:0 28px 60px rgba(0,0,0,.42); }
.weconnect-figma-screen figcaption { display:flex; align-items:center; gap:9px; margin-top:15px; color:rgba(225,224,239,.58); font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.weconnect-figma-screen figcaption::before { content:""; width:20px; height:1px; background:var(--accent); }
.weconnect-figma-cover .case-cover-word { z-index:1; left:3%; bottom:-1%; color:#fff; opacity:.035; pointer-events:none; }
@media (max-width: 1050px) and (min-width: 801px) {
  .weconnect-figma-cover-inner { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 660px; row-gap: 48px; }
  .weconnect-figma-screen:nth-child(n) { margin-top: 0; transform: none !important; }
  .weconnect-figma-screen:nth-child(even) { margin-top: 0; }
}
@media (max-width: 800px) {
  .weconnect-figma-cover { min-height:0; padding-block:56px 72px; }
  .weconnect-figma-intro { text-align:left; }
  .weconnect-figma-cover-inner { grid-template-columns: 1fr; gap: 42px; }
  .weconnect-figma-screen:nth-child(n) { max-width: min(100%, 375px); margin-top: 0; transform: none; }
  .weconnect-figma-cover .case-cover-word { font-size: clamp(72px, 22vw, 132px); opacity: .07; }
}
.case-section { padding: 120px 0; border-bottom: 1px solid var(--line); }
.case-section-head { display: grid; grid-template-columns: 1fr 3fr; gap: 30px; margin-bottom: 70px; }
.case-section h2 { max-width: 900px; margin: 0; font-size: clamp(36px, 5vw, 70px); line-height: 1.15; letter-spacing: -.04em; font-weight: 400; }
.case-section h3 { font-size: 28px; font-weight: 400; }
.case-prose { display: grid; grid-template-columns: 1fr 2fr; gap: 40px; }
.case-prose > p, .case-prose > div > p { margin-top: 0; color: var(--muted); }
.case-prose .lead { color: var(--ink); font-size: 22px; }
.stat-strip { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 70px; border-top: 1px solid var(--line); }
.stat-strip div { padding: 28px 20px 0 0; }
.stat-strip strong { display: block; color: var(--accent); font: italic 56px var(--serif); }
.stat-strip span { color: var(--muted); font-size: 12px; }
.validation-board { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 48px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.validation-board article { min-height: 360px; padding: 28px 30px 30px; display: flex; flex-direction: column; border-right: 1px solid var(--line); }
.validation-board article:last-child { border-right: 0; }
.validation-board .eyebrow { margin: 0; color: var(--accent); }
.validation-board > article > strong { display: block; margin-top: 44px; color: var(--accent); font: italic clamp(46px, 5vw, 68px) var(--serif); line-height: .9; }
.validation-board > article > span { margin-top: 12px; color: var(--muted); font-size: 12px; line-height: 1.55; }
.validation-board article > div { margin-top: auto; padding-top: 22px; border-top: 1px solid var(--line); }
.validation-board small { display: block; color: var(--muted); font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.validation-board article > div p { margin: 10px 0 0; font-size: 15px; line-height: 1.7; }
.principle { position: relative; margin: 70px 0 0; padding: 42px 52px 40px 20%; overflow: hidden; border-top: 1px solid rgba(94,234,212,.7); border-bottom: 1px solid var(--line); background: radial-gradient(circle at 12% 38%, rgba(94,234,212,.12), transparent 24%), linear-gradient(110deg, rgba(255,255,255,.035), transparent 48%); color: var(--ink); }
.principle::before { content: "“"; position: absolute; left: 4%; top: 10px; color: var(--accent); font: italic clamp(92px, 11vw, 150px)/.8 var(--serif); opacity: .82; }
.principle p { max-width: 920px; margin: 0; font-size: clamp(26px, 3.25vw, 45px); line-height: 1.25; letter-spacing: -.025em; }
.principle cite { display: block; margin-top: 26px; color: var(--muted); font-size: 10px; font-style: normal; letter-spacing: .12em; text-transform: uppercase; }
.diagram-frame, .image-frame { margin-top: 64px; padding: 24px; background: #eef2f7; }
.diagram-frame img, .image-frame img { display: block; width: 100%; height: auto; }
.image-frame { overflow-x: auto; }
.image-frame img.wide { min-width: 1050px; }
.caption { display: flex; justify-content: space-between; margin-top: 10px; color: var(--muted); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.ecosystem-frame { position: relative; margin: 72px 0 0; padding: 34px; overflow: hidden; border: 1px solid var(--line); background: radial-gradient(circle at 34% 40%, rgba(20,72,156,.22), transparent 27%), radial-gradient(circle at 85% 20%, rgba(94,234,212,.07), transparent 23%), #101010; }
.ecosystem-frame::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .08; background-image: linear-gradient(rgba(255,255,255,.25) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.25) 1px, transparent 1px); background-size: 38px 38px; mask-image: linear-gradient(to bottom, #000, transparent 88%); }
.ecosystem-label { position: relative; z-index: 1; display: flex; justify-content: space-between; padding-bottom: 52px; }
.ecosystem-label span { color: var(--accent); font: italic 26px var(--serif); }
.ecosystem-label small { color: var(--muted); }
.ecosystem-diagram { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr auto 1fr auto 1fr auto 1.2fr; gap: 14px; align-items: stretch; }
.ecosystem-diagram article { min-height: 190px; padding: 22px; display: flex; flex-direction: column; border: 1px solid var(--line); background: rgba(10,10,10,.76); }
.ecosystem-diagram article::before { content: ""; width: 8px; height: 8px; margin-bottom: 34px; border-radius: 50%; background: var(--muted); }
.ecosystem-diagram article.ecosystem-primary { border-color: rgba(94,234,212,.65); background: linear-gradient(145deg, rgba(94,234,212,.16), rgba(10,10,10,.88) 62%); }
.ecosystem-diagram article.ecosystem-primary::before { background: var(--accent); box-shadow: 0 0 20px rgba(94,234,212,.7); }
.ecosystem-diagram small { color: var(--muted); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.ecosystem-diagram strong { margin-top: auto; font-size: 21px; font-weight: 400; }
.ecosystem-diagram p { margin: 7px 0 0; color: var(--muted); font-size: 11px; }
.ecosystem-diagram > i { align-self: center; color: var(--accent); font: normal 22px var(--serif); }
.ecosystem-return { position: relative; z-index: 1; width: 68%; margin: 28px 5% 34px auto; display: flex; align-items: center; gap: 16px; color: var(--accent); }
.ecosystem-return::before { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, var(--accent), transparent); }
.ecosystem-return p { margin: 0; color: var(--muted); font-size: 10px; letter-spacing: .08em; }
.ecosystem-frame .caption { position: relative; z-index: 1; padding-top: 14px; border-top: 1px solid var(--line); }
.repair-visual { margin: 72px 0 0; padding: 34px; border: 1px solid var(--line); background: radial-gradient(circle at 80% 70%, rgba(8,121,217,.18), transparent 25%), #101010; }
.repair-steps { display: grid; grid-template-columns: repeat(6, 1fr); border-top: 1px solid var(--line); }
.repair-steps article { position: relative; min-height: 154px; padding: 18px 14px; border-right: 1px solid var(--line); }
.repair-steps article:last-child { border-right: 0; }
.repair-steps article::before { content: ""; position: absolute; width: 7px; height: 7px; top: -4px; left: 14px; border-radius: 50%; background: var(--accent); }
.repair-steps span { color: var(--muted); font: italic 17px var(--serif); }
.repair-steps strong { display: block; margin-top: 30px; font-size: 15px; font-weight: 400; }
.repair-steps p { margin: 6px 0 0; color: var(--muted); font-size: 10px; }
.repair-focus { display: grid; gap: 44px; padding: 56px 5%; background: radial-gradient(circle at 90% 22%, rgba(8,121,217,.12), transparent 30%), linear-gradient(135deg, rgba(255,255,255,.035), transparent 55%); }
.repair-focus-copy { display: grid; grid-template-columns: 1fr minmax(360px, 2fr); column-gap: 40px; align-items: end; }
.repair-focus-copy small { color: var(--accent); letter-spacing: .12em; text-transform: uppercase; }
.repair-focus-copy strong { grid-column: 2; display: block; margin: 0; font-size: clamp(28px, 3.2vw, 46px); font-weight: 400; line-height: 1.15; letter-spacing: -.03em; }
.repair-focus-copy p { grid-column: 2; margin: 12px 0 0; max-width: 480px; color: var(--muted); }
.repair-mapping { display: grid; grid-template-columns: minmax(0, 1fr) 108px minmax(0, 1fr); gap: 22px; align-items: center; }
.repair-map-user, .repair-map-system { min-height: 336px; padding: 24px; border: 1px solid rgba(242,239,231,.2); }
.repair-map-user { color: #132131; background: #f3f7fa; }
.repair-map-system { background: rgba(9,14,19,.8); }
.repair-map-user header, .repair-map-system header { display: flex; align-items: baseline; justify-content: space-between; padding-bottom: 18px; border-bottom: 1px solid currentColor; }
.repair-map-user header span, .repair-map-system header span { font-size: 9px; letter-spacing: .1em; text-transform: uppercase; opacity: .6; }
.repair-map-user header strong, .repair-map-system header strong { font-size: 15px; font-weight: 500; }
.repair-map-device { margin: 16px 0; padding: 13px 14px; border-radius: 8px; background: white; box-shadow: 0 8px 20px rgba(8,34,55,.08); }
.repair-map-device b, .repair-map-device small { display: block; }
.repair-map-device small { margin-top: 4px; color: #667482; font-size: 10px; }
.repair-map-user dl, .repair-map-system dl { margin: 0; }
.repair-map-user dl > div { padding: 10px 0; border-top: 1px solid rgba(19,33,49,.14); }
.repair-map-system dl > div { display: grid; grid-template-columns: 100px 1fr; gap: 12px; padding: 13px 0; border-top: 1px solid var(--line); }
.repair-map-user dt, .repair-map-system dt { font-size: 11px; }
.repair-map-user dd, .repair-map-system dd { margin: 6px 0 0; }
.repair-map-user i { display: inline-block; margin: 0 6px 4px 0; padding: 3px 8px; border-radius: 12px; color: #667482; background: #e5ecf2; font-size: 9px; font-style: normal; }
.repair-map-user i.is-selected { color: #075eaa; background: #cfe7fb; }
.repair-map-system dt { color: var(--muted); font-family: var(--serif); font-size: 12px; font-style: italic; }
.repair-map-system dd { margin: 0; color: #d9e4ec; font-size: 10px; line-height: 1.4; }
.repair-map-system footer { display: flex; justify-content: space-between; align-items: center; margin-top: 12px; padding-top: 14px; border-top: 1px solid var(--line); color: var(--accent); font-size: 10px; }
.repair-map-system footer b { color: var(--ink); font-weight: 400; }
.repair-map-transfer { display: grid; justify-items: center; gap: 10px; color: var(--muted); font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.repair-map-transfer b { display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid var(--accent); border-radius: 50%; color: var(--accent); font: 25px var(--serif); }
.repair-visual > .caption { padding-top: 14px; border-top: 1px solid var(--line); }
.status-system { margin-top: 64px; padding: 34px; border: 1px solid var(--line); background: radial-gradient(circle at 90% 15%, rgba(94,234,212,.1), transparent 28%), #101010; }
.status-system-head { display: flex; justify-content: space-between; align-items: end; padding-bottom: 42px; }
.status-system-head h3 { max-width: 540px; margin: 0; text-align: right; }
.status-example { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 20px; align-items: center; min-height: 86px; padding: 0 18px; border-top: 1px solid var(--line); }
.status-example strong { font-weight: 400; }
.status-example strong small { display: block; margin-top: 6px; color: var(--muted); font-size: 9px; font-weight: 400; letter-spacing: .04em; }
.status-example span { color: var(--muted); }
.status-example-head { min-height: 52px; color: var(--muted); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.status-example.status-muted { opacity: .5; }
.status-example .status-yes { width: fit-content; padding: 5px 14px; border-radius: 18px; color: #0a0a0a; background: var(--accent); font-size: 10px; }
.status-system-note { display: grid; grid-template-columns: 1fr 3fr; gap: 20px; margin-top: 26px; padding: 26px 18px; background: var(--accent); color: #0a0a0a; }
.status-system-note span { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.status-system-note p { margin: 0; font-size: 20px; }
.status-detail-evidence { display: grid; grid-template-columns: .78fr 1.22fr; gap: clamp(48px, 7vw, 110px); align-items: center; margin: 72px 0 0; padding: 52px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.status-detail-copy h3 { max-width: 560px; margin: 16px 0 22px; font-size: clamp(32px, 4vw, 56px); font-weight: 400; line-height: 1.18; letter-spacing: -.045em; }
.status-detail-copy > p:not(.eyebrow) { max-width: 540px; margin: 0; color: var(--muted); font-size: 15px; line-height: 1.72; }
.status-detail-points { margin: 34px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.status-detail-points li { display: grid; grid-template-columns: 44px 1fr; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.status-detail-points span { color: var(--accent); font-size: 9px; letter-spacing: .1em; }
.status-detail-visual { display: grid; place-items: center; min-height: 800px; overflow: hidden; background: radial-gradient(circle at 50% 34%, rgba(0, 97, 222, .24), transparent 36%), linear-gradient(155deg, rgba(255,255,255,.045), transparent 62%); }
.status-detail-device { position: relative; display: block; width: min(58%, 360px); height: 760px; overflow: hidden; padding: 8px; border: 1px solid rgba(255,255,255,.18); border-radius: 26px; background: #e7edf3; box-shadow: 0 30px 78px rgba(0,0,0,.42); }
.status-detail-device::after { content: ""; position: absolute; inset: auto 0 0; height: 120px; background: linear-gradient(to bottom, transparent, rgba(3,10,18,.88)); pointer-events: none; }
.status-detail-device img { display: block; width: 100%; height: auto; border-radius: 18px; }
.status-detail-device span { position: absolute; z-index: 1; right: 24px; bottom: 22px; color: #fff; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.decision-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 58px; background: var(--line); }
.decision-grid article { min-height: 270px; padding: 28px; background: var(--paper); }
.decision-grid span { color: var(--accent); font: italic 24px var(--serif); }
.decision-grid p { color: var(--muted); }
.mapping-table { width: 100%; margin-top: 50px; border-collapse: collapse; font-size: 13px; }
.mapping-table th, .mapping-table td { padding: 16px 12px; border-top: 1px solid var(--line); text-align: left; }
.mapping-table th { color: var(--muted); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.mapping-table td:first-child { color: var(--muted); }
.closure-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin-top: 60px; }
.closure-grid article { padding: 34px; min-height: 310px; background: var(--panel); }
.closure-grid p, .closure-grid li { color: var(--muted); }
.closure-evidence { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: start; justify-items: center; gap: clamp(22px, 4vw, 68px); margin-top: 60px; }
.closure-evidence.is-secondary { grid-template-columns:repeat(3,minmax(0,300px)); justify-content:center; }
.closure-screen { width: min(100%, 300px); margin: 0; }
.closure-screen img { display: block; width: 100%; height: auto; border-radius: 14px; }
.closure-ai-proof { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(54px,7vw,110px); margin-top:88px; padding:46px 0; border-top:1px solid var(--accent); border-bottom:1px solid var(--line); }
.closure-ai-copy h3 { max-width:620px; margin:16px 0 20px; font-size:clamp(32px,4.2vw,58px); font-weight:400; line-height:1.18; letter-spacing:-.045em; }
.closure-ai-lead { max-width:620px; margin:0 0 30px; color:var(--muted); font-size:16px; line-height:1.7; }
.closure-ai-trace { margin:0; padding:0; list-style:none; border-top:1px solid var(--line); }
.closure-ai-trace li { display:grid; grid-template-columns:132px 1fr; gap:18px; padding:15px 0; border-bottom:1px solid var(--line); }
.closure-ai-trace span { color:var(--accent); font-size:9px; letter-spacing:.1em; text-transform:uppercase; }
.closure-ai-trace p { margin:0; color:var(--muted); font-size:12px; line-height:1.62; }
.closure-ai-conclusion { margin:26px 0 0; font-size:17px; line-height:1.55; }
.closure-ai-conclusion span { display:block; margin-bottom:8px; color:var(--accent); font-size:9px; letter-spacing:.12em; text-transform:uppercase; }
.closure-ai-visual { position:relative; min-height:760px; background:radial-gradient(circle at 62% 34%,rgba(31,82,173,.25),transparent 36%),linear-gradient(155deg,rgba(255,255,255,.04),transparent 62%); overflow:hidden; }
.closure-ai-phone { position:absolute; width:46%; margin:0; padding:8px; border:1px solid rgba(255,255,255,.18); border-radius:24px; background:#e7edf3; box-shadow:0 28px 70px rgba(0,0,0,.38); }
.closure-ai-phone img { display:block; width:100%; border-radius:17px; }
.closure-ai-phone figcaption { position:absolute; left:10px; bottom:-30px; color:var(--muted); font-size:9px; letter-spacing:.1em; text-transform:uppercase; }
.closure-ai-phone.is-verify { z-index:2; left:7%; top:7%; width:46%; transform:rotate(-3deg); }
.closure-ai-phone.is-confirm { z-index:1; right:7%; top:37%; width:44%; transform:rotate(3deg); }
.closure-note { display: grid; grid-template-columns: 1fr 3fr; gap: 28px; margin-top: 34px; padding-top: 28px; border-top: 1px solid var(--line); }
.closure-note .eyebrow { margin: 0; }
.closure-note p:last-child { margin: 0; color: var(--muted); max-width: 780px; }
.closure-signature-screen { overflow: hidden; border-radius: 14px; color: #121820; background: #f4f8fb; aspect-ratio: 375 / 812; }
.closure-signature-app { height: 100%; display: flex; flex-direction: column; }
.closure-signature-app header { height: 11.4%; padding: 0 7%; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; color: white; background: #0161de; }
.closure-signature-app header span { font-size: 28px; font-weight: 300; }
.closure-signature-app header b { font-size: 14px; font-weight: 400; }
.closure-signature-app header i { justify-self: end; padding: 5px 7px; border-radius: 12px; background: rgba(0,0,0,.16); font-size: 8px; font-style: normal; letter-spacing: 1px; }
.closure-signature-order { padding: 5.5% 7%; background: white; }
.closure-signature-order small, .closure-signature-order strong, .closure-signature-order em { display: block; }
.closure-signature-order small { color: #718096; font-size: 8px; }
.closure-signature-order strong { margin-top: 3px; font-size: 15px; letter-spacing: .02em; }
.closure-signature-order em { margin-top: 5px; color: #1374c3; font-size: 8px; font-style: normal; }
.closure-signature-document { flex: 1; margin: 5% 6%; padding: 6%; border: 1px solid #d5dde5; background: white; }
.closure-signature-document span { display: block; margin-bottom: 12%; color: #0161de; font-size: 11px; font-weight: 700; }
.closure-signature-document i { display: block; height: 5%; margin-top: 5%; background: repeating-linear-gradient(90deg, #d7dfe7 0 23%, transparent 23% 27%); }
.closure-signature-pad { padding: 0 7% 5%; text-align: center; }
.closure-signature-pad small { color: #637083; font-size: 8px; }
.closure-signature-pad > div { position: relative; height: 34px; margin-top: 4%; border-bottom: 1px solid #acb8c5; }
.closure-signature-pad i { position: absolute; display: block; width: 24%; height: 22%; border-bottom: 2px solid #1677d2; border-radius: 50%; transform: rotate(-17deg); }
.closure-signature-pad i:nth-child(1) { left: 24%; top: 35%; }
.closure-signature-pad i:nth-child(2) { left: 39%; top: 21%; transform: rotate(14deg); }
.closure-signature-pad i:nth-child(3) { left: 53%; top: 43%; transform: rotate(-6deg); }
.closure-signature-app footer { display: grid; grid-template-columns: 1fr 1.7fr; gap: 5%; padding: 4% 7%; background: white; }
.closure-signature-app button { padding: 7px 4px; border: 0; border-radius: 999px; color: #18222d; background: #edf1f5; font-size: 9px; }
.closure-signature-app button:last-child { color: white; background: #0161de; }
.ai-workflow-panel { margin: 64px 0 0; padding: 34px; border: 1px solid var(--line); background: radial-gradient(circle at 30% 15%, rgba(31,82,173,.2), transparent 30%), #101010; }
.ai-track { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr auto 1fr auto 1fr auto 1fr; gap: 11px; align-items: stretch; }
.ai-track article { min-height: 190px; padding: 22px 18px; display: flex; flex-direction: column; border-top: 1px solid var(--line); }
.ai-track article.ai-assisted { border-color: var(--accent); background: linear-gradient(to bottom, rgba(94,234,212,.1), transparent); }
.ai-track article span { color: var(--muted); font: italic 17px var(--serif); }
.ai-track article.ai-assisted span { color: var(--accent); }
.ai-track article strong { margin-top: auto; font-size: 17px; font-weight: 400; }
.ai-track article p { margin: 7px 0 0; color: var(--muted); font-size: 10px; }
.ai-track > i { align-self: center; color: var(--accent); font-style: normal; }
.judgment-band { margin-top: 36px; padding: 26px; color: #0a0a0a; background: var(--accent); }
.judgment-band small { letter-spacing: .1em; text-transform: uppercase; }
.judgment-band div { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; margin-top: 25px; }
.judgment-band span { padding-top: 12px; border-top: 1px solid rgba(0,0,0,.28); }
.ai-workflow-panel > .caption { padding-top: 14px; border-top: 1px solid var(--line); }

/* LYNK & CO case */
.lynk-case { --accent: #ff3d7f; --lynk-cyan: #31e6cf; }
.lynk-hero { width: 100%; height: 100svh; min-height: 680px; padding: 72px 0 0; color: #fff5ec; background: #080809; }
.lynk-hero-poster { position: relative; height: 100%; min-height: 0; overflow: hidden; padding: 28px clamp(32px,5vw,76px) 20px; display: grid; grid-template-rows: auto minmax(0,1fr) auto; gap: 14px; background: url("./assets/lynk/lynk-hero-white-sports-car.jpg") center center / cover no-repeat; isolation: isolate; }
.lynk-hero-poster::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.03) 62%,rgba(0,0,0,.12) 100%); pointer-events: none; }
.lynk-poster-meta { display: flex; justify-content: space-between; gap: 24px; color: rgba(255,245,236,.7); font-size: 12px; line-height: 1.35; letter-spacing: .08em; text-transform: uppercase; }
.lynk-poster-meta p { margin: 0; }
.lynk-poster-meta p:last-child { text-align: right; }
.lynk-hero-intro { position: relative; z-index: 3; display: grid; grid-template-columns: 1fr; align-items: start; }
.lynk-hero-copy { align-self: start; }
.lynk-hero-copy h1 { max-width: 760px; margin: 0; color: #fff5ec; font-size: clamp(38px,4.3vw,64px); line-height: 1.08; letter-spacing: -.045em; }
.lynk-hero-copy h1 span { display: block; color: inherit; font-family: inherit; font-style: normal; }
.lynk-hero-facts { position: relative; z-index: 4; display: grid; grid-template-columns: .8fr .8fr 1.4fr; gap: 22px; }
.lynk-hero-facts div { padding-top: 10px; border-top: 1px solid rgba(255,245,236,.42); }
.lynk-hero-facts small { display: block; margin-bottom: 3px; color: rgba(255,245,236,.65); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; }
.lynk-hero-facts b { color: #fff5ec; font-size: 14px; font-weight: 400; }
.lynk-story-proof { display:grid; grid-template-columns:minmax(0,1fr) minmax(420px,1.12fr); gap:clamp(30px,5vw,76px); align-items:center; }
.lynk-story-proof .case-story-grid { grid-template-columns:repeat(2,minmax(0,1fr)); border-top:1px solid var(--line); }
.lynk-story-proof .case-story-grid article,.lynk-story-proof .case-story-grid article:nth-child(n) { grid-column:span 1; min-height:190px; padding:24px 22px 26px 0; border-right:1px solid var(--line); }
.lynk-story-proof .case-story-grid article:nth-child(even) { padding-left:22px; padding-right:0; border-right:0; }
.lynk-story-visual { margin:0; padding:0; border:0; background:none; border-radius:0; }
.lynk-story-visual img { display:block; width:104%; max-width:none; height:auto; margin-left:-2%; filter:drop-shadow(0 20px 28px rgba(0,0,0,.34)); }
.lynk-story-visual figcaption { margin-top:14px; color:rgba(255,245,236,.62); font-size:12px; line-height:1.5; letter-spacing:.04em; }
.lynk-input-work { grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:54px; border-bottom:1px solid var(--line); }
.lynk-input-work article,.lynk-input-work article:nth-child(n) { grid-column:span 1; min-height:210px; padding:26px 28px 30px 0; border-left:0; border-right:1px solid var(--line); border-bottom:0; }
.lynk-input-work article:nth-child(2) { padding-left:28px; padding-right:0; border-right:0; }
.lynk-input-work strong { max-width:520px; }
.lynk-feedback-loop { margin:54px 0 0; padding:30px 34px; border:1px solid rgba(255,61,127,.24); border-radius:18px; background:linear-gradient(145deg,rgba(255,61,127,.07),rgba(255,255,255,.015)); }
.lynk-feedback-loop > header { display:grid; grid-template-columns:.62fr 1.38fr; gap:24px; align-items:end; padding-bottom:26px; border-bottom:1px solid var(--line); }
.lynk-feedback-loop > header span,.lynk-feedback-loop article > span { color:var(--accent); font-size:10px; letter-spacing:.12em; }
.lynk-feedback-loop > header h3 { margin:0; font-size:clamp(23px,2.7vw,38px); font-weight:400; line-height:1.3; }
.lynk-feedback-loop > div { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
.lynk-feedback-loop article { min-height:170px; padding:22px 20px 4px; border-right:1px solid var(--line); }
.lynk-feedback-loop article:first-child { padding-left:0; }
.lynk-feedback-loop article:last-child { padding-right:0; border-right:0; }
.lynk-feedback-loop article strong { display:block; margin-top:24px; font-size:clamp(17px,1.55vw,22px); font-weight:400; line-height:1.4; }
.lynk-feedback-loop article p { margin:14px 0 0; color:var(--muted); font-size:12px; line-height:1.7; }
.lynk-legacy-placeholder { display:grid; grid-template-columns:minmax(220px,.72fr) minmax(0,1.28fr); gap:clamp(26px,5vw,72px); align-items:center; overflow:hidden; }
.lynk-legacy-placeholder > div { position:relative; z-index:1; }
.lynk-legacy-image { display:block; width:100%; max-height:430px; object-fit:contain; object-position:center; filter:drop-shadow(0 20px 28px rgba(0,0,0,.3)); }
.lynk-problem-grid { display: grid; grid-template-columns: repeat(4,1fr); margin-top: 72px; border-top: 1px solid var(--line); }
.lynk-problem-grid article { min-height: 260px; padding: 24px 18px; border-right: 1px solid var(--line); }
.lynk-problem-grid article:last-child { border-right: 0; }
.lynk-problem-grid span { color: var(--accent); font: italic 20px var(--serif); }
.lynk-problem-grid p { color: var(--muted); }
.lynk-problem-grid h3 { font-size: 21px; line-height: 1.35; }
.lynk-strategy { margin: 0; padding: 0; list-style: none; }
.lynk-strategy li { display: grid; grid-template-columns: .3fr 1.7fr; gap: 24px; min-height: 150px; padding: 26px 0; border-top: 1px solid var(--line); }
.lynk-strategy li:last-child { border-bottom: 1px solid var(--line); }
.lynk-strategy > li > span { color: var(--accent); font: italic 34px var(--serif); }
.lynk-strategy h3 { margin: 0; font-size: 34px; }
.lynk-strategy p { margin: 10px 0 0; color: var(--muted); }
.lynk-decision-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; margin-top:42px; padding:0; background:transparent; border-top:1px solid rgba(174,205,231,.18); border-bottom:1px solid rgba(174,205,231,.18); border-radius:0; }
.lynk-decision-grid article { position:relative; display:flex; flex-direction:column; min-height:260px; padding:26px 28px 28px; overflow:hidden; background:transparent; border:0; border-right:1px solid rgba(174,205,231,.15); border-radius:0; }
.lynk-decision-grid article:last-child { border-right:0; }
.lynk-decision-grid article::after { display:none; }
.lynk-decision-grid article.is-primary { background:transparent; box-shadow:none; }
.lynk-decision-grid span { position:relative; z-index:1; color:#ff4c93; font:400 10px/1.3 var(--sans); letter-spacing:.13em; }
.lynk-decision-mark { display:grid; width:30px; height:30px; margin-top:28px; place-items:center; border:1px solid rgba(177,215,240,.45); border-radius:50%; color:#b9defb; font:400 17px/1 var(--sans); font-style:normal; }
.lynk-decision-grid h3 { position:relative; z-index:1; margin:18px 0 12px; font-size:clamp(19px,1.65vw,25px); line-height:1.3; letter-spacing:-.03em; }
.lynk-decision-grid p { position:relative; z-index:1; margin:0; color:rgba(238,242,246,.62); font-size:13px; line-height:1.7; }
.lynk-decision-grid b { position:relative; z-index:1; margin-top:auto; padding-top:22px; color:#b9defb; font-size:10px; font-weight:400; letter-spacing:.1em; }
.lynk-decision-grid h3, .lynk-community-decisions h3 { line-height: 1.35; }
.lynk-community-decisions { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin-top: 58px; background: transparent; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.lynk-community-decisions article { min-width: 0; min-height: 0; padding: 26px 20px 30px 0; background: transparent; border-right: 1px solid var(--line); }
.lynk-community-decisions article + article { padding-left: 20px; }
.lynk-community-decisions article:last-child { border-right: 0; padding-right: 0; }
.lynk-community-decisions span { display: block; margin-bottom: 28px; color: #ff3d7f; font-family: inherit; font-size: 14px; font-style: normal; letter-spacing: 0; line-height: 1.2; white-space: nowrap; }
.lynk-community-decisions h3 { margin: 0; font-size: clamp(22px, 2.2vw, 32px); letter-spacing: -.025em; }
.lynk-community-decisions p { margin: 18px 0 0; color: var(--muted); font-size: 14px; line-height: 1.7; }
@media (max-width:720px) {
  .lynk-input-work { grid-template-columns:1fr; margin-top:38px; }
  .lynk-input-work article,.lynk-input-work article:nth-child(n) { min-height:0; padding:22px 0 26px; border-right:0; border-bottom:1px solid var(--line); }
  .lynk-input-work article:last-child { border-bottom:0; }
  .lynk-feedback-loop { margin-top:38px; padding:24px; }
  .lynk-feedback-loop > header { grid-template-columns:1fr; gap:12px; }
  .lynk-feedback-loop > div { grid-template-columns:1fr; }
  .lynk-feedback-loop article,.lynk-feedback-loop article:first-child,.lynk-feedback-loop article:last-child { min-height:0; padding:22px 0; border-right:0; border-bottom:1px solid var(--line); }
  .lynk-feedback-loop article:last-child { border-bottom:0; }
  .lynk-feedback-loop article strong { margin-top:18px; }
}

/* Desktop readability floor for labels and supporting metadata. */
@media (min-width:721px) {
  :where(
    .eyebrow,
    .section-index,
    .hero-kicker,
    .availability,
    .scroll-cue,
    .project-meta,
    .visual-note,
    .project-row > div > p,
    .capability-project,
    .capability small,
    .approach-flow span,
    .footer-line,
    .case-facts small,
    .case-snapshot-grid span,
    .case-story-grid article > span,
    figcaption
  ) { font-size: clamp(12px, 0.62vw + 10px, 13px) !important; }
}
.lynk-placeholder { display: grid; grid-template-columns: 1fr 1.3fr; gap: 40px; align-items: center; min-height: 300px; margin: 72px 0 0; padding: 44px; border: 1px dashed rgba(255,255,255,.2); border-radius: 18px; background: linear-gradient(135deg, rgba(255,255,255,.035), rgba(255,61,127,.035)); }
.lynk-placeholder span { color: var(--accent); font-size: 10px; letter-spacing: .13em; }
.lynk-placeholder strong { display: block; margin-top: 18px; font-size: clamp(28px, 3.2vw, 46px); font-weight: 400; }
.lynk-placeholder p { max-width: 510px; color: var(--muted); }
.lynk-placeholder-screens { display: flex; justify-content: center; gap: 16px; opacity: .26; filter: blur(1px); }
.lynk-placeholder-screens i { width: 25%; min-height: 210px; border: 1px solid rgba(255,255,255,.24); border-radius: 18px; background: linear-gradient(#202427 18%, #111 18% 36%, #202427 36% 62%, #111 62%); }
.lynk-control-feature { display:grid; grid-template-columns:1fr; gap:clamp(36px,5vw,64px); min-height:0; padding:clamp(38px,5vw,72px); overflow:hidden; background:radial-gradient(ellipse 45% 44% at 50% 44%,rgba(35,50,72,.54),transparent 68%),linear-gradient(120deg,rgba(21,31,39,.96),rgba(21,25,34,.94) 58%,rgba(57,25,43,.82)); border-top:1px solid rgba(255,245,236,.2); border-bottom:1px solid rgba(255,245,236,.2); }
.lynk-control-feature-copy { max-width:640px; }
.lynk-control-feature-copy > span { display:block; margin-bottom:26px; color:#ff4c93; font-size:12px; letter-spacing:.1em; text-transform:uppercase; }
.lynk-control-feature-copy h3 { margin:0 0 20px; font-size:clamp(28px,3.2vw,48px); line-height:1.12; letter-spacing:-.04em; }
.lynk-control-feature-copy p { margin:0; color:var(--muted); font-size:16px; line-height:1.75; }
.lynk-control-feature img { display:block; width:auto; height:min(680px,58vw); max-width:100%; object-fit:contain; justify-self:center; filter:drop-shadow(0 28px 34px rgba(0,0,0,.4)); }
.lynk-control-stage { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-areas:"status home charging" "drive home environment"; gap:clamp(22px,3.6vw,54px) clamp(18px,3vw,46px); align-items:center; max-width:980px; width:100%; margin:0 auto; padding:0; }
.lynk-control-stage > * { min-width:0; }
.lynk-control-shot,.lynk-control-screen { margin:0; text-align:center; }
.lynk-control-shot.is-status { grid-area:status; justify-self:end; width:min(100%,210px); }
.lynk-control-screen { grid-area:home; position:relative; z-index:2; width:min(100%,270px); justify-self:center; }
.lynk-control-shot.is-charging { grid-area:charging; justify-self:start; width:min(100%,210px); }
.lynk-control-shot.is-drive-log { grid-area:drive; width:min(100%,210px); justify-self:end; }
.lynk-control-shot.is-environment { grid-area:environment; width:min(100%,210px); justify-self:start; }
.lynk-control-stage img { display:block; width:100%; height:auto; border-radius:20px; filter:drop-shadow(0 24px 32px rgba(0,0,0,.4)); }
.lynk-control-shot img { background:#111; }
.lynk-control-shot.is-drive-log img,.lynk-control-shot.is-environment img { background:#111; }
.lynk-control-stage figcaption { display:flex; justify-content:center; gap:8px; margin-top:12px; color:rgba(255,255,255,.48); font-size:10px; letter-spacing:.06em; }
.lynk-control-stage figcaption b { color:#ff4c93; font-size:inherit; font-weight:400; letter-spacing:.1em; }
.lynk-control-symbol b { inset: 34%; }.lynk-control-symbol span { inset: 47%; background: var(--lynk-cyan); }
.lynk-device-pair { display: grid; grid-template-columns: .85fr .85fr 1.3fr; gap: 34px; align-items: end; margin-top: 50px; padding: 58px; border-radius: 22px; background: radial-gradient(circle at 86% 10%, rgba(126,64,255,.22), transparent 20%), linear-gradient(135deg, #101719, #050606 58%); }
.lynk-device-heading { grid-column: 1 / -1; margin-bottom: 22px; }
.lynk-device-heading h3 { margin: 0 0 14px; font-size: clamp(26px, 3vw, 42px); }
.lynk-device-heading p { max-width: 820px; margin: 0; color: var(--muted); }
.lynk-device-pair figure, .lynk-community-grid figure, .lynk-personal-grid figure, .lynk-commerce-layout figure { margin: 0; }
.lynk-device-pair img { width: 100%; max-height: 520px; object-fit: contain; }
.lynk-device-pair figcaption, .lynk-commerce-layout figcaption, .lynk-community-grid figcaption, .lynk-personal-grid figcaption { padding-top: 10px; color: var(--muted); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.lynk-device-copy h3 { font-size: clamp(28px,3.2vw,46px); }
.lynk-commerce-layout { position: relative; display: grid; grid-template-columns: .7fr 1.3fr; gap: 24px; margin-top: 70px; padding-top: 76px; }
.lynk-replace-note { position: absolute; inset: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 52px; padding: 12px 18px; border-radius: 12px; color: var(--muted); background: rgba(255,61,127,.1); }
.lynk-replace-note span { color: var(--accent); font-size: 9px; letter-spacing: .12em; }
.lynk-replace-note strong { font-size: 13px; font-weight: 400; }
.lynk-assets-pending figure { opacity: .48; filter: grayscale(.35); }
.lynk-long-screen { background: transparent; }
.lynk-long-screen img { display: block; width: 100%; max-height: 1280px; object-fit: cover; object-position: top; border-radius: 16px; }
.lynk-commerce-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-content: start; }
.lynk-commerce-grid figure { background: transparent; }
.lynk-commerce-grid img { display: block; width: 100%; aspect-ratio: .72; object-fit: cover; object-position: top; border-radius: 16px; }
.lynk-community-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 70px; align-items: start; }
.lynk-community-grid figure { width: min(240px, 100%); min-width: 0; justify-self: center; background: transparent; }
.lynk-community-grid img { display: block; width: 100%; height: auto; object-fit: contain; object-position: top; border-radius: 14px; margin: 0; }
.lynk-community-grid figcaption { width: 100%; min-height: 34px; line-height: 1.45; }
.lynk-badge-system { margin: 90px 0 0; padding: 46px; border-radius: 22px; background: #18191b; }
.lynk-badge-head { display: grid; grid-template-columns: 1.25fr 1fr; gap: 50px; align-items: end; padding-bottom: 34px; border-bottom: 1px solid rgba(255,255,255,.1); }
.lynk-badge-head span { color: #c69372; font-size: 10px; letter-spacing: .14em; }
.lynk-badge-head h3 { max-width: 680px; margin: 12px 0 0; font-size: clamp(28px, 3.4vw, 48px); line-height: 1.18; }
.lynk-badge-head p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.7; }
.lynk-badge-art { display: block; width: 100%; height: auto; margin-top: 34px; border-radius: 14px; }
.lynk-system-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1px; background: var(--line); }
.lynk-system-grid article { min-height: 360px; padding: 28px; background: var(--paper); }
.lynk-system-grid > article > span { color: var(--accent); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.lynk-system-grid p { color: var(--muted); }
.lynk-swatches { display: flex; gap: 8px; margin-top: 70px; }
.lynk-swatches i { width: 42px; height: 78px; background: #fff; }
.lynk-swatches i:nth-child(2) { background: #252525; }.lynk-swatches i:nth-child(3) { background: #ff3d7f; }.lynk-swatches i:nth-child(4) { background: #7e40ff; }.lynk-swatches i:nth-child(5) { background: #31e6cf; }
.lynk-icon-row { display: flex; gap: 12px; margin-top: 64px; }
.lynk-icon-row i { width: 54px; height: 54px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--lynk-cyan); font-size: 24px; font-style: normal; }
.lynk-component-demo { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 42px; }
.lynk-component-demo > div { min-height: 104px; padding: 12px; border: 1px solid rgba(255,255,255,.12); border-radius: 10px; background: rgba(255,255,255,.025); }
.lynk-component-demo small { display: block; margin-bottom: 14px; color: var(--muted); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.lynk-component-demo i, .lynk-component-demo b, .lynk-component-demo span, .lynk-component-demo em, .lynk-component-demo u { display: block; height: 20px; border: 1px solid rgba(255,255,255,.16); border-radius: 5px; text-decoration: none; }
.lynk-component-demo i + i { margin-top: 7px; }
.lynk-component-demo i:first-of-type { border-color: rgba(255,61,127,.7); background: rgba(255,61,127,.16); }
.lynk-component-demo b { width: 72%; background: rgba(255,255,255,.08); }
.lynk-component-demo span { width: 44%; margin-top: 9px; border-radius: 999px; background: var(--accent); }
.lynk-component-demo em { width: 100%; border-radius: 999px; background: linear-gradient(90deg, rgba(255,61,127,.8) 0 24%, rgba(255,255,255,.1) 24% 48%, rgba(255,255,255,.1) 48%); }
.lynk-component-demo u { width: 34%; border-radius: 3px; background: rgba(255,255,255,.12); box-shadow: 40px 0 0 rgba(255,255,255,.08), 80px 0 0 rgba(255,255,255,.06); }
.lynk-personal-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: 34px; align-items: center; margin-top: 60px; padding: 40px 0; }
.lynk-personal-grid figure { max-width: 360px; justify-self: center; }
.lynk-personal-grid img { display: block; width: 100%; max-height: 720px; object-fit: cover; object-position: top; border-radius: 18px; }
.lynk-delivery-copy h3 { font-size: 30px; }
.lynk-delivery-copy > p:last-child { max-width: 620px; color: var(--muted); }
.concept-label { display: inline-flex; align-items: center; gap: 18px; margin-bottom: 32px; }
.concept-label strong { padding: 8px 16px; color: #080808; background: var(--accent); font-size: 11px; letter-spacing: .12em; }
.concept-label span { color: var(--muted); }
.lynk-concept-visual { display: grid; grid-template-columns: .75fr 1fr 1fr; gap: 34px; align-items: start; margin: 0 0 60px; padding: 56px; border-radius: 22px; background: radial-gradient(circle at 8% 78%, rgba(126,64,255,.18), transparent 14%), #0b0b0b; }
.lynk-concept-copy { align-self: center; }
.lynk-concept-copy span { font-size: clamp(26px, 3vw, 42px); }
.lynk-concept-copy p { color: var(--muted); line-height: 1.8; }
.lynk-concept-visual img { display: block; width: 100%; max-width: 516px; border-radius: 12px; object-fit: contain; object-position: top; image-rendering: auto; }
.lynk-concept-note p { font-size: 13px; line-height: 1.75; }

/* Volvo case */
.volvo-case { --accent: #9bc7e5; --volvo-navy: #102b3c; }
.volvo-hero { height: 100svh; min-height: 700px; padding: 116px 0 28px; display: grid; grid-template-rows: auto minmax(0,1fr) auto; gap: 25px; }
.volvo-hero-main { min-height: 0; display: grid; grid-template-columns: 1fr .88fr; gap: 54px; }
.volvo-hero-copy { align-self: center; }
.volvo-hero-copy h1 { margin: 0; font-size: clamp(58px,7.5vw,108px); line-height: .92; letter-spacing: -.06em; }
.volvo-hero-copy h1 span { display: block; color: var(--accent); font-family: inherit; font-style: italic; font-weight: inherit; }
.volvo-hero-copy p { max-width: 680px; margin: 34px 0 0; font-size: clamp(17px,1.8vw,25px); line-height: 1.45; }
.volvo-workline-nav { display:grid; gap:8px; max-width:660px; margin-top:28px; }
.volvo-workline-nav a { display:grid; grid-template-columns:92px 1fr auto; gap:14px; align-items:center; padding:13px 15px; border:1px solid rgba(155,199,229,.16); border-radius:10px; color:var(--ink); background:rgba(155,199,229,.025); transition:border-color .2s ease,background .2s ease,transform .2s ease; }
.volvo-workline-nav a:hover { border-color:rgba(155,199,229,.5); transform:translateX(4px); }
.volvo-workline-nav a:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.volvo-workline-nav a.is-primary { border-color:rgba(155,199,229,.52); background:rgba(155,199,229,.1); }
.volvo-workline-nav span { color:var(--accent); font-size:8px; letter-spacing:.12em; }
.volvo-workline-nav strong { font-size:14px; font-weight:400; }
.volvo-workline-nav small { display:none; color:var(--muted); font-size:10px; }
.volvo-workline-nav b { color:var(--muted); font-size:9px; font-weight:400; }
.volvo-hero-map { position: relative; display: grid; align-content: center; min-height: 0; padding: 0; background: none; perspective: 1200px; }
.volvo-hero-map-head { display: flex; justify-content: space-between; gap: 22px; padding: 0 0 20px; border-bottom: 1px solid rgba(155,199,229,.2); }
.volvo-hero-map-head span { color: var(--accent); font-size: 9px; letter-spacing: .13em; text-transform: uppercase; }
.volvo-hero-map-head p { max-width: 260px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.45; text-align: right; }
.volvo-hero-device-pair { position: relative; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: clamp(6px,1.2vw,18px); align-items: center; width: min(100%,460px); margin:0 auto; padding: 10px 2% 0; transform-style: preserve-3d; }
.volvo-hero-device { display: grid; justify-items: center; margin: 0; transform-style: preserve-3d; }
.volvo-hero-device-app { position: relative; z-index: 2; transform: translate(16px,16px) rotateY(-13deg) rotateZ(-4deg); }
.volvo-hero-device-wecom { position: relative; z-index: 1; opacity:.55; transform: translate(-28px,-12px) rotateY(16deg) rotateZ(5deg) scale(.82); }
.volvo-hero-device figcaption { margin-top:14px; color:var(--accent); font-size:8px; letter-spacing:.12em; }
.volvo-hero-device-wecom figcaption { color:var(--muted); }
.volvo-phone-shell { position: relative; width: min(100%,210px); padding: 8px; overflow: hidden; border: 1px solid rgba(214,235,248,.56); border-radius: 31px; background: linear-gradient(145deg,#24343f,#05080b); box-shadow: 0 30px 50px rgba(0,0,0,.46), inset 0 0 0 1px rgba(255,255,255,.11); }
.volvo-phone-shell::before { content: ""; position: absolute; z-index: 1; top: 11px; left: 50%; width: 34%; height: 5px; border-radius: 99px; background: rgba(9,14,18,.84); transform: translateX(-50%); }
.volvo-phone-shell img { display: block; width: 100%; height: 400px; border-radius: 23px; object-fit: cover; object-position: top; }
.volvo-hero-track { display: grid; grid-template-columns: 112px 1fr auto; gap: 18px; align-items: center; padding: 25px 0; border-bottom: 1px solid rgba(155,199,229,.16); }
.volvo-hero-track:last-child { border-bottom: 0; padding-bottom: 0; }
.volvo-hero-track > span { color: var(--muted); font-size: 9px; letter-spacing: .1em; }
.volvo-hero-track h2 { margin: 0; color: var(--ink); font-size: clamp(25px,3vw,38px); font-weight: 400; letter-spacing: -.035em; }
.volvo-hero-track p { margin: 7px 0 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.volvo-hero-track b { padding: 7px 10px; border: 1px solid rgba(155,199,229,.3); border-radius: 99px; color: var(--accent); font-size: 9px; font-weight: 400; white-space: nowrap; }
.volvo-hero-facts { display: grid; grid-template-columns: 1.25fr .75fr 1fr; gap: 22px; }
.volvo-hero-facts div { padding-top: 11px; border-top: 1px solid var(--line); }
.volvo-hero-facts small { display: block; color: var(--muted); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.volvo-hero-facts b { font-size: 13px; font-weight: 400; }
.volvo-track-grid { display: grid; grid-template-columns: 1.32fr .68fr; gap: 24px; align-items:stretch; }
.volvo-track { position: relative; min-height: 540px; padding: 42px; overflow: hidden; border-radius: 20px; }
.volvo-track::after { content: ""; position: absolute; width: 240px; height: 240px; right: -90px; bottom: -100px; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; }
.volvo-track-app { color: #071016; background: var(--accent); }.volvo-track-wecom { min-height:420px; align-self:end; background: linear-gradient(145deg,#142734,#0a0f13); }
.volvo-track > span { font-size: 9px; letter-spacing: .12em; }
.volvo-track h3 { margin: 34px 0 24px; font-size: clamp(38px,5vw,68px); line-height: .95; }
.volvo-track p { max-width: 580px; line-height: 1.65; }.volvo-track-wecom p,.volvo-track-wecom li { color: var(--muted); }
.volvo-track ul { margin: 40px 0 0; padding: 0; list-style: none; }.volvo-track li { padding: 10px 0; border-top: 1px solid currentColor; }
.volvo-track > strong { position: absolute; left: 42px; bottom: 38px; font-size: 13px; }
.volvo-track-wecom h3 { font-size:clamp(32px,3.8vw,52px); }
.volvo-placeholder { display: grid; grid-template-columns: 1fr 1.2fr; gap: 40px; align-items: center; min-height: 330px; margin: 70px 0 0; padding: 42px; border: 1px dashed rgba(155,199,229,.3); border-radius: 18px; background: rgba(155,199,229,.025); }
.volvo-placeholder > div > span { color: var(--accent); font-size: 9px; letter-spacing: .12em; }.volvo-placeholder strong { display: block; margin-top: 18px; font-size: clamp(28px,3vw,42px); font-weight: 400; }.volvo-placeholder p { color: var(--muted); }
.volvo-placeholder-lines { display: grid; gap: 14px; opacity: .35; }.volvo-placeholder-lines i { height: 42px; border-radius: 8px; background: linear-gradient(90deg,rgba(155,199,229,.32),rgba(255,255,255,.03)); }.volvo-placeholder-lines i:nth-child(2){width:82%}.volvo-placeholder-lines i:nth-child(3){width:63%}.volvo-placeholder-lines i:nth-child(4){width:90%}
.volvo-media-panel { margin: 70px 0 0; }
.volvo-media-panel img { display: block; width: 100%; border-radius: 16px; }
.volvo-media-panel figcaption { display: grid; grid-template-columns: .7fr 1.3fr; gap: 30px; padding: 20px 4px 0; }
.volvo-media-panel figcaption span, .volvo-service-gallery > figcaption span, .volvo-guideline-panel > figcaption span { color: var(--accent); font-size: 9px; letter-spacing: .12em; }
.volvo-media-panel figcaption p { margin: 0; color: var(--muted); line-height: 1.65; }
.volvo-ia-diagram { margin: 70px 0 0; padding: 38px; border: 1px solid rgba(155,199,229,.28); border-radius: 20px; background: radial-gradient(circle at 80% 15%,rgba(155,199,229,.12),transparent 30%),#0d1419; }
.volvo-ia-diagram > figcaption { display: grid; grid-template-columns: .7fr 1.3fr; gap: 30px; align-items: end; padding-bottom: 28px; border-bottom: 1px solid var(--line); }
.volvo-ia-diagram > figcaption span { color: var(--accent); font-size: 9px; letter-spacing: .12em; }
.volvo-ia-diagram > figcaption strong { font-size: clamp(22px,2.6vw,36px); font-weight: 400; line-height: 1.25; }
.volvo-ia-evidence { display:grid; grid-template-columns:minmax(0,1.42fr) minmax(210px,.58fr); gap:clamp(22px,3vw,42px); align-items:end; padding:34px 0; }
.volvo-ia-evidence figure { margin:0; }
.volvo-ia-source img { display:block; width:100%; height:auto; border-radius:14px; background:#e9e9e9; }
.volvo-ia-source figcaption { padding-top:12px; color:var(--muted); font-size:10px; letter-spacing:.08em; }
.volvo-ia-screens { display:grid; grid-template-columns:1fr 1fr; gap:14px; align-items:end; }
.volvo-ia-screens img { display:block; width:100%; height:auto; border-radius:14px; box-shadow:0 16px 30px rgba(0,0,0,.3); }
.volvo-ia-screens figcaption { display:flex; flex-direction:column; gap:4px; padding-top:10px; color:var(--muted); font-size:10px; }
.volvo-ia-screens figcaption b { color:var(--accent); font-size:11px; font-weight:400; }
.volvo-ia-board { display: grid; grid-template-columns: .8fr auto 1.2fr; gap: 24px; align-items: stretch; padding: 34px 0; }
.volvo-ia-board > i { align-self: center; color: var(--accent); font-size: 30px; font-style: normal; }
.volvo-ia-board > section { padding: 24px; border: 1px solid rgba(255,255,255,.1); border-radius: 15px; background: rgba(255,255,255,.025); }
.volvo-ia-title { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: baseline; }
.volvo-ia-title span { color: var(--accent); font-size: 11px; }
.volvo-ia-title h3 { margin: 0; font-size: 25px; font-weight: 400; }
.volvo-ia-title small { color: var(--muted); }
.volvo-ia-groups { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 22px; }
.volvo-ia-groups article { min-height: 104px; padding: 16px; border-radius: 10px; background: rgba(155,199,229,.08); }
.volvo-ia-groups article:first-child { grid-row: span 2; }
.volvo-ia-groups strong { font-size: 14px; font-weight: 400; }
.volvo-ia-groups p { margin: 12px 0 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.volvo-ia-car-groups { grid-template-columns: repeat(2,1fr); }
.volvo-ia-car-groups article:first-child { grid-row: auto; }
.volvo-service-ui { margin: 22px 0 0; padding: 30px 38px 0; border: 1px solid rgba(155,199,229,.2); border-radius: 20px; background: linear-gradient(145deg,rgba(155,199,229,.07),rgba(255,255,255,.015)); }
.volvo-service-ui > figcaption { display: grid; grid-template-columns: .7fr 1.3fr; gap: 20px 30px; align-items: end; padding-bottom: 26px; border-bottom: 1px solid var(--line); }
.volvo-service-ui > figcaption span, .volvo-service-ui-screens figcaption span { color: var(--accent); font-size: 9px; letter-spacing: .12em; }
.volvo-service-ui > figcaption strong { font-size: clamp(20px,2.2vw,30px); font-weight: 400; line-height: 1.3; }
.volvo-service-ui > figcaption p { grid-column: 2; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
.volvo-service-ui-screens { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: clamp(12px,2vw,28px); max-width: 1120px; margin: 28px auto 0; }
.volvo-service-ui-screens figure { min-width: 0; margin: 0; }.volvo-service-ui-screens figure > img { display: block; width: auto; max-width: 100%; height: min(43vh,380px); margin: 0 auto; border-radius: 12px; object-fit: contain; box-shadow: 0 16px 35px rgba(0,0,0,.28); }.volvo-service-ui-screens figcaption { display: flex; gap: 9px; align-items: baseline; max-width: 220px; margin: 10px auto 0; color: var(--muted); font-size: 10px; line-height: 1.4; }
.volvo-decisions article { min-height: 290px; }
.volvo-state-map { margin-top: 70px; padding: 34px; border-radius: 20px; background: #10171c; }
.volvo-state-head { display: flex; justify-content: space-between; gap: 30px; padding-bottom: 28px; }.volvo-state-head span { color: var(--accent); font-size: 10px; letter-spacing: .12em; }.volvo-state-head p { max-width: 540px; margin: 0; color: var(--muted); }
.volvo-state-row { display: grid; grid-template-columns: 1fr .8fr 1.6fr; gap: 24px; align-items: center; min-height: 86px; padding: 15px; border-top: 1px solid var(--line); }.volvo-state-row strong { font-size: 18px; font-weight: 400; }.volvo-state-row span,.volvo-state-row p { color: var(--muted); }.volvo-state-row p { margin: 0; }.volvo-state-row.active { margin: 0 -10px; padding-inline: 25px; color: #071016; background: var(--accent); }.volvo-state-row.active span,.volvo-state-row.active p { color: #244456; }
.volvo-phone-ghosts { display: flex; align-items: end; gap: 12px; }.volvo-phone-ghosts i { flex: 1; height: 220px; border: 1px solid rgba(255,255,255,.2); border-radius: 18px; background: linear-gradient(#1a2831 16%,#0b1115 16% 32%,#1a2831 32% 62%,#0b1115 62%); opacity: .45; }.volvo-phone-ghosts i:nth-child(3){height:250px;opacity:.72}
.volvo-service-gallery, .volvo-guideline-panel { margin: 70px 0 0; padding: 36px; border-radius: 20px; background: linear-gradient(145deg,rgba(155,199,229,.1),rgba(255,255,255,.025)); }
.volvo-service-gallery > figcaption, .volvo-guideline-panel > figcaption { display: grid; grid-template-columns: .7fr 1.3fr; gap: 30px; align-items: end; padding-bottom: 30px; border-bottom: 1px solid var(--line); }
.volvo-service-gallery > figcaption strong, .volvo-guideline-panel > figcaption strong { font-size: clamp(22px,2.6vw,36px); font-weight: 400; line-height: 1.25; }
.volvo-service-shots { display: grid; grid-template-columns: repeat(5,1fr); gap: 14px; margin-top: 30px; }
.volvo-service-shots figure { min-width: 0; margin: 0; }
.volvo-service-shots figure > div { height: auto; overflow: hidden; border-radius: 12px; background: #e8edf0; }
.volvo-service-shots img { display: block; width: 100%; height: auto; }
.volvo-service-shots figcaption { padding-top: 12px; color: var(--muted); font-size: 10px; line-height: 1.4; }
.volvo-switch { padding: 58px 0; color: #071016; background: var(--accent); }.volvo-switch .section-shell { display: grid; grid-template-columns: .72fr 1.68fr; column-gap: clamp(28px,5vw,88px); row-gap: 18px; align-items: start; }.volvo-switch span { padding-top: 9px; font-size: 10px; letter-spacing: .12em; }.volvo-switch h2 { max-width: 880px; margin: 0; font-size: clamp(38px,4.6vw,66px); line-height: 1.08; letter-spacing: -.045em; }.volvo-switch p { grid-column: 2; margin: 0; color: rgba(7,16,22,.62); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.volvo-app-cloud { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 70px; }.volvo-app-cloud span { padding: 14px 22px; border: 1px solid rgba(155,199,229,.28); border-radius: 99px; }.volvo-app-cloud span:nth-child(1),.volvo-app-cloud span:nth-child(2) { color: #071016; background: var(--accent); }
.volvo-app-system { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 64px; }
.volvo-app-system article { position: relative; min-height: 220px; padding: 28px; overflow: hidden; border: 1px solid rgba(155,199,229,.3); border-radius: 16px; background: radial-gradient(circle at 100% 0,rgba(155,199,229,.2),transparent 42%),#10171c; }
.volvo-app-system article::after { content: ""; position: absolute; right: -35px; bottom: -35px; width: 120px; height: 120px; border: 1px solid rgba(155,199,229,.22); border-radius: 50%; }
.volvo-app-system article span { color: var(--accent); font-size: 9px; letter-spacing: .11em; }
.volvo-app-system article strong { display: block; margin-top: 42px; font-size: clamp(25px,3vw,38px); font-weight: 400; }
.volvo-app-system article p { margin: 10px 0 0; color: var(--muted); }
.volvo-app-system > div { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 10px; padding: 8px 0 0; }
.volvo-app-system > div span { padding: 10px 16px; border: 1px solid rgba(155,199,229,.24); border-radius: 999px; color: var(--muted); background: rgba(155,199,229,.04); font-size: 12px; }
.volvo-component-ghost { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; opacity: .4; }.volvo-component-ghost i { height: 76px; border: 1px solid rgba(155,199,229,.32); border-radius: 12px; background: #101a20; }
.volvo-guideline-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-top: 30px; }
.volvo-guideline-grid > div { height: 520px; overflow: hidden; border-radius: 12px; background: #f2f5f7; }
.volvo-guideline-grid img { display: block; width: 100%; height: auto; }
.volvo-guideline-panel > figcaption { grid-template-columns: .55fr 1fr .85fr; }
.volvo-guideline-panel > figcaption p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.volvo-component-matrix { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 28px; }
.volvo-component-matrix figure { position: relative; aspect-ratio: 16 / 9; margin: 0; overflow: hidden; border-radius: 12px; background: #eef3f6; }
.volvo-component-matrix img { display: block; width: 100%; height: 100%; object-fit: cover; }
.volvo-component-matrix figcaption { position: absolute; left: 12px; bottom: 12px; padding: 7px 10px; border-radius: 99px; color: #fff; background: rgba(7,16,22,.78); font-size: 9px; letter-spacing: .08em; }
.volvo-representative { display: grid; grid-template-columns: 1fr 1.15fr; gap: 60px; align-items: center; min-height: 600px; padding: 70px 0; border-top: 1px solid var(--line); }.volvo-representative:last-child { border-bottom: 1px solid var(--line); }.volvo-rep-copy > span { color: var(--accent); font-size: 9px; letter-spacing: .12em; }.volvo-rep-copy h3 { margin: 24px 0; font-size: clamp(34px,4.4vw,62px); line-height: 1.05; }.volvo-rep-copy p { color: var(--muted); line-height: 1.65; }.volvo-rep-copy div { display: flex; gap: 10px; margin-top: 34px; }.volvo-rep-copy b { padding: 9px 14px; border-radius: 99px; color: #071016; background: var(--accent); font-size: 11px; font-weight: 400; }
.volvo-rep-visual { position: relative; height: 430px; display: flex; align-items: end; justify-content: center; gap: 18px; padding: 58px 34px 34px; border-radius: 18px; background: #10171c; }.volvo-rep-visual > span { position: absolute; left: 24px; top: 22px; color: var(--muted); font-size: 10px; }.volvo-rep-visual i { width: 26%; height: 78%; border: 1px solid rgba(255,255,255,.16); border-radius: 18px; background: linear-gradient(#1d2a31 18%,#0b1013 18% 40%,#1d2a31 40% 72%,#0b1013 72%); opacity: .55; }.volvo-rep-visual i:nth-of-type(2){height:90%;opacity:.8}
.volvo-compare-gallery { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.volvo-compare-gallery figure { min-width: 0; margin: 0; }
.volvo-compare-gallery figure > span { display: block; margin-bottom: 10px; color: var(--muted); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.volvo-compare-gallery figure > div { height: 480px; overflow: hidden; border-radius: 12px; background: #10171c; }
.volvo-compare-gallery .is-after > div { box-shadow: inset 0 0 0 1px rgba(155,199,229,.55); }
.volvo-compare-gallery img { display: block; width: 100%; height: auto; }
.volvo-compare-pair { display: grid; grid-template-columns: minmax(150px,.72fr) auto minmax(0,1.28fr); gap: 12px; align-items: center; padding: 26px; border: 1px solid rgba(155,199,229,.18); border-radius: 16px; background: rgba(155,199,229,.025); }
.volvo-compare-pair > i { color: var(--accent); font-style: normal; }
.volvo-compare-pair figure { min-width: 0; margin: 0; }
.volvo-compare-pair figure > span { display: block; margin-bottom: 10px; color: var(--muted); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.volvo-compare-pair figure > div { height: auto; overflow: hidden; border-radius: 10px; background: #111b22; opacity: .72; }
.volvo-compare-pair .is-after > div { opacity: 1; box-shadow: inset 0 0 0 1px rgba(155,199,229,.42); }
.volvo-compare-pair img { display: block; width: 100%; height: auto; }
.volvo-compare-pair figcaption { padding-top: 10px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.volvo-compare-pair .volvo-screen-sequence { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; overflow: visible; border-radius: 0; background: transparent; box-shadow: none; }
.volvo-compare-pair .volvo-screen-sequence img { border-radius: 8px; box-shadow: 0 10px 20px rgba(0,0,0,.18); }
.volvo-rep-showcase { display: grid; gap: 16px; }.volvo-booking-flow { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px; padding: 20px 16px; border-radius: 12px; background: #10171c; }.volvo-booking-flow span { padding: 10px 12px; border: 1px solid rgba(155,199,229,.35); border-radius: 8px; font-size: 11px; }.volvo-booking-flow i { color: var(--accent); font-style: normal; }
.volvo-booking-next { display: grid; grid-template-columns: 1fr minmax(150px,220px); gap: 28px; align-items: center; margin: 0; padding: 20px 24px; border-top: 1px solid var(--line); }.volvo-booking-next figcaption { display: grid; gap: 10px; }.volvo-booking-next figcaption span { color: var(--accent); font-size: 9px; letter-spacing: .12em; }.volvo-booking-next figcaption strong { max-width: 300px; font-size: 22px; font-weight: 400; line-height: 1.3; }.volvo-booking-next img { width: 100%; border-radius: 12px; box-shadow: 0 12px 24px rgba(0,0,0,.2); }
.volvo-outcome .stat-strip strong { color: var(--accent); }
.workflow-dark { margin-top: 60px; padding: 30px; border: 1px solid var(--line); }
.workflow-dark .workflow { flex-wrap: wrap; }
.workflow-dark .workflow span { min-width: 120px; }
.volvo-outcome { position: relative; overflow: hidden; }
.volvo-outcome::before { content: ""; position: absolute; width: 520px; height: 520px; right: -240px; bottom: 20px; border: 1px solid rgba(155,199,229,.14); border-radius: 50%; box-shadow: 0 0 90px rgba(155,199,229,.08); pointer-events: none; }
.volvo-summary { display: grid; grid-template-columns: 1.25fr .75fr; gap: 16px; margin-top: 58px; }.volvo-summary article { position: relative; min-height: 220px; padding: 26px; border: 1px solid var(--line); background: linear-gradient(145deg,rgba(155,199,229,.08),rgba(255,255,255,.01)); }.volvo-summary article:first-child { border-color:rgba(155,199,229,.46); background:linear-gradient(145deg,rgba(155,199,229,.15),rgba(255,255,255,.015)); }.volvo-summary span { color: var(--accent); font-size: 9px; letter-spacing: .12em; }.volvo-summary h3 { margin: 52px 0 13px; font-size: 24px; font-weight: 400; }.volvo-summary p { max-width: 420px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.75; }
.volvo-delivery-scale { display:grid; grid-template-columns:.65fr .55fr 1.8fr; gap:24px; align-items:center; margin-top:16px; padding:22px 26px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.volvo-delivery-scale span { color:var(--muted); font-size:9px; letter-spacing:.12em; }
.volvo-delivery-scale strong { color:var(--accent); font-size:clamp(28px,3vw,42px); font-weight:400; }
.volvo-delivery-scale p { margin:0; color:var(--muted); font-size:12px; line-height:1.7; }
.outcome-list { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; margin-top: 58px; }
.outcome-list article { position: relative; min-height: 180px; padding: 24px; overflow: hidden; border: 1px solid var(--line); background: linear-gradient(145deg,rgba(155,199,229,.08),rgba(255,255,255,.01)); }
.outcome-list article::after { content: attr(data-index); position: absolute; right: 16px; top: 12px; color: rgba(155,199,229,.2); font-size: 54px; }
.outcome-list svg { width: 42px; height: 42px; fill: none; stroke: var(--accent); stroke-width: 1.5; }
.outcome-list span { display: block; margin-top: 34px; font-size: 17px; line-height: 1.45; }

/* iConnect case */
.iconnect-case { --accent: #3e7eff; --iconnect-deep: #0e3b70; --iconnect-pale: #eaf2ff; }
.iconnect-hero { height: 100svh; min-height: 720px; padding: 112px 0 26px; display: grid; grid-template-rows: auto minmax(0,1fr) auto; gap: 20px; }
.iconnect-hero-main { min-height: 0; display: grid; grid-template-columns: .82fr 1.18fr; gap: 42px; align-items: center; }
.iconnect-hero-copy > span { color: var(--accent); font-size: 10px; letter-spacing: .14em; }
.iconnect-hero-copy h1 { margin: 22px 0 24px; font-size: clamp(47px,5.3vw,78px); line-height: 1.02; }
.iconnect-hero-copy h1 span { display: block; color: var(--accent); font-family: inherit; font-style: normal; }
.iconnect-hero-copy p { max-width: 520px; color: var(--muted); font-size: 17px; line-height: 1.6; }
.iconnect-hero-visual { position: relative; min-height: 440px; overflow: hidden; border-radius: 22px; background: radial-gradient(circle at 80% 15%,rgba(62,126,255,.22),transparent 32%),#0f1722; }
.iconnect-desktop-shot { position: absolute; width: 92%; right: -8%; top: 12%; border-radius: 12px; box-shadow: 0 28px 70px rgba(0,0,0,.55); }
.iconnect-phone-shot { position: absolute; width: 18%; left: 8%; bottom: -21%; border: 5px solid #111; border-radius: 18px; box-shadow: 0 24px 50px rgba(0,0,0,.55); }
.iconnect-hero-facts { display: grid; grid-template-columns: .8fr .8fr 1.4fr; gap: 20px; }
.iconnect-hero-facts div { padding-top: 10px; border-top: 1px solid var(--line); }
.iconnect-hero-facts small { display: block; color: var(--muted); font-size: 9px; letter-spacing: .11em; text-transform: uppercase; }
.iconnect-hero-facts b { font-size: 13px; font-weight: 400; }
.iconnect-problem-grid { display: grid; grid-template-columns: repeat(4,1fr); margin-top: 64px; border-top: 1px solid var(--line); }
.iconnect-problem-grid article { min-height: 220px; padding: 24px 20px; border-right: 1px solid var(--line); }
.iconnect-problem-grid article:last-child { border-right: 0; }
.iconnect-problem-grid span { color: var(--accent); font-size: 12px; }
.iconnect-problem-grid p { color: var(--muted); }
.iconnect-scale { display: grid; grid-template-columns: auto auto auto auto 1fr; gap: 18px; align-items: baseline; margin-top: 64px; padding: 26px; border-radius: 16px; color: #08162a; background: var(--iconnect-pale); }
.iconnect-scale strong { color: var(--iconnect-deep); font-size: clamp(34px,4.5vw,62px); letter-spacing: -.05em; }
.iconnect-scale p { margin: 0; }.iconnect-scale small { max-width: 440px; justify-self: end; color: #52647d; line-height: 1.6; }
.iconnect-architecture { display: grid; grid-template-columns: .9fr auto repeat(3,1fr); gap: 14px; align-items: stretch; padding: 32px; border: 1px solid rgba(62,126,255,.28); border-radius: 20px; background: radial-gradient(circle at 64% 28%,rgba(62,126,255,.13),transparent 34%),#0d1118; }
.iconnect-role-list, .iconnect-architecture article { min-height: 250px; display: flex; flex-direction: column; padding: 22px; border: 1px solid var(--line); border-radius: 14px; }
.iconnect-role-list span, .iconnect-architecture small { color: var(--muted); font-size: 9px; letter-spacing: .12em; }
.iconnect-role-list b { margin-top: 18px; font-weight: 400; }
.iconnect-architecture > i { align-self: center; color: var(--accent); font-style: normal; }
.iconnect-architecture article strong { margin-top: auto; font-size: 23px; font-weight: 400; }
.iconnect-architecture article p { color: var(--muted); font-size: 12px; }
.iconnect-architecture article.primary { color: #07101e; border-color: transparent; background: var(--accent); }
.iconnect-architecture article.primary small,.iconnect-architecture article.primary p { color: #17396e; }
.iconnect-process { display: flex; align-items: center; justify-content: center; gap: 20px; margin-top: 34px; padding: 24px; border-bottom: 1px solid var(--line); }
.iconnect-process span { padding: 10px 18px; border-radius: 99px; background: #131a24; }.iconnect-process i { color: var(--accent); font-style: normal; }
.iconnect-mobile-gallery { position: relative; display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; margin-top: 64px; padding: 42px 42px 120px; border-radius: 24px; background: linear-gradient(140deg,#eaf2ff,#cadcf5); }
.iconnect-mobile-gallery figure { margin: 0; }.iconnect-mobile-gallery figure > div { height: 530px; overflow: hidden; border-radius: 18px; box-shadow: 0 22px 48px rgba(10,42,86,.16); background: white; }
.iconnect-mobile-gallery img { display: block; width: 100%; height: auto; }
.iconnect-mobile-gallery figcaption { display: flex; gap: 12px; padding-top: 14px; color: #52647d; font-size: 11px; }.iconnect-mobile-gallery figcaption b { color: var(--iconnect-deep); }
.iconnect-state-rail { position: absolute; inset: auto 42px 32px; display: flex; align-items: center; gap: 18px; color: #52647d; }
.iconnect-state-rail span { flex: 1; padding: 12px 16px; border: 1px solid rgba(14,59,112,.24); border-radius: 10px; }.iconnect-state-rail span.active { color: white; background: var(--iconnect-deep); }.iconnect-state-rail small { display: block; margin-top: 4px; }.iconnect-state-rail i { color: var(--iconnect-deep); font-style: normal; }
.iconnect-live-section { padding: 120px 0; color: #07101e; background: var(--iconnect-pale); }
.iconnect-live-section .section-index,.iconnect-live-section .iconnect-live-main figcaption span { color: #52647d; }
.iconnect-live-main { margin: 0; padding: 18px; border-radius: 18px; background: white; box-shadow: 0 30px 70px rgba(17,52,95,.12); }
.iconnect-live-main img,.iconnect-live-pair img { display: block; width: 100%; border-radius: 10px; }
.iconnect-live-main figcaption,.iconnect-live-pair figcaption { display: flex; justify-content: space-between; gap: 20px; padding-top: 14px; font-size: 10px; letter-spacing: .09em; }
.iconnect-tool-row { display: flex; flex-wrap: wrap; gap: 9px; margin: 30px 0 70px; }.iconnect-tool-row span { padding: 10px 16px; border: 1px solid rgba(14,59,112,.24); border-radius: 99px; }
.iconnect-live-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }.iconnect-live-pair figure { margin: 0; padding: 14px; border-radius: 16px; background: white; }
.iconnect-admin-layout { margin-top: 54px; }
.iconnect-admin-full-page { width: min(100%, 1180px); margin: 0 auto; padding:0; border:0; border-radius:0; background:none; }
.iconnect-admin-full-page img { display: block; width: 100%; height: auto; border-radius: 14px; box-shadow: 0 28px 64px rgba(0,0,0,.36); }
.iconnect-platform-section { box-sizing:border-box; display:flex; align-items:center; min-height:min(760px,calc(100vh - 70px)); padding-block:clamp(38px,5vw,72px); }
.iconnect-platform-showcase { display:grid; grid-template-columns:minmax(270px,.74fr) minmax(0,1.26fr); gap:clamp(40px,6vw,92px); align-items:center; width:100%; }
.iconnect-platform-copy { align-self:center; }
.iconnect-platform-copy h2 { max-width:570px; margin:20px 0 24px; font-size:clamp(38px,4.3vw,64px); line-height:1.12; letter-spacing:-.045em; font-weight:400; }
.iconnect-platform-copy > p { max-width:430px; margin:0; color:var(--muted); font-size:15px; line-height:1.8; }
.iconnect-platform-showcase .iconnect-admin-full-page { width:100%; margin:0; padding:0; }
.iconnect-platform-components { margin-top:clamp(34px,5vw,64px); padding-top:20px; border-top:1px solid var(--line); }
.iconnect-platform-components > span { color:var(--accent); font-size:9px; letter-spacing:.13em; }
.iconnect-platform-components > strong { display:block; max-width:330px; margin:12px 0 18px; font-size:17px; line-height:1.45; font-weight:400; }
.iconnect-platform-components > div { display:flex; flex-wrap:wrap; gap:8px; }
.iconnect-platform-components b { padding:7px 10px; border:1px solid rgba(106,151,205,.26); border-radius:99px; color:var(--muted); font-size:10px; font-weight:400; }
.iconnect-component-strip { display: grid; grid-template-columns: repeat(6,1fr); gap: 1px; margin-top: 50px; background: var(--line); }.iconnect-component-strip span { min-height: 82px; display: grid; place-items: center; padding: 12px; background: #0d1118; text-align: center; }
.iconnect-delivery-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }.iconnect-delivery-grid article { min-height: 280px; padding: 28px; border: 1px solid var(--line); border-radius: 16px; }.iconnect-delivery-grid article > span { color: var(--accent); font-size: 10px; letter-spacing: .12em; }.iconnect-delivery-grid p { color: var(--muted); }.iconnect-delivery-grid .verified { color: #07101e; border-color: transparent; background: var(--accent); }.iconnect-delivery-grid .verified span,.iconnect-delivery-grid .verified p { color: #17396e; }
.iconnect-reflection { margin: 70px 0 0; padding: 42px; border-top: 1px solid var(--accent); background: radial-gradient(circle at 90% 20%,rgba(62,126,255,.18),transparent 30%); }.iconnect-reflection span { color: var(--accent); font-size: 10px; letter-spacing: .13em; }.iconnect-reflection p { max-width: 820px; margin: 25px 0 0; font-size: clamp(26px,3.2vw,46px); line-height: 1.24; }

/* Jordan case */
.jordan-case { --accent: #ff5b24; --jordan-red: #c51d2b; --jordan-cream: #f2eadf; }
.jordan-hero { height: 100svh; min-height: 720px; padding: 112px 0 26px; display: grid; grid-template-rows: auto minmax(0,1fr) auto; gap: 20px; }
.jordan-hero-main { min-height: 0; display: grid; grid-template-columns: 1fr .8fr; gap: 58px; align-items: center; }
.jordan-hero-copy > span { color: var(--accent); font-size: 10px; letter-spacing: .14em; }
.jordan-hero-copy h1 { max-width: 680px; margin: 22px 0 24px; font-size: clamp(50px,6vw,88px); line-height: .98; }
.jordan-hero-copy h1 span { display: block; color: var(--accent); font-family: inherit; font-style: normal; }
.jordan-hero-copy p { max-width: 590px; color: var(--muted); font-size: 17px; line-height: 1.65; }
.jordan-hero-system { position: relative; min-height: 440px; overflow: hidden; border-radius: 50%; background: radial-gradient(circle,rgba(255,91,36,.22),transparent 52%); }
.jordan-orbit { position: absolute; inset: 8%; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; }
.jordan-orbit::before,.jordan-orbit::after { content:""; position:absolute; inset:18%; border:1px solid rgba(255,91,36,.32); border-radius:50%; }.jordan-orbit::after { inset:36%; background:var(--accent); box-shadow:0 0 70px rgba(255,91,36,.35); }
.jordan-orbit span { position:absolute; z-index:2; padding:9px 14px; border-radius:99px; color:#090909; background:var(--jordan-cream); font-size:12px; letter-spacing:.08em; }.jordan-orbit span:nth-child(1){left:-2%;top:43%}.jordan-orbit span:nth-child(2){right:7%;top:7%;background:var(--accent)}.jordan-orbit span:nth-child(3){right:-4%;bottom:13%;font-size:9px}.jordan-orbit i { position:absolute; left:48%; top:48%; z-index:2; width:14px; height:14px; border-radius:50%; background:#090909; }
.jordan-hero-system > p { position:absolute; right:12%; bottom:12%; color:var(--muted); font-size:9px; letter-spacing:.14em; line-height:1.8; text-align:right; }
.jordan-hero-facts { display:grid; grid-template-columns:.72fr .72fr 1.15fr 1.25fr; gap:20px; }.jordan-hero-facts div { padding-top:10px; border-top:1px solid var(--line); }.jordan-hero-facts small { display:block; color:var(--muted); font-size:9px; letter-spacing:.11em; text-transform:uppercase; }.jordan-hero-facts b { font-size:13px; font-weight:400; }
.jordan-problem-grid { display:grid; grid-template-columns:repeat(4,1fr); margin-top:64px; border-top:1px solid var(--line); }.jordan-problem-grid article { min-height:230px; padding:24px 20px; border-right:1px solid var(--line); }.jordan-problem-grid article:last-child{border-right:0}.jordan-problem-grid span { color:var(--accent); font-size:12px; }.jordan-problem-grid p { color:var(--muted); }
.jordan-placeholder { display:grid; grid-template-columns:1fr 1.15fr; gap:40px; align-items:center; min-height:320px; margin:70px 0 0; padding:42px; border:1px dashed rgba(255,91,36,.32); border-radius:18px; background:linear-gradient(135deg,rgba(255,91,36,.04),rgba(255,255,255,.02)); }.jordan-placeholder > div > span,.jordan-screen-placeholder > span { color:var(--accent); font-size:9px; letter-spacing:.13em; }.jordan-placeholder strong { display:block; margin-top:18px; font-size:clamp(28px,3.2vw,46px); font-weight:400; }.jordan-placeholder p { color:var(--muted); }
.jordan-before-ghost { display:grid; grid-template-columns:1fr 1fr; gap:12px; opacity:.3; }.jordan-before-ghost i { height:90px; border:1px solid var(--line); border-radius:8px; background:linear-gradient(135deg,#2b2b2b,#111); }.jordan-before-ghost i:first-child { grid-row:span 2; height:auto; }
.jordan-strategy-section { padding:120px 0; color:#15100c; background:var(--jordan-cream); }.jordan-strategy-section .section-index { color:#806f61; }
.jordan-strategy-map { display:grid; grid-template-columns:repeat(3,1fr auto); align-items:center; }.jordan-strategy-map article { min-height:370px; display:flex; flex-direction:column; padding:30px; border:1px solid rgba(0,0,0,.15); border-radius:18px; }.jordan-strategy-map article.daily { background:#fffaf4; }.jordan-strategy-map article.monthly { color:white; border-color:transparent; background:var(--jordan-red); }.jordan-strategy-map article.reward { background:var(--accent); }.jordan-strategy-map > i { padding:0 12px; font-size:24px; font-style:normal; }.jordan-strategy-map small { letter-spacing:.12em; }.jordan-strategy-map strong { margin-top:auto; font-size:clamp(70px,9vw,130px); line-height:.8; letter-spacing:-.07em; }.jordan-strategy-map h3 { margin:28px 0 8px; }.jordan-strategy-map p { margin:0; line-height:1.6; opacity:.72; }.jordan-strategy-note { max-width:760px; margin:42px 0 0 auto; font-size:20px; line-height:1.6; }
.jordan-feature-layout { display:grid; grid-template-columns:.72fr 1.28fr; gap:56px; align-items:center; }.jordan-feature-copy > span { color:var(--accent); font-size:10px; letter-spacing:.13em; }.jordan-feature-copy h3 { font-size:clamp(32px,4vw,56px); line-height:1.12; }.jordan-feature-copy p { color:var(--muted); line-height:1.7; }.jordan-feature-copy > div { display:flex; flex-wrap:wrap; gap:8px; margin-top:32px; }.jordan-feature-copy b { padding:9px 13px; border:1px solid rgba(255,91,36,.35); border-radius:99px; font-size:11px; font-weight:400; }
.jordan-screen-placeholder { min-height:540px; margin:0; padding:34px; border-radius:22px; background:radial-gradient(circle at 70% 18%,rgba(255,91,36,.25),transparent 24%),#161616; }.jordan-card-stack { position:relative; height:410px; margin-top:22px; }.jordan-card-stack i { position:absolute; width:32%; height:78%; left:8%; bottom:0; border:1px solid var(--line); border-radius:18px; background:linear-gradient(#262626 18%,#101010 18% 42%,#2b2b2b 42% 66%,#101010 66%); box-shadow:0 18px 34px rgba(0,0,0,.35); }.jordan-card-stack i:nth-child(2){left:29%;height:90%;}.jordan-card-stack i:nth-child(3){left:50%;height:82%;}.jordan-card-stack i:nth-child(4){left:69%;height:68%;}.jordan-screen-placeholder figcaption { color:var(--muted); font-size:10px; letter-spacing:.1em; }
.jordan-23-flow { display:grid; grid-template-columns:repeat(4,1fr auto); align-items:stretch; }.jordan-23-flow article { min-height:250px; padding:24px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.jordan-23-flow article span { color:var(--accent); }.jordan-23-flow article strong { display:block; margin-top:60px; font-size:21px; }.jordan-23-flow article p { color:var(--muted); }.jordan-23-flow > i { align-self:center; color:var(--accent); font-style:normal; }
.jordan-box-ghost { position:relative; width:260px; height:260px; justify-self:center; transform:rotate(12deg); }.jordan-box-ghost i,.jordan-box-ghost span { position:absolute; inset:12%; border:1px solid rgba(255,91,36,.55); transform:rotate(45deg); }.jordan-box-ghost span { inset:28%; background:var(--accent); }.jordan-box-ghost b { position:absolute; inset:0; z-index:2; display:grid; place-items:center; color:#090909; font-size:72px; }
.jordan-loop { display:grid; grid-template-columns:repeat(4,1fr auto); align-items:center; padding:34px; border:1px solid var(--line); border-radius:20px; background:#111; }.jordan-loop div { min-height:180px; display:flex; flex-direction:column; padding:22px; border-radius:14px; background:#171717; }.jordan-loop div.active { color:#0a0a0a; background:var(--accent); }.jordan-loop div > span { color:var(--accent); font-size:9px; letter-spacing:.12em; }.jordan-loop div.active > span { color:#7a2507; }.jordan-loop strong { margin-top:auto; font-size:23px; }.jordan-loop small { margin-top:8px; color:var(--muted); }.jordan-loop div.active small { color:#7a2507; }.jordan-loop > i { padding:0 10px; color:var(--accent); font-style:normal; }
.jordan-fragment-note { display:grid; grid-template-columns:.8fr 1.2fr; gap:40px; margin-top:40px; padding:30px 0; border-bottom:1px solid var(--line); }.jordan-fragment-note strong { font-size:28px; }.jordan-fragment-note p { margin:0; color:var(--muted); }
.jordan-results-section { padding:120px 0; color:#f5f0e9; background:#252525; }.jordan-results-section .section-index { color:#999; }.jordan-result-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(255,255,255,.12); }.jordan-result-grid article { min-height:310px; display:flex; flex-direction:column; padding:30px; background:#252525; }.jordan-result-grid span { font-size:22px; }.jordan-result-grid small { margin-top:10px; color:#999; }.jordan-result-grid strong { margin-top:auto; color:var(--accent); font-size:clamp(54px,7vw,92px); letter-spacing:-.06em; }.jordan-result-grid b { color:var(--accent); font-weight:400; }
.jordan-data-note { max-width:820px; margin:42px 0 0 auto; padding-top:22px; border-top:1px solid rgba(255,255,255,.12); color:#999; font-size:12px; line-height:1.7; }.jordan-data-note span { display:block; margin-bottom:10px; color:var(--accent); font-size:9px; letter-spacing:.12em; }
.jordan-reflection-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:70px; }.jordan-reflection-grid > p { margin:0; font-size:clamp(25px,3.2vw,42px); line-height:1.4; }.jordan-reflection-grid > div { padding-top:18px; border-top:1px solid var(--accent); }.jordan-reflection-grid span { color:var(--accent); font-size:10px; letter-spacing:.12em; }.jordan-reflection-grid div p { color:var(--muted); line-height:1.7; }
.case-nav { display: grid; grid-template-columns: 1fr 1fr 1fr; padding: 50px 0; }
.case-nav a:nth-child(2) { text-align: center; }
.case-nav a:last-child { text-align: right; }
.placeholder-hero { min-height: 82svh; padding-top: 150px; }
.placeholder-hero h1 { margin: 20px 0; font-size: clamp(64px, 12vw, 170px); line-height: .82; letter-spacing: -.065em; }
.placeholder-hero p { max-width: 640px; color: var(--muted); font-size: 22px; }

@media (max-width: 800px) {
  .section-shell { width: min(100% - 32px, 680px); }
  .ruled-section, .case-section { padding: 82px 0; }
  .site-header { height: 60px; padding: 0 16px; }
  .menu-button { display: block; text-transform: uppercase; font-size: 11px; letter-spacing: .1em; }
  .site-nav { position: absolute; top: 58px; left: 16px; right: 16px; display: none; flex-direction: column; gap: 0; padding: 14px; border: 1px solid var(--line); background: rgba(10,10,10,.96); }
  .site-nav.is-open { display: flex; }
  .site-nav a { padding: 12px; }
  .case-header .site-nav { position: static; display: flex; width: auto; padding: 0; border: 0; background: transparent; }
  .case-header .site-nav a { display: none; padding: 0; }
  .case-header .site-nav a:first-child { display: block; }
  .hero.section-shell { width: 100%; padding-left: 16px; padding-right: 16px; }
  .hero { min-height:100svh; padding-top:84px; }
  .hero-kicker { width:100%; }
  .hero-kicker span:first-child { display:none; }
  .hero::before { inset:0; background:linear-gradient(180deg,rgba(10,10,10,.58) 0%,rgba(10,10,10,.38) 36%,rgba(10,10,10,.72) 72%,rgba(10,10,10,.92) 100%),linear-gradient(90deg,rgba(10,10,10,.56),rgba(10,10,10,.2)); }
  .hero::after { inset:0; width:auto; opacity:.55; background:linear-gradient(90deg,transparent 0 50%,rgba(242,239,231,.025) 50% 50.15%,transparent 50.15%); }
  .hero-stage { display:grid; grid-template-columns:1fr; grid-template-rows:auto; gap:26px; align-content:center; padding:46px 0 38px; }
  .hero-title { font-size: clamp(66px, 23vw, 124px); line-height: .86; }
  .hero-title::after { left: 76%; top: 2%; }
  .hero-title { grid-column:1; grid-row:auto; }
  .hero-title span:last-child { margin-left:7%; }
  .hero-intro { grid-column:1; grid-row:auto; max-width:560px; padding-top:18px; }
  .hero-experience { font-size:clamp(20px,5.8vw,26px); }
  .hero-statement { font-size:15px; }
  .home .hero-background { display:block; object-position:18% center; opacity:1; }
  .hero-bottom, .about, .section-heading, .case-lede, .case-section-head, .case-prose, .timeline article { grid-template-columns: 1fr; }
  .hero-bottom { gap: 26px; }
  .hero-focus { text-align:left; }
  .about { gap: 46px; min-height: 0; }
  .about { padding-right: 16px; padding-left: 16px; }
  .about-note { display: none; }
  .about-stage { grid-template-columns: 1fr; gap: 38px; }
  .about::before { inset: 0; }
  .about .about-title { font-size: clamp(42px, 12vw, 64px); line-height: 1.08; letter-spacing: -.04em; }
  .about-title span { white-space: normal; }
  .about-title span:last-child { margin-left: 0; }
  .about-profile { gap: 24px; }
  .about-portrait { justify-self: start; width: min(72vw, 300px); }
  .about-identity { flex-wrap: wrap; gap: 2px 12px; margin-top: 20px; }
  .about-brief { grid-template-columns: 1fr; justify-self: stretch; width: auto; align-items: start; font-size: 16px; }
  .about-brief p + p { justify-self: start; }
  .section-heading { gap: 34px; margin-bottom: 55px; }
  .section-heading > p { margin: 0; }
  .project-card { padding-bottom: 80px; }
  .project-meta { grid-template-columns: auto 1fr; gap: 20px; }
  .project-meta span:nth-child(2) { text-align: right; }
  .project-meta span:last-child { display: none; }
  .project-card-body, .project-card-body.reverse { grid-template-columns: 1fr; }
  .project-card-body.reverse .project-copy { order: initial; }
  .project-visual { min-height: 460px; grid-row: 1; }
  .project-row { grid-template-columns: .2fr 1fr auto .12fr; min-height: 140px; gap: 12px; }
  .row-detail { display: none; }
  .project-symbol { width: 70px; height: 62px; }
  .capability-grid { grid-template-columns: 1fr; }
  .capability { min-height: 260px; border-right: 0; }
  .capability h3 { margin-top: 45px; }
  .process-list li { grid-template-columns: .2fr .8fr; padding: 22px 0; }
  .process-list p { grid-column: 2; }
  .workflow { align-items: flex-start; flex-direction: column; }
  .workflow i { transform: rotate(90deg); }
  .approach-flow { grid-template-columns: 1fr 1fr; }
  .approach-flow li { min-height: 160px; padding: 22px 18px 24px 0; border-bottom: 1px solid var(--line); }
  .approach-flow li + li { padding-left: 18px; }
  .approach-flow li:nth-child(2) { border-right: 0; }
  .approach-flow li:not(:last-child)::after { display: none; }
  .approach-flow strong { margin-top: 38px; font-size: 21px; }
  .approach-rule { grid-template-columns: 1fr; gap: 10px; }
  .timeline::before { left: 6px; }
  .timeline article { grid-template-columns: 1fr; gap: 18px; min-height: 0; padding: 28px 0 32px 34px; }
  .timeline article::before { top: 32px; left: 0; }
  .timeline-meta { flex-direction: row; align-items: center; gap: 14px; padding: 0; }
  .timeline-entry { padding-left: 0; }
  .timeline-heading { align-items: flex-start; flex-direction: column; gap: 8px; }
  .home .timeline .timeline-summary { margin: 18px 0 22px; }
  .contact-title { font-size: clamp(34px, 10vw, 54px); line-height: 1.1; }
  .contact-title span { font-size: 1.55em; }
  .contact-grid { grid-template-columns: 1fr; gap: 20px; }
  .contact-links { align-items: flex-start; text-align: left; }
  .case-hero { padding-top: 100px; }
  .case-hero h1 { font-size: clamp(40px, 11.2vw, 64px); line-height: 1.12; }
  .case-hero h1 span { font-size: .72em; white-space: nowrap; }
  .case-facts { grid-template-columns: 1fr; }
  .case-cover:not(.weconnect-figma-cover) { min-height: 570px; }
  .case-cover .phone { width: 38vw; }
  .case-cover .phone-a { left: 10%; top: 11%; }
  .case-cover .phone-b { right: 8%; bottom: 10%; }
  .stat-strip { grid-template-columns: 1fr; }
  .validation-board { grid-template-columns: 1fr; }
  .validation-board article { min-height: 0; padding: 24px 0 28px; border-right: 0; border-bottom: 1px solid var(--line); }
  .validation-board article:last-child { border-bottom: 0; }
  .validation-board > article > strong { margin-top: 26px; }
  .validation-board article > div { margin-top: 24px; }
  .decision-grid, .closure-grid, .outcome-list { grid-template-columns: 1fr; }
  .principle { padding: 92px 22px 28px; }
  .principle::before { left: 18px; top: 10px; }
  .principle p { font-size: 25px; }
  .ecosystem-frame { padding: 22px; }
  .ecosystem-label { flex-direction: column; gap: 8px; padding-bottom: 32px; }
  .ecosystem-diagram { grid-template-columns: 1fr; }
  .ecosystem-diagram article { min-height: 160px; }
  .ecosystem-diagram > i { justify-self: center; transform: rotate(90deg); }
  .ecosystem-return { width: 100%; margin: 26px 0; }
  .ecosystem-return span { display: none; }
  .repair-visual, .status-system, .ai-workflow-panel { padding: 22px; }
  .repair-steps { grid-template-columns: repeat(2,1fr); }
  .repair-steps article { border-bottom: 1px solid var(--line); }
  .repair-focus { gap: 32px; padding: 36px 0; }
  .repair-focus-copy { grid-template-columns: 1fr; gap: 12px; padding: 0 8px; }
  .repair-focus-copy strong, .repair-focus-copy p { grid-column: 1; }
  .repair-mapping { grid-template-columns: 1fr; gap: 20px; }
  .repair-map-transfer { grid-template-columns: 1fr auto 1fr; align-items: center; width: 100%; }
  .repair-map-transfer b { transform: rotate(90deg); }
  .repair-map-user, .repair-map-system { min-height: 0; padding: 18px; }
  .repair-map-system dl > div { grid-template-columns: 84px 1fr; }
  .status-system-head { display: block; }
  .status-system-head h3 { margin-top: 18px; text-align: left; }
  .status-example { grid-template-columns: 1fr 1fr; gap: 8px; padding: 16px 8px; }
  .status-example-head { display: none; }
  .status-example strong { grid-column: 1 / -1; color: var(--accent); }
  .status-example span::before { display: block; color: var(--muted); font-size: 8px; letter-spacing: .08em; text-transform: uppercase; }
  .status-example span:nth-child(2)::before { content: "总进度"; }
  .status-example span:nth-child(3)::before { content: "详情"; }
  .status-example span:nth-child(4)::before { content: "通知"; }
  .status-system-note { grid-template-columns: 1fr; }
  .status-detail-evidence { grid-template-columns: 1fr; gap: 36px; margin-top: 52px; padding: 38px 0; }
  .status-detail-visual { min-height: 680px; }
  .status-detail-device { width: min(76%, 300px); height: 640px; }
  .closure-ai-proof { grid-template-columns:1fr; gap:38px; margin-top:64px; padding:36px 0; }
  .closure-ai-trace li { grid-template-columns:1fr; gap:7px; }
  .closure-ai-visual { min-height:600px; }
  .closure-ai-phone.is-verify { left:2%; width:48%; }
  .closure-ai-phone.is-confirm { right:2%; width:46%; }
  .closure-evidence { grid-template-columns: 1fr; gap: 36px; }
  .closure-screen { width: min(100%, 375px); }
  .ai-track { grid-template-columns: 1fr; }
  .ai-track > i { justify-self: center; transform: rotate(90deg); }
  .ai-track article { min-height: 140px; }
  .judgment-band div { grid-template-columns: 1fr 1fr; }
  .lynk-hero { height: auto; min-height: 760px; padding-top: 64px; }
  .lynk-hero-poster { min-height: 760px; padding: 20px 22px 18px; grid-template-rows: auto minmax(0,1fr) auto; gap: 18px; background-position: 53% center; }
  .lynk-hero-intro { grid-template-columns: 1fr; gap: 12px; }
  .lynk-hero-copy h1 { max-width: 530px; font-size: clamp(32px, 8.8vw, 44px); line-height: 1.16; }
  .lynk-hero-facts { grid-template-columns: 1fr 1fr; gap: 10px; }
  .lynk-hero-facts div:last-child { grid-column: 1 / -1; }
  .lynk-story-proof { grid-template-columns:1fr; gap:28px; }
  .lynk-story-proof .case-story-grid article,.lynk-story-proof .case-story-grid article:nth-child(n) { min-height:0; padding:18px 0 22px; border-right:0; }
  .lynk-story-proof .case-story-grid article:nth-child(even) { padding-left:0; }
  .lynk-story-visual img { width:100%; margin-left:0; }
  .lynk-legacy-placeholder { grid-template-columns:1fr; gap:22px; }
  .lynk-control-feature { grid-template-columns:1fr; gap:30px; min-height:0; padding:30px 22px; }
  .lynk-control-feature-copy { max-width:none; }
  .lynk-control-feature-copy > span { margin-bottom:16px; }
.lynk-control-stage { grid-template-columns:1fr 1fr; grid-template-areas:"home home" "status charging" "drive environment"; gap:28px 16px; padding:0; }
  .lynk-control-screen { width:min(100%,230px); }
  .lynk-control-shot.is-status,.lynk-control-shot.is-charging { width:min(100%,156px); }
.lynk-control-shot.is-drive-log,.lynk-control-shot.is-environment { width:min(100%,170px); }
  .lynk-control-stage figcaption { flex-direction:column; gap:3px; margin-top:8px; font-size:9px; }
  .lynk-problem-grid { grid-template-columns: 1fr 1fr; }
  .lynk-problem-grid article { min-height: 230px; border-bottom: 1px solid var(--line); }
  .lynk-strategy li { grid-template-columns: .25fr 1.75fr; }
  .lynk-device-pair, .lynk-commerce-layout, .lynk-community-grid, .lynk-system-grid, .lynk-personal-grid, .lynk-placeholder, .lynk-concept-visual { grid-template-columns: 1fr; }
  .lynk-device-pair, .lynk-placeholder, .lynk-concept-visual { padding: 24px; }
  .lynk-personal-grid { padding: 24px 0; }
  .lynk-device-heading { grid-column: auto; }
  .lynk-device-pair figure { max-width: 260px; justify-self: center; }
  .lynk-commerce-grid { gap: 12px; }
  .lynk-community-grid figure { max-height: none; overflow: visible; }
  .lynk-badge-system { padding: 28px 20px; }
  .lynk-badge-head { grid-template-columns: 1fr; gap: 20px; }
  .lynk-badge-art { width: calc(100% + 12px); margin-left: -6px; }
  .volvo-hero { min-height: 760px; padding: 92px 0 20px; gap: 16px; }
  .volvo-hero-main { grid-template-columns: 1fr; grid-template-rows: auto minmax(230px,1fr); gap: 18px; }
  .volvo-hero-copy h1 { font-size: clamp(44px,14vw,58px); line-height: .9; }
  .volvo-hero-copy h1 span { font-size: 1em; white-space: normal; }
  .volvo-hero-copy p { margin-top: 16px; font-size: 13px; }
  .volvo-hero-map { min-height: 230px; padding: 0; }
  .volvo-hero-map-head { display: block; padding-bottom: 14px; }
  .volvo-hero-map-head p { margin-top: 8px; text-align: left; }
  .volvo-hero-device-pair { gap: 0; width: min(100%,310px); padding: 12px 0 0; }
  .volvo-hero-device-app { transform: translate(10px,10px) rotateY(-10deg) rotateZ(-3deg); }
  .volvo-hero-device-wecom { transform: translate(-12px,-12px) rotateY(12deg) rotateZ(4deg); }
  .volvo-phone-shell { width: min(100%,148px); padding: 5px; border-radius: 23px; }
  .volvo-phone-shell img { height: 284px; border-radius: 17px; }
  .volvo-hero-track { grid-template-columns: 1fr auto; gap: 10px; padding: 18px 0; }
  .volvo-hero-track > span { grid-column: 1 / -1; }
  .volvo-hero-track h2 { font-size: 27px; }
  .volvo-hero-track p { margin-top: 6px; }
  .volvo-hero-facts { grid-template-columns: 1fr 1fr; gap: 10px; }
  .volvo-hero-facts div:last-child { grid-column: 1 / -1; }
  .volvo-track-grid, .volvo-placeholder, .volvo-representative { grid-template-columns: 1fr; }
  .volvo-track { min-height: 480px; padding: 28px; }
  .volvo-track > strong { left: 28px; }
  .volvo-placeholder, .volvo-state-map { padding: 24px; }
  .volvo-state-head { display: block; }
  .volvo-state-head p { margin-top: 16px; }
  .volvo-state-row { grid-template-columns: 1fr 1fr; gap: 8px; }
  .volvo-state-row p { grid-column: 1 / -1; }
  .volvo-phone-ghosts { gap: 6px; }
  .volvo-phone-ghosts i { height: 150px; }
  .volvo-phone-ghosts i:nth-child(3) { height: 175px; }
  .volvo-media-panel figcaption, .volvo-service-gallery > figcaption, .volvo-guideline-panel > figcaption { grid-template-columns: 1fr; gap: 12px; }
  .volvo-ia-diagram { padding: 22px; }
  .volvo-ia-diagram > figcaption { grid-template-columns: 1fr; gap: 12px; }
  .volvo-ia-evidence { grid-template-columns:1fr; gap:26px; padding:24px 0; }
  .volvo-ia-screens { max-width:300px; }
  .volvo-ia-board { grid-template-columns: 1fr; }
  .volvo-ia-board > i { justify-self: center; transform: rotate(90deg); }
  .volvo-service-ui { padding: 22px 22px 0; }
  .volvo-service-ui > figcaption { grid-template-columns: 1fr; gap: 12px; }
  .volvo-service-ui > figcaption p { grid-column: 1; }
  .volvo-service-ui-screens { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
  .volvo-service-ui-screens figure > img { height: min(46vh,360px); }
  .volvo-service-gallery, .volvo-guideline-panel { padding: 22px; }
  .volvo-service-shots { grid-template-columns: repeat(2,1fr); }
  .volvo-service-shots figure > div { height: auto; }
  .volvo-app-system { grid-template-columns: 1fr; }
  .volvo-app-system > div { gap: 8px; }
  .volvo-app-system > div span { padding: 8px 12px; }
  .volvo-component-matrix { grid-template-columns: 1fr 1fr; }
  .volvo-guideline-grid { grid-template-columns: 1fr; }
  .volvo-guideline-grid > div { height: 420px; }
  .volvo-switch { padding: 44px 0; }
  .volvo-switch .section-shell { grid-template-columns: 1fr; gap: 14px; }
  .volvo-switch span { padding-top: 0; }
  .volvo-switch h2 { font-size: clamp(34px,8vw,46px); }
  .volvo-switch p { grid-column: 1; }
  .volvo-app-cloud { gap: 8px; }
  .volvo-app-cloud span { padding: 10px 14px; font-size: 11px; }
  .volvo-representative { gap: 36px; min-height: auto; padding: 58px 0; }
  .volvo-rep-visual { height: 360px; }
  .volvo-compare-gallery figure > div { height: 360px; }
  .volvo-compare-pair { grid-template-columns: 1fr 1fr; padding: 18px; }
  .volvo-compare-pair > i { display: none; }
  .volvo-compare-pair figure > div { height: auto; }
  .volvo-compare-pair .volvo-screen-sequence { grid-template-columns: 1fr; }
  .outcome-list { grid-template-columns: 1fr 1fr; }
  .outcome-list article { min-height: 150px; padding: 18px; }
  .volvo-booking-flow { flex-wrap: wrap; justify-content: flex-start; padding: 36px 24px; }
  .volvo-booking-flow span { padding: 13px 12px; }
  .volvo-booking-next { grid-template-columns: 1fr; padding: 20px 0; }
  .volvo-booking-next img { max-width: 220px; justify-self: start; }
  .volvo-summary { grid-template-columns: 1fr; margin-top: 36px; }
  .volvo-summary article { min-height: 0; }
  .iconnect-hero { min-height: 760px; padding: 92px 0 20px; gap: 16px; }
  .iconnect-hero-main { grid-template-columns: 1fr; grid-template-rows: auto minmax(260px,1fr); gap: 18px; }
  .iconnect-hero-copy h1 { margin: 14px 0 16px; font-size: clamp(39px,11.5vw,52px); }
  .iconnect-hero-copy p { margin: 0; font-size: 13px; }
  .iconnect-hero-visual { min-height: 260px; border-radius: 16px; }
  .iconnect-desktop-shot { width: 96%; right: -16%; top: 12%; }
  .iconnect-phone-shot { width: 25%; left: 7%; bottom: -32%; border-width: 3px; }
  .iconnect-hero-facts { grid-template-columns: 1fr 1fr; gap: 10px; }
  .iconnect-hero-facts div:last-child { grid-column: 1 / -1; }
  .iconnect-problem-grid { grid-template-columns: 1fr 1fr; }
  .iconnect-problem-grid article { min-height: 190px; border-bottom: 1px solid var(--line); }
  .iconnect-scale { grid-template-columns: auto 1fr; padding: 22px; }
  .iconnect-scale small { grid-column: 1 / -1; justify-self: start; }
  .iconnect-architecture { grid-template-columns: 1fr; padding: 20px; }
  .iconnect-architecture > i { transform: rotate(90deg); }
  .iconnect-role-list, .iconnect-architecture article { min-height: 190px; }
  .iconnect-process { align-items: stretch; flex-direction: column; }
  .iconnect-process i { align-self: center; transform: rotate(90deg); }
  .iconnect-mobile-gallery { grid-template-columns: 1fr; gap: 34px; padding: 24px 24px 220px; }
  .iconnect-mobile-gallery figure { max-width: 280px; justify-self: center; }
  .iconnect-mobile-gallery figure > div { height: 460px; }
  .iconnect-state-rail { inset: auto 24px 24px; align-items: stretch; flex-direction: column; gap: 7px; }
  .iconnect-state-rail i { align-self: center; transform: rotate(90deg); }
  .iconnect-live-section { padding: 82px 0; }
  .iconnect-live-main, .iconnect-live-pair figure { padding: 8px; }
  .iconnect-live-main figcaption, .iconnect-live-pair figcaption { flex-direction: column; gap: 4px; }
  .iconnect-live-pair, .iconnect-admin-layout, .iconnect-delivery-grid { grid-template-columns: 1fr; }
  .iconnect-admin-layout { gap: 34px; }
  .iconnect-component-strip { grid-template-columns: 1fr 1fr; }
  .iconnect-delivery-grid article { min-height: 220px; }
  .iconnect-reflection { padding: 32px 22px; }
  .jordan-hero { min-height:760px; padding:92px 0 20px; gap:16px; }
  .jordan-hero-main { grid-template-columns:1fr; grid-template-rows:auto minmax(260px,1fr); gap:16px; }
  .jordan-hero-copy h1 { margin:14px 0 16px; font-size:clamp(40px,12vw,54px); }.jordan-hero-copy p { margin:0; font-size:13px; }
  .jordan-hero-system { min-height:260px; }.jordan-hero-system > p { right:8%; bottom:8%; }
  .jordan-hero-system > p { display:none; }
  .jordan-hero-facts { grid-template-columns:1fr 1fr; gap:10px; }
  .jordan-problem-grid { grid-template-columns:1fr 1fr; }.jordan-problem-grid article { min-height:205px; border-bottom:1px solid var(--line); }
  .jordan-placeholder,.jordan-feature-layout,.jordan-fragment-note,.jordan-reflection-grid { grid-template-columns:1fr; }
  .jordan-placeholder { padding:24px; }
  .jordan-strategy-map { grid-template-columns:1fr; gap:12px; }.jordan-strategy-map > i { justify-self:center; transform:rotate(90deg); }.jordan-strategy-map article { min-height:280px; }.jordan-strategy-note { font-size:17px; }
  .jordan-feature-layout { gap:38px; }.jordan-screen-placeholder { min-height:430px; padding:24px; }.jordan-card-stack { height:320px; }
  .jordan-23-flow,.jordan-loop { grid-template-columns:1fr; gap:8px; }.jordan-23-flow > i,.jordan-loop > i { justify-self:center; transform:rotate(90deg); }.jordan-23-flow article { min-height:190px; }.jordan-23-flow article strong { margin-top:36px; }.jordan-loop { padding:20px; }.jordan-loop div { min-height:150px; }
  .jordan-result-grid { grid-template-columns:1fr; }.jordan-result-grid article { min-height:230px; }
  .case-nav { grid-template-columns: 1fr; gap: 18px; }
  .case-nav a, .case-nav a:nth-child(2), .case-nav a:last-child { text-align: left; }
}

/* Four real screens make the meeting flow legible without a substitute status card. */
.iconnect-mobile-gallery { grid-template-columns:repeat(4,1fr); align-items:start; }
.iconnect-mobile-gallery > figure > div { height:auto; overflow:visible; }
.iconnect-mobile-gallery > figure > div img { display:block; width:100%; height:auto; border-radius:18px; box-shadow:0 22px 48px rgba(10,42,86,.16); }
.iconnect-desktop-flow { align-self:start; padding-top:0; }
.iconnect-desktop-flow > div { display:flex; align-items:center; min-height:0; background:transparent; }
.iconnect-desktop-flow > div img { border-radius:12px; }

@media (max-width:800px) {
  .iconnect-mobile-gallery { grid-template-columns:1fr; }
  .iconnect-desktop-flow { align-self:start; padding-top:0; }
}

/* Philips light medical direction: the CT scanner floats directly on the page canvas. */
.philips-hero-poster {
  color:#152632;
  background:
    radial-gradient(circle at 78% 42%,rgba(124,202,211,.28),transparent 30%),
    linear-gradient(135deg,#f7fbfc 0%,#e7f1f3 58%,#d5e7eb 100%);
}
.philips-hero-poster::after {
  background:linear-gradient(135deg,transparent 48%,rgba(64,134,151,.08) 48%,transparent 49%),linear-gradient(180deg,transparent 62%,rgba(34,85,103,.09));
}
.philips-poster-meta { color:rgba(21,38,50,.62); }
.philips-hero-copy > span { color:#287b91; }
.philips-hero-copy h1 { color:#152632; }
.philips-hero-copy h1 span { color:#287b91; }
.philips-hero-copy p { color:rgba(21,38,50,.68); }
.philips-hero-visual img { border-radius:0; box-shadow:none; filter:none; }
.philips-hero-visual figcaption { color:rgba(21,38,50,.52); }
.philips-hero-visual figcaption span { color:#287b91; }
.philips-hero-facts div { border-top-color:rgba(21,38,50,.2); }
.philips-hero-facts small { color:rgba(21,38,50,.52); }
@media (max-width:800px) {
  .philips-hero-poster { background:linear-gradient(180deg,#f7fbfc 0%,#e1eef1 100%); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}

/* Jordan case: real Figma screens replace the temporary diagram placeholders. */
.jordan-hero-visual { position:relative; min-height:440px; margin:0; overflow:hidden; border-radius:28px; background:#120b09; }
.jordan-hero-visual::after { content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg,rgba(5,5,5,.18),transparent 45%),linear-gradient(0deg,rgba(5,5,5,.55),transparent 42%); pointer-events:none; }
.jordan-cover-scene { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 66%; filter:saturate(.82) contrast(1.08); }
.jordan-cover-hand { position:absolute; z-index:2; right:-8%; bottom:-14%; height:108%; aspect-ratio:1412 / 2006; }
.jordan-cover-mockup { display:block; width:100%; height:100%; object-fit:contain; }
.jordan-cover-screen { position:absolute; left:9.2%; top:1.45%; width:44.4%; height:64.3%; object-fit:cover; object-position:top; border-radius:12% / 6%; }
.jordan-hero-visual figcaption { position:absolute; z-index:3; left:7%; bottom:7%; color:rgba(255,255,255,.72); font-size:10px; letter-spacing:.08em; }
.jordan-hero-visual figcaption span { display:block; margin-bottom:5px; color:var(--accent); font-size:8px; letter-spacing:.14em; }
.jordan-before-panel { display:grid; grid-template-columns:.8fr 1.2fr; gap:60px; align-items:center; min-height:560px; margin:70px 0 0; padding:52px; overflow:hidden; border-radius:24px; background:linear-gradient(135deg,#24201d,#101010 65%); }
.jordan-before-copy span { color:var(--accent); font-size:9px; letter-spacing:.13em; }
.jordan-before-copy strong { display:block; margin:20px 0; font-size:clamp(30px,3.5vw,50px); line-height:1.15; font-weight:400; }
.jordan-before-copy p { color:var(--muted); line-height:1.7; }
.jordan-before-screen { position:relative; height:480px; display:grid; place-items:center; opacity:.68; }
.jordan-before-screen img { height:100%; width:auto; max-width:100%; object-fit:contain; border-radius:16px; filter:saturate(.55); box-shadow:0 24px 60px rgba(0,0,0,.45); }
.jordan-before-screen i { position:absolute; right:4%; bottom:3%; padding:7px 10px; color:#111; background:var(--jordan-cream); border-radius:99px; font-size:9px; font-style:normal; }
.jordan-365-visual { position:relative; min-height:610px; margin:0; overflow:hidden; border-radius:24px; background:radial-gradient(circle at 72% 20%,rgba(255,91,36,.22),transparent 30%),#131313; }
.jordan-screen { position:absolute; bottom:-48px; width:34%; }
.jordan-screen img,.jordan-detail-crop img { display:block; width:100%; border-radius:18px; box-shadow:0 25px 60px rgba(0,0,0,.52); }
.jordan-screen span,.jordan-detail-crop span { display:block; margin-top:10px; color:var(--muted); font-size:9px; letter-spacing:.1em; }
.jordan-screen.ux { left:7%; opacity:.56; transform:rotate(-5deg); }
.jordan-screen.final { left:34%; z-index:2; transform:translateY(-18px); }
.jordan-detail-crop { position:absolute; right:6%; top:70px; width:27%; height:450px; overflow:hidden; opacity:.72; }
.jordan-detail-crop img { border-radius:16px; }
.jordan-detail-crop span { position:absolute; left:10px; bottom:10px; padding:6px 8px; color:#111; background:var(--jordan-cream); border-radius:99px; }
.jordan-fragment-visual { display:grid; grid-template-columns:.72fr 1fr .9fr; gap:30px; align-items:center; margin:70px 0 0; padding:48px; overflow:hidden; border-radius:24px; background:radial-gradient(circle at 58% 30%,rgba(255,91,36,.22),transparent 35%),#141414; }
.jordan-fragment-visual > div { height:520px; overflow:hidden; }
.jordan-fragment-visual > div.ux-primary { opacity:1; }
.jordan-fragment-visual > div.ui-support { align-self:center; height:390px; opacity:.46; }
.jordan-fragment-visual img { display:block; width:100%; border-radius:17px; }
.jordan-fragment-visual span { display:block; margin-top:10px; color:var(--muted); font-size:9px; letter-spacing:.1em; }
.jordan-fragment-visual figcaption { align-self:end; padding-bottom:40px; }
.jordan-fragment-visual figcaption b { display:block; font-size:clamp(28px,3vw,44px); font-weight:400; line-height:1.15; }
.jordan-fragment-visual figcaption p { color:var(--muted); line-height:1.7; }

.jordan-before-panel { min-height:500px; }
.jordan-before-screen { height:400px; min-height:0; overflow:hidden; }
.jordan-before-screen img { width:auto; height:360px; max-width:100%; max-height:none; }
.jordan-365-visual { min-height:560px; display:grid; grid-template-columns:1.15fr 1.15fr .7fr; gap:20px; align-items:end; padding:48px; }
.jordan-screen,.jordan-detail-crop { position:relative; inset:auto; width:auto; height:450px; overflow:hidden; opacity:1; transform:none; }
.jordan-screen.ux { left:auto; opacity:1; transform:none; }
.jordan-screen.final { left:auto; height:360px; opacity:.44; transform:none; }
.jordan-detail-crop { right:auto; top:auto; opacity:.88; transform:none; }
.jordan-screen img,.jordan-detail-crop img { width:100%; height:auto; max-height:none; object-fit:contain; }
.jordan-detail-crop span { left:10px; bottom:10px; }
.jordan-fragment-visual { grid-template-columns:.9fr .55fr 1fr; }
.jordan-fragment-visual > div { height:420px; display:grid; align-content:start; justify-items:center; overflow:hidden; transform:none; }
.jordan-fragment-visual > div.ui-support { height:330px; }
.jordan-fragment-visual img { width:auto; height:360px; max-width:100%; object-fit:contain; }

@media (max-width: 720px) {
  .jordan-hero-visual { min-height:260px; }
  .jordan-cover-hand { right:-4%; bottom:-11%; height:104%; }
  .jordan-cover-scene { object-position:center 58%; }
  .jordan-hero-visual figcaption { display:none; }
  .jordan-before-panel { grid-template-columns:1fr; min-height:0; padding:26px; gap:30px; }
  .jordan-before-screen { height:340px; }
  .jordan-before-screen img { height:300px; }
  .jordan-365-visual { min-height:460px; grid-template-columns:1fr 1fr; gap:8px; padding:20px; }
  .jordan-365-visual .ui-support { grid-column:1 / -1; width:46%; justify-self:end; }
  .jordan-screen,.jordan-detail-crop { width:auto; height:360px; }
  .jordan-screen.ux { transform:translateY(14px); }
  .jordan-detail-crop { transform:translateY(24px); }
  .jordan-fragment-visual { grid-template-columns:1fr 1fr; gap:14px; padding:24px; }
  .jordan-fragment-visual > div { height:320px; }
  .jordan-fragment-visual > div.ui-support { height:250px; }
  .jordan-fragment-visual img { height:280px; }
  .jordan-fragment-visual figcaption { grid-column:1 / -1; padding:30px 0 0; }
}

/* Philips WeConnect hero follows the iConnect poster rhythm with a medical-service visual. */
.philips-hero {
  min-height: 100svh;
  padding: 72px 0 0;
  display: block;
}

.philips-hero-poster {
  position: relative;
  min-height: calc(100svh - 72px);
  overflow: hidden;
  isolation: isolate;
  padding: 30px 0 28px;
  color: #f4f9ff;
  background:
    linear-gradient(110deg, rgba(3, 13, 27, .96) 0%, rgba(7, 28, 52, .82) 42%, rgba(7, 44, 77, .55) 100%),
    url("./assets/weconnect-hero-bg.svg") center / cover no-repeat;
}

.philips-hero-poster::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(circle at 78% 40%, rgba(73, 181, 242, .24), transparent 32%), linear-gradient(180deg, transparent 55%, rgba(2, 13, 29, .48));
}

.philips-hero-inner {
  position: relative;
  z-index: 1;
  min-height: 100%;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 20px;
  transform: translateY(18px);
}

.philips-poster-meta {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  color: rgba(244, 249, 255, .72);
  font-size: 12px;
  line-height: 1.35;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.philips-poster-meta p { margin: 0; }
.philips-poster-meta p:last-child { text-align: right; }

.philips-hero-layout {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
  gap: clamp(28px, 4vw, 56px);
  align-items: center;
}

.philips-hero-copy { align-self: start; padding-top: 34px; }
.philips-hero-copy > span { display: block; color: #8fcfff; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }
.philips-hero-copy h1 { max-width: 620px; margin: 20px 0 24px; color: #f4f9ff; font-size: clamp(42px, 5vw, 72px); line-height: 1.12; letter-spacing: -.045em; }
.philips-hero-copy h1 span { display: block; color: #8fcfff; font-style: italic; }
.philips-hero-copy p { max-width: 520px; margin: 0; color: rgba(244, 249, 255, .74); font-size: 17px; line-height: 1.7; }

.philips-hero-visual { margin: 0; align-self: center; justify-self: end; width: min(100%, 720px); }
.philips-hero-visual img { display: block; width: 100%; height: auto; border-radius: 28px; box-shadow: 0 28px 70px rgba(0, 10, 26, .42); }
.philips-hero-visual figcaption { display: flex; justify-content: space-between; gap: 20px; margin-top: 12px; color: rgba(244, 249, 255, .56); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.philips-hero-visual figcaption span { color: #8fcfff; }
.philips-hero-visual figcaption small { text-align: right; }

.philips-hero-facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.philips-hero-facts div { padding-top: 12px; border-top: 1px solid rgba(244, 249, 255, .2); }
.philips-hero-facts small { display: block; color: rgba(244, 249, 255, .54); font-size: 10px; letter-spacing: .11em; text-transform: uppercase; }
.philips-hero-facts b { font-size: 14px; font-weight: 400; }

@media (max-width: 800px) {
  .philips-hero { min-height: auto; padding-top: 64px; }
  .philips-hero-poster { min-height: auto; padding: 24px 0 22px; }
  .philips-hero-inner { gap: 22px; transform: none; }
  .philips-poster-meta { flex-direction: column; gap: 8px; }
  .philips-poster-meta p:last-child { text-align: left; }
  .philips-hero-layout { grid-template-columns: 1fr; gap: 30px; }
  .philips-hero-copy { padding-top: 12px; }
  .philips-hero-copy h1 { font-size: clamp(36px, 9vw, 52px); line-height: 1.2; }
  .philips-hero-copy p { font-size: 14px; }
  .philips-hero-visual { width: 100%; }
  .philips-hero-visual figcaption { flex-direction: column; align-items: flex-start; gap: 5px; }
  .philips-hero-visual figcaption small { text-align: left; }
  .philips-hero-facts { grid-template-columns: 1fr 1fr; gap: 12px; }
}

/* Jordan hero uses one atmospheric canvas instead of a split card layout. */
.jordan-hero { grid-template-columns:minmax(0,1fr); }
.jordan-hero-main { position:relative; display:block; width:100%; min-height:0; overflow:hidden; }
.jordan-hero-copy { position:relative; z-index:4; width:48%; padding-top:8%; }
.jordan-hero-visual { position:absolute; inset:0; z-index:1; min-height:0; border-radius:0; background:none; }
.jordan-hero-visual::before { content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg,#090909 0%,rgba(9,9,9,.94) 26%,rgba(9,9,9,.54) 47%,rgba(9,9,9,.08) 76%,rgba(9,9,9,.16) 100%),linear-gradient(180deg,#090909 0%,transparent 24%,rgba(9,9,9,.04) 70%,#090909 100%); pointer-events:none; }
.jordan-hero-visual::after { background:linear-gradient(0deg,rgba(5,5,5,.45),transparent 44%); }
.jordan-cover-scene { inset:auto 0 0; width:100%; height:92%; object-position:center 61%; opacity:.64; filter:saturate(.68) contrast(1.04); }
.jordan-cover-hand { right:5%; bottom:-35%; height:132%; }
.jordan-hero-visual figcaption { display:none; }

@media (max-width: 720px) {
  .jordan-hero-main { min-height:520px; }
  .jordan-hero-copy { width:100%; padding-top:4%; }
  .jordan-cover-scene { height:70%; opacity:.58; object-position:center 58%; }
  .jordan-cover-hand { right:-9%; bottom:-13%; height:74%; }
  .jordan-hero-visual::before { background:linear-gradient(180deg,#090909 0%,rgba(9,9,9,.9) 25%,rgba(9,9,9,.28) 57%,#090909 100%); }
}

/* iConnect case refinements from review. */
.iconnect-hero-visual { overflow:visible; border-radius:0; background:none; }
.iconnect-desktop-shot { width:92%; right:0; top:11%; border-radius:12px; }
.iconnect-phone-shot { width:14%; height:48%; left:1%; bottom:3%; object-fit:cover; object-position:top; border-width:4px; border-radius:15px; }
.iconnect-architecture { display:block; padding:38px; border-color:rgba(62,126,255,.2); border-radius:28px; background:linear-gradient(145deg,rgba(24,42,68,.66),rgba(8,11,16,.25)); }
.iconnect-role-list { min-height:0; display:grid; grid-template-columns:.34fr 1fr; align-items:center; padding:0 0 30px; border:0; border-radius:0; border-bottom:1px solid var(--line); }
.iconnect-role-list > div { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.iconnect-role-list b { padding:13px 12px; border:1px solid var(--line); border-radius:99px; text-align:center; font-size:13px; font-weight:400; }
.iconnect-architecture-link { display:flex; align-items:center; justify-content:space-between; padding:18px 0; color:var(--muted); font-size:11px; letter-spacing:.08em; }
.iconnect-architecture-link i { color:var(--accent); font-style:normal; }
.iconnect-platform-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.iconnect-platform-grid article { min-height:240px; display:flex; flex-direction:column; padding:24px; border:1px solid var(--line); border-radius:18px; }
.iconnect-platform-grid article strong { margin-top:auto; font-size:25px; font-weight:400; }
.iconnect-platform-grid article p { color:var(--muted); font-size:12px; }
.iconnect-platform-grid article small { color:var(--muted); font-size:9px; letter-spacing:.12em; }
.iconnect-platform-grid article.primary { color:white; border-color:rgba(84,145,255,.55); background:linear-gradient(145deg,#285fbf,#152a4c); }
.iconnect-platform-grid article.primary small,.iconnect-platform-grid article.primary p { color:rgba(255,255,255,.7); }
.iconnect-process { display:grid; grid-template-columns:.34fr 1fr; gap:28px; align-items:start; margin-top:22px; padding:28px 38px; border:0; border-bottom:1px solid var(--line); }
.iconnect-process-intro { padding-top:12px; }.iconnect-process-intro small { color:var(--accent); font-size:9px; letter-spacing:.12em; }.iconnect-process-intro p { max-width:190px; margin:14px 0 0; color:var(--muted); font-size:11px; line-height:1.7; }
.iconnect-process-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:0; padding:0; list-style:none; }
.iconnect-process-steps li { position:relative; min-height:150px; padding:16px; border:1px solid rgba(155,199,229,.18); border-radius:12px; background:linear-gradient(145deg,rgba(155,199,229,.06),rgba(255,255,255,.012)); }
.iconnect-process-steps li:not(:last-child)::after { content:"→"; position:absolute; z-index:1; right:-19px; top:50%; transform:translateY(-50%); color:var(--accent); font-size:16px; }
.iconnect-process-steps b { display:block; color:var(--accent); font-size:9px; font-weight:400; letter-spacing:.1em; }.iconnect-process-steps strong { display:block; margin-top:26px; font-size:16px; font-weight:400; line-height:1.3; }.iconnect-process-steps p { margin:10px 0 0; color:var(--muted); font-size:11px; line-height:1.6; }
.iconnect-mobile-gallery { grid-template-columns:1fr 1fr .92fr; padding:42px; }
.iconnect-structure-section { padding-top: 58px; }
.iconnect-structure-section .case-section-head { margin-bottom: 48px; }
.iconnect-mobile-gallery { grid-template-columns:repeat(3,1fr) .92fr; align-items:start; }
.iconnect-mobile-gallery figure > div { height:auto; overflow:visible; }
.iconnect-mobile-gallery figure > div img { border-radius:18px; box-shadow:0 22px 48px rgba(10,42,86,.16); }
.iconnect-status-model { min-height:530px; display:flex; flex-direction:column; padding:30px; color:white; border-radius:20px; background:linear-gradient(160deg,#183c75,#0d1727); }
.iconnect-status-model > span { color:#8fb9ff; font-size:9px; letter-spacing:.12em; }
.iconnect-status-model > strong { margin-top:25px; font-size:28px; line-height:1.25; font-weight:400; }
.iconnect-status-model > div { display:grid; gap:10px; margin-top:auto; }
.iconnect-status-model b { display:flex; justify-content:space-between; align-items:center; padding:15px; border:1px solid rgba(255,255,255,.16); border-radius:12px; font-weight:400; }
.iconnect-status-model b.active { color:#07101e; border-color:transparent; background:#8db8ff; }
.iconnect-status-model small { color:inherit; opacity:.68; }
.iconnect-status-model i { justify-self:center; color:#8fb9ff; font-style:normal; transform:rotate(90deg); }
.iconnect-status-model { grid-column:1 / -1; min-height:0; display:grid; grid-template-columns:.34fr 1fr; gap:28px; align-items:start; padding:28px 0 0; color:#17396e; border:0; border-top:1px solid rgba(14,59,112,.2); border-radius:0; background:none; }
.iconnect-status-model > span { padding-top:4px; color:#52647d; }
.iconnect-status-model > strong { margin:0; color:#17396e; font-size:24px; line-height:1.3; }
.iconnect-status-model > div { display:grid; grid-template-columns:1fr auto 1fr auto 1fr; gap:10px; align-items:center; margin-top:24px; }
.iconnect-status-model b { color:#17396e; border-color:rgba(14,59,112,.24); background:rgba(255,255,255,.34); }
.iconnect-status-model b.active { color:white; background:#2358a8; }
.iconnect-status-model i { color:#2358a8; transform:none; }
.iconnect-status-model-copy { display:flex !important; flex-direction:column; gap:8px; margin:0 !important; }
.iconnect-status-model-copy > span { padding:0; }
.iconnect-status-model-copy > strong { margin:0; color:#17396e; font-size:24px; line-height:1.3; }
.iconnect-status-model-flow { display:grid !important; grid-template-columns:1fr auto 1fr auto 1fr !important; gap:10px !important; align-items:center; margin:0 !important; }
.iconnect-status-model-flow b { min-width:0; white-space:nowrap; }
.iconnect-status-model-flow small { display:block; margin-left:10px; }
.iconnect-toolbar-focus { display:grid; grid-template-columns:1.05fr .95fr; gap:38px; align-items:center; margin:42px 0; padding:26px; border:1px solid rgba(35,82,143,.14); border-radius:20px; background:rgba(255,255,255,.56); }
.iconnect-toolbar-focus > div { position:relative; height:180px; overflow:hidden; border-radius:14px; background:#dce8f8; }
.iconnect-toolbar-focus img { position:absolute; width:235%; max-width:none; left:-67%; bottom:-6%; }
.iconnect-toolbar-focus figcaption { display:block; padding:8px 18px; }
.iconnect-toolbar-focus figcaption span { color:#52647d; font-size:9px; letter-spacing:.12em; }
.iconnect-toolbar-focus figcaption strong { display:block; margin:18px 0 12px; font-size:28px; line-height:1.25; }
.iconnect-toolbar-focus figcaption p { margin:0; color:#52647d; line-height:1.7; }
.iconnect-component-system { display:grid; grid-template-columns:.36fr 1fr; gap:42px; align-items:start; margin-top:56px; padding:34px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.iconnect-component-system > div:first-child span { color:var(--accent); font-size:9px; letter-spacing:.12em; }
.iconnect-component-system > div:first-child strong { display:block; margin-top:18px; font-size:25px; line-height:1.35; font-weight:400; }
.iconnect-component-strip { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:0; background:none; }
.iconnect-component-strip span { min-height:92px; display:flex; flex-direction:column; align-items:flex-start; justify-content:space-between; padding:16px; border:1px solid var(--line); border-radius:14px; background:linear-gradient(145deg,#121923,#0b0e13); text-align:left; }
.iconnect-component-strip span b { color:var(--accent); font-size:9px; font-weight:400; }
.iconnect-delivery-grid .verified { color:white; border-color:#4f8df5; background:linear-gradient(145deg,#286bd9,#183967); }
.iconnect-delivery-grid .verified span,.iconnect-delivery-grid .verified p { color:rgba(255,255,255,.76); }

@media (max-width: 720px) {
  .iconnect-platform-section { display:block; min-height:0; padding-block:64px; }
  .iconnect-platform-showcase { grid-template-columns:1fr; gap:34px; }
  .iconnect-platform-copy h2 { font-size:clamp(34px,10vw,46px); }
  .iconnect-platform-components { margin-top:34px; }
  .iconnect-hero-visual { min-height:270px; }
  .iconnect-desktop-shot { width:92%; right:-7%; top:14%; }
  .iconnect-phone-shot { width:18%; height:45%; left:1%; bottom:4%; }
  .iconnect-architecture { padding:22px; }
  .iconnect-role-list,.iconnect-process { grid-template-columns:1fr; gap:18px; }
  .iconnect-role-list > div { grid-template-columns:1fr 1fr; }
  .iconnect-platform-grid { grid-template-columns:1fr; }
  .iconnect-platform-grid article { min-height:190px; }
  .iconnect-process { padding:24px 0; }
  .iconnect-process { padding:24px 0; }
  .iconnect-process-steps { grid-template-columns:1fr; gap:10px; }
  .iconnect-process-steps li { min-height:0; padding:16px 18px; }
  .iconnect-process-steps li:not(:last-child)::after { right:auto; left:50%; top:auto; bottom:-18px; transform:translateX(-50%) rotate(90deg); }
  .iconnect-process-steps strong { margin-top:12px; }
  .iconnect-structure-section { padding-top: 48px; }
  .iconnect-mobile-gallery { grid-template-columns:1fr; padding:24px; }
  .iconnect-mobile-gallery figure > div { height:auto; }
  .iconnect-status-model { grid-template-columns:1fr; gap:12px; padding-top:22px; }
  .iconnect-status-model-copy > strong { font-size:22px; }
  .iconnect-status-model-flow { grid-template-columns:1fr !important; gap:8px !important; margin-top:8px !important; }
  .iconnect-status-model-flow i { justify-self:center; transform:rotate(90deg); }
  .iconnect-toolbar-focus,.iconnect-component-system { grid-template-columns:1fr; }
  .iconnect-toolbar-focus { padding:16px; }
  .iconnect-toolbar-focus > div { height:150px; }
  .iconnect-toolbar-focus img { width:260%; left:-80%; }
  .iconnect-component-strip { grid-template-columns:1fr 1fr; }
}

/* Global typography scale: calmer headlines, lighter copy, and safer mixed-font leading. */
body { font-weight:300; }
.italic,
.case-hero h1 span,
.volvo-hero-copy h1 span,
.project-result strong { margin-right:.14em; }
.hero-title { font-size:clamp(62px,10.5vw,150px); line-height:1; font-weight:400; }
.display-title { font-size:clamp(32px,3.9vw,56px); line-height:1.3; }
.project-copy h3 { font-size:clamp(28px,3.2vw,48px); line-height:1.28; }
.contact-title { font-size:clamp(32px,3.8vw,52px); line-height:1.28; }
.case-hero h1 { font-size:clamp(44px,6.1vw,86px); line-height:1.2; font-weight:400; }
.case-section h2 { font-size:clamp(30px,3.7vw,50px); line-height:1.3; }
.principle p { font-size:clamp(24px,2.8vw,38px); line-height:1.36; }
.lynk-hero-copy h1 { font-size:clamp(36px,4.1vw,58px); line-height:1.2; }
.volvo-hero-copy h1 { font-size:clamp(44px,5.3vw,76px); line-height:1.15; }
.volvo-track h3 { font-size:clamp(32px,3.7vw,50px); line-height:1.16; }
.volvo-switch h2 { font-size:clamp(34px,4.2vw,60px); line-height:1.1; }
.iconnect-hero-copy h1 { font-size:clamp(36px,4.1vw,58px); line-height:1.2; }
.jordan-hero-copy h1 { font-size:clamp(38px,4.4vw,62px); line-height:1.18; }
.jordan-feature-copy h3 { font-size:clamp(28px,3.1vw,42px); line-height:1.28; }

@media (max-width: 720px) {
  .hero-title { font-size:clamp(50px,12.5vw,72px); line-height:1.06; }
  .display-title { font-size:clamp(28px,7.8vw,40px); line-height:1.36; }
  .case-hero h1 { font-size:clamp(34px,8.8vw,46px); line-height:1.26; }
  .case-section h2 { font-size:clamp(27px,7.4vw,38px); line-height:1.36; }
  .case-snapshot { padding:38px 0 48px; }
  .case-snapshot-head { display:block; margin-bottom:28px; }
  .case-snapshot-head h2 { margin-top:12px; font-size:24px; text-align:left; }
  .case-snapshot-grid { grid-template-columns:1fr; }
  .case-snapshot-grid article,.case-snapshot-grid article:nth-child(1),.case-snapshot-grid article:nth-child(2),.case-snapshot-grid article:nth-child(3),.case-snapshot-grid article:nth-child(4),.case-snapshot-grid article:nth-child(5) { grid-column:auto; min-height:0; padding:18px 0 22px; border-right:0; border-bottom:1px solid var(--line); }
  .case-snapshot-grid article + article,.case-snapshot-grid article:last-child { padding-left:0; }
  .case-snapshot-grid.eight-up article,.case-snapshot-grid.eight-up article:nth-child(n) { grid-column:auto; min-height:0; padding:18px 0 22px; border-right:0; border-bottom:1px solid var(--line); }
  .case-snapshot-grid span { margin-bottom:10px; }
  .case-story-grid { grid-template-columns:1fr; }
  .case-story-grid article,.case-story-grid article:nth-child(n) { grid-column:auto; min-height:0; padding:18px 0 22px; border-left:0; border-right:0; border-bottom:1px solid var(--line); }
  .case-story-grid span { margin-bottom:10px; }
  .case-story-grid strong { font-size:19px; }
  .contact-title { font-size:clamp(28px,7.8vw,40px); line-height:1.32; }
  .lynk-hero-copy h1,.volvo-hero-copy h1,.iconnect-hero-copy h1,.jordan-hero-copy h1 { font-size:clamp(34px,8.8vw,46px); line-height:1.26; }
}

/* Readability floor: Latin labels stay compact; Chinese and mixed facts stay legible. */
latin-text { font-size:max(12px, 1em); }
.eyebrow,
.section-index,
.hero-kicker,
.availability,
.scroll-cue,
.footer-line,
.iconnect-architecture-link i,
.volvo-state-head > i { font-size:12px !important; }

.row-detail,
.project-result span,
.capability small,
.workflow small,
.case-snapshot-grid p,
.stat-strip span,
.ecosystem-diagram p,
.ecosystem-return p,
.repair-steps p,
.repair-question p,
.repair-question i,
.status-example > span,
.status-example .status-yes,
.status-system-note span,
.mapping-table,
.mapping-table th,
.ai-track article p,
.lynk-hero-facts b,
.lynk-community-decisions span,
.lynk-placeholder span,
.lynk-replace-note strong,
.lynk-concept-note p,
.volvo-hero-facts b,
.volvo-track > strong,
.volvo-ia-title small,
.volvo-ia-groups p,
.volvo-service-shots figcaption,
.volvo-app-system > div span,
.volvo-guideline-panel > figcaption p,
.volvo-component-matrix figcaption,
.volvo-rep-copy b,
.volvo-compare-pair figcaption,
.iconnect-hero-facts b,
.iconnect-role-list b,
.iconnect-architecture-link,
.iconnect-architecture article p,
.iconnect-platform-grid article p,
.iconnect-mobile-gallery figcaption,
.iconnect-live-main figcaption,
.iconnect-live-pair figcaption,
.iconnect-admin-layout figcaption,
.iconnect-scale small,
.jordan-hero-facts b,
.jordan-orbit span,
.jordan-placeholder > div > span,
.jordan-screen-placeholder > span,
.jordan-feature-copy b,
.jordan-screen-placeholder figcaption,
.jordan-loop small,
.jordan-result-grid small,
.jordan-data-note,
.jordan-before-screen i,
.jordan-screen span,
.jordan-detail-crop span,
.jordan-fragment-visual span,
.jordan-hero-visual figcaption,
.phone-screen.status-screen small,
.ecosystem-label small,
.iconnect-status-model small { font-size:14px !important; }

.caption > span,
.volvo-state-head span { font-size:12px !important; }

@media (max-width: 720px) {
  .lynk-hero-copy > p,
  .volvo-hero-copy p,
  .volvo-hero-map p,
  .volvo-app-cloud span,
  .iconnect-hero-copy p,
  .jordan-hero-copy p { font-size:14px !important; }
}

/* Portfolio-wide type baseline: restrained headlines, open mixed-script leading. */
:root {
  --title-leading: 1.24;
  --body-leading: 1.72;
}

body { line-height: var(--body-leading); }
.hero-title {
  font-size: clamp(58px, 9.2vw, 132px);
  line-height: 1.02;
  letter-spacing: -.065em;
}
.display-title,
.section-heading .display-title {
  font-size: clamp(30px, 3.45vw, 50px);
  line-height: var(--title-leading);
  letter-spacing: -.035em;
}
.project-copy h3,
.case-hero h1,
.case-section h2,
.lynk-hero-copy h1,
.volvo-hero-copy h1,
.iconnect-hero-copy h1,
.jordan-hero-copy h1,
.contact-title {
  line-height: var(--title-leading);
}
.case-hero h1 { font-size: clamp(42px, 5.55vw, 78px); }
.case-section h2 { font-size: clamp(28px, 3.45vw, 46px); }
.project-copy h3 { font-size: clamp(27px, 3.05vw, 46px); }
.contact-title { font-size: clamp(30px, 3.55vw, 48px); }
.serif,
.italic,
.latin-script,
.project-result strong,
.timeline time,
.capability > span,
.project-number,
.volvo-hero-copy h1 span,
.jordan-hero-copy h1 span {
  font-family: inherit;
}
.italic,
.case-hero h1 span,
.volvo-hero-copy h1 span,
.project-result strong {
  display: inline-block;
  margin-right: .16em;
  font-style: italic;
}

@media (max-width: 720px) {
  .hero-title { font-size: clamp(48px, 13.5vw, 72px); line-height: 1.06; }
  .display-title,
  .section-heading .display-title { font-size: clamp(27px, 7.2vw, 38px); line-height: 1.34; }
  .case-hero h1 { font-size: clamp(34px, 8.2vw, 44px); line-height: 1.28; }
  .case-section h2 { font-size: clamp(26px, 7vw, 36px); line-height: 1.38; }
  .project-copy h3 { font-size: clamp(26px, 6.8vw, 36px); line-height: 1.34; }
  .contact-title { font-size: clamp(27px, 7.2vw, 38px); line-height: 1.36; }
}

/* iConnect hero refresh */
.iconnect-hero.case-hero {
  height: auto;
  min-height: 100svh;
  padding: 72px 0 0;
  display: block;
  justify-content: initial;
}

.iconnect-hero-poster {
  position: relative;
  min-height: calc(100svh - 72px);
  overflow: hidden;
  isolation: isolate;
  padding: 28px 0 20px;
  color: #f4f9ff;
  background:
    radial-gradient(circle at 72% 18%, rgba(41, 99, 157, .16), transparent 38%),
    linear-gradient(180deg, rgba(8, 32, 62, .08) 0%, rgba(5, 24, 49, .12) 52%, rgba(3, 17, 36, .36) 100%),
    url("./assets/iconnect-hero-bg.svg") center center / cover no-repeat;
}

.iconnect-hero-poster::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(110deg, rgba(150, 204, 255, .04), transparent 38%, transparent 72%, rgba(2, 21, 46, .14)),
    linear-gradient(180deg, rgba(73, 132, 192, .04), transparent 54%, rgba(2, 18, 40, .12));
}

.iconnect-hero-poster::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .12;
  background-image:
    linear-gradient(rgba(255, 255, 255, .08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .06) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, #000, transparent 84%);
}

.iconnect-hero-inner {
  position: relative;
  z-index: 1;
  min-height: 100%;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 16px;
  transform: translateY(24px);
}

.iconnect-poster-meta {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  color: rgba(244, 249, 255, .70);
  font-size: 12px;
  line-height: 1.35;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.iconnect-poster-meta p {
  margin: 0;
}

.iconnect-poster-meta p:last-child {
  text-align: right;
}

.iconnect-hero-layout {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 813px);
  gap: clamp(28px, 3vw, 40px);
  align-items: center;
}

.iconnect-hero-copy {
  align-self: start;
  padding-top: 12px;
}

.iconnect-hero-copy > span {
  display: block;
  color: #8db8ff;
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.iconnect-hero-copy h1 {
  max-width: 700px;
  margin: 20px 0 22px;
  color: #f4f9ff;
  font-size: clamp(38px, 4.35vw, 64px);
  line-height: 1.08;
  letter-spacing: -.045em;
}

.iconnect-hero-copy h1 span {
  display: block;
  color: #8db8ff;
  font-family: inherit;
  font-style: italic;
  font-weight: inherit;
}

.iconnect-hero-copy p {
  max-width: 600px;
  margin: 0;
  color: rgba(244, 249, 255, .72);
  font-size: 16px;
  line-height: 1.68;
}

.iconnect-hero-visual {
  margin: 0;
  align-self: center;
  justify-self: end;
  width: 100%;
  max-width: 813px;
  transform: translateY(20px);
}

.iconnect-hero-visual-frame {
  position: relative;
  overflow: visible;
  aspect-ratio: 1475 / 868;
  transform: translateY(32px);
  border-radius: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.iconnect-hero-visual-frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}

.iconnect-hero-visual figcaption {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  margin-top: 10px;
  color: rgba(244, 249, 255, .55);
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.iconnect-hero-visual figcaption span {
  color: #8db8ff;
}

.iconnect-hero-visual figcaption small {
  max-width: 380px;
  text-align: right;
}

.iconnect-hero-facts {
  display: grid;
  grid-template-columns: .8fr .8fr 1.4fr;
  gap: 20px;
  margin-top: 8px;
  transform: translateY(68px);
}

.iconnect-hero-facts div {
  padding-top: 12px;
  border-top: 1px solid rgba(244, 249, 255, .16);
}

.iconnect-hero-facts small {
  display: block;
  color: rgba(244, 249, 255, .52);
  font-size: 9px;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.iconnect-hero-facts b {
  font-size: 14px;
  font-weight: 400;
}

@media (max-width: 800px) {
  .iconnect-hero.case-hero {
    min-height: auto;
    padding-top: 64px;
  }

  .iconnect-hero-poster {
    min-height: auto;
    padding: 22px 0 18px;
    background-position: 58% center;
  }

  .iconnect-hero-inner {
    gap: 18px;
    transform: none;
  }

  .iconnect-poster-meta {
    flex-direction: column;
    gap: 8px;
  }

  .iconnect-poster-meta p:last-child {
    text-align: left;
  }

  .iconnect-hero-layout {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .iconnect-hero-visual,
  .iconnect-hero-facts {
    transform: none;
  }

  .iconnect-hero-copy h1 {
    font-size: clamp(32px, 8.4vw, 46px);
    line-height: 1.14;
  }

  .iconnect-hero-copy p {
    font-size: 14px;
  }

  .iconnect-hero-visual-frame {
    transform: translateY(16px);
    border-radius: 0;
  }

  .iconnect-hero-visual figcaption {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .iconnect-hero-visual figcaption small {
    max-width: none;
    text-align: left;
  }

  .iconnect-hero-facts {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }

  .iconnect-hero-facts div:last-child {
    grid-column: 1 / -1;
  }
}

/* Home hero: the red/black striped backdrop sets a dark editorial tone. */
.home .site-header {
  color: var(--ink);
  background: transparent;
  backdrop-filter: none;
  transition: background-color .45s ease, box-shadow .45s ease;
}
/* 页面下滑后给固定导航叠一层遮罩，保证滚动内容穿过时不干扰阅读 */
.home .site-header.is-scrolled {
  background-color: rgba(10, 10, 10, .9);
  backdrop-filter: blur(16px) saturate(1.2);
  -webkit-backdrop-filter: blur(16px) saturate(1.2);
  box-shadow: 0 1px 0 rgba(245, 242, 234, .14);
}
.home .site-nav a { color: rgba(245,242,234,.72); }
.home .site-nav a:hover,
.home .site-nav a.is-active { color: var(--ink); }
.home .hero { color: var(--ink); }
.home .hero::before,
.home .hero::after {
  content:none;
}
.home .hero-kicker {
  padding-bottom: 0;
  border-bottom: 0;
  color: rgba(245,242,234,.78);
  font-weight: 500;
  font-size: clamp(12px, 1vw, 14px);
}
.home .hero-stage {
  display: flex;
  flex-direction: column;
  align-items:flex-start;
  justify-content: center;
  gap: clamp(26px,3.5vh,42px);
  padding-block: clamp(34px,6vh,66px);
}
.home .hero-title {
  width:min(90%,1280px);
  margin: 0;
  align-self:flex-start;
  font-family:"Avenir Next Condensed","Helvetica Neue Condensed","Arial Narrow",sans-serif;
  font-weight:800;
  font-style:normal;
  line-height:.8;
  text-transform:uppercase;
  transform:none;
}
/* app.js wraps Latin runs in .latin-script (a serif stack); let each line keep
   the family it declares instead of being forced to serif. */
.home .hero-title .latin-script { font-family: inherit; }
/* Both words carry the headline now: "Product" sits at full title scale above
   "Designer" instead of being demoted to a small tracked-out classification
   slug, so the two words read together as the main title. */
.home .hero-title span:first-child {
  display:block;
  margin:0 0 .08em;
  color:var(--accent);
  font-family:inherit;
  font-style:normal;
  font-weight:600;
  font-size:clamp(43px,10.8vw,151px);
  letter-spacing:-.016em;
  line-height:.86;
  text-transform:uppercase;
  transform:none;
}
/* "Designer" is the subject — large but not a dead slab: the word is eased
   down, tracked more openly, and the closing "er" is drawn as an open outline
   in the accent colour so the title has two weights of its own. */
.home .hero-title span:last-child {
  display:block;
  margin:0;
  color:var(--ink);
  font-family:inherit;
  font-style:normal;
  font-weight:800;
  font-size:clamp(50px,12.6vw,176px);
  letter-spacing:-.018em;
  line-height:.88;
  text-transform:uppercase;
  transform:none;
}
.home .hero-title .hero-mark,
.home .hero-title .hero-mark .latin-script {
  font-style:normal;
  color:transparent;
  -webkit-text-stroke:clamp(1.5px,.18vw,2.9px) rgba(94,234,212,.55);
}
/* The lower band of the artwork is light, so the footer copy flips dark. */
.home .availability,
.home .scroll-cue { color: rgba(20,21,24,.84); }
.home .availability { font-size: clamp(12px, 1vw, 14px); font-weight: 500; }
.home .hero-bottom {
  padding-top: 0;
  border-top: 0;
}
.home .hero-bottom > div,
.home .hero-focus {
  width:fit-content;
  padding:3px 0 3px 14px;
  color:#15161a;
  border-left:3px solid rgba(21,22,26,.72);
}
.home .hero-focus { justify-self:end; }
.home .hero-bottom .availability { color: rgba(20,21,24,.84); }
.home .hero-focus i { color: rgba(21,22,26,.5); }
.home .scroll-cue i { color: rgba(21,22,26,.55); }
.home .availability i { background: rgba(21,22,26,.75); box-shadow: none; }

@media (max-width:720px) {
  .home .site-header { color: var(--ink); }
  .home .hero::before,
  .home .hero::after { content:none; }
  .home .hero-background {
    display:block;
    inset:0;
    width:100%;
    height:100%;
    object-position:center;
    opacity:1;
  }
  .home .hero-stage {
    align-items:flex-start;
    gap:28px;
    padding:46px 0 38px;
  }
  .home .hero-title {
    width:100%;
    transform:none;
  }
  .home .hero-title { align-self:flex-start; }
  .home .hero-title span:first-child {
    margin:0 0 .1em;
    font-size:clamp(34px,14.6vw,82px);
    letter-spacing:-.012em;
  }
  .home .hero-title span:last-child {
    font-size:clamp(40px,17vw,96px);
    letter-spacing:-.014em;
  }
  .home .hero-title .hero-mark,
  .home .hero-title .hero-mark .latin-script {
    -webkit-text-stroke-width:1.5px;
  }
  .home .hero-bottom > div,
  .home .hero-focus {
    color:#15161a;
    background:none;
  }
  .home .hero-bottom .availability { color: rgba(20,21,24,.84); }
  .home .scroll-cue { color: rgba(20,21,24,.84); }
  .home .hero-bottom { gap:22px; }
}

/* Keep the Philips poster rules after the portfolio-wide case-hero defaults. */
.philips-hero.case-hero { height:auto; min-height:100svh; padding:72px 0 0; display:block; }
.philips-hero-poster { position:relative; min-height:calc(100svh - 72px); overflow:hidden; isolation:isolate; padding:30px 0 28px; color:#f4f9ff; background:linear-gradient(110deg,rgba(3,13,27,.96) 0%,rgba(7,28,52,.82) 42%,rgba(7,44,77,.55) 100%),url("./assets/weconnect-hero-bg.svg") center / cover no-repeat; }
.philips-hero-poster::after { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; background:radial-gradient(circle at 78% 40%,rgba(73,181,242,.24),transparent 32%),linear-gradient(180deg,transparent 55%,rgba(2,13,29,.48)); }
.philips-hero-inner { position:relative; z-index:1; min-height:100%; display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:20px; transform:translateY(18px); }
.philips-poster-meta { display:flex; justify-content:space-between; gap:24px; color:rgba(244,249,255,.72); font-size:12px; line-height:1.35; letter-spacing:.08em; text-transform:uppercase; }
.philips-poster-meta p { margin:0; }
.philips-poster-meta p:last-child { text-align:right; }
.philips-hero-layout { min-height:0; display:grid; grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr); gap:clamp(28px,4vw,56px); align-items:center; }
.philips-hero-copy { align-self:start; padding-top:34px; }
.philips-hero-copy > span { display:block; color:#8fcfff; font-size:11px; letter-spacing:.14em; text-transform:uppercase; }
.philips-hero-copy h1 { max-width:620px; margin:20px 0 24px; color:#f4f9ff; font-size:clamp(42px,5vw,72px); line-height:1.12; letter-spacing:-.045em; }
.philips-hero-copy h1 span { display:block; color:#8fcfff; font-style:italic; }
.philips-hero-copy p { max-width:520px; margin:0; color:rgba(244,249,255,.74); font-size:17px; line-height:1.7; }
.philips-hero-visual { margin:0; align-self:center; justify-self:end; width:min(100%,720px); }
.philips-hero-visual img { display:block; width:100%; height:auto; border-radius:18px; box-shadow:0 20px 48px rgba(0,10,26,.28); filter:saturate(.86) contrast(1.04); }
.philips-hero-visual figcaption { display:flex; justify-content:space-between; gap:20px; margin-top:12px; color:rgba(244,249,255,.56); font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.philips-hero-visual figcaption span { color:#8fcfff; }
.philips-hero-visual figcaption small { text-align:right; }
.philips-hero-facts { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.philips-hero-facts div { padding-top:12px; border-top:1px solid rgba(244,249,255,.2); }
.philips-hero-facts small { display:block; color:rgba(244,249,255,.54); font-size:10px; letter-spacing:.11em; text-transform:uppercase; }
.philips-hero-facts b { font-size:14px; font-weight:400; }
@media (max-width:800px) {
  .philips-hero.case-hero { min-height:auto; padding-top:64px; }
  .philips-hero-poster { min-height:auto; padding:24px 0 22px; }
  .philips-hero-inner { gap:22px; transform:none; }
  .philips-poster-meta { flex-direction:column; gap:8px; }
  .philips-poster-meta p:last-child { text-align:left; }
  .philips-hero-layout { grid-template-columns:1fr; gap:30px; }
  .philips-hero-copy { padding-top:12px; }
  .philips-hero-copy h1 { font-size:clamp(36px,9vw,52px); line-height:1.2; }
  .philips-hero-copy p { font-size:14px; }
  .philips-hero-visual { width:100%; }
  .philips-hero-visual figcaption { flex-direction:column; align-items:flex-start; gap:5px; }
  .philips-hero-visual figcaption small { text-align:left; }
  .philips-hero-facts { grid-template-columns:1fr 1fr; gap:12px; }
}

/* iConnect flow panel: four real screens, shown as one complete task path. */
.iconnect-mobile-gallery { grid-template-columns:repeat(4,1fr); align-items:start; }
.iconnect-mobile-gallery > figure > div { height:auto; overflow:visible; }
.iconnect-mobile-gallery > figure > div img { display:block; width:100%; height:auto; border-radius:18px; box-shadow:0 22px 48px rgba(10,42,86,.16); }
.iconnect-desktop-flow { align-self:start; padding-top:0; }
.iconnect-desktop-flow > div { display:flex; align-items:center; min-height:0; background:transparent; }
.iconnect-desktop-flow > div img { border-radius:12px; }
@media (max-width:800px) {
  .iconnect-mobile-gallery { grid-template-columns:1fr; }
  .iconnect-desktop-flow { align-self:start; padding-top:0; }
}

/* Final Philips visual direction: light canvas with a floating abstract CT scanner. */
.philips-hero-poster { color:#152632; background:radial-gradient(circle at 78% 42%,rgba(124,202,211,.28),transparent 30%),linear-gradient(135deg,#f7fbfc 0%,#e7f1f3 58%,#d5e7eb 100%); }
.philips-hero-poster::after { background:linear-gradient(135deg,transparent 48%,rgba(64,134,151,.08) 48%,transparent 49%),linear-gradient(180deg,transparent 62%,rgba(34,85,103,.09)); }
.philips-poster-meta { color:rgba(21,38,50,.62); }
.philips-hero-copy > span { color:#287b91; }
.philips-hero-copy h1 { color:#152632; }
.philips-hero-copy h1 span { color:#287b91; }
.philips-hero-copy p { color:rgba(21,38,50,.68); }
.philips-hero-visual img { border-radius:0; box-shadow:none; filter:none; }
.philips-hero-visual figcaption { color:rgba(21,38,50,.52); }
.philips-hero-visual figcaption span { color:#287b91; }
.philips-hero-facts div { border-top-color:rgba(21,38,50,.2); }
.philips-hero-facts small { color:rgba(21,38,50,.52); }
@media (max-width:800px) { .philips-hero-poster { background:linear-gradient(180deg,#f7fbfc 0%,#e1eef1 100%); } }

/* WeConnect hero: a dark editorial canvas with a restrained service-system texture. */
.philips-hero-poster {
  color:#f2efe7;
  background:
    radial-gradient(ellipse 42% 55% at 78% 38%,rgba(31,104,133,.18),transparent 72%),
    radial-gradient(ellipse 38% 44% at 92% 82%,rgba(112,212,183,.07),transparent 72%),
    #0d1116;
}
.philips-hero-poster::before {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.52;
  background:
    linear-gradient(112deg,transparent 0 50%,rgba(132,201,213,.08) 50% 50.08%,transparent 50.08%),
    linear-gradient(90deg,transparent 0 70%,rgba(132,201,213,.08) 70% 70.08%,transparent 70.08%),
    repeating-linear-gradient(90deg,transparent 0 62px,rgba(215,239,242,.035) 62px 63px),
    repeating-linear-gradient(0deg,transparent 0 62px,rgba(215,239,242,.025) 62px 63px);
  mask-image:linear-gradient(90deg,transparent 0%,#000 46%,#000 100%);
}
.philips-hero-poster::after { z-index:0; background:linear-gradient(180deg,transparent 58%,rgba(0,0,0,.48)); }
.philips-hero-inner { z-index:1; }
.philips-poster-meta { color:rgba(242,239,231,.64); }
.philips-hero-layout { grid-template-columns:1fr; }
.philips-hero-copy { max-width:820px; padding-top:clamp(52px,8vh,94px); }
.philips-hero-copy > span { color:#8fcfc3; }
.philips-hero-copy h1 { max-width:820px; color:#f2efe7; font-size:clamp(48px,5.55vw,78px); }
.philips-hero-copy h1 span { color:#8fcfc3; }
.philips-hero-copy p { color:rgba(242,239,231,.68); }
.philips-hero-facts { max-width:960px; grid-template-columns:repeat(4,1fr); }
.philips-hero-facts div { border-top-color:rgba(242,239,231,.18); }
.philips-hero-facts small { color:rgba(242,239,231,.5); }
@media (max-width:800px) {
  .philips-hero-poster { background:#0d1116; }
  .philips-hero-poster::before { mask-image:none; opacity:.3; }
  .philips-hero-copy { padding-top:28px; }
  .philips-hero-copy h1 { font-size:clamp(38px,9.2vw,52px); }
  .philips-hero-facts { grid-template-columns:1fr 1fr; }
}

/* Philips hero alignment and color use the existing case-study accent, not a separate blue theme. */
.philips-hero-poster { background:radial-gradient(ellipse 42% 55% at 78% 38%,rgba(94,234,212,.055),transparent 72%),#0d1116; }
.philips-hero-poster::before { background:linear-gradient(112deg,transparent 0 50%,rgba(94,234,212,.055) 50% 50.08%,transparent 50.08%),linear-gradient(90deg,transparent 0 70%,rgba(94,234,212,.045) 70% 70.08%,transparent 70.08%),repeating-linear-gradient(90deg,transparent 0 62px,rgba(242,239,231,.03) 62px 63px),repeating-linear-gradient(0deg,transparent 0 62px,rgba(242,239,231,.02) 62px 63px); }
.philips-hero-inner { min-height:calc(100svh - 130px); transform:none; }
.philips-hero-layout { align-content:center; }
.philips-hero-copy { align-self:center; padding-top:0; }
.philips-hero-copy > span,.philips-hero-copy h1 span { color:var(--accent); }
.philips-hero-facts { max-width:none; }
@media (max-width:800px) {
  .philips-hero-inner { min-height:auto; }
  .philips-hero-copy { align-self:start; padding-top:28px; }
}

/* Jordan review: use the cover as a full poster background and keep UX evidence readable. */
.jordan-cover-scene { inset:0; width:100%; height:100%; object-position:center 55%; opacity:.76; transform:scale(1.04) translateX(20%); }
.jordan-before-panel { align-items:center; }
.jordan-before-visual { display:grid; justify-items:center; gap:14px; }
.jordan-before-screens { display:flex; align-items:end; justify-content:center; gap:28px; }
.jordan-before-screen { height:auto; display:block; opacity:.46; }
.jordan-before-screen img { display:block; width:auto; height:430px; max-width:100%; filter:saturate(.38) contrast(.92); }
.jordan-before-visual > span { color:var(--muted); font-size:10px; letter-spacing:.1em; }
.jordan-before-screen i { display:none; }
.jordan-365-visual { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; align-items:start; min-height:0; padding:32px; overflow:visible; }
.jordan-365-visual .jordan-screen,.jordan-365-visual .jordan-detail-crop { position:relative; inset:auto; width:auto; height:auto; overflow:visible; transform:none; }
.jordan-365-visual .jordan-screen.ux { width:min(100%,180px); justify-self:center; }.jordan-365-visual .jordan-screen.ux-start { width:min(100%,180px); }.jordan-365-visual .jordan-detail-crop { width:min(100%,190px); justify-self:center; opacity:1; }
.jordan-365-visual img { display:block; width:100%; height:auto; max-height:none; object-fit:contain; }
.jordan-365-visual .jordan-detail-crop span { position:static; margin-top:10px; padding:0; border-radius:0; color:var(--muted); background:none; }
.jordan-detail-frame { height:820px; overflow:hidden; }
.jordan-fragment-visual { grid-template-columns:1fr .68fr 1.12fr; gap:36px; }
.jordan-fragment-visual > div { height:520px; }.jordan-fragment-visual > div.ui-support { height:450px; }.jordan-fragment-visual img { height:470px; }
.jordan-result-grid { gap:0; border-top:1px solid rgba(255,255,255,.14); border-bottom:1px solid rgba(255,255,255,.14); background:none; }
.jordan-result-grid article { min-height:210px; padding:24px 28px; border-right:1px solid rgba(255,255,255,.14); background:transparent; }.jordan-result-grid article:last-child { border-right:0; }
.jordan-result-grid span { font-size:17px; }.jordan-result-grid article > div { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:38px; }.jordan-result-grid article p { margin:0; }.jordan-result-grid article small { display:block; margin:0 0 8px; color:#999; font-size:10px; letter-spacing:.08em; }.jordan-result-grid article b { display:block; color:#f5f0e9; font-size:18px; font-weight:400; line-height:1.25; opacity:.58; }.jordan-result-grid article .is-current b { color:var(--accent); font-size:30px; letter-spacing:-.035em; opacity:1; }.jordan-result-grid article em { display:block; margin-top:22px; color:var(--accent); font-size:12px; font-style:normal; }
@media (max-width:720px) {
  .jordan-cover-scene { height:78%; opacity:.62; object-position:center 58%; transform:scale(1.02) translateX(2%); }
  .jordan-before-screens { gap:14px; }
  .jordan-before-screen img { height:310px; }
  .jordan-365-visual { grid-template-columns:1fr 1fr; gap:16px; padding:20px; }
  .jordan-365-visual .jordan-screen.ux { width:100%; }.jordan-365-visual .jordan-detail-crop { width:100%; }
  .jordan-detail-frame { height:560px; }
  .jordan-fragment-visual { grid-template-columns:1fr 1fr; gap:14px; }.jordan-fragment-visual > div { height:390px; }.jordan-fragment-visual > div.ui-support { height:340px; }.jordan-fragment-visual img { height:360px; }
  .jordan-result-grid article { min-height:0; border-right:0; border-bottom:1px solid rgba(255,255,255,.14); }.jordan-result-grid article:last-child { border-bottom:0; }
}

/* Volvo IA evidence: group the structure and complete legacy UI as one compact BEFORE view. */
.volvo-ia-diagram { padding:34px; border-color:rgba(155,199,229,.2); background:radial-gradient(circle at 86% 12%,rgba(155,199,229,.1),transparent 30%),#0d1419; }
.volvo-ia-diagram > figcaption { padding-bottom:24px; }
.volvo-ia-evidence { grid-template-columns:minmax(0,1.34fr) minmax(280px,.66fr); align-items:stretch; gap:clamp(30px,4vw,58px); padding:28px 0 0; }
.volvo-ia-source { display: flex; min-width: 0; flex-direction: column; }
.volvo-ia-model { flex:1; padding:26px; border:1px solid rgba(155,199,229,.2); border-radius:14px; background:linear-gradient(145deg,rgba(38,59,71,.88),rgba(18,29,36,.92)); color:var(--ink); box-shadow:inset 0 1px 0 rgba(255,255,255,.06); }
.volvo-ia-model-head { display:grid; gap:10px; padding-bottom:18px; border-bottom:1px solid rgba(155,199,229,.2); }
.volvo-ia-model-head span { color:var(--accent); font-size:8px; letter-spacing:.12em; text-transform:uppercase; }
.volvo-ia-model-head b { font-size:clamp(20px,2.25vw,30px); font-weight:400; letter-spacing:-.04em; }
.volvo-ia-model-map { display:grid; grid-template-columns:1fr; gap:18px; margin-top:18px; }
.volvo-ia-domain { min-width:0; }
.volvo-ia-domain h3 { margin:0 0 10px; padding-bottom:9px; border-bottom:1px solid rgba(155,199,229,.18); color:#dcebf2; font-size:15px; font-weight:500; }
.volvo-ia-domain h3 small { color:var(--muted); font-size:9px; font-weight:400; }
.volvo-ia-domain-groups { display:grid; gap:9px; }
.volvo-ia-domain-purchase .volvo-ia-domain-groups,.volvo-ia-domain-car .volvo-ia-domain-groups { grid-template-columns:repeat(2,minmax(0,1fr)); }
.volvo-ia-domain-purchase .volvo-ia-domain-groups article:first-child { grid-row:auto; }
.volvo-ia-domain article { min-width:0; padding:11px; border:1px solid rgba(155,199,229,.12); border-radius:8px; background:rgba(255,255,255,.055); }
.volvo-ia-domain article b { display:block; margin-bottom:7px; color:#b7d9ec; font-size:8px; letter-spacing:.06em; }
.volvo-ia-domain article p { margin:0; color:#bdc8ce; font-size:9px; line-height:1.6; }
.volvo-ia-source figcaption { padding-top:10px; color:var(--muted); }
.volvo-ia-screen-set { display:flex; min-width:0; flex-direction:column; padding:4px 0 0 30px; border-left:1px solid rgba(155,199,229,.2); }
.volvo-ia-screen-head { display:grid; gap:8px; align-items:start; margin-bottom:18px; }
.volvo-ia-screen-head span { color:var(--accent); font-size:9px; letter-spacing:.12em; }
.volvo-ia-screen-head p { max-width:330px; margin:0; color:var(--muted); font-size:11px; line-height:1.6; }
.volvo-ia-screens { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); flex:1; align-items:start; gap:18px; max-width:none; }
.volvo-ia-screens figure { display: flex; min-width: 0; flex-direction: column; }
.volvo-ia-screens a { display:block; width:100%; aspect-ratio:375 / 1200; overflow:hidden; background:#111b22; }
.volvo-ia-screens img { display:block; width:100%; height:100%; margin:0; border:0; border-radius:0; object-fit:cover; object-position:top; opacity:.62; filter:grayscale(.4) saturate(.75); box-shadow:none; }
.volvo-ia-screens figcaption { padding-top:11px; }
.volvo-ia-screens figcaption b { font-size:11px; }

@media (max-width:720px) {
  .volvo-ia-evidence { grid-template-columns: 1fr; }
  .volvo-ia-diagram { padding:22px; }
  .volvo-ia-diagram > figcaption { padding-bottom:18px; }
  .volvo-ia-evidence { padding:24px 0 0; }
  .volvo-ia-model { min-height: 0; padding: 22px; }
  .volvo-ia-model-map { grid-template-columns:1fr; gap:22px; }
  .volvo-ia-domain-car .volvo-ia-domain-groups { grid-template-columns:1fr 1fr; }
  .volvo-ia-screen-set { margin-top:2px; padding:0; border-left:0; }
  .volvo-ia-screens a { aspect-ratio:375 / 980; }
  .volvo-ia-screens { grid-template-columns:1fr 1fr; gap:14px; }
  .volvo-ia-screens img { height:100%; }
}

/* Volvo hero: a layered device composition inspired by the supplied mockup reference. */
.volvo-hero-map { overflow: visible; }
.volvo-hero-device-pair { width: min(100%, 590px); min-height: 520px; gap: 0; padding: 0; transform: translate(-20px,-48px); }
.volvo-hero-device { position: absolute; top: 50%; left: 50%; }
.volvo-hero-device-app { z-index: 2; transform: translate(-68%, -53%) rotate(-8deg); }
.volvo-hero-device-wecom { z-index: 1; opacity:.42; transform: translate(8%, -36%) rotate(7deg) scale(.76); }
.volvo-phone-shell { width: 252px; aspect-ratio: 375 / 812; box-sizing:border-box; padding: 9px; border-color: rgba(221,239,250,.7); border-radius: 35px; background: linear-gradient(145deg,#334956 0%,#10171c 48%,#05080b 100%); box-shadow: 0 42px 70px rgba(0,0,0,.48), inset 0 0 0 1px rgba(255,255,255,.17); }
.volvo-hero-device-app .volvo-phone-shell { width:282px; }
.volvo-hero-device-wecom .volvo-phone-shell { width:252px; }
.volvo-phone-shell::before { top: 14px; height: 6px; }
.volvo-phone-shell img { width:100%; height:100%; border-radius: 26px; clip-path: inset(0 round 26px); object-fit: cover; object-position: top center; }

@media (max-width:720px) {
  .volvo-hero-map { min-height: 340px; }
  .volvo-hero-device-pair { width: min(100%, 360px); min-height: 340px; transform: translate(-20px,-10px); }
  .volvo-hero-device-app { transform: translate(-66%, -52%) rotate(-8deg); }
  .volvo-hero-device-wecom { transform: translate(8%, -35%) rotate(7deg) scale(.76); }
  .volvo-phone-shell { width: 154px; aspect-ratio: 375 / 812; padding: 6px; border-radius: 25px; }
  .volvo-hero-device-app .volvo-phone-shell { width:172px; }
  .volvo-hero-device-wecom .volvo-phone-shell { width:154px; }
  .volvo-phone-shell::before { top: 9px; height: 4px; }
  .volvo-phone-shell img { border-radius: 19px; clip-path: inset(0 round 19px); }
}

/* Jordan hero: full-bleed image, with content aligned to the site gutter. */
.jordan-hero.section-shell { width:100%; max-width:none; margin:0; padding-left:0; padding-right:0; }
.jordan-hero { position:relative; overflow:hidden; isolation:isolate; }
.jordan-hero-main { position:static; }
.jordan-hero-visual { position:absolute; inset:0; width:100%; height:100%; }
.jordan-hero > .eyebrow { margin-left:clamp(32px,5vw,76px); margin-right:clamp(32px,5vw,76px); }
.jordan-hero > .eyebrow,.jordan-hero-copy,.jordan-hero-facts { position:relative; z-index:4; }
.jordan-hero-copy { margin-left:clamp(32px,5vw,76px); }
.jordan-hero-facts { margin-left:clamp(32px,5vw,76px); margin-right:clamp(32px,5vw,76px); }
.jordan-cover-hand { right:2%; bottom:-10%; height:86%; }
@media (max-width:720px) {
  .jordan-hero > .eyebrow { margin-left:22px; margin-right:22px; }
  .jordan-hero-copy { width:calc(100% - 44px); margin-left:22px; }
  .jordan-hero-facts { margin-left:22px; margin-right:22px; }
  .jordan-cover-hand { right:-6%; bottom:-8%; height:70%; }
}

/* Jordan fragment mechanism: connect the homepage entry to the fragment feedback loop. */
.jordan-fragment-visual { grid-template-columns:1fr; gap:28px; padding:36px; }
.jordan-fragment-visual > .jordan-mechanism-screens { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; height:auto; overflow:visible; transform:none; }
.jordan-mechanism-screens article { position:relative; min-width:0; padding:14px; border:1px solid rgba(255,255,255,.11); border-radius:14px; background:rgba(8,10,12,.42); }
.jordan-mechanism-screens article:not(:last-child)::after { content:"→"; position:absolute; z-index:2; right:-12px; top:48%; color:var(--accent); font-size:15px; }
.jordan-mechanism-screens span { display:block; margin:0 0 12px; color:var(--accent); font-size:9px; letter-spacing:.1em; }
.jordan-mechanism-screens img { display:block; width:100%; height:390px; border-radius:10px; object-fit:cover; object-position:top; }
.jordan-mechanism-screens p { min-height:34px; margin:12px 0 0; color:var(--muted); font-size:10px; line-height:1.55; }
.jordan-fragment-visual figcaption { display:grid; grid-template-columns:.9fr 1.1fr; gap:34px; align-items:end; padding:2px 0 0; }
.jordan-fragment-visual figcaption b { font-size:clamp(25px,2.6vw,38px); }.jordan-fragment-visual figcaption p { max-width:560px; margin:0; }
@media (max-width:720px) {
  .jordan-fragment-visual { padding:22px; }
  .jordan-fragment-visual > .jordan-mechanism-screens { grid-template-columns:1fr 1fr; gap:12px; }
  .jordan-mechanism-screens article:not(:last-child)::after { display:none; }
  .jordan-mechanism-screens img { height:300px; }
  .jordan-fragment-visual figcaption { grid-template-columns:1fr; gap:12px; }
}

/* Volvo Service Tab: Figma-informed content, adapted to this portfolio system. */
.volvo-service-ui { margin-top:24px; padding:38px; overflow:hidden; border:1px solid rgba(155,199,229,.24); border-radius:20px; background:radial-gradient(circle at 88% 8%,rgba(155,199,229,.11),transparent 28%),#0d1419; }
.volvo-service-ui > .volvo-service-reference-head { display:grid; grid-template-columns:.7fr 1.3fr; gap:18px 30px; align-items:end; padding:0 0 28px; border-bottom:1px solid var(--line); }
.volvo-service-reference-head span { color:var(--accent); font-size:9px; font-weight:400; letter-spacing:.12em; }
.volvo-service-reference-head strong { font-size:clamp(24px,2.8vw,38px); font-weight:400; line-height:1.24; }
.volvo-service-reference-head p { grid-column:2; max-width:620px; margin:0; color:var(--muted); font-size:12px; line-height:1.7; }
.volvo-service-reference-layout { display:grid; grid-template-columns:minmax(210px,.58fr) minmax(0,1.42fr); gap:clamp(28px,4vw,58px); align-items:start; margin-top:38px; }
.volvo-service-reference-copy { padding-top:32px; }
.volvo-service-reference-copy h4 { margin:0; color:var(--ink); font-size:clamp(22px,2.2vw,31px); font-weight:400; line-height:1.32; }
.volvo-service-reference-copy p { max-width:390px; margin:22px 0 0; color:#c4c4c4; font-size:13px; line-height:1.75; }
.volvo-service-priority-note { display:grid; gap:10px; margin-top:30px; padding:16px; border:1px solid rgba(155,199,229,.24); border-radius:10px; background:rgba(155,199,229,.055); }
.volvo-service-priority-note div { display:grid; gap:5px; }
.volvo-service-priority-note div + div { padding-top:10px; border-top:1px solid rgba(155,199,229,.18); }
.volvo-service-priority-note span { color:var(--accent); font-size:8px; letter-spacing:.12em; }
.volvo-service-priority-note p { margin:0; color:#d5e0e6; font-size:11px; line-height:1.6; }
.volvo-service-reference-gallery { min-width:0; }
.volvo-service-ui-screens { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:clamp(12px,1.6vw,22px); align-items:start; max-width:none; margin:0; }
.volvo-service-ui-screens figure { display:flex; min-width:0; flex-direction:column; align-items:stretch; margin:0; }
.volvo-service-ui-screens figcaption { min-height:32px; margin:0 0 10px; color:var(--ink); font-size:11px; font-weight:500; line-height:1.25; }
.volvo-service-ui-screens figure > img { display:block; width:100%; height:auto; max-width:none; margin:0; border-radius:10px; object-fit:contain; box-shadow:0 14px 26px rgba(0,0,0,.22); }
.volvo-screen-preview { position:relative; display:block; width:100%; height:min(58vh,500px); padding:0; overflow:hidden; border:0; border-radius:10px; background:#111b22; cursor:zoom-in; box-shadow:0 14px 26px rgba(0,0,0,.22); }
.volvo-screen-preview img { display:block; width:100%; height:100%; object-fit:cover; object-position:top; }
.volvo-screen-preview span { position:absolute; right:10px; bottom:10px; padding:7px 10px; border-radius:99px; color:#071016; background:var(--accent); font-size:10px; opacity:0; transform:translateY(4px); transition:opacity .2s ease,transform .2s ease; }
.volvo-screen-preview:hover span,.volvo-screen-preview:focus-visible span { opacity:1; transform:none; }
.volvo-screen-preview:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.volvo-service,.volvo-system-section { scroll-margin-top:88px; }
.volvo-choice-card { margin:32px 0 0; padding:38px; border:1px solid rgba(155,199,229,.28); border-radius:20px; background:radial-gradient(circle at 92% 6%,rgba(155,199,229,.16),transparent 28%),#0d1419; }
.volvo-choice-card > header { display:grid; grid-template-columns:.7fr 1.3fr; gap:18px 30px; align-items:end; padding-bottom:28px; border-bottom:1px solid var(--line); }
.volvo-choice-card > header span,.volvo-choice-options section > span { color:var(--accent); font-size:9px; letter-spacing:.12em; }
.volvo-choice-card > header h3 { margin:0; font-size:clamp(24px,2.8vw,38px); font-weight:400; line-height:1.24; }
.volvo-choice-options { display:grid; grid-template-columns:1fr auto 1fr; gap:20px; align-items:stretch; margin-top:28px; }
.volvo-choice-options > i { align-self:center; color:var(--accent); font-size:28px; font-style:normal; }
.volvo-choice-options section { padding:24px; border:1px solid rgba(255,255,255,.1); border-radius:14px; background:rgba(255,255,255,.022); }
.volvo-choice-options .is-rejected { opacity:.58; }
.volvo-choice-options .is-selected { border-color:rgba(155,199,229,.5); background:rgba(155,199,229,.09); box-shadow:inset 3px 0 0 var(--accent); }
.volvo-choice-options h4 { margin:28px 0 12px; font-size:clamp(20px,2.2vw,30px); font-weight:400; line-height:1.25; }
.volvo-choice-options p { min-height:52px; margin:0; color:var(--muted); font-size:12px; line-height:1.7; }
.volvo-choice-options small { display:block; margin-top:24px; padding-top:14px; border-top:1px solid var(--line); color:var(--muted); font-size:9px; letter-spacing:.06em; line-height:1.6; }
.volvo-choice-rationale { margin:28px 0 0; padding:26px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); color:var(--ink); font-size:clamp(17px,1.75vw,23px); line-height:1.65; }
.volvo-choice-benefits { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:22px; }
.volvo-choice-benefits span { display:grid; grid-template-columns:auto 1fr; gap:12px; align-items:baseline; color:var(--muted); font-size:11px; line-height:1.6; }
.volvo-choice-benefits b { color:var(--accent); font-size:9px; font-weight:400; letter-spacing:.1em; text-transform:uppercase; }
.volvo-service-outcome { margin:32px 0 0; padding:38px; border:1px solid rgba(155,199,229,.2); border-radius:20px; background:radial-gradient(circle at 84% 4%,rgba(155,199,229,.1),transparent 27%),#0d1419; }
.volvo-service-outcome > figcaption { display:grid; grid-template-columns:.7fr 1.3fr; gap:18px 30px; align-items:end; padding-bottom:28px; border-bottom:1px solid var(--line); }
.volvo-service-outcome > figcaption span,.volvo-modular-board > span,.volvo-final-ui-head > span { color:var(--accent); font-size:9px; letter-spacing:.12em; }
.volvo-service-outcome > figcaption strong { font-size:clamp(24px,2.8vw,38px); font-weight:400; line-height:1.24; }
.volvo-service-outcome > figcaption p { grid-column:2; max-width:620px; margin:0; color:var(--muted); font-size:12px; line-height:1.7; }
.volvo-service-outcome-layout { display:grid; grid-template-columns:minmax(0,1.46fr) minmax(280px,.54fr); gap:clamp(28px,4vw,58px); align-items:start; margin-top:34px; }
.volvo-modular-board { min-width:0; margin:0; }
.volvo-modular-board > span { display:block; margin-bottom:12px; }
.volvo-modular-board img { display:block; width:100%; border:1px solid rgba(255,255,255,.1); border-radius:12px; background:#111; }
.volvo-modular-board figcaption { margin-top:10px; color:var(--muted); font-size:10px; line-height:1.5; }
.volvo-final-ui-panel { min-width:0; padding:0 0 4px; }
.volvo-final-ui-head { margin-bottom:18px; }
.volvo-final-ui-head p { max-width:300px; margin:10px 0 0; color:var(--muted); font-size:11px; line-height:1.65; }
.volvo-final-ui-screens { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; align-items:start; }
.volvo-final-ui-screens figure { min-width:0; margin:0; }
.volvo-final-ui-screens a { display:block; height:500px; overflow:hidden; border:1px solid rgba(155,199,229,.22); border-radius:12px; background:#111b22; box-shadow:0 14px 26px rgba(0,0,0,.22); }
.volvo-final-ui-screens img { display:block; width:100%; height:100%; object-fit:cover; object-position:top center; }
.volvo-final-ui-screens figure:nth-child(2) img { object-position:center 34%; }
.volvo-final-ui-screens figcaption { margin-top:10px; color:var(--ink); font-size:10px; line-height:1.4; }
.volvo-track-context { max-width:760px; margin:-24px 0 40px; color:var(--muted); font-size:13px; line-height:1.7; }
.volvo-concept-note { display:grid; grid-template-columns:.7fr 1.3fr; gap:30px; margin:54px 0 0; padding:22px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.volvo-concept-note span { color:var(--accent); font-size:9px; letter-spacing:.12em; }
.volvo-concept-note p { max-width:620px; margin:0; color:var(--muted); font-size:13px; line-height:1.7; }
.volvo-evidence-note { margin:18px 0 0; color:var(--muted); font-size:11px; line-height:1.6; }
.volvo-logic-ui { display:grid; grid-template-columns:minmax(0,1fr) minmax(150px,220px); gap:clamp(28px,6vw,90px); align-items:start; margin:64px 0 0; padding:34px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.volvo-logic-ui figcaption { align-self:center; }
.volvo-logic-ui figcaption span { display:block; color:var(--accent); font-size:10px; letter-spacing:.12em; }
.volvo-logic-ui figcaption strong { display:block; max-width:520px; margin:22px 0 16px; font-size:clamp(26px,3.2vw,42px); font-weight:400; line-height:1.22; }
.volvo-logic-ui figcaption p { max-width:600px; margin:0; color:var(--muted); line-height:1.7; }
.volvo-logic-ui img { display:block; width:100%; max-width:180px; margin:0 auto; border-radius:14px; box-shadow:0 18px 36px rgba(0,0,0,.25); }

.volvo-switch { padding:46px 0; }
.volvo-switch h2 { max-width:760px; font-size:clamp(29px,3.35vw,46px); line-height:1.16; }

.volvo-compare-pair { align-items:start; padding:0; border:0; border-radius:0; background:none; }
.volvo-compare-pair figure > div { display:grid; min-height:0; overflow:visible; place-items:start center; border-radius:0; background:none; opacity:.52; }
.volvo-compare-pair .is-after > div { box-shadow:none; opacity:1; }
.volvo-compare-pair figure > div img { width:min(100%,210px); height:auto; border-radius:14px; box-shadow:0 16px 30px rgba(0,0,0,.2); }
.volvo-compare-pair figcaption { max-width:230px; }
.volvo-compare-pair .volvo-screen-sequence { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; width:100%; overflow:visible; opacity:1; }
.volvo-compare-pair .volvo-screen-sequence img { width:100%; border-radius:10px; }

.volvo-rep-showcase { gap:0; }
.volvo-booking-journey { display:grid; grid-template-columns:minmax(120px,.72fr) auto minmax(150px,1fr) auto minmax(120px,.72fr); gap:14px; align-items:start; }
.volvo-booking-journey figure { min-width:0; margin:0; }
.volvo-booking-journey figure > span { display:block; margin-bottom:10px; color:var(--muted); font-size:9px; letter-spacing:.1em; text-transform:uppercase; }
.volvo-booking-journey figure > div { display:grid; min-height:0; place-items:start center; overflow:visible; background:none; opacity:.52; }
.volvo-booking-journey figure.is-after > div,.volvo-booking-journey figure.is-follow-up > div { opacity:1; }
.volvo-booking-journey img { display:block; width:min(100%,190px); height:auto; border-radius:14px; box-shadow:0 16px 30px rgba(0,0,0,.2); }
.volvo-booking-journey > i { align-self:center; color:var(--accent); font-style:normal; }
.volvo-booking-journey figcaption { padding-top:10px; color:var(--muted); font-size:10px; line-height:1.5; }

/* Representative booking flow: give the product screens priority over the explanation. */
.volvo-representative + .volvo-representative { grid-template-columns:minmax(250px,.62fr) minmax(0,1.38fr); gap:clamp(38px,5vw,76px); }
.volvo-representative + .volvo-representative .volvo-rep-copy h3 { font-size:clamp(30px,3.7vw,50px); }
.volvo-representative + .volvo-representative .volvo-booking-journey { grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(24px,4vw,56px); }
.volvo-representative + .volvo-representative .volvo-booking-journey figure > div { place-items:start center; }
.volvo-booking-sequence { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; width:100%; opacity:1 !important; }
.volvo-booking-sequence img { width:100% !important; border-radius:12px !important; }
.volvo-booking-preview { width:min(100%,280px); height:520px; overflow:hidden !important; border-radius:16px !important; opacity:1 !important; box-shadow:0 16px 30px rgba(0,0,0,.2); }
.volvo-booking-preview img { width:100% !important; height:100% !important; border-radius:16px !important; object-fit:cover; object-position:top center; box-shadow:none; }
.volvo-case main figure > img,
.volvo-case main figure > div > img { border-radius:16px; }

/* Volvo case rhythm: keep evidence dense and use one visual language across chapters. */
.volvo-case .case-section { padding-block:clamp(82px,8vw,108px); }
.volvo-case .case-section-head { margin-bottom:clamp(44px,5vw,64px); }
.volvo-tracks-section { padding-top:clamp(72px,7vw,96px) !important; }
.volvo-track { min-height:460px; padding:38px; }
.volvo-track h3 { margin:28px 0 20px; }
.volvo-track ul { margin-top:30px; }
.volvo-track > strong { left:38px; bottom:32px; }

.volvo-ia-diagram { margin-top:56px; }
.volvo-ia-model { min-height:0; }
.volvo-service-ui { margin-top:32px; }
.volvo-service-reference-copy { padding-top:14px; }
.volvo-service-ui-screens figure > img { max-height:430px; object-fit:contain; object-position:top; }

.volvo-logic-section .decision-grid { margin-top:0; border-radius:18px; overflow:hidden; }
.volvo-logic-section .volvo-decisions article { min-height:230px; }
.volvo-logic-section .volvo-state-map { margin-top:24px; }
.volvo-evidence-subsection { margin-top:clamp(72px,8vw,108px); padding-top:clamp(72px,8vw,108px); border-top:1px solid var(--line); }
.volvo-evidence-subsection .case-section-head { margin-bottom:clamp(44px,5vw,64px); }

.volvo-system-section .volvo-app-system { margin-top:48px; }
.volvo-wecom-ui-overview { margin:48px 0 0; }
.volvo-wecom-ui-overview > figcaption { display:grid; grid-template-columns:.7fr 1.3fr; gap:18px 30px; align-items:end; padding:0 4px 28px; }
.volvo-wecom-ui-overview > figcaption span { color:var(--accent); font-size:9px; letter-spacing:.12em; }
.volvo-wecom-ui-overview > figcaption strong { font-size:clamp(24px,2.8vw,38px); font-weight:400; line-height:1.24; }
.volvo-wecom-ui-overview > figcaption p { grid-column:2; max-width:620px; margin:0; color:var(--muted); font-size:12px; line-height:1.7; }
.volvo-version-wall { padding:0 0 28px; overflow:visible; border:0; border-radius:0; background:none; box-shadow:none; }
.volvo-version-wall-head { display:none; }
.volvo-version-pairs { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:clamp(12px,1.45vw,22px); align-items:start; padding:0 6px; }
.volvo-version-pair { position:relative; display:grid; grid-template-rows:auto auto; gap:0; min-width:0; align-content:start; padding:0; }
.volvo-version-pair img { display:block; min-width:0; border-radius:8px; object-position:top center; }
.volvo-version-pair .is-before { width:66%; justify-self:center; aspect-ratio:180 / 390; object-fit:contain; opacity:.2; filter:grayscale(.95) saturate(.15); }
.volvo-version-pair .is-after { z-index:1; width:100%; margin-top:-86px; aspect-ratio:375 / 812; object-fit:cover; border:0; border-radius:10px; box-shadow:0 18px 34px rgba(0,0,0,.35),0 0 24px rgba(70,141,202,.14); transition:transform .25s ease,box-shadow .25s ease; }
.volvo-version-pair:hover .is-after { transform:translateY(-8px) rotate(0); box-shadow:0 24px 44px rgba(0,0,0,.42),0 0 34px rgba(92,169,224,.24); }
.volvo-system-section .volvo-guideline-panel { margin-top:28px; }
.volvo-guideline-panel { border:1px solid rgba(155,199,229,.16); background:radial-gradient(circle at 90% 0,rgba(155,199,229,.12),transparent 30%),#0d1419; }

.volvo-representative-section .case-section-head { margin-bottom:34px; }
.volvo-representative { grid-template-columns:minmax(250px,.62fr) minmax(0,1.38fr); gap:clamp(34px,4vw,58px); align-items:start; min-height:0; margin-top:22px; padding:38px; border:1px solid rgba(155,199,229,.18); border-radius:20px; background:radial-gradient(circle at 96% 0,rgba(155,199,229,.1),transparent 32%),#0d1419; }
.volvo-representative:last-child { border-bottom:1px solid rgba(155,199,229,.18); }
.volvo-rep-copy { position:sticky; top:100px; padding-top:4px; }
.volvo-rep-copy h3 { margin:20px 0; font-size:clamp(30px,3.6vw,48px); line-height:1.12; }
.volvo-rep-copy div { margin-top:26px; }
.volvo-compare-pair { gap:18px; }
.volvo-compare-pair figure > div img { max-height:520px; object-fit:contain; object-position:top; }
.volvo-compare-pair .volvo-screen-sequence img { max-height:520px; }
.volvo-representative + .volvo-representative { grid-template-columns:minmax(250px,.62fr) minmax(0,1.38fr); gap:clamp(34px,4vw,58px); }
.volvo-representative + .volvo-representative .volvo-booking-journey { gap:22px; }
.volvo-booking-preview { height:430px; }

.volvo-summary-section { padding-bottom:clamp(72px,7vw,96px) !important; }
.volvo-summary { margin-top:0; }
.volvo-summary article { min-height:210px; border-radius:16px; }

@media (max-height:780px) and (min-width:721px) {
  .volvo-hero { padding:88px 0 18px; gap:14px; }
  .volvo-hero-copy h1 { font-size:clamp(52px,6vw,78px); }
  .volvo-hero-copy p { margin-top:20px; font-size:16px; line-height:1.45; }
  .volvo-workline-nav { gap:6px; margin-top:18px; }
  .volvo-workline-nav a { padding:9px 12px; }
  .volvo-hero-device-pair { min-height:410px; transform:translate(-20px,-24px); }
  .volvo-hero-device-app .volvo-phone-shell { width:220px; }
  .volvo-hero-device-wecom .volvo-phone-shell { width:198px; }
  .volvo-hero-device figcaption { margin-top:8px; }
}

@media (max-width:720px) {
  .lynk-decision-grid article { border-right:0; border-bottom:1px solid rgba(174,205,231,.15); }
  .lynk-decision-grid article:last-child { border-bottom:0; }
  .volvo-hero { height:auto; min-height:100svh; }
  .volvo-workline-nav { gap:7px; margin-top:20px; }
  .volvo-workline-nav a { grid-template-columns:76px 1fr auto; gap:10px; padding:10px 11px; }
  .volvo-workline-nav strong { font-size:12px; }
  .volvo-workline-nav b { font-size:8px; }
  .volvo-hero-map { min-height:430px; }
  .volvo-hero-device-pair { transform:translate(-20px,28px); }
  .volvo-service-ui { margin-inline:0; padding:24px; }
  .volvo-service-ui > .volvo-service-reference-head { grid-template-columns:1fr; gap:12px; }
  .volvo-service-reference-head p { grid-column:1; }
  .volvo-service-reference-layout { grid-template-columns:1fr; gap:36px; margin-top:34px; }
  .volvo-service-reference-copy { padding-top:0; }
  .volvo-service-priority-note { grid-template-columns:1fr 1fr; gap:10px; margin-top:24px; padding:14px; }
  .volvo-service-priority-note div + div { padding:0 0 0 10px; border-top:0; border-left:1px solid rgba(155,199,229,.18); }
  .volvo-service-reference-gallery { overflow-x:auto; padding-bottom:12px; }
  .volvo-service-ui-screens { grid-template-columns:repeat(5,132px); gap:14px; width:max-content; }
  .volvo-service-ui-screens figcaption { min-height:28px; font-size:11px; }
  .volvo-screen-preview { height:min(56vh,420px); }
  .volvo-choice-card { margin-top:24px; padding:24px; }
  .volvo-choice-card > header { grid-template-columns:1fr; gap:12px; padding-bottom:22px; }
  .volvo-choice-options { grid-template-columns:1fr; gap:14px; }
  .volvo-choice-options > i { justify-self:center; transform:rotate(90deg); }
  .volvo-choice-options p { min-height:0; }
  .volvo-choice-rationale { padding:22px 0; }
  .volvo-choice-benefits { grid-template-columns:1fr; }
  .volvo-service-outcome { margin-top:24px; padding:24px; }
  .volvo-service-outcome > figcaption { grid-template-columns:1fr; gap:12px; padding-bottom:22px; }
  .volvo-service-outcome > figcaption p { grid-column:1; }
  .volvo-service-outcome-layout { grid-template-columns:1fr; gap:28px; margin-top:28px; }
  .volvo-final-ui-screens a { height:420px; }
  .volvo-wecom-ui-overview { margin-top:34px; }
  .volvo-wecom-ui-overview > figcaption { grid-template-columns:1fr; gap:12px; padding:0 0 22px; }
  .volvo-wecom-ui-overview > figcaption p { grid-column:1; }
  .volvo-version-wall { padding:22px; overflow-x:auto; }
  .volvo-version-pairs { grid-template-columns:repeat(7,120px); min-width:920px; gap:12px; }
  .volvo-version-pair .is-before,.volvo-version-pair .is-after { transform:none !important; }
  .volvo-track-context { margin:-18px 0 28px; }
  .volvo-concept-note { grid-template-columns:1fr; gap:12px; margin-top:36px; }
  .volvo-ia-screen-head { grid-template-columns:1fr; gap:10px; }
  .volvo-case .case-section { padding-block:68px; }
  .volvo-track { min-height:410px; padding:28px; }
  .volvo-track > strong { left:28px; bottom:26px; }
  .volvo-representative,.volvo-representative + .volvo-representative { grid-template-columns:1fr; gap:30px; padding:24px; }
  .volvo-rep-copy { position:static; }
  .volvo-representative .volvo-compare-pair { grid-template-columns:1fr; }
  .volvo-representative .volvo-compare-pair > i { display:none; }
  .volvo-representative .volvo-screen-sequence { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .volvo-booking-preview { height:360px; }
  .volvo-logic-ui { grid-template-columns:1fr; gap:28px; padding:26px 0; }
  .volvo-logic-ui img { max-width:150px; margin-left:0; }
  .volvo-switch { padding:34px 0; }
  .volvo-switch h2 { font-size:clamp(27px,7vw,38px); }
  .volvo-delivery-scale { grid-template-columns:1fr auto; gap:10px 18px; padding:20px 0; }
  .volvo-delivery-scale p { grid-column:1 / -1; }
  .volvo-compare-pair { grid-template-columns:1fr 1fr; gap:18px; }
  .volvo-compare-pair figure > div img { width:min(100%,150px); }
  .volvo-booking-journey { grid-template-columns:1fr; gap:18px; }
  .volvo-booking-journey > i { justify-self:center; transform:rotate(90deg); }
  .volvo-booking-journey img { width:min(100%,180px); }
  .volvo-representative + .volvo-representative { grid-template-columns:1fr; gap:30px; }
  .volvo-representative + .volvo-representative .volvo-booking-journey { grid-template-columns:1fr; gap:18px; }
  .volvo-booking-sequence { gap:7px; }
  .volvo-booking-preview { width:min(100%,220px); height:360px; }
}

/* Recruitment-critical metadata: keep evidence readable without enlarging decorative labels. */
@media (min-width:721px) {
  .project-meta,
  .project-row > div > p,
  .capability-project,
  .capability small,
  .case-facts small,
  .philips-hero-facts small,
  .volvo-hero-facts small,
  .iconnect-hero-facts small,
  .jordan-hero-facts small,
  .lynk-hero-facts small,
  .case-snapshot-grid span,
  .case-story-grid span,
  .validation-board small,
  .volvo-summary span,
  .volvo-delivery-scale span,
  .iconnect-delivery-grid article > span,
  .jordan-result-grid article small {
    font-size: 13px !important;
  }

  .project-meta span:first-child { font-size: 12px; }

  .row-detail,
  .project-result span,
  .timeline p,
  .case-facts b,
  .philips-hero-facts b,
  .volvo-hero-facts b,
  .iconnect-hero-facts b,
  .jordan-hero-facts b,
  .lynk-hero-facts b,
  .case-snapshot-grid p,
  .stat-strip span,
  .lynk-feedback-loop article p,
  .volvo-workline-nav strong,
  .volvo-summary p,
  .volvo-delivery-scale p,
  .iconnect-role-list b,
  .iconnect-delivery-grid p,
  .jordan-data-note,
  .jordan-result-grid article em {
    font-size: 14px !important;
  }
}

/* ---------------------------------------------------------------------------
   Micro-interactions. Everything here is small: a rule that draws in, an arrow
   that steps forward, a surface that lifts a fraction. Nothing loops except the
   two breathing markers, and all of it is disabled for reduced-motion users.
   --------------------------------------------------------------------------- */
:where(a, button) { transition: color .24s ease, border-color .24s ease, background-color .24s ease, opacity .24s ease; }

/* Nav: a rule draws in from the left. */
.site-nav a { position: relative; }
.site-nav a::after {
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-5px;
  height:1px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .34s cubic-bezier(.2,.7,.2,1);
}
.site-nav a:hover::after,
.site-nav a:focus-visible::after,
.site-nav a.is-active::after { transform:scaleX(1); }

/* Brand marker breathes. */
.home .brand::after { animation: breathe 3.2s ease-in-out infinite; }
@keyframes breathe {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: .4; transform: scale(.72); }
}

/* Section index: the rule extends on hover of its section. */
.home .section-index::before { transition: width .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s ease; }
.home .ruled-section:hover .section-index::before { width: 34px; box-shadow: 14px 0 0 rgba(94,234,212,.4); }

/* Case study link: the arrow steps out. */
.text-link { transition: border-color .28s ease, color .28s ease; }
.text-link span { transition: transform .3s cubic-bezier(.2,.7,.2,1); }
.text-link:hover { border-color: var(--accent); }
.text-link:hover span { transform: translate(4px, -4px); }

/* Project rows: arrow steps right, number and symbol ease. */
.row-arrow { transition: transform .34s cubic-bezier(.2,.7,.2,1); }
.project-row:hover .row-arrow { transform: translateX(7px); }
.project-number,
.project-row h3 { transition: transform .34s cubic-bezier(.2,.7,.2,1); }
.project-row:hover .project-number,
.project-row:hover h3 { transform: translateX(4px); }
.project-symbol img { transition: transform .5s cubic-bezier(.2,.7,.2,1); }
.project-row:hover .project-symbol img { transform: scale(1.06); }

/* Capability tiles: the faintest lift on hover. */
.capability { transition: background-color .3s ease; }
.capability:hover { background-color: rgba(255,255,255,.022); }
.home .capability::after { transition: transform .55s cubic-bezier(.2,.7,.2,1), border-color .3s ease; }
.home .capability:hover::after { border-color: rgba(94,234,212,.85); transform: rotate(135deg); }
.home .capability:nth-child(2):hover::after { transform: none; }
.home .capability:nth-child(3)::after { transform: rotate(45deg); }
.home .capability:nth-child(3):hover::after { transform: rotate(135deg); }
.home .capability:nth-child(4):hover::after { transform: rotate(-45deg) scaleX(-1); }

/* Approach steps: the connector arrow nudges forward. */
.approach-flow li { transition: background-color .3s ease; }
.approach-flow li:hover { background-color: rgba(255,255,255,.02); }
.approach-flow li:not(:last-child)::after { transition: transform .34s cubic-bezier(.2,.7,.2,1); }
.approach-flow li:hover:not(:last-child)::after { transform: translateY(-50%) translateX(4px); }

/* Timeline: the date slides on hover. */
.timeline article { transition: background-color .3s ease; }
.timeline article:hover { background-color: rgba(255,255,255,.018); }
.timeline time { transition: transform .34s cubic-bezier(.2,.7,.2,1); }
.timeline article:hover time { transform: translateX(4px); }

/* Contact links: a rule wipes in from the right, then out to the left. */
.contact-links a { position: relative; }
.contact-links a::after {
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-2px;
  height:1px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:right center;
  transition:transform .38s cubic-bezier(.2,.7,.2,1);
}
.contact-links a:hover::after,
.contact-links a:focus-visible::after { transform:scaleX(1); transform-origin:left center; }

/* Resume download: slides up a touch. */
.resume-download { transition: transform .3s cubic-bezier(.2,.7,.2,1), color .24s ease; }
.resume-download:hover { transform: translateY(-2px); color: var(--accent); }

/* Menu button. */
.menu-button { transition: opacity .24s ease; }
/* The scroll cue keeps its gentle bob (keyframes defined with the hero rules). */
.menu-button:hover { opacity: .68; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .home .brand::after,
  .scroll-cue i { animation: none; }
  *, *::before, *::after { transition-duration: .01ms !important; }
}
