/* PERPA project family — shared portfolio cards and bespoke case-study pages */
:root {
  --perpa-red: #e51b23;
  --perpa-red-dark: #b90f17;
  --perpa-ink: #111111;
  --perpa-paper: #f4f1ec;
  --perpa-white: #ffffff;
  --perpa-gray: #6f7175;
  --perpa-line: rgba(17, 17, 17, .13);
  --perpa-ease: cubic-bezier(.22, 1, .36, 1);
}

/* Portfolio listing cards */
.perpa-project-card {
  overflow: hidden;
  border-color: rgba(229, 27, 35, .3) !important;
  transform-style: preserve-3d;
}

.perpa-project-card:hover {
  border-color: var(--perpa-red) !important;
  box-shadow: 0 28px 70px -32px rgba(229, 27, 35, .55) !important;
}

.perpa-card-family {
  color: var(--perpa-red);
  font: 700 9px/1 var(--font-mono, monospace);
  letter-spacing: .12em;
  text-transform: uppercase;
}

.perpa-card-cover {
  position: relative;
  display: block;
  width: 100%;
  min-height: 250px;
  overflow: hidden;
  color: #111 !important;
  text-decoration: none !important;
  background: #f5f2ed;
  isolation: isolate;
}

.perpa-card-cover::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(rgba(17, 17, 17, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(17, 17, 17, .055) 1px, transparent 1px);
  background-size: 34px 34px;
  transform: scale(1.06);
  transition: transform .7s var(--perpa-ease);
}

.perpa-card-cover::after {
  content: "";
  position: absolute;
  width: 190px;
  height: 190px;
  right: -60px;
  bottom: -85px;
  z-index: -1;
  border-radius: 50%;
  background: var(--perpa-red);
  transition: transform .7s var(--perpa-ease);
}

.perpa-project-card:hover .perpa-card-cover::before { transform: scale(1); }
.perpa-project-card:hover .perpa-card-cover::after { transform: scale(1.15); }

.perpa-card-cover__brand {
  position: absolute;
  top: 24px;
  left: 26px;
  display: flex;
  align-items: center;
  gap: 9px;
  color: #111;
  font: 800 12px/1 var(--font-sans, Inter, sans-serif);
  letter-spacing: .14em;
}

