/* Editorial product story and dedicated feature pages. */
.hero-cinematic {
  position: relative;
  grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
  align-items: center;
  gap: clamp(34px, 6vw, 86px);
  min-height: 700px;
  margin-top: 0;
  padding: clamp(54px, 7vw, 104px) clamp(24px, 8vw, 130px);
  overflow: hidden;
  border: 0;
  border-radius: 0 0 38px 38px;
  color: #fff;
  background:
    radial-gradient(ellipse at 80% 0%, rgba(61, 155, 255, .16), transparent 42%),
    radial-gradient(ellipse at 6% 85%, rgba(23, 102, 212, .1), transparent 35%),
    linear-gradient(130deg, #080a0f, #0d1118 58%, #080a0f);
  box-shadow: 0 32px 80px rgba(14, 14, 29, .22);
}
.hero-cinematic::after {
  position: absolute;
  inset: auto 0 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.2), transparent);
  content: "";
}
.hero-cinematic .hero-copy { position: relative; z-index: 2; }
.hero-cinematic .hero-copy .eyebrow { color: #67b1ff; }
.hero-cinematic .hero-copy h1 {
  max-width: 100%;
  color: #fff;
  font-family: Inter, "Avenir Next", "Segoe UI", system-ui, sans-serif;
  font-size: clamp(2.9rem, 4.1vw, 4.35rem);
  font-weight: 740;
  line-height: .98;
  letter-spacing: -.06em;
}
.hero-cinematic .lead { max-width: 54ch; color: rgba(243, 244, 255, .78); font-size: 1.04rem; }
.hero-cinematic .ghost-link.strong { border-color: rgba(255,255,255,.25); color: #fff; background: rgba(255,255,255,.06); }
.hero-cinematic .ghost-link.strong:hover { border-color: rgba(169,242,214,.55); color: #b8f4dc; background: rgba(169,242,214,.08); }
.hero-cinematic .signal-strip { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; margin-top: 34px; }
.hero-cinematic .signal-strip article { min-height: 94px; padding: 13px; border-color: rgba(255,255,255,.13); background: rgba(13,17,24,.72); }
.hero-cinematic .signal-strip article::before { display: none; }
.hero-cinematic .signal-strip strong { color: #fff; font-size: .78rem; }
.hero-cinematic .signal-strip span { color: #b9c2d2; font-size: .68rem; }
.hero-incident-visual { position: relative; min-width: 0; min-height: 490px; align-self: stretch; overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: 24px; background: #111722; box-shadow: 0 30px 80px rgba(0,0,0,.36); isolation: isolate; }
.hero-incident-visual > img { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; filter: saturate(.88); }
.hero-incident-shade { position: absolute; z-index: -1; inset: 0; background: linear-gradient(180deg,rgba(7,10,16,.02) 10%,rgba(7,10,16,.25) 42%,rgba(7,10,16,.96) 100%), linear-gradient(90deg,rgba(7,10,16,.16),transparent 75%); }
.hero-incident-caption { position: absolute; right: clamp(22px,4vw,48px); bottom: 102px; left: clamp(22px,4vw,48px); color: #fff; }
.hero-incident-kicker { color: #83bdff; font-size: .68rem; font-weight: 800; letter-spacing: .15em; }
.hero-incident-caption h2 { max-width: 13ch; margin-top: 12px; font-size: clamp(2rem,4vw,3.45rem); line-height: 1.01; letter-spacing: -.05em; }
.hero-incident-caption p { max-width: 40ch; margin: 12px 0 0; color: rgba(255,255,255,.78); font-size: .9rem; line-height: 1.6; }
.hero-story-path { position: absolute; right: 20px; bottom: 18px; left: 20px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 13px 16px; border: 1px solid rgba(255,255,255,.16); border-radius: 13px; color: #fff; background: rgba(10,14,21,.8); backdrop-filter: blur(12px); }
.hero-story-path span { display: flex; align-items: center; gap: 8px; font-size: .72rem; font-weight: 700; }
.hero-story-path i { display: grid; width: 25px; height: 25px; place-items: center; border: 1px solid rgba(131,189,255,.45); border-radius: 50%; color: #9acaff; font-size: .58rem; font-style: normal; }
.hero-story-path > b { color: rgba(255,255,255,.42); font-size: .9rem; }
.hero-photo-credit { position: absolute; right: 12px; top: 12px; padding: 6px 8px; border-radius: 7px; color: rgba(255,255,255,.8); background: rgba(8,10,15,.64); font-size: .58rem; }

.incident-story { padding-top: clamp(78px, 10vw, 130px); }
.story-intro { display: grid; grid-template-columns: minmax(0,1fr) minmax(220px,.56fr); align-items: end; gap: 20px 48px; margin-bottom: 30px; }
.story-intro .eyebrow { grid-column: 1 / -1; margin-bottom: -9px; }
.story-intro h2 { max-width: 15ch; color: var(--refresh-ink); font-size: clamp(2.5rem,5vw,4.7rem); line-height: .99; letter-spacing: -.06em; }
.story-intro > p:last-child { max-width: 39ch; margin: 0 0 5px; color: var(--refresh-muted); font-size: .98rem; line-height: 1.7; }
.story-photo-main { position: relative; min-height: 420px; overflow: hidden; border-radius: 24px; background: #171b28; box-shadow: 0 24px 55px rgba(20,24,42,.16); }
.story-photo-main > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 48%; }
.story-photo-gradient { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11,12,22,.77), rgba(11,12,22,.1) 76%), linear-gradient(0deg, rgba(11,12,22,.48), transparent 52%); }
.story-photo-caption { position: absolute; left: clamp(22px,5vw,58px); bottom: clamp(28px,5vw,56px); display: flex; max-width: 520px; flex-direction: column; gap: 13px; color: white; }
.story-photo-caption span,.story-step { color: #67b1ff; font-size: .68rem; font-weight: 800; letter-spacing: .15em; }
.story-photo-caption strong { font-size: clamp(1.7rem,3.5vw,3.3rem); line-height: 1.05; letter-spacing: -.045em; }
.story-photo-credit { position: absolute; right: 17px; bottom: 15px; color: rgba(255,255,255,.74); font-size: .62rem; }
.story-chapters { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; margin-top: 17px; }
.story-chapter { overflow: hidden; padding: 0 0 21px; border: 1px solid var(--refresh-line); border-radius: 17px; background: var(--refresh-white); }
.story-chapter-image { height: 195px; overflow: hidden; background: #242336; }
.story-chapter-image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .55s ease; }
.story-chapter:hover .story-chapter-image img { transform: scale(1.04); }
.story-chapter > .story-step,.story-chapter h3,.story-chapter p,.story-chapter > a { display: block; margin-right: 21px; margin-left: 21px; }
.story-chapter > .story-step { margin-top: 18px; color: var(--refresh-blue-dark); }
.story-chapter h3 { margin-top: 9px; color: var(--refresh-ink); font-size: 1.27rem; line-height: 1.15; letter-spacing: -.035em; }
.story-chapter p { margin-top: 9px; margin-bottom: 0; color: var(--refresh-muted); font-size: .84rem; line-height: 1.6; }
.story-chapter-text { display: flex; min-height: 100%; flex-direction: column; justify-content: center; padding-top: 25px; background: linear-gradient(145deg,#f1f4ff,#fff 66%); }
.story-resolution-mark { display: grid; width: 45px; height: 45px; margin: 0 21px 20px; place-items: center; border-radius: 14px; color: #eef1f6; background: #1766d4; font-size: 1.25rem; }
.story-chapter-text > a { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 18px; color: var(--refresh-blue-dark); font-size: .83rem; font-weight: 750; text-decoration: none; }
.photo-credit-note { margin: 13px 0 0; color: var(--refresh-muted); font-size: .68rem; }

.feature-directory,.use-case-directory { padding-top: clamp(68px,8vw,105px); }
.feature-link-grid,.feature-directory-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; }
.feature-link-card { position: relative; display: flex; min-height: 340px; flex-direction: column; justify-content: flex-end; padding: 24px; overflow: hidden; border: 1px solid rgba(255,255,255,.08); border-radius: 18px; color: #fff; background: #191827; text-decoration: none; isolation: isolate; }
.feature-link-card::after { position: absolute; z-index: -1; inset: 0; background: linear-gradient(180deg,rgba(12,13,23,.02) 12%,rgba(12,13,23,.28) 45%,rgba(12,13,23,.94) 100%); content: ""; transition: opacity .2s ease; }
.feature-link-card > img { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.65,.2,1); }
.feature-link-card:hover > img { transform: scale(1.055); }
.feature-link-card > span { color: #83bdff; font-size: .66rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.feature-link-card > strong { max-width: 15ch; margin-top: 10px; font-size: 1.38rem; line-height: 1.1; letter-spacing: -.035em; }
.feature-link-card > small { max-width: 30ch; margin-top: 8px; color: rgba(238,241,246,.78); font-size: .78rem; line-height: 1.5; }
.feature-link-card > i { position: absolute; right: 19px; bottom: 21px; display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid rgba(255,255,255,.42); border-radius: 50%; color: #fff; font-size: 1.1rem; font-style: normal; transition: transform .2s ease, background .2s ease; }
.feature-link-card:hover > i { transform: translate(2px,-2px); background: rgba(255,255,255,.16); }
.feature-link-grid + .feature-link-grid { margin-top: 15px; }

.brand-story-controls { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:0 0 13px; }
.brand-story-hint { color:var(--refresh-muted); font-size:.73rem; }
.brand-story-toggle { flex:none; padding:8px 12px; border:1px solid var(--refresh-line); border-radius:999px; color:var(--refresh-ink); background:var(--refresh-white); font:inherit; font-size:.72rem; font-weight:750; cursor:pointer; }
.brand-story-toggle:hover { border-color:var(--refresh-blue-dark); }
.brand-story-toggle:focus-visible,.brand-story-viewport:focus-visible { outline:3px solid #77b8ff; outline-offset:3px; }
.brand-story-viewport { overflow-x:auto; overflow-y:hidden; padding:2px 2px 18px; scrollbar-color:rgba(130,160,196,.55) transparent; scrollbar-width:thin; }
.brand-story-viewport.is-ready { overflow:hidden; }
.brand-story-viewport.is-ready:focus-within { overflow-x:auto; }
.brand-story-track { display:flex; width:max-content; }
.brand-story-track.is-rolling { animation:brand-story-roll 88s linear infinite; }
.brand-story-track.is-paused,.brand-story-viewport:hover .brand-story-track,.brand-story-viewport:focus-within .brand-story-track { animation-play-state:paused; }
@keyframes brand-story-roll { to { transform:translateX(-50%); } }
.use-case-grid { display:flex; width:max-content; gap:15px; padding-right:15px; }
.use-case-card { --case-accent:#e50914; position:relative; display:flex; flex:0 0 clamp(278px,29vw,330px); min-height:355px; flex-direction:column; justify-content:flex-end; padding:25px; overflow:hidden; border:1px solid rgba(255,255,255,.1); border-radius:18px; color:#fff; background:radial-gradient(ellipse at 72% 30%,color-mix(in srgb,var(--case-accent) 14%,transparent),transparent 52%),#131a26; text-decoration:none; isolation:isolate; }
.use-case-card--streaming-playback { --case-accent:#f2616b; }
.use-case-card--video-playback-errors { --case-accent:#54d38a; }
.use-case-card--energy-operations { --case-accent:#ffd334; }
.use-case-card--energy-services { --case-accent:#ed3c91; }
.use-case-card--telecom-operator { --case-accent:#5cb8ff; }
.use-case-card--payments-platform { --case-accent:#f36b3f; }
.use-case-card--online-marketplace { --case-accent:#f5a623; }
.use-case-card--digital-banking { --case-accent:#51d3a4; }
.use-case-card::after { position: absolute; z-index: 0; inset: 0; background: linear-gradient(180deg,rgba(8,10,15,.04) 8%,rgba(8,10,15,.22) 40%,rgba(8,10,15,.96) 100%); content: ""; transition: opacity .2s ease; }
.use-case-card:hover::after { opacity: .82; }
.use-case-card:focus-visible { outline:3px solid #77b8ff; outline-offset:3px; }
.use-case-card > :not(.use-case-signal-art) { position: relative; z-index: 2; }
.case-logo-surface { display:grid; width:max-content; min-width:76px; height:43px; margin-bottom:17px; padding:7px 12px; place-items:center; border:1px solid rgba(255,255,255,.78); border-radius:9px; background:#fff; color:#101722; box-shadow:0 4px 18px rgba(0,0,0,.12); }
.case-logo-surface i { font-size:1.4rem; line-height:1; }
.use-case-signal-art { position: absolute; z-index: 1; top: 24px; right: 22px; left: 22px; height: 154px; overflow: hidden; color: var(--case-accent); opacity: .93; pointer-events: none; }
.use-case-signal-art b { position: absolute; top: 8px; left: 5px; color: rgba(255,255,255,.56); font-size: .57rem; font-weight: 800; letter-spacing: .16em; }
.use-case-signal-art em { margin-left: 8px; color: var(--case-accent); font-size: .62rem; font-style: normal; letter-spacing: .06em; }
.signal-node { position: absolute; z-index: 2; width: 10px; height: 10px; border: 2px solid #101722; border-radius: 50%; background: currentColor; box-shadow: 0 0 18px color-mix(in srgb,var(--case-accent) 78%,transparent); }
.signal-node--a { top: 75px; left: 14%; }
.signal-node--b { top: 45px; left: 39%; }
.signal-node--c { top: 97px; left: 62%; }
.signal-node--d { top: 54px; left: 84%; }
.signal-node--e { top: 120px; left: 38%; }
.signal-line { position: absolute; z-index: 1; height: 1px; transform-origin: left center; background: linear-gradient(90deg,color-mix(in srgb,var(--case-accent) 15%,transparent),var(--case-accent)); box-shadow: 0 0 10px color-mix(in srgb,var(--case-accent) 60%,transparent); }
.signal-line--a { top: 81px; left: 16%; width: 27%; transform: rotate(-23deg); }
.signal-line--b { top: 49px; left: 41%; width: 25%; transform: rotate(47deg); }
.signal-line--c { top: 100px; left: 64%; width: 24%; transform: rotate(-39deg); }
.signal-line--d { top: 52px; left: 40%; width: 24%; transform: rotate(112deg); }
.signal-wave { width:8px; height:var(--wave-height,32px); border-radius:8px; background:linear-gradient(180deg,color-mix(in srgb,var(--case-accent) 25%,transparent),var(--case-accent)); box-shadow:0 0 16px color-mix(in srgb,var(--case-accent) 48%,transparent); }
.signal-wave:nth-child(2) { --wave-height:55px; }.signal-wave:nth-child(3) { --wave-height:86px; }.signal-wave:nth-child(4) { --wave-height:48px; }.signal-wave:nth-child(5) { --wave-height:72px; }.signal-wave:nth-child(6) { --wave-height:34px; }
.use-case-brand { margin-bottom: 12px; color: var(--case-accent); font-size: .62rem; font-weight: 850; letter-spacing: .12em; }
.use-case-card > strong { max-width: 18ch; font-size: 1.45rem; line-height: 1.08; letter-spacing: -.04em; }
.use-case-card > small { max-width: 32ch; margin-top: 9px; color: rgba(238,241,246,.8); font-size: .78rem; line-height: 1.55; }
.use-case-card > i { position: absolute; right: 18px; bottom: 20px; display: grid; width: 37px; height: 37px; place-items: center; border: 1px solid rgba(255,255,255,.5); border-radius: 50%; color: #fff; font-size: 1rem; font-style: normal; }
.use-case-disclaimer { max-width: 90ch; margin: 14px 0 0; color: var(--refresh-muted); font-size: .7rem; line-height: 1.55; }

.use-case-hero { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); align-items: center; gap: clamp(28px,6vw,76px); margin-top: 28px; padding: clamp(30px,5vw,68px); border: 1px solid var(--refresh-line); border-radius: 24px; background: var(--refresh-white); }
.use-case-hero h1 { max-width: 12ch; margin-top: 13px; color: var(--refresh-ink); font-size: clamp(2.7rem,5.2vw,5rem); line-height: .98; letter-spacing: -.06em; }
.use-case-hero .lead { margin-top: 17px; }
.use-case-visual { position: relative; min-height: 390px; overflow: hidden; border-radius: 18px; background: #121722; }
.use-case-visual--brand-map::after { display:none; }
.use-case-visual > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.use-case-visual::after { position: absolute; inset: 35% 0 0; background: linear-gradient(transparent,rgba(8,10,15,.88)); content: ""; }
.use-case-visual-label { position: absolute; z-index: 1; right: 20px; bottom: 20px; left: 20px; color: #fff; font-size: .72rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.brand-story-map { --case-accent:#52d6ad; position:absolute; inset:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:center; gap:clamp(8px,2vw,24px); padding:clamp(16px,4vw,42px); overflow:hidden; background:radial-gradient(ellipse at 50% 48%,color-mix(in srgb,var(--case-accent) 18%,transparent),transparent 57%),linear-gradient(145deg,#0a121b,#111d29 60%,#0a111a); }
.brand-story-map::before { position:absolute; top:50%; right:13%; left:13%; height:1px; background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--case-accent) 85%,transparent),transparent); content:""; }
.brand-story-map::after { position:absolute; inset:0; background-image:radial-gradient(rgba(255,255,255,.2) .7px,transparent .7px); background-size:22px 22px; content:""; opacity:.22; }
.brand-story-map-step { position:relative; z-index:1; display:flex; min-height:130px; flex-direction:column; justify-content:center; padding:clamp(10px,2vw,19px); border:1px solid color-mix(in srgb,var(--case-accent) 34%,rgba(255,255,255,.15)); border-radius:14px; background:rgba(9,16,24,.84); box-shadow:0 13px 35px rgba(0,0,0,.27); }
.brand-story-map-step > i { display:grid; width:29px; height:29px; margin-bottom:12px; place-items:center; border:1px solid color-mix(in srgb,var(--case-accent) 62%,transparent); border-radius:50%; color:var(--case-accent); font-size:.7rem; font-style:normal; }
.brand-story-map-step > strong { color:#fff; font-size:clamp(.75rem,1.5vw,1rem); line-height:1.2; }
.brand-story-map-step > small { margin-top:6px; color:rgba(231,239,247,.68); font-size:clamp(.58rem,1.1vw,.7rem); line-height:1.35; }
.use-case-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; margin-top: 20px; }
.use-case-step { padding: 20px; border: 1px solid var(--refresh-line); border-radius: 15px; background: var(--refresh-white); }
.use-case-step > span { color: var(--refresh-blue-dark); font-size: .64rem; font-weight: 850; letter-spacing: .13em; }
.use-case-step h2 { margin-top: 10px; color: var(--refresh-ink); font-size: 1.13rem; line-height: 1.15; }
.use-case-step p { margin: 8px 0 0; color: var(--refresh-muted); font-size: .81rem; line-height: 1.6; }
.use-case-note { margin-top: 16px; color: var(--refresh-muted); font-size: .68rem; line-height: 1.55; }
.story-narrative { display:grid; grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr); gap:clamp(24px,5vw,70px); align-items:start; margin-top:22px; padding:clamp(26px,4vw,52px); border:1px solid var(--refresh-line); border-radius:20px; background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.018)); }
.story-narrative h2 { max-width:16ch; margin-top:10px; color:var(--refresh-ink); font-size:clamp(1.8rem,3vw,2.8rem); line-height:1.04; letter-spacing:-.05em; }
.story-narrative-copy { color:var(--refresh-muted); font-size:.96rem; line-height:1.85; }
.story-narrative-copy p:first-child { margin-top:0; }
.story-narrative-copy p:last-child { margin-bottom:0; }
.story-signal-plan { display:grid; grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr); gap:clamp(24px,5vw,68px); align-items:start; margin-top:22px; padding:clamp(24px,4vw,44px); border:1px solid var(--refresh-line); border-radius:20px; background:var(--refresh-white); }
.story-signal-plan h2 { max-width:17ch; margin-top:9px; color:var(--refresh-ink); font-size:clamp(1.55rem,2.5vw,2.3rem); line-height:1.08; letter-spacing:-.04em; }
.story-signal-plan > div:first-child > p:last-child { color:var(--refresh-muted); font-size:.82rem; line-height:1.7; }
.story-signal-plan-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.story-signal-plan-card { padding:17px; border:1px solid var(--refresh-line); border-radius:13px; background:rgba(255,255,255,.035); }
.story-signal-plan-card h3 { margin:0; color:var(--refresh-ink); font-size:.92rem; line-height:1.2; }
.story-signal-plan-card p { margin:8px 0 0; color:var(--refresh-muted); font-size:.75rem; line-height:1.6; }
.story-next { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:22px; padding:22px 26px; border:1px solid var(--refresh-line); border-radius:16px; background:rgba(255,255,255,.035); }
.story-next strong { color:var(--refresh-ink); font-size:1rem; }
.story-next p { max-width:62ch; margin:5px 0 0; color:var(--refresh-muted); font-size:.78rem; line-height:1.6; }

.feature-hero { display: grid; grid-template-columns: minmax(0,.86fr) minmax(0,1.14fr); align-items: center; gap: clamp(32px,6vw,80px); margin-top: 28px; padding: clamp(34px,5vw,72px); border: 1px solid var(--refresh-line); border-radius: 27px; background: var(--refresh-white); box-shadow: 0 22px 62px rgba(24,36,62,.08); }
.feature-hero .feature-index { color: var(--refresh-blue-dark); font-size: .68rem; font-weight: 850; letter-spacing: .16em; text-transform: uppercase; }
.feature-hero h1 { max-width: 12ch; margin-top: 14px; color: var(--refresh-ink); font-family: Inter, "Avenir Next", "Segoe UI", system-ui, sans-serif; font-size: clamp(2.6rem,4.8vw,5rem); font-weight: 730; line-height: .98; letter-spacing: -.06em; }
.feature-hero .lead { margin-top: 18px; }
.feature-hero .hero-actions { margin-top: 24px; }
.feature-visual { position: relative; min-height: 430px; overflow: hidden; border-radius: 19px; background: #191827; }
.feature-visual > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.feature-visual::after { position: absolute; inset: 0; background: linear-gradient(180deg,rgba(14,13,26,.02),rgba(14,13,26,.28)); content: ""; }
.feature-ui-card { position: absolute; z-index: 1; right: 7%; bottom: 7%; left: 7%; padding: 19px; border: 1px solid #2b3547; border-radius: 15px; color: #eef1f6; background: rgba(13,17,24,.94); box-shadow: 0 18px 50px rgba(0,0,0,.3); backdrop-filter: blur(14px); }
.feature-ui-head { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 13px; border-bottom: 1px solid rgba(255,255,255,.12); }
.feature-ui-head span { display: block; color: #aaa8c0; font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; }
.feature-ui-head strong { display: block; margin-top: 5px; color: #fff; font-size: 1rem; }
.feature-ui-head i { align-self: flex-start; padding: 5px 8px; border: 1px solid rgba(135,230,189,.25); border-radius: 99px; color: #9de9c9; font-size: .62rem; font-style: normal; white-space: nowrap; }
.feature-ui-rows { display: grid; gap: 8px; margin-top: 12px; }
.feature-ui-row { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(45px,.55fr) minmax(40px,.5fr); align-items: center; gap: 9px; padding: 9px 10px; border: 1px solid rgba(255,255,255,.08); border-radius: 8px; background: rgba(255,255,255,.035); }
.feature-ui-row strong { overflow: hidden; color: #eef1f6; font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.feature-ui-row span { color: #b5b2c7; font-size: .66rem; }
.feature-ui-row em { color: #8ee1b9; font-size: .64rem; font-style: normal; text-align: right; }
.feature-ui-row em.warning { color: #f4bb76; }
.feature-story { display: grid; grid-template-columns: minmax(0,.7fr) minmax(0,1.3fr); gap: clamp(25px,6vw,85px); align-items: start; }
.feature-story h2 { max-width: 16ch; color: var(--refresh-ink); font-size: clamp(1.9rem,3vw,3rem); line-height: 1.04; letter-spacing: -.05em; }
.feature-story-copy { color: var(--refresh-muted); font-size: .97rem; line-height: 1.8; }
.feature-story-copy p:first-child { margin-top: 0; }
.feature-points { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin-top: 22px; }
.feature-point { padding: 18px; border: 1px solid var(--refresh-line); border-radius: 13px; background: var(--refresh-white); }
.feature-point b { color: var(--refresh-blue-dark); font-size: .65rem; letter-spacing: .12em; }
.feature-point strong { display: block; margin-top: 11px; color: var(--refresh-ink); font-size: .98rem; }
.feature-point p { margin: 7px 0 0; color: var(--refresh-muted); font-size: .78rem; line-height: 1.6; }
.feature-next { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 24px 28px; border: 1px solid var(--refresh-line); border-radius: 16px; background: var(--refresh-white); }
.feature-next p { margin: 0; color: var(--refresh-muted); font-size: .8rem; }
.feature-next a { color: var(--refresh-blue-dark); font-size: .88rem; font-weight: 750; text-decoration: none; }
.feature-next a:hover { text-decoration: underline; }

.feature-directory-grid .feature-link-card { min-height: 280px; }
.feature-directory-grid .feature-link-card > img { filter: saturate(.78); }

.architecture-directory-card { display: flex; flex-direction: column; }
.architecture-directory-art { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 138px; margin: 0 0 19px; padding: 18px; overflow: hidden; border: 1px solid rgba(169,205,228,.16); border-radius: 16px; color: #eef5f7; background: radial-gradient(ellipse at 50% 0%,rgba(91,192,171,.18),transparent 65%),linear-gradient(140deg,#0b1b25,#102c37 58%,#0e1d28); }
.architecture-directory-art span,.architecture-directory-art b { padding: 10px 12px; border: 1px solid rgba(195,225,233,.21); border-radius: 10px; color: #cbdadd; background: rgba(3,13,19,.58); font-size: .64rem; letter-spacing: .06em; }
.architecture-directory-art b { border-color: rgba(123,226,192,.38); color: #a5f0d2; font-size: .75rem; }
.architecture-directory-art i { color: #81cdb8; font-size: 1.1rem; font-style: normal; }
.routing-directory-art { background: radial-gradient(ellipse at 50% 0%,rgba(115,150,239,.24),transparent 65%),linear-gradient(140deg,#101827,#1a2641 58%,#101c29); }
.routing-directory-art b { border-color: rgba(144,166,255,.45); color: #c1caff; }
.architecture-visual { display: grid; align-content: center; gap: 16px; min-height: 430px; padding: clamp(20px,3vw,34px); border: 1px solid rgba(169,205,228,.16); border-radius: 19px; color: #eef5f7; background: radial-gradient(ellipse at 70% 0%,rgba(91,192,171,.18),transparent 56%),linear-gradient(145deg,#08151e,#102a35 55%,#0b1b26); box-shadow: 0 26px 60px rgba(1,14,22,.2); }
.architecture-visual--routing { background: radial-gradient(ellipse at 65% 0%,rgba(107,139,231,.24),transparent 58%),linear-gradient(145deg,#0a1420,#17233a 55%,#0b1a25); }
.architecture-kicker { margin: 0; color: #9eb5bb; font-size: .64rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.architecture-flow { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr); align-items: stretch; gap: 10px; }
.architecture-visual--routing .architecture-flow { grid-template-columns: minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr); }
.architecture-node { display: grid; align-content: start; gap: 9px; min-width: 0; padding: 15px 13px; border: 1px solid rgba(192,219,227,.18); border-radius: 13px; background: rgba(4,15,22,.62); }
.architecture-node--active { border-color: rgba(115,220,189,.45); background: rgba(24,75,73,.29); }
.architecture-visual--routing .architecture-node--active { border-color: rgba(146,166,255,.48); background: rgba(47,61,116,.35); }
.architecture-node small { color: #85a5ac; font-size: .6rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.architecture-node strong { color: #f2f7f5; font-size: clamp(.72rem,1.2vw,.93rem); line-height: 1.22; }
.architecture-node p { margin: 0; color: #b4c5c8; font-size: .68rem; line-height: 1.48; }
.architecture-arrow { align-self: center; color: #80cfb6; font-size: 1.2rem; }
.architecture-visual--routing .architecture-arrow { color: #a6b4ff; }
.architecture-footnote { margin: 0; padding-top: 13px; border-top: 1px solid rgba(196,220,227,.13); color: #b4c5c8; font-size: .7rem; line-height: 1.55; }
.feature-readiness { margin-top: 20px; padding: 18px 20px; border: 1px solid #d8dfcd; border-left: 4px solid #a48a36; border-radius: 12px; color: #514b37; background: #fffdf4; font-size: .78rem; line-height: 1.65; }
.feature-readiness strong { display: block; margin-bottom: 5px; color: #393622; font-size: .82rem; }
.architecture-detail-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin-top: 24px; }
.architecture-detail-card { padding: 22px; border: 1px solid var(--refresh-line); border-radius: 15px; background: var(--refresh-white); }
.architecture-detail-card > span { color: var(--refresh-blue-dark); font-size: .65rem; font-weight: 850; letter-spacing: .13em; }
.architecture-detail-card h3 { margin: 10px 0 8px; color: var(--refresh-ink); font-size: 1.08rem; line-height: 1.2; }
.architecture-detail-card p,.architecture-detail-card li { color: var(--refresh-muted); font-size: .81rem; line-height: 1.65; }
.architecture-detail-card p { margin: 0; }
.architecture-detail-card ul { margin: 8px 0 0; padding-left: 18px; }
.architecture-detail-card li + li { margin-top: 5px; }
.architecture-page-next { display: flex; flex-wrap: wrap; gap: 12px; margin: 24px 0 72px; }
.architecture-page-next a { display: inline-flex; align-items: center; gap: 10px; padding: 13px 16px; border: 1px solid rgba(255,255,255,.2); border-radius: 12px; color: #eef1f6; background: rgba(255,255,255,.06); font-size: .82rem; font-weight: 750; text-decoration: none; }
.architecture-page-next a:hover { border-color: #9cb0ff; color: #c5d0ff; background: rgba(112,137,232,.16); }

@media (max-width: 1050px) {
  .hero-cinematic { grid-template-columns: 1fr; min-height: unset; padding: 64px clamp(22px,6vw,60px); }
  .hero-cinematic .hero-copy h1 { max-width: 16ch; }
  .hero-incident-visual { width: min(100%,780px); min-height: 500px; margin: 0 auto; }
  .feature-hero { grid-template-columns: 1fr; }
  .feature-hero .feature-copy { max-width: 760px; }
  .feature-visual { min-height: 500px; }
}
@media (max-width: 760px) {
  .hero-cinematic { gap: 34px; padding: 50px 20px 54px; border-radius: 0 0 24px 24px; }
  .hero-cinematic .hero-copy h1 { max-width: 13ch; font-size: clamp(2.5rem,10vw,4.1rem); }
  .hero-cinematic .signal-strip { grid-template-columns: 1fr; }
  .hero-cinematic .signal-strip article { min-height: 0; padding: 11px 13px; }
  .hero-incident-visual { min-height: 440px; border-radius: 18px; }
  .hero-incident-caption { bottom: 100px; }
  .hero-story-path { right: 11px; bottom: 11px; left: 11px; gap: 5px; padding: 10px; }
  .hero-story-path span { gap: 5px; font-size: .62rem; }
  .hero-story-path i { width: 22px; height: 22px; }
  .hero-photo-credit { max-width: 70%; font-size: .52rem; }
  .story-intro { grid-template-columns: 1fr; gap: 15px; }
  .story-intro .eyebrow { grid-column: auto; margin-bottom: 0; }
  .story-photo-main { min-height: 390px; border-radius: 17px; }
  .story-chapters { grid-template-columns: 1fr; }
  .use-case-card { min-height: 310px; padding:22px; }
  .use-case-hero { grid-template-columns: 1fr; padding: 24px; }
  .use-case-visual { min-height: 280px; }
  .story-narrative,.story-signal-plan { grid-template-columns:1fr; gap:15px; padding:22px; }
  .story-signal-plan-grid { grid-template-columns:1fr; }
  .story-next { align-items:flex-start; flex-direction:column; }
  .brand-story-map { gap:7px; padding:14px; }
  .brand-story-map-step { min-height:110px; padding:9px; border-radius:11px; }
  .brand-story-map-step > i { width:24px; height:24px; margin-bottom:8px; }
  .use-case-steps { grid-template-columns: 1fr; }
  .story-chapter { display: grid; grid-template-columns: 120px minmax(0,1fr); gap: 0 15px; padding: 0 12px 13px 0; }
  .story-chapter-image { grid-column: 1; grid-row: 1 / span 3; height: 100%; min-height: 150px; }
  .story-chapter > .story-step,.story-chapter h3,.story-chapter p,.story-chapter > a { grid-column: 2; margin-right: 0; margin-left: 0; }
  .story-chapter > .story-step { margin-top: 14px; }
  .story-chapter h3 { margin-top: 6px; font-size: 1.08rem; }
  .story-chapter p { margin-top: 5px; font-size: .76rem; }
  .story-chapter-text { display: grid; grid-template-columns: 44px minmax(0,1fr); padding: 15px 14px 17px; }
  .story-resolution-mark { grid-column: 1; grid-row: 1 / span 3; width: 38px; height: 38px; margin: 0; }
  .story-chapter-text > a { margin-top: 12px; padding-top: 0; }
  .feature-link-grid,.feature-directory-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .feature-link-card { min-height: 265px; padding: 16px; border-radius: 14px; }
  .feature-link-card > strong { font-size: 1.12rem; }
  .feature-link-card > small { font-size: .72rem; }
  .feature-link-card > i { right: 13px; bottom: 14px; width: 32px; height: 32px; }
  .feature-hero { gap: 26px; margin-top: 14px; padding: 26px 19px; border-radius: 19px; }
  .feature-hero h1 { font-size: clamp(2.7rem,11vw,4.2rem); }
  .feature-visual { min-height: 400px; border-radius: 14px; }
  .feature-ui-card { right: 4%; bottom: 5%; left: 4%; padding: 14px; }
  .feature-story { grid-template-columns: 1fr; gap: 16px; }
  .feature-points { grid-template-columns: 1fr; }
  .feature-next { align-items: flex-start; flex-direction: column; padding: 19px; }
  .architecture-flow { grid-template-columns: 1fr; }
  .architecture-arrow { justify-self: center; transform: rotate(90deg); }
  .architecture-detail-grid { grid-template-columns: 1fr; }
  .architecture-visual { min-height: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .brand-story-viewport.is-ready { overflow-x:auto; }
  .brand-story-track.is-rolling { animation:none; }
}
@media (max-width: 480px) {
  .feature-link-grid,.feature-directory-grid { grid-template-columns: 1fr; }
  .feature-link-card { min-height: 260px; }
  .feature-visual { min-height: 340px; }
  .feature-ui-card { right: 4%; bottom: 4%; left: 4%; padding: 11px; }
  .feature-ui-row { gap: 5px; padding: 8px 7px; }
  .feature-ui-row strong { font-size: .65rem; }
  .feature-ui-row span,.feature-ui-row em { font-size: .59rem; }
}

/* Compact homepage directory, brand-story reel, and standalone story pages. */
.directory-hero { min-height: 590px; padding-top: clamp(42px,6vw,78px); padding-bottom: clamp(42px,6vw,78px); }
.directory-hero .hero-copy h1 { max-width: 12ch; }
.directory-hero-note { margin: 22px 0 0; color: rgba(243,244,255,.65); font-size: .8rem; }
.directory-hero-visual { min-height: 420px; }
.home-brand-reel { padding-top: clamp(42px,5vw,66px); padding-bottom: 24px; }
.home-reel-heading { align-items: end; }
.home-reel-heading h2 { max-width: 19ch; }
.directory-text-link { display: inline-flex; flex: none; align-items: center; gap: 9px; padding: 11px 0; color: var(--refresh-blue-dark); font-size: .85rem; font-weight: 750; text-decoration: none; }
.directory-text-link:hover { color: var(--refresh-blue); }
.home-brand-viewport { padding-bottom: 12px; }
.home-brand-grid .use-case-card { min-height: 285px; flex-basis: clamp(250px,24vw,300px); padding: 21px; }
.home-brand-grid .use-case-card::before { position: absolute; z-index: 1; top: 25px; right: 23px; left: 23px; height: 76px; border-bottom: 1px solid color-mix(in srgb,var(--case-accent) 35%,transparent); background: repeating-linear-gradient(0deg,transparent 0 24px,rgba(255,255,255,.065) 25px),linear-gradient(165deg,transparent 0 42%,color-mix(in srgb,var(--case-accent) 72%,transparent) 43%,transparent 44% 60%,color-mix(in srgb,var(--case-accent) 46%,transparent) 61%,transparent 62%); content:""; opacity:.7; }
.home-brand-grid .case-logo-surface { margin-bottom: 12px; }
.home-brand-grid .use-case-brand { font-size: .58rem; }
.home-brand-grid .use-case-card > strong { font-size: 1.05rem; }
.home-brand-grid .use-case-card > small { font-size: .7rem; }
.home-brand-demo-cta { margin: 8px 0 14px; }
.home-brand-note { margin: 5px 0 0; color: #77869a; font-size: .66rem; }
.directory-paths { padding-top: clamp(44px,5vw,68px); padding-bottom: clamp(58px,7vw,90px); }
.directory-card-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.directory-card { position: relative; display: flex; min-height: 242px; flex-direction: column; padding: clamp(22px,3vw,34px); overflow: hidden; border: 1px solid rgba(255,255,255,.09); border-radius: 20px; color: #fff; background: linear-gradient(145deg,#131d2c,#0d1119); text-decoration: none; isolation: isolate; transition: transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.directory-card::before { position: absolute; z-index: -1; top: -52px; right: -28px; width: 180px; height: 180px; border: 1px solid rgba(114,168,255,.22); border-radius: 50%; box-shadow: 0 0 0 22px rgba(114,168,255,.035),0 0 0 48px rgba(114,168,255,.025); content:""; }
.directory-card:hover { transform: translateY(-4px); border-color: rgba(114,168,255,.46); box-shadow: 0 20px 50px rgba(0,0,0,.18); }
.directory-card > span { color: #9acaff; font-size: .64rem; font-weight: 800; letter-spacing: .14em; }
.directory-card > strong { max-width: 15ch; margin-top: 29px; font-size: clamp(1.28rem,2.3vw,1.8rem); line-height: 1.08; letter-spacing: -.04em; }
.directory-card > p { max-width: 38ch; margin: 11px 30px 0 0; color: rgba(239,243,250,.72); font-size: .8rem; line-height: 1.55; }
.directory-card > i { position: absolute; right: 24px; bottom: 24px; color: #fff; font-size: 1.15rem; font-style: normal; }
.directory-card--tour::before { border-color: rgba(94,211,176,.24); box-shadow: 0 0 0 22px rgba(94,211,176,.035),0 0 0 48px rgba(94,211,176,.025); }
.directory-card--stories::before { border-color: rgba(255,195,91,.24); box-shadow: 0 0 0 22px rgba(255,195,91,.035),0 0 0 48px rgba(255,195,91,.025); }
.tour-page-hero,.stories-page-hero { min-height: 340px; padding-top: clamp(55px,7vw,85px); padding-bottom: 25px; }
.tour-page-hero .hero-copy h1,.stories-page-hero .hero-copy h1 { max-width: 17ch; }
.tour-page-disclaimer,.stories-page-note { max-width: 78ch; margin: 16px 0 0; color: var(--refresh-muted); font-size: .76rem; line-height: 1.6; }
.tour-page-section { padding-top: 24px; }
.tour-next-links { display: flex; flex-wrap: wrap; gap: 12px; padding-top: 20px; padding-bottom: 66px; }
.tour-next-links a { display: inline-flex; align-items: center; justify-content: space-between; gap: 32px; min-width: min(290px,100%); padding: 15px 18px; border: 1px solid var(--refresh-line); border-radius: 13px; color: var(--refresh-ink); background: var(--refresh-white); font-size: .84rem; font-weight: 750; text-decoration: none; transition: border-color .18s ease,background-color .18s ease,transform .18s ease; }
.tour-next-links a:hover { transform: translateY(-2px); border-color: #d7b64f; background: #151a18; }
.tour-next-links a:focus-visible { outline: 2px solid #d7b64f; outline-offset: 3px; }
.stories-page-art { min-height: 245px; border: 0; background: transparent; box-shadow: none; }
.stories-page-art .dashboard-shell { max-width: 520px; margin-left: auto; }
.stories-directory { padding-top: 20px; padding-bottom: clamp(55px,7vw,90px); }
.stories-demo-feature { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr); align-items:center; gap:clamp(28px,5vw,72px); margin:18px auto 34px; padding:clamp(24px,4vw,44px); border:1px solid var(--refresh-line); border-radius:22px; background:linear-gradient(130deg,rgba(224,185,77,.105),rgba(255,255,255,.025) 58%); }
.stories-demo-copy h2 { max-width:17ch; margin:8px 0 12px; color:var(--refresh-ink); font-size:clamp(1.55rem,3vw,2.35rem); font-weight:650; letter-spacing:-.035em; line-height:1.12; }
.stories-demo-copy > p:not(.eyebrow) { max-width:62ch; margin:0 0 20px; color:var(--refresh-muted); font-size:.92rem; line-height:1.75; }
.stories-demo-steps { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:0; padding:0; list-style:none; }
.stories-demo-steps li { display:flex; align-items:center; gap:13px; min-height:78px; padding:14px; border:1px solid var(--refresh-line); border-radius:14px; background:rgba(9,13,12,.72); }
.stories-demo-steps li > span { display:grid; width:33px; height:33px; flex:0 0 33px; place-items:center; border:1px solid rgba(221,185,86,.42); border-radius:50%; color:#e6c762; font-size:.72rem; font-weight:700; }
.stories-demo-steps strong,.stories-demo-steps small { display:block; }
.stories-demo-steps strong { color:var(--refresh-ink); font-size:.88rem; font-weight:650; }
.stories-demo-steps small { margin-top:4px; color:var(--refresh-muted); font-size:.71rem; line-height:1.4; }
.stories-directory-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; }
.stories-directory-grid .use-case-card { min-width: 0; min-height: 365px; flex: initial; }
.stories-directory-grid .use-case-card > strong { max-width: 23ch; font-size: 1.18rem; }
.stories-directory-grid .use-case-card > small { max-width: 36ch; }

.site-shell { padding-bottom: 0; }

@media (max-width: 900px) {
  .stories-demo-feature { grid-template-columns:1fr; }
  .directory-card-grid,.stories-directory-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 620px) {
  .directory-hero { min-height: 0; }
  .directory-hero .hero-copy h1 { font-size: clamp(2.55rem,12vw,3.6rem); }
  .directory-hero-visual { min-height: 360px; }
  .home-reel-heading { align-items: flex-start; }
  .home-reel-heading .directory-text-link { margin-top: 6px; }
  .directory-card-grid,.stories-directory-grid { grid-template-columns: 1fr; }
  .directory-card { min-height: 205px; }
  .tour-page-hero,.stories-page-hero { min-height: 0; }
  .stories-page-art { min-height: 190px; }
  .stories-directory-grid .use-case-card { min-height: 330px; }
}

/* Shared typography: clean system sans, lighter hierarchy, and comfortable reading rhythm. */
body {
  font-family: Inter, "Avenir Next", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif;
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body :is(h1, h2, h3, h4, .brand-lockup strong, .dashboard-value, .directory-card > strong, .feature-link-card > strong, .use-case-card > strong) {
  font-family: inherit;
  font-weight: 540;
  letter-spacing: -.022em;
}

body :is(.hero-copy h1, .hero-cinematic .hero-copy h1, .directory-hero .hero-copy h1, .tour-page-hero .hero-copy h1, .stories-page-hero .hero-copy h1, .feature-hero h1, .use-case-hero h1, .hero-incident-caption h2, .section-header h2, .story-intro h2, .feature-story h2, .story-narrative h2, .story-signal-plan h2, .closing-band h2, .console-heading h2, .tour-screen-heading h3, .tour-insight-card h4, .story-chapter h3, .story-photo-caption strong, .architecture-node strong, .feature-point strong, .tour-chapter-copy strong, .brand-story-map-step > strong) {
  font-weight: 560;
  letter-spacing: -.028em;
}

body :is(.eyebrow, .feature-index, .feature-link-card > span, .directory-card > span, .use-case-brand, .architecture-kicker, .architecture-detail-card > span, .hero-incident-kicker, .hero-story-path span, .story-photo-caption span, .story-step, .use-case-signal-art b, .architecture-node small, .tour-narration-kicker, .tour-screen-kicker, .tour-chapter-number, .tour-insight-label, .console-kicker, .incident-heading) {
  font-weight: 580;
  letter-spacing: .09em;
}

body :is(.main-nav a, .cta-link, .ghost-link.strong, .directory-text-link, .feature-next a, .architecture-page-next a) {
  font-weight: 560;
}

.lead { font-size: clamp(1.04rem, 1.1vw, 1.14rem); line-height: 1.78; }
.feature-story-copy,.story-narrative-copy { font-size: 1rem; line-height: 1.82; }
.use-case-step p,.story-signal-plan-card p,.architecture-detail-card p,.architecture-detail-card li,.feature-point p { font-size: .9rem; line-height: 1.75; }
.architecture-node p,.architecture-footnote { font-size: .75rem; line-height: 1.65; }
.story-next p,.stories-page-note,.section-note { font-size: .86rem; line-height: 1.7; }
.use-case-brand { font-size: .7rem; letter-spacing: .08em; }
.use-case-card > small { font-size: .88rem; line-height: 1.65; }
.use-case-visual-label { font-size: .76rem; font-weight: 600; letter-spacing: .06em; }
.brand-story-map-step > small { font-size: clamp(.68rem,1.15vw,.76rem); line-height: 1.5; }
.use-case-step > span { font-size: .7rem; font-weight: 600; letter-spacing: .09em; }
.story-signal-plan-card h3 { font-size: 1rem; font-weight: 600; }
.story-signal-plan-card p { font-size: .86rem; line-height: 1.7; }
.directory-card > p { font-size: .88rem; line-height: 1.68; }
.architecture-node small,.architecture-kicker,.architecture-detail-card > span { font-weight: 580; letter-spacing: .09em; }
.architecture-node p { font-size: .75rem; }
.tour-screen-heading h3,.console-heading h2,.tour-insight-card h4 { font-size: 1rem; }
.tour-chapter-copy strong,.console-metrics strong,.tour-metrics article > strong { font-weight: 620; letter-spacing: -.025em; }
.tour-narration p,.tour-insight-card p,.tour-chapter-copy p { font-size: .82rem; line-height: 1.65; }


/* Homepage footer: the OnyxNexus Technologies Ltd footer, as on onyxcloud.global. */
.site-footer.group-footer { display: block; width: 100vw; max-width: none; margin: 40px 0 0 calc(50% - 50vw); padding: 12px 28px 28px; border: 0; border-radius: 0; background: #f7f7f2; color: #11110f; }
.group-footer-panel { max-width: 1760px; margin: 0 auto; padding: clamp(28px, 4vw, 56px); border: 1px solid rgba(17,17,15,.06); border-radius: clamp(22px, 2.6vw, 36px); background: #fff; }
.group-footer-brand img { display: block; width: min(100%, 440px); height: auto; }
.group-footer-brand p { max-width: 36ch; margin: 8px 0 0; color: rgba(17,17,15,.72); font-size: 1.15rem; line-height: 1.5; }
.group-footer-directory { display: grid; grid-template-columns: .9fr 1.05fr 2.2fr 1fr; gap: 32px; margin-top: 40px; }
.group-footer-directory section { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.group-footer-directory h3 { margin: 0 0 4px; color: rgba(17,17,15,.72); font-size: .75rem; font-weight: 680; letter-spacing: .12em; line-height: 1.5; text-transform: uppercase; }
.group-footer-directory a, .group-footer-directory span { color: #11110f; font-size: .95rem; line-height: 1.5; text-decoration: none; }
.group-footer-directory a:hover, .group-footer-directory a:focus-visible { text-decoration: underline; text-underline-offset: 3px; }
.group-footer-directory .separate-site { color: rgba(17,17,15,.55); font-size: .78em; }
.group-footer-divisions { width: 100%; }
.group-footer-divisions > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; width: 100%; }
.group-footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 16px; margin-top: 36px; padding-top: 18px; border-top: 1px solid rgba(17,17,15,.1); color: rgba(17,17,15,.72); font-size: .88rem; line-height: 1.5; }
.group-footer-bottom nav { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.group-footer-bottom a { color: inherit; text-decoration: none; }
.group-footer-bottom a:hover, .group-footer-bottom a:focus-visible { color: #11110f; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 1000px) {
  .group-footer-directory { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .group-footer-divisions { grid-column: span 2; }
}
@media (max-width: 620px) {
  .site-footer.group-footer { padding: 10px 12px 14px; }
  .group-footer-directory { grid-template-columns: 1fr; gap: 26px; margin-top: 28px; }
  .group-footer-divisions { grid-column: auto; }
  .group-footer-divisions > div { grid-template-columns: 1fr; }
}