:root {
  --ink: #0c0d0f;
  --glass: rgba(255, 255, 255, 0.055);
  --line: rgba(255, 255, 255, 0.13);
  --line-soft: rgba(255, 255, 255, 0.08);
  --muted: #a7a9ad;
  --bright: #f7f7f5;
  --yellow: #f1d55b;
  --yellow-hover: #f8e68f;
  --mono: "DM Mono", monospace;
  --sans: "Manrope", Arial, sans-serif;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  padding-bottom: 110px;
  overflow-x: hidden;
  color: var(--bright);
  background: radial-gradient(800px 460px at 75% -10%, rgba(255,255,255,.075), transparent 68%), radial-gradient(600px 400px at 5% 40%, rgba(255,255,255,.025), transparent 70%), var(--ink);
  font: 15px var(--sans);
}
.site-noise { position: fixed; inset: 0; z-index: 10; pointer-events: none; opacity: .022; 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='4' 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(1180px, calc(100% - 80px)); margin-inline: auto; }

.site-header { position: fixed; right: 0; bottom: 0; left: 0; z-index: 30; display: flex; align-items: center; justify-content: space-between; width: 100%; height: 70px; margin: 0; padding: 10px clamp(28px, 5.3vw, 80px) 4px; border: 0; border-radius: 0; background: linear-gradient(180deg, rgba(12,13,15,0) 0%, rgba(12,13,15,.82) 100%); box-shadow: 0 -18px 55px rgba(0,0,0,.18), inset 0 1px rgba(255,255,255,.09); backdrop-filter: blur(18px) saturate(105%); transform: none; }
.portal-nav { position: fixed; right: 0; bottom: 0; left: 0; z-index: 40; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: end; min-height: 82px; padding: 16px clamp(28px, 5.3vw, 80px) 7px; background: linear-gradient(0deg, rgba(5,6,7,.98) 0%, rgba(5,6,7,.79) 67%, rgba(5,6,7,0) 100%); box-shadow: 0 -18px 45px rgba(0,0,0,.18); backdrop-filter: blur(15px) saturate(105%); }.portal-nav[hidden] { display: none; }.portal-nav-item { display: inline-flex; align-items: center; justify-self: center; gap: 9px; min-height: 38px; padding: 7px 11px; border-radius: 12px; color: #8f9296; font: 600 10px var(--mono); letter-spacing: .02em; text-decoration: none; transition: color .18s ease, background .18s ease, transform .18s ease; }.portal-nav-item:first-child { justify-self: start; }.portal-nav-item:last-child { justify-self: end; }.portal-nav-item:hover, .portal-nav-item.is-active { color: #f3f3ee; background: rgba(255,255,255,.075); }.portal-nav-item:hover { transform: translateY(-1px); }.portal-nav-icon { display: grid; width: 22px; height: 22px; color: #c7c9c9; font: 15px/1 var(--sans); place-items: center; }.portal-nav-item.is-active .portal-nav-icon { color: #fff; }.portal-nav-avatar { display: grid; width: 27px; height: 27px; overflow: hidden; border-radius: 50%; background: #e5e5de; color: #171819; font: 700 10px var(--mono); place-items: center; }.portal-nav-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }.portal-nav-profile { padding-right: 0; }.portal-nav-profile .portal-nav-label { color: inherit; }
.brand { display: flex; align-items: center; gap: 8px; color: #f2f3f2; font-size: 22px; font-weight: 800; letter-spacing: -1.5px; text-decoration: none; }
.brand-mark { display: inline-flex; align-items: end; gap: 2px; width: 23px; height: 23px; transform: skewY(-24deg); }
.brand-mark i { display: block; width: 5px; background: #f2f3f2; border-radius: 1px; }
.brand-mark i:nth-child(1) { height: 11px; opacity: .6; }.brand-mark i:nth-child(2) { height: 18px; opacity: .82; }.brand-mark i:nth-child(3) { height: 23px; }
.main-nav { display: flex; gap: 8px; margin-left: 40px; padding: 5px; border-radius: 11px; background: rgba(255,255,255,.08); }
.main-nav a, .login-button, footer a { border: 0; background: none; color: #c8cace; cursor: pointer; font: 500 11px var(--mono); text-decoration: none; transition: color .2s ease, background .2s ease; }
.main-nav a { padding: 9px 12px; border-radius: 7px; }.main-nav a:hover { background: rgba(255,255,255,.14); color: #fff; }.login-button:hover, footer a:hover { color: #fff; }.header-actions { display: flex; align-items: center; gap: 17px; }
.button { border: 1px solid var(--yellow); border-radius: 9px; padding: 14px 17px; background: var(--yellow); box-shadow: 0 8px 25px rgba(241,213,91,.12); color: #161616; cursor: pointer; font: 800 12px var(--sans); letter-spacing: .1px; transition: transform .22s ease, background .22s ease, box-shadow .22s ease; }
.button:hover { background: var(--yellow-hover); box-shadow: 0 11px 30px rgba(241,213,91,.2); transform: translateY(-2px); }.button span { margin-left: 10px; font-size: 17px; vertical-align: -1px; }.button-small { padding: 11px 15px; border-radius: 8px; }.button-large { padding: 17px 21px; font-size: 13px; }

.hero { display: grid; grid-template-columns: 1.04fr .96fr; align-items: center; min-height: 680px; padding: 58px 0 78px; }
.eyebrow { margin: 0 0 20px; color: #9a9ca0; font: 500 10px var(--mono); letter-spacing: 1.55px; text-transform: uppercase; }.live-dot { display: inline-block; width: 6px; height: 6px; margin: 0 8px 1px 0; border-radius: 50%; background: var(--bright); box-shadow: 0 0 0 5px rgba(255,255,255,.06); }
h1, h2, h3, p { margin-top: 0; }h1 { margin: 0 0 25px; font-size: clamp(45px, 5.15vw, 74px); font-weight: 700; letter-spacing: -4.3px; line-height: 1.03; }.hero-description { max-width: 500px; margin: 0; color: #b4b6ba; font-size: 15px; line-height: 1.75; }.hero-proof { display: inline-flex; align-items: center; gap: 8px; margin: 18px 0 0; color: #94969a; font: 500 10px var(--mono); letter-spacing: .05em; text-transform: uppercase; }.hero-proof::before { width: 5px; height: 5px; border-radius: 50%; background: #d6d7d2; content: ""; }.hero-proof strong { color: #f0f0eb; font-weight: 500; }.hero-actions { display: flex; align-items: center; gap: 28px; margin-top: 34px; }
.text-link { border-bottom: 1px solid #65676a; padding-bottom: 5px; color: #e6e6e4; font: 600 12px var(--sans); text-decoration: none; transition: color .2s, border .2s; }.text-link:hover { border-color: #e6e6e4; color: #fff; }.text-link span { margin-left: 8px; font-size: 14px; }
.hero-trust { display: flex; gap: 40px; margin-top: 70px; }.hero-trust > div { display: flex; align-items: start; gap: 10px; }.hero-trust span { color: #f5f5f3; font: 500 10px var(--mono); }.hero-trust p { margin: 0; color: #96989b; font-size: 10px; line-height: 1.45; }

.hero-visual { position: relative; height: 530px; margin-left: 10px; }.hero-visual::before { content: ""; position: absolute; top: 36px; right: 8px; width: 430px; height: 430px; border: 1px solid rgba(255,255,255,.09); border-radius: 50%; }.hero-visual::after { content: ""; position: absolute; top: 89px; right: 61px; width: 324px; height: 324px; border: 1px dashed rgba(255,255,255,.09); border-radius: 50%; }.visual-orb { position: absolute; border-radius: 50%; filter: blur(4px); }.orb-one { top: 5px; right: 35px; width: 185px; height: 185px; background: radial-gradient(circle at 33% 30%, rgba(255,255,255,.34), rgba(73,76,80,.15) 40%, transparent 72%); }.orb-two { bottom: 3px; left: 42px; width: 235px; height: 235px; background: radial-gradient(circle at 45% 42%, rgba(255,255,255,.12), rgba(57,59,62,.04) 54%, transparent 72%); }
.secure-card { position: absolute; top: 103px; left: 75px; z-index: 1; width: 325px; padding: 19px 20px; overflow: hidden; border: 1px solid rgba(255,255,255,.19); border-radius: 17px; background: linear-gradient(135deg, rgba(255,255,255,.15), rgba(255,255,255,.045)); box-shadow: 0 28px 80px rgba(0,0,0,.45), inset 1px 1px rgba(255,255,255,.08); backdrop-filter: blur(24px) saturate(115%); transform: rotate(-4deg); }.secure-card::before { content: ""; position: absolute; top: -130px; left: -40px; width: 300px; height: 170px; border-radius: 50%; background: rgba(255,255,255,.12); filter: blur(25px); }
.card-topline { position: relative; display: flex; justify-content: space-between; padding-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,.14); color: #9c9da1; font: 500 9px var(--mono); letter-spacing: .8px; }.pulse-label { color: #dbdcda; }.pulse-label i { display: inline-block; width: 5px; height: 5px; margin-right: 5px; border-radius: 50%; background: #e8e8e4; }.request-preview-head { position: relative; display: flex; align-items: center; gap: 12px; padding: 20px 0; }.request-icon { display: grid; width: 37px; height: 37px; border: 1px solid rgba(255,255,255,.17); border-radius: 50%; background: rgba(255,255,255,.1); color: #fafaf7; font-size: 20px; place-items: center; }.request-preview-head p, .request-preview-head strong { display: block; margin: 0; }.request-preview-head p, .progress-row, .specialist-row small { color: #b1b3b6; font-size: 9px; }.request-preview-head strong { margin-top: 4px; font-size: 12px; }.progress-row { position: relative; display: flex; justify-content: space-between; margin-bottom: 8px; }.progress-row span:last-child { color: #ededeb; }.progress-track { position: relative; height: 4px; overflow: hidden; border-radius: 8px; background: rgba(255,255,255,.18); }.progress-track i { display: block; width: 80%; height: 100%; border-radius: inherit; background: #ededeb; }
.specialist-row { position: relative; display: flex; align-items: center; gap: 9px; margin-top: 20px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.14); }.mini-avatar, .avatar { display: grid; width: 26px; height: 26px; border-radius: 50%; background: #d8d8d2; color: #282a2c; font: 500 10px var(--mono); place-items: center; }.specialist-row p { flex: 1; margin: 0; }.specialist-row small, .specialist-row strong { display: block; }.specialist-row strong { margin-top: 3px; font-size: 10px; }.verified { display: grid; width: 15px; height: 15px; border-radius: 50%; background: #ededeb; color: #1b1c1e; font-size: 9px; font-weight: 800; place-items: center; }.message-line { position: relative; display: flex; align-items: center; gap: 3px; width: 65%; height: 17px; margin-top: 18px; padding-left: 8px; border-radius: 4px; background: rgba(255,255,255,.1); }.message-line span { width: 3px; height: 3px; border-radius: 50%; background: #96989b; }
.stat-chip { position: absolute; z-index: 2; display: flex; align-items: center; gap: 10px; padding: 10px 13px; border: 1px solid rgba(255,255,255,.15); border-radius: 10px; background: rgba(25,27,29,.52); box-shadow: 0 12px 30px rgba(0,0,0,.28); backdrop-filter: blur(16px); }.stat-chip > span { color: #efefeb; font: 500 20px var(--mono); }.stat-chip p { margin: 0; }.stat-chip small, .stat-chip strong { display: block; }.stat-chip small { color: #a4a6a8; font-size: 8px; }.stat-chip strong { margin-top: 3px; font-size: 10px; }.chip-top { top: 54px; right: 3px; }.chip-bottom { bottom: 75px; left: 15px; }.lock { font-size: 18px !important; }.visual-caption { position: absolute; right: -3px; bottom: 46px; color: #838589; font: 500 9px/1.5 var(--mono); letter-spacing: 1px; text-align: right; }.visual-caption em { color: #e6e6e2; font-style: normal; }


.services { padding: 150px 0; }.section-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 60px; }.section-heading h2, .process-intro h2, .assurance h2, .faq h2 { margin: 0; font-size: clamp(35px, 4vw, 55px); letter-spacing: -3px; line-height: 1.08; }.section-heading > p { width: 305px; margin: 0 0 5px; color: #999ca0; line-height: 1.7; }.filter-row { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 23px; }.filter { padding: 9px 14px; border: 1px solid var(--line); border-radius: 30px; background: rgba(255,255,255,.025); color: #9a9ca0; cursor: pointer; font: 500 10px var(--mono); transition: .2s; }.filter:hover, .filter.active { border-color: rgba(255,255,255,.45); background: rgba(255,255,255,.08); color: #f5f5f2; }.filter span { margin-left: 5px; }
.service-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 13px; }.service-card { position: relative; display: flex; flex-direction: column; min-height: 310px; padding: 25px; overflow: hidden; border: 1px solid var(--line-soft); border-radius: 17px; background: linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.025)); box-shadow: inset 1px 1px rgba(255,255,255,.025); transition: background .25s, border .25s, transform .25s, box-shadow .25s; }.service-card::before { content: ""; position: absolute; top: -80px; left: -80px; width: 190px; height: 130px; border-radius: 50%; background: rgba(255,255,255,.055); filter: blur(22px); }.service-card:hover { border-color: rgba(255,255,255,.25); background: linear-gradient(145deg, rgba(255,255,255,.11), rgba(255,255,255,.045)); box-shadow: 0 18px 40px rgba(0,0,0,.18); transform: translateY(-4px); }.service-card.featured { border-color: rgba(255,255,255,.18); background: linear-gradient(145deg, rgba(255,255,255,.1), rgba(255,255,255,.035)); }.service-number { position: absolute; top: 25px; right: 25px; color: #818387; font: 500 10px var(--mono); }.card-glyph { position: relative; display: block; height: 58px; color: #f2f2ef; font-size: 27px; line-height: 1; }.service-tag { position: relative; margin: 0 0 9px; color: #a4a6a9; font: 500 9px var(--mono); letter-spacing: 1.3px; }.service-card h3 { position: relative; margin: 0 0 12px; font-size: 23px; letter-spacing: -1px; line-height: 1.18; }.service-description { position: relative; max-width: 270px; margin: 0; color: #aeb0b3; font-size: 12px; line-height: 1.6; }.card-link { position: relative; align-self: flex-start; margin-top: auto; padding: 0 0 5px; border: 0; border-bottom: 1px solid #74767a; background: none; color: #ecece8; cursor: pointer; font: 600 11px var(--sans); text-align: left; transition: color .2s, border .2s; }.card-link:hover { border-color: #fff; color: #fff; }.card-link span { margin-left: 9px; font-size: 15px; }.custom-card { border-style: dashed; }.show-more { display: block; margin: 36px auto 0; border: 0; background: transparent; color: #aaa; cursor: pointer; font: 500 11px var(--mono); }.show-more:hover { color: #fff; }.show-more span { margin-left: 9px; }

.process-section { position: relative; padding: 130px 0; overflow: hidden; border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: linear-gradient(140deg, rgba(255,255,255,.052), rgba(255,255,255,.022)); }.process-section::before { content: ""; position: absolute; right: -140px; bottom: -250px; width: 520px; height: 520px; border: 1px solid rgba(255,255,255,.07); border-radius: 50%; }.process-section .section-shell { position: relative; display: grid; grid-template-columns: .78fr 1.22fr; gap: 90px; }.process-intro h2 em, .assurance h2 em, .closing h2 em { color: #bfc1c3; font-style: normal; font-weight: 400; }.process-intro > p:last-child { max-width: 270px; margin-top: 27px; color: #a5a7aa; line-height: 1.7; }.process-list { margin: 0; padding: 0; list-style: none; }.process-list li { display: grid; grid-template-columns: 60px 1fr 25px; gap: 20px; padding: 28px 0; border-top: 1px solid var(--line); }.process-list li:last-child { border-bottom: 1px solid var(--line); }.step-index { padding-top: 6px; color: #b9bbbd; font: 500 10px var(--mono); }.process-list h3 { margin: 0 0 8px; font-size: 20px; letter-spacing: -.7px; }.process-list p { max-width: 400px; margin: 0; color: #9fa1a4; font-size: 12px; line-height: 1.6; }.step-arrow { color: #d9d9d5; font-size: 18px; }

.assurance { padding: 150px 0; }.assurance-grid { display: grid; grid-template-columns: .84fr 1.16fr; gap: 110px; }.assurance-copy > p:not(.eyebrow) { max-width: 350px; margin: 27px 0; color: #9fa1a4; font-size: 13px; line-height: 1.7; }.yellow-link { border-color: #77797c; color: #f0f0ed; }.assurance-list article { display: grid; grid-template-columns: 47px 1fr 18px; gap: 18px; padding: 25px 0; border-top: 1px solid var(--line); }.assurance-list article:last-child { border-bottom: 1px solid var(--line); }.assurance-icon { padding-top: 1px; color: #e4e4e0; font-size: 22px; }.assurance-list h3 { margin-bottom: 7px; font-size: 18px; letter-spacing: -.6px; }.assurance-list p { max-width: 400px; margin: 0; color: #a7a9ac; font-size: 12px; line-height: 1.65; }.list-arrow { color: #8c8e91; font-size: 17px; }
.metrics { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: rgba(255,255,255,.035); }.metrics-grid { display: grid; grid-template-columns: repeat(4,1fr); }.metrics-grid > div { padding: 43px 30px; border-right: 1px solid var(--line); }.metrics-grid > div:first-child { padding-left: 0; }.metrics-grid > div:last-child { border: 0; }.metrics strong { color: #f1f1ed; font-size: 35px; letter-spacing: -2px; }.metrics p { margin: 6px 0 0; color: #9fa1a4; font: 500 10px var(--mono); }
.testimonial { max-width: 830px; padding-top: 135px; padding-bottom: 135px; }.quote-mark { color: #bdbfbe; font: 60px Georgia,serif; line-height: .5; }.testimonial blockquote { margin: 21px 0 35px; font-size: clamp(27px, 3.15vw, 43px); letter-spacing: -1.8px; line-height: 1.25; }.testimonial-byline { display: flex; align-items: center; gap: 10px; }.testimonial-byline p { margin: 0; }.testimonial-byline strong, .testimonial-byline small { display: block; }.testimonial-byline strong { font-size: 11px; }.testimonial-byline small { margin-top: 3px; color: #909296; font-size: 10px; }.testimonial-byline .verified { margin-left: 3px; }
.faq { display: grid; grid-template-columns: .75fr 1.25fr; gap: 100px; padding-top: 105px; padding-bottom: 125px; border-top: 1px solid var(--line); }.faq-list { border-top: 1px solid var(--line); }.faq details { padding: 0; border-bottom: 1px solid var(--line); }.faq summary { display: flex; align-items: center; justify-content: space-between; padding: 20px 0; cursor: pointer; font-size: 15px; font-weight: 600; list-style: none; }.faq summary::-webkit-details-marker { display: none; }.faq summary span { color: #e5e5e1; font: 300 23px var(--sans); }.faq details[open] summary span { transform: rotate(45deg); }.faq details p { max-width: 600px; margin: 0; padding-bottom: 20px; color: #a5a7aa; font-size: 12px; line-height: 1.7; }
.closing { padding-bottom: 100px; }.closing-card { position: relative; min-height: 365px; padding: 58px 68px; overflow: hidden; border: 1px solid rgba(255,255,255,.17); border-radius: 20px; background: linear-gradient(125deg, rgba(255,255,255,.1), rgba(255,255,255,.035)); box-shadow: inset 1px 1px rgba(255,255,255,.07), 0 26px 70px rgba(0,0,0,.2); }.closing-card::before { content: ""; position: absolute; top: -180px; right: 100px; width: 390px; height: 290px; border-radius: 50%; background: rgba(255,255,255,.1); filter: blur(35px); }.closing-card .eyebrow { position: relative; color: #a9abae; }.closing h2 { position: relative; margin: 0; font-size: clamp(42px, 5vw, 66px); letter-spacing: -3.6px; line-height: 1.02; }.closing h2 em { color: #bfc1c3; }.closing-card > p:not(.eyebrow) { position: relative; max-width: 300px; margin: 20px 0 28px; color: #b0b2b5; font-size: 13px; line-height: 1.6; }.closing-graphic { position: absolute; right: 55px; bottom: -120px; color: rgba(255,255,255,.08); font-size: 350px; line-height: 1; }

footer { width: min(1180px, calc(100% - 80px)); margin: auto; padding: 47px 0 25px; border-top: 1px solid var(--line); }.footer-top { display: grid; grid-template-columns: 1fr 1fr 1fr; padding-bottom: 75px; }.footer-top p { margin: 0; color: #a4a6a9; font-size: 12px; line-height: 1.6; }.footer-top > a:last-child { padding-top: 8px; color: #e8e8e4; text-align: right; }.footer-bottom { display: flex; justify-content: space-between; padding-top: 24px; border-top: 1px solid var(--line); color: #76787c; font: 500 9px var(--mono); }.footer-bottom div { display: flex; gap: 23px; }.footer-bottom a { font-size: 9px; }

.modal { width: min(100% - 32px, 490px); max-height: calc(100dvh - 32px); padding: 0; border: 0; overflow-y: auto; background: transparent; color: #fff; }.modal::backdrop { background: rgba(0,0,0,.7); backdrop-filter: blur(10px); }.modal-panel { position: relative; padding: 34px; border: 1px solid rgba(255,255,255,.2); border-radius: 18px; background: rgba(29,31,34,.8); box-shadow: 0 25px 100px #000; backdrop-filter: blur(28px); }.modal h2 { margin: 0 0 8px; font-size: 35px; letter-spacing: -2px; }.modal-intro { margin-bottom: 25px; color: #aaacaf; font-size: 12px; line-height: 1.6; }.modal label { display: block; margin-bottom: 16px; color: #c5c6c7; font: 500 10px var(--mono); letter-spacing: .3px; }.modal input:not([type=checkbox]), .modal textarea, .modal select { display: block; width: 100%; margin-top: 7px; padding: 12px; border: 1px solid var(--line); border-radius: 7px; outline: none; background: rgba(0,0,0,.24); color: #fff; font: 500 13px var(--sans); }.modal textarea { resize: vertical; }.modal select { appearance: auto; }.modal input:focus, .modal textarea:focus, .modal select:focus { border-color: rgba(255,255,255,.6); }.modal-close { position: absolute; top: 13px; right: 16px; border: 0; background: none; color: #bbb; cursor: pointer; font-size: 27px; }.check-label { display: flex !important; align-items: start; gap: 9px; font-family: var(--sans) !important; letter-spacing: 0 !important; line-height: 1.5; text-transform: none; }.check-label input { margin: 1px 0; }.button-full { width: 100%; margin-top: 7px; }.form-note { margin: 15px 0 0; color: #838589; font-size: 9px; text-align: center; }.toast { position: fixed; bottom: 25px; left: 50%; z-index: 20; padding: 14px 19px; background: var(--yellow); box-shadow: 0 12px 35px rgba(0,0,0,.35); color: #161616; font-size: 12px; font-weight: 700; transform: translate(-50%, 100px); transition: transform .3s; }.toast.show { transform: translate(-50%,0); }
.auth-tabs { display: flex; gap: 2px; margin: 22px 0 14px; padding: 3px; border: 1px solid var(--line); border-radius: 9px; background: rgba(0,0,0,.16); }.auth-tab { flex: 1; padding: 9px; border: 0; border-radius: 6px; background: transparent; color: #989a9e; cursor: pointer; font: 600 11px var(--sans); }.auth-tab.active { background: rgba(255,255,255,.1); color: #f3f3ef; }.role-select { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 17px; }.role-option { display: block; padding: 12px; border: 1px solid var(--line); border-radius: 9px; background: rgba(255,255,255,.03); color: #f0f0ec; cursor: pointer; text-align: left; transition: .2s; }.role-option:hover, .role-option.active { border-color: rgba(255,255,255,.45); background: rgba(255,255,255,.09); }.role-option strong, .role-option span { display: block; }.role-option strong { font-size: 11px; }.role-option span { margin-top: 4px; color: #a7a9ac; font-size: 9px; line-height: 1.45; }.password-requirements { margin: -4px 0 13px; color: #8f9295; font-size: 9px; line-height: 1.45; }.auth-feedback { min-height: 18px; margin: 12px 0 0; color: #d7d7d2; font-size: 11px; text-align: center; }.local-verification-link { display: inline-block; margin-top: 8px; color: var(--yellow); font-weight: 700; text-decoration: none; }.local-verification-link:hover { text-decoration: underline; }
.auth-recovery-toggle { display: block; width: max-content; margin: 13px auto 0; padding: 0; border: 0; background: transparent; color: #c8c9c5; cursor: pointer; font: 600 10px var(--sans); text-decoration: underline; text-underline-offset: 3px; }.auth-recovery-toggle:hover { color: var(--yellow); }

@media (max-width: 800px) { .section-shell, .site-header, footer { width: min(100% - 40px, 580px); }.site-header { height: 70px; }.main-nav { display: none; }.header-actions { gap: 14px; }.login-button { display: none; }.hero { grid-template-columns: 1fr; padding-top: 65px; }.hero-visual { height: 440px; margin: 34px -10px 0; }.hero-trust { margin-top: 43px; }.section-heading, .assurance-grid, .faq, .process-section .section-shell { display: grid; grid-template-columns: 1fr; gap: 35px; }.section-heading { align-items: start; }.section-heading > p { width: auto; }.services, .assurance { padding-top: 85px; padding-bottom: 85px; }.service-grid { grid-template-columns: 1fr 1fr; }.process-section { padding: 85px 0; }.metrics-grid { grid-template-columns: 1fr 1fr; }.metrics-grid > div, .metrics-grid > div:first-child { padding: 25px 0; border-right: 0; border-bottom: 1px solid var(--line); }.metrics-grid > div:nth-child(odd) { padding-right: 22px; border-right: 1px solid var(--line); }.metrics-grid > div:nth-child(even) { padding-left: 22px; }.testimonial { padding-top: 85px; padding-bottom: 85px; }.faq { padding-top: 85px; padding-bottom: 85px; }.closing-card { padding: 44px 30px; }.closing-graphic { right: -35px; }.footer-top { grid-template-columns: 1fr 1fr; gap: 30px; padding-bottom: 45px; }.footer-top > a:last-child { grid-column: 1 / -1; text-align: left; }.footer-bottom { flex-wrap: wrap; gap: 15px; }.footer-bottom div { width: 100%; justify-content: space-between; }.hero-visual::before { right: 0; }.secure-card { left: 32px; }.chip-top { right: -10px; }.chip-bottom { left: 0; } }
@media (max-width: 480px) { .section-shell, .site-header, footer { width: calc(100% - 32px); }.site-header .button { padding: 10px; font-size: 10px; }.brand { font-size: 23px; }h1 { letter-spacing: -2.8px; }.hero-actions { flex-direction: column; align-items: flex-start; gap: 21px; }.hero-visual { width: 119%; margin-bottom: -45px; transform: scale(.84); transform-origin: left top; }.hero-trust { gap: 18px; }.service-grid { grid-template-columns: 1fr; }.service-card { min-height: 275px; }.filter-row { gap: 6px; }.filter { padding: 7px 10px; }.process-list li { grid-template-columns: 35px 1fr 15px; gap: 10px; }.closing-card { min-height: 360px; }.closing-graphic { bottom: -80px; font-size: 250px; }.footer-top { grid-template-columns: 1fr; }.footer-top > a:last-child { grid-column: auto; }.footer-bottom { font-size: 8px; }.footer-bottom div { gap: 8px; }.modal-panel { padding: 27px 22px; } }

/* Platform SVG marks: compact, legible, and never recreated with text or CSS. */
.card-glyph.platform-logos { display: flex; align-items: center; gap: 9px; height: 58px; }
.platform-logo { display: block; flex: 0 0 27px; width: 27px; height: 27px; object-fit: contain; filter: drop-shadow(0 2px 7px rgba(0,0,0,.22)); }
.platform-logo-dark { filter: invert(1) drop-shadow(0 2px 7px rgba(0,0,0,.22)); }
.cube-facet { display: none; }

@media (min-width: 801px) {
  .services { position: relative; min-height: 142vh; padding: 0; }
  .services-sticky { position: sticky; top: 0; display: flex; align-items: center; min-height: 100vh; padding: 64px 0 48px; overflow: hidden; }
  .services-layout { display: grid; grid-template-columns: .78fr 1.22fr; align-items: center; gap: 78px; }
  .services .section-heading { display: block; margin: 0; }
  .services .section-heading > p { width: auto; max-width: 335px; margin: 27px 0 0; }
  .services-panel { display: flex; flex-direction: column; min-width: 0; height: min(620px, calc(100vh - 112px)); }
  .services-panel .filter-row { flex: 0 0 auto; margin-bottom: 18px; }
  .service-scroll { flex: 1 1 auto; min-height: 0; padding: 1px 10px 12px 1px; overflow-y: auto; overscroll-behavior: contain; scrollbar-color: rgba(255,255,255,.32) transparent; scrollbar-width: thin; }
  .service-scroll::-webkit-scrollbar { width: 5px; }.service-scroll::-webkit-scrollbar-track { background: transparent; }.service-scroll::-webkit-scrollbar-thumb { border-radius: 10px; background: rgba(255,255,255,.32); }
  .services .service-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 13px; }
  .services .service-card { min-height: 278px; }
  .services .show-more { display: none; }
}

@media (max-width: 800px) {
  .services { min-height: 0; padding: 85px 0; }
  .services-sticky { position: static; min-height: 0; padding: 0; overflow: visible; }
  .services-layout { display: block; }
  .services .section-heading { display: grid; margin-bottom: 45px; }
  .services-panel { height: auto; }
  .service-scroll { overflow: visible; }
}

@media (min-width: 801px) {
  .site-header { width: 100%; }
}

/* Keep the top-level actions aligned and reserve yellow for the primary next step. */
.button { display: inline-flex; align-items: center; justify-content: center; gap: 13px; white-space: nowrap; }
.button span { margin-left: 0; line-height: 1; }
.site-header .button-small { border-color: #e9e9e5; background: #e9e9e5; box-shadow: none; color: #151618; }
.site-header .button-small:hover { border-color: #fff; background: #fff; box-shadow: 0 7px 16px rgba(0,0,0,.2); color: #000; }
.hero-actions .button-large { min-width: 197px; }
.hero-actions .text-link { display: inline-flex; align-items: center; min-height: 44px; }
.hero-proof { max-width: 340px; }
.card-link:focus-visible, .button:focus-visible, .text-link:focus-visible, .filter:focus-visible { outline: 2px solid #f7f7f5; outline-offset: 4px; }

@media (max-width: 480px) {
  .hero-actions .button-large { min-width: 0; }
  .site-header .button-small { padding-inline: 11px; }
}

@media (max-width: 800px) {
  body { padding-bottom: 98px; }
  .site-header { bottom: 0; width: 100%; height: 70px; padding: 10px 20px 4px; }
  .portal-nav { min-height: 76px; padding: 13px 20px 5px; }.portal-nav-item { flex-direction: column; gap: 2px; min-width: 54px; padding: 4px 7px; font-size: 8px; }.portal-nav-icon { width: 21px; height: 21px; }.portal-nav-avatar { width: 25px; height: 25px; }
}

/* Scroll-driven service cube: a real, rounded glass cube with one readable face at a time. */
@media (min-width: 901px) {
  .services { position: relative; min-height: 310vh; padding: 0; }
  .services-sticky { position: sticky; top: 0; display: flex; align-items: center; min-height: 100vh; padding: 52px 0; overflow: hidden; }
  .services-layout { display: grid; grid-template-columns: minmax(290px, .76fr) minmax(0, 1.24fr); align-items: center; gap: clamp(46px, 6vw, 96px); }
  .services .section-heading { display: block; margin: 0; }
  .services .section-heading > p { width: auto; max-width: 335px; margin: 27px 0 0; }
  .services-panel { min-width: 0; height: min(690px, calc(100vh - 92px)); }
  .services-cube-stage { --cube-size: clamp(420px, 36vw, 540px); --cube-depth: var(--cube-size); position: relative; display: grid; width: 100%; height: 100%; min-height: 590px; isolation: isolate; overflow: visible; perspective: 1650px; perspective-origin: 50% 45%; place-items: center; }
  .cube-aura { position: absolute; bottom: 4%; width: min(54vw, 700px); height: min(20vw, 245px); border-radius: 50%; background: radial-gradient(ellipse at center, rgba(255,255,255,.105), rgba(255,255,255,.032) 34%, transparent 70%); filter: none; opacity: .82; transform: rotateX(68deg) rotateZ(-18deg); }
  .cube-aura::before, .cube-aura::after { position: absolute; border: 1px solid rgba(255,255,255,.055); border-radius: inherit; content: ""; }.cube-aura::before { inset: 16%; }.cube-aura::after { inset: 33%; border-color: rgba(255,255,255,.035); }
  .service-cube { position: relative; z-index: 1; width: var(--cube-size); height: var(--cube-size); contain: layout paint; transform: translateZ(0) rotateX(var(--cube-rotate-x, 0deg)) rotateY(var(--cube-rotate-y, 0deg)); transform-style: preserve-3d; will-change: transform; }
  .service-cube::before { display: none; }
  .cube-face { position: absolute; inset: 0; min-height: 0 !important; margin: 0; padding: 0; overflow: hidden; border: 1px solid rgba(255,255,255,.2); border-radius: 42px; background: linear-gradient(145deg, rgba(255,255,255,.13) 0%, rgba(255,255,255,.045) 42%, rgba(15,16,18,.2) 100%); box-shadow: inset 0 1px rgba(255,255,255,.16), inset 18px 0 44px rgba(255,255,255,.022), inset -22px -25px 52px rgba(0,0,0,.18), 0 32px 75px rgba(0,0,0,.25); backface-visibility: hidden; -webkit-backface-visibility: hidden; transform: var(--cube-face-transform); transform-style: preserve-3d; transition: border-color .22s ease, background .22s ease, box-shadow .22s ease, opacity .22s ease; }
  .cube-face::before { top: 0; left: 0; width: 100%; height: 48%; border-radius: 42px 42px 44% 44%; background: radial-gradient(ellipse at 23% 0%, rgba(255,255,255,.23), transparent 54%), linear-gradient(110deg, rgba(255,255,255,.08), transparent 59%); filter: none; opacity: 1; }
  .cube-face::after { position: absolute; inset: 12px; border: 1px solid rgba(255,255,255,.095); border-radius: 31px; content: ""; pointer-events: none; }
  .cube-face-content { position: absolute; inset: 0; display: flex; flex-direction: column; padding: clamp(29px, 2.55vw, 38px); opacity: 0; transform: var(--cube-read-transform) translateZ(1px); transform-style: preserve-3d; transform-origin: center; transition: opacity .14s linear; will-change: transform, opacity; }
  .cube-face:hover { transform: var(--cube-face-transform); }
  .cube-face.is-active { border-color: rgba(255,255,255,.33); background: linear-gradient(146deg, rgba(255,255,255,.18), rgba(255,255,255,.07) 44%, rgba(15,16,18,.18)); box-shadow: inset 0 1px rgba(255,255,255,.19), inset 0 -34px 60px rgba(0,0,0,.16), 0 46px 110px rgba(0,0,0,.32); }.cube-face.is-active .cube-face-content { opacity: 0; }
  .cube-face-front { --cube-face-transform: translateZ(calc(var(--cube-depth) / 2)); --cube-read-transform: rotateY(var(--cube-inverse-y, 0deg)) rotateX(var(--cube-inverse-x, 0deg)); }.cube-face-right { --cube-face-transform: rotateY(90deg) translateZ(calc(var(--cube-depth) / 2)); --cube-read-transform: rotateY(-90deg) rotateY(var(--cube-inverse-y, 0deg)) rotateX(var(--cube-inverse-x, 0deg)); }.cube-face-back { --cube-face-transform: rotateY(180deg) translateZ(calc(var(--cube-depth) / 2)); --cube-read-transform: rotateY(-180deg) rotateY(var(--cube-inverse-y, 0deg)) rotateX(var(--cube-inverse-x, 0deg)); }.cube-face-left { --cube-face-transform: rotateY(-90deg) translateZ(calc(var(--cube-depth) / 2)); --cube-read-transform: rotateY(90deg) rotateY(var(--cube-inverse-y, 0deg)) rotateX(var(--cube-inverse-x, 0deg)); }.cube-face-top { --cube-face-transform: rotateX(90deg) translateZ(calc(var(--cube-depth) / 2)); --cube-read-transform: rotateX(-90deg) rotateY(var(--cube-inverse-y, 0deg)) rotateX(var(--cube-inverse-x, 0deg)); }.cube-face-bottom { --cube-face-transform: rotateX(-90deg) translateZ(calc(var(--cube-depth) / 2)); --cube-read-transform: rotateX(90deg) rotateY(var(--cube-inverse-y, 0deg)) rotateX(var(--cube-inverse-x, 0deg)); }
  .cube-reader { position: absolute; z-index: 3; width: clamp(320px, 29vw, 420px); height: clamp(320px, 29vw, 420px); overflow: hidden; border: 1px solid rgba(255,255,255,.22); border-radius: 33px; background: linear-gradient(145deg, rgba(17,18,20,.34), rgba(17,18,20,.12)); box-shadow: inset 0 1px rgba(255,255,255,.15), 0 35px 80px rgba(0,0,0,.28); transform: translateZ(120px); }.cube-reader::before { position: absolute; inset: 0; border-radius: inherit; background: radial-gradient(ellipse at 24% 0%, rgba(255,255,255,.16), transparent 56%); content: ""; pointer-events: none; }.cube-reader::after { position: absolute; inset: 12px; border: 1px solid rgba(255,255,255,.075); border-radius: 23px; content: ""; pointer-events: none; }.cube-reader .cube-face-content { position: absolute; inset: 0; display: flex; flex-direction: column; padding: clamp(25px, 2.2vw, 34px); opacity: 1; transform: none !important; }.cube-reader .card-glyph { height: clamp(68px, 6.5vw, 82px); }.cube-reader .platform-logo { flex-basis: 30px; width: 30px; height: 30px; }.cube-reader h3 { max-width: 310px; margin: 0 0 11px; font-size: clamp(24px, 2vw, 30px); letter-spacing: -1px; line-height: 1.18; }.cube-reader .service-description { max-width: 290px; margin: 0; font-size: 11px; line-height: 1.64; }.cube-reader .card-link { margin-top: auto; }.cube-caption { position: absolute; right: max(-10px, calc((100% - var(--cube-size)) / 2)); bottom: 8px; z-index: 4; display: grid; gap: 3px; min-width: 150px; padding: 12px 14px; border: 1px solid rgba(255,255,255,.11); border-radius: 16px; background: linear-gradient(130deg, rgba(31,33,36,.75), rgba(17,18,20,.48)); box-shadow: inset 0 1px rgba(255,255,255,.08), 0 16px 35px rgba(0,0,0,.24); }.cube-caption span { color: #a9abad; font: 500 8px var(--mono); }.cube-caption strong { color: #efefea; font-size: 11px; }.cube-caption small { color: #96989c; font: 500 8px var(--mono); }
}

@media (max-width: 900px) {
  .services { min-height: 0; padding: 85px 0; }.services-sticky { position: static; min-height: 0; padding: 0; overflow: visible; }.services-layout { display: block; }.services .section-heading { display: grid; margin-bottom: 45px; }.services-panel { height: auto; }.services-cube-stage { position: static; }.cube-aura, .cube-reader, .cube-caption { display: none; }.service-cube { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; transform: none !important; }.cube-face { position: relative; min-height: 275px; transform: none !important; backface-visibility: visible; -webkit-backface-visibility: visible; }.cube-face-content { position: relative; min-height: 275px; padding: 25px; opacity: 1; transform: none !important; }.cube-face:hover { transform: translateY(-4px) !important; }
}

@media (max-width: 480px) { .service-cube { grid-template-columns: 1fr; }.cube-face { min-height: 275px; } }

@media (prefers-reduced-motion: reduce) and (min-width: 901px) { .services { min-height: 100vh; }.service-cube { transform: none !important; }.cube-face { display: none; transform: none !important; }.cube-face-front { display: flex; position: relative; }.cube-reader, .cube-caption { display: none; } }

/* Authenticated portal navigation keeps the product identity and primary routes in one place. */
.portal-nav { grid-template-columns: auto repeat(3, minmax(0, 1fr)) auto; }.portal-nav-brand { display: inline-flex; align-items: center; justify-self: start; gap: 8px; color: #f2f3f2; font-size: 22px; font-weight: 800; letter-spacing: -1.5px; text-decoration: none; }.portal-nav-brand .brand-mark { flex: 0 0 auto; }.portal-nav-item { justify-self: center; }.portal-nav-profile { justify-self: end; }.portal-nav-item:last-child { justify-self: end; }
@media (max-width: 800px) { .portal-nav { grid-template-columns: auto repeat(3, minmax(0, 1fr)) auto; }.portal-nav-brand { gap: 5px; font-size: 16px; }.portal-nav-brand .brand-mark { width: 17px; height: 17px; }.portal-nav-brand .brand-mark i { width: 4px; }.portal-nav-brand .brand-mark i:nth-child(1) { height: 8px; }.portal-nav-brand .brand-mark i:nth-child(2) { height: 13px; }.portal-nav-brand .brand-mark i:nth-child(3) { height: 17px; }.portal-nav-item { min-width: 45px; padding-inline: 4px; }.portal-nav-label { font-size: 7px; }.portal-nav-profile { min-width: 43px; } }

/* Portal dock: product mark left, primary routes centred, account always anchored right. */
.portal-nav { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 24px; min-height: 76px; padding: 16px clamp(28px, 5.3vw, 80px) 7px; }
.portal-nav-brand { flex: 0 0 auto; justify-self: auto; }
.portal-nav-routes { display: flex; align-items: center; justify-self: center; justify-content: center; gap: 2px; padding: 4px; border-radius: 15px; background: rgba(255,255,255,.045); }
.portal-nav-item { min-height: 34px; padding: 6px 13px; justify-self: auto; }
.portal-nav-profile { flex: 0 0 auto; justify-self: end; gap: 0; padding: 4px; }
.portal-nav-profile .portal-nav-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.portal-nav-profile .portal-nav-avatar { width: 31px; height: 31px; }

@media (max-width: 800px) {
  .portal-nav { grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; min-height: 72px; padding: 12px 16px 6px; }
  .portal-nav-brand > span:last-child { display: none; }
  .portal-nav-routes { min-width: 0; justify-self: stretch; justify-content: space-around; gap: 0; padding: 3px; }
  .portal-nav-item { min-width: 0; padding: 4px 7px; }
  .portal-nav-profile { min-width: 0; padding: 3px; }
}

/* The cube moves only between six deliberate, readable resting faces. */
@media (min-width: 901px) {
  .services { min-height: 330vh; }
  .services-cube-stage { --cube-size: clamp(420px, 37vw, 540px); --cube-depth: min(15vw, 205px); min-height: 600px; perspective: 1800px; perspective-origin: 50% 47%; }
  .cube-aura { bottom: 3%; width: min(49vw, 650px); height: min(49vw, 650px); border: 1px solid rgba(255,255,255,.045); border-radius: 38%; background: radial-gradient(circle at 50% 50%, rgba(255,255,255,.11), rgba(255,255,255,.028) 38%, transparent 69%); opacity: .7; transform: rotate(45deg); }
  .cube-aura::before { inset: 13%; }.cube-aura::after { inset: 30%; }
  .service-cube { contain: none; transition: transform 400ms cubic-bezier(.22,.8,.2,1); will-change: transform; }
  .cube-face { --cube-facet-depth: clamp(19px, 2.2vw, 31px); overflow: visible; border-color: rgba(255,255,255,.25); border-radius: 40px; background: linear-gradient(145deg, rgba(67,70,74,.98), rgba(28,30,33,.99) 43%, rgba(12,13,15,1)); box-shadow: inset 0 1px rgba(255,255,255,.21), inset -24px -30px 64px rgba(0,0,0,.25), 0 38px 92px rgba(0,0,0,.32); }
  .cube-face::before { border-radius: 40px 40px 44% 44%; background: radial-gradient(ellipse at 22% 0%, rgba(255,255,255,.24), transparent 54%), linear-gradient(110deg, rgba(255,255,255,.07), transparent 60%); }
  .cube-face::after { border-radius: 29px; }
  .cube-face-content { z-index: 1; overflow: hidden; border-radius: inherit; transform: translateZ(2px) !important; opacity: 0; transition: opacity 150ms ease; will-change: opacity; }
  .cube-facet { position: absolute; z-index: 0; display: none; pointer-events: none; backface-visibility: hidden; -webkit-backface-visibility: hidden; }.cube-face.is-active .cube-facet { display: block; }.cube-facet-side { top: 16px; right: calc(-1 * var(--cube-facet-depth)); width: var(--cube-facet-depth); height: calc(100% - 32px); border: 1px solid rgba(255,255,255,.16); border-left: 0; border-radius: 0 17px 17px 0; background: linear-gradient(90deg, #1b1d20, #0d0e10); box-shadow: inset 1px 0 rgba(255,255,255,.1); transform: rotateY(-90deg); transform-origin: left center; }.cube-facet-top { top: calc(-1 * var(--cube-facet-depth)); left: 16px; width: calc(100% - 32px); height: var(--cube-facet-depth); border: 1px solid rgba(255,255,255,.16); border-bottom: 0; border-radius: 17px 17px 0 0; background: linear-gradient(180deg, #45484c, #222427); box-shadow: inset 0 1px rgba(255,255,255,.16); transform: rotateX(-90deg); transform-origin: center bottom; }
  .cube-face:not(.is-active) { visibility: hidden; pointer-events: none; }
  .cube-face.is-active { border-color: rgba(255,255,255,.38); background: linear-gradient(146deg, rgba(78,81,85,.99), rgba(31,33,36,1) 44%, rgba(12,13,15,1)); }
  .cube-face.is-active .cube-face-content { opacity: 1; }
  .service-cube.is-rotating .cube-face-content { opacity: 0 !important; }
  .cube-reader { display: none !important; }
}

/* Creete uses a word-led dock: no generic icons and no decorative mark. */
.site-header-wordmark-free { justify-content: center; }.site-header-wordmark-free .main-nav { margin: 0; }.site-header-wordmark-free .header-actions { position: absolute; right: clamp(28px, 5.3vw, 80px); }
.portal-nav { display: flex; align-items: flex-end; justify-content: center; min-height: 64px; padding: 12px 24px 6px; background: linear-gradient(0deg, rgba(4,5,6,.98), rgba(4,5,6,.72) 68%, rgba(4,5,6,0)); box-shadow: 0 -18px 45px rgba(0,0,0,.2); }
.portal-nav-routes { display: flex; align-items: center; justify-content: center; gap: 4px; padding: 0; border-radius: 0; background: transparent; }
.portal-nav-item, .portal-nav-item:first-child, .portal-nav-item:last-child { display: inline-flex; justify-self: auto; min-height: 33px; padding: 7px 13px; border-radius: 8px; color: #9a9da0; font: 600 10px var(--mono); letter-spacing: .03em; }
.portal-nav-item:hover, .portal-nav-item.is-active { background: rgba(255,255,255,.06); color: #f3f3ee; }

/* The private admin dock stays at the bottom, with the wordmark anchored in its own left column. */
.portal-nav.is-admin-dock { display:grid; grid-template-columns:minmax(120px,1fr) auto minmax(120px,1fr); align-items:end; justify-content:normal; min-height:64px; padding:12px 24px 6px; }
.portal-nav.is-admin-dock .portal-nav-brand { grid-column:1; display:inline-flex; align-items:center; justify-self:start; color:#f2f3f2; font-size:20px; font-weight:800; letter-spacing:-1.5px; line-height:1; text-decoration:none; }
.portal-nav.is-admin-dock .portal-nav-routes { grid-column:2; width:auto; }
.portal-nav-item { position:relative; }
.portal-nav-badge { display:grid; min-width:15px; height:15px; margin-left:2px; padding:0 3px; border:1px solid rgba(255,255,255,.2); border-radius:999px; background:#df4e4e; color:#fff; font:700 8px/1 var(--mono); place-items:center; }
.portal-nav-item.is-active::after { position:absolute; right:10px; bottom:-7px; left:10px; height:2px; border-radius:2px; background:var(--yellow); content:""; }
@media (max-width:800px) { .portal-nav.is-admin-dock { grid-template-columns:auto minmax(0,1fr); gap:12px; min-height:61px; padding:10px 12px 5px; }.portal-nav.is-admin-dock .portal-nav-brand { font-size:16px; }.portal-nav.is-admin-dock .portal-nav-routes { min-width:0; width:100%; overflow-x:auto; justify-content:flex-start; scrollbar-width:none; }.portal-nav.is-admin-dock .portal-nav-routes::-webkit-scrollbar { display:none; }.portal-nav.is-admin-dock .portal-nav-item { flex:0 0 auto; white-space:nowrap; } }

/* A complete 3D object: faces sit a full cube-depth apart, preventing any copy overlap. */
@media (min-width: 701px) {
  .services { position: relative; min-height: 170vh; padding: 0; }
  .services-sticky { position: sticky; top: 0; display: grid; align-items: center; min-height: 100vh; padding: 72px 0 96px; overflow: hidden; }
  .services-layout { display: grid; grid-template-columns: minmax(290px,.76fr) minmax(360px,1.24fr); align-items: center; gap: clamp(38px,7vw,120px); }
  .services .section-heading { display: block; margin: 0; }.services .section-heading > p { width: min(305px,100%); margin-top: 27px; }
  .services-panel { min-width: 0; height: auto; }.services-cube-stage { position: relative; display: grid; min-height: clamp(430px,53vw,570px); place-items: center; perspective: 1350px; perspective-origin: 50% 48%; }
  .cube-aura { position: absolute; width: 78%; height: 78%; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.11), rgba(255,255,255,.025) 43%, transparent 71%); filter: blur(12px); opacity: .7; }
  .service-cube { --cube-size: clamp(360px,42vw,500px); --cube-depth: var(--cube-size); position: relative; z-index: 1; display: block; width: var(--cube-size); height: var(--cube-size); contain: none; transform: translateZ(0) rotateX(var(--cube-rotate-x, -8deg)) rotateY(var(--cube-rotate-y, -8deg)) !important; transform-style: preserve-3d; transition: transform 460ms cubic-bezier(.2,.78,.18,1); will-change: transform; }
  .cube-face { position: absolute; inset: 0; display: block; min-height: 0 !important; margin: 0; padding: 0; overflow: hidden; visibility: visible !important; border: 1px solid rgba(255,255,255,.21); border-radius: 34px; background: linear-gradient(145deg, #45484d, #242629 44%, #101113); box-shadow: inset 0 1px rgba(255,255,255,.22), inset -30px -34px 68px rgba(0,0,0,.32), 0 34px 84px rgba(0,0,0,.34); backface-visibility: hidden; -webkit-backface-visibility: hidden; transform: var(--cube-face-transform) !important; transform-style: preserve-3d; transition: border-color .2s ease, background .2s ease; }
  .cube-face::before { top: 0; left: 0; width: 100%; height: 52%; border-radius: 34px 34px 45% 45%; background: radial-gradient(ellipse at 22% 0%, rgba(255,255,255,.24), transparent 57%), linear-gradient(110deg, rgba(255,255,255,.065), transparent 61%); filter: none; opacity: 1; }
  .cube-face::after { position: absolute; inset: 11px; border: 1px solid rgba(255,255,255,.085); border-radius: 25px; content: ""; pointer-events: none; }
  .cube-face-content { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; min-height: 0; padding: clamp(25px,3vw,34px); overflow: hidden; border-radius: inherit; opacity: 0; transform: translateZ(2px) !important; transition: opacity 120ms linear; }
  .cube-face.is-active { border-color: rgba(255,255,255,.38); background: linear-gradient(145deg, #53565b, #2b2d30 46%, #111214); }.cube-face.is-active .cube-face-content { opacity: 1; }.service-cube.is-rotating .cube-face-content { opacity: 0 !important; }
  .cube-face-front { --cube-face-transform: translateZ(calc(var(--cube-depth) / 2)); }.cube-face-right { --cube-face-transform: rotateY(90deg) translateZ(calc(var(--cube-depth) / 2)); }.cube-face-back { --cube-face-transform: rotateY(180deg) translateZ(calc(var(--cube-depth) / 2)); }.cube-face-left { --cube-face-transform: rotateY(-90deg) translateZ(calc(var(--cube-depth) / 2)); }.cube-face-top { --cube-face-transform: rotateX(90deg) translateZ(calc(var(--cube-depth) / 2)); }.cube-face-bottom { --cube-face-transform: rotateX(-90deg) translateZ(calc(var(--cube-depth) / 2)); }
  .cube-face:hover { transform: var(--cube-face-transform) !important; }.cube-facet, .cube-reader { display: none !important; }.cube-caption { right: 0; bottom: -4px; z-index: 3; }
}

@media (max-width: 700px) {
  .site-header-wordmark-free { justify-content: flex-start; }.site-header-wordmark-free .header-actions { position: static; margin-left: auto; }.site-header-wordmark-free .main-nav { display: none; }
  .portal-nav { min-height: 61px; padding: 10px 8px 5px; }.portal-nav-routes { width: 100%; gap: 0; justify-content: space-around; }.portal-nav-item, .portal-nav-item:first-child, .portal-nav-item:last-child { min-height: 32px; padding: 7px 6px; font-size: 8px; }
}

/* Tablets and compact desktops keep the cube instead of falling back to a card grid. */
@media (min-width: 701px) and (max-width: 900px) {
  .services { position: relative; min-height: 350vh; padding: 0; }
  .services-sticky { position: sticky; top: 0; display: flex; align-items: center; min-height: 100vh; padding: 34px 0 42px; overflow: hidden; }
  .services-layout { display: grid; grid-template-columns: 1fr; grid-template-rows: auto 1fr; align-items: center; gap: 22px; }
  .services .section-heading { display: grid; grid-template-columns: minmax(0, 1fr) minmax(210px, .86fr); align-items: end; gap: 26px; margin: 0; }
  .services .section-heading > p { max-width: 300px; margin: 0 0 4px; }
  .services-panel { height: min(505px, calc(100vh - 190px)); min-height: 405px; }
  .services-cube-stage { --cube-size: clamp(350px, 54vw, 420px); --cube-depth: min(15vw, 140px); position: relative; display: grid; width: 100%; height: 100%; min-height: 405px; isolation: isolate; overflow: visible; perspective: 1500px; perspective-origin: 50% 47%; place-items: center; }
  .cube-aura { position: absolute; bottom: -10%; display: block; width: min(68vw, 500px); height: min(68vw, 500px); border: 1px solid rgba(255,255,255,.045); border-radius: 38%; background: radial-gradient(circle at 50% 50%, rgba(255,255,255,.1), rgba(255,255,255,.025) 39%, transparent 69%); opacity: .64; transform: rotate(45deg); }
  .cube-aura::before, .cube-aura::after { position: absolute; border: 1px solid rgba(255,255,255,.05); border-radius: inherit; content: ""; }.cube-aura::before { inset: 13%; }.cube-aura::after { inset: 30%; border-color: rgba(255,255,255,.032); }
  .service-cube { position: relative; z-index: 1; display: block; width: var(--cube-size); height: var(--cube-size); contain: none; transform: translateZ(0) rotateX(var(--cube-rotate-x, 0deg)) rotateY(var(--cube-rotate-y, 0deg)) !important; transform-style: preserve-3d; transition: transform 400ms cubic-bezier(.22,.8,.2,1); will-change: transform; }
  .cube-face { --cube-facet-depth: 24px; position: absolute; inset: 0; min-height: 0 !important; margin: 0; padding: 0; overflow: visible; border: 1px solid rgba(255,255,255,.25); border-radius: 36px; background: linear-gradient(145deg, rgba(67,70,74,.98), rgba(28,30,33,.99) 43%, rgba(12,13,15,1)); box-shadow: inset 0 1px rgba(255,255,255,.21), inset -24px -30px 64px rgba(0,0,0,.25), 0 32px 76px rgba(0,0,0,.32); backface-visibility: hidden; -webkit-backface-visibility: hidden; transform: var(--cube-face-transform) !important; transform-style: preserve-3d; }
  .cube-face::before { top: 0; left: 0; width: 100%; height: 48%; border-radius: 36px 36px 44% 44%; background: radial-gradient(ellipse at 22% 0%, rgba(255,255,255,.23), transparent 54%), linear-gradient(110deg, rgba(255,255,255,.07), transparent 60%); filter: none; opacity: 1; }
  .cube-face::after { position: absolute; inset: 11px; border: 1px solid rgba(255,255,255,.09); border-radius: 25px; content: ""; pointer-events: none; }
  .cube-face-content { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; min-height: 0; padding: 28px; overflow: hidden; border-radius: inherit; opacity: 0; transform: translateZ(2px) !important; transition: opacity 150ms ease; will-change: opacity; }
  .cube-facet { position: absolute; z-index: 0; display: none; pointer-events: none; backface-visibility: hidden; -webkit-backface-visibility: hidden; }.cube-face.is-active .cube-facet { display: block; }.cube-facet-side { top: 14px; right: calc(-1 * var(--cube-facet-depth)); width: var(--cube-facet-depth); height: calc(100% - 28px); border: 1px solid rgba(255,255,255,.16); border-left: 0; border-radius: 0 14px 14px 0; background: linear-gradient(90deg, #1b1d20, #0d0e10); box-shadow: inset 1px 0 rgba(255,255,255,.1); transform: rotateY(-90deg); transform-origin: left center; }.cube-facet-top { top: calc(-1 * var(--cube-facet-depth)); left: 14px; width: calc(100% - 28px); height: var(--cube-facet-depth); border: 1px solid rgba(255,255,255,.16); border-bottom: 0; border-radius: 14px 14px 0 0; background: linear-gradient(180deg, #45484c, #222427); box-shadow: inset 0 1px rgba(255,255,255,.16); transform: rotateX(-90deg); transform-origin: center bottom; }
  .cube-face:not(.is-active) { visibility: hidden; pointer-events: none; }
  .cube-face.is-active { border-color: rgba(255,255,255,.38); background: linear-gradient(146deg, rgba(78,81,85,.99), rgba(31,33,36,1) 44%, rgba(12,13,15,1)); }
  .cube-face.is-active .cube-face-content { opacity: 1; }
  .service-cube.is-rotating .cube-face-content { opacity: 0 !important; }
  .cube-face-front { --cube-face-transform: translateZ(calc(var(--cube-depth) / 2)); }.cube-face-right { --cube-face-transform: rotateY(90deg) translateZ(calc(var(--cube-depth) / 2)); }.cube-face-back { --cube-face-transform: rotateY(180deg) translateZ(calc(var(--cube-depth) / 2)); }.cube-face-left { --cube-face-transform: rotateY(-90deg) translateZ(calc(var(--cube-depth) / 2)); }.cube-face-top { --cube-face-transform: rotateX(90deg) translateZ(calc(var(--cube-depth) / 2)); }.cube-face-bottom { --cube-face-transform: rotateX(-90deg) translateZ(calc(var(--cube-depth) / 2)); }
  .cube-face:hover { transform: var(--cube-face-transform) !important; }
  .cube-caption { position: absolute; right: max(-4px, calc((100% - var(--cube-size)) / 2)); bottom: 0; z-index: 4; display: grid; gap: 3px; min-width: 142px; padding: 10px 12px; border: 1px solid rgba(255,255,255,.1); border-radius: 14px; background: linear-gradient(130deg, rgba(31,33,36,.72), rgba(17,18,20,.48)); box-shadow: inset 0 1px rgba(255,255,255,.07), 0 14px 30px rgba(0,0,0,.22); }
  .cube-caption span, .cube-caption small { color: #9ea0a4; font: 500 8px var(--mono); }.cube-caption strong { color: #efefea; font-size: 10px; }
  .cube-reader { display: none !important; }
}

/* Final cube rules intentionally override the earlier experiments. */
@media (min-width: 701px) {
  .services { min-height: 650vh; }
  .services-sticky { display: grid; padding: 72px 0 96px; }
  .services-layout { grid-template-columns: minmax(290px,.76fr) minmax(360px,1.24fr); grid-template-rows: none; gap: clamp(38px,7vw,120px); }
  .services .section-heading { display: block; }.services .section-heading > p { width: min(305px,100%); margin-top: 27px; }
  .services-panel { height: auto; min-height: 0; }.services-cube-stage { --cube-size: clamp(360px,42vw,500px); --cube-depth: var(--cube-size); min-height: clamp(430px,53vw,570px); height: auto; isolation: auto; overflow: visible; perspective: 1350px; }
  .service-cube { --cube-size: clamp(360px,42vw,500px); --cube-depth: var(--cube-size); transition: transform 1400ms cubic-bezier(.2,.78,.18,1); }
  .cube-face { overflow: hidden; visibility: visible !important; border-radius: 20px; background: linear-gradient(145deg, #45484d, #242629 44%, #101113); backface-visibility: visible; -webkit-backface-visibility: visible; }
  .cube-face::before { border-radius: 20px 20px 40% 40%; }.cube-face::after { border-radius: 13px; }
  .cube-face-right, .cube-face-left { background: linear-gradient(100deg, #45494f, #17191c 72%); }.cube-face-top, .cube-face-bottom { background: linear-gradient(180deg, #787c82, #303338 78%); }
  .cube-face:not(.is-active) { visibility: visible !important; pointer-events: none; }.cube-face.is-active { background: linear-gradient(145deg, #53565b, #2b2d30 46%, #111214); }
  .service-cube.is-rotating .cube-face.is-active .cube-face-content { opacity: .72 !important; }
  .cube-facet { display: none !important; }.cube-caption { right: 0; bottom: -4px; }
}

/* One private dock across every administrator surface. */
.portal-nav.is-admin-dock {
  position: fixed;
  z-index: 50;
  right: 0;
  bottom: 0;
  left: 0;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 24px;
  min-height: 58px;
  padding: 0 38px;
  background: linear-gradient(0deg, rgba(7, 8, 10, .98), rgba(7, 8, 10, .8) 68%, rgba(7, 8, 10, 0));
  box-shadow: 0 -18px 46px rgba(0, 0, 0, .22);
  backdrop-filter: blur(18px);
}
.portal-nav.is-admin-dock .portal-nav-brand {
  grid-column: 1;
  align-self: center;
  color: #f3f2ee;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -1px;
  line-height: 1;
  text-decoration: none;
}
.portal-nav.is-admin-dock .portal-nav-routes {
  grid-column: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: 58px;
  gap: 25px;
  padding: 0;
  overflow: visible;
  border-radius: 0;
  background: transparent;
}
.portal-nav.is-admin-dock .portal-nav-item,
.portal-nav.is-admin-dock .portal-nav-item:first-child,
.portal-nav.is-admin-dock .portal-nav-item:last-child {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 58px;
  height: 58px;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: #92959c;
  font: 700 11px Manrope, Arial, sans-serif;
  letter-spacing: 0;
  text-decoration: none;
  transform: none;
}
.portal-nav.is-admin-dock .portal-nav-item:hover,
.portal-nav.is-admin-dock .portal-nav-item.is-active {
  background: transparent;
  color: #f3f2ee;
  transform: none;
}
.portal-nav.is-admin-dock .portal-nav-item.is-active::after {
  right: 0;
  bottom: 0;
  left: 0;
  height: 2px;
  border-radius: 0;
  background: #f4d94e;
}
.portal-nav :is(.portal-nav-brand, .portal-nav-item):focus-visible {
  outline: 2px solid var(--yellow);
  outline-offset: 4px;
}
.portal-nav-status {
  grid-column: 3;
  justify-self: end;
  margin: 0;
  color: #a4a7ad;
  font-family: "DM Mono", monospace;
  font-size: 9px;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.portal-nav-status i {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 6px;
  border-radius: 50%;
  background: #87c79d;
  box-shadow: 0 0 0 4px rgba(135, 199, 157, .08);
}
@media (max-width: 900px) {
  .portal-nav.is-admin-dock {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 18px;
    padding: 0 20px;
  }
  .portal-nav.is-admin-dock .portal-nav-brand { font-size: 16px; }
  .portal-nav.is-admin-dock .portal-nav-routes {
    min-width: 0;
    justify-content: flex-start;
    gap: 19px;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .portal-nav.is-admin-dock .portal-nav-routes::-webkit-scrollbar { display: none; }
  .portal-nav.is-admin-dock .portal-nav-item { flex: 0 0 auto; white-space: nowrap; }
  .portal-nav-status { display: none; }
}
@media (max-width: 580px) {
  .portal-nav.is-admin-dock { padding: 0 16px; }
  .portal-nav.is-admin-dock .portal-nav-routes { gap: 16px; }
  .portal-nav.is-admin-dock .portal-nav-item,
  .portal-nav.is-admin-dock .portal-nav-item:first-child,
  .portal-nav.is-admin-dock .portal-nav-item:last-child { font-size: 10px; }
}

/* One persistent dock for marketplace, member workspaces, and public portal pages. */
.portal-nav.is-member-dock,
.portal-nav.is-public-dock {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 50;
  display: grid;
  grid-template-columns: minmax(120px, 1fr) auto minmax(120px, 1fr);
  align-items: end;
  gap: 22px;
  min-height: 64px;
  padding: 12px 24px 6px;
  background: linear-gradient(0deg, rgba(4,5,6,.98), rgba(4,5,6,.72) 68%, rgba(4,5,6,0));
  box-shadow: 0 -18px 46px rgba(0,0,0,.22);
  backdrop-filter: blur(18px);
}
.portal-nav.is-member-dock .portal-nav-brand,
.portal-nav.is-public-dock .portal-nav-brand {
  grid-column: 1;
  align-self: center;
  justify-self: start;
  color: #f3f2ee;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -1.5px;
  line-height: 1;
  text-decoration: none;
}
.portal-nav.is-member-dock .portal-nav-routes,
.portal-nav.is-public-dock .portal-nav-routes {
  grid-column: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 19px;
  min-width: 0;
}
.portal-nav.is-member-dock .portal-nav-item,
.portal-nav.is-member-dock .portal-nav-item:first-child,
.portal-nav.is-member-dock .portal-nav-item:last-child,
.portal-nav.is-public-dock .portal-nav-item,
.portal-nav.is-public-dock .portal-nav-item:first-child,
.portal-nav.is-public-dock .portal-nav-item:last-child {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 46px;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: #999ca0;
  font: 600 10px var(--mono);
  letter-spacing: .03em;
  text-decoration: none;
  transform: none;
}
.portal-nav.is-member-dock .portal-nav-item:hover,
.portal-nav.is-member-dock .portal-nav-item.is-active,
.portal-nav.is-public-dock .portal-nav-item:hover,
.portal-nav.is-public-dock .portal-nav-item.is-active { color: #f3f3ee; background: transparent; }
.portal-nav.is-member-dock .portal-nav-item.is-active::after,
.portal-nav.is-public-dock .portal-nav-item.is-active::after { position: absolute; right: 0; bottom: 0; left: 0; height: 2px; border-radius: 2px; background: var(--yellow); content: ""; }
.portal-nav.is-member-dock .portal-nav-profile { grid-column: 3; justify-self: end; padding: 3px; }
.portal-nav.is-public-dock .portal-nav-public-action { grid-column: 3; justify-self: end; color: #f4f3ed; font: 600 10px var(--mono); letter-spacing: .03em; text-decoration: none; }
.portal-nav.is-public-dock .portal-nav-public-action:hover { color: var(--yellow); }
@media (max-width: 900px) {
  .portal-nav.is-member-dock,
  .portal-nav.is-public-dock { grid-template-columns: auto minmax(0,1fr) auto; gap: 18px; padding: 0 20px; }
  .portal-nav.is-member-dock .portal-nav-brand,
  .portal-nav.is-public-dock .portal-nav-brand { font-size: 16px; }
  .portal-nav.is-member-dock .portal-nav-routes,
  .portal-nav.is-public-dock .portal-nav-routes { justify-content: flex-start; gap: 19px; overflow-x: auto; scrollbar-width: none; }
  .portal-nav.is-member-dock .portal-nav-routes::-webkit-scrollbar,
  .portal-nav.is-public-dock .portal-nav-routes::-webkit-scrollbar { display: none; }
  .portal-nav.is-member-dock .portal-nav-item,
  .portal-nav.is-public-dock .portal-nav-item { flex: 0 0 auto; white-space: nowrap; }
  .portal-nav.is-public-dock .portal-nav-public-action { font-size: 9px; white-space: nowrap; }
}

/* Public navigation is a compact, centred floating dock rather than a page-wide footer. */
.portal-nav.is-public-dock {
  right: auto;
  bottom: 18px;
  left: 50%;
  width: min(920px, calc(100% - 36px));
  min-height: 58px;
  padding: 0 18px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  background: rgba(13,14,16,.84);
  box-shadow: 0 18px 60px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.045);
  transform: translateX(-50%);
  backdrop-filter: blur(22px) saturate(115%);
}
.portal-nav.is-public-dock .portal-nav-routes { gap: 26px; }
.portal-nav.is-public-dock .portal-nav-item { min-height: 58px; }
.portal-nav.is-public-dock .portal-nav-balance { grid-column: 3; width: 1px; height: 1px; justify-self: end; }
.portal-nav.is-public-dock .portal-nav-item:last-child { color: #f4d94e; }
.portal-nav.is-public-dock .portal-nav-item:last-child:hover { color: #fff2a4; }
@media (max-width: 700px) {
  .portal-nav.is-public-dock { bottom: 10px; width: calc(100% - 20px); min-height: 54px; padding: 0 12px; border-radius: 15px; }
  .portal-nav.is-public-dock .portal-nav-routes { gap: 15px; }
  .portal-nav.is-public-dock .portal-nav-item { min-height: 54px; font-size: 8px; }
}