.perpa-card-cover__brand img { width: 20px; height: auto; image-rendering: auto; }
.perpa-card-cover__index { position: absolute; top: 27px; right: 27px; color: #777; font: 500 11px/1 var(--font-mono, monospace); }
.perpa-card-cover__title { position: absolute; left: 26px; bottom: 28px; max-width: 62%; font: 800 clamp(1.45rem, 3vw, 2.15rem)/.98 var(--font-sans, Inter, sans-serif); letter-spacing: -.055em; }
.perpa-card-cover__line { position: absolute; left: 26px; right: 26px; bottom: 17px; height: 2px; background: #111; transform-origin: left; transition: transform .5s var(--perpa-ease); }

.perpa-card-cover__ui {
  position: absolute;
  top: 76px;
  right: 26px;
  width: 42%;
  height: 112px;
  padding: 15px;
  border: 2px solid #111;
  border-radius: 13px;
  background: rgba(255,255,255,.78);
  box-shadow: 9px 9px 0 var(--perpa-red);
  transform: rotate(2deg);
  transition: transform .55s var(--perpa-ease), box-shadow .55s var(--perpa-ease);
}

.perpa-project-card:hover .perpa-card-cover__ui { transform: rotate(0) translateY(-5px); box-shadow: 13px 14px 0 var(--perpa-red); }
.perpa-card-cover__ui i { display: block; width: 100%; height: 7px; margin-bottom: 10px; border-radius: 6px; background: #dedbd6; }
.perpa-card-cover__ui i:first-child { width: 58%; background: var(--perpa-red); }
.perpa-card-cover__ui i:nth-child(3) { width: 76%; }
.perpa-card-cover__ui i:last-child { width: 38%; background: #111; }
.perpa-card-cover[data-perpa-visual="mobile"] .perpa-card-cover__ui { width: 31%; height: 138px; border-radius: 20px; }
.perpa-card-cover[data-perpa-visual="voice"] .perpa-card-cover__ui i { display: inline-block; width: 4px; height: 45px; margin: 18px 4px 0 0; vertical-align: bottom; background: var(--perpa-red); }
.perpa-card-cover[data-perpa-visual="voice"] .perpa-card-cover__ui i:nth-child(2) { height: 70px; }
.perpa-card-cover[data-perpa-visual="voice"] .perpa-card-cover__ui i:nth-child(3) { height: 30px; }
.perpa-card-cover[data-perpa-visual="voice"] .perpa-card-cover__ui i:nth-child(4) { height: 54px; }

/* Bespoke detail page foundation */
.perpa-html { scroll-behavior: smooth; background: var(--perpa-paper); }
.perpa-page { margin: 0; overflow-x: hidden; color: var(--perpa-ink); background: var(--perpa-paper); font-family: "DM Sans", system-ui, sans-serif; line-height: 1.55; }
.perpa-page *, .perpa-page *::before, .perpa-page *::after { box-sizing: border-box; }
.perpa-page h1, .perpa-page h2, .perpa-page h3, .perpa-page p, .perpa-page dl, .perpa-page dd { margin: 0; }
.perpa-page a { color: inherit; }
.perpa-page button { font: inherit; }
.perpa-page img, .perpa-page svg { display: block; max-width: 100%; }
.perpa-wrap { width: 100%; max-width: 1440px; margin-inline: auto; padding-inline: clamp(22px, 4.5vw, 72px); }
.perpa-skip { position: fixed; top: 10px; left: 10px; z-index: 1000; padding: 11px 16px; color: #fff; background: #111; transform: translateY(-150%); transition: transform .2s; }
.perpa-skip:focus { transform: translateY(0); }
.perpa-progress { position: fixed; top: 0; left: 0; z-index: 1001; width: 100%; height: 3px; background: transparent; }
.perpa-progress span { display: block; width: 100%; height: 100%; background: var(--perpa-red); transform: scaleX(0); transform-origin: left; will-change: transform; }

.perpa-topbar { position: fixed; inset: 0 0 auto; z-index: 100; width: 100%; border-bottom: 1px solid transparent; transition: background .35s, border-color .35s, transform .35s var(--perpa-ease); }
.perpa-topbar.is-scrolled { border-color: rgba(17,17,17,.1); background: rgba(244,241,236,.88); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); }
.perpa-topbar__inner { min-height: 78px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 28px; }
.perpa-back { display: inline-flex; width: fit-content; align-items: center; gap: 9px; color: #343434; font-size: 13px; font-weight: 700; text-decoration: none; }
.perpa-back svg { transition: transform .25s var(--perpa-ease); }
.perpa-back:hover svg { transform: translateX(-4px); }
.perpa-brand { display: flex; align-items: center; gap: 10px; color: #111; text-decoration: none; }
.perpa-brand__mark { display: grid; width: 34px; height: 46px; place-items: center; overflow: hidden; background: var(--perpa-red); }
.perpa-brand__mark img { width: 21px; filter: brightness(0) invert(1); }
.perpa-brand > span:last-child { display: flex; flex-direction: column; }
.perpa-brand strong { font: 800 13px/1 "Manrope", sans-serif; letter-spacing: .18em; }
.perpa-brand small { margin-top: 5px; color: #777; font-size: 9px; letter-spacing: .09em; }
.perpa-nav { justify-self: end; display: flex; align-items: center; gap: 24px; }
.perpa-nav a { position: relative; color: #5b5b5b; font-size: 12px; font-weight: 700; text-decoration: none; }
.perpa-nav a::after { content: ""; position: absolute; right: 0; bottom: -7px; left: 0; height: 1px; background: var(--perpa-red); transform: scaleX(0); transform-origin: right; transition: transform .3s var(--perpa-ease); }
.perpa-nav a:hover::after, .perpa-nav a.is-active::after { transform: scaleX(1); transform-origin: left; }
.perpa-menu-button { justify-self: end; display: none; min-height: 44px; align-items: center; gap: 10px; padding: 8px 12px; color: #111; border: 1px solid var(--perpa-line); background: transparent; cursor: pointer; }

.perpa-drawer { position: fixed; inset: 0; z-index: 300; visibility: hidden; width: 100%; opacity: 0; pointer-events: none; transition: opacity .3s, visibility .3s; }
.perpa-drawer.is-open { visibility: visible; opacity: 1; pointer-events: auto; }
.perpa-drawer__backdrop { position: absolute; inset: 0; width: 100%; border: 0; background: rgba(17,17,17,.56); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); cursor: pointer; }
.perpa-drawer__panel { position: absolute; top: 0; right: 0; width: min(100%, 520px); min-height: 100%; padding: 30px; background: #f6f3ee; transform: translateX(100%); transition: transform .55s var(--perpa-ease); }
.perpa-drawer.is-open .perpa-drawer__panel { transform: translateX(0); }
.perpa-drawer__head { display: flex; align-items: center; justify-content: space-between; padding-bottom: 26px; border-bottom: 1px solid var(--perpa-line); font: 700 12px/1 "Manrope", sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.perpa-drawer__head button { display: grid; width: 44px; height: 44px; place-items: center; border: 1px solid var(--perpa-line); background: transparent; cursor: pointer; }
.perpa-drawer__list { display: flex; flex-direction: column; }
.perpa-drawer__list a { display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 12px; min-height: 92px; border-bottom: 1px solid var(--perpa-line); text-decoration: none; transition: padding .3s var(--perpa-ease), color .2s; }
.perpa-drawer__list a > span { color: #999; font: 500 11px/1 monospace; }
.perpa-drawer__list a strong { font: 800 clamp(1.2rem, 3vw, 1.75rem)/1.1 "Manrope", sans-serif; letter-spacing: -.04em; }
.perpa-drawer__list a:hover, .perpa-drawer__list a[aria-current="page"] { padding-inline: 12px; color: var(--perpa-red); }

.perpa-hero { position: relative; width: 100%; min-height: 100svh; padding: 118px 0 78px; overflow: hidden; background: var(--perpa-paper); isolation: isolate; }
.perpa-hero__grid { position: absolute; inset: 0; z-index: -3; width: 100%; opacity: .65; background-image: linear-gradient(rgba(17,17,17,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(17,17,17,.045) 1px,transparent 1px); background-size: 58px 58px; mask-image: linear-gradient(to bottom, #000, transparent 92%); }
.perpa-orbit { position: absolute; z-index: -2; width: 42vw; aspect-ratio: 1; border: 1px solid rgba(229,27,35,.16); border-radius: 50%; will-change: transform; }
.perpa-orbit::before, .perpa-orbit::after { content: ""; position: absolute; inset: 13%; border: inherit; border-radius: inherit; }
.perpa-orbit::after { inset: 33%; background: rgba(229,27,35,.035); }
.perpa-orbit--one { top: -22vw; right: -8vw; }
.perpa-orbit--two { bottom: -28vw; left: -19vw; border-color: rgba(17,17,17,.09); }
.perpa-hero__inner { display: grid; grid-template-columns: minmax(0, .92fr) minmax(480px, 1.08fr); align-items: center; gap: clamp(34px, 6vw, 96px); min-height: calc(100svh - 196px); }
.perpa-kicker { display: flex; align-items: center; gap: 12px; margin-bottom: 27px; color: #555; font: 700 11px/1 "Manrope", sans-serif; letter-spacing: .15em; text-transform: uppercase; }
.perpa-kicker span { width: 34px; height: 2px; background: var(--perpa-red); }
.perpa-hero h1 { max-width: 780px; font: 800 clamp(3.9rem, 7.2vw, 7.4rem)/.86 "Manrope", sans-serif; letter-spacing: -.085em; }
.perpa-hero h1 span { display: block; color: var(--perpa-red); font-size: .35em; line-height: 1.4; letter-spacing: .08em; }
.perpa-hero__statement { max-width: 630px; margin-top: 32px !important; color: #56575a; font-size: clamp(1.04rem, 1.55vw, 1.28rem); line-height: 1.62; }
.perpa-hero__actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 34px; }
.perpa-button { display: inline-flex; min-height: 50px; align-items: center; justify-content: center; gap: 13px; padding: 13px 21px; border: 1px solid #111; color: #111; background: transparent; font-size: 13px; font-weight: 700; text-decoration: none; cursor: pointer; transition: transform .3s var(--perpa-ease), background .25s, color .25s, box-shadow .3s; }
.perpa-button:hover { transform: translateY(-3px); }
.perpa-button--red { border-color: var(--perpa-red); color: #fff !important; background: var(--perpa-red); box-shadow: 0 12px 28px -16px rgba(229,27,35,.8); }
.perpa-button--red:hover { background: var(--perpa-red-dark); box-shadow: 0 18px 32px -15px rgba(229,27,35,.8); }
.perpa-button--ghost:hover { color: #fff; background: #111; }
.perpa-meta { display: flex; gap: 32px; margin-top: 44px !important; padding-top: 20px; border-top: 1px solid var(--perpa-line); }
.perpa-meta div { display: flex; flex-direction: column; gap: 7px; }
.perpa-meta dt { color: #929292; font-size: 9px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }
.perpa-meta dd { display: flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 700; }
.perpa-meta dd i { width: 7px; height: 7px; border-radius: 50%; background: #20a765; box-shadow: 0 0 0 4px rgba(32,167,101,.12); }
.perpa-hero__visual { position: relative; width: 100%; min-width: 0; perspective: 1200px; }
.perpa-product-label { display: flex; align-items: center; justify-content: space-between; margin-bottom: 13px; color: #6d6d6d; font: 600 10px/1 "Manrope", sans-serif; letter-spacing: .09em; text-transform: uppercase; }
.perpa-product-label i { width: 7px; height: 7px; border-radius: 50%; background: var(--perpa-red); animation: perpa-pulse 2s infinite; }
.perpa-float { animation: perpa-float 7s ease-in-out infinite; }
.perpa-float-card { position: absolute; z-index: 3; display: flex; min-width: 138px; align-items: center; gap: 9px; padding: 13px 15px; border: 1px solid rgba(17,17,17,.12); background: rgba(255,255,255,.9); box-shadow: 0 18px 50px -24px rgba(17,17,17,.45); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.perpa-float-card--left { bottom: 6%; left: -3%; animation: perpa-float 6s .7s ease-in-out infinite; }
.perpa-float-card--right { top: 17%; right: -3%; animation: perpa-float 5.5s 1.2s ease-in-out infinite reverse; }
.perpa-float-card b { color: var(--perpa-red); font: 800 15px/1 "Manrope", sans-serif; }
.perpa-float-card span { display: block; color: #595959; font-size: 10px; font-weight: 700; }

/* Product mockups */
.perpa-phone { width: min(75%, 348px); margin-inline: auto; padding: 10px; border: 2px solid #151515; border-radius: 46px; background: #151515; box-shadow: 0 50px 90px -45px rgba(17,17,17,.7), 24px 28px 0 rgba(229,27,35,.1); transform: rotate(2deg); }
.perpa-phone__speaker { position: absolute; z-index: 2; top: 20px; left: 50%; width: 28%; height: 19px; border-radius: 0 0 14px 14px; background: #151515; transform: translateX(-50%); }
.perpa-phone__screen { min-height: 580px; padding: 34px 16px 17px; overflow: hidden; border-radius: 35px; background: #faf9f6; }
.mock-head { display: flex; align-items: center; gap: 9px; font-size: 11px; font-weight: 700; }
.mini-mark { display: grid; width: 29px; height: 29px; flex: 0 0 auto; place-items: center; color: #fff; background: var(--perpa-red); font: 800 13px/1 "Manrope", sans-serif; }
.mock-search { display: flex; align-items: center; gap: 8px; margin-top: 18px; padding: 11px 12px; color: #8c8c8c; border: 1px solid #dedbd6; border-radius: 10px; background: #fff; font-size: 10px; }
.mock-map { position: relative; height: 322px; margin-top: 12px; overflow: hidden; border-radius: 15px; background: linear-gradient(145deg,#eeece7,#fbfaf7); }
.mock-map::before { content: ""; position: absolute; inset: 0; opacity: .7; background-image: linear-gradient(rgba(17,17,17,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(17,17,17,.06) 1px,transparent 1px); background-size: 30px 30px; }
.mock-map svg { position: absolute; inset: 50% auto auto 50%; width: 90%; overflow: visible; transform: translate(-50%,-50%); }
.mock-map svg path { fill: none; stroke-linecap: round; stroke-width: 4; }
.route-base { stroke: #fff; stroke-width: 10 !important; }
.route-live { stroke: var(--perpa-red); stroke-dasharray: 10 9; animation: perpa-route 1.2s linear infinite; }
.mock-map svg circle { fill: #111; stroke: #fff; stroke-width: 4; }
.mock-map svg .route-target { fill: var(--perpa-red); animation: perpa-pulse-svg 2s infinite; }
.map-block { position: absolute; z-index: 2; display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid #cbc7c0; border-radius: 5px; background: rgba(255,255,255,.9); font-size: 9px; font-weight: 800; }
.map-block--a { top: 30px; left: 28px; }.map-block--b { top: 130px; right: 25px; color: #fff; border-color: var(--perpa-red); background: var(--perpa-red); }.map-block--c { bottom: 34px; left: 62px; }
.mock-floor { position: absolute; right: 11px; bottom: 11px; padding: 7px 9px; border-radius: 6px; color: #fff; background: #111; font-size: 8px; font-weight: 700; }
.mock-route-card { display: grid; grid-template-columns: 35px 1fr auto; align-items: center; gap: 9px; margin-top: 12px; padding: 12px; border: 1px solid #e4e0da; border-radius: 13px; background: #fff; }
.mock-route-card > span { display: grid; width: 35px; height: 35px; place-items: center; border-radius: 10px; color: #fff; background: var(--perpa-red); }
.mock-route-card div { display: flex; flex-direction: column; }.mock-route-card strong { font-size: 10px; }.mock-route-card small { color: #999; font-size: 8px; }.mock-route-card b { color: #999; }

.perpa-kiosk { width: 94%; margin: 24px auto 0; filter: drop-shadow(0 42px 38px rgba(17,17,17,.18)); transform: rotate(-1deg); }
.perpa-kiosk__screen { padding: 14px; border: 9px solid #171717; border-radius: 18px; background: #171717; }
.kiosk-head { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 13px; padding: 14px 17px; color: #fff; background: #181818; }
.kiosk-head b { font: 700 15px/1.2 "Manrope",sans-serif; }.kiosk-head small { color: #aaa; font-size: 9px; }
.kiosk-body { padding: 22px; background: #f9f7f3; }
.kiosk-search { display: flex; align-items: center; gap: 9px; padding: 12px 14px; color: #888; border: 1px solid #d9d6d0; border-radius: 6px; background: #fff; font-size: 10px; }
.kiosk-map { position: relative; height: 245px; margin-top: 13px; overflow: hidden; border: 1px solid #e0ddd6; background: linear-gradient(145deg,#efede8,#faf9f6); }
.kiosk-map > i { position: absolute; width: 62px; height: 42px; border: 1px solid #cac6bf; background: rgba(255,255,255,.7); }.kiosk-map > i:nth-child(1){top:20px;left:24px}.kiosk-map > i:nth-child(2){top:30px;right:40px}.kiosk-map > i:nth-child(3){bottom:22px;left:30%}.kiosk-map > i:nth-child(4){bottom:35px;right:15px}
.kiosk-map svg { position: absolute; inset: 50% auto auto 50%; width: 90%; transform: translate(-50%,-50%); }.kiosk-map path{fill:none;stroke:var(--perpa-red);stroke-width:5;stroke-dasharray:10 8;animation:perpa-route 1.2s linear infinite}.kiosk-map circle{fill:#111;stroke:#fff;stroke-width:4}.kiosk-map circle:last-child{fill:var(--perpa-red)}
.kiosk-choices { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; margin-top: 10px; }.kiosk-choices span{padding:10px 4px;text-align:center;border:1px solid #dedbd5;background:#fff;font-size:9px;font-weight:700}
.perpa-kiosk__stand { width: 42%; height: 48px; margin: 0 auto; background: linear-gradient(90deg,#2b2b2b,#555,#222); clip-path: polygon(37% 0,63% 0,72% 78%,100% 86%,100% 100%,0 100%,0 86%,28% 78%); }

.perpa-dashboard { width: 100%; overflow: hidden; border: 1px solid rgba(17,17,17,.18); border-radius: 14px; background: #fff; box-shadow: 0 45px 85px -42px rgba(17,17,17,.65), 20px 22px 0 rgba(229,27,35,.09); transform: rotate(1deg); }
.dash-bar { display: flex; align-items: center; gap: 6px; height: 33px; padding: 0 12px; background: #191919; }.dash-bar i{width:7px;height:7px;border-radius:50%;background:#555}.dash-bar i:first-child{background:var(--perpa-red)}.dash-bar span{margin-left:9px;color:#888;font:500 8px/1 monospace}
.dash-shell { display: grid; grid-template-columns: 54px 1fr; min-height: 440px; }.dash-shell aside{display:flex;align-items:center;flex-direction:column;gap:22px;padding:16px 10px;background:#232323}.dash-shell aside i{width:21px;height:3px;border-radius:2px;background:#5f5f5f}.dash-shell aside i.active{background:var(--perpa-red);box-shadow:0 0 0 7px rgba(229,27,35,.12)}
.dash-main { padding: 24px; background: #f6f5f2; }.dash-title{display:flex;align-items:center;justify-content:space-between}.dash-title div{display:flex;flex-direction:column}.dash-title small{color:var(--perpa-red);font-size:7px;font-weight:800;letter-spacing:.12em}.dash-title b{margin-top:5px;font:800 18px/1.2 "Manrope",sans-serif}.dash-title button{padding:8px 10px;border:0;color:#fff;background:var(--perpa-red);font-size:8px;font-weight:700}
.dash-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; margin-top: 22px; }.dash-stats span{display:flex;flex-direction:column;padding:13px;border:1px solid #e1ded8;background:#fff}.dash-stats small{color:#888;font-size:8px}.dash-stats b{margin-top:5px;font:800 22px/1 "Manrope",sans-serif}
.dash-table { display:flex;flex-direction:column;margin-top:18px;border:1px solid #e2dfd9;background:#fff}.dash-table > span{display:grid;grid-template-columns:10px 1fr 55px 42px;align-items:center;gap:9px;padding:13px;border-bottom:1px solid #ece9e4;font-size:8px}.dash-table > span:last-child{border-bottom:0}.dash-table .head{display:block;color:#999;font-size:7px;font-weight:800;letter-spacing:.1em}.dash-table i{width:7px;height:7px;border-radius:50%;background:var(--perpa-red)}.dash-table b{font-size:9px}.dash-table em{padding:4px 5px;color:#18734a;background:#e8f7ef;font-style:normal;text-align:center}.dash-table em.wait{color:#9a5b0a;background:#fff3dc}.dash-table small{color:#888;text-align:right}

.perpa-pipeline { width: 100%; padding: clamp(22px,4vw,38px); border: 1px solid #d9d5ce; border-radius: 15px; background: #fff; box-shadow: 0 45px 85px -42px rgba(17,17,17,.65), -18px 22px 0 rgba(229,27,35,.08); }
.pipeline-head { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; padding-bottom: 21px; border-bottom: 1px solid #e3e0db; }.pipeline-head div{display:flex;flex-direction:column}.pipeline-head small{color:#999;font-size:8px;font-weight:700;letter-spacing:.11em}.pipeline-head b{margin-top:4px;font:800 16px/1.2 "Manrope",sans-serif}.pipeline-head em{padding:6px 9px;color:#ad6710;background:#fff1d6;font-size:8px;font-style:normal;font-weight:700}
.pipeline-summary { display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}.pipeline-summary span{display:flex;flex-direction:column;padding:14px;background:#f5f3ef}.pipeline-summary small{color:#8b8b8b;font-size:8px}.pipeline-summary b{margin-top:5px;font-size:11px}
.pipeline-line { position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin-top:35px}.pipeline-line::before{content:"";position:absolute;top:16px;right:9%;left:9%;height:2px;background:#dedbd5}.pipeline-line span{position:relative;z-index:1;display:flex;align-items:center;flex-direction:column;gap:9px;text-align:center}.pipeline-line span i{display:grid;width:33px;height:33px;place-items:center;border:2px solid #d7d3cc;border-radius:50%;color:#999;background:#fff;font-size:9px;font-style:normal}.pipeline-line span.done i{border-color:var(--perpa-red);color:#fff;background:var(--perpa-red)}.pipeline-line span.current i{border-color:var(--perpa-red);color:var(--perpa-red);box-shadow:0 0 0 6px rgba(229,27,35,.1)}.pipeline-line span b{font-size:8px}
.pipeline-offer { display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:11px;margin-top:34px;padding:14px;border:1px solid #e2dfd9}.pipeline-offer > span{display:grid;width:36px;height:36px;place-items:center;color:#fff;background:#111}.pipeline-offer div{display:flex;flex-direction:column}.pipeline-offer b{font-size:10px}.pipeline-offer small{margin-top:3px;color:#999;font-size:8px}.pipeline-offer em{color:#999}

.perpa-voice { width: 100%; padding: clamp(22px,4vw,38px); overflow:hidden;border:1px solid #292929;border-radius:18px;color:#fff;background:#151515;box-shadow:0 45px 85px -42px rgba(17,17,17,.8),22px 22px 0 rgba(229,27,35,.12)}
.voice-head{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:13px;padding-bottom:21px;border-bottom:1px solid #333}.voice-head div{display:flex;flex-direction:column}.voice-head small{color:#777;font-size:8px;letter-spacing:.12em}.voice-head b{margin-top:4px;font:700 14px/1.2 "Manrope",sans-serif}.voice-head em{display:flex;align-items:center;gap:6px;color:#aaa;font-size:8px;font-style:normal}.voice-head em i{width:6px;height:6px;border-radius:50%;background:#26b66e;box-shadow:0 0 0 5px rgba(38,182,110,.1)}
.voice-person{display:flex;align-items:center;gap:13px;margin-top:22px}.voice-person > span{display:grid;width:48px;height:48px;place-items:center;border-radius:50%;color:#fff;background:var(--perpa-red)}.voice-person div{display:flex;flex-direction:column}.voice-person b{font-size:12px}.voice-person small{margin-top:4px;color:#777;font-size:9px}
.voice-wave{display:flex;height:150px;align-items:center;justify-content:center;gap:6px;margin-top:16px}.voice-wave i{width:4px;height:var(--wave-h);border-radius:4px;background:linear-gradient(to top,var(--perpa-red),#ff7378);animation:perpa-wave 1.8s ease-in-out infinite;animation-delay:calc(var(--wave-h) * -0.015)}.perpa-voice > p{text-align:center;color:#c4c4c4;font-size:12px}.voice-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:23px}.voice-actions button{display:flex;align-items:center;justify-content:center;gap:6px;padding:11px 5px;border:1px solid #3a3a3a;color:#aaa;background:#202020;font-size:8px;cursor:pointer;transition:color .2s,border-color .2s,transform .2s}.voice-actions button:hover{transform:translateY(-2px);border-color:var(--perpa-red);color:#fff}

.perpa-scroll-cue { position: absolute; right: 30px; bottom: 27px; display: flex; align-items: center; flex-direction: column; gap: 9px; color: #888; font-size: 8px; font-weight: 700; letter-spacing: .16em; text-decoration: none; text-transform: uppercase; }
.perpa-scroll-cue i { position: relative; width: 1px; height: 37px; overflow: hidden; background: #c9c5bf; }.perpa-scroll-cue i::after{content:"";position:absolute;top:-100%;left:0;width:100%;height:70%;background:var(--perpa-red);animation:perpa-scroll 2s infinite}

.perpa-section { width: 100%; padding-block: clamp(90px, 12vw, 168px); }
.perpa-section-head { position: relative; display: grid; grid-template-columns: 72px minmax(0,1fr); column-gap: 18px; margin-bottom: clamp(44px, 7vw, 82px); }
.perpa-section-no { grid-row: 1 / span 2; display: grid; width: 52px; height: 52px; place-items: center; color: var(--perpa-red); border: 1px solid rgba(229,27,35,.3); border-radius: 50%; font: 700 10px/1 monospace; }
.perpa-section-head > p { align-self: center; color: #777; font: 700 10px/1 "Manrope",sans-serif; letter-spacing: .16em; text-transform: uppercase; }
.perpa-section-head h2 { grid-column: 2; margin-top: 19px; font: 800 clamp(2.6rem, 5.8vw, 5.7rem)/.98 "Manrope",sans-serif; letter-spacing: -.075em; }
.perpa-section-head h2 em { color: var(--perpa-red); font-style: normal; }
.perpa-intro { background: #fff; }
.perpa-intro__grid { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--perpa-line); }
.perpa-story { min-height: 365px; padding: clamp(30px,5vw,66px); }
.perpa-story + .perpa-story { border-left: 1px solid var(--perpa-line); }
.perpa-story > span { color: var(--perpa-red); font: 800 9px/1 "Manrope",sans-serif; letter-spacing: .18em; }
.perpa-story h3 { max-width: 520px; margin-top: 30px; font: 800 clamp(1.55rem,2.8vw,2.5rem)/1.1 "Manrope",sans-serif; letter-spacing: -.045em; }
.perpa-story p { max-width: 570px; margin-top: 28px; color: #6e6e6e; font-size: 15px; line-height: 1.8; }
.perpa-story--red { color: #fff; background: var(--perpa-red); }
.perpa-story--red > span, .perpa-story--red p { color: rgba(255,255,255,.72); }
.perpa-stats { display: grid; grid-template-columns: repeat(3,1fr); border-right: 1px solid var(--perpa-line); border-bottom: 1px solid var(--perpa-line); border-left: 1px solid var(--perpa-line); }
.perpa-stats div { min-height: 150px; padding: 29px clamp(22px,4vw,43px); }.perpa-stats div + div{border-left:1px solid var(--perpa-line)}
.perpa-stats dt { font: 800 clamp(1.8rem,4vw,3.25rem)/1 "Manrope",sans-serif; letter-spacing: -.06em; }.perpa-stats dd{margin-top:11px;color:#858585;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}

.perpa-capabilities { color: #fff; background: #141414; }
.perpa-section-head--light > p { color: #8d8d8d; }.perpa-section-head--light .perpa-section-no{color:#fff;border-color:#444}.perpa-section-head--light h2 em{color:var(--perpa-red)}
.perpa-feature-grid { display: grid; grid-template-columns: repeat(2,1fr); border-top: 1px solid #363636; border-left: 1px solid #363636; }
.perpa-feature { position: relative; min-height: 330px; padding: clamp(30px,5vw,58px); overflow:hidden;border-right:1px solid #363636;border-bottom:1px solid #363636;transition:background .4s var(--perpa-ease);transition-delay:var(--delay,0ms)}
.perpa-feature::before { content:"";position:absolute;inset:auto 0 0;height:4px;background:var(--perpa-red);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--perpa-ease)}
.perpa-feature:hover { background: #1d1d1d; }.perpa-feature:hover::before{transform:scaleX(1)}
.perpa-feature__icon{display:grid;width:48px;height:48px;place-items:center;color:#fff;background:var(--perpa-red)}.perpa-feature > span{position:absolute;top:38px;right:42px;color:#666;font:500 10px/1 monospace}
.perpa-feature h3{margin-top:35px;font:800 clamp(1.3rem,2.4vw,2rem)/1.15 "Manrope",sans-serif;letter-spacing:-.035em}.perpa-feature p{max-width:480px;margin-top:18px;color:#929292;font-size:14px;line-height:1.75}.perpa-feature__arrow{position:absolute;right:40px;bottom:36px;color:#777;transition:color .25s,transform .3s var(--perpa-ease)}.perpa-feature:hover .perpa-feature__arrow{color:var(--perpa-red);transform:translateX(7px)}

.perpa-flow { background: var(--perpa-paper); }
.perpa-flowline { display: grid; grid-template-columns: repeat(4,1fr); border: 1px solid var(--perpa-line); background: #fff; }
.perpa-flowline > div { position: relative; min-height: 180px; padding: 28px; }.perpa-flowline > div + div{border-left:1px solid var(--perpa-line)}
.perpa-flowline span{color:var(--perpa-red);font:700 10px/1 monospace}.perpa-flowline strong{display:block;max-width:160px;margin-top:44px;font:800 clamp(1rem,1.7vw,1.35rem)/1.2 "Manrope",sans-serif}.perpa-flowline i{position:absolute;top:50%;right:-10px;z-index:2;display:grid;width:20px;height:20px;place-items:center;color:#999;background:#fff;transform:translateY(-50%)}
.perpa-tech { display: grid; grid-template-columns: 1.15fr .85fr; margin-top: clamp(42px,7vw,90px); border: 1px solid var(--perpa-line); }
.perpa-tech__copy { padding: clamp(35px,6vw,74px); }.perpa-tech__copy > span{color:var(--perpa-red);font:800 9px/1 "Manrope",sans-serif;letter-spacing:.18em}.perpa-tech__copy h3{max-width:620px;margin-top:26px;font:800 clamp(1.65rem,3.4vw,3rem)/1.08 "Manrope",sans-serif;letter-spacing:-.05em}.perpa-tech__copy p{max-width:600px;margin-top:24px;color:#6f6f6f;font-size:14px;line-height:1.8}
.perpa-tech__list { border-left: 1px solid var(--perpa-line); }.perpa-tech__list span{display:grid;grid-template-columns:42px 1fr;align-items:center;min-height:82px;padding:0 28px;border-bottom:1px solid var(--perpa-line);font-size:13px;font-weight:700}.perpa-tech__list span:last-child{border-bottom:0}.perpa-tech__list i{color:#aaa;font:500 9px/1 monospace;font-style:normal}

.perpa-next { width: 100%; color: #fff; background: var(--perpa-red); }.perpa-next__link{display:block;width:100%;text-decoration:none}.perpa-next__inner{display:flex;min-height:380px;align-items:center;justify-content:space-between;gap:30px}.perpa-next__inner > div > span{color:rgba(255,255,255,.63);font:700 9px/1 "Manrope",sans-serif;letter-spacing:.16em}.perpa-next h2{margin-top:23px;font:800 clamp(3rem,7vw,7rem)/.9 "Manrope",sans-serif;letter-spacing:-.08em}.perpa-next p{margin-top:19px;color:rgba(255,255,255,.72);font-size:14px}.perpa-next__inner > i{display:grid;width:88px;height:88px;flex:0 0 auto;place-items:center;border:1px solid rgba(255,255,255,.45);border-radius:50%;transition:transform .45s var(--perpa-ease),background .3s,color .3s}.perpa-next__link:hover .perpa-next__inner > i{color:var(--perpa-red);background:#fff;transform:translateX(10px)}
.perpa-footer { width: 100%; color: #aaa; background: #111; }.perpa-footer .perpa-wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;min-height:110px;font-size:10px}.perpa-footer a{display:flex;align-items:center;gap:8px;color:#fff;text-decoration:none}.perpa-footer small{text-align:right}

.perpa-reveal { opacity: 0; transform: translateY(34px); transition: opacity .8s var(--perpa-ease), transform .8s var(--perpa-ease); }
.perpa-reveal.is-visible { opacity: 1; transform: translateY(0); }
.perpa-ripple { position:absolute;width:12px;height:12px;border-radius:50%;background:rgba(255,255,255,.4);transform:translate(-50%,-50%) scale(0);animation:perpa-ripple .65s ease-out;pointer-events:none }

@keyframes perpa-float { 0%,100%{transform:translateY(0) rotate(.5deg)}50%{transform:translateY(-10px) rotate(-.5deg)} }
@keyframes perpa-pulse { 50%{opacity:.38;transform:scale(.7)} }
@keyframes perpa-pulse-svg { 50%{r:12;opacity:.7} }
@keyframes perpa-route { to{stroke-dashoffset:-38} }
@keyframes perpa-scroll { to{top:130%} }
@keyframes perpa-wave { 0%,100%{transform:scaleY(.72);opacity:.55}50%{transform:scaleY(1);opacity:1} }
@keyframes perpa-ripple { to{transform:translate(-50%,-50%) scale(20);opacity:0} }

@media (max-width: 1100px) {
  .perpa-nav { display: none; }
  .perpa-menu-button { display: flex; }
  .perpa-topbar__inner { grid-template-columns: 1fr auto 1fr; }
  .perpa-hero__inner { grid-template-columns: minmax(0,.85fr) minmax(430px,1.15fr); gap: 35px; }
  .perpa-phone__screen { min-height: 520px; }
}

@media (max-width: 860px) {
  .perpa-topbar__inner { min-height: 68px; grid-template-columns: 1fr auto; }
  .perpa-brand { justify-self: start; grid-column: 1; grid-row: 1; }
  .perpa-back { display: none; }
  .perpa-menu-button { grid-column: 2; grid-row: 1; }
  .perpa-hero { padding-top: 112px; }
  .perpa-hero__inner { grid-template-columns: 1fr; gap: 70px; }
  .perpa-hero__copy { max-width: 690px; }
  .perpa-hero__visual { width: min(100%, 660px); margin-inline: auto; }
  .perpa-scroll-cue { display: none; }
  .perpa-intro__grid, .perpa-tech { grid-template-columns: 1fr; }
  .perpa-story + .perpa-story, .perpa-tech__list { border-top: 1px solid var(--perpa-line); border-left: 0; }
  .perpa-flowline { grid-template-columns: repeat(2,1fr); }
  .perpa-flowline > div:nth-child(3){border-top:1px solid var(--perpa-line);border-left:0}.perpa-flowline > div:nth-child(4){border-top:1px solid var(--perpa-line)}.perpa-flowline > div:nth-child(2) i{display:none}
}

@media (max-width: 600px) {
  .perpa-wrap { padding-inline: 18px; }
  .perpa-brand small { display: none; }
  .perpa-menu-button span { font-size: 10px; }
  .perpa-hero { padding-bottom: 70px; }
  .perpa-hero h1 { font-size: clamp(3.3rem,17vw,5.4rem); }
  .perpa-hero__statement { font-size: 1rem; }
  .perpa-button { width: 100%; }
  .perpa-meta { gap: 20px; }
  .perpa-product-label { padding-inline: 3px; }
  .perpa-phone { width: 88%; }
  .perpa-phone__screen { min-height: 500px; }
  .perpa-float-card { display: none; }
  .perpa-kiosk { width: 100%; }
  .kiosk-body { padding: 11px; }.kiosk-map{height:190px}.kiosk-choices{grid-template-columns:1fr}.kiosk-choices span:nth-child(n+2){display:none}
  .dash-shell { grid-template-columns: 38px 1fr; min-height: 385px; }.dash-main{padding:14px}.dash-stats{gap:4px}.dash-stats span{padding:9px}.dash-table > span{grid-template-columns:7px 1fr 42px}.dash-table > span small{display:none}
  .perpa-pipeline { padding: 17px; }.pipeline-head em{display:none}.pipeline-line span b{font-size:7px}.pipeline-line span i{width:27px;height:27px}.pipeline-summary{grid-template-columns:1fr}
  .perpa-voice { padding: 20px; }.voice-wave{height:110px;gap:4px}.voice-wave i{width:3px}.voice-actions{grid-template-columns:1fr}.voice-actions button:nth-child(3){display:none}
  .perpa-section-head { grid-template-columns: 54px 1fr; column-gap: 10px; }.perpa-section-no{width:43px;height:43px}.perpa-section-head h2{font-size:clamp(2.25rem,12vw,3.5rem)}
  .perpa-story { min-height: 0; padding: 35px 25px; }.perpa-story h3{margin-top:22px}.perpa-story p{margin-top:20px}
  .perpa-stats { grid-template-columns: 1fr; }.perpa-stats div{min-height:105px}.perpa-stats div + div{border-top:1px solid var(--perpa-line);border-left:0}
  .perpa-feature-grid { grid-template-columns: 1fr; }.perpa-feature{min-height:290px;padding:32px 25px}.perpa-feature > span{top:30px;right:28px}.perpa-feature__arrow{right:28px;bottom:28px}
  .perpa-flowline { grid-template-columns: 1fr; }.perpa-flowline > div{min-height:135px}.perpa-flowline > div + div,.perpa-flowline > div:nth-child(3){border-top:1px solid var(--perpa-line);border-left:0}.perpa-flowline i{display:none}.perpa-flowline strong{margin-top:28px}
  .perpa-tech__copy { padding: 35px 25px; }.perpa-tech__list span{padding-inline:20px}
  .perpa-next__inner { min-height: 310px; }.perpa-next__inner > i{width:58px;height:58px}.perpa-next h2{font-size:clamp(2.4rem,13vw,4rem)}
  .perpa-footer .perpa-wrap{grid-template-columns:1fr;justify-items:center;padding-block:28px}.perpa-footer small{text-align:center}
  .perpa-drawer__panel { padding: 20px; }
}

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