/* fonts.css */
@font-face{font-family:'Inter';font-style:normal;font-weight:400 600;font-display:swap;src:url(/assets/fonts/inter-var.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} @font-face{font-family:'Inter Tight';font-style:normal;font-weight:500 700;font-display:swap;src:url(/assets/fonts/inter-tight-var.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} @font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400 500;font-display:optional;src:url(/assets/fonts/jetbrains-mono-var.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* site.css */
:root { --radius: 22px; --radius-s: 14px; --font: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --display: 'Inter Tight', 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; --mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace; } * { box-sizing: border-box; } html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; background: var(--bg); overflow-x: hidden; } body { margin: 0; background: transparent; color: var(--text); font: 16px/1.6 var(--font); -webkit-font-smoothing: antialiased; position: relative; min-height: 100vh; } body::before { content: ''; position: fixed; inset: -20% -10%; z-index: -2; pointer-events: none; animation: aurora 26s ease-in-out infinite alternate; } body::after { content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: .35; background-size: 64px 64px; mask-image: radial-gradient(60% 50% at 50% 30%, #000, transparent 90%); -webkit-mask-image: radial-gradient(60% 50% at 50% 30%, #000, transparent 90%); } @keyframes aurora { 0% { transform: translate3d(0, 0, 0) scale(1); } 50% { transform: translate3d(-3%, 2%, 0) scale(1.06); } 100% { transform: translate3d(2%, -3%, 0) scale(1.02); } } a { color: var(--text); text-decoration: none; } a:hover { text-decoration: underline; text-underline-offset: 3px; } h1, h2, h3, h4 { color: var(--text); line-height: 1.1; margin: 0 0 .5em; font-family: var(--display); } h1 { font-size: clamp(38px, 5.6vw, 72px); font-weight: 600; letter-spacing: -0.035em; line-height: 1.02; } h2 { font-size: clamp(26px, 3.2vw, 42px); font-weight: 600; letter-spacing: -0.025em; } h3 { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .14em; margin-bottom: 1em; font-family: var(--mono); color: var(--accent); } h4 { font-size: 20px; font-weight: 600; letter-spacing: -0.015em; } p { margin: 0 0 1em; } ul { padding-left: 20px; margin: 0 0 1em; } li { margin: 0 0 .4em; } li::marker { color: var(--accent); } .lead { font-size: clamp(18px, 1.6vw, 21px); line-height: 1.5; max-width: 640px; } .eyebrow { font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .16em; margin: 0 0 18px; display: inline-flex; align-items: center; gap: 10px; padding: 8px 14px; border-radius: 999px; background: var(--glass); border: 1px solid var(--line); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); } .eyebrow::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 12px var(--accent); } .wrap { max-width: clamp(1240px, 68vw, 1760px); margin: 0 auto; padding: 0 24px; } .narrow { max-width: 780px; } .narrow-l > * { max-width: 780px; } .section { padding: 80px 0; } .section-tight { padding: 40px 0; } .section + .section { padding-top: 0; } hr.rule { border: 0; border-top: 1px solid var(--line); margin: 0; } .mono { font-family: var(--mono); } .mt-0 { margin-top: 0; } .mb-0 { margin-bottom: 0; } .glass, .ledger, .picker, .rows, .table, .price-grid, .timeline, .faq, .ticker, .search-card, .form-panel { background: var(--glass); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); backdrop-filter: blur(22px) saturate(160%); -webkit-backdrop-filter: blur(22px) saturate(160%); } .announce { border-bottom: 1px solid var(--line); font-family: var(--mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; text-align: center; padding: 9px 0; } .announce a { text-decoration: underline; text-decoration-color: var(--accent); } .nav > .wrap, .announce > .wrap { max-width: none; padding: 0 clamp(24px, 4vw, 96px); } .nav { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid var(--line); backdrop-filter: blur(20px) saturate(160%); -webkit-backdrop-filter: blur(20px) saturate(160%); transition: background .3s; } .nav-in { display: flex; align-items: center; gap: 28px; height: 70px; } .brand { font-family: var(--display); font-weight: 700; font-size: 22px; letter-spacing: -0.03em; display: inline-flex; align-items: center; gap: 10px; } .brand:hover { text-decoration: none; } .brand-mark { width: 28px; height: 28px; border-radius: 8px; position: relative; flex: none; } .brand-mark::before { content: ''; position: absolute; left: 8px; top: 7px; width: 5px; height: 13px; background: var(--ink); border-radius: 1px; } .brand-mark::after { content: ''; position: absolute; left: 15px; top: 12px; width: 5px; height: 8px; background: var(--ink); border-radius: 1px; } .nav-links { display: flex; gap: 4px; flex: 1; } .nav-links a { font-weight: 500; font-size: 15px; padding: 8px 12px; border-radius: 999px; transition: background .2s; } .nav-links a:hover { text-decoration: none; background: var(--glass2); } .nav-links a.active { background: var(--glass2); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18); } .nav-right { display: flex; gap: 10px; } .nav-toggle { display: none; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 12px; background: var(--glass); cursor: pointer; margin-left: auto; position: relative; } .nav-toggle span { position: absolute; left: 12px; right: 12px; height: 2px; border-radius: 2px; transition: transform .2s, top .2s; } .nav-toggle span:nth-child(1) { top: 14px; } .nav-toggle span:nth-child(2) { top: 21px; } .nav-toggle span:nth-child(3) { top: 28px; } .nav-open .nav-toggle span:nth-child(1) { top: 21px; transform: rotate(45deg); } .nav-open .nav-toggle span:nth-child(2) { transform: scaleX(0); } .nav-open .nav-toggle span:nth-child(3) { top: 21px; transform: rotate(-45deg); } .btn { display: inline-flex; align-items: center; justify-content: center; height: 48px; padding: 0 24px; border-radius: 999px; font-weight: 600; font-size: 15px; border: 1px solid var(--line2); cursor: pointer; transition: transform .15s, box-shadow .15s, background .2s; font-family: var(--font); white-space: nowrap; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); } .btn:hover { text-decoration: none; transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 12px 30px rgba(0, 0, 0, 0.45); } .btn-primary:hover, .btn-light:hover { box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.3), 0 14px 40px rgba(125, 240, 255, 0.35); } .btn-lg { height: 56px; padding: 0 30px; font-size: 16px; } .btn:focus-visible, a:focus-visible, button:focus-visible, select:focus-visible, input:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; } .btn-row { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; } .hero { padding: 96px 0 72px; position: relative; overflow: hidden; } .hero-fx { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; } .hero-fx span { position: absolute; display: block; } .hero-fx .bloom { inset: -30% -18%; will-change: transform; filter: blur(24px); transform: translate3d(calc(var(--hx, 0) * 1px), calc(var(--hy, 0) * 1px), 0); transition: transform 1.1s cubic-bezier(.2, .7, .2, 1); } .hero-fx .beam { top: -45%; height: 190%; width: 26vw; filter: blur(46px); transform: rotate(15deg); background: linear-gradient(90deg, transparent, var(--beam), transparent); } .hero-fx .b1 { left: 6%; animation: beam1 24s ease-in-out infinite alternate; } .hero-fx .b2 { left: 52%; width: 18vw; opacity: .7; animation: beam2 31s ease-in-out infinite alternate; } .hero-fx .grain { inset: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E"); } @keyframes beam1 { 0% { transform: rotate(15deg) translateX(-6vw); } 100% { transform: rotate(15deg) translateX(10vw); } } @keyframes beam2 { 0% { transform: rotate(15deg) translateX(8vw); } 100% { transform: rotate(15deg) translateX(-7vw); } } .hero > .wrap { position: relative; z-index: 1; } .hero > .wrap { max-width: none; padding: 0 clamp(24px, 4vw, 96px); } .hero > .hero-grid, .hero .hero-grid { grid-template-columns: minmax(0, 1.15fr) minmax(420px, 860px); gap: clamp(40px, 5vw, 120px); } .hero h1 { max-width: 15ch; font-size: clamp(38px, 3.9vw, 78px); } .hero .lead { max-width: 60ch; } .hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 64px; align-items: center; } .hero-visual { display: flex; flex-direction: column; gap: 20px; position: relative; } .hero-visual::before { content: ''; position: absolute; inset: -14% 0; z-index: -1; background: radial-gradient(50% 50% at 50% 45%, rgba(125, 240, 255, 0.26), transparent 70%); } .hero h1 { max-width: 680px; margin-bottom: 22px; } .hero .lead { margin-bottom: 30px; } .picker { display: flex; gap: 10px; padding: 10px; max-width: 640px; align-items: center; border-radius: 999px; } .picker-label { padding-left: 16px; font-weight: 500; white-space: nowrap; } .picker select { flex: 1; height: 46px; border: 1px solid var(--line); border-radius: 999px; padding: 0 40px 0 16px; font: inherit; font-weight: 500; color: #fff; background: var(--glass2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.5'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center; appearance: none; -webkit-appearance: none; min-width: 0; } .picker select option { color: #fff; background: #12141d; } .hero-note { margin-top: 18px; font-size: 15px; } .hero-note a { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--accent); } .hero-photo { position: relative; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); aspect-ratio: 4 / 3; } .hero-photo img { width: 100%; height: 100%; object-fit: cover; display: block; } .hero-photo .glass-tag { position: absolute; left: 16px; bottom: 16px; padding: 10px 14px; border-radius: 999px; border: 1px solid var(--line2); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); font-family: var(--mono); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; display: inline-flex; gap: 10px; align-items: center; } .hero-photo .glass-tag::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 12px var(--accent); animation: blink 1.6s ease-in-out infinite; } .flow { width: 100%; height: auto; display: block; filter: drop-shadow(0 12px 30px rgba(0, 0, 0, 0.4)); } .flow .fl { fill: none; stroke-width: 2; } .flow .fd { fill: none; stroke-width: 2; stroke-dasharray: 3 9; stroke-linecap: round; animation: flowdash 1.4s linear infinite; } .flow .fp { fill: var(--accent); filter: drop-shadow(0 0 6px var(--accent)); } .flow .fn rect { stroke: var(--line2); stroke-width: 1.2; } .flow .fn text { font-family: var(--mono); font-size: 12px; letter-spacing: .1em; text-anchor: middle; text-transform: uppercase; font-weight: 500; } .flow .fn.on rect { stroke: var(--accent); stroke-width: 1.6; } .flow .fd.on { stroke: var(--accent); stroke-dasharray: 5 7; animation-duration: .8s; } .flow .fc .ring { fill: none; stroke: var(--accent); stroke-width: 1.5; opacity: 0; transform-origin: 300px 178px; animation: ring 3.2s ease-out infinite; } .flow .fc .ring.r2 { animation-delay: 1.6s; } @keyframes flowdash { to { stroke-dashoffset: -24; } } @keyframes ring { 0% { transform: scale(.85); opacity: .9; } 100% { transform: scale(1.5); opacity: 0; } } .flow-section { padding-top: 64px; } .flow-wrap { max-width: 820px; margin: 0 auto; padding: 24px; } .ledger-wrap { display: contents; } .js .reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; } .js .reveal.in { opacity: 1; transform: none; } .js .hero h1 .w { display: inline-block; opacity: 0; transform: translateY(.35em); filter: blur(6px); animation: wordin .8s cubic-bezier(.2,.7,.2,1) forwards; } @keyframes wordin { to { opacity: 1; transform: none; filter: blur(0); } } .ticker { overflow: hidden; padding: 18px 0; border-radius: 0; border-left: 0; border-right: 0; box-shadow: none; } .ticker-in { display: flex; width: max-content; gap: 48px; animation: ticker 60s linear infinite; font-family: var(--mono); font-size: 13px; text-transform: uppercase; letter-spacing: .14em; white-space: nowrap; } .ticker:hover .ticker-in { animation-play-state: paused; } .ticker-in span::before { content: ''; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 10px var(--accent); margin-right: 18px; vertical-align: middle; } @keyframes ticker { to { transform: translateX(-50%); } } .ledger { overflow: hidden; } .ledger-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding: 14px 20px; border-bottom: 1px solid var(--line); font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .14em; } .hero-grid > *, .dark-grid > *, .split > *, .contact-grid > *, .row > *, .portal > *, .cols-4 > *, .cols-3 > *, .ledger, .picker, .rows, .table { max-width: 100%; } .ledger-head .dot { margin-right: 8px; } .ledger-head .dot-on { animation: blink 1.6s ease-in-out infinite; } @keyframes blink { 50% { opacity: .35; } } .ledger-head .clock { font-variant-numeric: tabular-nums; color: var(--accent); } .ledger ol { list-style: none; margin: 0; padding: 0; } .ledger li { display: grid; grid-template-columns: 56px 110px 1fr; gap: 16px; padding: 14px 20px; border-bottom: 1px solid var(--line); align-items: baseline; font-size: 15px; line-height: 1.45; } .ledger li:last-child { border-bottom: 0; } .ledger li .t { font-family: var(--mono); font-size: 13px; color: var(--accent); } .ledger li .c { font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: .12em; } .ledger.anim li { clip-path: inset(0 0 100% 0); transform: translateY(6px); transition: clip-path .35s ease, transform .35s ease; } .ledger.anim li.show { clip-path: inset(0); transform: none; } .ledger.anim li.out { clip-path: inset(100% 0 0 0); transform: translateY(-6px); } .ledger.anim li[hidden] { display: none; } .ledger.compact li { grid-template-columns: 56px 1fr; } .cols-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; } .cols-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; } .cols-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 48px; } .cols-4 a, .cols-3 a, .cols-2 a, .portal-side a { display: block; padding: 6px 0; transition: transform .2s, color .2s; } .cols-4 a:hover, .cols-3 a:hover, .portal-side a:hover { transform: translateX(4px); text-decoration: none; color: var(--accent); } .rows { overflow: hidden; } .row { display: grid; grid-template-columns: 280px 1fr 140px; gap: 32px; padding: 26px 28px; border-bottom: 1px solid var(--line); align-items: start; transition: background .25s; } .row:last-child { border-bottom: 0; } .row h4 { margin: 0; } .row h4 a { display: inline-block; transition: transform .25s; } .row:hover h4 a { transform: translateX(6px); text-decoration: none; } .row p { margin: 0; } .row .more { text-align: right; font-weight: 500; } .row .more a { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--accent); } .row-2 { grid-template-columns: 280px 1fr; } .section-head { display: flex; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 28px; } .section-head p { margin: 0; max-width: 560px; } .timeline { overflow: hidden; } .timeline .step { display: grid; grid-template-columns: 180px 1fr; gap: 32px; padding: 26px 28px; border-bottom: 1px solid var(--line); position: relative; } .timeline .step:last-child { border-bottom: 0; } .timeline .when { font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .14em; padding-top: 6px; color: var(--accent); } .timeline h4 { margin-bottom: 6px; } .timeline p { margin: 0; max-width: 680px; } .section-dark { padding: 80px 0; position: relative; } .section-dark .dark-grid { padding: 56px; border-radius: 28px; border: 1px solid var(--line2); box-shadow: var(--shadow); backdrop-filter: blur(24px) saturate(160%); -webkit-backdrop-filter: blur(24px) saturate(160%); } .section-dark h2, .section-dark p, .section-dark a, .section-dark h3 { color: #fff; } .dark-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; } .dark-list { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--line2); } .dark-list li { padding: 14px 0; border-bottom: 1px solid var(--line2); margin: 0; } .section-dark .btn[style] { background: var(--glass2) !important; border-color: var(--line2) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 8px 24px rgba(0, 0, 0, 0.35) !important; } .split { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; } .split ul { padding-left: 18px; } .table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; } .table-scroll .table { min-width: 640px; } .table { width: 100%; border-collapse: separate; border-spacing: 0; overflow: hidden; } .table th, .table td { text-align: left; padding: 14px 18px; border-bottom: 1px solid var(--line); vertical-align: top; } .table th { font-weight: 600; font-size: 14px; } .table thead th { background: rgba(255, 255, 255, 0.04); font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .1em; } .table tr:last-child td, .table tr:last-child th { border-bottom: 0; } .table.kv th { width: 220px; } .table .num { font-family: var(--mono); white-space: nowrap; } .dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--line2); margin-right: 8px; vertical-align: middle; } .dot-on { background: var(--accent); box-shadow: 0 0 12px var(--accent); } .price-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; overflow: hidden; } .price { padding: 34px 30px; border-right: 1px solid var(--line); display: flex; flex-direction: column; gap: 12px; transition: background .25s; } .price:hover { background: var(--glass2); } .price:last-child { border-right: 0; } .price .amount { font-family: var(--display); font-size: 42px; font-weight: 600; letter-spacing: -0.03em; line-height: 1; } .price .amount small { font-family: var(--font); font-size: 15px; font-weight: 500; letter-spacing: 0; } .price ul { list-style: none; padding: 0; margin: 8px 0 0; border-top: 1px solid var(--line); } .price li { padding: 9px 0; border-bottom: 1px solid var(--line); margin: 0; font-size: 15px; } .price .btn { margin-top: auto; align-self: flex-start; } .faq { overflow: hidden; } .faq details { border-bottom: 1px solid var(--line); } .faq details:last-child { border-bottom: 0; } .faq summary { cursor: pointer; padding: 18px 24px; font-weight: 600; font-size: 17px; list-style: none; display: flex; justify-content: space-between; gap: 16px; transition: background .2s; } .faq summary:hover { background: var(--glass2); } .faq summary::-webkit-details-marker { display: none; } .faq summary::after { content: '+'; font-family: var(--mono); font-size: 20px; line-height: 1; flex: none; transition: transform .2s; color: var(--accent); } .faq details[open] summary::after { transform: rotate(45deg); } .faq details p { margin: 0; padding: 0 24px 20px; max-width: 720px; } .form, .tool-form, .filters { display: flex; flex-direction: column; gap: 16px; } .form-panel { padding: 28px; } .form-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; } label { display: flex; flex-direction: column; gap: 6px; font-weight: 500; font-size: 15px; } input[type=text], input[type=search], input[type=email], input[type=number], input[type=tel], input[type=password], select, textarea { height: 48px; border: 1px solid var(--line); border-radius: var(--radius-s); padding: 0 14px; font: inherit; color: #fff; background: var(--glass); width: 100%; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08); } select { appearance: none; -webkit-appearance: none; background: var(--glass) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.5'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center; padding-right: 40px; } select option { color: #fff; background: #12141d; } textarea { height: auto; padding: 12px 14px; resize: vertical; } .checks { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; } .checks label { flex-direction: row; align-items: center; gap: 10px; font-weight: 400; } .checks input { width: 18px; height: 18px; accent-color: var(--accent); margin: 0; } .form-error { font-weight: 600; color: var(--accent3); } .hp { position: absolute; left: -9999px; } .pager { display: flex; gap: 10px; margin-top: 24px; } .crumbs { font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .12em; margin-bottom: 20px; } .crumbs a { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--accent); } .portal { display: grid; grid-template-columns: 240px 1fr; gap: 56px; } .portal-side h3 { margin-top: 24px; } .portal-side h3:first-child { margin-top: 0; } .portal-side a.active { font-weight: 700; color: var(--accent); } .tool-form { max-width: 520px; } .tool-result { margin-top: 28px; padding: 24px 28px; border-radius: var(--radius); background: var(--glass); border: 1px solid var(--line); box-shadow: var(--shadow-s); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); } .tool-result .big { font-family: var(--display); font-size: clamp(36px, 4vw, 60px); font-weight: 600; letter-spacing: -0.03em; line-height: 1; margin: 0 0 8px; color: transparent; } .tool-result table { margin-top: 16px; } .contact-grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: 64px; } .page-head { padding: 80px 0 40px; } .page-head h1 { max-width: 860px; } .page-head .lead { max-width: 720px; } .footer { position: relative; overflow: hidden; margin-top: 96px; padding: 0 0 28px; border-top: 1px solid var(--line); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); } .footer::before { content: ''; position: absolute; left: 50%; top: -1px; width: min(720px, 80vw); height: 1px; transform: translateX(-50%); background: linear-gradient(90deg, transparent, var(--accent), transparent); } .footer .wrap { position: relative; z-index: 1; } .foot-cta { display: flex; justify-content: space-between; align-items: center; gap: 40px; padding: 64px 0 56px; border-bottom: 1px solid var(--line); } .foot-cta h2 { margin: 0 0 10px; font-size: clamp(28px, 2.6vw, 44px); letter-spacing: -.03em; max-width: 18ch; } .foot-cta p:last-child { margin: 0; max-width: 46ch; } .foot-cta .btn-row { flex: none; } .foot-grid { display: grid; grid-template-columns: 1.6fr repeat(5, 1fr); gap: 40px 28px; padding: 56px 0 48px; } .foot-grid > * { min-width: 0; } .foot-brand .brand { display: inline-flex; padding: 0; } .foot-brand > p { margin: 16px 0 22px; max-width: 34ch; font-size: 15px; } .foot-trust { list-style: none; margin: 0 0 22px; padding: 0; display: grid; gap: 8px; } .foot-trust li { position: relative; padding-left: 22px; font-size: 14px; } .foot-trust li::before { content: ''; position: absolute; left: 0; top: 7px; width: 10px; height: 5px; border-left: 1.5px solid var(--accent); border-bottom: 1.5px solid var(--accent); transform: rotate(-45deg); } .foot-status { display: inline-flex; align-items: center; gap: 10px; padding: 9px 14px; border-radius: 999px; border: 1px solid var(--line); background: var(--glass); font-family: var(--mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; } .foot-status:hover { text-decoration: none; border-color: var(--accent); } .foot-status .dot { width: 8px; height: 8px; border-radius: 50%; animation: blink 1.8s ease-in-out infinite; } .foot-col h3 { margin-bottom: 14px; } .foot-col a { display: block; padding: 5px 0; font-size: 15px; transition: transform .2s, color .2s; } .foot-col a:hover { transform: translateX(4px); text-decoration: none; color: var(--accent); } .foot-base { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; padding-top: 22px; border-top: 1px solid var(--line); font-size: 13px; flex-wrap: wrap; } .foot-legal { display: flex; flex-wrap: wrap; gap: 4px 20px; font-family: var(--mono); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; } .foot-legal a:hover { color: var(--accent); text-decoration: none; } .foot-meta { display: grid; gap: 4px; text-align: right; max-width: 60ch; } .foot-mark { position: absolute; left: 50%; bottom: -0.22em; transform: translateX(-50%); font-size: clamp(120px, 20vw, 360px); font-weight: 700; letter-spacing: -.05em; line-height: 1; white-space: nowrap; color: transparent; -webkit-text-stroke: 1px var(--line); pointer-events: none; user-select: none; z-index: 0; } html:root .footer { background: rgba(243, 244, 246, 0.8); } html:root .foot-status .dot { background: #16A34A; box-shadow: 0 0 10px rgba(22, 163, 74, 0.5); } html:root .foot-col a:hover, html:root .foot-legal a:hover, html:root .foot-trust li::before { color: #0891B2; border-color: #0891B2; } @media (max-width: 1100px) { .foot-grid { grid-template-columns: 1fr 1fr 1fr; } .foot-brand { grid-column: 1 / -1; } } @media (max-width: 900px) { .foot-cta { flex-direction: column; align-items: flex-start; padding: 48px 0 40px; } .foot-meta { text-align: left; } .foot-base { flex-direction: column; } } @media (max-width: 640px) { .foot-grid { grid-template-columns: 1fr 1fr; gap: 32px 20px; padding: 40px 0 36px; } .footer { margin-top: 64px; } } .ad-wrap { margin: 32px auto; } @media (max-width: 1000px) { .hero-grid, .dark-grid, .split { grid-template-columns: 1fr; gap: 40px; } .row { grid-template-columns: 1fr; gap: 8px; } .row .more { text-align: left; } .price-grid { grid-template-columns: 1fr; } .price { border-right: 0; border-bottom: 1px solid var(--line); } .price:last-child { border-bottom: 0; } .section-dark .dark-grid { padding: 36px 28px; } } @media (max-width: 860px) { .nav-links { display: none; } .nav-right { display: none; } .nav-toggle { display: block; margin-left: 0; } .nav-open .nav-links { display: flex; flex-direction: column; gap: 4px; position: absolute; left: 0; right: 0; top: 70px; border-bottom: 1px solid var(--line); padding: 16px 24px 20px; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); } .nav-open .nav-links a { padding: 12px 12px; font-size: 17px; } .hero { padding: 56px 0 40px; } .cols-4, .cols-3 { grid-template-columns: 1fr 1fr; } .portal, .contact-grid, .cols-2, .form-2, .checks { grid-template-columns: 1fr; } .picker { flex-direction: column; align-items: stretch; border-radius: var(--radius); } .picker-label { padding: 6px 0 0 6px; } .filters { flex-direction: column; } .table.kv th { width: 120px; } .timeline .step { grid-template-columns: 1fr; gap: 6px; padding: 22px 20px; } .row { padding: 22px 20px; } .ledger li { grid-template-columns: 52px 1fr; gap: 6px 14px; } .ledger li .c { grid-column: 2; } .ledger li .x { grid-column: 2; } .ledger-head span:last-child { display: none; } body { overflow-x: hidden; } .section { padding: 56px 0; } .section-head { flex-direction: column; align-items: start; } .faq summary, .faq details p { padding-left: 18px; padding-right: 18px; } .form-panel { padding: 20px; } } @media (max-width: 520px) { .cols-4, .cols-3 { grid-template-columns: 1fr; } .btn-row .btn { width: 100%; } } @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } body::before { animation: none; } .flow .fd, .flow .fc .ring, .ticker-in, .ledger-head .dot-on, .hero-photo .glass-tag::before, .hero-fx .beam { animation: none; } .hero-fx .bloom { transition: none; } .flow .fp { display: none; } .js .reveal, .js .hero h1 .w { opacity: 1; transform: none; transition: none; animation: none; filter: none; } .btn, .btn:hover, .row, .row h4 a { transform: none; transition: none; } .ledger.anim li { clip-path: none; transform: none; transition: none; } } html:root { color-scheme: light; --bg: #F3F4F6; --bg2: #FFFFFF; --text: #0B0C12; --ink: #FFFFFF; --line: rgba(70, 95, 140, 0.14); --line2: rgba(70, 95, 140, 0.26); --glass: linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.62)); --glass2: rgba(255, 255, 255, 0.92); --glass3: #FFFFFF; --accent: #0284C7; --accent2: #6D5DFC; --accent3: #D6338F; --sky: #7DD3FC; --sky2: #60A5FA; --shadow: 0 30px 80px rgba(60, 90, 160, 0.14), 0 2px 6px rgba(60, 90, 160, 0.06), inset 0 1px 0 #fff, inset 0 0 0 1px rgba(255, 255, 255, 0.6); --shadow-s: 0 12px 34px rgba(60, 90, 160, 0.12), inset 0 1px 0 #fff; } html:root html, html:root { background: #F3F4F6; } html:root body::before { opacity: 1; background: radial-gradient(46% 40% at 8% 4%, rgba(125, 211, 252, 0.55), transparent 70%), radial-gradient(40% 36% at 92% 8%, rgba(196, 181, 253, 0.50), transparent 70%), radial-gradient(48% 40% at 74% 96%, rgba(186, 230, 253, 0.55), transparent 70%), radial-gradient(36% 32% at 16% 84%, rgba(221, 214, 254, 0.40), transparent 70%); } html:root .glass, html:root .ledger, html:root .picker, html:root .rows, html:root .table, html:root .price-grid, html:root .timeline, html:root .faq, html:root .search-card, html:root .form-panel, html:root .call-tab, html:root .numbers { border-color: rgba(255, 255, 255, 0.9); box-shadow: var(--shadow), 0 0 0 1px rgba(70, 95, 140, 0.10); } html:root .hero-photo { border-color: rgba(255, 255, 255, 0.9); box-shadow: var(--shadow), 0 0 0 1px rgba(70, 95, 140, 0.10); } html:root .btn { background: rgba(255, 255, 255, 0.85); border-color: rgba(255, 255, 255, 0.95); box-shadow: 0 8px 24px rgba(60, 90, 160, 0.10), 0 0 0 1px rgba(70, 95, 140, 0.12); } html:root .btn:hover { background: #fff; } html:root .eyebrow, html:root .foot-status { background: rgba(255, 255, 255, 0.8); border-color: rgba(255, 255, 255, 0.95); box-shadow: 0 0 0 1px rgba(70, 95, 140, 0.10), 0 6px 18px rgba(60, 90, 160, 0.08); } html:root .eyebrow::before, html:root .ticker-in span::before, html:root .hero-photo .glass-tag::before, html:root .call-title::before { background: linear-gradient(135deg, var(--sky), var(--sky2)); box-shadow: 0 0 10px rgba(96, 165, 250, 0.6); } html:root .ba .r.after .bar i, html:root .call-player .wave i.on { background: linear-gradient(90deg, var(--sky), var(--sky2)); } html:root .row:hover { background: rgba(255, 255, 255, 0.7); } html:root .ledger-head { background: rgba(255, 255, 255, 0.5); } html:root body::after { background-image: linear-gradient(rgba(11, 12, 18, 0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(11, 12, 18, 0.05) 1px, transparent 1px); } html:root .hero-fx { --beam: rgba(255, 255, 255, 0.85); } html:root .hero-fx .bloom { background: radial-gradient(30% 42% at 22% 34%, rgba(125, 211, 252, 0.50), transparent 68%), radial-gradient(34% 46% at 72% 16%, rgba(196, 181, 253, 0.46), transparent 70%), radial-gradient(30% 40% at 58% 96%, rgba(186, 230, 253, 0.44), transparent 72%); } html:root .hero-fx .grain { opacity: .28; mix-blend-mode: multiply; } html:root .nav { background: rgba(243, 244, 246, 0.7); } html:root .nav.scrolled { background: rgba(243, 244, 246, 0.92); box-shadow: 0 10px 40px rgba(20, 30, 60, 0.08); } html:root .nav-toggle span { background: var(--text); } html:root .nav-open .nav-links { background: rgba(243, 244, 246, 0.98); } html:root .brand-mark { background: linear-gradient(135deg, #0B0C12, #2a2d3f); box-shadow: 0 0 22px rgba(8, 145, 178, 0.25); } html:root .brand-mark::before, html:root .brand-mark::after { background: #fff; } html:root .btn { color: var(--text); } html:root .btn-primary, html:root .btn-light, html:root .section-dark .btn-light { background: #0B0C12; color: #fff; border-color: #0B0C12; box-shadow: 0 10px 30px rgba(11, 12, 18, 0.25); } html:root .btn-primary:hover, html:root .btn-light:hover { background: #0B0C12; } html:root .section-dark h2, html:root .section-dark p, html:root .section-dark a, html:root .section-dark h3, html:root .section-dark .lead { color: var(--text); } html:root .section-dark .dark-grid { background: linear-gradient(135deg, rgba(8, 145, 178, 0.12), rgba(109, 93, 252, 0.10) 50%, rgba(214, 51, 143, 0.08)); } html:root .dark-list, html:root .dark-list li { border-color: var(--line2); } html:root .section-dark .btn[style] { color: var(--text) !important; } html:root .flow .fl { stroke: rgba(11, 12, 18, 0.14); } html:root .flow .fd { stroke: rgba(11, 12, 18, 0.55); } html:root .flow .fn rect { fill: rgba(255, 255, 255, 0.85); } html:root .flow .fn text { fill: var(--text); } html:root .flow .fn.on rect { fill: rgba(8, 145, 178, 0.14); } html:root .flow .fc rect { fill: #0B0C12; } html:root .flow .fc .bar { fill: #fff; } html:root .ledger-head, html:root .table thead th { background: rgba(11, 12, 18, 0.03); } html:root .ticker { background: rgba(11, 12, 18, 0.03); } html:root .picker select, html:root select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%230B0C12' stroke-width='2.5'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); } html:root select option, html:root .picker select option { color: #0B0C12; background: #fff; } html:root input::placeholder, html:root textarea::placeholder { color: #0B0C12; opacity: .5; } html:root .footer { background: rgba(255, 255, 255, 0.55); } html:root .hero-photo .glass-tag { background: rgba(255, 255, 255, 0.72); color: var(--text); } html:root .app-nav { background: rgba(243, 244, 246, 0.85); } html:root .nav-open .nav-links { background: rgba(243, 244, 246, 0.98); } html:root .status-pill.booked { color: var(--accent); border-color: var(--accent); } html:root .appt { background: rgba(8, 145, 178, 0.14); border-color: rgba(8, 145, 178, 0.5); } html:root .msg.me { background: #0B0C12; color: #fff; } html:root .tool-result .big { background: linear-gradient(90deg, #0B0C12, var(--accent)); -webkit-background-clip: text; background-clip: text; } html:root .announce { background: rgba(8, 145, 178, 0.10); } .skip { position: absolute; left: -9999px; top: 8px; z-index: 100; padding: 10px 16px; border-radius: 999px; background: #fff; color: #0B0C12; font-weight: 600; } .skip:focus { left: 16px; } .consent { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 50; padding: 14px 18px; border-radius: 16px; background: var(--glass3); border: 1px solid var(--line2); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); display: flex; gap: 14px; align-items: center; justify-content: space-between; flex-wrap: wrap; font-size: 14px; box-shadow: var(--shadow); } html:root .picker select, html:root input[type=text], html:root input[type=search], html:root input[type=email], html:root input[type=number], html:root input[type=tel], html:root input[type=password], html:root input[type=date], html:root input[type=time], html:root input[type=datetime-local], html:root select, html:root textarea { color: var(--text); background-color: rgba(255, 255, 255, 0.85); } html:root .chat-quick button, html:root .nav-toggle { color: var(--text); } html:root .msg.ai { color: var(--text); } .call-section .wrap { display: grid; grid-template-columns: minmax(300px, 0.9fr) minmax(0, 1.3fr); gap: 56px; align-items: start; } .call-tabs { display: grid; gap: 10px; margin: 26px 0 22px; } .call-tab { text-align: left; font: inherit; color: inherit; cursor: pointer; padding: 16px 18px; border-radius: 16px; border: 1px solid var(--line); background: var(--glass); display: grid; grid-template-columns: 28px 1fr; gap: 14px; align-items: center; transition: background .2s, border-color .2s, transform .2s; } .call-tab:hover { background: var(--glass2); transform: translateX(4px); } .call-tab .n { font-family: var(--mono); font-size: 12px; color: var(--accent); } .call-tab b { display: block; font-weight: 600; } .call-tab span span { font-size: 14px; display: block; margin-top: 2px; } .call-player { position: relative; overflow: hidden; padding: 20px 22px 18px; } .call-player .call-title { font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .12em; margin-bottom: 14px; display: flex; align-items: center; gap: 10px; } .call-player .call-title::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 12px var(--accent); animation: blink 1.6s ease-in-out infinite; } .call-player .top { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; } .call-player .pp { width: 46px; height: 46px; border-radius: 50%; border: 0; background: #fff; color: var(--ink); display: none; place-items: center; cursor: pointer; flex: none; box-shadow: 0 0 0 1px rgba(255,255,255,.25), 0 8px 24px rgba(125, 240, 255, 0.25); transition: transform .15s; } .call-player .pp:hover { transform: scale(1.05); } .call-player.started .pp { display: grid; } .call-player .pp svg { width: 18px; height: 18px; } .call-player .pp .ico-pause, .call-player.playing .pp .ico-play { display: none; } .call-player.playing .pp .ico-pause { display: block; } .call-player .pill { flex: 1; display: flex; align-items: center; gap: 14px; height: 50px; border-radius: 999px; border: 1px solid var(--line); padding: 0 16px 0 18px; min-width: 0; } .call-player .wave { flex: 1; display: flex; align-items: center; gap: 3px; height: 34px; cursor: pointer; min-width: 0; position: relative; } .call-player .wave i { flex: 1; display: block; height: 30%; min-width: 2px; border-radius: 2px; transition: background .25s, box-shadow .25s; transform-origin: center; } .call-player.playing .wave i.live { animation: wavebar .6s ease-in-out infinite alternate; } .call-player.playing .wave i.live:nth-child(odd) { animation-duration: .45s; } @keyframes wavebar { from { transform: scaleY(.6); } to { transform: scaleY(1.4); } } .call-player .time { font-family: var(--mono); font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; } .call-player .time .cur { color: var(--accent); } .call-player .stage { position: relative; } .call-player .stage::before, .call-player .stage::after { content: ''; position: absolute; left: 0; right: 10px; height: 28px; z-index: 2; pointer-events: none; } .call-player .stage::before { top: 0; background: linear-gradient(var(--fade), transparent); } .call-player .stage::after { bottom: 0; background: linear-gradient(transparent, var(--fade)); } .call-player .lines { height: 360px; overflow: auto; padding: 0 8px 0 0; scroll-behavior: smooth; scrollbar-width: thin; scrollbar-color: var(--line2) transparent; } .call-player .line { margin: 0 0 6px; padding: 12px 16px; border-radius: 14px; border: 1px solid transparent; transition: background .3s, border-color .3s; } .call-player .line:first-child { margin-top: 20px; } .call-player .line:last-child { margin-bottom: 30px; } .call-player .line.on { border-color: var(--line); } .call-player .line small { display: flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: .12em; margin-bottom: 5px; } .call-player .line small i { width: 7px; height: 7px; border-radius: 50%; } .call-player .line.caller small i { box-shadow: 0 0 8px var(--accent3); } .call-player .line.caller { margin-left: 32px; } .call-player .line.agent { margin-right: 32px; } .call-player .line p { margin: 0; font-size: 16px; line-height: 1.5; } .call-player .bigplay { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 88px; height: 88px; border-radius: 50%; border: 0; background: #fff; color: var(--ink); display: grid; place-items: center; cursor: pointer; z-index: 3; box-shadow: 0 0 0 1px rgba(255,255,255,.3), 0 18px 50px rgba(125, 240, 255, 0.35); transition: transform .2s, opacity .3s; } .call-player .bigplay::after { content: ''; position: absolute; inset: -10px; border-radius: 50%; border: 1px solid var(--accent); animation: ring 2.4s ease-out infinite; } .call-player .bigplay svg { width: 34px; height: 34px; } .call-player .bigplay:hover { transform: translate(-50%, -50%) scale(1.06); } .call-player.started .bigplay { opacity: 0; pointer-events: none; } .call-player .foot { display: flex; justify-content: space-between; gap: 16px; align-items: center; margin-top: 10px; padding-top: 14px; border-top: 1px solid var(--line); font-size: 14px; flex-wrap: wrap; } .call-player .foot b { display: block; font-weight: 600; } html:root .call-player { --fade: rgba(255, 255, 255, 0.95); } html:root .call-player .pp, html:root .call-player .bigplay { background: #0B0C12; color: #fff; } html:root .call-player .pill { background: rgba(11, 12, 18, 0.04); } html:root .call-player .wave i { background: rgba(11, 12, 18, 0.18); } html:root .call-player .wave i.on { background: #0891B2; } html:root .call-player .wave i.live { box-shadow: 0 0 8px rgba(8, 145, 178, 0.5); } html:root .call-player .line.on { background: rgba(11, 12, 18, 0.04); } html:root .call-player .line small i { background: #0891B2; box-shadow: none; } html:root .call-player .line.caller small i { background: #C026D3; } html:root .call-tab.on { background: rgba(8, 145, 178, 0.10); border-color: #0891B2; } html:root .call-tab .n, html:root .call-player .time .cur { color: #155E75; } @media (max-width: 900px) { .call-section .wrap { grid-template-columns: 1fr; gap: 28px; } .call-player .lines { height: 300px; } .call-player .line.caller, .call-player .line.agent { margin-left: 0; margin-right: 0; } } .numbers { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; overflow: hidden; } .numbers > div { padding: 28px 28px 24px; border-right: 1px solid var(--line); } .numbers > div:last-child { border-right: 0; } .numbers .big { font-size: clamp(40px, 4vw, 64px); font-weight: 600; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; } .numbers .lbl { font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .12em; margin-top: 12px; color: var(--accent); } .numbers .lbl + p { margin: 6px 0 0; font-size: 14px; } .ba-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: start; margin-top: 24px; } .ba { padding: 22px 26px; border-bottom: 1px solid var(--line); } .ba:last-child { border-bottom: 0; } .ba h4 { margin: 0 0 14px; } .ba .r { display: grid; grid-template-columns: 64px 1fr 70px; gap: 14px; align-items: center; font-size: 14px; margin-bottom: 8px; } .ba .r .k { font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: .12em; } .ba .r .v { font-family: var(--mono); font-size: 13px; text-align: right; font-variant-numeric: tabular-nums; } .ba .bar { height: 10px; border-radius: 999px; background: var(--glass2); border: 1px solid var(--line); overflow: hidden; } .ba .bar i { display: block; height: 100%; width: 0; border-radius: 999px; background: var(--line2); transition: width 1.4s cubic-bezier(.2,.7,.2,1); } .ba .r.after .bar i { transition-delay: .3s; } .ba .r.after .v { color: var(--accent); } .ba.go .bar i { width: var(--w); } html:root .numbers .lbl, html:root .ba .r.after .v { color: #0891B2; } html:root .ba .r.after .bar i { background: #0891B2; box-shadow: none; } @media (max-width: 900px) { .numbers { grid-template-columns: 1fr 1fr; } .numbers > div:nth-child(2) { border-right: 0; } .numbers > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); } .ba-grid { grid-template-columns: 1fr; gap: 16px; } } .route-wrap { max-width: 860px; margin: 0 auto; padding: 24px; } .flow .fn.warm rect { stroke: var(--accent3); } .flow .fp.warm { fill: var(--accent3); filter: drop-shadow(0 0 6px var(--accent3)); } .flow .fd.warm { stroke: var(--accent3); } .flow .lbl { font-family: var(--mono); font-size: 10px; letter-spacing: .12em; text-anchor: middle; text-transform: uppercase; } html:root .flow .lbl { fill: var(--text); } .bento { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; } .bento > a { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 250px; padding: 26px; border-radius: var(--radius); background: var(--glass); border: 1px solid var(--line); overflow: hidden; color: inherit; transition: transform .25s, box-shadow .25s; } .bento > a:hover { text-decoration: none; transform: translateY(-4px); box-shadow: var(--shadow); } .bento > a.wide { grid-column: span 2; } .bento .num { position: absolute; left: 26px; top: 22px; font-family: var(--mono); font-size: 12px; letter-spacing: .14em; color: var(--accent); } .bento .pic { position: absolute; inset: 0; z-index: 0; } .bento .pic img { width: 100%; height: 100%; object-fit: cover; display: block; } .bento .pic::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(7, 8, 13, 0.05) 30%, rgba(7, 8, 13, 0.82)); } .bento .txt { position: relative; z-index: 1; } .bento h4 { margin: 0 0 8px; font-size: 22px; letter-spacing: -.02em; } .bento p { margin: 0; font-size: 15px; max-width: 46ch; } .bento .go { display: inline-block; margin-top: 14px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--accent); } .bento > a.has-pic, .bento > a.has-pic h4, .bento > a.has-pic p, .bento > a.has-pic .go { color: #fff; } .bento > a.has-pic .num { color: #fff; } .bento > a.has-pic .go { text-decoration-color: #fff; } .bento > a.full { grid-column: 1 / -1; min-height: 0; flex-direction: row; align-items: center; gap: 28px; padding: 24px 26px 24px 70px; } .bento > a.full .txt { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; width: 100%; } .bento > a.full h4 { margin: 0; flex: none; min-width: 180px; } .bento > a.full p { flex: 1; max-width: none; } .bento > a.full .go { margin: 0; flex: none; } .bento > a.full .num { top: 50%; transform: translateY(-50%); } @media (max-width: 640px) { .bento > a.full { padding: 26px; } .bento > a.full .num { top: 22px; transform: none; } .bento > a.full .txt { display: block; } .bento > a.full h4 { margin-bottom: 8px; } .bento > a.full .go { display: inline-block; margin-top: 14px; } } html:root .bento > a { border-color: rgba(255, 255, 255, 0.9); box-shadow: var(--shadow-s), 0 0 0 1px rgba(70, 95, 140, 0.10); } @media (max-width: 1100px) { .bento { grid-template-columns: repeat(2, 1fr); } .bento > a.wide { grid-column: span 2; } } @media (max-width: 640px) { .bento { grid-template-columns: 1fr; } .bento > a, .bento > a.wide { grid-column: span 1; min-height: 200px; } } .dir { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; align-items: stretch; } .dir-col { display: flex; flex-direction: column; padding: 8px 0 10px; } .dir-head { padding: 22px 24px 14px; border-bottom: 1px solid var(--line); margin-bottom: 6px; } .dir-head h3 { margin: 0 0 8px; } .dir-head p { margin: 0; font-size: 14px; } .dir-col > a { display: block; padding: 11px 24px; border-radius: 0; transition: background .2s; } .dir-col > a:hover { text-decoration: none; } .dir-col > a b { display: block; font-weight: 600; font-size: 15px; transition: transform .2s, color .2s; } .dir-col > a:hover b { transform: translateX(4px); color: var(--accent); } .dir-col > a span { display: block; font-size: 13px; line-height: 1.45; margin-top: 2px; } .dir-col > a.dir-more { margin-top: auto; padding-top: 16px; font-weight: 600; font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .12em; color: var(--accent); border-top: 1px solid var(--line); } .dir-col > a.dir-more::after { content: ' \2192'; } html:root .dir-col > a:hover { background: rgba(255, 255, 255, 0.75); } @media (max-width: 1100px) { .dir { grid-template-columns: 1fr 1fr; } } @media (max-width: 640px) { .dir { grid-template-columns: 1fr; } } .page-hero { padding: 72px 0 56px; } .page-hero .crumbs { margin-bottom: 26px; } .page-hero h1 { max-width: 14ch; } .page-hero .hero-visual { align-self: center; } .flow-card { padding: 28px 24px; } .flow-card .flow { filter: none; } .bundles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; } .bundle { display: flex; flex-direction: column; padding: 28px; color: inherit; transition: transform .25s, box-shadow .25s; } .bundle:hover { text-decoration: none; transform: translateY(-4px); box-shadow: var(--shadow); } .bundle h3 { margin-bottom: 10px; } .bundle .price { margin: 0 0 18px; font-size: 15px; } .bundle .price span { font-weight: 600; } .bundle ul { list-style: none; margin: 0 0 22px; padding: 0; display: grid; gap: 8px; } .bundle li { position: relative; padding-left: 22px; font-size: 15px; } .bundle li::before { content: ''; position: absolute; left: 0; top: 8px; width: 10px; height: 5px; border-left: 1.5px solid var(--accent); border-bottom: 1.5px solid var(--accent); transform: rotate(-45deg); } .bundle .go { margin-top: auto; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--accent); } @media (max-width: 900px) { .bundles { grid-template-columns: 1fr; } .page-hero { padding: 48px 0 40px; } } .receipt { padding: 22px 24px; } .receipt-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-bottom: 14px; margin-bottom: 6px; border-bottom: 1px solid var(--line); font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: .12em; } .receipt-head .dot { margin-right: 8px; } .receipt-row { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 15px; } .receipt-row .mono { font-variant-numeric: tabular-nums; } .receipt-row.total { font-weight: 600; font-size: 17px; } .receipt-row.total .mono { color: var(--accent); } .receipt-row:last-of-type { border-bottom: 0; } .receipt-note { margin: 12px 0 0; font-size: 13px; } .search-pick input { flex: 1; height: 46px; border: 1px solid var(--line); border-radius: 999px; padding: 0 18px; font: inherit; color: inherit; background: var(--glass2); min-width: 0; } .numbers.two { grid-template-columns: 1fr 1fr; } .numbers.two > div:nth-child(2) { border-right: 0; } .numbers.two > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); } .numbers .big small { font-size: 18px; font-weight: 500; letter-spacing: 0; } .price-grid.four { grid-template-columns: repeat(4, 1fr); } @media (max-width: 1100px) { .price-grid.four { grid-template-columns: 1fr 1fr; } .price-grid.four .price:nth-child(2) { border-right: 0; } .price-grid.four .price:nth-child(-n+2) { border-bottom: 1px solid var(--line); } } @media (max-width: 640px) { .price-grid.four { grid-template-columns: 1fr; } .price-grid.four .price { border-right: 0; border-bottom: 1px solid var(--line); } .numbers.two { grid-template-columns: 1fr; } } .faq-grid { display: grid; grid-template-columns: minmax(240px, 1fr) minmax(0, 2fr); gap: 48px; align-items: start; } .faq-grid .faq { margin: 0; } .faq-side h2 { margin-bottom: 12px; } .faq-side p { margin: 0 0 22px; max-width: 34ch; } @media (max-width: 900px) { .faq-grid { grid-template-columns: 1fr; gap: 24px; } } @media (max-width: 860px) { .page-hero { padding: 40px 0 32px; } .page-hero h1 { max-width: none; } .hero h1 { font-size: clamp(34px, 9vw, 48px); } .receipt-row { font-size: 14px; } .receipt-row.total { font-size: 16px; } .foot-mark { font-size: clamp(80px, 28vw, 160px); } .numbers > div { padding: 22px 20px 20px; } .dir-col > a { padding: 10px 20px; } .call-player { padding: 16px; } .call-player .line p { font-size: 15px; } .route-wrap, .flow-wrap { padding: 8px 0; } .search-pick input { height: 46px; } } .page-hero.text h1 { font-size: clamp(32px, 3.4vw, 58px); max-width: 22ch; } .page-hero.text .lead { max-width: 64ch; } .page-hero .crumbs { margin-bottom: 22px; } html body :is(input:not([type]),input[type=text],input[type=email],input[type=password],input[type=search],input[type=tel],input[type=url],input[type=number],input[type=date],input[type=time],input[type=datetime-local],textarea,select) {background-color:#fcf8f2!important;border:1px solid #9b8874!important;color:#18181b!important;box-shadow:inset 0 1px 2px #392d2108!important} html body :is(input,textarea)::placeholder {color:#514437!important;opacity:1} html body :is(input:not([type]),input[type=text],input[type=email],input[type=password],input[type=search],input[type=tel],input[type=url],input[type=number],input[type=date],input[type=time],input[type=datetime-local],textarea,select):focus {background-color:#fff!important;border-color:#c64110!important;outline:2px solid #c64110;outline-offset:2px;box-shadow:none!important} html body :is(input,textarea,select):disabled {cursor:not-allowed;opacity:.65} html body h3.h4-look{font-size:20px;font-weight:600;letter-spacing:-0.015em;text-transform:none;font-family:var(--display);color:var(--text);margin:0 0 .5em;line-height:1.1}
/* refine.css */
:root {--radius:18px;--radius-s:10px;--shadow:0 14px 45px #00000014;--shadow-s:0 4px 18px #0000000c} html:root {--bg:#fff;--bg2:#f5f7f7;--text:#101416;--ink:#fff;--line:#dce3e3;--line2:#c6d1d1;--glass:#fff;--glass2:#f3f7f7;--glass3:#e7eeee;--accent:#101416;--shadow:0 14px 45px #102c2c0a;--shadow-s:0 4px 18px #102c2c08;background:#fff} body::before,body::after,.hero-fx,.hero-visual::before {display:none} h1,h2,h3,h4 {text-wrap:balance}p {text-wrap:pretty}h3 {font-family:var(--font);font-size:17px;text-transform:none;letter-spacing:-.015em;color:var(--text)} .wrap {max-width:1440px;padding-inline:clamp(22px,4.5vw,72px)} .section {padding-block:100px}.section+.section {padding-top:55px}.section-head {gap:60px;align-items:start;margin-bottom:42px}.section-head h2 {max-width:22ch;font-size:clamp(30px,3.5vw,50px)}.section-head p {max-width:48ch;padding-top:7px} .nav,.nav.scrolled {box-shadow:none;backdrop-filter:blur(16px)} html:root .nav,html:root .nav.scrolled {background:#ffffffed;border-color:var(--line)} .nav>.wrap {max-width:1600px;margin:auto;padding-inline:clamp(22px,4vw,64px)}.nav-in {height:88px;gap:34px}.nav-links {justify-content:center}.nav-links a {font-size:14px;padding:10px}.brand {font-size:24px;white-space:nowrap}.brand-mark { width: 34px; height: 34px; border-radius: 11px; }.brand-mark::before {left:10px;top:8px;height:17px;background:#101416}.brand-mark::after {left:19px;top:14px;height:11px;background:#101416} html:root .brand-mark {background:#101416;box-shadow:none}.nav-right .btn {height:42px;padding-inline:20px}.nav-right>.btn:first-child {background:none;border-color:transparent} .btn,html:root .btn {box-shadow:none;backdrop-filter:none;border-radius:9px;border:1px solid var(--line2);font-weight:500;background:var(--bg2);color:var(--text);gap:24px;transition:background .2s,transform .2s}.btn:hover,html:root .btn:hover {box-shadow:none;background:var(--glass3);transform:translateY(-2px)} .btn-primary,html:root .btn-primary {background:var(--text);color:var(--bg);border-color:var(--text)}.btn-primary:hover,html:root .btn-primary:hover {background:#263b3b;color:#fff;border-color:#263b3b} .eyebrow,html:root .eyebrow {padding:0;background:none;border:0;box-shadow:none;backdrop-filter:none;font-family:var(--font);font-size:14px;text-transform:none;letter-spacing:0;margin-bottom:24px;gap:9px}.eyebrow::before,html:root .eyebrow::before {width:7px;height:7px;background:#149488;box-shadow:0 0 0 4px #60d5c926} .hero.office-hero {padding:64px 0 68px;overflow:visible}.hero.office-hero>.hero-grid {max-width:1600px;margin:auto;padding-inline:clamp(22px,4vw,64px);grid-template-columns:minmax(0,1fr) minmax(0,.92fr);gap:clamp(36px,5vw,92px)} .office-hero h1 {font-size:clamp(42px,4.8vw,76px);line-height:1.035;letter-spacing:-.038em;max-width:12.7ch;font-weight:500;margin-bottom:24px}.hero-resolution {display:block}.office-hero .lead {font-size:18px;max-width:42ch;line-height:1.6;margin-bottom:28px}.hero-actions {display:flex;align-items:center;gap:26px;flex-wrap:wrap;margin-bottom:34px}.hero-actions .btn {height:54px;padding-inline:23px}.hero-listen {display:inline-flex;align-items:center;gap:10px;font-size:14px}.hero-listen>span {width:30px;height:30px;border:1px solid var(--line2);display:grid;place-items:center;border-radius:50%;font-size:10px} .office-hero .picker,html:root .office-hero .picker {padding:0;box-shadow:none;background:none;border:0;backdrop-filter:none;border-radius:0;max-width:430px;gap:10px}.office-hero .picker-label {padding:0;font-size:14px}.office-hero .picker select {height:42px;border-radius:8px;font-size:14px;background-color:var(--bg2);border:1px solid var(--line)}.office-hero .picker .btn {height:42px;padding-inline:18px;background:transparent;color:var(--text);border-color:var(--line2)}.office-hero .hero-note {font-size:12px;max-width:52ch;line-height:1.7;margin:14px 0 0} .office-scene {border:1px solid var(--line);border-radius:22px;background:var(--bg2);gap:0;overflow:hidden;box-shadow:0 24px 64px #15282812;isolation:isolate}.scene-top {display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 23px;font-size:11px}.scene-top>span:first-child {display:flex;align-items:center;gap:8px;font-weight:600}.scene-top i {width:7px;height:7px;border-radius:50%;background:#138579}.scene-photo {position:relative;margin:0 12px;border-radius:12px;overflow:hidden}.scene-photo picture {display:block}.scene-photo img {display:block;width:100%;height:clamp(260px,23vw,360px);object-fit:cover;object-position:48% 45%}.scene-caption {position:absolute;bottom:16px;left:16px;right:16px;display:flex;align-items:center;gap:13px;padding:15px;background:#fff;border-radius:12px;color:#101416;box-shadow:0 8px 28px #0000001c}.scene-caption div>span {font-size:11px}.scene-caption p {font-size:13px;margin:1px 0 0;font-weight:500}.scene-call-icon {display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#bcf4dd;font-size:23px;flex:none}.scene-wave {display:flex;align-items:center;gap:3px;height:25px;margin-left:auto}.scene-wave i {display:block;width:3px;height:9px;background:#101416;border-radius:3px;animation:office-wave 1.2s ease-in-out infinite alternate}.scene-wave i:nth-child(2n) {height:22px;animation-delay:.2s}.scene-wave i:nth-child(3n) {height:15px;animation-delay:.4s}@keyframes office-wave {to{transform:scaleY(.35)}} .scene-process {padding:23px}.scene-process-head {display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:15px;font-weight:500}.scene-pause {font:inherit;font-size:11px;background:transparent;border:1px solid var(--line2);border-radius:6px;color:var(--text);padding:7px 10px;cursor:pointer}.scene-steps {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:20px 0 15px;position:relative}.scene-steps::before {content:'';height:1px;position:absolute;background:var(--line2);top:21px;left:16%;right:16%;z-index:-1}.scene-steps button {display:flex;flex-direction:column;align-items:center;gap:8px;font:inherit;font-size:12px;background:none;color:var(--text);border:0;cursor:pointer;padding:0}.step-icon {width:43px;height:43px;border:1px solid var(--line2);border-radius:13px;background:var(--bg);display:grid;place-items:center;font-size:20px;transition:background .3s,transform .3s}.scene-steps button[aria-pressed="true"] .step-icon {background:#aaf4ee;color:#101416;border-color:#78cfc7;transform:translateY(-2px)}.scene-detail {font-size:12px;line-height:1.6;min-height:3.2em;max-width:44ch;margin:0 0 12px}.scene-link {display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:14px;font-size:12px}.scene-still .scene-wave i {animation:none} .ticker,html:root .ticker {background:var(--bg2);padding:22px 0;border-color:var(--line);backdrop-filter:none}.ticker-in {font-family:var(--font);font-size:15px;font-weight:500;letter-spacing:0;text-transform:none;gap:50px;animation-duration:90s}.ticker-in span::before,html:root .ticker-in span::before {background:var(--line2);box-shadow:none;width:4px;height:4px} .glass,.ledger,.rows,.table,.price-grid,.timeline,.faq,.search-card,.form-panel,.call-tab,.numbers,html:root :is(.glass,.ledger,.rows,.table,.price-grid,.timeline,.faq,.search-card,.form-panel,.call-tab,.numbers) {background:var(--bg);border-color:var(--line);box-shadow:none;backdrop-filter:none} .call-section {background:var(--bg2);padding-block:90px}.call-section .wrap {gap:clamp(32px,5vw,90px)}.call-section h2 {font-size:clamp(34px,4vw,55px);max-width:13ch}.call-section .eyebrow {margin-bottom:20px}.call-tabs {gap:0}.call-tab,html:root .call-tab {border-radius:0;border:0;border-bottom:1px solid var(--line);background:transparent;padding:19px 4px}.call-tab.on,html:root .call-tab.on {background:var(--bg);border-color:var(--line);border-radius:10px;padding-inline:16px}.call-tab .n,html:root .call-tab .n {color:var(--text)}.call-player {padding:26px;border-radius:18px}.call-player .bigplay,html:root .call-player .bigplay {box-shadow:0 8px 28px #0000001a}.call-player .bigplay::after {border-color:#149488}.call-player .wave i {min-width:0}.call-player .call-title {font-family:var(--font);text-transform:none;letter-spacing:0}.call-player .line small {font-family:var(--font);text-transform:none;letter-spacing:0}.call-player .line {opacity:1}.call-player .line.on {background:var(--bg2)} .flow-wrap,.route-wrap {max-width:1020px;margin:auto}.flow {filter:none}.dir-section {border-top:1px solid var(--line);padding-top:90px!important}.dir {gap:0}.dir-col,html:root .dir-col {border:0;border-radius:0;box-shadow:none;border-right:1px solid var(--line);padding:0 15px}.dir-col:first-child {padding-left:0}.dir-col:last-child {border-right:0}.dir-head {padding:0 12px 20px}.dir-head h3 {font-size:22px}.dir-col>a {padding:11px 12px}.dir-col>a.dir-more {font-family:var(--font);font-size:13px;letter-spacing:0;text-transform:none;color:var(--text)} .bento>a,html:root .bento>a {box-shadow:none;border:1px solid var(--line);background:var(--bg2);border-radius:14px}.bento>a:hover {box-shadow:none;transform:translateY(-3px)}.bento .num {color:var(--text)}.bento .go {font-size:13px}.bento .pic::after {background:linear-gradient(180deg,#07080d00 0%,#07080de8 100%)} .sample-ledger {margin-bottom:24px}.sample-ledger .ledger {border-radius:14px}.sample-ledger .ledger ol {display:grid;grid-template-columns:1fr 1fr}.sample-ledger .ledger li {opacity:1;transform:none;border-bottom:1px solid var(--line);padding:14px 20px}.numbers .lbl,html:root .numbers .lbl {font-family:var(--font);color:var(--text);font-size:13px;letter-spacing:0;text-transform:none}.numbers .big {font-size:48px}.ba-grid>.glass {padding:25px}.row {padding-block:26px}.rows {border-radius:0;border-inline:0}.timeline {border-radius:0;border-inline:0;background:none}.step .when {font-family:var(--font);letter-spacing:0;text-transform:none}.footer,html:root .footer {background:var(--bg2);backdrop-filter:none}.footer::before {display:none}.foot-col h3 {font-size:15px}.foot-col a {font-size:13px;padding:6px 0}.foot-status {font-family:var(--font);text-transform:none;letter-spacing:0}.foot-legal {font-family:var(--font);text-transform:none;letter-spacing:0}.foot-mark {display:none} .page-hero {padding-top:62px}.page-hero h1 {font-size:clamp(36px,4.3vw,64px)}.page-hero .hero-photo {box-shadow:none;border-radius:18px}.page-hero .hero-grid {gap:50px}.page-hero .flow-card {background:var(--bg2);border-color:var(--line)} html:root :is(input,textarea)::placeholder {color:#101416;opacity:1}.tool-result .big,html:root .tool-result .big {background:none;-webkit-text-fill-color:var(--text);color:var(--text)} .js .reveal,.js .reveal.in {opacity:1;transform:none}.hero h1 .w {animation:none;opacity:1;transform:none}a,button,input,select,textarea,summary {touch-action:manipulation}:focus-visible {outline:2px solid #108477;outline-offset:5px}section[id] {scroll-margin-top:105px} @media(min-width:1600px) {.office-hero h1 {font-size:80px}.scene-photo img {height:370px}} @media(max-width:1200px) {.nav-in {gap:18px}.nav-links a {padding-inline:7px}.nav-right>.btn:first-child {display:none}.nav-right .btn {padding-inline:13px}.office-hero h1 {font-size:clamp(43px,5.1vw,62px)}.hero-actions {gap:15px}.section-head {gap:30px}.scene-process {padding:18px}.scene-top {padding:16px;font-size:10px}.scene-caption {left:10px;right:10px;padding:12px}.scene-wave {display:none}.scene-photo img {height:280px}} @media(max-width:1000px) {.nav-in {height:74px}.nav-links {display:none}.nav-toggle {display:block}.nav-toggle {margin-left:0}.nav-right {display:none}.nav-open .nav-links {display:flex;position:absolute;top:74px;left:0;right:0;flex-direction:column;padding:18px 24px;border-bottom:1px solid var(--line);background:var(--bg)}.nav-links a {padding:12px}.nav-open .nav-mobile-only:not([hidden]) {display:block}.hero.office-hero>.hero-grid {grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:30px}.office-hero h1 {font-size:48px}.hero-actions {align-items:flex-start;flex-direction:column;gap:15px}.office-hero .picker {flex-wrap:wrap}.office-hero .picker select {min-width:130px}.office-hero .picker-label {flex:none}.scene-caption p {font-size:12px}.scene-call-icon {width:32px;height:32px}.call-section .wrap {grid-template-columns:1fr}.call-section h2 {max-width:none}.section-head {flex-direction:column;gap:14px}.section-head h2 {max-width:26ch;margin-bottom:0}.dir {grid-template-columns:1fr 1fr;gap:32px 0}.dir-col:nth-child(2) {border:0}.dir-col:nth-child(3) {padding-left:0}.foot-grid {gap:28px}} @media(max-width:720px) {.hero.office-hero {padding:38px 0 40px}.hero.office-hero>.hero-grid {grid-template-columns:minmax(0,1fr);gap:32px}.office-hero h1 {font-size:clamp(41px,8vw,60px);max-width:14ch}.office-hero .lead {font-size:16px;max-width:46ch}.hero-actions {flex-direction:row;align-items:center;gap:20px;margin-bottom:26px}.hero-actions .btn {height:48px;padding-inline:16px;font-size:14px}.hero-listen {font-size:12px}.office-hero .picker {max-width:100%}.scene-photo img {height:290px}.scene-top {font-size:11px}.scene-process {padding:20px}.scene-detail {min-height:3.2em;max-width:none}.scene-steps {margin-block:18px}.scene-caption p {font-size:13px}.scene-wave {display:flex}.section {padding-block:64px}.section+.section {padding-top:36px}.call-section {padding-block:52px}.call-player {padding:17px}.section-head {margin-bottom:26px}.section-head h2 {font-size:33px}.section-head p {font-size:15px}.sample-ledger .ledger ol {grid-template-columns:1fr}.sample-ledger .ledger li {padding:12px}.numbers .big {font-size:40px}.dir-section {padding-top:50px!important}.dir {grid-template-columns:1fr}.dir-col,.dir-col:first-child,.dir-col:nth-child(3) {padding:0;border:0}.dir-head {padding-inline:0}.dir-col>a {padding-inline:0}.page-hero .hero-grid {grid-template-columns:1fr}.page-hero h1 {max-width:none}.page-hero {padding-top:38px}.foot-cta {gap:20px}.foot-cta .btn-row {flex-wrap:wrap}.scene-process-head {font-size:14px}} @media(prefers-reduced-motion:reduce) {html {scroll-behavior:auto}*,*::before,*::after {animation:none!important;transition:none!important}.ticker-in {transform:none;max-width:100%;width:auto;flex-wrap:wrap;gap:16px 25px;padding-inline:22px;justify-content:center}.ticker-in span:nth-child(n+21) {display:none}.flow .fp {display:none}} html:root .brand-mark::before,html:root .brand-mark::after {background:#fff}
/* luxury.css */
.office-hero{perspective:1600px} .office-hero h1{animation:office-arrive 1.15s cubic-bezier(.16,1,.3,1) both} .office-hero .eyebrow,.office-hero .lead,.office-hero .hero-actions{animation:office-arrive 1.3s cubic-bezier(.16,1,.3,1) both} @keyframes office-arrive{from{transform:translateY(24px);filter:blur(2px)}to{transform:translateY(0);filter:blur(0)}} .office-scene{transform:translate3d(0,var(--scene-y,0px),0) rotateX(var(--scene-rx,0deg)) rotateY(var(--scene-ry,0deg));transition:transform .7s cubic-bezier(.2,.7,.2,1);transform-style:preserve-3d} .scene-photo img{transform:translate3d(0,var(--photo-y,0px),0) scale(1.12);transform-origin:50% 45%;transition:transform .15s linear} .scene-caption{transition:transform .6s cubic-bezier(.2,.7,.2,1);transform:translate3d(0,var(--caption-y,0px),16px)} .office-hero .hero-actions .btn{position:relative;overflow:hidden}.office-hero .hero-actions .btn::after{content:'';position:absolute;inset:-100% auto -100% -70%;width:35%;background:linear-gradient(90deg,transparent,#ffffff2b,transparent);transform:rotate(24deg);transition:left .65s}.office-hero .hero-actions .btn:hover::after{left:140%}.hero-actions .btn>span{transition:transform .3s}.hero-actions .btn:hover>span{transform:translate(3px,-3px)} .office-journey{padding:58px 0 38px;position:relative;background:var(--bg)} .journey-heading{padding-bottom:24px}.journey-heading h2{font-size:clamp(38px,4.5vw,68px);line-height:1.07;letter-spacing:-.035em;font-weight:500;max-width:20ch}.journey-heading>p{font-size:17px;max-width:50ch;margin:22px 0 0} .journey-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.85fr);gap:clamp(42px,7vw,110px);align-items:start;position:relative} .journey-stage{border:1px solid var(--line);background:var(--bg2);border-radius:24px;box-shadow:0 30px 65px #18262610;overflow:hidden;position:relative} .journey-stage-top{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:22px 24px;border-bottom:1px solid var(--line)}.journey-stage-top>.brand{font-size:19px}.journey-stage-top>.brand .brand-mark{transform:scale(.8);margin-right:-5px}.journey-stage-top>span:last-child{font-size:11px} .journey-display{border-bottom:1px solid var(--line)}.journey-photo{height:190px;overflow:hidden;margin:12px 12px 0;border-radius:12px}.journey-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 45%;transform:scale(1.05)} .journey-screen-content{padding:26px}.journey-signal{display:flex;align-items:center;gap:8px;font-size:12px}.signal-dot{display:inline-block;width:7px;height:7px;background:#168579;border-radius:50%;box-shadow:0 0 0 5px #16857912}.journey-quote{font-size:clamp(21px,2.2vw,30px);letter-spacing:-.02em;line-height:1.3;margin:18px 0 22px;max-width:22ch}.journey-small{font-size:12px;line-height:1.7;margin:16px 0 0;display:block} .journey-audio{display:flex;gap:4px;align-items:center;height:46px}.journey-audio i{display:block;flex:1;max-width:5px;height:var(--bar);background:#168579;border-radius:3px;animation:journey-voice 1.3s ease-in-out var(--delay) infinite alternate}@keyframes journey-voice{to{transform:scaleY(.45)}} .journey-screen-title{font-size:clamp(26px,3vw,40px);font-family:var(--display);letter-spacing:-.025em;line-height:1.15;margin:28px 0}.calendar-scene{padding-top:40px}.journey-calendar{display:flex;gap:24px;margin:30px 0 34px}.calendar-day{font-size:11px;text-align:center;padding-top:9px}.calendar-day>span{display:block;font-size:35px;line-height:1.4}.calendar-times{flex:1;font-size:11px}.calendar-times>div{display:flex;gap:15px;min-height:53px;align-items:start;padding-top:9px}.calendar-times>div>span{flex:1;border-top:1px solid var(--line);padding-top:8px}.calendar-times .calendar-booked>span{background:#c9f2eb;border:1px solid #a2d6ca;border-radius:8px;color:#101416;padding:14px 12px;margin-top:-4px;font-size:13px}.calendar-booked small{display:block;font-size:10px;margin-top:4px}.confirmation-scene{padding-top:38px;text-align:center}.confirmation-scene>.journey-signal{justify-content:center}.confirmation-ring{width:100px;height:100px;border:1px solid #7dcec0;border-radius:50%;margin:0 auto 24px;display:grid;place-items:center;box-shadow:0 0 0 12px #16857909,0 0 0 24px #16857905}.confirmation-ring>span{display:grid;place-items:center;width:68px;height:68px;border-radius:50%;background:#c9f2eb;font-size:32px;color:#101416}.confirmation-scene .journey-screen-title{margin:22px 0}.journey-receipt{display:grid;grid-template-columns:auto auto;text-align:left;gap:0;font-size:12px;margin:26px 0}.journey-receipt>span{padding:13px 0;border-bottom:1px solid var(--line)}.journey-receipt>span:nth-child(2n){text-align:right} .journey-controls{display:none;gap:6px;padding:15px 18px;border-top:1px solid var(--line)}.journey-controls button{flex:1;padding:10px 5px;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--text);font:inherit;font-size:12px;cursor:pointer;transition:background .3s,border-color .3s}.journey-controls button[aria-pressed=true]{background:var(--bg);border-color:var(--line2)} .journey-chapter{padding:26px 0;scroll-margin-top:140px}.chapter-symbol{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--line2);border-radius:50%;font-size:20px;margin-bottom:27px}.journey-chapter h3{font-family:var(--display);font-size:clamp(30px,3vw,46px);letter-spacing:-.03em;line-height:1.1;font-weight:500;max-width:17ch;margin-bottom:23px}.journey-chapter>p{font-size:16px;line-height:1.7;max-width:38ch}.journey-chapter>a{display:inline-flex;gap:25px;align-items:center;font-size:13px;border-bottom:1px solid var(--line2);padding-bottom:9px;margin-top:10px}.journey-chapter>a span{transition:transform .25s}.journey-chapter>a:hover span{transform:translate(3px,-3px)} .journey-ready .journey-controls{display:flex}.journey-ready .journey-displays{position:relative;min-height:470px}.journey-ready .journey-display{position:absolute;inset:0;border:0;visibility:hidden;opacity:0;transform:translateY(12px);transition:opacity .45s,transform .6s cubic-bezier(.2,.7,.2,1),visibility .45s}.journey-ready .journey-display.is-active{visibility:visible;opacity:1;transform:none}.journey-ready .journey-stage{position:sticky;top:114px}.journey-ready .journey-chapter{min-height:0;display:flex;flex-direction:column;justify-content:flex-start}.journey-ready .journey-chapter>a{align-self:start}.journey-ready .journey-chapter:last-child{min-height:0}.journey-ready .journey-display:not(.is-active) .journey-audio i{animation-play-state:paused} .office-journey .journey-chapter.is-current .chapter-symbol{background:#c9f2eb;color:#101416;border-color:#9fd8cc;transition:background .4s} @media(hover:hover) and (prefers-reduced-motion:no-preference){.bento .pic img{transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}.bento>a:hover .pic img{transform:scale(1.055)}.bento>a{transition:border-color .3s,transform .3s}.bento>a:hover{border-color:#78b9ad}} @media(max-width:1000px){.journey-grid{gap:35px}.journey-stage-top{padding:16px}.journey-stage-top>span:last-child{font-size:10px}.journey-stage-top>.brand{font-size:17px}.journey-screen-content{padding:22px}.journey-photo{height:165px}.journey-ready .journey-stage{top:94px}.journey-ready .journey-displays{min-height:440px}.journey-quote{font-size:24px}.journey-calendar{gap:14px}.journey-chapter h3{font-size:34px}.journey-chapter>p{font-size:15px}} @media(max-width:760px),(max-height:849px){.office-journey{padding:64px 0 35px}.journey-heading{padding-bottom:24px}.journey-grid{grid-template-columns:1fr;gap:25px}.journey-ready .journey-stage{position:relative;top:auto;max-width:580px;width:100%;margin:auto}.journey-ready .journey-chapter,.journey-ready .journey-chapter:last-child{min-height:0;padding:27px 0;border-bottom:1px solid var(--line)}.journey-heading h2{font-size:clamp(35px,7vw,50px)}.journey-heading>p{font-size:15px}.journey-chapter h3{max-width:none}.journey-chapter>p{max-width:55ch}.journey-chapter .chapter-symbol{margin-bottom:18px}.journey-ready .journey-displays{min-height:460px}.journey-photo{height:185px}.office-scene{transform:none!important}.scene-caption{transform:none!important}} @media(prefers-reduced-motion:reduce){.office-scene,.scene-photo img,.scene-caption{transform:none!important}.journey-ready .journey-stage{position:relative;top:auto}.journey-ready .journey-chapter,.journey-ready .journey-chapter:last-child{min-height:0;padding-block:35px}.journey-display{transition:none!important}.office-hero h1,.office-hero .eyebrow,.office-hero .lead,.office-hero .hero-actions{animation:none}.journey-audio i{animation:none}} .journey-ready .journey-displays{display:grid;min-height:0}.journey-ready .journey-display{position:relative;inset:auto;grid-area:1/1;align-self:start} @media(min-width:761px) and (min-height:850px){.journey-ready .journey-chapter:first-child{padding-top:6px}.journey-ready .journey-chapter:last-child{padding-bottom:0}.journey-chapter+.journey-chapter{border-top:1px solid var(--line)}} .call-outcomes{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--bg)} .outcomes-top{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 28px;border-bottom:1px solid var(--line);background:var(--bg2)}.outcomes-source{display:inline-flex;align-items:center;gap:12px;font-size:15px;font-weight:500}.outcomes-source svg{width:19px;height:19px}.outcomes-note{font-size:11px} .outcomes-lanes{padding:4px 28px}.outcome-lane{display:grid;grid-template-columns:52px minmax(0,1fr) minmax(70px,.4fr) minmax(190px,.55fr);align-items:center;gap:24px;padding:28px 0}.outcome-lane+.outcome-lane{border-top:1px solid var(--line)}.outcome-icon{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;background:#101416;color:#fff}.outcome-icon svg{width:27px;height:27px;stroke-width:1.8}.outcome-answered .outcome-icon{background:#101416}.outcome-handed .outcome-icon{background:#101416}.outcome-copy h3{font-family:var(--display);font-size:27px;letter-spacing:-.025em;text-transform:none;line-height:1.15;margin:0 0 6px;font-weight:500}.outcome-copy p{font-size:13px;line-height:1.6;margin:0;max-width:42ch}.outcome-track{height:1px;background:var(--line2);position:relative;margin-right:6px}.outcome-track>span{position:absolute;right:-6px;top:50%;transform:translateY(-53%);font-size:22px}.outcome-track i{position:absolute;top:-2px;left:0;width:28px;height:5px;border-radius:5px;background:var(--text);animation:outcome-travel 3.8s ease-in-out var(--lane-delay) infinite}.outcome-answered .outcome-track i{background:var(--text)}.outcome-handed .outcome-track i{background:var(--text)}@keyframes outcome-travel{0%,10%{left:0;transform:scaleX(.5)}75%,100%{left:calc(100% - 28px);transform:scaleX(1)}} .outcome-result{display:flex;align-items:center;gap:12px;padding:14px 16px;border:1px solid var(--line);border-radius:10px;background:var(--bg2)}.outcome-result>div>span{display:block;font-size:13px;font-weight:500}.outcome-result small{display:block;font-size:11px;margin-top:3px}.outcome-check{font-size:15px}.outcomes-foot{display:flex;align-items:center;gap:10px;border-top:1px solid var(--line);padding:15px 28px;font-size:12px}.outcome-log-mark{display:grid;place-items:center;width:21px;height:21px;border:1px solid var(--line2);border-radius:50%;font-size:11px} @media(max-width:1000px){.outcome-lane{grid-template-columns:44px minmax(0,1fr) minmax(35px,.2fr) minmax(170px,.55fr);gap:15px}.outcome-icon{width:44px;height:44px;border-radius:12px}.outcome-copy h3{font-size:24px}.outcome-result{padding:12px}} @media(max-width:650px){.outcomes-top{padding:18px;align-items:start;flex-direction:column;gap:8px}.outcomes-lanes{padding:0 18px}.outcome-lane{grid-template-columns:40px minmax(0,1fr);gap:13px;padding:22px 0}.outcome-icon{width:40px;height:40px;border-radius:11px}.outcome-track{display:none}.outcome-result{grid-column:2}.outcome-copy h3{font-size:24px}.outcomes-foot{padding:14px 18px;font-size:11px}} @media(prefers-reduced-motion:reduce){.outcome-track i{animation:none;left:45%}} .outcome-icon{border:1px solid #354044;box-shadow:inset 0 1px 0 #ffffff24,0 5px 12px #00000010} .section-dark .dark-grid,html:root .section-dark .dark-grid{background:#f5f5f5;border:1px solid #dedede;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none} .section-dark :is(h2,h3,p,a,li),html:root .section-dark :is(h2,h3,p,a,li,.lead){color:#101416} .section-dark .dark-list li::before,html:root .section-dark .dark-list li::before{color:#101416;border-color:#101416;background:none;box-shadow:none} .section-dark .btn-light,html:root .section-dark .btn-light{background:#101416;color:#fff;border-color:#101416;box-shadow:none} .section-dark .btn-light:hover,html:root .section-dark .btn-light:hover{background:#303030;color:#fff;border-color:#303030;box-shadow:none} .section-dark .btn[style],html:root .section-dark .btn[style]{background:transparent!important;color:#101416!important;border-color:#bdbdbd!important;box-shadow:none!important} .section-dark .btn[style]:hover,html:root .section-dark .btn[style]:hover{background:#e9e9e9!important} .rollout-timeline p{max-width:none;text-wrap:wrap} .rollout-timeline .step>div{min-width:0} @media(min-width:901px){.rollout-timeline .step{grid-template-columns:130px minmax(0,1fr);gap:24px}.rollout-timeline .when{letter-spacing:0;text-transform:none;font-family:var(--font)}} .rollout-heading>p{max-width:none;text-wrap:wrap} @media(min-width:1100px){.section-head.rollout-heading{gap:24px;align-items:center}.rollout-heading>h2{flex:0 1 auto}.rollout-heading>p{flex:0 0 auto;padding-top:0;white-space:nowrap}} .service-overview .flow-wrap{margin-bottom:44px}.resources-directory{grid-template-columns:1fr 1fr;gap:28px}.resources-directory .dir-col:last-child{border-right:0}.resource-title{font-size:16px!important;font-weight:500}.visibility-notes{display:flex;gap:24px;justify-content:space-between;border-top:1px solid var(--line);padding-top:16px}.visibility-notes p{font-size:13px;margin:0}.work-example{display:grid;grid-template-columns:1fr auto;gap:0;font-size:12px}.work-example>span{padding:12px 0;border-bottom:1px solid var(--line)}.work-example>span:nth-child(2n){text-align:right}.document-scene{padding-top:35px}.document-preview{border:1px solid var(--line);border-radius:12px;background:var(--bg);padding:22px}.document-preview-title{font-size:15px;display:block;padding-bottom:13px}.office-journey .confirmation-ring{border-color:var(--line2);box-shadow:0 0 0 12px #80808008,0 0 0 24px #80808004}.office-journey .confirmation-ring>span{background:#101416;color:#fff}.office-journey .signal-dot{background:var(--text);box-shadow:none}.office-journey .journey-chapter.is-current .chapter-symbol{background:#101416;color:#fff;border-color:#354044} @media(max-width:720px){.resources-directory{grid-template-columns:1fr}.visibility-notes{flex-direction:column;gap:10px}.work-example{font-size:11px}.document-preview{padding:16px}} #hear .call-player .wave{gap:0;justify-content:space-between;height:26px} #hear .call-player .wave i{flex:1 1 1.5px;width:1.5px;max-width:1.5px;min-width:0;border-radius:1px;box-shadow:none;transition:background .2s} #hear .call-player .wave i.on{background:var(--text)} #hear .call-player .wave i.live{box-shadow:none} @media(min-width:1001px){.nav>.wrap{max-width:none;width:100%;padding-inline:clamp(32px,3vw,72px)}} .nav-links{align-items:center}.nav-links>a{white-space:nowrap}.nav-resources{position:relative;flex:none}.nav-resources>summary{list-style:none;display:flex;align-items:center;gap:8px;cursor:pointer;font-size:14px;font-weight:500;padding:10px;border-radius:8px;white-space:nowrap}.nav-resources>summary::-webkit-details-marker{display:none}.nav-resources>summary svg{width:14px;height:14px;transition:transform .2s}.nav-resources[open]>summary svg{transform:rotate(180deg)}.nav-resources[open]>summary,.nav-resources.is-current>summary,.nav-resources>summary:hover{background:var(--glass2)} .resources-panel{position:absolute;top:calc(100% + 20px);right:0;width:640px;max-width:calc(100vw - 48px);background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:16px;box-shadow:0 20px 60px #0000001a;overflow:hidden;z-index:1;animation:resources-arrive .22s ease-out}.nav-resources:not([open]) .resources-panel{display:none}@keyframes resources-arrive{from{transform:translateY(-6px)}to{transform:translateY(0)}} .resources-panel-heading{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:22px 24px;border-bottom:1px solid var(--line)}.resources-panel-heading>span:first-child{font-family:var(--display);font-size:20px;letter-spacing:-.02em}.resources-panel-heading>span:last-child{font-size:11px}.resources-panel-columns{display:grid;grid-template-columns:1fr 1fr;padding:22px 14px;gap:10px}.resources-panel-group h2{font-family:var(--font);font-size:12px;letter-spacing:0;font-weight:500;line-height:1.4;margin:0;padding:0 12px 12px}.nav-links .resources-link{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px;border-radius:8px;white-space:normal}.resources-link>span:first-child{min-width:0}.resources-link-title{display:block;font-size:14px;font-weight:500}.resources-link-description{display:block;font-size:11px;line-height:1.5;margin-top:4px;font-weight:400}.resources-link-arrow{font-size:17px;transition:transform .2s}.nav-links .resources-link:hover,.nav-links .resources-link[aria-current=page]{background:var(--bg2);text-decoration:none}.resources-link:hover .resources-link-arrow{transform:translate(2px,-2px)}.nav-links .resources-panel-footer{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:17px 26px;border-top:1px solid var(--line);border-radius:0;background:var(--bg2);font-size:13px}.nav-links .resources-panel-footer:hover{background:var(--glass3)} @media(min-width:1280px) and (max-width:1500px){.nav-in{gap:18px}.nav-links{gap:1px}.nav-links>a,.nav-resources>summary{font-size:13px;padding-inline:8px}} @media(max-width:1279px){.nav-in{height:74px;gap:18px}.nav-links{display:none}.nav-toggle{display:block;margin-left:0}.nav-right{display:none}.nav-open .nav-links{display:flex;align-items:stretch;position:absolute;top:74px;left:0;right:0;flex-direction:column;gap:0;padding:14px 22px 22px;border-bottom:1px solid var(--line);background:var(--bg);max-height:calc(100dvh - 74px);overflow-y:auto;overscroll-behavior:contain}.nav-links>a{padding:12px}.nav-open .nav-mobile-only:not([hidden]){display:block}.nav-resources>summary{padding:12px;justify-content:space-between;font-size:15px}.resources-panel{position:static;width:100%;max-width:none;margin:6px 0 10px;box-shadow:none;border-radius:10px}.resources-panel-heading{padding:18px}.resources-panel-columns{padding:16px 8px}.nav-links .resources-link{padding:12px}.nav-links .resources-panel-footer{padding:16px 20px}} @media(max-width:540px){.resources-panel-columns{grid-template-columns:1fr;gap:20px}.resources-panel-heading{align-items:start;flex-direction:column;gap:5px}.resources-panel-heading>span:first-child{font-size:18px}} @media(prefers-reduced-motion:reduce){.resources-panel{animation:none}.nav-resources>summary svg,.resources-link-arrow{transition:none}} .industry-choice{position:relative;width:350px;max-width:100%;margin-top:0} .industry-choice>summary{display:flex;align-items:center;gap:12px;list-style:none;padding:11px 14px;border:1px solid var(--line2);border-radius:11px;background:var(--bg);font-size:14px;font-weight:500;cursor:pointer;transition:border-color .2s,background .2s} .industry-choice>summary::-webkit-details-marker{display:none}.industry-choice>summary:hover,.industry-choice[open]>summary{background:var(--bg2);border-color:var(--text)} .industry-choice-symbol{display:grid;place-items:center;width:28px;height:28px;flex:none}.industry-choice-symbol svg{width:21px;height:21px}.industry-choice-chevron{width:14px;height:14px;margin-left:auto;transition:transform .2s}.industry-choice[open] .industry-choice-chevron{transform:rotate(180deg)} .industry-choice-panel{position:absolute;left:0;top:calc(100% + 10px);width:570px;max-width:calc(100vw - 48px);z-index:5;background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:15px;box-shadow:0 18px 50px #0000001a;overflow:hidden;animation:resources-arrive .2s ease-out}.industry-choice:not([open]) .industry-choice-panel{display:none} .industry-choice-heading{padding:18px 20px;font-family:var(--display);font-size:18px;letter-spacing:-.015em;border-bottom:1px solid var(--line)} .industry-choice-options{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:10px;max-height:min(360px,50vh);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line2) transparent} .industry-choice-options>a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 12px;border-radius:8px;min-width:0;transition:background .2s}.industry-choice-options>a>span:first-child{min-width:0}.industry-choice-options>a:hover{background:var(--bg2);text-decoration:none}.industry-choice-title{display:block;font-size:13px;font-weight:500;line-height:1.4}.industry-choice-description{display:block;font-size:11px;line-height:1.5;margin-top:4px}.industry-choice-arrow{font-size:17px;flex:none;transition:transform .2s}.industry-choice-options>a:hover .industry-choice-arrow{transform:translate(2px,-2px)} .industry-choice-all{display:flex;justify-content:space-between;align-items:center;padding:15px 22px;border-top:1px solid var(--line);background:var(--bg2);font-size:12px}.industry-choice-all:hover{background:var(--glass3);text-decoration:none} @media(max-width:640px){.industry-choice{width:100%}.industry-choice-panel{width:100%;max-width:100%}.industry-choice-options{grid-template-columns:1fr;max-height:min(330px,45vh)}.industry-choice-options>a{padding:11px 12px}} @media(prefers-reduced-motion:reduce){.industry-choice-panel{animation:none}.industry-choice-chevron,.industry-choice-arrow,.industry-choice>summary,.industry-choice-options>a{transition:none}} .hero.office-hero{z-index:2}
/* site-palette-v1.css */
html:root{--bg:#fff;--bg2:#F9F6F0;--text:#121617;--line:#e7ded4;--line2:#d5c5b7;--glass:#fff;--glass2:#F9F6F0;--accent:#C64110;--ink:#121617} html:root body{background:#F9F6F0;color:#121617} html:root body :is(.section,.section-dark,.footer,.ticker,.booking-start,.integration-pricing,.industry-method,.pricing-section,.rp-content,.tw-section){background-color:#F9F6F0} html:root body :is(.page-hero,.rp-hero,.pricing-intro,.how-intro,.booking-intro,.integration-intro,.industry-intro,.demo-hero){background-color:#fff} html:root body :is(.glass,.ledger,.table,.faq,.search-card,.form-panel,.bento>a,.rp-feature,.rp-close>.wrap,.bt-feature,.bt-next-inner,.tool-result,.uc-outcome,.uc-close>.wrap,.guide-feature-photo,.guide-next-inner,.demo-hero-scene,.demo-workspace-shell,.demo-recording,.demo-console,.demo-result,.pricing-estimator,.pricing-package,.pricing-included,.plan-builder-shell,.booking-preview,.booking-plan,.booking-promise,.how-preview,.how-delivery,.how-control,.integration-diagram,.integration-photo,.integration-platforms,.document-flow,.document-mail,.document-record,.industry-portrait){background-color:#fff;border-color:#e7ded4;box-shadow:0 2px 3px #392d2110,0 7px 12px #392d211c} html:root body :is(.ledger-head,.table thead th,.how-preview-copy,.industry-portrait figcaption,.integration-photo figcaption){background-color:#fff} html:root body :is(input:not([type=range]):not([type=checkbox]):not([type=radio]),select,textarea,.plan-choice,.pricing-plan-menu summary,.pricing-plan-options){background-color:#fff;color:#121617} html body :is(.btn-primary,.section-dark .btn-light,.pricing-package .btn,.call-player .bigplay,.call-player .pp),html:root body :is(.btn-primary,.section-dark .btn-light,.pricing-package .btn,.call-player .bigplay,.call-player .pp){background:#C64110;border-color:#C64110;color:#fff;box-shadow:0 3px 7px #9b431520} html body :is(.btn-primary,.section-dark .btn-light,.pricing-package .btn,.call-player .bigplay,.call-player .pp):hover{background:#9F4010;border-color:#9F4010;color:#fff} html body :is(.tab.on,.guide-filters button[aria-pressed=true],.booking-times button[aria-pressed=true],.demo-slots button[aria-pressed=true],.pricing-plan-options button[aria-pressed=true],.how-preview-steps button[aria-pressed=true] span,.pricing-package-badge,.demo-studio .msg.me,.demo-studio .orb){background:#C64110;border-color:#C64110;color:#fff} html body .plan-choice input:checked+.plan-choice-check{background:#C64110;border-color:#C64110;color:#fff} html body input:is([type=checkbox],[type=radio],[type=range]){accent-color:#C64110} html body .plan-control input[type=range]::-webkit-slider-thumb{background:#C64110} html body .plan-control input[type=range]::-moz-range-thumb{background:#C64110} html body .call-player .bigplay::after{border-color:#C64110} html:root body :is(.plan-recommendation,.demo-closing-inner,.guide-feature){background:#fff;color:#121617;border:1px solid #e7ded4;box-shadow:0 2px 3px #392d2110,0 7px 12px #392d211c} html:root body :is(.plan-recommendation,.demo-closing-inner,.guide-feature) :is(h2,h3,p,li,small,span,div){color:#121617;border-color:#e7ded4} html:root body .plan-recommend-label{background:#F9F6F0;color:#121617} html:root body :is(.plan-recommend-cta,.demo-closing-actions>.btn,.guide-feature>.btn){background:#C64110;color:#fff;border-color:#C64110} html:root body :is(.plan-recommend-cta,.demo-closing-actions>.btn) span{color:#fff} html:root body .demo-studio .pick.on{background:#fff0e8;border-color:#C64110} html:root body .demo-studio .msg.ai{background:#F9F6F0;color:#121617} html:root body .guide-feature a:not(.btn){color:#121617}html:root body .plan-recommend-included h4, html:root body .demo-closing-actions>a:not(.btn){color:#121617} html:root body :is(.plan-recommendation,.demo-closing) :focus-visible{outline-color:#C64110} html body .demo-studio .orb::after{border-color:#C64110} html:root body :is(.hero,.rp-hero,.pricing-intro,.how-intro,.booking-intro,.integration-intro,.industry-intro,.guide-intro,.demo-hero,.bt-hero,.uc-hero){background:radial-gradient(ellipse at 88% 20%,#fff0e3 0,transparent 56%),#fffdfb} html:root body .tool-workspace .tw-section{background-color:#F9F6F0;background-image:radial-gradient(ellipse at 88% 20%,#fff0e3 0,transparent 56%),linear-gradient(#fffdfb,#fffdfb);background-size:100% 280px;background-repeat:no-repeat}
/* page-motion-v1.css */
.rp-visual{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:24px 0 28px} .rp-visual-step{min-width:0;display:flex;align-items:center;gap:12px;padding:16px 12px;border:1px solid var(--line);border-radius:14px;background:var(--bg2);font-size:13px;line-height:1.4} .rp-visual-step svg{width:24px;height:24px;flex:none;color:#C64110;stroke-width:1.6} .rp-feature .rp-visual-label{font-size:11px;letter-spacing:.09em;text-transform:uppercase;margin:22px 0 0} html:root body .rp-entries article{background:#fff;border:1px solid #e7ded4;border-radius:18px;padding:24px;box-shadow:0 2px 3px #392d2110,0 7px 12px #392d2110} .rp-entries article h3{margin-bottom:14px} @media(hover:hover) and (prefers-reduced-motion:no-preference){ :is(.pricing-package,.rp-entries article,.bt-entry,.uc-entries article,.guide-entry,.industry-entry){transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease} :is(.pricing-package,.rp-entries article,.bt-entry,.uc-entries article,.guide-entry,.industry-entry):hover{transform:translateY(-3px);border-color:#d4b6a3} .rp-visual-step{transition:background .25s ease,transform .25s ease} .rp-visual-step:hover{transform:translateY(-2px);background:#fff0e8} .btn{transition:background-color .2s ease,box-shadow .2s ease} .btn-primary:hover{box-shadow:0 4px 10px #C6411026} } @media(max-width:600px){.rp-visual-step{padding:12px 9px;gap:8px;font-size:12px}.rp-visual-step svg{width:20px;height:20px}}
/* editorial-stories-v1.css */
.editorial-story{padding:44px 0 54px;background:transparent} .editorial-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center;gap:clamp(30px,5vw,78px)} .editorial-photo{margin:0;min-width:0;border-radius:22px;overflow:hidden;background:#fff;box-shadow:0 2px 3px #392d2110,0 7px 12px #392d211c} .editorial-photo img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain} .editorial-photo figcaption{padding:10px 16px;background:#fff;color:#121617;font-size:11px;letter-spacing:.04em} .editorial-copy{min-width:0;max-width:520px} .editorial-copy h2{font-family:var(--display);font-size:clamp(30px,3.3vw,46px);font-weight:500;letter-spacing:-.035em;line-height:1.12;text-transform:none;margin:18px 0 22px} .editorial-copy>p:not(.eyebrow){font-size:16px;line-height:1.75;margin:0 0 24px} .editorial-topics{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px} .editorial-topics span{font-size:12px;border:1px solid var(--line);border-radius:20px;padding:8px 12px;background:var(--bg)} .editorial-link{display:inline-flex;align-items:center;gap:25px;font-size:14px;padding-bottom:8px;border-bottom:1px solid currentColor} .editorial-link>span{color:#C64110;font-size:20px} .editorial-reverse .editorial-photo{order:2}.editorial-reverse .editorial-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)} html:root .editorial-copy{color:#121617} @media(max-width:760px){.editorial-story{padding:28px 0 36px}.editorial-grid,.editorial-reverse .editorial-grid{grid-template-columns:minmax(0,1fr);gap:25px}.editorial-reverse .editorial-photo{order:0}.editorial-copy{max-width:none}.editorial-photo{border-radius:16px}.editorial-copy h2{margin-top:12px}}.industry-method .industry-method-photo{margin:25px 0 22px} .industry-method .industry-method-grid{align-items:center} .booking-page .booking-preview-photo{height:clamp(240px,23vw,330px);object-fit:cover;object-position:center 25%} @media(max-width:720px){.booking-page .booking-preview-photo{height:auto;aspect-ratio:1600/914}.industry-method .industry-method-photo{margin:22px 0}}
/* mobile-fixes-v1.css */
@media (max-width: 640px) { .appt .m, .auth-bottom, .auth-kicker, .ba .r .k, .bt-entry dt, .bt-type>.eyebrow, .cal-hours div, .calendar-booked small, .calendar-day, .calendar-times, .call-player .line small, .conf, .day .dow, .day .mon, .day .n, .demo-booking .book-foot, .demo-booking .booking-kicker, .demo-booking .steps li, .demo-sidebar-note, .demo-studio .eyebrow, .demo-studio .ledger .t, .demo-transcript span, .editorial-photo figcaption, .guide-entry>.eyebrow, .industry-choice-description, .journey-stage-top>span:last-child, .ledger li .c, .outcome-result small, .outcomes-foot, .outcomes-note, .resources-link-description, .resources-panel-heading>span:last-child, .rp-feature .rp-visual-label, .scene-caption div>span, .scene-pause, .scene-top, .status-pill, .step-line > .mono, .uc-entries .eyebrow, .uc-outcome li span, .vw-node .vw-label, .work-example, .compact-footer-legal a, .compact-footer-nav summary, .compact-footer-group summary, .compact-footer-bottom p, .compact-footer-status, article.bt-entry dl dt, .plan-choice small, .plan-choice-price, .how-delivery span, .pricing-plan-options button small, .pricing-features-label, .pricing-extra-cost, .step-line .mono, .vw-label, .plan-control small, .plan-capacity small, .plan-recommend-prices span, .plan-recommend-label, .how-playback, .how-preview-note, .platform-access-note, .integration-platforms li span, .document-attachment small, .document-status, .pricing-estimator p, .pricing-package-badge, .booking-preview-label { font-size: 12px !important; } input:not([type=checkbox]):not([type=radio]):not([type=hidden]), select, textarea { font-size: 16px !important; } } @media (max-width: 640px) { .compact-footer-legal a, .compact-footer-status { display: inline-block; padding: 6px 0; } .compact-footer-legal { gap: 6px 18px; } } @media (max-width: 640px) { .ticker { padding: 18px 0; } .ticker-metal { width: 44px !important; height: 44px !important; border-radius: 13px !important; } .ticker-metal img { width: 28px !important; height: 28px !important; filter: none !important; } .ticker-metal svg { width: 26px !important; height: 26px !important; } .ticker-brand { gap: 12px; font-size: 16px; } .ticker-in { gap: 34px; } } @media (max-width: 640px) { .ticker-in { animation: none !important; transform: none !important; width: auto !important; max-width: 100% !important; flex-wrap: wrap !important; justify-content: center !important; gap: 14px !important; padding-inline: 20px !important; } .ticker-brand { font-size: 0 !important; gap: 0 !important; } .ticker-brand[aria-hidden="true"] { display: none !important; } .ticker-in > .ticker-brand:nth-of-type(n+19) { display: none !important; } }
/* panel-selects.css */
html body select:not([multiple]):not([size]):not([hidden]){background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m5.5 7.5 4.5 4.5 4.5-4.5' fill='none' stroke='%23111516' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;background-size:15px 15px;border:1px solid #d9cec2;border-radius:10px;box-shadow:0 1px 2px rgba(57,45,33,.05);color:#111516;cursor:pointer;padding-right:38px;-webkit-appearance:none;appearance:none} html body select:not([multiple]):not([size]):not([hidden]):hover{border-color:#ba9f89;background-color:#fffaf6} html body select:not([multiple]):not([size]):not([hidden]):focus-visible{border-color:#c64110;outline:3px solid rgba(198,65,16,.2);outline-offset:1px} html body select:not([multiple]):not([size]):not([hidden]):disabled{cursor:not-allowed;opacity:.58} @supports (appearance:base-select) and selector(select::picker(select)){ html body select:not([multiple]):not([size]):not([hidden]),html body select:not([multiple]):not([size]):not([hidden])::picker(select){appearance:base-select!important;-webkit-appearance:base-select!important} html body select:not([multiple]):not([size]):not([hidden]){background-image:none!important;align-items:center;gap:12px;padding-right:12px} html body select:not([multiple]):not([size]):not([hidden])::picker-icon{color:#111516;width:15px;transition:rotate .16s ease} html body select:not([multiple]):not([size]):not([hidden]):open::picker-icon{rotate:180deg} html body select:not([multiple]):not([size]):not([hidden])::picker(select){background:#fff;border:1px solid #d9cec2;border-radius:13px;box-shadow:0 14px 34px rgba(57,45,33,.14);color:#111516;margin:6px 0;max-height:300px;min-width:anchor-size(width);overflow-y:auto;overscroll-behavior:contain;padding:6px;position-area:block-end span-inline-end;position-try-fallbacks:none} html body select:not([multiple]):not([size]):not([hidden]) option{background:#fff;border-radius:8px;color:#111516;cursor:pointer;font:500 14px/1.35 var(--font,Inter,sans-serif);min-height:38px;padding:9px 12px} html body select:not([multiple]):not([size]):not([hidden]) option:hover{background:#fff0e3} html body select:not([multiple]):not([size]):not([hidden]) option:focus-visible{background:#fff0e3;outline:2px solid #c64110;outline-offset:-2px} html body select:not([multiple]):not([size]):not([hidden]) option:checked{background:#fff0e3;color:#111516;font-weight:700} html body select:not([multiple]):not([size]):not([hidden]) option::checkmark{color:#c64110;margin-right:9px} html body select:not([multiple]):not([size]):not([hidden]) option:disabled{background:#f7f1eb;color:#111516;cursor:not-allowed;opacity:.58} } @media (forced-colors:active){html body select:not([multiple]):not([size]):not([hidden]):focus-visible{outline:2px solid Highlight}} html body .app-main input:is([type="date"],[type="time"],[type="datetime-local"]){background:#fff;color:#111516;border:1px solid #e7ded2;border-radius:9px;box-shadow:none;font-family:var(--font);font-size:13px;line-height:1.4;min-width:0;max-width:100%;min-height:36px;padding:8px 11px;color-scheme:light} html body .app-main input:is([type="checkbox"],[type="radio"]){accent-color:#c64110;width:17px;height:17px;min-height:0;padding:0;box-shadow:none;flex-shrink:0;vertical-align:middle} html body .app-main input:is([type="date"],[type="time"],[type="datetime-local"])::-webkit-calendar-picker-indicator{cursor:pointer;padding:3px;border-radius:4px} html body .app-main input:is([type="date"],[type="time"],[type="datetime-local"])::-webkit-calendar-picker-indicator:hover{background-color:#fff0e3}