html {
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
font-family: sans-serif;
}
body {
margin: 0;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
display: block;
}
audio, canvas, progress, video {
vertical-align: baseline;
display: inline-block;
}
audio:not([controls]) {
height: 0;
display: none;
}
[hidden], template {
display: none;
}
a {
background-color: #0000;
}
a:active, a:hover {
outline: 0;
}
abbr[title] {
border-bottom: 1px dotted;
}
b, strong {
font-weight: bold;
}
dfn {
font-style: italic;
}
h1 {
margin: .67em 0;
font-size: 2em;
}
mark {
color: #000;
background: #ff0;
}
small {
font-size: 80%;
}
sub, sup {
vertical-align: baseline;
font-size: 75%;
line-height: 0;
position: relative;
}
sup {
top: -.5em;
}
sub {
bottom: -.25em;
}
img {
border: 0;
}
svg:not(:root) {
overflow: hidden;
}
hr {
box-sizing: content-box;
height: 0;
}
pre {
overflow: auto;
}
code, kbd, pre, samp {
font-family: monospace;
font-size: 1em;
}
button, input, optgroup, select, textarea {
color: inherit;
font: inherit;
margin: 0;
}
button {
overflow: visible;
}
button, select {
text-transform: none;
}
button, html input[type="button"], input[type="reset"] {
-webkit-appearance: button;
cursor: pointer;
}
button[disabled], html input[disabled] {
cursor: default;
}
button::-moz-focus-inner, input::-moz-focus-inner {
border: 0;
padding: 0;
}
input {
line-height: normal;
}
input[type="checkbox"], input[type="radio"] {
box-sizing: border-box;
padding: 0;
}
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
height: auto;
}
input[type="search"] {
-webkit-appearance: none;
}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
legend {
border: 0;
padding: 0;
}
textarea {
overflow: auto;
}
optgroup {
font-weight: bold;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
td, th {
padding: 0;
}
@font-face {
font-family: webflow-icons;
src: url("data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMg8SBiUAAAC8AAAAYGNtYXDpP+a4AAABHAAAAFxnYXNwAAAAEAAAAXgAAAAIZ2x5ZmhS2XEAAAGAAAADHGhlYWQTFw3HAAAEnAAAADZoaGVhCXYFgQAABNQAAAAkaG10eCe4A1oAAAT4AAAAMGxvY2EDtALGAAAFKAAAABptYXhwABAAPgAABUQAAAAgbmFtZSoCsMsAAAVkAAABznBvc3QAAwAAAAAHNAAAACAAAwP4AZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADpAwPA/8AAQAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAADAAAAAwAAABwAAQADAAAAHAADAAEAAAAcAAQAQAAAAAwACAACAAQAAQAg5gPpA//9//8AAAAAACDmAOkA//3//wAB/+MaBBcIAAMAAQAAAAAAAAAAAAAAAAABAAH//wAPAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEBIAAAAyADgAAFAAAJAQcJARcDIP5AQAGA/oBAAcABwED+gP6AQAABAOAAAALgA4AABQAAEwEXCQEH4AHAQP6AAYBAAcABwED+gP6AQAAAAwDAAOADQALAAA8AHwAvAAABISIGHQEUFjMhMjY9ATQmByEiBh0BFBYzITI2PQE0JgchIgYdARQWMyEyNj0BNCYDIP3ADRMTDQJADRMTDf3ADRMTDQJADRMTDf3ADRMTDQJADRMTAsATDSANExMNIA0TwBMNIA0TEw0gDRPAEw0gDRMTDSANEwAAAAABAJ0AtAOBApUABQAACQIHCQEDJP7r/upcAXEBcgKU/usBFVz+fAGEAAAAAAL//f+9BAMDwwAEAAkAABcBJwEXAwE3AQdpA5ps/GZsbAOabPxmbEMDmmz8ZmwDmvxmbAOabAAAAgAA/8AEAAPAAB0AOwAABSInLgEnJjU0Nz4BNzYzMTIXHgEXFhUUBw4BBwYjNTI3PgE3NjU0Jy4BJyYjMSIHDgEHBhUUFx4BFxYzAgBqXV6LKCgoKIteXWpqXV6LKCgoKIteXWpVSktvICEhIG9LSlVVSktvICEhIG9LSlVAKCiLXl1qal1eiygoKCiLXl1qal1eiygoZiEgb0tKVVVKS28gISEgb0tKVVVKS28gIQABAAABwAIAA8AAEgAAEzQ3PgE3NjMxFSIHDgEHBhUxIwAoKIteXWpVSktvICFmAcBqXV6LKChmISBvS0pVAAAAAgAA/8AFtgPAADIAOgAAARYXHgEXFhUUBw4BBwYHIxUhIicuAScmNTQ3PgE3NjMxOAExNDc+ATc2MzIXHgEXFhcVATMJATMVMzUEjD83NlAXFxYXTjU1PQL8kz01Nk8XFxcXTzY1PSIjd1BQWlJJSXInJw3+mdv+2/7c25MCUQYcHFg5OUA/ODlXHBwIAhcXTzY1PTw1Nk8XF1tQUHcjIhwcYUNDTgL+3QFt/pOTkwABAAAAAQAAmM7nP18PPPUACwQAAAAAANciZKUAAAAA1yJkpf/9/70FtgPDAAAACAACAAAAAAAAAAEAAAPA/8AAAAW3//3//QW2AAEAAAAAAAAAAAAAAAAAAAAMBAAAAAAAAAAAAAAAAgAAAAQAASAEAADgBAAAwAQAAJ0EAP/9BAAAAAQAAAAFtwAAAAAAAAAKABQAHgAyAEYAjACiAL4BFgE2AY4AAAABAAAADAA8AAMAAAAAAAIAAAAAAAAAAAAAAAAAAAAAAAAADgCuAAEAAAAAAAEADQAAAAEAAAAAAAIABwCWAAEAAAAAAAMADQBIAAEAAAAAAAQADQCrAAEAAAAAAAUACwAnAAEAAAAAAAYADQBvAAEAAAAAAAoAGgDSAAMAAQQJAAEAGgANAAMAAQQJAAIADgCdAAMAAQQJAAMAGgBVAAMAAQQJAAQAGgC4AAMAAQQJAAUAFgAyAAMAAQQJAAYAGgB8AAMAAQQJAAoANADsd2ViZmxvdy1pY29ucwB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzVmVyc2lvbiAxLjAAVgBlAHIAcwBpAG8AbgAgADEALgAwd2ViZmxvdy1pY29ucwB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzd2ViZmxvdy1pY29ucwB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzUmVndWxhcgBSAGUAZwB1AGwAYQByd2ViZmxvdy1pY29ucwB3AGUAYgBmAGwAbwB3AC0AaQBjAG8AbgBzRm9udCBnZW5lcmF0ZWQgYnkgSWNvTW9vbi4ARgBvAG4AdAAgAGcAZQBuAGUAcgBhAHQAZQBkACAAYgB5ACAASQBjAG8ATQBvAG8AbgAuAAAAAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==") format("truetype");
font-weight: normal;
font-style: normal;
}
[class^="w-icon-"], [class*=" w-icon-"] {
speak: none;
font-variant: normal;
text-transform: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-style: normal;
font-weight: normal;
line-height: 1;
font-family: webflow-icons !important;
}
.w-icon-slider-right:before {
content: "";
}
.w-icon-slider-left:before {
content: "";
}
.w-icon-nav-menu:before {
content: "";
}
.w-icon-arrow-down:before, .w-icon-dropdown-toggle:before {
content: "";
}
.w-icon-file-upload-remove:before {
content: "";
}
.w-icon-file-upload-icon:before {
content: "";
}
* {
box-sizing: border-box;
}
html {
height: 100%;
}
body {
color: #333;
background-color: #fff;
min-height: 100%;
margin: 0;
font-family: Arial, sans-serif;
font-size: 14px;
line-height: 20px;
}
img {
vertical-align: middle;
max-width: 100%;
display: inline-block;
}
html.w-mod-touch * {
background-attachment: scroll !important;
}
.w-block {
display: block;
}
.w-inline-block {
max-width: 100%;
display: inline-block;
}
.w-clearfix:before, .w-clearfix:after {
content: " ";
grid-area: 1 / 1 / 2 / 2;
display: table;
}
.w-clearfix:after {
clear: both;
}
.w-hidden {
display: none;
}
.w-button {
color: #fff;
line-height: inherit;
cursor: pointer;
background-color: #3898ec;
border: 0;
border-radius: 0;
padding: 9px 15px;
text-decoration: none;
display: inline-block;
}
input.w-button {
-webkit-appearance: button;
}
:where(button.w-popover-trigger), :where(button.w-modal-trigger) {
color: inherit;
cursor: pointer;
font: inherit;
line-height: inherit;
text-align: inherit;
-webkit-text-decoration: inherit;
text-decoration: inherit;
background-color: #0000;
border: 0;
margin: 0;
padding: 0;
}
:where(.w-popover) {
position-anchor: auto;
position-area: top;
}
:where(.w-popover[data-w-popover-backdrop-animated], .w-modal[data-w-popover-backdrop-animated])::backdrop {
animation: var(--w-backdrop-animation, none);
}
:where(.w-popover, .w-modal) {
--w-backdrop-animation: initial;
}
.w-popover-mask {
opacity: 0 !important;
clip-path: none !important;
pointer-events: auto !important;
border: 0 !important;
width: auto !important;
max-width: none !important;
height: auto !important;
max-height: none !important;
margin: 0 !important;
padding: 0 !important;
position: fixed !important;
inset: 0 !important;
transform: none !important;
}
.w-popover-mask[popover] {
translate: none !important;
rotate: none !important;
scale: none !important;
}
.w-popover-mask::backdrop {
display: none !important;
}
.w-popover-mask:not(:popover-open) {
display: none !important;
}
@supports not selector(:popover-open) {
.w-popover-mask {
display: none !important;
}
}
.w-popover[popover]:not(:popover-open) {
display: none;
}
.w-modal:not([open]):not([popover]) {
display: none;
}
.w-modal[popover]:not(:popover-open) {
display: none;
}
:where(.w-modal[data-w-modal-lock-scroll]) {
overscroll-behavior: contain;
}
html[data-w-dynpage] [data-w-cloak] {
color: #0000 !important;
}
.w-code-block {
margin: unset;
}
pre.w-code-block code {
all: inherit;
}
pre.w-code-block code > span {
display: block !important;
}
.w-optimization {
display: contents;
}
.w-webflow-badge, .w-webflow-badge > img {
box-sizing: unset;
width: unset;
height: unset;
max-height: unset;
max-width: unset;
min-height: unset;
min-width: unset;
margin: unset;
padding: unset;
float: unset;
clear: unset;
border: unset;
border-radius: unset;
background: unset;
background-image: unset;
background-position: unset;
background-size: unset;
background-repeat: unset;
background-origin: unset;
background-clip: unset;
background-attachment: unset;
background-color: unset;
box-shadow: unset;
transform: unset;
direction: unset;
font-family: unset;
font-weight: unset;
color: unset;
font-size: unset;
line-height: unset;
font-style: unset;
font-variant: unset;
text-align: unset;
letter-spacing: unset;
-webkit-text-decoration: unset;
text-decoration: unset;
text-indent: unset;
text-transform: unset;
list-style-type: unset;
text-shadow: unset;
vertical-align: unset;
cursor: unset;
white-space: unset;
word-break: unset;
word-spacing: unset;
word-wrap: unset;
transition: unset;
}
.w-webflow-badge {
white-space: nowrap;
cursor: pointer;
box-shadow: 0 0 0 1px #0000001a, 0 1px 3px #0000001a;
visibility: visible !important;
opacity: 1 !important;
z-index: 2147483647 !important;
color: #aaadb0 !important;
width: auto !important;
height: auto !important;
overflow: unset !important;
background-color: #fff !important;
border-radius: 3px !important;
margin: 0 !important;
padding: 6px !important;
font-size: 12px !important;
line-height: 14px !important;
text-decoration: none !important;
display: inline-block !important;
position: fixed !important;
inset: auto 12px 12px auto !important;
transform: none !important;
}
.w-webflow-badge > img {
position: unset;
visibility: unset !important;
opacity: 1 !important;
vertical-align: middle !important;
display: inline-block !important;
}
h1, h2, h3, h4, h5, h6 {
margin-bottom: 10px;
font-weight: bold;
}
h1 {
margin-top: 20px;
font-size: 38px;
line-height: 44px;
}
h2 {
margin-top: 20px;
font-size: 32px;
line-height: 36px;
}
h3 {
margin-top: 20px;
font-size: 24px;
line-height: 30px;
}
h4 {
margin-top: 10px;
font-size: 18px;
line-height: 24px;
}
h5 {
margin-top: 10px;
font-size: 14px;
line-height: 20px;
}
h6 {
margin-top: 10px;
font-size: 12px;
line-height: 18px;
}
p {
margin-top: 0;
margin-bottom: 10px;
}
blockquote {
border-left: 5px solid #e2e2e2;
margin: 0 0 10px;
padding: 10px 20px;
font-size: 18px;
line-height: 22px;
}
figure {
margin: 0 0 10px;
}
figcaption {
text-align: center;
margin-top: 5px;
}
ul, ol {
margin-top: 0;
margin-bottom: 10px;
padding-left: 40px;
}
.w-list-unstyled {
padding-left: 0;
list-style: none;
}
.w-embed:before, .w-embed:after {
content: " ";
grid-area: 1 / 1 / 2 / 2;
display: table;
}
.w-embed:after {
clear: both;
}
.w-video {
width: 100%;
padding: 0;
position: relative;
}
.w-video iframe, .w-video object, .w-video embed {
border: none;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
fieldset {
border: 0;
margin: 0;
padding: 0;
}
button, [type="button"], [type="reset"] {
cursor: pointer;
-webkit-appearance: button;
border: 0;
}
.w-form {
margin: 0 0 15px;
}
.w-form-done {
text-align: center;
background-color: #ddd;
padding: 20px;
display: none;
}
.w-form-fail {
background-color: #ffdede;
margin-top: 10px;
padding: 10px;
display: none;
}
label {
margin-bottom: 5px;
font-weight: bold;
display: block;
}
.w-input, .w-select {
color: #333;
vertical-align: middle;
background-color: #fff;
border: 1px solid #ccc;
width: 100%;
height: 38px;
margin-bottom: 10px;
padding: 8px 12px;
font-size: 14px;
line-height: 1.42857;
display: block;
}
.w-input::placeholder, .w-select::placeholder {
color: #999;
}
.w-input:focus, .w-select:focus {
border-color: #3898ec;
outline: 0;
}
.w-input[disabled], .w-select[disabled], .w-input[readonly], .w-select[readonly], fieldset[disabled] .w-input, fieldset[disabled] .w-select {
cursor: not-allowed;
}
.w-input[disabled]:not(.w-input-disabled), .w-select[disabled]:not(.w-input-disabled), .w-input[readonly], .w-select[readonly], fieldset[disabled]:not(.w-input-disabled) .w-input, fieldset[disabled]:not(.w-input-disabled) .w-select {
background-color: #eee;
}
textarea.w-input, textarea.w-select {
height: auto;
}
.w-select {
background-color: #f3f3f3;
}
.w-select[multiple] {
height: auto;
}
.w-form-label {
cursor: pointer;
margin-bottom: 0;
font-weight: normal;
display: inline-block;
}
.w-radio {
margin-bottom: 5px;
padding-left: 20px;
display: block;
}
.w-radio:before, .w-radio:after {
content: " ";
grid-area: 1 / 1 / 2 / 2;
display: table;
}
.w-radio:after {
clear: both;
}
.w-radio-input {
float: left;
margin: 3px 0 0 -20px;
line-height: normal;
}
.w-file-upload {
margin-bottom: 10px;
display: block;
}
.w-file-upload-input {
opacity: 0;
z-index: -100;
width: .1px;
height: .1px;
position: absolute;
overflow: hidden;
}
.w-file-upload-default, .w-file-upload-uploading, .w-file-upload-success {
color: #333;
display: inline-block;
}
.w-file-upload-error {
margin-top: 10px;
display: block;
}
.w-file-upload-default.w-hidden, .w-file-upload-uploading.w-hidden, .w-file-upload-error.w-hidden, .w-file-upload-success.w-hidden {
display: none;
}
.w-file-upload-uploading-btn {
cursor: pointer;
background-color: #fafafa;
border: 1px solid #ccc;
margin: 0;
padding: 8px 12px;
font-size: 14px;
font-weight: normal;
display: flex;
}
.w-file-upload-file {
background-color: #fafafa;
border: 1px solid #ccc;
flex-grow: 1;
justify-content: space-between;
margin: 0;
padding: 8px 9px 8px 11px;
display: flex;
}
.w-file-upload-file-name {
font-size: 14px;
font-weight: normal;
display: block;
}
.w-file-remove-link {
cursor: pointer;
width: auto;
height: auto;
margin-top: 3px;
margin-left: 10px;
padding: 3px;
display: block;
}
.w-icon-file-upload-remove {
margin: auto;
font-size: 10px;
}
.w-file-upload-error-msg {
color: #ea384c;
padding: 2px 0;
display: inline-block;
}
.w-file-upload-info {
padding: 0 12px;
line-height: 38px;
display: inline-block;
}
.w-file-upload-label {
cursor: pointer;
background-color: #fafafa;
border: 1px solid #ccc;
margin: 0;
padding: 8px 12px;
font-size: 14px;
font-weight: normal;
display: inline-block;
}
.w-icon-file-upload-icon, .w-icon-file-upload-uploading {
width: 20px;
margin-right: 8px;
display: inline-block;
}
.w-icon-file-upload-uploading {
height: 20px;
}
.w-container {
max-width: 940px;
margin-left: auto;
margin-right: auto;
}
.w-container:before, .w-container:after {
content: " ";
grid-area: 1 / 1 / 2 / 2;
display: table;
}
.w-container:after {
clear: both;
}
.w-container .w-row {
margin-left: -10px;
margin-right: -10px;
}
.w-row:before, .w-row:after {
content: " ";
grid-area: 1 / 1 / 2 / 2;
display: table;
}
.w-row:after {
clear: both;
}
.w-row .w-row {
margin-left: 0;
margin-right: 0;
}
.w-col {
float: left;
width: 100%;
min-height: 1px;
padding-left: 10px;
padding-right: 10px;
position: relative;
}
.w-col .w-col {
padding-left: 0;
padding-right: 0;
}
.w-col-1 {
width: 8.33333%;
}
.w-col-2 {
width: 16.6667%;
}
.w-col-3 {
width: 25%;
}
.w-col-4 {
width: 33.3333%;
}
.w-col-5 {
width: 41.6667%;
}
.w-col-6 {
width: 50%;
}
.w-col-7 {
width: 58.3333%;
}
.w-col-8 {
width: 66.6667%;
}
.w-col-9 {
width: 75%;
}
.w-col-10 {
width: 83.3333%;
}
.w-col-11 {
width: 91.6667%;
}
.w-col-12 {
width: 100%;
}
.w-hidden-main {
display: none !important;
}
@media screen and (max-width: 991px) {
.w-container {
max-width: 728px;
}
.w-hidden-main {
display: inherit !important;
}
.w-hidden-medium {
display: none !important;
}
.w-col-medium-1 {
width: 8.33333%;
}
.w-col-medium-2 {
width: 16.6667%;
}
.w-col-medium-3 {
width: 25%;
}
.w-col-medium-4 {
width: 33.3333%;
}
.w-col-medium-5 {
width: 41.6667%;
}
.w-col-medium-6 {
width: 50%;
}
.w-col-medium-7 {
width: 58.3333%;
}
.w-col-medium-8 {
width: 66.6667%;
}
.w-col-medium-9 {
width: 75%;
}
.w-col-medium-10 {
width: 83.3333%;
}
.w-col-medium-11 {
width: 91.6667%;
}
.w-col-medium-12 {
width: 100%;
}
.w-col-stack {
width: 100%;
left: auto;
right: auto;
}
}
@media screen and (max-width: 767px) {
.w-hidden-main, .w-hidden-medium {
display: inherit !important;
}
.w-hidden-small {
display: none !important;
}
.w-row, .w-container .w-row {
margin-left: 0;
margin-right: 0;
}
.w-col {
width: 100%;
left: auto;
right: auto;
}
.w-col-small-1 {
width: 8.33333%;
}
.w-col-small-2 {
width: 16.6667%;
}
.w-col-small-3 {
width: 25%;
}
.w-col-small-4 {
width: 33.3333%;
}
.w-col-small-5 {
width: 41.6667%;
}
.w-col-small-6 {
width: 50%;
}
.w-col-small-7 {
width: 58.3333%;
}
.w-col-small-8 {
width: 66.6667%;
}
.w-col-small-9 {
width: 75%;
}
.w-col-small-10 {
width: 83.3333%;
}
.w-col-small-11 {
width: 91.6667%;
}
.w-col-small-12 {
width: 100%;
}
}
@media screen and (max-width: 479px) {
.w-container {
max-width: none;
}
.w-hidden-main, .w-hidden-medium, .w-hidden-small {
display: inherit !important;
}
.w-hidden-tiny {
display: none !important;
}
.w-col {
width: 100%;
}
.w-col-tiny-1 {
width: 8.33333%;
}
.w-col-tiny-2 {
width: 16.6667%;
}
.w-col-tiny-3 {
width: 25%;
}
.w-col-tiny-4 {
width: 33.3333%;
}
.w-col-tiny-5 {
width: 41.6667%;
}
.w-col-tiny-6 {
width: 50%;
}
.w-col-tiny-7 {
width: 58.3333%;
}
.w-col-tiny-8 {
width: 66.6667%;
}
.w-col-tiny-9 {
width: 75%;
}
.w-col-tiny-10 {
width: 83.3333%;
}
.w-col-tiny-11 {
width: 91.6667%;
}
.w-col-tiny-12 {
width: 100%;
}
}
.w-widget {
position: relative;
}
.w-widget-map {
width: 100%;
height: 400px;
}
.w-widget-map label {
width: auto;
display: inline;
}
.w-widget-map img {
max-width: inherit;
}
.w-widget-map .gm-style-iw {
text-align: center;
}
.w-widget-map .gm-style-iw > button {
display: none !important;
}
.w-widget-twitter {
overflow: hidden;
}
.w-widget-twitter-count-shim {
vertical-align: top;
text-align: center;
background: #fff;
border: 1px solid #758696;
border-radius: 3px;
width: 28px;
height: 20px;
display: inline-block;
position: relative;
}
.w-widget-twitter-count-shim * {
pointer-events: none;
-webkit-user-select: none;
user-select: none;
}
.w-widget-twitter-count-shim .w-widget-twitter-count-inner {
text-align: center;
color: #999;
font-family: serif;
font-size: 15px;
line-height: 12px;
position: relative;
}
.w-widget-twitter-count-shim .w-widget-twitter-count-clear {
display: block;
position: relative;
}
.w-widget-twitter-count-shim.w--large {
width: 36px;
height: 28px;
}
.w-widget-twitter-count-shim.w--large .w-widget-twitter-count-inner {
font-size: 18px;
line-height: 18px;
}
.w-widget-twitter-count-shim:not(.w--vertical) {
margin-left: 5px;
margin-right: 8px;
}
.w-widget-twitter-count-shim:not(.w--vertical).w--large {
margin-left: 6px;
}
.w-widget-twitter-count-shim:not(.w--vertical):before, .w-widget-twitter-count-shim:not(.w--vertical):after {
content: " ";
pointer-events: none;
border: solid #0000;
width: 0;
height: 0;
position: absolute;
top: 50%;
left: 0;
}
.w-widget-twitter-count-shim:not(.w--vertical):before {
border-width: 4px;
border-color: #75869600 #5d6c7b #75869600 #75869600;
margin-top: -4px;
margin-left: -9px;
}
.w-widget-twitter-count-shim:not(.w--vertical).w--large:before {
border-width: 5px;
margin-top: -5px;
margin-left: -10px;
}
.w-widget-twitter-count-shim:not(.w--vertical):after {
border-width: 4px;
border-color: #fff0 #fff #fff0 #fff0;
margin-top: -4px;
margin-left: -8px;
}
.w-widget-twitter-count-shim:not(.w--vertical).w--large:after {
border-width: 5px;
margin-top: -5px;
margin-left: -9px;
}
.w-widget-twitter-count-shim.w--vertical {
width: 61px;
height: 33px;
margin-bottom: 8px;
}
.w-widget-twitter-count-shim.w--vertical:before, .w-widget-twitter-count-shim.w--vertical:after {
content: " ";
pointer-events: none;
border: solid #0000;
width: 0;
height: 0;
position: absolute;
top: 100%;
left: 50%;
}
.w-widget-twitter-count-shim.w--vertical:before {
border-width: 5px;
border-color: #5d6c7b #75869600 #75869600;
margin-left: -5px;
}
.w-widget-twitter-count-shim.w--vertical:after {
border-width: 4px;
border-color: #fff #fff0 #fff0;
margin-left: -4px;
}
.w-widget-twitter-count-shim.w--vertical .w-widget-twitter-count-inner {
font-size: 18px;
line-height: 22px;
}
.w-widget-twitter-count-shim.w--vertical.w--large {
width: 76px;
}
.w-background-video {
color: #fff;
height: 500px;
position: relative;
overflow: hidden;
}
.w-background-video > video {
object-fit: cover;
z-index: -100;
background-position: 50%;
background-size: cover;
width: 100%;
height: 100%;
margin: auto;
position: absolute;
inset: -100%;
}
.w-background-video > video::-webkit-media-controls-start-playback-button {
-webkit-appearance: none;
display: none !important;
}
.w-background-video--control {
background-color: #0000;
padding: 0;
position: absolute;
bottom: 1em;
right: 1em;
}
.w-background-video--control > [hidden] {
display: none !important;
}
.w-slider {
text-align: center;
clear: both;
-webkit-tap-highlight-color: #0000;
tap-highlight-color: #0000;
background: #ddd;
height: 300px;
position: relative;
}
.w-slider-mask {
z-index: 1;
white-space: nowrap;
height: 100%;
display: block;
position: relative;
left: 0;
right: 0;
overflow: hidden;
}
.w-slide {
vertical-align: top;
white-space: normal;
text-align: left;
width: 100%;
height: 100%;
display: inline-block;
position: relative;
}
.w-slider-nav {
z-index: 2;
text-align: center;
-webkit-tap-highlight-color: #0000;
tap-highlight-color: #0000;
height: 40px;
margin: auto;
padding-top: 10px;
position: absolute;
inset: auto 0 0;
}
.w-slider-nav.w-round > div {
border-radius: 100%;
}
.w-slider-nav.w-num > div {
width: auto;
height: auto;
font-size: inherit;
line-height: inherit;
padding: .2em .5em;
}
.w-slider-nav.w-shadow > div {
box-shadow: 0 0 3px #3336;
}
.w-slider-nav-invert {
color: #fff;
}
.w-slider-nav-invert > div {
background-color: #2226;
}
.w-slider-nav-invert > div.w-active {
background-color: #222;
}
.w-slider-dot {
cursor: pointer;
background-color: #fff6;
width: 1em;
height: 1em;
margin: 0 3px .5em;
transition: background-color .1s, color .1s;
display: inline-block;
position: relative;
}
.w-slider-dot.w-active {
background-color: #fff;
}
.w-slider-dot:focus {
outline: none;
box-shadow: 0 0 0 2px #fff;
}
.w-slider-dot:focus.w-active {
box-shadow: none;
}
.w-slider-arrow-left, .w-slider-arrow-right {
cursor: pointer;
color: #fff;
-webkit-tap-highlight-color: #0000;
tap-highlight-color: #0000;
-webkit-user-select: none;
user-select: none;
width: 80px;
margin: auto;
font-size: 40px;
position: absolute;
inset: 0;
overflow: hidden;
}
.w-slider-arrow-left [class^="w-icon-"], .w-slider-arrow-right [class^="w-icon-"], .w-slider-arrow-left [class*=" w-icon-"], .w-slider-arrow-right [class*=" w-icon-"] {
position: absolute;
}
.w-slider-arrow-left:focus, .w-slider-arrow-right:focus {
outline: 0;
}
.w-slider-arrow-left {
z-index: 3;
right: auto;
}
.w-slider-arrow-right {
z-index: 4;
left: auto;
}
.w-icon-slider-left, .w-icon-slider-right {
width: 1em;
height: 1em;
margin: auto;
inset: 0;
}
.w-slider-aria-label {
clip: rect(0 0 0 0);
border: 0;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
position: absolute;
overflow: hidden;
}
.w-slider-force-show {
display: block !important;
}
.w-dropdown {
text-align: left;
z-index: 900;
margin-left: auto;
margin-right: auto;
display: inline-block;
position: relative;
}
.w-dropdown-btn, .w-dropdown-toggle, .w-dropdown-link {
vertical-align: top;
color: #222;
text-align: left;
white-space: nowrap;
margin-left: auto;
margin-right: auto;
padding: 20px;
text-decoration: none;
position: relative;
}
.w-dropdown-toggle {
-webkit-user-select: none;
user-select: none;
cursor: pointer;
padding-right: 40px;
display: inline-block;
}
.w-dropdown-toggle:focus {
outline: 0;
}
.w-icon-dropdown-toggle {
width: 1em;
height: 1em;
margin: auto 20px auto auto;
position: absolute;
top: 0;
bottom: 0;
right: 0;
}
.w-dropdown-list {
background: #ddd;
min-width: 100%;
display: none;
position: absolute;
}
.w-dropdown-list.w--open {
display: block;
}
.w-dropdown-link {
color: #222;
padding: 10px 20px;
display: block;
}
.w-dropdown-link.w--current {
color: #0082f3;
}
.w-dropdown-link:focus {
outline: 0;
}
.w-lightbox-backdrop {
cursor: auto;
letter-spacing: normal;
text-indent: 0;
text-shadow: none;
text-transform: none;
visibility: visible;
white-space: normal;
word-break: normal;
word-spacing: normal;
word-wrap: normal;
color: #fff;
text-align: center;
z-index: 2000;
opacity: 0;
-webkit-user-select: none;
-moz-user-select: none;
-webkit-tap-highlight-color: transparent;
background: #000000e6;
outline: 0;
font-family: Helvetica Neue, Helvetica, Ubuntu, Segoe UI, Verdana, sans-serif;
font-size: 17px;
font-style: normal;
font-weight: 300;
line-height: 1.2;
list-style: disc;
position: fixed;
inset: 0;
-webkit-transform: translate(0);
}
.w-lightbox-backdrop, .w-lightbox-container {
-webkit-overflow-scrolling: touch;
height: 100%;
overflow: auto;
}
.w-lightbox-content {
height: 100vh;
position: relative;
overflow: hidden;
}
.w-lightbox-view {
opacity: 0;
width: 100vw;
height: 100vh;
position: absolute;
}
.w-lightbox-view:before {
content: "";
height: 100vh;
}
.w-lightbox-group, .w-lightbox-group .w-lightbox-view, .w-lightbox-group .w-lightbox-view:before {
height: 86vh;
}
.w-lightbox-frame, .w-lightbox-view:before {
vertical-align: middle;
display: inline-block;
}
.w-lightbox-figure {
margin: 0;
position: relative;
}
.w-lightbox-group .w-lightbox-figure {
cursor: pointer;
}
.w-lightbox-img {
width: auto;
max-width: none;
height: auto;
}
.w-lightbox-image {
float: none;
max-width: 100vw;
max-height: 100vh;
display: block;
}
.w-lightbox-group .w-lightbox-image {
max-height: 86vh;
}
.w-lightbox-caption {
text-align: left;
text-overflow: ellipsis;
white-space: nowrap;
background: #0006;
padding: .5em 1em;
position: absolute;
bottom: 0;
left: 0;
right: 0;
overflow: hidden;
}
.w-lightbox-embed {
width: 100%;
height: 100%;
position: absolute;
inset: 0;
}
.w-lightbox-control {
cursor: pointer;
background-position: center;
background-repeat: no-repeat;
background-size: 24px;
width: 4em;
transition: all .3s;
position: absolute;
top: 0;
}
.w-lightbox-left {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii0yMCAwIDI0IDQwIiB3aWR0aD0iMjQiIGhlaWdodD0iNDAiPjxnIHRyYW5zZm9ybT0icm90YXRlKDQ1KSI+PHBhdGggZD0ibTAgMGg1djIzaDIzdjVoLTI4eiIgb3BhY2l0eT0iLjQiLz48cGF0aCBkPSJtMSAxaDN2MjNoMjN2M2gtMjZ6IiBmaWxsPSIjZmZmIi8+PC9nPjwvc3ZnPg==");
display: none;
bottom: 0;
left: 0;
}
.w-lightbox-right {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii00IDAgMjQgNDAiIHdpZHRoPSIyNCIgaGVpZ2h0PSI0MCI+PGcgdHJhbnNmb3JtPSJyb3RhdGUoNDUpIj48cGF0aCBkPSJtMC0waDI4djI4aC01di0yM2gtMjN6IiBvcGFjaXR5PSIuNCIvPjxwYXRoIGQ9Im0xIDFoMjZ2MjZoLTN2LTIzaC0yM3oiIGZpbGw9IiNmZmYiLz48L2c+PC9zdmc+");
display: none;
bottom: 0;
right: 0;
}
.w-lightbox-close {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii00IDAgMTggMTciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxNyI+PGcgdHJhbnNmb3JtPSJyb3RhdGUoNDUpIj48cGF0aCBkPSJtMCAwaDd2LTdoNXY3aDd2NWgtN3Y3aC01di03aC03eiIgb3BhY2l0eT0iLjQiLz48cGF0aCBkPSJtMSAxaDd2LTdoM3Y3aDd2M2gtN3Y3aC0zdi03aC03eiIgZmlsbD0iI2ZmZiIvPjwvZz48L3N2Zz4=");
background-size: 18px;
height: 2.6em;
right: 0;
}
.w-lightbox-strip {
white-space: nowrap;
padding: 0 1vh;
line-height: 0;
position: absolute;
bottom: 0;
left: 0;
right: 0;
overflow: auto hidden;
}
.w-lightbox-item {
box-sizing: content-box;
cursor: pointer;
width: 10vh;
padding: 2vh 1vh;
display: inline-block;
-webkit-transform: translate3d(0, 0, 0);
}
.w-lightbox-active {
opacity: .3;
}
.w-lightbox-thumbnail {
background: #222;
height: 10vh;
position: relative;
overflow: hidden;
}
.w-lightbox-thumbnail-image {
position: absolute;
top: 0;
left: 0;
}
.w-lightbox-thumbnail .w-lightbox-tall {
width: 100%;
top: 50%;
transform: translate(0, -50%);
}
.w-lightbox-thumbnail .w-lightbox-wide {
height: 100%;
left: 50%;
transform: translate(-50%);
}
.w-lightbox-spinner {
box-sizing: border-box;
border: 5px solid #0006;
border-radius: 50%;
width: 40px;
height: 40px;
margin-top: -20px;
margin-left: -20px;
animation: .8s linear infinite spin;
position: absolute;
top: 50%;
left: 50%;
}
.w-lightbox-spinner:after {
content: "";
border: 3px solid #0000;
border-bottom-color: #fff;
border-radius: 50%;
position: absolute;
inset: -4px;
}
.w-lightbox-hide {
display: none;
}
.w-lightbox-noscroll {
overflow: hidden;
}
@media (min-width: 768px) {
.w-lightbox-content {
height: 96vh;
margin-top: 2vh;
}
.w-lightbox-view, .w-lightbox-view:before {
height: 96vh;
}
.w-lightbox-group, .w-lightbox-group .w-lightbox-view, .w-lightbox-group .w-lightbox-view:before {
height: 84vh;
}
.w-lightbox-image {
max-width: 96vw;
max-height: 96vh;
}
.w-lightbox-group .w-lightbox-image {
max-width: 82.3vw;
max-height: 84vh;
}
.w-lightbox-left, .w-lightbox-right {
opacity: .5;
display: block;
}
.w-lightbox-close {
opacity: .8;
}
.w-lightbox-control:hover {
opacity: 1;
}
}
.w-lightbox-inactive, .w-lightbox-inactive:hover {
opacity: 0;
}
.w-richtext:before, .w-richtext:after {
content: " ";
grid-area: 1 / 1 / 2 / 2;
display: table;
}
.w-richtext:after {
clear: both;
}
.w-richtext[contenteditable="true"]:before, .w-richtext[contenteditable="true"]:after {
white-space: initial;
}
.w-richtext ol, .w-richtext ul {
overflow: hidden;
}
.w-richtext .w-richtext-figure-selected.w-richtext-figure-type-video div:after, .w-richtext .w-richtext-figure-selected[data-rt-type="video"] div:after, .w-richtext .w-richtext-figure-selected.w-richtext-figure-type-image div, .w-richtext .w-richtext-figure-selected[data-rt-type="image"] div {
outline: 2px solid #2895f7;
}
.w-richtext figure.w-richtext-figure-type-video > div:after, .w-richtext figure[data-rt-type="video"] > div:after {
content: "";
display: none;
position: absolute;
inset: 0;
}
.w-richtext figure {
max-width: 60%;
position: relative;
}
.w-richtext figure > div:before {
cursor: default !important;
}
.w-richtext figure img {
width: 100%;
}
.w-richtext figure figcaption.w-richtext-figcaption-placeholder {
opacity: .6;
}
.w-richtext figure div {
color: #0000;
font-size: 0;
}
.w-richtext figure.w-richtext-figure-type-image, .w-richtext figure[data-rt-type="image"] {
display: table;
}
.w-richtext figure.w-richtext-figure-type-image > div, .w-richtext figure[data-rt-type="image"] > div {
display: inline-block;
}
.w-richtext figure.w-richtext-figure-type-image > figcaption, .w-richtext figure[data-rt-type="image"] > figcaption {
caption-side: bottom;
display: table-caption;
}
.w-richtext figure.w-richtext-figure-type-video, .w-richtext figure[data-rt-type="video"] {
width: 60%;
height: 0;
}
.w-richtext figure.w-richtext-figure-type-video iframe, .w-richtext figure[data-rt-type="video"] iframe {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.w-richtext figure.w-richtext-figure-type-video > div, .w-richtext figure[data-rt-type="video"] > div {
width: 100%;
}
.w-richtext figure.w-richtext-align-center {
clear: both;
margin-left: auto;
margin-right: auto;
}
.w-richtext figure.w-richtext-align-center.w-richtext-figure-type-image > div, .w-richtext figure.w-richtext-align-center[data-rt-type="image"] > div {
max-width: 100%;
}
.w-richtext figure.w-richtext-align-normal {
clear: both;
}
.w-richtext figure.w-richtext-align-fullwidth {
text-align: center;
clear: both;
width: 100%;
max-width: 100%;
margin-left: auto;
margin-right: auto;
display: block;
}
.w-richtext figure.w-richtext-align-fullwidth > div {
padding-bottom: inherit;
display: inline-block;
}
.w-richtext figure.w-richtext-align-fullwidth > figcaption {
display: block;
}
.w-richtext figure.w-richtext-align-floatleft {
float: left;
clear: none;
margin-right: 15px;
}
.w-richtext figure.w-richtext-align-floatright {
float: right;
clear: none;
margin-left: 15px;
}
.w-nav {
z-index: 1000;
background: #ddd;
position: relative;
}
.w-nav:before, .w-nav:after {
content: " ";
grid-area: 1 / 1 / 2 / 2;
display: table;
}
.w-nav:after {
clear: both;
}
.w-nav-brand {
float: left;
color: #333;
text-decoration: none;
position: relative;
}
.w-nav-link {
vertical-align: top;
color: #222;
text-align: left;
margin-left: auto;
margin-right: auto;
padding: 20px;
text-decoration: none;
display: inline-block;
position: relative;
}
.w-nav-link.w--current {
color: #0082f3;
}
.w-nav-menu {
float: right;
position: relative;
}
[data-nav-menu-open] {
text-align: center;
background: #c8c8c8;
min-width: 200px;
position: absolute;
top: 100%;
left: 0;
right: 0;
overflow: visible;
display: block !important;
}
.w--nav-link-open {
display: block;
position: relative;
}
.w-nav-overlay {
width: 100%;
display: none;
position: absolute;
top: 100%;
left: 0;
right: 0;
overflow: hidden;
}
.w-nav-overlay [data-nav-menu-open] {
top: 0;
}
.w-nav[data-animation="over-left"] .w-nav-overlay {
width: auto;
}
.w-nav[data-animation="over-left"] .w-nav-overlay, .w-nav[data-animation="over-left"] [data-nav-menu-open] {
z-index: 1;
top: 0;
right: auto;
}
.w-nav[data-animation="over-right"] .w-nav-overlay {
width: auto;
}
.w-nav[data-animation="over-right"] .w-nav-overlay, .w-nav[data-animation="over-right"] [data-nav-menu-open] {
z-index: 1;
top: 0;
left: auto;
}
.w-nav-button {
float: right;
cursor: pointer;
-webkit-tap-highlight-color: #0000;
tap-highlight-color: #0000;
-webkit-user-select: none;
user-select: none;
padding: 18px;
font-size: 24px;
display: none;
position: relative;
}
.w-nav-button:focus {
outline: 0;
}
.w-nav-button.w--open {
color: #fff;
background-color: #c8c8c8;
}
.w-nav[data-collapse="all"] .w-nav-menu {
display: none;
}
.w-nav[data-collapse="all"] .w-nav-button, .w--nav-dropdown-open, .w--nav-dropdown-toggle-open {
display: block;
}
.w--nav-dropdown-list-open {
position: static;
}
@media screen and (max-width: 991px) {
.w-nav[data-collapse="medium"] .w-nav-menu {
display: none;
}
.w-nav[data-collapse="medium"] .w-nav-button {
display: block;
}
}
@media screen and (max-width: 767px) {
.w-nav[data-collapse="small"] .w-nav-menu {
display: none;
}
.w-nav[data-collapse="small"] .w-nav-button {
display: block;
}
.w-nav-brand {
padding-left: 10px;
}
}
@media screen and (max-width: 479px) {
.w-nav[data-collapse="tiny"] .w-nav-menu {
display: none;
}
.w-nav[data-collapse="tiny"] .w-nav-button {
display: block;
}
}
.w-tabs {
position: relative;
}
.w-tabs:before, .w-tabs:after {
content: " ";
grid-area: 1 / 1 / 2 / 2;
display: table;
}
.w-tabs:after {
clear: both;
}
.w-tab-menu {
position: relative;
}
.w-tab-link {
vertical-align: top;
text-align: left;
cursor: pointer;
color: #222;
background-color: #ddd;
padding: 9px 30px;
text-decoration: none;
display: inline-block;
position: relative;
}
.w-tab-link.w--current {
background-color: #c8c8c8;
}
.w-tab-link:focus {
outline: 0;
}
.w-tab-content {
display: block;
position: relative;
overflow: hidden;
}
.w-tab-pane {
display: none;
position: relative;
}
.w--tab-active {
display: block;
}
@media screen and (max-width: 479px) {
.w-tab-link {
display: block;
}
}
.w-ix-emptyfix:after {
content: "";
}
@keyframes spin {
0% {
transform: rotate(0);
}
100% {
transform: rotate(360deg);
}
}
.w-dyn-empty {
background-color: #ddd;
padding: 10px;
}
.w-dyn-hide, .w-dyn-bind-empty, .w-condition-invisible {
display: none !important;
}
.wf-layout-layout {
display: grid;
}
.w-layout-grid {
grid-row-gap: 16px;
grid-column-gap: 16px;
grid-template-rows: auto auto;
grid-template-columns: 1fr 1fr;
grid-auto-columns: 1fr;
display: grid;
}
:root {
--background: #f5f4f0;
--font-sans: Geist;
--ink: #0d0e10;
--brand-blue: #3b5bdb;
--ink-2: #3a3b40;
--sky: #9db0ff;
--font-mono: "Geist Mono";
--blue-tint: #e9edfb;
--font-serif: "Instrument Serif";
--background-2: #eceae4;
--line-2: #0d0e1026;
--muted: #66676c;
--radius: 24px;
--card: #fff;
--radius-small: 16px;
--line: #0d0e1014;
--blue-2: #2f4bc4;
}
.w-form-formradioinput--inputType-custom {
border: 1px solid #ccc;
border-radius: 50%;
width: 12px;
height: 12px;
}
.w-form-formradioinput--inputType-custom.w--redirected-focus {
box-shadow: 0 0 3px 1px #3898ec;
}
.w-form-formradioinput--inputType-custom.w--redirected-checked {
border-width: 4px;
border-color: #3898ec;
}
.wr-nav {
z-index: 100;
pointer-events: none;
justify-content: center;
display: flex;
position: fixed;
top: 0;
left: 0;
right: 0;
}
.wr-nav-bar {
pointer-events: auto;
background-color: #f4f3ef00;
border: 1px solid #0000;
justify-content: space-between;
align-items: center;
width: 100%;
max-width: 100%;
height: 76px;
padding-left: 32px;
padding-right: 32px;
display: flex;
}
.wr-logo {
color: #0d0e10;
letter-spacing: -.02em;
white-space: nowrap;
align-items: center;
font-size: 18px;
font-weight: 600;
text-decoration: none;
display: flex;
}
.wr-mark-svg {
width: 22px;
height: 26px;
margin-right: 10px;
}
.wr-nav-links {
grid-column-gap: 24px;
column-gap: 24px;
display: flex;
}
.wr-nav-link {
color: #383b41;
white-space: nowrap;
padding-top: 8px;
padding-bottom: 8px;
font-size: 15px;
font-weight: 500;
text-decoration: none;
position: relative;
}
.wr-nav-actions {
align-items: center;
display: flex;
}
.wr-arrow {
box-sizing: border-box;
}
.wr-btn {
grid-column-gap: 10px;
grid-row-gap: 10px;
border-radius: 999px;
align-items: center;
height: 52px;
padding: 0 22px;
font-size: 16px;
font-weight: 500;
display: inline-flex;
position: relative;
overflow: hidden;
}
.wr-btn--blue {
color: #fff;
background-color: #3b5bdb;
}
.wr-btn--ghost {
color: #0d0e10;
background-color: #fff;
box-shadow: inset 0 0 0 1px #0d0e102e;
}
.wr-fill {
box-sizing: border-box;
}
.wr-h1 {
z-index: 1;
letter-spacing: -.055em;
flex-direction: column;
margin: 0;
font-size: clamp(56px, 9.6vw, 156px);
font-weight: 500;
line-height: .9;
display: flex;
position: relative;
}
.wr-h1-line {
white-space: nowrap;
display: block;
position: relative;
}
.wr-h1-line--1 {
box-sizing: border-box;
}
.wr-h1-line--2 {
align-self: flex-end;
margin-top: clamp(90px, 11vw, 170px);
}
.wr-hero {
flex-direction: column;
padding: 120px 0 0;
display: flex;
position: relative;
overflow: hidden;
}
.wr-hero-btns {
grid-column-gap: 10px;
grid-row-gap: 10px;
flex-wrap: wrap;
display: flex;
}
.wr-hero-copy {
box-sizing: border-box;
}
.wr-hero-foot {
z-index: 2;
grid-column-gap: 32px;
grid-row-gap: 32px;
justify-content: space-between;
align-items: flex-end;
padding: 28px 0 36px;
display: flex;
position: relative;
}
.wr-hero-grid {
pointer-events: none;
justify-content: center;
display: flex;
position: absolute;
}
.wr-hero-grid-in {
grid-template-rows: auto;
grid-template-columns: repeat(12, 1fr);
column-gap: 24px;
width: 100%;
max-width: 1312px;
height: 100%;
padding: 0 32px;
display: grid;
}
.wr-hero-mark {
z-index: 0;
pointer-events: none;
width: clamp(180px, 20vw, 300px);
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.wr-hero-mark-in {
box-sizing: border-box;
}
.wr-hero-proof {
grid-column-gap: 10px;
grid-row-gap: 10px;
text-align: right;
flex-direction: column;
align-items: flex-end;
display: flex;
}
.wr-hero-readout {
box-sizing: border-box;
}
.wr-hero-stage {
flex-direction: column;
flex: 1;
justify-content: center;
padding: 28px 0 8px;
display: flex;
position: relative;
}
.wr-hero-sub {
color: #383b41;
max-width: 440px;
margin: 0 0 22px;
font-size: 19px;
line-height: 1.55;
}
.wr-hero-top {
justify-content: space-between;
align-items: center;
display: flex;
position: relative;
}
.wr-label {
color: #6b6e76;
letter-spacing: .08em;
text-transform: uppercase;
font-family: Geist Mono;
font-size: 12px;
line-height: 16px;
}
.wr-mark-svg-1 {
box-sizing: border-box;
}
.wr-proof-item {
grid-column-gap: 10px;
grid-row-gap: 10px;
color: #383b41;
align-items: center;
font-size: 14px;
display: flex;
}
.wr-runway {
height: 300px;
margin-top: 8px;
position: relative;
overflow: hidden;
}
.wr-runway-rail {
grid-column-gap: 22px;
grid-row-gap: 22px;
display: flex;
}
.wr-runway-track {
grid-column-gap: 22px;
grid-row-gap: 22px;
transform-origin: 50% 0;
display: flex;
position: absolute;
top: 40px;
left: 0;
}
.wr-sel {
opacity: 0;
pointer-events: none;
border: 1.5px solid #3b5bdb;
position: absolute;
}
.wr-serif {
letter-spacing: -.01em;
font-family: Instrument Serif;
font-style: italic;
font-weight: 400;
}
.wr-shot {
background-color: #fff;
border-radius: 14px;
flex: none;
width: 380px;
overflow: hidden;
box-shadow: 0 0 0 1px #0d0e101a, 0 24px 50px #0d0e101a;
}
.wr-shot-bar {
grid-column-gap: 6px;
grid-row-gap: 6px;
border-bottom: 1px solid #0d0e101a;
align-items: center;
height: 28px;
padding: 0 10px;
display: flex;
}
.wr-type {
box-sizing: border-box;
}
.wr-wrap {
width: 100%;
max-width: 1312px;
margin: 0 auto;
padding: 0 32px;
}
.wr-cursor {
z-index: 999;
pointer-events: none;
position: fixed;
top: 0;
left: 0;
}
.wr-cursor-dot {
background-color: #0d0e10;
border-radius: 50%;
width: 10px;
height: 10px;
margin: -5px 0 0 -5px;
}
.wr-cursor-label {
opacity: 0;
color: #fff;
white-space: nowrap;
background-color: #3b5bdb;
border-radius: 999px;
align-items: center;
height: 40px;
padding: 0 16px;
font-size: 13px;
font-weight: 500;
display: flex;
position: absolute;
top: 0;
left: 0;
}
.wr-fx {
box-sizing: border-box;
}
.wr-loader {
z-index: 1000;
background-color: #f4f3ef;
justify-content: center;
align-items: center;
display: flex;
position: fixed;
inset: 0;
}
.wr-loader-word {
letter-spacing: -.05em;
font-size: clamp(48px, 7vw, 104px);
font-weight: 500;
}
.wr-xray {
z-index: 90;
pointer-events: none;
justify-content: center;
display: none;
position: fixed;
inset: 0;
}
.wr-xray-box {
z-index: 91;
opacity: 0;
pointer-events: none;
border: 1.5px solid #3b5bdb;
position: fixed;
top: 0;
left: 0;
}
.wr-xray-cols {
grid-template-rows: auto;
grid-template-columns: repeat(12, 1fr);
column-gap: 24px;
width: 100%;
max-width: 1312px;
padding: 0 32px;
display: grid;
}
.wr-xray-hud {
z-index: 92;
grid-column-gap: 16px;
grid-row-gap: 16px;
color: #fff;
background-color: #0d0e10;
border-radius: 999px;
align-items: center;
padding: 10px 16px;
display: none;
position: fixed;
bottom: 20px;
left: 50%;
}
.wr-xray-tag {
z-index: 92;
opacity: 0;
pointer-events: none;
color: #fff;
white-space: pre;
background-color: #3b5bdb;
border-radius: 3px;
padding: 2px 8px;
position: fixed;
top: 0;
left: 0;
}
.wr-copy {
box-sizing: border-box;
}
.wr-cta-sm {
color: #fff;
white-space: nowrap;
background-color: #0d0e10;
border-radius: 999px;
align-items: center;
height: 42px;
padding: 0 18px;
font-size: 14px;
font-weight: 500;
display: inline-flex;
}
.wr-logo-1 {
grid-column-gap: 10px;
grid-row-gap: 10px;
color: #0d0e10;
letter-spacing: -.02em;
white-space: nowrap;
align-items: center;
font-size: 18px;
font-weight: 600;
display: flex;
}
.wr-mark-svg-1-2 {
box-sizing: border-box;
}
.wr-nav-actions-1 {
grid-column-gap: 8px;
grid-row-gap: 8px;
align-items: center;
display: flex;
}
.wr-nav-bar-1 {
grid-column-gap: 16px;
grid-row-gap: 16px;
pointer-events: auto;
border: 1px solid #0000;
justify-content: space-between;
align-items: center;
width: 100%;
max-width: 100%;
height: 76px;
padding: 0 32px;
display: flex;
}
.wr-nav-link-1 {
color: #383b41;
padding: 8px 0;
font-size: 15px;
font-weight: 500;
position: relative;
}
.wr-nav-links-1 {
grid-column-gap: 28px;
grid-row-gap: 28px;
display: flex;
}
.wr-pill-btn {
color: #0d0e10;
white-space: nowrap;
background-color: #fff;
border-radius: 999px;
align-items: center;
height: 38px;
padding: 0 14px;
font-size: 14px;
font-weight: 500;
display: inline-flex;
position: relative;
box-shadow: inset 0 0 0 1px #0d0e101a;
}
.wr-switch {
grid-column-gap: 8px;
grid-row-gap: 8px;
color: #6b6e76;
letter-spacing: .08em;
text-transform: uppercase;
background-color: #fff;
border-radius: 999px;
align-items: center;
height: 38px;
padding: 0 6px 0 12px;
font-size: 11px;
display: inline-flex;
box-shadow: inset 0 0 0 1px #0d0e101a;
}
.wr-switch-knob {
background-color: #fff;
border-radius: 50%;
width: 16px;
height: 16px;
position: absolute;
top: 3px;
left: 3px;
box-shadow: 0 1px 3px #0003;
}
.wr-switch-text {
box-sizing: border-box;
}
.wr-switch-track {
background-color: #eceae4;
border-radius: 999px;
width: 34px;
height: 22px;
position: relative;
}
.wr-toast {
opacity: 0;
pointer-events: none;
color: #fff;
white-space: nowrap;
background-color: #0d0e10;
border-radius: 8px;
padding: 6px 10px;
font-size: 13px;
position: absolute;
top: 46px;
left: 50%;
}
.wr-label-1 {
color: #6b6e76;
letter-spacing: .08em;
text-transform: uppercase;
font-size: 12px;
line-height: 16px;
}
.wr-lit {
box-sizing: border-box;
}
.wr-serif-1 {
letter-spacing: -.01em;
font-style: italic;
font-weight: 400;
}
.wr-statement {
border-top: 1px solid #0d0e101a;
padding: clamp(120px, 14vw, 220px) 0;
}
.wr-statement-in {
grid-template-rows: auto;
grid-template-columns: repeat(12, 1fr);
column-gap: 24px;
display: grid;
}
.wr-statement-text {
letter-spacing: -.04em;
grid-column: 4 / span 9;
margin: 0;
font-size: clamp(34px, 4.4vw, 68px);
font-weight: 500;
line-height: 1.06;
}
.wr-mt {
margin-top: 18px;
}
.wr-end-h {
letter-spacing: -.045em;
margin: 0;
font-size: clamp(40px, 4vw, 64px);
font-weight: 500;
line-height: 1;
}
.wr-end-p {
color: #c9cbd0;
max-width: 420px;
margin: 0;
}
.wr-btn--line {
color: #fff;
box-shadow: inset 0 0 0 1px #ffffff3d;
}
.wr-btn--white {
color: #0d0e10;
background-color: #fff;
}
.wr-chip {
color: #e6e7ea;
letter-spacing: .06em;
text-transform: uppercase;
border-radius: 999px;
padding: 5px 9px;
font-size: 11px;
box-shadow: inset 0 0 0 1px #ffffff2e;
}
.wr-chips {
grid-column-gap: 6px;
grid-row-gap: 6px;
flex-wrap: wrap;
display: flex;
}
.wr-h2 {
letter-spacing: -.045em;
margin: 0;
font-size: clamp(40px, 5.4vw, 84px);
font-weight: 500;
line-height: .98;
}
.wr-tcard {
grid-column-gap: 32px;
grid-row-gap: 32px;
flex: none;
grid-template-rows: auto;
grid-template-columns: 1fr 280px;
align-items: end;
width: min(66vw, 980px);
display: grid;
position: relative;
}
.wr-tcard.wr-tcard--end {
align-items: flex-start;
margin-right: 120px;
}
.wr-tcard--end {
grid-column-gap: 22px;
grid-row-gap: 22px;
flex-direction: column;
justify-content: center;
align-self: stretch;
width: min(42vw, 560px);
display: flex;
}
.wr-tcard-desc {
color: #c9cbd0;
margin: 0;
font-size: 16px;
line-height: 1.55;
}
.wr-tcard-frame {
z-index: 1;
background-color: #1b1d21;
border-radius: 18px;
display: block;
position: relative;
overflow: hidden;
box-shadow: 0 0 0 1px #ffffff14, 0 40px 80px #0006;
}
.wr-tcard-ghost {
z-index: 0;
pointer-events: none;
color: #0000;
letter-spacing: -.06em;
white-space: nowrap;
font-size: clamp(90px, 10vw, 160px);
font-weight: 600;
line-height: 1;
position: absolute;
bottom: -.42em;
left: -.04em;
}
.wr-tcard-info {
z-index: 1;
grid-column-gap: 14px;
grid-row-gap: 14px;
flex-direction: column;
padding-bottom: 6px;
display: flex;
position: relative;
}
.wr-tcard-links {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-wrap: wrap;
padding-top: 6px;
display: flex;
}
.wr-tcard-name {
letter-spacing: -.04em;
margin: 0;
font-size: 48px;
font-weight: 500;
line-height: 1;
}
.wr-tcard-niche {
color: #9a9da4;
letter-spacing: .08em;
text-transform: uppercase;
font-size: 12px;
}
.wr-tpl {
color: #fff;
background-color: #0d0e10;
position: relative;
overflow: hidden;
}
.wr-tpl-count {
color: #9a9da4;
letter-spacing: .06em;
font-size: 13px;
}
.wr-tpl-head {
grid-column-gap: 24px;
grid-row-gap: 24px;
justify-content: space-between;
align-items: flex-end;
margin-bottom: 56px;
display: flex;
}
.wr-tpl-pin {
flex-direction: column;
justify-content: center;
height: 100vh;
padding: 96px 0 48px;
display: flex;
}
.wr-tpl-progress {
background-color: #ffffff1f;
border-radius: 2px;
height: 2px;
margin-top: 40px;
position: relative;
overflow: hidden;
}
.wr-tpl-track {
grid-column-gap: 40px;
grid-row-gap: 40px;
padding-left: max(32px, 50vw - 624px);
display: flex;
}
.wr-step, .is-on {
box-sizing: border-box;
}
.wr-caption {
letter-spacing: -.01em;
font-size: 20px;
}
.wr-check {
grid-column-gap: 8px;
grid-row-gap: 8px;
color: #0d0e10;
border-radius: 12px;
justify-content: space-between;
align-items: center;
margin-bottom: 10px;
padding: 10px 12px;
font-size: 13px;
display: flex;
box-shadow: inset 0 0 0 1px #0d0e101a;
}
.wr-check-l {
grid-column-gap: 10px;
grid-row-gap: 10px;
align-items: center;
display: flex;
}
.wr-ed-canvas {
background-color: #f4f3ef;
justify-content: center;
align-items: center;
padding: 28px;
display: flex;
position: relative;
}
.wr-ed-cursor {
z-index: 5;
pointer-events: none;
position: absolute;
top: 0;
left: 0;
}
.wr-ed-live {
grid-column-gap: 8px;
grid-row-gap: 8px;
opacity: 0;
color: #1f7a4d;
letter-spacing: .08em;
text-transform: uppercase;
background-color: #fff;
border-radius: 999px;
align-items: center;
padding: 7px 13px;
display: flex;
position: absolute;
bottom: 16px;
right: 16px;
}
.wr-ed-logo {
grid-column-gap: 6px;
grid-row-gap: 6px;
opacity: 0;
color: #2b1d16;
background-color: #fff;
border-radius: 999px;
align-items: center;
height: 5.6%;
padding: 0 10px;
font-size: 13px;
font-weight: 600;
display: flex;
position: absolute;
top: 2.3%;
left: 3.2%;
}
.wr-ed-panel-title {
box-sizing: border-box;
}
.wr-ed-shot {
position: relative;
overflow: hidden;
}
.wr-ed-side {
grid-column-gap: 2px;
grid-row-gap: 2px;
border-right: 1px solid #0d0e101a;
flex-direction: column;
padding: 16px;
font-size: 13px;
display: flex;
}
.wr-ed-side--r {
grid-column-gap: 10px;
grid-row-gap: 10px;
border-left: 1px solid #0d0e101a;
}
.wr-ed-site {
background-color: #fff;
border-radius: 14px;
width: 100%;
max-width: 760px;
position: relative;
overflow: hidden;
}
.wr-ed-title {
color: #6b6e76;
letter-spacing: .08em;
text-transform: uppercase;
margin-bottom: 10px;
font-size: 11px;
}
.wr-ed-url {
box-sizing: border-box;
}
.wr-editor {
background-color: #fff;
border-radius: 22px;
flex: 1;
grid-template-rows: auto;
grid-template-columns: 220px 1fr 260px;
min-height: 0;
display: grid;
overflow: hidden;
}
.wr-layer {
color: #383b41;
border-radius: 7px;
padding: 7px 10px 7px 24px;
}
.wr-layer--root {
color: #0d0e10;
padding-left: 10px;
font-weight: 500;
}
.wr-panel, .wr-panel--changes {
box-sizing: border-box;
}
.wr-panel--launch {
display: none;
}
.wr-price-big {
letter-spacing: -.05em;
font-size: 64px;
font-weight: 500;
line-height: 1;
}
.wr-price-tag {
grid-column-gap: 6px;
grid-row-gap: 6px;
flex-direction: column;
align-items: flex-end;
display: flex;
}
.wr-setup {
position: relative;
}
.wr-setup-foot {
grid-column-gap: 24px;
grid-row-gap: 24px;
align-items: center;
padding-top: 22px;
display: flex;
}
.wr-setup-head {
grid-column-gap: 24px;
grid-row-gap: 24px;
justify-content: space-between;
align-items: flex-end;
margin-bottom: 28px;
display: flex;
}
.wr-setup-pin {
flex-direction: column;
height: 100vh;
min-height: 760px;
padding: 116px 0 28px;
display: flex;
}
.wr-steps {
grid-column-gap: 6px;
grid-row-gap: 6px;
display: flex;
}
.wr-tick {
box-sizing: border-box;
}
.wr-svc-left {
grid-column: 1 / span 8;
}
.wr-svc-intro {
color: #383b41;
grid-column: 9 / span 4;
margin: 0;
}
.wr-care, .wr-care-per {
box-sizing: border-box;
}
.wr-row {
border-bottom: 1px solid #0d0e102e;
grid-template-rows: auto;
grid-template-columns: 3fr 3fr 4fr 2fr;
align-items: center;
column-gap: 24px;
padding: 36px 0;
display: grid;
position: relative;
}
.wr-row--feature {
box-sizing: border-box;
}
.wr-row-desc {
color: #383b41;
margin: 0;
font-size: 16px;
}
.wr-row-end {
grid-column-gap: 12px;
grid-row-gap: 12px;
flex-direction: column;
align-items: flex-end;
display: flex;
}
.wr-row-name {
letter-spacing: -.03em;
font-size: 30px;
font-weight: 500;
line-height: 1.1;
}
.wr-row-price {
letter-spacing: -.05em;
white-space: nowrap;
font-size: 64px;
font-weight: 500;
line-height: 1;
}
.wr-rows {
border-top: 1px solid #0d0e10;
}
.wr-services {
padding: clamp(120px, 12vw, 180px) 0;
}
.wr-services-head {
grid-template-rows: auto;
grid-template-columns: repeat(12, 1fr);
align-items: end;
column-gap: 24px;
margin-bottom: 56px;
display: grid;
}
.wr-toggle {
background-color: #eceae4;
border-radius: 999px;
margin-top: 12px;
padding: 3px;
display: inline-flex;
}
.wr-work-intro {
color: #383b41;
max-width: 420px;
margin: 0;
}
.wr-hover-img {
z-index: 60;
opacity: 0;
pointer-events: none;
border-radius: 16px;
width: 380px;
position: fixed;
top: 0;
left: 0;
overflow: hidden;
}
.wr-index {
border-top: 1px solid #0d0e10;
margin-top: clamp(100px, 10vw, 160px);
}
.wr-index-head {
border-bottom: 1px solid #0d0e102e;
justify-content: space-between;
padding: 14px 0;
display: flex;
}
.wr-irow {
grid-column-gap: 24px;
grid-row-gap: 24px;
color: #0d0e10;
border-bottom: 1px solid #0d0e102e;
grid-template-rows: auto;
grid-template-columns: 56px 4fr 4fr 3fr 2fr;
align-items: baseline;
padding: 26px 0;
display: grid;
position: relative;
}
.wr-irow-n {
color: #6b6e76;
font-size: 12px;
}
.wr-irow-name {
letter-spacing: -.035em;
font-size: clamp(24px, 2.4vw, 36px);
font-weight: 500;
line-height: 1.1;
}
.wr-irow-s, .wr-irow-sv {
color: #383b41;
font-size: 15px;
}
.wr-irow-y {
color: #6b6e76;
text-align: right;
letter-spacing: .04em;
white-space: nowrap;
font-size: 12px;
}
.wr-tag {
color: #383b41;
letter-spacing: .06em;
text-transform: uppercase;
white-space: nowrap;
border-radius: 999px;
padding: 5px 9px;
font-size: 11px;
box-shadow: inset 0 0 0 1px #0d0e102e;
}
.wr-wcard {
grid-column-gap: 18px;
grid-row-gap: 18px;
color: #0d0e10;
flex-direction: column;
display: flex;
position: relative;
}
.wr-wcard-media {
background-color: #fff;
border-radius: 22px;
position: relative;
overflow: hidden;
}
.wr-wcard-meta {
grid-column-gap: 16px;
grid-row-gap: 16px;
justify-content: space-between;
align-items: flex-start;
display: flex;
}
.wr-wcard-name {
letter-spacing: -.03em;
margin: 0;
font-size: 32px;
font-weight: 500;
line-height: 1.05;
}
.wr-wcard-tags {
grid-column-gap: 6px;
grid-row-gap: 6px;
flex-wrap: wrap;
justify-content: flex-end;
display: flex;
}
.wr-wcard-what {
color: #383b41;
margin: 6px 0 0;
font-size: 16px;
}
.wr-work {
padding: 0 0 clamp(120px, 12vw, 180px);
}
.wr-work-grid {
grid-column-gap: 24px;
grid-row-gap: 24px;
grid-template-rows: auto;
grid-template-columns: 7fr 5fr;
row-gap: 72px;
display: grid;
}
.wr-work-head {
grid-column-gap: 24px;
grid-row-gap: 24px;
justify-content: space-between;
align-items: flex-end;
margin-bottom: 48px;
display: flex;
}
.wr-vbar-pos {
position: absolute;
bottom: -28px;
left: 0;
right: 0;
}
.wr-quote {
grid-column-gap: 32px;
grid-row-gap: 32px;
opacity: 0;
pointer-events: none;
flex-direction: column;
justify-content: space-between;
margin: 0;
display: flex;
position: absolute;
inset: 0;
}
.wr-quote-av {
color: #383b41;
background-color: #eceae4;
border-radius: 50%;
justify-content: center;
align-items: center;
width: 44px;
height: 44px;
display: flex;
}
.wr-voices {
background-color: #fff;
border-top: 1px solid #0d0e101a;
border-bottom: 1px solid #0d0e101a;
padding: clamp(110px, 11vw, 170px) 0;
}
.wr-voices-bar {
background-color: #0d0e101a;
height: 2px;
position: relative;
overflow: hidden;
}
.wr-voices-in {
grid-template-rows: auto;
grid-template-columns: repeat(12, 1fr);
gap: 48px 24px;
display: grid;
}
.wr-voices-l {
grid-column-gap: 40px;
grid-row-gap: 40px;
flex-direction: column;
grid-column: 1 / span 4;
justify-content: space-between;
display: flex;
}
.wr-voices-r {
grid-column: 6 / span 7;
min-height: 340px;
position: relative;
}
.wr-voices-who {
border-top: 1px solid #0d0e102e;
flex-direction: column;
display: flex;
}
.wr-who {
grid-column-gap: 12px;
grid-row-gap: 12px;
color: #6b6e76;
border-bottom: 1px solid #0d0e102e;
justify-content: space-between;
align-items: center;
padding: 16px 0;
font-size: 16px;
font-weight: 500;
display: flex;
}
.wr-faq-note {
color: #383b41;
max-width: 340px;
margin: 0;
}
.wr-a-in {
overflow: hidden;
}
.wr-a-p {
color: #383b41;
margin: 0;
padding: 0 64px 28px 0;
}
.is-open {
box-sizing: border-box;
}
.wr-a {
display: grid;
}
.wr-faq {
border-top: 1px solid #0d0e101a;
padding: clamp(100px, 10vw, 160px) 0;
}
.wr-faq-in {
grid-template-rows: auto;
grid-template-columns: repeat(12, 1fr);
column-gap: 24px;
display: grid;
}
.wr-faq-l {
grid-column-gap: 20px;
grid-row-gap: 20px;
flex-direction: column;
grid-column: 1 / span 4;
display: flex;
}
.wr-faq-list {
border-top: 1px solid #0d0e10;
grid-column: 6 / span 7;
}
.wr-q {
grid-column-gap: 24px;
grid-row-gap: 24px;
color: #0d0e10;
letter-spacing: -.015em;
justify-content: space-between;
align-items: center;
width: 100%;
padding: 26px 0;
font-size: 21px;
font-weight: 500;
line-height: 1.35;
display: flex;
}
.wr-qa {
border-bottom: 1px solid #0d0e102e;
}
.wr-cta {
text-align: center;
border-top: 1px solid #0d0e101a;
padding: clamp(120px, 14vw, 220px) 0;
position: relative;
overflow: hidden;
}
.wr-cta-btns {
grid-column-gap: 12px;
grid-row-gap: 12px;
flex-wrap: wrap;
justify-content: center;
margin-top: 48px;
display: flex;
}
.wr-cta-h {
letter-spacing: -.055em;
max-width: 1100px;
margin: 0 auto;
font-size: clamp(52px, 8.6vw, 140px);
font-weight: 500;
line-height: .92;
}
.wr-cta-mark {
width: 120px;
margin: 0 auto 40px;
}
.wr-mag {
margin: -16px;
padding: 16px;
display: inline-flex;
}
.wr-foot-link {
color: #383b41;
}
.wr-foot-bot {
grid-column-gap: 16px;
grid-row-gap: 16px;
color: #6b6e76;
justify-content: space-between;
font-size: 13px;
display: flex;
}
.wr-foot-col {
grid-column-gap: 10px;
grid-row-gap: 10px;
color: #383b41;
flex-direction: column;
font-size: 15px;
display: flex;
}
.wr-foot-hello {
grid-column-gap: 12px;
grid-row-gap: 12px;
flex-direction: column;
grid-column: 1 / span 5;
align-items: flex-start;
display: flex;
}
.wr-foot-hint {
color: #6b6e76;
font-size: 13px;
}
.wr-foot-mail {
color: #0d0e10;
letter-spacing: -.03em;
font-size: 40px;
font-weight: 500;
line-height: 1.1;
position: relative;
}
.wr-foot-top {
grid-template-rows: auto;
grid-template-columns: repeat(12, 1fr);
gap: 40px 24px;
display: grid;
}
.wr-footer {
border-top: 1px solid #0d0e101a;
padding: 64px 0 28px;
}
.wr-wordmark {
color: #0d0e10;
letter-spacing: -.06em;
white-space: nowrap;
margin: 72px 0 24px;
font-size: 17vw;
font-weight: 600;
line-height: .8;
display: block;
}
.wr-chip-1 {
color: #e6e7ea;
letter-spacing: .06em;
text-transform: uppercase;
border-radius: 999px;
padding: 5px 9px;
box-shadow: inset 0 0 0 1px #ffffff2e;
}
.wr-tcard-frame-1 {
z-index: 1;
background-color: #1b1d21;
border-radius: 18px;
display: block;
position: relative;
overflow: hidden;
}
.wr-tcard-ghost-1 {
z-index: 0;
pointer-events: none;
color: #0000;
letter-spacing: -.06em;
white-space: nowrap;
font-weight: 600;
line-height: 1;
position: absolute;
bottom: -.42em;
left: -.04em;
}
.wr-tcard-niche-1 {
color: #9a9da4;
letter-spacing: .08em;
text-transform: uppercase;
}
.wr-chip-1-2, .wr-tcard-frame-1-2, .wr-tcard-ghost-1-2, .wr-tcard-niche-1-2, .wr-chip-1-2-3, .wr-tcard-frame-1-2-3, .wr-tcard-ghost-1-2-3, .wr-tcard-niche-1-2-3, .wr-tcard--end-1, .wr-label-1-2, .wr-end-h-1, .wr-serif-1-2, .wr-end-p-1, .wr-ed-side-1, .wr-ed-side--r-1, .wr-ed-title-1, .wr-check-1, .wr-check-l-1, .wr-check-v, .wr-ed-shot-1, .wr-ed-logo-1, .wr-ed-live-1, .wr-ed-cursor-1, .wr-ed-tag {
box-sizing: border-box;
}
.wr-nav-link-1-2 {
color: #383b41;
padding: 8px 0;
font-size: 15px;
font-weight: 500;
position: relative;
}
.wr-nav-links-1-2 {
grid-column-gap: 28px;
grid-row-gap: 28px;
display: flex;
}
.wr-door {
grid-column-gap: 22px;
grid-row-gap: 22px;
border-radius: 28px;
flex-direction: column;
min-height: 520px;
padding: 36px;
display: flex;
position: relative;
overflow: hidden;
}
.wr-door--dfy {
color: #fff;
background-color: #0d0e10;
}
.wr-door--diy {
background-color: #fff;
box-shadow: 0 0 0 1px #0d0e101a;
}
.wr-door-circle {
color: #fff;
background-color: #0d0e10;
border-radius: 50%;
justify-content: center;
align-items: center;
width: 52px;
height: 52px;
font-size: 20px;
display: flex;
}
.wr-door-cta {
border-top: 1px solid #0d0e101a;
justify-content: space-between;
align-items: center;
padding-top: 22px;
font-size: 18px;
font-weight: 500;
display: flex;
}
.wr-door-desc {
color: #383b41;
max-width: 440px;
margin: 0;
font-size: 17px;
}
.wr-door-glow {
z-index: -1;
opacity: 0;
position: absolute;
}
.wr-door-num {
letter-spacing: -.05em;
font-size: 44px;
font-weight: 500;
line-height: 1;
}
.wr-door-pre {
color: #6b6e76;
letter-spacing: .08em;
text-transform: uppercase;
}
.wr-door-price {
text-align: right;
}
.wr-door-pt {
grid-column-gap: 10px;
grid-row-gap: 10px;
align-items: center;
font-size: 15px;
display: flex;
}
.wr-door-pts {
grid-column-gap: 10px;
grid-row-gap: 10px;
flex-direction: column;
display: flex;
}
.wr-door-tag {
color: #383b41;
letter-spacing: .08em;
text-transform: uppercase;
border-radius: 999px;
padding: 6px 10px;
box-shadow: inset 0 0 0 1px #0d0e102e;
}
.wr-door-tick {
color: #3b5bdb;
background-color: #e7ecff;
border-radius: 50%;
flex: none;
justify-content: center;
align-items: center;
width: 22px;
height: 22px;
display: flex;
}
.wr-door-title {
letter-spacing: -.055em;
margin: auto 0 0;
font-size: clamp(56px, 6.4vw, 104px);
font-weight: 500;
line-height: .9;
}
.wr-door-top {
grid-column-gap: 16px;
grid-row-gap: 16px;
justify-content: space-between;
align-items: flex-start;
display: flex;
}
.wr-doors {
border-top: 1px solid #0d0e101a;
padding: clamp(110px, 12vw, 180px) 0 clamp(90px, 9vw, 140px);
}
.wr-doors-grid {
grid-column-gap: 20px;
grid-row-gap: 20px;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr;
display: grid;
}
.wr-sec-head {
grid-column-gap: 40px;
grid-row-gap: 40px;
justify-content: space-between;
align-items: flex-end;
margin-bottom: 56px;
display: flex;
}
.wr-sec-intro {
color: #383b41;
max-width: 420px;
margin: 0;
font-size: 17px;
}
.wr-cmp {
background-color: #fff;
border-radius: 28px;
overflow: hidden;
box-shadow: 0 0 0 1px #0d0e101a;
}
.wr-cmp-a {
grid-column-gap: 14px;
grid-row-gap: 14px;
color: #6b6e76;
align-items: center;
font-size: 17px;
display: flex;
}
.wr-cmp-b {
grid-column-gap: 14px;
grid-row-gap: 14px;
color: #0d0e10;
background-color: #e7ecff73;
align-items: center;
height: 100%;
font-size: 17px;
font-weight: 500;
display: flex;
}
.wr-cmp-ha {
box-sizing: border-box;
}
.wr-cmp-hb {
grid-column-gap: 10px;
grid-row-gap: 10px;
color: #0d0e10;
background-color: #e7ecff;
align-items: center;
display: flex;
}
.wr-cmp-head {
color: #6b6e76;
letter-spacing: .08em;
text-transform: uppercase;
border-bottom: 1px solid #0d0e101a;
grid-template-rows: auto;
grid-template-columns: 2fr 5fr 5fr;
align-items: center;
display: grid;
}
.wr-cmp-k {
color: #6b6e76;
letter-spacing: .08em;
text-transform: uppercase;
}
.wr-cmp-row {
border-bottom: 1px solid #0d0e101a;
grid-template-rows: auto;
grid-template-columns: 2fr 5fr 5fr;
align-items: center;
display: grid;
}
.wr-cmp-v {
color: #fff;
background-color: #3b5bdb;
border-radius: 50%;
flex: none;
justify-content: center;
align-items: center;
width: 26px;
height: 26px;
display: flex;
transform: scale(0);
}
.wr-cmp-x {
color: #6b6e76;
border-radius: 50%;
flex: none;
justify-content: center;
align-items: center;
width: 26px;
height: 26px;
display: flex;
box-shadow: inset 0 0 0 1px #0d0e102e;
}
.wr-mark-svg-1-2-3 {
box-sizing: border-box;
}
.wr-whyt {
padding: clamp(110px, 11vw, 170px) 0;
}
.wr-acc {
color: #fff;
background-color: #0d0e10;
padding: clamp(110px, 11vw, 170px) 0;
position: relative;
overflow: hidden;
}
.wr-acc-badge {
z-index: 5;
letter-spacing: .06em;
text-transform: uppercase;
background-color: #3b5bdb;
border-radius: 50%;
flex-direction: column;
justify-content: center;
align-items: center;
width: 132px;
height: 132px;
display: flex;
position: absolute;
bottom: 6%;
right: 4%;
box-shadow: 0 20px 50px #3b5bdb80;
}
.wr-acc-badge-n {
letter-spacing: -.04em;
text-transform: none;
}
.wr-acc-btns {
grid-column-gap: 20px;
grid-row-gap: 20px;
flex-wrap: wrap;
align-items: center;
display: flex;
}
.wr-acc-card {
background-color: #1b1d21;
border-radius: 16px;
width: 76%;
position: absolute;
top: 50%;
left: 50%;
overflow: hidden;
box-shadow: 0 0 0 1px #ffffff14, 0 40px 90px #00000080;
}
.wr-acc-card--1, .wr-acc-card--2, .wr-acc-card--3, .wr-acc-copy {
box-sizing: border-box;
}
.wr-acc-in {
grid-column-gap: 48px;
grid-row-gap: 48px;
grid-template-rows: auto;
grid-template-columns: 5fr 6fr;
align-items: center;
display: grid;
position: relative;
}
.wr-acc-note {
color: #9a9da4;
letter-spacing: .04em;
}
.wr-acc-num {
letter-spacing: -.06em;
font-size: clamp(88px, 10vw, 160px);
font-weight: 500;
line-height: .85;
}
.wr-acc-per {
color: #9a9da4;
letter-spacing: .08em;
text-transform: uppercase;
}
.wr-acc-price {
grid-column-gap: 12px;
grid-row-gap: 12px;
align-items: baseline;
margin: 40px 0 28px;
display: flex;
}
.wr-acc-pt {
grid-column-gap: 12px;
grid-row-gap: 12px;
color: #e6e7ea;
align-items: center;
font-size: 17px;
display: flex;
}
.wr-acc-pts {
grid-column-gap: 12px;
grid-row-gap: 12px;
flex-direction: column;
margin-bottom: 36px;
display: flex;
}
.wr-acc-stack {
height: 520px;
position: relative;
}
.wr-btn--ink {
color: #fff;
background-color: #0d0e10;
}
.wr-btn--sm {
height: 46px;
padding: 0 18px;
font-size: 15px;
}
.wr-chip-f {
grid-column-gap: 8px;
grid-row-gap: 8px;
color: #383b41;
background-color: #fff;
border-radius: 999px;
align-items: center;
height: 42px;
padding: 0 8px 0 16px;
font-size: 15px;
font-weight: 500;
display: inline-flex;
box-shadow: inset 0 0 0 1px #0d0e101a;
}
.wr-chip-n {
color: #383b41;
background-color: #eceae4;
border-radius: 999px;
justify-content: center;
align-items: center;
min-width: 26px;
height: 26px;
padding: 0 8px;
display: flex;
}
.wr-filter {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-wrap: wrap;
align-items: center;
margin: -24px 0 32px;
display: flex;
}
.wr-filter-note {
color: #6b6e76;
letter-spacing: .06em;
text-transform: uppercase;
margin-left: auto;
}
.wr-lib {
padding: clamp(90px, 9vw, 140px) 0 clamp(110px, 11vw, 170px);
}
.wr-lib-grid {
grid-column-gap: 24px;
grid-row-gap: 24px;
grid-template-rows: auto;
grid-template-columns: repeat(3, 1fr);
display: grid;
}
.wr-plat {
grid-column-gap: 7px;
grid-row-gap: 7px;
color: #383b41;
letter-spacing: .06em;
text-transform: uppercase;
border-radius: 999px;
align-items: center;
padding: 6px 10px;
display: inline-flex;
box-shadow: inset 0 0 0 1px #0d0e102e;
}
.wr-plat--framer, .wr-plat--webflow {
box-sizing: border-box;
}
.wr-plat-dot {
background-color: #146ef5;
border-radius: 2px;
width: 8px;
height: 8px;
}
.wr-tc {
background-color: #fff;
border-radius: 24px;
flex-direction: column;
display: flex;
overflow: hidden;
box-shadow: 0 0 0 1px #0d0e101a;
}
.wr-tc-body {
grid-column-gap: 14px;
grid-row-gap: 14px;
flex-direction: column;
padding: 22px 24px 24px;
display: flex;
}
.wr-tc-btns {
grid-column-gap: 8px;
grid-row-gap: 8px;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr;
margin-top: 4px;
display: grid;
}
.wr-tc-desc {
color: #383b41;
margin: 0;
font-size: 15px;
line-height: 1.55;
}
.wr-tc-frame {
background-color: #f4f3ef;
border-radius: 16px;
margin: 10px 10px 0;
display: block;
position: relative;
overflow: hidden;
box-shadow: 0 0 0 1px #0d0e101a;
}
.wr-tc-live {
grid-column-gap: 8px;
grid-row-gap: 8px;
opacity: 0;
color: #fff;
background-color: #0d0e10;
border-radius: 999px;
align-items: center;
padding: 9px 14px;
font-size: 13px;
font-weight: 500;
display: flex;
position: absolute;
bottom: 16px;
left: 50%;
}
.wr-tc-live-dot {
background-color: #4ade80;
border-radius: 50%;
width: 7px;
height: 7px;
box-shadow: 0 0 0 3px #4ade8040;
}
.wr-tc-media {
overflow: hidden;
}
.wr-tc-name {
letter-spacing: -.04em;
margin: 6px 0 0;
font-size: 32px;
font-weight: 500;
line-height: 1;
}
.wr-tc-niche {
color: #6b6e76;
letter-spacing: .08em;
text-transform: uppercase;
}
.wr-tc-plats {
grid-column-gap: 6px;
grid-row-gap: 6px;
flex-wrap: wrap;
display: flex;
}
.wr-tc-price {
letter-spacing: -.04em;
background-color: #f4f3ef;
border-radius: 999px;
padding: 4px 12px;
font-size: 26px;
font-weight: 500;
}
.wr-tc-row {
grid-column-gap: 12px;
grid-row-gap: 12px;
justify-content: space-between;
align-items: flex-start;
display: flex;
}
.wr-price-big-1 {
letter-spacing: -.05em;
}
.wr-step-1 {
grid-column-gap: 14px;
grid-row-gap: 14px;
background-color: #0000;
border-radius: 16px;
align-items: flex-start;
padding: 16px 18px;
display: flex;
position: relative;
overflow: hidden;
box-shadow: inset 0 0 0 1px #0d0e101a;
}
.wr-step-d {
color: #6b6e76;
margin-top: 2px;
font-size: 14px;
}
.wr-step-n {
color: #6b6e76;
padding-top: 3px;
}
.wr-step-t {
letter-spacing: -.01em;
font-size: 17px;
font-weight: 500;
}
.wr-care-per-1 {
color: #6b6e76;
letter-spacing: 0;
font-size: .3em;
}
.wr-row-pre {
color: #6b6e76;
letter-spacing: .06em;
text-transform: uppercase;
vertical-align: top;
margin: .5em 6px 0 0;
display: inline-block;
}
.wr-row-price-1 {
letter-spacing: -.05em;
white-space: nowrap;
}
.wr-row-sub {
color: #6b6e76;
letter-spacing: .08em;
text-transform: uppercase;
margin-top: 8px;
}
.wr-bento {
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-rows: auto;
grid-template-columns: repeat(4, 1fr);
grid-auto-rows: 240px;
display: grid;
}
.wr-bt {
grid-column-gap: 10px;
grid-row-gap: 10px;
background-color: #fff;
border-radius: 24px;
flex-direction: column;
justify-content: flex-end;
padding: 28px;
display: flex;
position: relative;
overflow: hidden;
box-shadow: 0 0 0 1px #0d0e101a;
}
.wr-bt--big {
background-image: linear-gradient(160deg, #fff 40%, #e7ecff);
grid-row-start: span 2;
grid-column-start: span 2;
}
.wr-bt--blue {
color: #fff;
background-color: #3b5bdb;
}
.wr-bt--dark {
color: #fff;
background-color: #0d0e10;
}
.wr-bt-chips {
grid-column-gap: 8px;
grid-row-gap: 8px;
display: flex;
position: absolute;
top: 26px;
left: 28px;
}
.wr-bt-d {
color: #383b41;
max-width: 360px;
margin: 0;
font-size: 15px;
}
.wr-bt-face {
color: #fff;
background-color: #0d0e10;
border-radius: 50%;
justify-content: center;
align-items: center;
width: 44px;
height: 44px;
margin-right: -10px;
display: flex;
box-shadow: 0 0 0 3px #fff;
}
.wr-bt-face--more {
color: #0d0e10;
background-color: #eceae4;
}
.wr-bt-faces {
margin-top: 14px;
display: flex;
}
.wr-bt-num {
letter-spacing: -.07em;
align-items: flex-start;
margin-bottom: auto;
font-size: clamp(120px, 14vw, 220px);
font-weight: 500;
line-height: .8;
display: flex;
}
.wr-bt-pin {
background-color: #fff;
border-radius: 50%;
width: 14px;
height: 14px;
position: absolute;
top: 30px;
right: 34px;
}
.wr-bt-ping {
border: 2px solid #ffffffb3;
border-radius: 50%;
position: absolute;
}
.wr-bt-plus {
color: #3b5bdb;
margin-left: .04em;
font-size: .4em;
}
.wr-bt-ql {
color: #6b6e76;
}
.wr-bt-qs {
color: #1f7a4d;
letter-spacing: .06em;
text-transform: uppercase;
background-color: #e3f3ea;
border-radius: 999px;
padding: 3px 8px;
}
.wr-bt-quote {
grid-column-gap: 10px;
grid-row-gap: 10px;
background-color: #f4f3ef;
border-radius: 14px;
align-items: center;
padding: 10px 12px;
font-size: 13px;
display: flex;
position: absolute;
top: 24px;
left: 28px;
right: 28px;
}
.wr-bt-qv {
margin-left: auto;
font-size: 15px;
font-weight: 500;
}
.wr-bt-stack {
display: flex;
position: absolute;
top: 26px;
left: 28px;
}
.wr-bt-t {
letter-spacing: -.03em;
margin: 0;
font-size: 24px;
font-weight: 500;
line-height: 1.1;
}
.wr-why {
border-top: 1px solid #0d0e101a;
padding: clamp(110px, 11vw, 170px) 0 clamp(90px, 9vw, 140px);
}
.wr-care-per-1-2 {
color: #6b6e76;
letter-spacing: 0;
font-size: .3em;
}
.wr-row-price-1-2 {
letter-spacing: -.05em;
white-space: nowrap;
}
.wr-journal {
border-top: 1px solid #0d0e101a;
padding: clamp(90px, 9vw, 140px) 0 clamp(110px, 11vw, 170px);
}
.wr-journal-grid {
grid-column-gap: 24px;
grid-row-gap: 24px;
grid-template-rows: auto;
grid-template-columns: repeat(3, 1fr);
display: grid;
}
.wr-post {
grid-column-gap: 14px;
grid-row-gap: 14px;
flex-direction: column;
display: flex;
}
.wr-post--1, .wr-post--2, .wr-post--3 {
box-sizing: border-box;
}
.wr-post-art {
border-radius: 22px;
align-items: flex-end;
padding: 24px;
display: flex;
position: relative;
overflow: hidden;
}
.wr-post-big {
z-index: 1;
letter-spacing: -.03em;
font-family: Instrument Serif;
font-size: clamp(80px, 9vw, 140px);
font-style: italic;
line-height: .8;
position: relative;
}
.wr-post-cat {
color: #3b5bdb;
}
.wr-post-date {
box-sizing: border-box;
}
.wr-post-lines {
position: absolute;
}
.wr-post-meta {
grid-column-gap: 12px;
grid-row-gap: 12px;
color: #6b6e76;
letter-spacing: .08em;
text-transform: uppercase;
display: flex;
}
.wr-post-read {
grid-column-gap: 8px;
grid-row-gap: 8px;
color: #383b41;
align-items: center;
font-size: 15px;
font-weight: 500;
display: flex;
}
.wr-post-t {
letter-spacing: -.03em;
margin: 0;
font-size: 24px;
font-weight: 500;
line-height: 1.15;
}
.wr-mark-svg-1-2-3-4 {
box-sizing: border-box;
}
.wr-mem {
grid-column-gap: 18px;
grid-row-gap: 18px;
flex-direction: column;
display: flex;
}
.wr-mem-ini {
color: #0d0e10;
letter-spacing: -.06em;
font-size: clamp(72px, 8vw, 120px);
font-weight: 500;
position: relative;
}
.wr-mem-mark {
opacity: .5;
width: 62%;
height: auto;
position: absolute;
}
.wr-mem-meta {
box-sizing: border-box;
}
.wr-mem-n {
letter-spacing: -.03em;
margin: 0;
font-size: 28px;
font-weight: 500;
}
.wr-mem-photo {
border-radius: 24px;
justify-content: center;
align-items: center;
display: flex;
position: relative;
overflow: hidden;
}
.wr-mem-photo--1 {
background-image: linear-gradient(160deg, #e7ecff, #c9d3ff);
}
.wr-mem-photo--2 {
background-image: linear-gradient(160deg, #eceae4, #d8d4ca);
}
.wr-mem-photo--3 {
background-image: linear-gradient(160deg, #1b1d21, #0d0e10);
}
.wr-mem-r {
color: #3b5bdb;
letter-spacing: .08em;
text-transform: uppercase;
margin-top: 4px;
}
.wr-mem-s {
color: #6b6e76;
margin-top: 4px;
font-size: 15px;
}
.wr-team {
padding: clamp(110px, 11vw, 170px) 0 clamp(90px, 9vw, 140px);
}
.wr-team-grid {
grid-column-gap: 24px;
grid-row-gap: 24px;
grid-template-rows: auto;
grid-template-columns: repeat(3, 1fr);
display: grid;
}
.wr-marq {
display: flex;
overflow: hidden;
}
.wr-marq--rev {
box-sizing: border-box;
}
.wr-marq-rail {
grid-column-gap: 20px;
grid-row-gap: 20px;
padding-right: 20px;
display: flex;
}
.wr-rev {
grid-column-gap: 18px;
grid-row-gap: 18px;
background-color: #f4f3ef;
border-radius: 22px;
flex-direction: column;
flex: none;
width: 420px;
margin: 0;
padding: 28px;
display: flex;
box-shadow: 0 0 0 1px #0d0e101a;
}
.wr-rev--sample {
box-sizing: border-box;
}
.wr-rev-av {
color: #fff;
background-color: #0d0e10;
border-radius: 50%;
justify-content: center;
align-items: center;
width: 42px;
height: 42px;
display: flex;
}
.wr-rev-n {
font-size: 15px;
font-weight: 500;
}
.wr-rev-q {
letter-spacing: -.02em;
flex: 1;
margin: 0;
font-size: 20px;
font-weight: 500;
line-height: 1.35;
}
.wr-rev-r {
color: #6b6e76;
font-size: 13px;
}
.wr-rev-stars {
color: #f5a524;
letter-spacing: 2px;
font-size: 15px;
}
.wr-rev-who {
grid-column-gap: 12px;
grid-row-gap: 12px;
align-items: center;
display: flex;
}
.wr-revs {
background-color: #fff;
border-top: 1px solid #0d0e101a;
border-bottom: 1px solid #0d0e101a;
padding: clamp(110px, 11vw, 170px) 0;
overflow: hidden;
}
.wr-revs-big {
letter-spacing: -.05em;
font-size: 72px;
font-weight: 500;
line-height: 1;
}
.wr-revs-score {
grid-column-gap: 16px;
grid-row-gap: 16px;
align-items: center;
display: flex;
}
.wr-revs-sub {
color: #6b6e76;
margin-top: 4px;
font-size: 14px;
}
.wr-a-1 {
grid-template-rows: 0fr;
grid-template-columns: 1fr;
display: grid;
}
.wr-q-1 {
grid-column-gap: 24px;
grid-row-gap: 24px;
color: #0d0e10;
text-align: left;
letter-spacing: -.015em;
cursor: pointer;
justify-content: space-between;
align-items: center;
width: 100%;
padding: 26px 0;
display: flex;
}
.ry-load, .ry-load-bot, .ry-load-ray, .ry-load-tip, .ry-load-top, .ry-load-word, .ry-btn, .ry-btn--blue, .ry-btn--ink, .ry-btn--sm, .ry-btn-a, .ry-btn-b, .ry-btn-ic, .ry-btn-t, .ry-burger, .ry-burger-l, .ry-logo, .ry-logo-mark, .ry-logo-t, .ry-menu, .ry-menu-foot, .ry-menu-mail, .ry-ml, .ry-nav, .ry-nav-bar, .ry-nav-end, .ry-nav-links, .ry-nl, .ry-progress, .ry-progress-bar, .ry-av, .ry-av--2, .ry-av--3, .ry-avs, .ry-btn--light, .ry-dot, .ry-em, .ry-h1, .ry-hero, .ry-hero-btns, .ry-hero-in, .ry-hero-pill, .ry-hero-proof, .ry-hero-sub, .ry-pill, .ry-pill-t, .ry-proof, .ry-wall, .ry-wall-col, .ry-wall-col--1, .ry-wall-col--2, .ry-wall-col--3, .ry-wall-col--4, .ry-wall-col--5, .ry-wall-img, .ry-wall-shot, .ry-wall-track, .ry-wrap, .ry-logo-s, .ry-logo-w, .ry-logos, .ry-logos-l, .ry-marq, .ry-marq--logos, .ry-marq-rail, .is-done, .is-run, .ry-circ, .ry-cover, .ry-door, .ry-door--dark, .ry-door--light, .ry-door-body, .ry-door-cta, .ry-door-num, .ry-door-pre, .ry-door-price, .ry-door-top, .ry-door-vis, .ry-doors, .ry-doors-grid, .ry-eyebrow, .ry-fan, .ry-fan-card, .ry-fan-card--1, .ry-fan-card--2, .ry-fan-card--3, .ry-flow, .ry-flow-bar, .ry-flow-fill, .ry-flow-ic, .ry-flow-ic--run, .ry-flow-ic--wait, .ry-flow-m, .ry-flow-row, .ry-flow-t, .ry-h2, .ry-h3, .ry-head, .ry-lede, .ry-p, .ry-pt, .ry-pts, .ry-sec, .ry-tag, .ry-tag--dark, .ry-tick, .ry-bar, .ry-bar-d, .ry-bar-url, .ry-btn-tag, .ry-live, .ry-live-dot, .ry-meta, .ry-plat, .ry-plat--framer, .ry-plat--webflow, .ry-plat-dot, .ry-plats, .ry-scrollshot, .ry-seg, .ry-seg-b, .ry-seg-ind, .ry-seg-n, .ry-seg-wrap, .ry-tile, .ry-tpl, .ry-tpl-body, .ry-tpl-btns, .ry-tpl-grid, .ry-tpl-name, .ry-tpl-price, .ry-tpl-row, .ry-tpl-tile, .ry-tpls, .ry-win, .ry-win-view, .ry-acc, .ry-acc-btns, .ry-acc-col, .ry-acc-col--rev, .ry-acc-copy, .ry-acc-img, .ry-acc-note, .ry-acc-num, .ry-acc-per, .ry-acc-price, .ry-acc-track, .ry-acc-vis, .ry-btn--white, .ry-eyebrow--dark, .ry-sec--tight, .ry-cmp, .ry-cmp-a, .ry-cmp-b, .ry-cmp-k, .ry-cmp-mark, .ry-cmp-row, .ry-cmp-row--h, .ry-x, .ry-step, .ry-step-b, .ry-step-tile, .ry-steps, .ry-strip, .ry-strip-h, .ry-strip-t, .ry-v, .ry-v1, .ry-v1-c, .ry-v1-c--pick, .ry-v1-cur, .ry-v1-grid, .ry-v1-ring, .ry-v2, .ry-v2-btn, .ry-v2-h, .ry-v2-lines, .ry-v2-logo, .ry-v2-nav, .ry-v2-s, .ry-v2-s--1, .ry-v2-s--2, .ry-v2-s--3, .ry-v2-site, .ry-v2-sw, .ry-v2-t, .ry-v2-t--a, .ry-v2-t--b, .ry-v3, .ry-v3-bar, .ry-v3-fill, .ry-v3-live, .ry-v3-lock, .ry-v3-txt, .ry-v3-type, .ry-v3-url, .ry-care, .ry-care-ic, .ry-care-r, .ry-sv, .ry-sv-b, .ry-sv-c, .ry-sv-c--1, .ry-sv-c--2, .ry-sv-fan, .ry-sv-grid, .ry-sv-num, .ry-sv-pre, .ry-sv-price, .ry-sv-tile, .ry-sv-top, .ry-node, .ry-node--a, .ry-node--b, .ry-node--c, .ry-node-dot, .ry-node-site, .ry-person, .ry-person-av, .ry-person-av--1, .ry-person-av--2, .ry-person-av--3, .ry-person-n, .ry-quote, .ry-quote-line, .ry-quote-n, .ry-quote-row, .ry-quote-stamp, .ry-quote-stamp-ic, .ry-quote-v, .ry-ray, .ry-ray--a, .ry-ray--b, .ry-why, .ry-why-d, .ry-why-fill, .ry-why-i, .ry-why-list, .ry-why-n, .ry-why-pane, .ry-why-prog, .ry-why-t, .ry-why-vis, .ry-wv, .ry-wv1, .ry-wv2, .ry-wv3, .ry-wv4, .ry-wv4-badge, .ry-wv4-c, .ry-cap, .ry-cap-arr, .ry-cap-d, .ry-cap-dot, .ry-cap-l, .ry-cap-n, .ry-cap-ray, .ry-center, .ry-work, .ry-work--wide, .ry-work-grid, .ry-work-img, .ry-work-tile, .ry-head-side, .ry-marq--rev, .ry-rev, .ry-rev--sample, .ry-rev-av, .ry-rev-n, .ry-rev-q, .ry-rev-r, .ry-rev-who, .ry-revs, .ry-score, .ry-score-n, .ry-star, .ry-stars, .ry-mem, .ry-mem-ini, .ry-mem-mark, .ry-mem-tile, .ry-mem-tile--1, .ry-mem-tile--2, .ry-mem-tile--3, .ry-team, .ry-cap--post, .ry-post, .ry-post-big, .ry-post-t, .ry-post-tile, .ry-post-tile--1, .ry-post-tile--2, .ry-post-tile--3, .ry-posts, .ry-a, .ry-a-p, .ry-faq, .ry-faq-l, .ry-faq-list, .ry-head--left, .ry-q, .ry-q-h, .ry-q-ic, .ry-q-t, .ry-q-v, .ry-qa, .ry-avs--cta, .ry-btn--ghost, .ry-clock, .ry-cta, .ry-cta-cell, .ry-cta-h, .ry-cta-hero, .ry-cta-in, .ry-cta-mail, .ry-cta-p, .ry-cta-strip, .ry-fl, .ry-foot, .ry-foot-bot, .ry-foot-brand, .ry-foot-col, .ry-foot-h, .ry-foot-p, .ry-foot-top, .ry-foot-word, .ry-logo--w, .ry-orb, .ry-orb--1, .ry-orb--2, .ry-orb--3, .ry-orb--4, .ry-orb--5, .ry-orb--6, .ry-orb-chip, .ry-orb-s, .ry-orbit, .ry-certs, .ry-cert, .ry-cert--fr, .ry-cert--wf, .ry-cert-ic, .ry-cert-t, .ry-cert-k, .ry-cert-n, .ry-certs--foot, .ry-dock, .ry-dock-av, .ry-dock-b, .ry-dock-home, .ry-dock-in, .ry-dock-ind, .ry-dock-me, .ry-dock-me-t, .ry-dock-on, .ry-dock-p, .ry-dock-seg, .ry-dock-star, .ry-dock-t, .ry-care--static, .ry-inc, .ry-inc-i, .ry-pc, .ry-pc--dark, .ry-pc-n, .ry-pc-num, .ry-pc-per, .ry-pc-pre, .ry-pc-price, .ry-pc-tag, .ry-pgrid, .ry-pgrid--2, .ry-pgrid--4, .ry-pgrid--side, .ry-ppanel, .ry-ppanels, .ry-pq, .ry-pq-q, .ry-pq-who, .ry-pside, .ry-pside--care, .ry-pside-n, .ry-pside-s, .ry-pside-t, .ry-ptab, .ry-ptab-p, .ry-ptab-t, .ry-ptabs, .ry-ptabs-ind, .ry-ptabs-wrap, .ry-ai, .ry-ai-card, .ry-ai-chip, .ry-ai-chips, .ry-ai-dec, .ry-ai-dec-ic, .ry-ai-flow, .ry-ai-foot, .ry-ai-foot-h, .ry-ai-foot-p, .ry-ai-foot-t, .ry-ai-glow, .ry-ai-head, .ry-ai-k, .ry-ai-lede, .ry-ai-node, .ry-ai-num, .ry-ai-pulse, .ry-ai-ray, .ry-ai-ray-fill, .ry-ai-st, .ry-ai-t, .ry-ai-tag, .ry-ai-tags, .ry-brief, .ry-brief-dot, .ry-brief-go, .ry-brief-h, .ry-brief-l, .ry-brief-note, .ry-brief-sum, .ry-brief-txt, .ry-chip, .ry-chips, .ry-ct, .ry-me, .ry-me-a, .ry-me-acts, .ry-me-as, .ry-me-at, .ry-me-av, .ry-me-go, .ry-me-ic, .ry-me-n, .ry-me-on, .ry-me-p, .ry-me-r, .ry-me-top, .ry-ask, .ry-ask-ar, .ry-ask-b, .ry-ask-bs, .ry-ask-glow, .ry-ask-h, .ry-ask-in, .ry-ask-prompt, .ry-ask-spark, .ry-ask-type, .ry-ft, .ry-ft-bot, .ry-ft-brand, .ry-ft-cols, .ry-ft-loc, .ry-ft-p, .ry-ft-stat, .ry-ft-stat-l, .ry-ft-stat-n, .ry-ft-top, .ry-ft-top-b, .ry-ft-trust, .ry-ft-up, .ry-ft-word {
box-sizing: border-box;
}
.rx-load {
z-index: 100;
box-sizing: border-box;
pointer-events: none;
animation: 0s 2.25s forwards rxGone;
display: none;
position: fixed;
inset: 0;
}
.rx-load-bot, .rx-load-ray, .rx-load-top, .rx-load-word {
box-sizing: border-box;
}
.rx {
box-sizing: border-box;
background-color: var(--background);
font-family: var(--font-sans);
color: var(--ink);
font-size: 16px;
line-height: 1.6;
}
.rx-btn {
box-sizing: border-box;
grid-column-gap: 14px;
grid-row-gap: 14px;
letter-spacing: -.01em;
white-space: nowrap;
isolation: isolate;
height: 54px;
color: inherit;
border-radius: 999px;
align-items: center;
padding: 0 7px 0 24px;
font-size: 15px;
font-weight: 500;
text-decoration: none;
transition: color .5s cubic-bezier(.2, .7, .2, 1), box-shadow .5s cubic-bezier(.2, .7, .2, 1), transform .3s cubic-bezier(.2, .7, .2, 1);
display: inline-flex;
position: relative;
overflow: hidden;
}
.rx-btn.rx-btn--ink {
background-color: var(--ink);
color: #fff;
}
.rx-btn.rx-btn--ink:hover {
background-color: #1d1f24;
}
.rx-btn.rx-btn--ink.rx-btn--sm {
grid-column-gap: 12px;
grid-row-gap: 12px;
height: 44px;
padding: 0 5px 0 18px;
font-size: 14px;
}
.rx-btn.rx-btn--ink.rx-btn--sm.rx-btn--in-pc {
align-self: flex-start;
margin-top: auto;
}
.rx-btn.rx-btn--ink.rx-btn--sm.rx-btn--in-ask2 {
align-self: flex-start;
}
.rx-btn.rx-btn--ink.rx-btn--sm.rx-btn--in-ask2.rx-btn--ink--in-ask2 {
color: var(--ink);
background-color: #fff;
}
.rx-btn.rx-btn--ink.rx-brief-go.rx-btn--in-brief {
align-self: flex-start;
}
.rx-btn.rx-btn--ink.rx-btn--2l {
grid-column-gap: 22px;
grid-row-gap: 22px;
text-align: left;
height: 64px;
padding-left: 26px;
}
.rx-btn.rx-btn--ink.rx-btn--in-path {
align-self: flex-start;
margin-top: auto;
}
.rx-btn.rx-btn--light {
color: var(--ink);
background-color: #fff;
box-shadow: inset 0 0 0 1px #0d0e1026;
}
.rx-btn.rx-btn--light:hover {
box-shadow: inset 0 0 0 1px #0d0e10;
}
.rx-btn.rx-btn--light.rx-btn--sm {
grid-column-gap: 12px;
grid-row-gap: 12px;
height: 44px;
padding: 0 5px 0 18px;
font-size: 14px;
}
.rx-btn.rx-btn--light.rx-btn--sm.rx-btn--in-pc {
align-self: flex-start;
margin-top: auto;
}
.rx-btn.rx-btn--light.rx-btn--2l {
grid-column-gap: 22px;
grid-row-gap: 22px;
text-align: left;
height: 64px;
padding-left: 26px;
}
.rx-btn.rx-btn--light.rx-btn--in-path {
align-self: flex-start;
margin-top: auto;
}
.rx-btn--ink {
box-sizing: border-box;
background-color: var(--ink);
color: #fff;
}
.rx-btn--ink:hover {
background-color: #1d1f24;
}
.rx-btn--sm {
box-sizing: border-box;
grid-column-gap: 12px;
grid-row-gap: 12px;
height: 44px;
padding: 0 5px 0 18px;
font-size: 14px;
}
.rx-btn-ic {
box-sizing: border-box;
border-radius: 50%;
flex: none;
width: 40px;
height: 40px;
position: relative;
overflow: hidden;
}
.rx-btn-ic.rx-btn-ic--in-btn--ink {
background-color: var(--brand-blue);
color: #fff;
}
.rx-btn-ic.rx-btn-ic--in-btn--ink.rx-btn-ic--in-btn--sm {
width: 34px;
height: 34px;
}
.rx-btn-ic.rx-btn-ic--in-btn--ink.rx-btn-ic--in-btn--2l {
width: 48px;
height: 48px;
}
.rx-btn-ic.rx-btn-ic--in-btn--light {
background-color: var(--ink);
color: #fff;
}
.rx-btn-ic.rx-btn-ic--in-btn--light.rx-btn-ic--in-btn--2l {
width: 48px;
height: 48px;
}
.rx-btn-ic.rx-btn-ic--in-btn--light.rx-btn-ic--in-btn--sm {
width: 34px;
height: 34px;
}
.rx-btn-t {
box-sizing: border-box;
}
.rx-burger {
box-sizing: border-box;
grid-column-gap: 5px;
grid-row-gap: 5px;
background-color: var(--background);
width: 44px;
height: 44px;
color: inherit;
border-radius: 50%;
flex-direction: column;
justify-content: center;
align-items: center;
text-decoration: none;
display: none;
}
.rx-burger-l {
box-sizing: border-box;
background-color: var(--ink);
width: 16px;
height: 1.5px;
transition: transform .4s cubic-bezier(.2, .7, .2, 1);
}
.rx-logo {
box-sizing: border-box;
grid-column-gap: 10px;
grid-row-gap: 10px;
aspect-ratio: 3002 / 480;
color: #0000;
letter-spacing: -.03em;
background-image: url("https://cdn.prod.website-files.com/6add6ba7502b2f97c4399ab7/6add6dcf28b989f6d8f5a471_Webray%20Studio_Primary%20Logo-p-800.png");
background-position: 49.74% 39.76%;
background-repeat: no-repeat;
background-size: 113.06%;
flex-grow: 0;
flex-shrink: 0;
align-items: center;
width: 156px;
font-size: 0;
font-weight: 600;
text-decoration: none;
display: block;
position: relative;
}
.rx-logo.rx-logo--in-ft {
background-image: url("https://cdn.prod.website-files.com/6add6ba7502b2f97c4399ab7/6add6dcf7cf0487f2045dae8_white__Primary%20Logo%20(1)-p-800.png");
width: 184px;
}
.rx-logo-mark {
box-sizing: border-box;
width: 20px;
height: 20px;
color: var(--brand-blue);
transition: transform .9s cubic-bezier(.2, .7, .2, 1);
display: none;
}
.rx-menu {
box-sizing: border-box;
display: none;
}
.rx-ml {
box-sizing: border-box;
color: inherit;
text-decoration: none;
}
.rx-nav {
z-index: 50;
box-sizing: border-box;
padding: 0 16px;
transition: transform .7s cubic-bezier(.2, .7, .2, 1), opacity .5s;
position: fixed;
top: 14px;
left: 0;
right: 0;
}
.rx-nav-bar {
box-sizing: border-box;
grid-column-gap: 20px;
grid-row-gap: 20px;
-webkit-backdrop-filter: blur(18px) saturate(1.6);
backdrop-filter: blur(18px) saturate(1.6);
background-color: #ffffffd1;
border-radius: 999px;
grid-template-columns: 1fr auto 1fr;
justify-content: space-between;
align-items: center;
max-width: 1240px;
height: 64px;
margin: 0 auto;
padding: 0 11px 0 20px;
display: grid;
position: relative;
box-shadow: 0 0 0 1px #0d0e1014, 0 12px 32px -20px #0d0e1059;
}
.rx-nav-cta {
box-sizing: border-box;
}
.rx-nav-end {
box-sizing: border-box;
grid-column-gap: 8px;
grid-row-gap: 8px;
align-items: center;
display: flex;
}
.rx-nav-links {
box-sizing: border-box;
grid-column-gap: 4px;
grid-row-gap: 4px;
align-items: center;
display: flex;
}
.rx-nl {
box-sizing: border-box;
color: var(--ink-2);
border-radius: 999px;
padding: 8px 14px;
font-size: 14.5px;
text-decoration: none;
transition: color .3s, background .3s;
position: relative;
}
.rx-nl:hover {
background-color: var(--background);
color: var(--ink);
}
.rx-av {
box-sizing: border-box;
width: 36px;
height: 36px;
color: var(--ink);
background-color: #fff;
border-radius: 50%;
flex: none;
place-items: center;
font-size: 12px;
font-weight: 600;
display: grid;
position: relative;
}
.rx-av-on {
box-sizing: border-box;
background-color: #3ddc84;
border-radius: 50%;
width: 10px;
height: 10px;
position: absolute;
bottom: -1px;
right: -1px;
box-shadow: 0 0 0 2px #3b5bdb;
}
.rx-dock {
z-index: 45;
box-sizing: border-box;
pointer-events: none;
justify-content: center;
padding: 0 12px;
transition: transform .8s cubic-bezier(.2, .7, .2, 1);
display: flex;
position: fixed;
bottom: 18px;
left: 0;
right: 0;
transform: translateY(150%);
}
.rx-dock-b {
z-index: 1;
box-sizing: border-box;
color: #ffffffbf;
background-color: #ffffff17;
border-radius: 999px;
flex-direction: column;
justify-content: center;
align-items: center;
height: 44px;
padding: 0 20px;
text-decoration: none;
transition: color .3s, background-color .3s;
display: flex;
position: relative;
box-shadow: inset 0 0 0 1px #ffffff14;
}
.rx-dock-b:hover {
color: #fff;
background-color: #ffffff29;
}
.rx-dock-home {
box-sizing: border-box;
width: 44px;
height: 44px;
color: var(--sky);
border-radius: 50%;
place-items: center;
text-decoration: none;
transition: background .3s;
display: grid;
}
.rx-dock-home:hover {
background-color: #ffffff14;
}
.rx-dock-in {
box-sizing: border-box;
grid-column-gap: 6px;
grid-row-gap: 0px;
-webkit-backdrop-filter: blur(16px);
backdrop-filter: blur(16px);
pointer-events: auto;
background-color: #0d0e10e6;
border-radius: 31px;
flex-wrap: wrap;
align-items: center;
max-width: calc(100vw - 24px);
padding: 6px;
display: flex;
box-shadow: 0 0 0 1px #ffffff0f, 0 22px 50px -18px #0d0e1099;
}
.rx-dock-ind {
box-sizing: border-box;
opacity: 0;
background-color: #fff;
border-radius: 999px;
transition: transform .6s cubic-bezier(.2, .7, .2, 1), width .6s cubic-bezier(.2, .7, .2, 1), opacity .3s;
position: absolute;
top: 3px;
bottom: 3px;
left: 0;
}
.rx-dock-me {
box-sizing: border-box;
grid-column-gap: 10px;
grid-row-gap: 10px;
background-color: var(--brand-blue);
color: #fff;
border-radius: 999px;
align-items: center;
height: 44px;
padding: 0 18px 0 4px;
font-size: 14px;
font-weight: 500;
text-decoration: none;
transition: background .3s;
display: flex;
}
.rx-dock-me:hover {
background-color: #4c6bf0;
}
.rx-dock-me-t {
box-sizing: border-box;
}
.rx-dock-p {
box-sizing: border-box;
opacity: .65;
font-family: var(--font-mono);
letter-spacing: .04em;
font-size: 10px;
line-height: 1.3;
}
.rx-dock-seg {
box-sizing: border-box;
grid-column-gap: 6px;
background-color: #0000;
border-radius: 999px;
padding: 3px;
display: flex;
position: relative;
}
.rx-dock-star {
box-sizing: border-box;
color: #0000;
background-image: url("https://cdn.prod.website-files.com/6add6ba7502b2f97c4399ab7/6add6dcf7cf0487f2045dae8_white__Primary%20Logo%20(1)-p-800.png");
background-position: 6.528% 39.4%;
background-repeat: no-repeat;
background-size: 833.9%;
width: 22px;
height: 26px;
transition: transform .9s cubic-bezier(.2, .7, .2, 1);
}
.rx-dock-t {
box-sizing: border-box;
font-size: 14px;
font-weight: 500;
line-height: 1.1;
}
.rx-btn--light {
box-sizing: border-box;
color: var(--ink);
background-color: #fff;
box-shadow: inset 0 0 0 1px #0d0e1026;
}
.rx-btn--light:hover {
box-shadow: inset 0 0 0 1px #0d0e10;
}
.rx-btns {
box-sizing: border-box;
grid-column-gap: 12px;
grid-row-gap: 12px;
flex-wrap: wrap;
display: flex;
}
.rx-chip {
box-sizing: border-box;
grid-column-gap: 9px;
grid-row-gap: 9px;
letter-spacing: -.01em;
height: 36px;
color: inherit;
background-color: #fff;
border-radius: 12px;
align-items: center;
padding: 0 14px 0 6px;
font-size: 13px;
font-weight: 500;
text-decoration: none;
transition: transform .5s cubic-bezier(.2, .7, .2, 1), box-shadow .4s;
display: inline-flex;
box-shadow: 0 0 0 1px #0d0e1014;
}
.rx-chip.rx-chip--in-ft-trust {
color: #fff;
background-color: #ffffff0f;
height: 44px;
padding-right: 16px;
box-shadow: inset 0 0 0 1px #ffffff1f;
}
.rx-chip-ic {
box-sizing: border-box;
background-color: var(--ink);
color: #fff;
border-radius: 7px;
place-items: center;
width: 24px;
height: 24px;
padding: 5px;
display: grid;
}
.rx-chip-ic.rx-chip-ic--wf {
background-color: #146ef5;
}
.rx-chip-ic.rx-chip-ic--wf.rx-chip-ic--in-ft-trust {
color: var(--ink);
background-color: #fff;
}
.rx-chip-ic.rx-chip-ic--wf.rx-chip-ic--in-ft-trust.rx-chip-ic--wf--in-ft-trust {
color: #fff;
background-color: #146ef5;
}
.rx-chip-ic.rx-chip-ic--wf.rx-chip-ic--in-proof-ics {
border-radius: 9px;
width: 30px;
height: 30px;
padding: 7px;
box-shadow: 0 0 0 2px #f5f4f0;
}
.rx-chip-ic.rx-chip-ic--st {
background-color: var(--blue-tint);
color: var(--brand-blue);
}
.rx-chip-ic.rx-chip-ic--in-ft-trust {
color: var(--ink);
background-color: #fff;
}
.rx-chip-ic.rx-chip-ic--in-proof-ics {
border-radius: 9px;
width: 30px;
height: 30px;
padding: 7px;
box-shadow: 0 0 0 2px #f5f4f0;
}
.rx-chip-ic--st {
box-sizing: border-box;
background-color: var(--blue-tint);
color: var(--brand-blue);
}
.rx-chip-ic--wf {
box-sizing: border-box;
background-color: #146ef5;
}
.rx-em {
box-sizing: border-box;
font-family: var(--font-serif);
letter-spacing: -.02em;
font-style: italic;
font-weight: 400;
}
.rx-h1 {
box-sizing: border-box;
letter-spacing: -.058em;
margin-top: 0;
margin-bottom: 0;
font-size: clamp(54px, 8.4vw, 128px);
font-weight: 500;
line-height: .94;
}
.rx-h1.rx-h1--in-hero {
letter-spacing: -.045em;
font-size: clamp(36px, 4.6vw, 64px);
line-height: 1.04;
}
.rx-hero {
box-sizing: border-box;
text-align: center;
padding: 150px 0 88px;
position: relative;
overflow: hidden;
}
.rx-hero-chips {
box-sizing: border-box;
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-wrap: wrap;
justify-content: center;
margin-bottom: 36px;
display: flex;
}
.rx-hero-in {
z-index: 1;
box-sizing: border-box;
flex-direction: column;
align-items: center;
display: flex;
position: relative;
}
.rx-hero-sub {
box-sizing: border-box;
max-width: 600px;
color: var(--ink-2);
margin-top: 30px;
margin-bottom: 0;
font-size: 19px;
line-height: 1.55;
}
.rx-wall {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-columns: repeat(5, minmax(0, 1fr));
height: 660px;
margin-top: 72px;
padding: 0 16px;
display: grid;
position: relative;
overflow: hidden;
}
.rx-wall-col {
box-sizing: border-box;
}
.rx-wall-img {
box-sizing: border-box;
object-fit: cover;
object-position: top;
width: 100%;
max-width: 100%;
height: 100%;
display: block;
}
.rx-wall-shot {
box-sizing: border-box;
aspect-ratio: 4 / 3;
background-color: var(--background-2);
border-radius: 16px;
transition: transform .7s cubic-bezier(.2, .7, .2, 1);
position: relative;
overflow: hidden;
box-shadow: 0 0 0 1px #0d0e1014, 0 16px 32px -20px #0d0e1052;
}
.rx-wall-shot:hover {
transform: scale(1.03);
}
.rx-wall-track {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
flex-direction: column;
animation: 64s linear infinite rxCol;
display: flex;
}
.rx-wrap {
box-sizing: border-box;
width: 100%;
max-width: 1272px;
margin: 0 auto;
padding: 0 32px;
}
.rx-wrap.rx-hero-in {
z-index: 1;
flex-direction: column;
align-items: center;
display: flex;
position: relative;
}
.rx-wrap.rx-wrap--in-ft {
z-index: 1;
position: relative;
}
.rx-client {
box-sizing: border-box;
grid-column-gap: 10px;
grid-row-gap: 10px;
color: var(--ink-2);
letter-spacing: -.02em;
white-space: nowrap;
align-items: center;
font-size: 17px;
font-weight: 500;
display: flex;
}
.rx-client-s {
box-sizing: border-box;
color: #0000;
background-image: url("https://cdn.prod.website-files.com/6add6ba7502b2f97c4399ab7/6add6dcf28b989f6d8f5a471_Webray%20Studio_Primary%20Logo-p-800.png");
background-position: 6.528% 39.4%;
background-repeat: no-repeat;
background-size: 833.9%;
width: 12px;
height: 14px;
}
.rx-clients {
box-sizing: border-box;
grid-column-gap: 32px;
grid-row-gap: 32px;
border-top-style: solid;
border-top-width: 1px;
border-top-color: var(--line-2);
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--line-2);
align-items: center;
padding: 26px 0;
display: flex;
}
.rx-clients-l {
box-sizing: border-box;
font-family: var(--font-mono);
color: var(--muted);
letter-spacing: .08em;
text-transform: uppercase;
flex: none;
font-size: 11px;
}
.rx-marq {
box-sizing: border-box;
flex: 1;
position: relative;
overflow: hidden;
}
.rx-marq-rail {
box-sizing: border-box;
grid-column-gap: 44px;
grid-row-gap: 44px;
width: max-content;
animation: 46s linear infinite rxMarq;
display: flex;
}
.rx-card {
box-sizing: border-box;
border-radius: var(--radius);
background-color: var(--card);
color: inherit;
flex-direction: column;
padding: 10px;
text-decoration: none;
transition: transform .7s cubic-bezier(.2, .7, .2, 1), box-shadow .7s cubic-bezier(.2, .7, .2, 1);
display: flex;
position: relative;
box-shadow: 0 1px 2px #0d0e100a, 0 0 0 1px #0d0e100a;
}
.rx-card.rx-card--hover:hover {
transform: translateY(-6px);
box-shadow: 0 0 0 1px #0d0e1026, 0 30px 60px -32px #0d0e1047;
}
.rx-card.rx-wk {
grid-column: span 6;
}
.rx-card.rx-wk.rx-wk--7 {
flex-direction: column;
grid-column: span 7;
display: flex;
}
.rx-card.rx-wk.rx-wk--5 {
flex-direction: column;
grid-column: span 5;
display: flex;
}
.rx-card.rx-rev {
grid-column-gap: 26px;
grid-row-gap: 26px;
justify-content: space-between;
padding: 34px 34px 30px;
}
.rx-card.rx-pc {
grid-column-gap: 16px;
grid-row-gap: 16px;
padding: 28px 26px 26px;
}
.rx-card.rx-pc.rx-pc--hi {
box-shadow: 0 0 0 1.5px #3b5bdb, 0 30px 60px -36px #3b5bdb8c;
}
.rx-card.rx-ct {
grid-row-gap: 0;
grid-column-gap: 0;
grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
padding: 0;
display: grid;
overflow: hidden;
}
.rx-card.rx-ct.rx-ct--in-ct-glow {
box-shadow: 0 0 0 1px #fff9, 0 40px 80px -40px #0d0e1059;
}
.rx-card.rx-rvs {
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
padding: 10px;
display: grid;
}
.rx-card.rx-ask2 {
background-color: var(--brand-blue);
color: #fff;
grid-row-gap: 0;
grid-column-gap: 0;
padding: 28px 28px 150px;
position: relative;
overflow: hidden;
box-shadow: 0 30px 60px -36px #3b5bdbb3;
}
.rx-card-b {
box-sizing: border-box;
grid-column-gap: 14px;
grid-row-gap: 14px;
flex-direction: column;
flex: 1;
padding: 22px 16px 16px;
display: flex;
}
.rx-card-b.rx-card-b--in-wk {
flex: none;
padding: 18px 12px 10px;
}
.rx-card-row {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
justify-content: space-between;
align-items: flex-start;
display: flex;
}
.rx-fan {
box-sizing: border-box;
aspect-ratio: 16 / 10;
width: 74%;
position: relative;
}
.rx-fan-c {
box-sizing: border-box;
background-color: #fff;
border-radius: 12px;
transition: transform 1s cubic-bezier(.2, .7, .2, 1);
position: absolute;
inset: 0;
overflow: hidden;
box-shadow: 0 0 0 1px #0d0e1014, 0 24px 40px -22px #0d0e1073;
}
.rx-h2 {
box-sizing: border-box;
letter-spacing: -.048em;
margin-top: 0;
margin-bottom: 0;
font-size: clamp(38px, 4.8vw, 68px);
font-weight: 500;
line-height: 1;
}
.rx-h3 {
box-sizing: border-box;
letter-spacing: -.03em;
margin-top: 0;
margin-bottom: 0;
font-size: clamp(22px, 2vw, 26px);
font-weight: 500;
line-height: 1.15;
}
.rx-head {
box-sizing: border-box;
margin-bottom: clamp(40px, 5vw, 64px);
}
.rx-head-g {
box-sizing: border-box;
grid-column-gap: 8%;
grid-row-gap: 40px;
grid-template-columns: minmax(0, 7fr) minmax(0, 4fr);
align-items: end;
display: grid;
}
.rx-head-g.rx-head-g--in-head--c {
text-align: center;
grid-template-columns: 1fr;
justify-items: center;
}
.rx-head-s {
box-sizing: border-box;
grid-column-gap: 20px;
grid-row-gap: 20px;
flex-direction: column;
align-items: flex-start;
padding-bottom: 6px;
display: flex;
}
.rx-head-s.rx-head-s--in-head--c {
align-items: center;
max-width: 540px;
}
.rx-idx {
box-sizing: border-box;
height: 22px;
font-family: var(--font-mono);
color: #fff;
letter-spacing: .06em;
background-color: #3b5bdb;
border-radius: 999px;
align-items: center;
padding-left: 8px;
padding-right: 8px;
font-size: 11px;
line-height: 1;
display: flex;
}
.rx-lede {
box-sizing: border-box;
color: var(--muted);
margin-top: 0;
margin-bottom: 0;
font-size: 18px;
line-height: 1.55;
}
.rx-media {
box-sizing: border-box;
border-top-left-radius: var(--radius-small);
border-top-right-radius: var(--radius-small);
border-bottom-left-radius: var(--radius-small);
border-bottom-right-radius: var(--radius-small);
background-color: var(--background-2);
isolation: isolate;
color: inherit;
text-decoration: none;
position: relative;
overflow: hidden;
}
.rx-media.rx-media--in-path {
aspect-ratio: 16 / 10;
}
.rx-media.rx-media--in-tpl {
aspect-ratio: 4 / 4.4;
background-color: #fff;
box-shadow: inset 0 0 0 1px #0d0e1014;
}
.rx-media.rx-media--in-wk {
aspect-ratio: 16 / 11;
}
.rx-media.rx-media--in-wk.rx-media--in-wk--7 {
flex: 1;
min-height: 340px;
}
.rx-media.rx-media--in-wk.rx-media--in-wk--5 {
aspect-ratio: auto;
flex: 1;
height: 100%;
min-height: 340px;
}
.rx-media.rx-media--in-bt--tall {
border-radius: var(--radius-small);
position: absolute;
inset: 10px;
}
.rx-name {
box-sizing: border-box;
color: #2f4bc4;
letter-spacing: -.005em;
padding-left: 0;
padding-right: 0;
font-size: 14px;
font-weight: 500;
line-height: 1;
}
.rx-num {
box-sizing: border-box;
letter-spacing: -.05em;
font-size: 44px;
font-weight: 500;
line-height: 1;
}
.rx-p {
box-sizing: border-box;
color: var(--muted);
margin-top: 0;
margin-bottom: 0;
font-size: 15px;
line-height: 1.6;
}
.rx-p.rx-st-p {
margin-top: 8px;
}
.rx-p.rx-brief-s {
margin-top: 6px;
}
.rx-p.rx-ask2-p {
margin: 18px 0 22px;
}
.rx-p.rx-ask2-p.rx-p--in-ask2 {
color: #ffffffc7;
}
.rx-p.rx-p--in-band {
max-width: 360px;
margin-top: 4px;
}
.rx-p.rx-p--in-ask2 {
color: #ffffffc7;
}
.rx-path {
box-sizing: border-box;
}
.rx-path-pre {
box-sizing: border-box;
font-family: var(--font-mono);
color: var(--muted);
letter-spacing: .06em;
text-transform: uppercase;
font-size: 11px;
}
.rx-path-price {
box-sizing: border-box;
text-align: right;
flex: none;
}
.rx-path-vis {
box-sizing: border-box;
justify-content: center;
align-items: center;
display: flex;
position: absolute;
inset: 0;
}
.rx-paths {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-columns: repeat(2, minmax(0, 1fr));
display: grid;
}
.rx-pt {
box-sizing: border-box;
grid-column-gap: 10px;
grid-row-gap: 10px;
color: var(--ink-2);
font-size: 14.5px;
line-height: 1.45;
display: flex;
}
.rx-pts {
box-sizing: border-box;
grid-column-gap: 10px;
grid-row-gap: 10px;
flex-direction: column;
display: flex;
}
.rx-pts.rx-pts--in-path {
margin: 4px 0 10px;
}
.rx-pts.rx-pts--in-pc {
margin-bottom: 8px;
}
.rx-ray {
box-sizing: border-box;
background: linear-gradient(90deg, var(--brand-blue), var(--sky) 60%, #9db0ff00);
transform-origin: 0;
height: 1px;
transition: transform 1.6s cubic-bezier(.65, 0, .35, 1) .1s;
display: none;
position: absolute;
bottom: -1px;
left: 0;
right: 0;
transform: scaleX(0);
}
.rx-rule {
box-sizing: border-box;
grid-column-gap: 9px;
grid-row-gap: 9px;
background-color: #e9edfb;
border-radius: 999px;
align-items: center;
width: fit-content;
margin-bottom: 20px;
padding: 5px 14px 5px 5px;
display: flex;
position: relative;
}
.rx-sec {
box-sizing: border-box;
padding: clamp(88px, 11vw, 152px) 0 0;
position: relative;
}
.rx-sec.ab-sec {
padding-top: clamp(72px, 8vw, 120px);
}
.rx-stack {
box-sizing: border-box;
aspect-ratio: 16 / 10;
width: 78%;
position: relative;
}
.rx-tag {
box-sizing: border-box;
grid-column-gap: 8px;
grid-row-gap: 8px;
background-color: var(--background);
height: 28px;
font-family: var(--font-mono);
color: var(--ink-2);
letter-spacing: .06em;
text-transform: uppercase;
border-radius: 999px;
align-items: center;
padding: 0 12px;
font-size: 11px;
display: inline-flex;
}
.rx-tag-dot {
box-sizing: border-box;
background-color: var(--brand-blue);
border-radius: 50%;
width: 6px;
height: 6px;
}
.rx-tick {
box-sizing: border-box;
background-color: var(--blue-tint);
width: 20px;
height: 20px;
color: var(--brand-blue);
border-radius: 50%;
flex: none;
margin-top: -1px;
padding: 4px;
}
.rx-band {
box-sizing: border-box;
border-radius: var(--radius);
background-color: var(--card);
grid-template-columns: repeat(2, minmax(0, 1fr));
margin-top: 16px;
display: grid;
overflow: hidden;
box-shadow: 0 0 0 1px #0d0e1014;
}
.rx-band-c {
box-sizing: border-box;
grid-column-gap: 24px;
grid-row-gap: 24px;
justify-content: space-between;
align-items: center;
padding: 28px 32px;
display: flex;
}
.rx-band-h {
box-sizing: border-box;
grid-column-gap: 10px;
grid-row-gap: 10px;
letter-spacing: -.02em;
align-items: baseline;
font-size: 19px;
font-weight: 500;
display: flex;
}
.rx-band-v {
box-sizing: border-box;
font-family: var(--font-mono);
color: var(--brand-blue);
font-size: 12px;
}
.rx-card--hover {
box-sizing: border-box;
}
.rx-card--hover:hover {
transform: translateY(-6px);
box-shadow: 0 0 0 1px #0d0e1026, 0 30px 60px -32px #0d0e1047;
}
.rx-live {
z-index: 3;
box-sizing: border-box;
grid-column-gap: 8px;
grid-row-gap: 8px;
opacity: 0;
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
color: #fff;
background-color: #0d0e10d1;
border-radius: 999px;
align-items: center;
height: 32px;
padding: 0 12px;
font-size: 12px;
font-weight: 500;
transition: opacity .4s, transform .5s cubic-bezier(.2, .7, .2, 1);
display: flex;
position: absolute;
bottom: 14px;
left: 14px;
transform: translateY(8px);
}
.rx-live-dot {
box-sizing: border-box;
background-color: #3ddc84;
border-radius: 50%;
width: 7px;
height: 7px;
box-shadow: 0 0 0 3px #3ddc8440;
}
.rx-plat {
box-sizing: border-box;
grid-column-gap: 6px;
grid-row-gap: 6px;
background-color: var(--background);
height: 26px;
color: var(--ink-2);
border-radius: 999px;
align-items: center;
padding: 0 10px;
font-size: 12px;
font-weight: 500;
display: inline-flex;
}
.rx-plat--framer, .rx-plat--webflow {
box-sizing: border-box;
}
.rx-plat-dot {
box-sizing: border-box;
background-color: var(--ink);
border-radius: 50%;
width: 6px;
height: 6px;
}
.rx-plat-dot.rx-plat-dot--in-plat--webflow {
background-color: #146ef5;
}
.rx-price-pill {
box-sizing: border-box;
background-color: var(--background);
letter-spacing: -.02em;
border-radius: 999px;
flex: none;
padding: 5px 12px;
font-size: 15px;
font-weight: 600;
}
.rx-scroll {
box-sizing: border-box;
position: absolute;
inset: 34px 0 0;
overflow: hidden;
}
.rx-scroll-img {
box-sizing: border-box;
width: 100%;
max-width: 100%;
height: auto;
transition: transform 7s cubic-bezier(.45, 0, .25, 1);
display: block;
transform: translateY(0);
}
.rx-tpl {
box-sizing: border-box;
}
.rx-tpl-acts {
box-sizing: border-box;
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-wrap: wrap;
margin-top: auto;
display: flex;
}
.rx-tpl-plats {
box-sizing: border-box;
grid-column-gap: 6px;
grid-row-gap: 6px;
flex-wrap: wrap;
display: flex;
}
.rx-tpls {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-columns: repeat(3, minmax(0, 1fr));
display: grid;
}
.rx-win-bar {
z-index: 2;
box-sizing: border-box;
grid-column-gap: 6px;
grid-row-gap: 6px;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: var(--line);
-webkit-backdrop-filter: blur(6px);
backdrop-filter: blur(6px);
background-color: #fffffff0;
align-items: center;
height: 34px;
padding: 0 14px;
display: flex;
position: absolute;
top: 0;
left: 0;
right: 0;
}
.rx-win-d {
box-sizing: border-box;
background-color: var(--background-2);
border-radius: 50%;
width: 8px;
height: 8px;
}
.rx-win-url {
box-sizing: border-box;
font-family: var(--font-mono);
color: var(--muted);
margin-left: 10px;
font-size: 10.5px;
}
.rx-link {
box-sizing: border-box;
grid-column-gap: 8px;
grid-row-gap: 8px;
color: inherit;
white-space: nowrap;
align-items: center;
padding-bottom: 3px;
font-size: 15px;
font-weight: 500;
text-decoration: none;
display: inline-flex;
position: relative;
}
.rx-link.rx-ask2-m {
align-self: flex-start;
margin-top: 18px;
font-size: 14px;
}
.rx-link.rx-ask2-m.rx-link--in-ask2 {
color: #fff;
}
.rx-link-i {
box-sizing: border-box;
width: 14px;
height: 14px;
transition: transform .5s cubic-bezier(.2, .7, .2, 1);
}
.rx-media-img {
box-sizing: border-box;
object-fit: cover;
width: 100%;
max-width: 100%;
height: 100%;
transition: transform 1.6s cubic-bezier(.2, .7, .2, 1);
display: block;
transform: scale(1.12);
}
.rx-meta {
box-sizing: border-box;
font-family: var(--font-mono);
color: var(--muted);
letter-spacing: .07em;
text-transform: uppercase;
font-size: 11px;
}
.rx-meta.rx-st-k {
margin-top: 16px;
}
.rx-meta.rx-score-l {
margin-top: 6px;
}
.rx-meta.rx-brief-l {
margin: 22px 0 12px;
}
.rx-meta.rx-meta--b {
color: var(--blue-2);
}
.rx-wk {
box-sizing: border-box;
grid-column: span 6;
}
.rx-wk--5 {
box-sizing: border-box;
flex-direction: column;
grid-column: span 5;
display: flex;
}
.rx-wk--6 {
box-sizing: border-box;
}
.rx-wk--7 {
box-sizing: border-box;
flex-direction: column;
grid-column: span 7;
display: flex;
}
.rx-wk-d {
box-sizing: border-box;
color: var(--muted);
font-size: 14px;
}
.rx-wk-n {
box-sizing: border-box;
letter-spacing: -.02em;
font-size: 18px;
font-weight: 500;
}
.rx-work {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-columns: repeat(12, minmax(0, 1fr));
display: grid;
}
.rx-fact {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
padding: 28px 30px;
display: flex;
}
.rx-fact-h {
box-sizing: border-box;
letter-spacing: -.01em;
margin-bottom: 3px;
font-weight: 500;
}
.rx-fact-ic {
box-sizing: border-box;
background-color: var(--blue-tint);
width: 40px;
height: 40px;
color: var(--brand-blue);
border-radius: 12px;
flex: none;
padding: 11px;
}
.rx-facts {
box-sizing: border-box;
border-radius: var(--radius);
background-color: var(--card);
grid-template-columns: repeat(3, minmax(0, 1fr));
margin-top: 16px;
display: grid;
box-shadow: 0 0 0 1px #0d0e1014;
}
.rx-st-p {
box-sizing: border-box;
margin-top: 8px;
}
.rx-proc {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-columns: repeat(4, minmax(0, 1fr));
display: grid;
position: relative;
}
.rx-proc-fill {
box-sizing: border-box;
width: calc(var(--k, 0) * 33.333%);
background: linear-gradient(90deg, var(--sky), var(--brand-blue));
transition: width 1.1s cubic-bezier(.2, .7, .2, 1);
position: absolute;
top: 0;
bottom: 0;
left: 0;
}
.rx-proc-line {
box-sizing: border-box;
background-color: var(--line-2);
border-radius: 2px;
height: 2px;
position: absolute;
top: 39px;
left: calc(12.5% - 8px);
right: calc(12.5% - 8px);
}
.rx-proc-pulse {
box-sizing: border-box;
background-color: var(--brand-blue);
width: 10px;
height: 10px;
top: -4px;
left: calc(var(--k, 0) * 33.333%);
border-radius: 50%;
margin-left: -5px;
transition: left 1.1s cubic-bezier(.2, .7, .2, 1);
position: absolute;
box-shadow: 0 0 0 5px #3b5bdb2e, 0 0 22px 4px #3b5bdb8c;
}
.rx-st {
box-sizing: border-box;
cursor: default;
flex-direction: column;
align-items: center;
display: flex;
}
.rx-st-chip {
box-sizing: border-box;
background-color: var(--background);
color: var(--ink-2);
border-radius: 999px;
padding: 5px 10px;
font-size: 12.5px;
transition: background .4s, color .4s;
}
.rx-st-chip.rx-st-chip--in-tp-card {
background-color: var(--blue-tint);
color: var(--blue-2);
}
.rx-st-chips {
box-sizing: border-box;
grid-column-gap: 6px;
grid-row-gap: 6px;
flex-wrap: wrap;
margin-top: 8px;
margin-bottom: 20px;
display: flex;
}
.rx-st-chips.rx-st-chips--in-tp-card {
margin-bottom: 16px;
}
.rx-st-dec {
box-sizing: border-box;
grid-column-gap: 10px;
grid-row-gap: 10px;
border-top: 1px solid var(--line);
color: var(--ink);
margin-top: auto;
padding-top: 16px;
font-size: 14px;
line-height: 1.45;
display: flex;
}
.rx-st-k {
box-sizing: border-box;
margin-top: 16px;
}
.rx-st-node {
z-index: 1;
box-sizing: border-box;
background-color: var(--background);
width: 46px;
height: 46px;
font-family: var(--font-mono);
color: var(--muted);
border-radius: 50%;
place-items: center;
margin: 16px 0 18px;
font-size: 12px;
transition: background .5s, color .5s, box-shadow .5s;
display: grid;
position: relative;
box-shadow: inset 0 0 0 1px #0d0e1026;
}
.rx-rev {
box-sizing: border-box;
grid-column-gap: 26px;
grid-row-gap: 26px;
justify-content: space-between;
padding: 34px 34px 30px;
}
.rx-rev-av {
box-sizing: border-box;
background-color: var(--background);
width: 44px;
height: 44px;
color: var(--ink-2);
border-radius: 50%;
place-items: center;
font-size: 13px;
font-weight: 600;
display: grid;
}
.rx-rev-mark {
box-sizing: border-box;
height: 28px;
font-family: var(--font-serif);
color: var(--brand-blue);
font-size: 64px;
line-height: .6;
}
.rx-rev-n {
box-sizing: border-box;
font-weight: 500;
}
.rx-rev-q {
box-sizing: border-box;
color: var(--ink);
letter-spacing: -.02em;
font-size: clamp(20px, 1.8vw, 24px);
line-height: 1.35;
}
.rx-rev-r {
box-sizing: border-box;
color: var(--muted);
font-size: 14px;
}
.rx-rev-top {
box-sizing: border-box;
justify-content: space-between;
align-items: center;
display: flex;
}
.rx-rev-who {
box-sizing: border-box;
grid-column-gap: 12px;
grid-row-gap: 12px;
align-items: center;
display: flex;
}
.rx-rev-who.rx-rev-who--in-rv {
margin-top: auto;
}
.rx-revs {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-columns: repeat(2, minmax(0, 1fr));
display: grid;
}
.rx-score {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
align-items: center;
display: flex;
}
.rx-score-l {
box-sizing: border-box;
margin-top: 6px;
}
.rx-score-n {
box-sizing: border-box;
letter-spacing: -.05em;
font-size: 56px;
font-weight: 500;
line-height: 1;
}
.rx-star {
box-sizing: border-box;
width: 14px;
height: 14px;
}
.rx-stars {
box-sizing: border-box;
grid-column-gap: 2px;
grid-row-gap: 2px;
color: #f2a93b;
display: flex;
}
.rx-pc {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
padding: 28px 26px 26px;
}
.rx-pc-per {
box-sizing: border-box;
font-family: var(--font-mono);
color: var(--muted);
letter-spacing: .06em;
text-transform: uppercase;
flex-basis: 100%;
font-size: 11px;
}
.rx-pc-pre {
box-sizing: border-box;
font-family: var(--font-mono);
color: var(--muted);
letter-spacing: .06em;
text-transform: uppercase;
font-size: 11px;
}
.rx-pc-price {
box-sizing: border-box;
grid-column-gap: 8px;
grid-row-gap: 4px;
border-bottom: 1px solid var(--line);
flex-wrap: wrap;
align-items: baseline;
padding-bottom: 18px;
display: flex;
}
.rx-pnote {
box-sizing: border-box;
grid-column-gap: 20px;
grid-row-gap: 20px;
border-radius: var(--radius);
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
margin-top: 16px;
padding: 20px 28px;
display: flex;
box-shadow: inset 0 0 0 1px #0d0e1026;
}
.rx-pnote-h {
box-sizing: border-box;
color: var(--ink);
font-weight: 500;
}
.rx-pnote-t {
box-sizing: border-box;
grid-column-gap: 14px;
grid-row-gap: 14px;
color: var(--ink-2);
align-items: center;
font-size: 15px;
display: flex;
}
.rx-prices {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-columns: repeat(4, minmax(0, 1fr));
display: grid;
}
.rx-a {
box-sizing: border-box;
height: 0;
transition: height .55s cubic-bezier(.2, .7, .2, 1);
overflow: hidden;
}
.rx-a-p {
box-sizing: border-box;
color: var(--muted);
margin-top: 0;
margin-bottom: 0;
padding: 0 60px 28px 0;
font-size: 16px;
}
.rx-a-p.rx-a-p--in-qa--c {
padding-bottom: 24px;
}
.rx-faq {
box-sizing: border-box;
max-width: 880px;
margin-left: auto;
}
.rx-q {
box-sizing: border-box;
grid-column-gap: 24px;
grid-row-gap: 24px;
letter-spacing: -.02em;
cursor: pointer;
width: 100%;
color: inherit;
justify-content: space-between;
align-items: center;
padding: 26px 0;
font-size: clamp(18px, 1.7vw, 22px);
font-weight: 500;
text-decoration: none;
display: flex;
}
.rx-q.rx-q--in-qa--c {
padding: 22px 0;
font-size: clamp(17px, 1.5vw, 19px);
}
.rx-q-h {
box-sizing: border-box;
background-color: var(--ink);
width: 12px;
height: 1.5px;
margin: -.75px 0 0 -6px;
transition: transform .5s cubic-bezier(.2, .7, .2, 1), background .4s;
position: absolute;
top: 50%;
left: 50%;
}
.rx-q-ic {
box-sizing: border-box;
background-color: #fff;
border-radius: 50%;
flex: none;
width: 36px;
height: 36px;
transition: background .4s, transform .6s cubic-bezier(.2, .7, .2, 1);
position: relative;
box-shadow: 0 0 0 1px #0d0e1014;
}
.rx-q-v {
box-sizing: border-box;
background-color: var(--ink);
width: 12px;
height: 1.5px;
margin: -.75px 0 0 -6px;
transition: transform .5s cubic-bezier(.2, .7, .2, 1), background .4s;
position: absolute;
top: 50%;
left: 50%;
transform: rotate(90deg);
}
.rx-qa {
box-sizing: border-box;
border-top: 1px solid var(--line-2);
}
.rx-qa.rx-qa--c {
border-radius: var(--radius-small);
background-color: var(--card);
border-style: none;
border-width: 0;
padding: 0 24px;
transition: box-shadow .4s;
box-shadow: 0 0 0 1px #0d0e1014;
}
.rx-qa.rx-qa--c:hover {
box-shadow: 0 0 0 1px #0d0e1026;
}
.rx-qa.rx-qa--c.is-open {
box-shadow: 0 0 0 1px #0d0e1026, 0 20px 40px -30px #0d0e104d;
}
.rx-brief {
box-sizing: border-box;
flex-direction: column;
padding: 34px 34px 30px;
display: flex;
}
.rx-brief-dot {
box-sizing: border-box;
background-color: var(--line-2);
border-radius: 50%;
flex: none;
width: 8px;
height: 8px;
transition: background .3s;
}
.rx-brief-go {
box-sizing: border-box;
}
.rx-brief-l {
box-sizing: border-box;
margin: 22px 0 12px;
}
.rx-brief-s {
box-sizing: border-box;
margin-top: 6px;
}
.rx-brief-sum {
box-sizing: border-box;
grid-column-gap: 10px;
grid-row-gap: 10px;
background-color: var(--background);
color: var(--ink-2);
border-radius: 14px;
align-items: center;
margin: 26px 0 18px;
padding: 14px 16px;
font-size: 14px;
display: flex;
}
.rx-brief-txt {
box-sizing: border-box;
}
.rx-chips {
box-sizing: border-box;
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-wrap: wrap;
display: flex;
}
.rx-clock {
box-sizing: border-box;
color: var(--brand-blue);
}
.rx-clock.rx-clock--in-ft-loc {
color: var(--sky);
}
.rx-ct {
box-sizing: border-box;
grid-row-gap: 0;
grid-column-gap: 0;
grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
padding: 0;
display: grid;
overflow: hidden;
}
.rx-head--c {
box-sizing: border-box;
}
.rx-me {
box-sizing: border-box;
border-radius: var(--radius-small);
background-color: var(--background);
flex-direction: column;
margin: 10px;
padding: 34px;
display: flex;
position: relative;
overflow: hidden;
}
.rx-me-a {
box-sizing: border-box;
grid-column-gap: 14px;
grid-row-gap: 14px;
color: inherit;
background-color: #fff;
border-radius: 16px;
align-items: center;
padding: 12px 14px;
text-decoration: none;
transition: box-shadow .4s, transform .5s cubic-bezier(.2, .7, .2, 1);
display: flex;
box-shadow: 0 0 0 1px #0d0e1014;
}
.rx-me-a:hover {
transform: translateY(-2px);
box-shadow: 0 0 0 1px #0d0e1026, 0 30px 60px -32px #0d0e1047;
}
.rx-me-acts {
box-sizing: border-box;
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-direction: column;
margin-top: 24px;
display: flex;
}
.rx-me-as {
box-sizing: border-box;
color: var(--muted);
font-size: 13px;
}
.rx-me-at {
box-sizing: border-box;
font-size: 15px;
font-weight: 500;
}
.rx-me-av {
box-sizing: border-box;
background-color: var(--brand-blue);
color: #fff;
border-radius: 50%;
place-items: center;
width: 64px;
height: 64px;
font-size: 19px;
font-weight: 600;
display: grid;
position: relative;
}
.rx-me-av.rx-me-av--in-ask2 {
color: var(--brand-blue);
background-color: #fff;
}
.rx-me-go {
box-sizing: border-box;
width: 16px;
height: 16px;
color: var(--muted);
margin-left: auto;
transition: transform .5s cubic-bezier(.2, .7, .2, 1);
}
.rx-me-ic {
box-sizing: border-box;
background-color: var(--blue-tint);
width: 38px;
height: 38px;
color: var(--brand-blue);
border-radius: 12px;
flex: none;
padding: 10px;
}
.rx-me-n {
box-sizing: border-box;
letter-spacing: -.02em;
font-size: 20px;
font-weight: 500;
}
.rx-me-on {
box-sizing: border-box;
background-color: #3ddc84;
border-radius: 50%;
width: 14px;
height: 14px;
position: absolute;
bottom: 0;
right: 0;
box-shadow: 0 0 0 3px #f5f4f0;
}
.rx-me-on.rx-me-on--in-ask2 {
box-shadow: 0 0 0 3px #3b5bdb;
}
.rx-me-p {
box-sizing: border-box;
color: var(--ink-2);
margin-top: 20px;
margin-bottom: 0;
font-size: 16px;
}
.rx-me-top {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
align-items: center;
display: flex;
}
.rx-pick {
box-sizing: border-box;
cursor: pointer;
height: 40px;
color: inherit;
border-radius: 999px;
align-items: center;
padding: 0 16px;
font-size: 14px;
text-decoration: none;
transition: background .3s, color .3s, box-shadow .3s, transform .3s cubic-bezier(.2, .7, .2, 1);
display: inline-flex;
box-shadow: inset 0 0 0 1px #0d0e1026;
}
.rx-pick:hover {
box-shadow: inset 0 0 0 1px #0d0e10;
}
.rx-strip {
box-sizing: border-box;
border-radius: var(--radius);
grid-template-columns: repeat(3, minmax(0, 1fr));
margin-top: 16px;
display: grid;
box-shadow: inset 0 0 0 1px #0d0e1026;
}
.rx-strip-c {
box-sizing: border-box;
grid-column-gap: 10px;
grid-row-gap: 10px;
font-family: var(--font-mono);
color: var(--ink-2);
letter-spacing: .07em;
text-transform: uppercase;
justify-content: center;
align-items: center;
padding: 18px;
font-size: 11px;
display: flex;
}
.rx-ask {
box-sizing: border-box;
background-color: #ffffff1a;
border-radius: 22px;
padding: 1px;
position: relative;
overflow: hidden;
}
.rx-ask-ar {
box-sizing: border-box;
opacity: .6;
width: 14px;
height: 14px;
}
.rx-ask-b {
box-sizing: border-box;
color: inherit;
background-color: #ffffff0f;
border-radius: 12px;
justify-content: space-between;
align-items: center;
padding: 11px 14px;
font-size: 14px;
font-weight: 500;
text-decoration: none;
transition: background .3s, transform .4s cubic-bezier(.2, .7, .2, 1);
display: flex;
}
.rx-ask-b:hover {
background-color: var(--brand-blue);
transform: translateY(-2px);
}
.rx-ask-bs {
box-sizing: border-box;
grid-column-gap: 8px;
grid-row-gap: 8px;
grid-template-columns: 1fr 1fr;
margin-top: 12px;
display: grid;
}
.rx-ask-glow {
box-sizing: border-box;
background: conic-gradient(from 0deg, transparent 0 70%, var(--brand-blue) 82%, var(--sky) 88%, transparent 96%);
animation: 6s linear infinite rxSpin;
position: absolute;
inset: -60%;
}
.rx-ask-h {
box-sizing: border-box;
grid-column-gap: 10px;
grid-row-gap: 10px;
align-items: center;
font-size: 17px;
font-weight: 500;
display: flex;
}
.rx-ask-in {
box-sizing: border-box;
background-color: #131418;
border-radius: 21px;
padding: 22px;
position: relative;
}
.rx-ask-prompt {
box-sizing: border-box;
min-height: 76px;
font-family: var(--font-mono);
color: #ffffffbf;
background-color: #ffffff0d;
border-radius: 14px;
margin-top: 14px;
padding: 14px;
font-size: 12px;
line-height: 1.6;
}
.rx-ask-spark {
box-sizing: border-box;
width: 18px;
height: 18px;
color: var(--sky);
}
.rx-ask-type {
box-sizing: border-box;
}
.rx-fl {
box-sizing: border-box;
color: #ffffffd1;
width: fit-content;
padding: 4px 0;
font-size: 15px;
text-decoration: none;
transition: color .3s, transform .4s cubic-bezier(.2, .7, .2, 1);
display: block;
}
.rx-fl:hover {
color: #fff;
transform: translateX(3px);
}
.rx-ft {
box-sizing: border-box;
background-color: var(--ink);
color: #fff;
border-radius: 32px 32px 0 0;
margin-top: clamp(88px, 11vw, 152px);
padding: 96px 0 28px;
position: relative;
overflow: hidden;
}
.rx-ft-bot {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
font-family: var(--font-mono);
color: #ffffff80;
letter-spacing: .06em;
text-transform: uppercase;
justify-content: space-between;
align-items: center;
margin-top: 28px;
font-size: 11px;
display: flex;
}
.rx-ft-cols {
box-sizing: border-box;
grid-column-gap: 24px;
grid-row-gap: 24px;
grid-template-columns: repeat(3, 1fr);
display: grid;
}
.rx-ft-h {
box-sizing: border-box;
font-family: var(--font-mono);
color: #ffffff73;
letter-spacing: .08em;
text-transform: uppercase;
margin-bottom: 14px;
font-size: 11px;
}
.rx-ft-loc {
box-sizing: border-box;
grid-column-gap: 10px;
grid-row-gap: 10px;
font-family: var(--font-mono);
color: #ffffffb8;
letter-spacing: .06em;
text-transform: uppercase;
background-color: #ffffff0f;
border-radius: 999px;
align-items: center;
margin-top: 22px;
padding: 8px 14px;
font-size: 11px;
display: inline-flex;
}
.rx-ft-p {
box-sizing: border-box;
color: #ffffff9e;
max-width: 280px;
margin-top: 14px;
margin-bottom: 0;
font-size: 15px;
}
.rx-ft-stat {
box-sizing: border-box;
grid-column-gap: 10px;
grid-row-gap: 10px;
border-radius: 12px;
align-items: center;
height: 44px;
padding: 0 16px;
display: flex;
box-shadow: inset 0 0 0 1px #ffffff1f;
}
.rx-ft-stat-l {
box-sizing: border-box;
color: #ffffff94;
font-size: 12px;
}
.rx-ft-stat-n {
box-sizing: border-box;
letter-spacing: -.03em;
font-size: 20px;
font-weight: 500;
}
.rx-ft-top {
box-sizing: border-box;
grid-column-gap: 40px;
grid-row-gap: 40px;
grid-template-columns: 1.1fr 1.4fr 1.3fr;
align-items: start;
display: grid;
}
.rx-ft-trust {
box-sizing: border-box;
grid-column-gap: 12px;
grid-row-gap: 12px;
border-top: 1px solid #ffffff14;
flex-wrap: wrap;
align-items: center;
margin-top: 56px;
padding-top: 28px;
display: flex;
}
.rx-ft-up {
box-sizing: border-box;
grid-column-gap: 10px;
grid-row-gap: 10px;
color: #ffffffd1;
align-items: center;
text-decoration: none;
display: inline-flex;
}
.rx-ft-up-i {
box-sizing: border-box;
background-color: #ffffff14;
border-radius: 50%;
width: 30px;
height: 30px;
padding: 8px;
transition: transform .5s cubic-bezier(.2, .7, .2, 1), background .3s;
}
.rx-ft-word {
box-sizing: border-box;
color: #0000;
text-align: center;
letter-spacing: -.075em;
-webkit-text-fill-color: transparent;
-webkit-user-select: none;
user-select: none;
background: linear-gradient(#ffffff29, #ffffff05 85%);
margin-top: 56px;
font-size: clamp(100px, 22vw, 320px);
font-weight: 600;
line-height: .78;
}
.rx-avs {
box-sizing: border-box;
display: flex;
}
.rx-avs-i {
box-sizing: border-box;
background-color: var(--background);
width: 32px;
height: 32px;
color: var(--ink-2);
border-radius: 50%;
place-items: center;
margin-left: -8px;
font-size: 10.5px;
font-weight: 600;
display: grid;
box-shadow: 0 0 0 2px #fff;
}
.rx-avs-i.rx-avs-i--in-hero {
background-color: #fff;
width: 34px;
height: 34px;
margin-left: -6px;
font-size: 10px;
box-shadow: 0 0 0 2px #f5f4f0;
}
.rx-bento {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-rows: repeat(2, minmax(250px, auto));
grid-template-columns: repeat(3, minmax(0, 1fr));
display: grid;
}
.rx-bt {
box-sizing: border-box;
grid-column-gap: 12px;
grid-row-gap: 12px;
border-radius: var(--radius);
background-color: var(--card);
flex-direction: column;
padding: 28px;
transition: transform .7s cubic-bezier(.2, .7, .2, 1), box-shadow .7s cubic-bezier(.2, .7, .2, 1);
display: flex;
position: relative;
overflow: hidden;
box-shadow: 0 0 0 1px #0d0e1014;
}
.rx-bt:hover {
transform: translateY(-4px);
box-shadow: 0 0 0 1px #0d0e1026, 0 30px 60px -32px #0d0e1047;
}
.rx-bt.rx-bt--tall {
grid-row: span 2;
padding: 10px;
}
.rx-bt.rx-bt--card.rx-bt--quote {
background: linear-gradient(#fff, #fbfaf7);
}
.rx-bt.rx-bt--tint {
background-color: var(--blue-tint);
box-shadow: none;
}
.rx-bt--card, .rx-bt--img {
box-sizing: border-box;
}
.rx-bt--quote {
box-sizing: border-box;
background: linear-gradient(#fff, #fbfaf7);
}
.rx-bt--tall {
box-sizing: border-box;
grid-row: span 2;
padding: 10px;
}
.rx-bt--tint {
box-sizing: border-box;
background-color: var(--blue-tint);
box-shadow: none;
}
.rx-bt-bar {
box-sizing: border-box;
background-color: #3b5bdb26;
border-radius: 6px;
height: 6px;
margin-top: auto;
overflow: hidden;
}
.rx-bt-big {
box-sizing: border-box;
letter-spacing: -.06em;
font-size: clamp(56px, 6vw, 84px);
font-weight: 500;
line-height: .95;
}
.rx-bt-big.rx-bt-big--in-bt--tint {
color: var(--blue-2);
}
.rx-bt-chips {
box-sizing: border-box;
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-wrap: wrap;
margin: 6px 0 auto;
display: flex;
}
.rx-bt-fill {
box-sizing: border-box;
background: linear-gradient(90deg, var(--sky), var(--brand-blue));
border-radius: 6px;
width: 0;
height: 100%;
transition: width 1.8s cubic-bezier(.65, 0, .35, 1) .3s;
}
.rx-bt-foot {
box-sizing: border-box;
grid-column-gap: 12px;
grid-row-gap: 12px;
align-items: center;
margin-top: auto;
display: flex;
}
.rx-bt-l {
box-sizing: border-box;
max-width: 260px;
font-size: 15px;
}
.rx-bt-l.rx-bt-l--in-bt-ov {
color: #fffc;
}
.rx-bt-ov {
z-index: 2;
box-sizing: border-box;
border-top-left-radius: var(--radius-small);
border-top-right-radius: var(--radius-small);
border-bottom-left-radius: var(--radius-small);
border-bottom-right-radius: var(--radius-small);
color: #fff;
background: linear-gradient(#0d0e1000, #0d0e10d1);
margin-top: auto;
padding: 22px;
position: relative;
}
.rx-bt-top {
box-sizing: border-box;
justify-content: space-between;
align-items: center;
display: flex;
}
.rx-meta--b {
box-sizing: border-box;
color: var(--blue-2);
}
.rx-qt-n {
box-sizing: border-box;
letter-spacing: -.02em;
font-size: 22px;
font-weight: 500;
}
.rx-qt-row {
box-sizing: border-box;
border-top-style: dashed;
border-top-width: 1px;
border-top-color: var(--line-2);
border-bottom-style: dashed;
border-bottom-width: 1px;
border-bottom-color: var(--line-2);
justify-content: space-between;
align-items: baseline;
margin-top: auto;
padding: 14px 0;
display: flex;
}
.rx-qt-stamp {
box-sizing: border-box;
grid-column-gap: 8px;
grid-row-gap: 8px;
background-color: var(--blue-tint);
color: var(--blue-2);
border-radius: 999px;
align-self: flex-start;
align-items: center;
padding: 6px 12px 6px 6px;
font-size: 13px;
font-weight: 500;
display: inline-flex;
transform: rotate(-2deg);
}
.rx-qt-v {
box-sizing: border-box;
letter-spacing: -.04em;
font-size: 28px;
font-weight: 500;
}
.rx-tabs {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
align-items: stretch;
display: grid;
}
.rx-tabs-l {
box-sizing: border-box;
flex-direction: column;
justify-content: center;
display: flex;
}
.rx-tabs-r {
box-sizing: border-box;
border-radius: var(--radius);
background-color: var(--background-2);
min-height: 560px;
position: relative;
overflow: hidden;
box-shadow: 0 0 0 1px #0d0e1014;
}
.rx-ti {
box-sizing: border-box;
grid-column-gap: 12px;
grid-row-gap: 4px;
border-top-style: solid;
border-top-width: 1px;
border-top-color: var(--line-2);
cursor: pointer;
color: inherit;
grid-template-columns: 44px minmax(0, 1fr);
padding: 24px 4px 26px;
text-decoration: none;
display: grid;
position: relative;
}
.rx-ti-b {
box-sizing: border-box;
}
.rx-ti-bar {
box-sizing: border-box;
height: 1px;
position: absolute;
bottom: -1px;
left: 0;
right: 0;
overflow: hidden;
}
.rx-ti-d {
box-sizing: border-box;
grid-template-rows: 0fr;
transition: grid-template-rows .6s cubic-bezier(.2, .7, .2, 1);
display: grid;
}
.rx-ti-fill {
box-sizing: border-box;
background-color: var(--brand-blue);
transform-origin: 0;
width: 100%;
height: 100%;
transform: scaleX(0);
}
.rx-ti-n {
box-sizing: border-box;
font-family: var(--font-mono);
color: var(--muted);
padding-top: 7px;
font-size: 12px;
transition: color .4s;
}
.rx-ti-t {
box-sizing: border-box;
color: var(--muted);
letter-spacing: -.03em;
font-size: clamp(22px, 2.2vw, 30px);
font-weight: 500;
transition: color .4s;
}
.rx-tp {
box-sizing: border-box;
opacity: 0;
pointer-events: none;
transition: opacity .8s cubic-bezier(.2, .7, .2, 1);
position: absolute;
inset: 0;
}
.rx-tp.is-on {
opacity: 1;
pointer-events: auto;
}
.rx-tp-card {
box-sizing: border-box;
opacity: 0;
-webkit-backdrop-filter: blur(14px);
backdrop-filter: blur(14px);
background-color: #ffffffeb;
border-radius: 20px;
width: min(380px, 100% - 48px);
padding: 22px;
transition: transform .9s cubic-bezier(.2, .7, .2, 1) .15s, opacity .7s .15s;
position: absolute;
bottom: 24px;
left: 24px;
transform: translateY(16px);
box-shadow: 0 0 0 1px #0d0e1014, 0 30px 60px -32px #0d0e1047;
}
.rx-tp-img {
box-sizing: border-box;
object-fit: cover;
object-position: top;
width: 100%;
max-width: 100%;
height: 100%;
transition: transform 1.6s cubic-bezier(.2, .7, .2, 1);
display: block;
position: absolute;
inset: 0;
transform: scale(1.08);
}
.rx-tp-tag {
box-sizing: border-box;
height: 32px;
font-family: var(--font-mono);
color: #fff;
letter-spacing: .06em;
text-transform: uppercase;
background-color: #0d0e10d1;
border-radius: 999px;
align-items: center;
padding: 0 14px;
font-size: 11px;
display: flex;
position: absolute;
top: 20px;
left: 20px;
}
.rx-rv {
box-sizing: border-box;
grid-column-gap: 28px;
grid-row-gap: 28px;
opacity: 0;
pointer-events: none;
flex-direction: column;
transition: opacity .6s, transform .8s cubic-bezier(.2, .7, .2, 1);
display: flex;
position: absolute;
inset: 0;
transform: translateY(14px);
}
.rx-rv.is-on {
opacity: 1;
pointer-events: auto;
transform: none;
}
.rx-rv-q {
box-sizing: border-box;
font-family: var(--font-serif);
color: var(--ink);
letter-spacing: -.015em;
margin-top: 0;
margin-bottom: 0;
font-size: clamp(28px, 3vw, 42px);
line-height: 1.12;
}
.rx-rvm {
box-sizing: border-box;
opacity: 0;
transition: opacity .8s cubic-bezier(.2, .7, .2, 1);
position: absolute;
inset: 0;
}
.rx-rvm.is-on {
opacity: 1;
}
.rx-rvm-img {
box-sizing: border-box;
object-fit: cover;
width: 100%;
max-width: 100%;
height: 100%;
transition: transform 2s cubic-bezier(.2, .7, .2, 1);
display: block;
transform: scale(1.06);
}
.rx-rvm-tag {
box-sizing: border-box;
grid-column-gap: 8px;
grid-row-gap: 8px;
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
background-color: #ffffffeb;
border-radius: 999px;
align-items: center;
height: 34px;
padding: 0 14px;
font-size: 13px;
font-weight: 500;
display: flex;
position: absolute;
bottom: 16px;
left: 16px;
}
.rx-rvs {
box-sizing: border-box;
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
padding: 10px;
display: grid;
}
.rx-rvs-a {
box-sizing: border-box;
width: 44px;
height: 44px;
color: inherit;
border-radius: 50%;
place-items: center;
text-decoration: none;
transition: background .3s, color .3s, box-shadow .3s;
display: grid;
box-shadow: inset 0 0 0 1px #0d0e1026;
}
.rx-rvs-a:hover {
background-color: var(--ink);
box-shadow: none;
color: #fff;
}
.rx-rvs-ai {
box-sizing: border-box;
width: 16px;
height: 16px;
}
.rx-rvs-arrows {
box-sizing: border-box;
grid-column-gap: 8px;
grid-row-gap: 8px;
display: flex;
}
.rx-rvs-count {
box-sizing: border-box;
grid-column-gap: 6px;
grid-row-gap: 6px;
font-family: var(--font-mono);
font-size: 12px;
display: flex;
}
.rx-rvs-cur {
box-sizing: border-box;
}
.rx-rvs-dfill {
box-sizing: border-box;
background-color: var(--ink);
transform-origin: 0;
position: absolute;
inset: 0;
transform: scaleX(0);
}
.rx-rvs-dot {
box-sizing: border-box;
background-color: var(--line-2);
max-width: 56px;
height: 3px;
color: inherit;
border-radius: 3px;
flex: 1;
text-decoration: none;
position: relative;
overflow: hidden;
}
.rx-rvs-dots {
box-sizing: border-box;
grid-column-gap: 6px;
grid-row-gap: 6px;
flex: 1;
display: flex;
}
.rx-rvs-l {
box-sizing: border-box;
flex-direction: column;
padding: 36px 34px 28px;
display: flex;
}
.rx-rvs-nav {
box-sizing: border-box;
grid-column-gap: 20px;
grid-row-gap: 20px;
border-top: 1px solid var(--line);
align-items: center;
margin-top: 28px;
padding-top: 22px;
display: flex;
}
.rx-rvs-r {
box-sizing: border-box;
border-radius: var(--radius-small);
background-color: var(--background-2);
min-height: 480px;
position: relative;
overflow: hidden;
}
.rx-rvs-stack {
box-sizing: border-box;
flex: 1;
min-height: 300px;
position: relative;
}
.rx-rvs-tot {
box-sizing: border-box;
color: var(--muted);
}
.rx-pc--hi {
box-sizing: border-box;
box-shadow: 0 0 0 1.5px #3b5bdb, 0 30px 60px -36px #3b5bdb8c;
}
.rx-pc-tag {
box-sizing: border-box;
background-color: var(--brand-blue);
color: #fff;
border-radius: 999px;
align-items: center;
height: 26px;
padding: 0 12px;
font-size: 12px;
font-weight: 500;
display: flex;
position: absolute;
top: -13px;
left: 24px;
}
.rx-ask2 {
box-sizing: border-box;
background-color: var(--brand-blue);
color: #fff;
grid-row-gap: 0;
grid-column-gap: 0;
padding: 28px 28px 150px;
position: relative;
overflow: hidden;
box-shadow: 0 30px 60px -36px #3b5bdbb3;
}
.rx-ask2-m {
box-sizing: border-box;
align-self: flex-start;
margin-top: 18px;
font-size: 14px;
}
.rx-ask2-p {
box-sizing: border-box;
margin: 18px 0 22px;
}
.rx-faq2 {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
align-items: start;
display: grid;
}
.rx-faq2-l {
box-sizing: border-box;
position: sticky;
top: 96px;
}
.rx-faq2-r {
box-sizing: border-box;
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-direction: column;
display: flex;
}
.rx-qa--c {
box-sizing: border-box;
border-radius: var(--radius-small);
background-color: var(--card);
border-style: none;
border-width: 0;
padding: 0 24px;
transition: box-shadow .4s;
box-shadow: 0 0 0 1px #0d0e1014;
}
.rx-qa--c:hover {
box-shadow: 0 0 0 1px #0d0e1026;
}
.rx-ct-blob {
z-index: -1;
box-sizing: border-box;
opacity: .75;
filter: blur(70px);
border-radius: 50%;
animation: 18s ease-in-out infinite alternate rxFloat;
position: absolute;
}
.rx-ct-blob.rx-ct-blob--1 {
background-color: #b9c6ff;
width: 520px;
height: 520px;
top: -180px;
left: -120px;
}
.rx-ct-blob.rx-ct-blob--2 {
background-color: #c9d8ff;
width: 460px;
height: 460px;
animation-duration: 22s;
bottom: -200px;
right: -100px;
}
.rx-ct-blob.rx-ct-blob--3 {
background-color: #e3e8ff;
width: 300px;
height: 300px;
animation-duration: 26s;
top: 30%;
left: 45%;
}
.rx-ct-blob--1 {
box-sizing: border-box;
background-color: #b9c6ff;
width: 520px;
height: 520px;
top: -180px;
left: -120px;
}
.rx-ct-blob--2 {
box-sizing: border-box;
background-color: #c9d8ff;
width: 460px;
height: 460px;
animation-duration: 22s;
bottom: -200px;
right: -100px;
}
.rx-ct-blob--3 {
box-sizing: border-box;
background-color: #e3e8ff;
width: 300px;
height: 300px;
animation-duration: 26s;
top: 30%;
left: 45%;
}
.rx-ct-glow {
box-sizing: border-box;
background-color: var(--background-2);
isolation: isolate;
border-radius: 32px;
padding: clamp(16px, 3vw, 40px);
position: relative;
overflow: hidden;
}
.rx-ft-mail {
box-sizing: border-box;
grid-column-gap: 10px;
grid-row-gap: 10px;
color: inherit;
border-bottom: 1px solid #ffffff14;
flex-direction: column;
margin-bottom: 56px;
padding-bottom: 56px;
text-decoration: none;
display: flex;
}
.rx-ft-mail-i {
box-sizing: border-box;
background-color: #ffffff14;
border-radius: 50%;
flex: none;
width: clamp(28px, 4vw, 52px);
height: clamp(28px, 4vw, 52px);
padding: 10px;
transition: transform .6s cubic-bezier(.2, .7, .2, 1), background .4s;
}
.rx-ft-mail-k {
box-sizing: border-box;
font-family: var(--font-mono);
color: var(--sky);
letter-spacing: .08em;
text-transform: uppercase;
font-size: 11px;
}
.rx-ft-mail-v {
box-sizing: border-box;
grid-column-gap: 18px;
grid-row-gap: 18px;
letter-spacing: -.05em;
align-items: center;
font-size: clamp(34px, 6vw, 84px);
font-weight: 500;
line-height: 1;
transition: color .4s;
display: flex;
}
.rx-load-bar {
box-sizing: border-box;
background-color: #ffffff14;
height: 3px;
position: absolute;
bottom: 0;
left: 0;
right: 0;
}
.rx-load-fill {
box-sizing: border-box;
background: linear-gradient(90deg, var(--brand-blue), var(--sky));
transform-origin: 0;
height: 100%;
animation: 1.15s cubic-bezier(.65, 0, .35, 1) .1s forwards rxFill;
transform: scaleX(0);
box-shadow: 0 0 18px 2px #5b78ff99;
}
.rx-load-foot {
box-sizing: border-box;
font-family: var(--font-mono);
color: #ffffff8c;
letter-spacing: .08em;
text-transform: uppercase;
justify-content: space-between;
align-items: flex-end;
font-size: 11px;
animation: .4s 1.3s forwards rxFade;
display: flex;
position: absolute;
bottom: 40px;
left: clamp(20px, 4vw, 48px);
right: clamp(20px, 4vw, 48px);
}
.rx-load-k {
box-sizing: border-box;
}
.rx-load-mark {
box-sizing: border-box;
background: linear-gradient(135deg, var(--sky), var(--brand-blue));
clip-path: polygon(50% 0, 60% 40%, 100% 50%, 60% 60%, 50% 100%, 40% 60%, 0 50%, 40% 40%);
width: 40px;
height: 40px;
animation: 1s cubic-bezier(.2, .7, .2, 1) 50ms forwards rxMark;
transform: scale(0)rotate(-180deg);
}
.rx-load-mid {
box-sizing: border-box;
grid-column-gap: 16px;
grid-row-gap: 16px;
justify-content: center;
align-items: center;
animation: .7s cubic-bezier(.65, 0, .35, 1) 1.35s forwards rxMidOut;
display: flex;
position: absolute;
top: 50%;
left: 0;
right: 0;
transform: translateY(-50%);
}
.rx-load-n {
box-sizing: border-box;
color: #fff;
font-size: 12px;
animation: 1.15s cubic-bezier(.65, 0, .35, 1) .1s forwards rxN;
}
.rx-load-panel {
box-sizing: border-box;
background-color: var(--ink);
color: #fff;
border-radius: 0;
animation: .9s cubic-bezier(.65, 0, .35, 1) 1.4s forwards rxLift;
position: absolute;
inset: 0;
}
.rx-load-wm {
box-sizing: border-box;
padding: 4px 0;
overflow: hidden;
}
.rx-load-wm-t {
box-sizing: border-box;
letter-spacing: -.045em;
font-size: clamp(30px, 4vw, 48px);
font-weight: 500;
line-height: 1.05;
animation: .9s cubic-bezier(.2, .7, .2, 1) .25s forwards rxWm;
transform: translateY(110%);
}
.rx-btn--2l {
box-sizing: border-box;
grid-column-gap: 22px;
grid-row-gap: 22px;
text-align: left;
height: 64px;
padding-left: 26px;
}
.rx-btn-2 {
box-sizing: border-box;
grid-column-gap: 2px;
grid-row-gap: 2px;
flex-direction: column;
line-height: 1.2;
display: flex;
}
.rx-btn-s {
box-sizing: border-box;
opacity: .62;
letter-spacing: 0;
font-size: 12.5px;
font-weight: 400;
transition: opacity .5s;
}
.rx-eyebrow {
box-sizing: border-box;
grid-column-gap: 10px;
grid-row-gap: 10px;
height: 36px;
color: var(--ink-2);
background-color: #fff;
border-radius: 999px;
align-items: center;
margin-bottom: 30px;
padding: 0 8px 0 14px;
font-size: 13.5px;
font-weight: 500;
text-decoration: none;
transition: box-shadow .4s, transform .5s cubic-bezier(.2, .7, .2, 1);
display: inline-flex;
box-shadow: 0 0 0 1px #0d0e1014;
}
.rx-eyebrow:hover {
transform: translateY(-2px);
box-shadow: 0 0 0 1px #0d0e1026, 0 30px 60px -32px #0d0e1047;
}
.rx-eyebrow.rx-eyebrow--quiet {
height: 34px;
box-shadow: none;
color: #2f4bc4;
letter-spacing: -.005em;
background-color: #e9edfb;
padding-left: 14px;
padding-right: 16px;
font-size: 14px;
}
.rx-eyebrow-dot {
box-sizing: border-box;
background-color: #3b5bdb;
border-radius: 50%;
flex-shrink: 0;
width: 7px;
height: 7px;
box-shadow: 0 0 0 4px #3b5bdb24;
}
.rx-eyebrow-i {
box-sizing: border-box;
background-color: var(--background);
width: 22px;
height: 22px;
color: var(--ink);
border-radius: 50%;
padding: 4px;
transition: transform .5s cubic-bezier(.2, .7, .2, 1), background .3s, color .3s;
}
.rx-hero-ctas {
box-sizing: border-box;
grid-column-gap: 12px;
grid-row-gap: 12px;
flex-wrap: wrap;
justify-content: center;
margin-top: 34px;
display: flex;
}
.rx-proof {
box-sizing: border-box;
grid-column-gap: 22px;
grid-row-gap: 22px;
flex-wrap: wrap;
justify-content: center;
align-items: center;
margin-top: 40px;
display: flex;
}
.rx-proof-b {
box-sizing: border-box;
font-size: 14px;
font-weight: 600;
line-height: 1;
}
.rx-proof-big {
box-sizing: border-box;
letter-spacing: -.05em;
font-size: 22px;
font-weight: 500;
line-height: 1;
}
.rx-proof-d {
box-sizing: border-box;
background-color: var(--line-2);
width: 1px;
height: 32px;
}
.rx-proof-i {
box-sizing: border-box;
grid-column-gap: 12px;
grid-row-gap: 12px;
text-align: left;
color: inherit;
align-items: center;
text-decoration: none;
display: flex;
}
.rx-proof-i--a {
box-sizing: border-box;
}
.rx-proof-ics {
box-sizing: border-box;
display: flex;
}
.rx-proof-ics.rx-proof-ics--in-proof-i--a {
transition: transform .5s cubic-bezier(.2, .7, .2, 1);
}
.rx-proof-s {
box-sizing: border-box;
color: var(--muted);
font-size: 12.5px;
line-height: 1.3;
}
.rx-proof-st {
box-sizing: border-box;
grid-column-gap: 8px;
grid-row-gap: 8px;
align-items: center;
display: flex;
}
.rx-proof-t {
box-sizing: border-box;
grid-column-gap: 2px;
grid-row-gap: 2px;
flex-direction: column;
display: flex;
}
.rx-wall-cap {
box-sizing: border-box;
opacity: 0;
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
color: #fff;
background-color: #0d0e10d1;
border-radius: 999px;
align-items: center;
height: 28px;
padding: 0 11px;
font-size: 12px;
font-weight: 500;
transition: opacity .35s, transform .5s cubic-bezier(.2, .7, .2, 1);
display: flex;
position: absolute;
bottom: 10px;
left: 10px;
transform: translateY(6px);
}
.wb-section {
background-color: var(--background);
font-family: var(--font-sans);
color: var(--ink);
padding-top: 144px;
padding-bottom: 120px;
}
.wb-container {
width: 100%;
max-width: 1272px;
margin-left: auto;
margin-right: auto;
padding-left: 32px;
padding-right: 32px;
}
.wb-lead {
max-width: 52ch;
color: var(--muted);
margin-top: 20px;
margin-bottom: 0;
font-size: 19px;
line-height: 1.5;
}
.wb-filter-bar {
grid-column-gap: 16px;
grid-row-gap: 16px;
border-top: 1px solid var(--line);
border-bottom: 1px solid var(--line);
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
margin-top: 56px;
padding-top: 20px;
padding-bottom: 20px;
display: flex;
}
.wb-pills {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-wrap: wrap;
display: flex;
}
.wb-pill {
border: 1px solid var(--line-2);
height: 44px;
color: var(--ink);
cursor: pointer;
background-color: #0000;
border-radius: 999px;
align-items: center;
padding: 0 20px;
font-size: 15px;
font-weight: 500;
line-height: 1;
transition: background-color .3s, color .3s, border-color .3s;
display: inline-flex;
}
.wb-pill:hover {
border-color: var(--ink);
}
.wb-pill.is-active {
border-color: var(--ink);
background-color: var(--ink);
color: #fff;
}
.wb-tag {
background-color: var(--background-2);
height: 28px;
font-family: var(--font-mono);
color: var(--ink-2);
letter-spacing: .06em;
text-transform: uppercase;
border-radius: 999px;
align-items: center;
padding-left: 12px;
padding-right: 12px;
font-size: 11px;
display: inline-flex;
}
.wb-h1 {
letter-spacing: -.048em;
max-width: 16ch;
margin-top: 20px;
margin-bottom: 0;
font-size: clamp(44px, 6vw, 84px);
font-weight: 500;
line-height: 1;
}
.wb-select {
border: 1px solid var(--line-2);
min-width: 170px;
height: 44px;
color: var(--ink);
background-color: #0000;
border-radius: 999px;
margin-bottom: 0;
padding-left: 20px;
padding-right: 16px;
font-size: 15px;
font-weight: 500;
}
.wb-tpl-grid {
grid-column-gap: 24px;
grid-row-gap: 56px;
grid-template-columns: repeat(3, minmax(0, 1fr));
margin-top: 40px;
display: grid;
}
.wb-tpl-card {
color: var(--ink);
flex-direction: column;
text-decoration: none;
display: flex;
}
.wb-tpl-media {
background-color: var(--background-2);
border-radius: 20px;
padding-top: 6%;
padding-left: 6%;
padding-right: 6%;
overflow: hidden;
}
.wb-tpl-img {
aspect-ratio: 3 / 2;
object-fit: cover;
object-position: 50% 0%;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
width: 100%;
transition: transform .9s cubic-bezier(.2, .7, .2, 1);
display: block;
box-shadow: 0 0 0 1px #0d0e1012, 0 18px 40px -22px #0d0e1059;
}
.wb-tpl-meta {
grid-column-gap: 14px;
color: var(--muted);
align-items: center;
margin-top: 22px;
font-size: 15px;
display: flex;
}
.wb-tpl-new {
grid-column-gap: 6px;
color: var(--ink);
align-items: center;
font-weight: 500;
display: flex;
}
.wb-dot {
background-color: #2fb36b;
border-radius: 50%;
width: 7px;
height: 7px;
}
.wb-tpl-price {
border: 1px solid var(--line-2);
color: var(--ink);
border-radius: 999px;
margin-left: auto;
padding: 5px 14px;
font-size: 15px;
display: flex;
}
.wb-tpl-name {
letter-spacing: -.03em;
margin-top: 14px;
margin-bottom: 0;
font-size: 30px;
font-weight: 500;
line-height: 1.1;
}
.wb-tpl-desc {
color: var(--ink-2);
margin-top: 8px;
margin-bottom: 0;
font-size: 17px;
line-height: 1.45;
}
.wb-empty {
color: var(--muted);
text-align: center;
background-color: #0000;
padding-top: 48px;
padding-bottom: 48px;
}
.rx-ico {
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
display: flex;
}
.rx-btn-a {
place-items: center;
transition: transform .6s cubic-bezier(.19, 1, .22, 1);
display: grid;
position: absolute;
inset: 0;
}
.rx-reel {
z-index: 2;
background-color: #0000;
padding-top: 0;
padding-bottom: 0;
position: relative;
overflow: hidden;
}
.rx-reel-row {
padding-top: 8px;
padding-bottom: 8px;
position: relative;
}
.rx-reel-ph {
display: none;
}
.rx-lens {
z-index: 3;
color: #0d0e10;
text-align: center;
background-color: #f5f4f080;
border-radius: 50%;
flex-direction: column;
justify-content: center;
align-items: center;
width: 224px;
height: 224px;
margin-top: -112px;
margin-left: -112px;
text-decoration: none;
display: flex;
position: absolute;
top: 50%;
left: 50%;
box-shadow: inset 0 0 0 1px #ffffffd9, inset 0 -24px 44px -24px #3b5bdb47, 0 0 0 1px #0d0e1012, 0 44px 80px -34px #0d0e1080;
}
.rx-lens-g {
background-position: 50%;
background-repeat: no-repeat;
background-size: contain;
width: 56px;
height: 56px;
margin-bottom: 10px;
}
.rx-lens-k {
color: #66676c;
letter-spacing: .08em;
text-transform: uppercase;
font-size: 10px;
line-height: 1.3;
font-family: var(--font-mono);
}
.rx-lens-t {
letter-spacing: -.035em;
margin-top: 4px;
font-size: 21px;
font-weight: 500;
line-height: 1.2;
}
.rx-lens-a {
color: #fff;
background-color: #0d0e10;
border-radius: 50%;
justify-content: center;
align-items: center;
width: 34px;
height: 34px;
margin-top: 12px;
display: flex;
}
.rx-reel-track {
will-change: transform;
width: max-content;
display: flex;
}
.rx-rc-item {
flex-grow: 0;
flex-shrink: 0;
width: 28vw;
min-width: 280px;
max-width: 420px;
padding-left: 8px;
padding-right: 8px;
position: relative;
}
.rx-rc {
color: #fff;
border-radius: 22px;
text-decoration: none;
display: block;
position: relative;
}
.rx-rc-m {
aspect-ratio: 16 / 10;
background-color: #ecebe4;
border-radius: 14px;
position: relative;
overflow: hidden;
box-shadow: 0 1px 2px #0d0e1014, 0 10px 24px -14px #0d0e104d;
}
.rx-rc-img {
object-fit: cover;
object-position: 50% 0%;
width: 100%;
height: 100%;
display: block;
}
.rx-rc-tag {
grid-column-gap: 6px;
background-color: #0d0e10d1;
border-radius: 999px;
align-items: center;
height: 30px;
padding-left: 12px;
padding-right: 12px;
font-size: 13px;
font-weight: 500;
line-height: 1;
display: flex;
position: absolute;
bottom: 10px;
left: 10px;
}
.rx-rc-tag-i {
width: 12px;
height: 12px;
}
.rx-flow {
background-color: #edece8;
border-radius: 30px;
padding-top: 0;
position: relative;
overflow: visible;
box-shadow: inset 0 0 0 1px #0d0e100f, inset 0 2px 3px #0d0e100d, 0 1px #ffffffe6;
}
.rx-fl-line {
background-color: #0d0e101a;
height: 1px;
display: none;
position: absolute;
top: 56px;
left: 56px;
right: 56px;
box-shadow: 0 1px #fffffff2;
}
.rx-fl-fill {
background-image: linear-gradient(90deg, #3b5bdb33, #3b5bdb);
width: 0%;
height: 100%;
position: relative;
}
.rx-fl-n {
grid-column-gap: 48px;
transform-origin: 50% 0;
background-color: #fff;
border-radius: 24px;
grid-template-rows: auto auto 1fr;
grid-template-columns: 1fr auto;
min-height: 300px;
padding: 40px 48px 40px 44px;
display: grid;
position: sticky;
top: 110px;
box-shadow: 0 1px 2px #0d0e100f, 0 -1px #0d0e100a, 0 18px 40px -24px #0d0e1059;
}
.rx-fl-ic {
grid-column-gap: 18px;
opacity: 1;
background-color: #f5f4f0;
border-radius: 28px;
grid-area: 1 / 2 / 4 / 3;
justify-content: center;
align-self: center;
align-items: center;
width: max-content;
min-width: 112px;
height: 112px;
padding-left: 30px;
padding-right: 30px;
display: flex;
box-shadow: inset 0 0 0 1px #0d0e100f, inset 0 2px 3px #0d0e100d, 0 1px #ffffffe6;
}
.rx-fl-live {
background-color: #3ddc84;
border-radius: 50%;
width: 12px;
height: 12px;
box-shadow: 0 0 0 6px #3ddc842e;
}
.rx-fl-num {
font-family: var(--font-mono);
color: #3b5bdb;
letter-spacing: .06em;
margin-top: 0;
font-size: 12px;
line-height: 1.3;
}
.rx-fl-t {
color: #0d0e10;
letter-spacing: -.04em;
margin-top: 12px;
font-size: 44px;
font-weight: 500;
line-height: 1.05;
}
.rx-fl-d {
color: #66676c;
align-self: end;
max-width: 36ch;
margin-top: 14px;
margin-bottom: 0;
font-size: 18px;
line-height: 1.5;
}
.rx-fl-steps {
grid-column-gap: 10px;
grid-row-gap: 18px;
flex-direction: column;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
padding: 12px;
display: flex;
position: relative;
}
.cf-card {
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr;
margin-top: 40px;
display: grid;
}
.cf-l {
background-color: #fbfaf8;
background-image: radial-gradient(circle at 0 0, #e3e8ff 0%, #e3e8ff00 60%);
border-radius: 22px;
padding: 48px 44px 44px;
position: relative;
overflow: hidden;
box-shadow: 0 1px 2px #0d0e100f, 0 12px 28px -18px #0d0e1040;
}
.cf-tag {
grid-column-gap: 8px;
color: #3a3b40;
background-color: #fff;
border-radius: 999px;
align-items: center;
height: 32px;
padding-left: 14px;
padding-right: 14px;
font-size: 13.5px;
font-weight: 500;
display: inline-flex;
box-shadow: 0 0 0 1px #0d0e1014;
}
.cf-tag-dot {
background-color: #3ddc84;
border-radius: 50%;
width: 7px;
height: 7px;
box-shadow: 0 0 0 4px #3ddc842e;
}
.cf-h2 {
color: #0d0e10;
letter-spacing: -.05em;
max-width: 10ch;
margin-top: 24px;
margin-bottom: 0;
font-size: 60px;
font-weight: 500;
line-height: 1;
}
.cf-em {
letter-spacing: -.02em;
font-style: italic;
font-weight: 400;
font-family: var(--font-serif);
}
.cf-pts {
grid-row-gap: 12px;
margin-top: 28px;
display: grid;
}
.cf-pt {
grid-column-gap: 12px;
color: #3a3b40;
align-items: flex-start;
font-size: 16px;
line-height: 1.45;
display: flex;
}
.cf-pt-ic {
color: #fff;
background-color: #3b5bdb;
border-radius: 50%;
flex: none;
justify-content: center;
align-items: center;
width: 22px;
height: 22px;
display: flex;
}
.cf-who {
grid-column-gap: 18px;
background-color: #fff;
border-radius: 20px;
align-items: center;
margin-top: 36px;
padding: 14px;
display: flex;
box-shadow: 0 0 0 1px #0d0e1014;
}
.cf-ph {
object-fit: cover;
object-position: 50% 0%;
background-color: #2f5bff;
border-radius: 16px;
flex: none;
width: 112px;
height: 112px;
}
.cf-who-n {
color: #0d0e10;
letter-spacing: -.02em;
font-size: 19px;
font-weight: 500;
line-height: 1.3;
}
.cf-who-r {
color: #66676c;
margin-top: 2px;
font-size: 14px;
line-height: 1.4;
}
.cf-who-l {
grid-column-gap: 16px;
grid-row-gap: 6px;
flex-wrap: wrap;
margin-top: 12px;
font-size: 14px;
font-weight: 500;
display: flex;
}
.cf-wa {
grid-column-gap: 6px;
color: #0d0e10;
align-items: center;
text-decoration: none;
display: inline-flex;
}
.cf-book {
color: #3b5bdb;
text-decoration: none;
}
.cf-r {
background-color: #fff;
border-radius: 22px;
padding: 44px 40px 40px;
position: relative;
box-shadow: 0 1px 2px #0d0e100f, 0 12px 28px -18px #0d0e1040;
}
.cf-fields {
grid-row-gap: 22px;
flex-direction: column;
display: flex;
}
.cf-row {
grid-column-gap: 16px;
grid-row-gap: 22px;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr;
display: grid;
}
.cf-f {
grid-row-gap: 8px;
flex-direction: column;
display: flex;
}
.cf-lab {
color: #0d0e10;
margin-bottom: 0;
font-size: 14px;
font-weight: 500;
line-height: 1.3;
}
.cf-opt {
color: #66676c;
margin-left: 4px;
font-weight: 400;
}
.cf-in {
color: #0d0e10;
background-color: #f5f4f0;
border-style: none;
border-radius: 14px;
height: auto;
margin-bottom: 0;
padding: 14px 16px;
font-size: 15.5px;
line-height: 1.4;
box-shadow: inset 0 0 0 1px #0d0e1014;
}
.cf-in:focus {
background-color: #fff;
box-shadow: inset 0 0 0 1.5px #0d0e10, 0 0 0 4px #3b5bdb1f;
}
.cf-in::placeholder {
color: #9a9ba0;
}
.cf-in.cf-ta {
min-height: 120px;
}
.cf-in._w-input {
color: #0d0e10;
background-color: #f5f4f0;
border-style: none;
border-radius: 14px;
height: auto;
margin-bottom: 0;
padding: 14px 16px;
font-size: 15.5px;
line-height: 1.4;
box-shadow: inset 0 0 0 1px #0d0e1014;
}
.cf-chips {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-wrap: wrap;
display: flex;
}
.cf-chip {
cursor: pointer;
margin-bottom: 0;
padding-left: 0;
font-weight: 400;
position: relative;
}
.cf-radio {
opacity: 0;
width: 1px;
height: 1px;
margin: 0;
position: absolute;
top: 0;
left: 0;
}
.cf-chip-t {
color: #0d0e10;
cursor: pointer;
border-radius: 999px;
align-items: center;
height: 40px;
padding-left: 16px;
padding-right: 16px;
font-size: 14.5px;
transition: background-color .3s, color .3s, box-shadow .3s;
display: inline-flex;
box-shadow: inset 0 0 0 1px #0d0e1026;
}
.cf-send {
grid-column-gap: 16px;
grid-row-gap: 16px;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
margin-top: 26px;
display: flex;
}
.cf-note {
grid-column-gap: 10px;
color: #66676c;
align-items: center;
font-size: 14px;
line-height: 1.4;
display: flex;
}
.cf-mini {
object-fit: cover;
object-position: 50% 0%;
background-color: #2f5bff;
border-radius: 50%;
width: 28px;
height: 28px;
}
.cf-btn {
color: #fff;
background-color: #0d0e10;
border-radius: 999px;
height: 56px;
padding-left: 28px;
padding-right: 28px;
font-size: 16px;
font-weight: 500;
line-height: 1;
}
.cf-btn:hover {
background-color: #3b5bdb;
}
.cf-ok-in {
text-align: left;
flex-direction: column;
align-items: flex-start;
display: flex;
}
.cf-ok-ic {
color: #fff;
background-color: #3b5bdb;
border-radius: 50%;
justify-content: center;
align-items: center;
width: 44px;
height: 44px;
display: flex;
}
.cf-ok-h {
color: #0d0e10;
letter-spacing: -.035em;
margin-top: 20px;
font-size: 30px;
font-weight: 500;
line-height: 1.15;
}
.cf-ok-p {
color: #66676c;
max-width: 38ch;
margin-top: 10px;
margin-bottom: 0;
font-size: 16px;
line-height: 1.55;
}
.cf-ok {
background-color: #0000;
padding: 44px 0;
}
.cf-err {
color: #9b1c1c;
background-color: #fdecec;
border-radius: 12px;
margin-top: 16px;
padding: 12px 16px;
font-size: 14px;
}
.rx-dock-ph {
object-fit: cover;
object-position: 50% 0%;
background-color: #2f5bff;
border-radius: 50%;
flex-grow: 0;
flex-shrink: 0;
width: 36px;
height: 36px;
box-shadow: 0 0 0 2px #ffffffe6;
}
.rx-hero-alt {
grid-column-gap: 8px;
color: #0d0e10;
align-items: center;
height: 56px;
padding-left: 14px;
padding-right: 6px;
font-size: 15.5px;
font-weight: 500;
text-decoration: none;
display: inline-flex;
}
.rx-hero-alt-i {
color: #3b5bdb;
justify-content: center;
align-items: center;
width: 16px;
height: 16px;
transition: transform .5s cubic-bezier(.2, .7, .2, 1);
display: flex;
}
.rx-logos {
z-index: 2;
grid-template-rows: auto;
grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr 1fr 1fr;
max-width: 1208px;
margin-top: 28px;
margin-left: auto;
margin-right: auto;
display: grid;
position: relative;
overflow: hidden;
}
.rx-lg-c {
border-right: 1px solid #0d0e1012;
justify-content: center;
align-items: center;
height: 96px;
display: flex;
position: relative;
box-shadow: 1px 0 #ffffffd9;
}
.rx-lg-c.rx-lg-c--label {
flex-direction: column;
justify-content: center;
align-items: flex-start;
padding-left: 22px;
padding-right: 20px;
}
.rx-lg-k {
color: #3a3b40;
letter-spacing: .08em;
text-transform: uppercase;
font-family: Geist Mono;
font-size: 11px;
line-height: 1.3;
}
.rx-lg-s {
color: #66676c;
margin-top: 6px;
font-size: 13px;
line-height: 1.4;
}
.rx-lg-img {
opacity: .55;
width: auto;
max-width: 58%;
max-height: 28px;
}
.rx-lg-n {
color: #9a9ba0;
letter-spacing: .06em;
font-family: Geist Mono;
font-size: 10px;
line-height: 1;
position: absolute;
top: 10px;
left: 12px;
}
.rx-lj {
z-index: 3;
width: 13px;
height: 13px;
position: absolute;
bottom: -7px;
right: -7px;
}
.rx-pr {
height: auto;
position: relative;
}
.rx-pr-pin {
grid-column-gap: 72px;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr;
align-items: start;
height: auto;
padding-bottom: 0;
display: grid;
position: relative;
top: 0;
}
.rx-pr-l {
flex-direction: column;
display: flex;
position: sticky;
top: 24vh;
}
.rx-pr-i {
grid-column-gap: 22px;
border-top: 1px solid #0d0e101a;
padding-top: 20px;
padding-bottom: 20px;
display: flex;
box-shadow: inset 0 1px #fffffff2;
}
.rx-pr-n {
color: #9a9ba0;
letter-spacing: .06em;
padding-top: 9px;
font-family: Geist Mono;
font-size: 12px;
line-height: 1;
}
.rx-pr-b {
flex: 1;
}
.rx-pr-t {
color: #9a9ba0;
letter-spacing: -.035em;
font-size: 30px;
font-weight: 500;
line-height: 1.1;
}
.rx-pr-d {
color: #66676c;
max-width: 34ch;
margin-top: 10px;
margin-bottom: 0;
font-size: 17px;
line-height: 1.5;
}
.rx-pr-r {
justify-content: center;
align-items: center;
display: block;
}
.rx-pr-deck {
aspect-ratio: auto;
width: 100%;
max-width: 440px;
margin-left: auto;
margin-right: auto;
padding-top: 4vh;
padding-bottom: 34vh;
position: relative;
}
.rx-pr-card {
aspect-ratio: 1;
background-color: #fff;
border-radius: 30px;
flex-direction: column;
justify-content: space-between;
width: 100%;
margin-bottom: 34vh;
padding: 28px;
display: flex;
position: sticky;
top: 18vh;
box-shadow: 0 1px 2px #0d0e100f, 0 30px 60px -30px #0d0e1066;
}
.rx-pr-card.rx-pr-card--plan {
background-color: #e9edfb;
}
.rx-pr-card.rx-pr-card--design {
color: #fff;
background-color: #0d0e10;
}
.rx-pr-card.rx-pr-card--build {
color: #fff;
background-color: #3b5bdb;
margin-bottom: 0;
}
.rx-pr-top {
justify-content: space-between;
align-items: baseline;
display: flex;
}
.rx-pr-cn {
color: #3b5bdb;
letter-spacing: .06em;
font-family: Geist Mono;
font-size: 12px;
}
.rx-pr-ct {
color: #0d0e10;
letter-spacing: -.03em;
font-size: 24px;
font-weight: 500;
line-height: 1.1;
}
.rx-pr-ic {
grid-column-gap: 24px;
background-color: #f5f4f0;
border-radius: 22px;
justify-content: center;
align-items: center;
height: 52%;
display: flex;
box-shadow: inset 0 0 0 1px #0d0e100f, inset 0 2px 3px #0d0e100d, 0 1px #ffffffe6;
}
.rx-pr-live {
background-color: #3ddc84;
border-radius: 50%;
width: 22px;
height: 22px;
box-shadow: 0 0 0 10px #3ddc842e;
}
.rx-pr-tools {
color: #66676c;
letter-spacing: .08em;
text-transform: uppercase;
font-family: Geist Mono;
font-size: 12px;
}
.rx-pg {
max-width: 1080px;
margin-left: auto;
margin-right: auto;
padding-top: clamp(28px, 3.6vw, 44px);
padding-bottom: 6vh;
position: relative;
}
.rx-pg-card {
grid-column-gap: 32px;
grid-row-gap: 32px;
transform-origin: 50% 0;
background-color: #fff;
border-radius: 30px;
grid-template-rows: auto;
grid-template-columns: 1fr 1.15fr;
min-height: 440px;
margin-bottom: 14vh;
padding: 14px 14px 14px 40px;
display: grid;
position: sticky;
top: 16vh;
box-shadow: 0 1px 2px #0d0e100a, 0 0 0 1px #0d0e100a, 0 40px 70px -40px #0d0e104d;
}
.rx-pg-l {
flex-direction: column;
padding-top: 26px;
padding-bottom: 26px;
display: flex;
}
.rx-pg-n {
font-family: var(--font-mono);
color: #66676c;
letter-spacing: .06em;
font-size: 12px;
}
.rx-pg-t {
color: #0d0e10;
letter-spacing: -.035em;
margin-top: 30px;
margin-bottom: 0;
font-size: 44px;
font-weight: 500;
line-height: 1.05;
}
.rx-pg-m {
font-family: var(--font-mono);
color: #66676c;
letter-spacing: .1em;
text-transform: uppercase;
margin-top: 14px;
font-size: 11px;
}
.rx-pg-d {
color: #3a3b40;
max-width: 34ch;
margin-top: 22px;
margin-bottom: 0;
font-size: 16px;
line-height: 1.55;
}
.rx-pg-v {
grid-column-gap: 20px;
grid-row-gap: 20px;
background-color: #f5f4f0;
border-radius: 20px;
justify-content: center;
align-items: center;
min-height: 410px;
display: flex;
}
.rx-pg-v.rx-pg-v--plan {
background-color: #e9edfb;
}
.rx-pg-v.rx-pg-v--design {
background-color: #0d0e10;
}
.rx-pg-v.rx-pg-v--build {
background-color: #3b5bdb;
}
.rx-pg-ic {
background-color: #fff;
border-radius: 28px;
justify-content: center;
align-items: center;
width: 112px;
height: 112px;
display: flex;
box-shadow: 0 0 0 1px #0d0e100f, 0 24px 40px -22px #0d0e1080;
}
.rx-ts {
margin-top: clamp(28px, 3.6vw, 44px);
}
.rx-ts-in {
grid-column-gap: 48px;
grid-row-gap: 48px;
background-color: #fff;
border-radius: 22px;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr;
align-items: center;
padding: 56px 64px;
display: grid;
overflow: hidden;
box-shadow: 0 1px 2px #0d0e100a, 0 0 0 1px #0d0e100a;
}
.rx-ts-l {
flex-direction: column;
display: flex;
}
.rx-ts-top {
grid-column-gap: 16px;
grid-row-gap: 16px;
align-items: center;
display: flex;
}
.rx-ts-c {
font-family: var(--font-mono);
color: #9a9ba0;
letter-spacing: .06em;
flex: none;
font-size: 12px;
}
.rx-ts-cur {
color: #0d0e10;
}
.rx-ts-line {
background-color: #0d0e101a;
flex: 1;
height: 1px;
}
.rx-ts-slides {
margin-top: 32px;
display: grid;
}
.rx-ts-s {
grid-area: 1 / 1 / 2 / 2;
}
.rx-ts-t {
color: #0d0e10;
letter-spacing: -.035em;
margin-top: 0;
margin-bottom: 0;
font-size: 44px;
font-weight: 500;
line-height: 1.05;
}
.rx-ts-m {
font-family: var(--font-mono);
color: #66676c;
letter-spacing: .1em;
text-transform: uppercase;
margin-top: 12px;
font-size: 11px;
}
.rx-ts-q {
color: #26272b;
letter-spacing: -.015em;
max-width: 30ch;
margin-top: 26px;
margin-bottom: 0;
font-size: 22px;
line-height: 1.4;
}
.rx-ts-who {
grid-column-gap: 12px;
grid-row-gap: 12px;
align-items: center;
margin-top: 28px;
display: flex;
}
.rx-ts-av {
color: #3b5bdb;
letter-spacing: .02em;
background-color: #e9edfb;
border-radius: 50%;
justify-content: center;
align-items: center;
width: 44px;
height: 44px;
font-size: 13px;
font-weight: 600;
display: flex;
}
.rx-ts-n {
color: #0d0e10;
font-size: 15px;
font-weight: 500;
}
.rx-ts-r {
justify-content: center;
align-items: center;
min-height: 500px;
display: flex;
}
.rx-ts-nav {
grid-column-gap: 12px;
grid-row-gap: 12px;
align-items: center;
margin-top: 40px;
display: flex;
}
.rx-ts-b {
color: #0d0e10;
background-color: #fff;
border-radius: 50%;
justify-content: center;
align-items: center;
width: 52px;
height: 52px;
text-decoration: none;
display: flex;
position: relative;
box-shadow: inset 0 0 0 1px #0d0e101f;
}
.rx-ts-b.rx-ts-b--next {
box-shadow: none;
color: #fff;
background-color: #0d0e10;
}
.rx-ts-ring {
pointer-events: none;
border-radius: 50%;
position: absolute;
inset: -4px;
}
.rx-ts-hint {
font-family: var(--font-mono);
color: #9a9ba0;
letter-spacing: .12em;
text-transform: uppercase;
margin-left: auto;
font-size: 11px;
}
.rx-ts-deck {
width: 340px;
height: 440px;
position: relative;
}
.rx-ts-card {
cursor: grab;
touch-action: pan-y;
-webkit-user-select: none;
user-select: none;
background-color: #fff;
border-radius: 24px;
width: 100%;
height: 100%;
padding: 7px;
position: absolute;
top: 0;
left: 0;
box-shadow: 0 0 0 1px #0d0e1014, 0 30px 50px -28px #0d0e1073;
}
.rx-ts-img {
pointer-events: none;
object-fit: cover;
object-position: 50% 0%;
border-radius: 18px;
width: 100%;
height: 100%;
display: block;
}
.rx-ts-tag {
font-family: var(--font-mono);
color: #fff;
letter-spacing: .08em;
text-transform: uppercase;
background-color: #0d0e10d1;
border-radius: 999px;
padding: 7px 12px;
font-size: 10.5px;
position: absolute;
bottom: 18px;
left: 18px;
}
.rx-ts-role {
color: #66676c;
margin-top: 2px;
font-size: 13px;
}
.rx-tk {
z-index: 2;
margin-top: clamp(40px, 5vw, 64px);
position: relative;
}
.rx-tk-head {
grid-column-gap: 8px;
grid-row-gap: 8px;
justify-content: center;
align-items: center;
font-size: 14px;
line-height: 1.4;
display: flex;
}
.rx-tk-l {
color: #0d0e10;
font-weight: 500;
}
.rx-tk-s {
color: #66676c;
}
.rx-tk-m {
margin-top: 28px;
overflow: hidden;
}
.rx-tk-track {
width: max-content;
display: flex;
}
.rx-tk-i {
flex: none;
align-items: center;
height: 72px;
padding-left: clamp(32px, 4.2vw, 64px);
padding-right: clamp(32px, 4.2vw, 64px);
display: flex;
}
.rx-tk-img {
opacity: .78;
width: auto;
max-width: none;
height: 36px;
display: block;
}
.rx-dm {
contain: inline-size;
flex-basis: 100%;
order: -1;
grid-template-rows: 0fr;
grid-template-columns: 1fr;
display: grid;
}
.rx-dm-in {
min-height: 0;
padding-left: 8px;
padding-right: 8px;
overflow: hidden;
}
.rx-dm-pages {
grid-column-gap: 16px;
grid-row-gap: 2px;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr;
padding-top: 14px;
display: grid;
}
.rx-dm-a {
grid-column-gap: 8px;
color: #fff;
letter-spacing: -.03em;
align-items: baseline;
padding-top: 6px;
padding-bottom: 6px;
font-size: 24px;
font-weight: 500;
line-height: 1.15;
text-decoration: none;
display: flex;
}
.rx-dm-n {
color: #fff6;
letter-spacing: .06em;
font-size: 10.5px;
}
.rx-dm-meta {
grid-column-gap: 18px;
border-top: 1px solid #ffffff1a;
grid-template-rows: auto;
grid-template-columns: 1fr 1.5fr;
margin-top: 16px;
padding-top: 16px;
display: grid;
}
.rx-dm-col {
grid-row-gap: 7px;
flex-direction: column;
display: flex;
}
.rx-dm-k {
color: #ffffff73;
margin-bottom: 3px;
font-size: 12px;
}
.rx-dm-l {
color: #ffffffe0;
font-size: 14px;
line-height: 1.3;
text-decoration: none;
}
.rx-dm-l.rx-dm-l--mut {
color: #ffffff73;
}
.rx-dm-cta {
justify-content: space-between;
width: 100%;
margin-top: 18px;
margin-bottom: 10px;
}
.rx-dock-mn {
grid-row-gap: 5px;
background-color: #fff;
border-radius: 50%;
flex-direction: column;
flex: none;
justify-content: center;
align-items: center;
width: 44px;
height: 44px;
margin-left: 2px;
text-decoration: none;
display: flex;
}
.rx-dock-mn-l {
background-color: #0d0e10;
border-radius: 2px;
width: 16px;
height: 1.5px;
display: block;
}
.rx-tn-seg {
grid-column-gap: 6px;
align-items: center;
display: flex;
}
.rx-tn-b {
color: #3a3b40;
background-color: #0d0e100b;
border-radius: 999px;
flex-direction: column;
justify-content: center;
align-items: center;
height: 42px;
padding-left: 18px;
padding-right: 18px;
text-decoration: none;
transition: background-color .3s, color .3s;
display: flex;
box-shadow: inset 0 0 0 1px #0d0e1012;
}
.rx-tn-t {
font-size: 14px;
font-weight: 500;
line-height: 1.1;
}
.rx-tn-p {
color: #66676c;
margin-top: 2px;
font-size: 11px;
line-height: 1;
}
.rx-tn-end {
grid-column-gap: 6px;
justify-self: end;
align-items: center;
display: flex;
}
.rx-tn-me {
grid-column-gap: 8px;
color: #fff;
background-color: #3b5bdb;
border-radius: 999px;
align-items: center;
height: 42px;
padding-left: 4px;
padding-right: 16px;
font-size: 14px;
font-weight: 500;
text-decoration: none;
display: flex;
}
.rx-tn-ph {
object-fit: cover;
object-position: 50% 0%;
border-radius: 50%;
width: 34px;
height: 34px;
box-shadow: 0 0 0 2px #ffffffe6;
}
.rx-tn-mn {
grid-row-gap: 5px;
background-color: #0d0e10;
border-radius: 50%;
flex-direction: column;
justify-content: center;
align-items: center;
width: 42px;
height: 42px;
text-decoration: none;
display: flex;
}
.rx-tn-mn-l {
background-color: #fff;
border-radius: 2px;
width: 16px;
height: 1.5px;
display: block;
}
.rx-tm {
z-index: 5;
background-color: #fff;
border-radius: 24px;
width: 440px;
max-width: calc(100vw - 24px);
padding: 16px 18px 18px;
position: absolute;
top: calc(100% + 10px);
right: 0;
box-shadow: 0 0 0 1px #0d0e100f, 0 30px 60px -24px #0d0e1059;
}
.rx-tm-pages {
grid-column-gap: 16px;
grid-row-gap: 2px;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr;
display: grid;
}
.rx-tm-a {
grid-column-gap: 8px;
color: #0d0e10;
letter-spacing: -.03em;
align-items: baseline;
padding-top: 6px;
padding-bottom: 6px;
font-size: 24px;
font-weight: 500;
line-height: 1.15;
text-decoration: none;
display: flex;
}
.rx-tm-a.rx-tm-a--soon {
color: #9a9ba0;
}
.rx-tm-n {
color: #9a9ba0;
letter-spacing: .06em;
font-size: 10.5px;
}
.rx-tm-meta {
grid-column-gap: 18px;
border-top: 1px solid #0d0e1014;
grid-template-rows: auto;
grid-template-columns: 1fr 1.5fr;
margin-top: 16px;
padding-top: 16px;
display: grid;
}
.rx-tm-col {
grid-row-gap: 7px;
flex-direction: column;
display: flex;
}
.rx-tm-k {
color: #9a9ba0;
margin-bottom: 3px;
font-size: 12px;
}
.rx-tm-l {
color: #26272b;
font-size: 14px;
line-height: 1.3;
text-decoration: none;
}
.rx-tm-l.rx-tm-l--mut {
color: #9a9ba0;
}
.rx-tm-cta {
justify-content: space-between;
width: 100%;
margin-top: 18px;
}
.rx-ui {
color: #26272b;
text-align: left;
background-color: #fff;
border-radius: 14px;
width: 88%;
max-width: 440px;
font-size: 12px;
line-height: 1.4;
position: relative;
overflow: hidden;
box-shadow: 0 0 0 1px #0d0e100f, 0 24px 48px -24px #0d0e1066;
}
.rx-ui-bar {
grid-column-gap: 8px;
border-bottom: 1px solid #0d0e1012;
align-items: center;
height: 36px;
padding-left: 12px;
padding-right: 12px;
display: flex;
}
.rx-ui-logo {
grid-column-gap: 4px;
flex: none;
align-items: center;
display: flex;
}
.rx-ui-ttl {
color: #0d0e10;
font-size: 12px;
font-weight: 600;
}
.rx-ui-sub {
color: #9a9ba0;
margin-left: auto;
font-size: 11px;
}
.rx-ui-body {
min-height: 262px;
padding: 12px 14px;
position: relative;
}
.rx-sl-m {
grid-column-gap: 9px;
margin-bottom: 10px;
display: flex;
}
.rx-sl-av {
color: #7a4a1c;
background-color: #f1e4d6;
border-radius: 7px;
flex: none;
justify-content: center;
align-items: center;
width: 26px;
height: 26px;
font-size: 11px;
font-weight: 600;
display: flex;
}
.rx-sl-av.rx-sl-av--w {
color: #fff;
background-color: #3b5bdb;
}
.rx-sl-n {
color: #0d0e10;
font-size: 12px;
font-weight: 600;
}
.rx-sl-time {
color: #9a9ba0;
margin-left: 4px;
font-size: 10.5px;
font-weight: 400;
}
.rx-sl-t {
color: #3a3b40;
font-size: 12px;
}
.rx-sl-typing {
grid-column-gap: 3px;
background-color: #f2f2f0;
border-radius: 999px;
align-items: center;
height: 26px;
padding-left: 10px;
padding-right: 10px;
display: flex;
}
.rx-sl-dot {
background-color: #9a9ba0;
border-radius: 50%;
width: 5px;
height: 5px;
display: block;
}
.rx-sl-file {
color: #2f4bc4;
background-color: #f5f6fb;
border-left: 3px solid #3b5bdb;
border-top-right-radius: 6px;
border-bottom-right-radius: 6px;
padding: 7px 10px;
font-size: 11.5px;
font-weight: 500;
display: inline-block;
}
.rx-sl-in {
color: #9a9ba0;
border-radius: 8px;
padding: 8px 10px;
font-size: 11.5px;
position: absolute;
bottom: 12px;
left: 14px;
right: 14px;
box-shadow: inset 0 0 0 1px #0d0e101f;
}
.rx-nt-pr {
grid-column-gap: 10px;
align-items: center;
margin-bottom: 12px;
display: flex;
}
.rx-nt-pl {
color: #9a9ba0;
font-size: 11px;
}
.rx-nt-track {
background-color: #efefed;
border-radius: 999px;
flex: 1;
height: 5px;
overflow: hidden;
}
.rx-nt-fill {
background-color: #3b5bdb;
border-radius: 999px;
width: 45%;
height: 100%;
}
.rx-nt-cols {
grid-column-gap: 8px;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr 1fr;
display: grid;
}
.rx-nt-h {
color: #9a9ba0;
margin-bottom: 6px;
font-size: 10.5px;
font-weight: 500;
}
.rx-nt-card {
color: #26272b;
background-color: #fff;
border-radius: 7px;
margin-bottom: 6px;
padding: 8px 9px;
font-size: 11.5px;
font-weight: 500;
position: relative;
box-shadow: 0 0 0 1px #0d0e1014, 0 1px 2px #0d0e100f;
}
.rx-nt-card.rx-nt-card--done {
color: #9a9ba0;
text-decoration: line-through;
}
.rx-nt-tag {
color: #c2410c;
background-color: #fdece6;
border-radius: 4px;
margin-top: 5px;
padding: 1px 6px;
font-size: 10px;
font-weight: 500;
text-decoration: none;
display: inline-block;
}
.rx-nt-slot {
border-radius: 7px;
height: 52px;
margin-bottom: 6px;
box-shadow: inset 0 0 0 1px #0d0e101a;
}
.rx-nt-up {
grid-column-gap: 8px;
background-color: #f5f6fb;
border-radius: 8px;
align-items: center;
padding: 9px 10px;
display: flex;
position: absolute;
bottom: 12px;
left: 14px;
right: 14px;
}
.rx-nt-up-av {
color: #fff;
background-color: #3b5bdb;
border-radius: 50%;
flex: none;
justify-content: center;
align-items: center;
width: 20px;
height: 20px;
font-size: 10px;
font-weight: 600;
display: flex;
}
.rx-nt-up-t {
color: #26272b;
font-size: 11.5px;
}
.rx-fg-canvas {
background-color: #f3f3f1;
}
.rx-fg-lbl {
color: #9a9ba0;
margin-bottom: 4px;
font-size: 10px;
}
.rx-fg-frame {
background-color: #fff;
border-radius: 4px;
width: 78%;
padding: 12px;
position: relative;
box-shadow: 0 1px 3px #0d0e101a;
}
.rx-fg-nav {
background-color: #ececea;
border-radius: 3px;
height: 6px;
margin-bottom: 16px;
}
.rx-fg-h1 {
background-color: #26272b;
border-radius: 3px;
width: 80%;
height: 12px;
margin-bottom: 6px;
}
.rx-fg-h2 {
background-color: #26272b;
border-radius: 3px;
width: 55%;
height: 12px;
margin-bottom: 12px;
}
.rx-fg-p {
background-color: #e4e4e2;
border-radius: 3px;
width: 90%;
height: 5px;
margin-bottom: 5px;
}
.rx-fg-p.rx-fg-p--s {
width: 60%;
margin-bottom: 14px;
}
.rx-fg-btn {
color: #fff;
white-space: nowrap;
background-color: #3b5bdb;
border-radius: 999px;
align-items: center;
height: 22px;
padding-left: 10px;
padding-right: 10px;
font-size: 9px;
font-weight: 600;
display: inline-flex;
}
.rx-fg-pin {
grid-column-gap: 7px;
background-color: #fff;
border-radius: 4px 14px 14px;
align-items: flex-start;
width: 180px;
padding: 8px;
display: flex;
position: absolute;
top: 110px;
right: 12px;
box-shadow: 0 8px 24px -10px #0d0e1059, 0 0 0 1px #0d0e100f;
}
.rx-fg-pin-av {
color: #7a4a1c;
background-color: #f1e4d6;
border-radius: 50%;
flex: none;
justify-content: center;
align-items: center;
width: 20px;
height: 20px;
font-size: 10px;
font-weight: 600;
display: flex;
}
.rx-fg-pin-q {
color: #26272b;
font-size: 11px;
font-weight: 500;
}
.rx-fg-pin-r {
color: #3a3b40;
border-top: 1px solid #0d0e1012;
margin-top: 6px;
padding-top: 6px;
font-size: 10.5px;
}
.rx-fg-ok {
color: #15803d;
background-color: #e3f7ea;
border-radius: 4px;
margin-right: 4px;
padding: 1px 5px;
font-size: 9.5px;
font-weight: 600;
display: inline-block;
}
.rx-fg-cur {
pointer-events: none;
align-items: flex-start;
display: flex;
position: absolute;
top: 80%;
left: 62%;
}
.rx-fg-cur-t {
color: #fff;
background-color: #3b5bdb;
border-radius: 4px;
margin-top: 12px;
margin-left: -2px;
padding: 2px 6px;
font-size: 9.5px;
font-weight: 600;
}
.rx-bd-pub {
color: #fff;
text-align: center;
white-space: nowrap;
background-color: #0d0e10;
border-radius: 6px;
min-width: 82px;
height: 22px;
margin-left: auto;
padding-left: 10px;
padding-right: 10px;
font-size: 10.5px;
font-weight: 600;
line-height: 22px;
position: relative;
overflow: hidden;
}
.rx-bd-pub-b {
text-align: center;
position: absolute;
top: 0;
left: 0;
right: 0;
}
.rx-bd-body {
grid-column-gap: 10px;
grid-template-rows: auto;
grid-template-columns: 86px 1fr;
padding: 10px;
display: grid;
}
.rx-bd-side {
border-right: 1px solid #0d0e1012;
padding-right: 8px;
}
.rx-bd-k {
color: #9a9ba0;
margin-bottom: 8px;
font-size: 10px;
}
.rx-bd-ly {
color: #3a3b40;
background-color: #f3f4f8;
border-radius: 4px;
margin-bottom: 5px;
padding: 4px 6px;
font-size: 10.5px;
}
.rx-bd-canvas {
grid-row-gap: 6px;
background-color: #f3f3f1;
border-radius: 6px;
flex-direction: column;
padding: 8px;
display: flex;
}
.rx-bd-nav {
background-color: #fff;
border-radius: 4px;
justify-content: space-between;
align-items: center;
height: 16px;
padding-left: 6px;
padding-right: 6px;
display: flex;
}
.rx-bd-logo {
background-color: #26272b;
border-radius: 3px;
width: 22px;
height: 5px;
}
.rx-bd-links {
background-color: #d9d9d6;
border-radius: 3px;
width: 50px;
height: 4px;
}
.rx-bd-hero {
background-color: #0d0e10;
border-radius: 4px;
padding: 12px 10px;
}
.rx-bd-hl {
background-color: #fff;
border-radius: 3px;
width: 70%;
height: 8px;
margin-bottom: 5px;
}
.rx-bd-hl.rx-bd-hl--s {
width: 45%;
margin-bottom: 9px;
}
.rx-bd-cta {
background-color: #3b5bdb;
border-radius: 999px;
width: 44px;
height: 12px;
}
.rx-bd-cards {
grid-column-gap: 5px;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr 1fr;
display: grid;
}
.rx-bd-card {
background-color: #fff;
border-radius: 4px;
height: 42px;
}
.rx-bd-foot {
background-color: #e6e6e3;
border-radius: 4px;
height: 14px;
}
.rx-bd-toast {
grid-column-gap: 6px;
color: #fff;
white-space: nowrap;
background-color: #0d0e10;
border-radius: 999px;
align-items: center;
padding: 7px 12px;
font-size: 11px;
font-weight: 500;
display: flex;
position: absolute;
bottom: 14px;
left: 50%;
}
.rx-bd-live {
background-color: #3ddc84;
border-radius: 50%;
width: 7px;
height: 7px;
display: block;
box-shadow: 0 0 0 3px #3ddc8440;
}
.rx-tn-links {
grid-column-gap: 2px;
align-items: center;
display: flex;
}
.rx-tn-l {
color: #3a3b40;
border-radius: 999px;
align-items: center;
height: 38px;
padding-left: 14px;
padding-right: 14px;
font-size: 14.5px;
font-weight: 500;
text-decoration: none;
transition: color .3s, background-color .3s;
display: flex;
position: relative;
}
.rx-tm-soon {
color: #2f4bc4;
letter-spacing: 0;
background-color: #e9edfb;
border-radius: 999px;
align-self: center;
margin-left: 2px;
padding: 2px 7px;
font-size: 10.5px;
font-weight: 500;
}
.rx-cw {
margin-top: 56px;
position: relative;
}
.rx-cw-stage {
touch-action: pan-y;
-webkit-user-select: none;
user-select: none;
height: clamp(300px, 40vw, 540px);
position: relative;
}
.rx-cw-c {
transform-origin: 50% 140%;
color: #0d0e10;
background-color: #fff;
border-radius: 24px;
width: 62%;
max-width: 760px;
margin-left: auto;
margin-right: auto;
padding: 8px;
text-decoration: none;
display: block;
position: absolute;
top: 0;
left: 0;
right: 0;
box-shadow: 0 0 0 1px #0d0e100f, 0 40px 80px -40px #0d0e1059;
}
.rx-cw-m {
aspect-ratio: 16 / 10;
background-color: #eceae4;
border-radius: 16px;
position: relative;
overflow: hidden;
}
.rx-cw-img {
object-fit: cover;
object-position: 50% 0%;
width: 100%;
height: 100%;
display: block;
}
.rx-cw-tag {
color: #0d0e10;
background-color: #ffffffe0;
border-radius: 999px;
padding: 6px 12px;
font-size: 12px;
font-weight: 500;
line-height: 1.2;
position: absolute;
top: 22px;
left: 22px;
}
.rx-cw-cap {
display: none;
}
.rx-cw-info {
grid-template-rows: auto;
grid-template-columns: 1fr auto auto;
align-items: end;
gap: 16px 28px;
margin-top: 44px;
display: grid;
}
.rx-cw-n {
letter-spacing: -.02em;
font-size: 34px;
font-weight: 500;
line-height: 1.1;
}
.rx-cw-d {
color: #66676c;
margin-top: 8px;
font-size: 16px;
line-height: 1.5;
}
.rx-cw-meta {
color: #66676c;
letter-spacing: .04em;
text-transform: uppercase;
padding-bottom: 14px;
font-family: Geist Mono;
font-size: 12px;
}
.rx-cw-bar {
border-top: 1px solid #0d0e1014;
justify-content: space-between;
align-items: center;
column-gap: 20px;
margin-top: 28px;
padding-top: 20px;
display: flex;
position: relative;
}
.rx-cw-prog {
transform-origin: 0%;
background-color: #3b5bdb;
width: 100%;
height: 1px;
position: absolute;
top: -1px;
left: 0;
transform: scaleX(0);
}
.rx-cw-th {
column-gap: 8px;
display: flex;
}
.rx-cw-r {
align-items: center;
column-gap: 10px;
display: flex;
}
.rx-cw-ct {
color: #66676c;
margin-right: 10px;
font-family: Geist Mono;
font-size: 13px;
}
.rx-cw-i {
color: #0d0e10;
}
.rx-cw-b {
color: #0d0e10;
background-color: #fff;
border-radius: 999px;
width: 46px;
height: 46px;
display: block;
position: relative;
box-shadow: 0 0 0 1px #0d0e101a;
}
.rx-tf {
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
gap: 12px 24px;
margin-bottom: 28px;
display: flex;
}
.rx-tf-g {
background-color: #fff;
border-radius: 999px;
flex-wrap: wrap;
align-items: center;
gap: 6px;
padding: 5px;
display: flex;
box-shadow: 0 0 0 1px #0d0e1014;
}
.rx-tf-l {
color: #66676c;
letter-spacing: .06em;
text-transform: uppercase;
padding-left: 12px;
padding-right: 8px;
font-family: Geist Mono;
font-size: 11px;
}
.rx-tf-c {
color: #3a3b40;
border-radius: 999px;
padding: 8px 14px;
font-size: 14px;
font-weight: 500;
line-height: 1.2;
text-decoration: none;
display: block;
}
.rx-tf-empty {
text-align: center;
background-color: #fff;
border-radius: 24px;
flex-direction: column;
align-items: center;
row-gap: 10px;
padding: 56px 24px;
display: none;
box-shadow: 0 0 0 1px #0d0e1014;
}
.rx-tf-empty-t {
color: #3a3b40;
font-size: 17px;
}
.cf-mail {
color: #0d0e10;
font-weight: 500;
text-decoration: none;
}
.rx-cw-txt {
min-width: 0;
}
.rx-me-ph {
object-fit: cover;
width: 100%;
height: 100%;
position: absolute;
inset: 0;
}
.rx-cw-cn, .rx-cw-cd, .rx-cw-cm {
display: block;
}
.rx-niche {
color: #2f4bc4;
background-color: #e9edfb;
border-radius: 999px;
align-items: center;
column-gap: 8px;
margin-top: 14px;
padding: 7px 14px 7px 10px;
font-size: 13px;
font-weight: 500;
line-height: 1.3;
text-decoration: none;
display: inline-flex;
}
.rx-niche-d {
background-color: #3b5bdb;
border-radius: 999px;
flex: none;
width: 6px;
height: 6px;
}
.rx-tf-price {
align-items: center;
display: flex;
}
.rx-tplx {
width: 100%;
position: relative;
}
.rx-ts-ph {
object-fit: cover;
object-position: 50% 30%;
border-radius: 50%;
width: 100%;
height: 100%;
display: block;
}
.pj-card {
color: #0d0e10;
text-decoration: none;
display: block;
}
.pj-grid {
grid-template-columns: 1fr 1fr;
gap: 72px 28px;
margin-top: 64px;
display: grid;
}
.pj-media {
aspect-ratio: 3 / 2;
background-color: #ecebe6;
border-radius: 22px;
position: relative;
overflow: hidden;
}
.pj-img {
object-fit: cover;
object-position: 50% 0%;
width: 100%;
height: 100%;
display: block;
}
.pj-meta {
padding-top: 22px;
}
.pj-top {
justify-content: space-between;
align-items: baseline;
column-gap: 16px;
display: flex;
}
.pj-name {
letter-spacing: -.03em;
margin-top: 0;
margin-bottom: 0;
font-size: 26px;
font-weight: 500;
line-height: 1.15;
}
.pj-year {
color: #66676c;
flex-shrink: 0;
font-size: 13px;
}
.pj-desc {
color: #66676c;
margin-top: 8px;
margin-bottom: 0;
font-size: 16px;
line-height: 1.5;
}
.pj-tags {
flex-wrap: wrap;
gap: 8px;
margin-top: 16px;
display: flex;
}
.pj-tag {
color: #4a4b50;
background-color: #0d0e100d;
border-radius: 999px;
padding: 6px 11px;
font-size: 12px;
line-height: 1.2;
}
.cs {
padding-top: 170px;
padding-bottom: 24px;
}
.cs-back {
color: #66676c;
align-items: center;
font-size: 14px;
text-decoration: none;
display: inline-flex;
}
.cs-hero {
max-width: 940px;
margin-top: 40px;
}
.cs-eyebrow {
color: #3b5bdb;
letter-spacing: .08em;
text-transform: uppercase;
align-items: center;
column-gap: 10px;
font-size: 12px;
display: flex;
}
.cs-dot {
background-color: #b5b5b8;
border-radius: 50%;
width: 4px;
height: 4px;
}
.cs-title {
color: #0d0e10;
letter-spacing: -.045em;
margin-top: 18px;
margin-bottom: 0;
font-size: 80px;
font-weight: 500;
line-height: 1;
}
.cs-lede {
color: #4a4b50;
max-width: 720px;
margin-top: 22px;
margin-bottom: 0;
font-size: 22px;
line-height: 1.45;
}
.cs-facts {
border-top: 1px solid #0d0e101a;
grid-template-rows: auto;
grid-template-columns: 1fr 1.4fr 1fr 1fr auto;
align-items: end;
gap: 24px 28px;
margin-top: 56px;
padding-top: 24px;
display: grid;
}
.cs-fk {
color: #66676c;
letter-spacing: .06em;
text-transform: uppercase;
font-size: 12px;
}
.cs-fv {
color: #0d0e10;
margin-top: 8px;
font-size: 16px;
line-height: 1.4;
}
.cs-cover {
aspect-ratio: 3 / 2;
background-color: #ecebe6;
border-radius: 28px;
margin-top: 48px;
overflow: hidden;
}
.cs-cover-img {
object-fit: cover;
object-position: 50% 0%;
width: 100%;
height: 100%;
display: block;
}
.cs-body {
row-gap: 72px;
margin-top: 104px;
display: grid;
}
.cs-row {
border-top: 1px solid #0d0e101a;
grid-template-rows: auto;
grid-template-columns: 1fr 2fr;
gap: 16px 48px;
padding-top: 28px;
display: grid;
}
.cs-k {
color: #0d0e10;
letter-spacing: -.03em;
align-items: flex-start;
column-gap: 12px;
margin-top: 0;
margin-bottom: 0;
font-size: 30px;
font-weight: 500;
line-height: 1.1;
display: flex;
}
.cs-n {
color: #3b5bdb;
letter-spacing: .04em;
padding-top: 6px;
font-size: 13px;
}
.cs-rt {
color: #2b2c30;
font-size: 19px;
line-height: 1.6;
}
.cs-gal {
padding-top: 96px;
padding-bottom: 24px;
}
.cs-more {
padding-top: 120px;
padding-bottom: 40px;
}
.cs-more-h {
border-top: 1px solid #0d0e101a;
justify-content: space-between;
align-items: flex-end;
column-gap: 24px;
padding-top: 28px;
display: flex;
}
.cs-more-t {
color: #0d0e10;
letter-spacing: -.04em;
margin-top: 0;
margin-bottom: 0;
font-size: 44px;
font-weight: 500;
line-height: 1.05;
}
.cs-gal-1 {
grid-template-rows: auto;
grid-template-columns: 1fr 1fr;
gap: 20px;
margin-top: 104px;
display: grid;
}
.cs-shot {
aspect-ratio: 3 / 2;
background-color: #ecebe6;
border-radius: 22px;
overflow: hidden;
}
.cs-shot--wide {
grid-column: span 2 / span 2;
}
.cs-shot--43 {
aspect-ratio: 4 / 3;
}
.cs-shot-img {
object-fit: cover;
object-position: 50% 0%;
width: 100%;
height: 100%;
display: block;
}
.pr {
color: #0d0e10;
border-top: 1px solid #0d0e101a;
grid-template-rows: auto;
grid-template-columns: 64px 0 minmax(0, 1.7fr) minmax(0, 1fr) minmax(0, .6fr) minmax(0, .4fr) 44px;
align-items: center;
column-gap: 24px;
padding-top: 30px;
padding-bottom: 30px;
text-decoration: none;
display: grid;
position: relative;
}
.pr-n {
color: #66676c;
letter-spacing: .04em;
font-size: 13px;
}
.pr-thumb {
aspect-ratio: 3 / 2;
background-color: #ecebe6;
border-radius: 12px;
width: 0;
position: relative;
overflow: hidden;
}
.pr-img {
object-fit: cover;
object-position: 50% 0%;
width: 100%;
height: 100%;
display: block;
}
.pr-main {
min-width: 0;
}
.pr-name {
letter-spacing: -.035em;
margin-top: 0;
margin-bottom: 0;
font-size: 36px;
font-weight: 500;
line-height: 1.05;
}
.pr-name-t {
display: inline;
}
.pr-desc {
color: #66676c;
margin-top: 8px;
margin-bottom: 0;
font-size: 15px;
line-height: 1.45;
}
.pr-col {
color: #4a4b50;
letter-spacing: .05em;
text-transform: uppercase;
font-size: 12px;
line-height: 1.3;
}
.pr-ind, .pr-plat {
color: #4a4b50;
}
.pr-yr {
color: #66676c;
text-align: right;
}
.pr-go {
background-color: #0d0e100d;
border-radius: 999px;
justify-content: center;
align-items: center;
width: 44px;
height: 44px;
display: flex;
}
.pr-go-i {
background-color: #0d0e10;
width: 16px;
height: 16px;
}
.pr-o {
display: none;
}
.pr-list {
border-bottom: 1px solid #0d0e101a;
}
.cx {
padding-top: 150px;
padding-bottom: 40px;
}
.cx-top {
justify-content: space-between;
align-items: center;
column-gap: 16px;
display: flex;
}
.cx-back {
color: #66676c;
align-items: center;
font-size: 14px;
text-decoration: none;
display: inline-flex;
}
.cx-pos {
color: #66676c;
letter-spacing: .08em;
text-transform: uppercase;
font-size: 12px;
}
.cx-hero {
justify-items: start;
margin-top: 56px;
display: grid;
}
.cx-tags {
column-gap: 8px;
display: flex;
}
.cx-tag {
color: #2f4bc4;
letter-spacing: .08em;
text-transform: uppercase;
background-color: #e9edfb;
border-radius: 999px;
padding: 7px 12px;
font-size: 11px;
line-height: 1;
}
.cx-tag--yr {
color: #4a4b50;
background-color: #0d0e100d;
}
.cx-title {
color: #0d0e10;
letter-spacing: -.05em;
max-width: 1040px;
margin-top: 24px;
margin-bottom: 0;
font-size: 96px;
font-weight: 500;
line-height: .96;
}
.cx-lede {
color: #4a4b50;
max-width: 680px;
margin-top: 24px;
margin-bottom: 0;
font-size: 22px;
line-height: 1.45;
}
.cx-frame {
background-color: #fff;
border-radius: 24px;
margin-top: 64px;
overflow: hidden;
box-shadow: 0 40px 80px -40px #0d0e1059;
}
.cx-bar {
background-color: #f3f2ee;
border-bottom: 1px solid #0d0e1012;
grid-template-rows: auto;
grid-template-columns: 96px 1fr 96px;
align-items: center;
height: 48px;
padding-left: 18px;
padding-right: 18px;
display: grid;
}
.cx-dots {
column-gap: 6px;
display: flex;
}
.cx-dot {
background-color: #d9d8d3;
border-radius: 50%;
width: 10px;
height: 10px;
}
.cx-url {
color: #4a4b50;
text-align: center;
background-color: #fff;
border-radius: 999px;
justify-self: center;
min-width: 260px;
padding: 7px 16px;
font-size: 12px;
line-height: 1;
}
.cx-bar-sp {
height: 1px;
}
.cx-view {
aspect-ratio: 16 / 10;
background-color: #ecebe6;
overflow: hidden;
}
.cx-cover {
object-fit: cover;
object-position: 50% 0%;
width: 100%;
height: 100%;
display: block;
}
.cx-body {
grid-template-rows: auto;
grid-template-columns: 340px minmax(0, 1fr);
align-items: start;
column-gap: 80px;
margin-top: 120px;
display: grid;
}
.cx-side {
position: sticky;
top: 112px;
}
.cx-card {
background-color: #fff;
border-radius: 22px;
padding: 26px;
box-shadow: 0 0 0 1px #0d0e100f;
}
.cx-card-k {
color: #66676c;
letter-spacing: .08em;
text-transform: uppercase;
margin-bottom: 6px;
font-size: 11px;
}
.cx-row {
border-bottom: 1px solid #0d0e1012;
grid-template-rows: auto;
grid-template-columns: 92px minmax(0, 1fr);
column-gap: 12px;
padding-top: 14px;
padding-bottom: 14px;
display: grid;
}
.cx-row-k {
color: #66676c;
font-size: 13px;
line-height: 1.4;
}
.cx-row-v {
color: #0d0e10;
font-size: 14px;
line-height: 1.4;
}
.cx-live {
margin-top: 22px;
}
.cx-prog {
row-gap: 16px;
margin-top: 32px;
padding-left: 4px;
display: grid;
}
.cx-prog-i {
grid-template-rows: auto;
grid-template-columns: 30px minmax(0, 1fr);
align-items: center;
row-gap: 8px;
display: grid;
}
.cx-prog-n {
color: #9a9ba0;
font-size: 11px;
}
.cx-prog-t {
color: #9a9ba0;
font-size: 14px;
}
.cx-prog-b {
background-color: #0d0e1014;
border-radius: 2px;
grid-column: 2 / 3;
height: 2px;
overflow: hidden;
}
.cx-prog-f {
transform-origin: 0%;
background-color: #3b5bdb;
width: 100%;
height: 100%;
}
.cx-main {
row-gap: 96px;
display: grid;
}
.cx-sec {
row-gap: 24px;
display: grid;
}
.cx-sec-k {
color: #0d0e10;
letter-spacing: -.04em;
align-items: baseline;
column-gap: 14px;
margin-top: 0;
margin-bottom: 0;
font-size: 44px;
font-weight: 500;
line-height: 1.05;
display: flex;
}
.cx-sec-n {
color: #3b5bdb;
letter-spacing: .04em;
font-size: 13px;
}
.cx-rt {
color: #2b2c30;
max-width: 720px;
font-size: 20px;
line-height: 1.65;
}
.cx-rt-1, .cx-rt-2, .cx-rt-3 {
color: #2b2c30;
}
.cx-sec--res {
background-color: #0d0e10;
border-radius: 24px;
padding: 44px;
}
.cx-screens {
margin-top: 140px;
}
.cx-scr-h {
justify-content: space-between;
align-items: flex-end;
column-gap: 16px;
margin-bottom: 28px;
display: flex;
}
.cx-scr-t {
color: #0d0e10;
letter-spacing: -.04em;
margin-top: 0;
margin-bottom: 0;
font-size: 44px;
font-weight: 500;
line-height: 1.05;
}
.cx-scr-hint {
color: #66676c;
letter-spacing: .08em;
text-transform: uppercase;
font-size: 12px;
}
.cx-rail {
overflow: auto hidden;
}
.cx-track {
column-gap: 20px;
width: max-content;
display: flex;
}
.cx-shot {
aspect-ratio: 3 / 2;
background-color: #ecebe6;
border-radius: 20px;
flex-shrink: 0;
width: 880px;
overflow: hidden;
}
.cx-shot-img {
object-fit: cover;
object-position: 50% 0%;
width: 100%;
height: 100%;
display: block;
}
.cx-scr-bar {
background-color: #0d0e1014;
border-radius: 2px;
max-width: 320px;
height: 2px;
margin-top: 24px;
overflow: hidden;
}
.cx-scr-fill {
transform-origin: 0%;
background-color: #0d0e10;
width: 100%;
height: 100%;
}
.cx-data {
display: none;
}
.rx-avs-img {
object-fit: cover;
object-position: 50% 20%;
border-radius: 50%;
width: 100%;
height: 100%;
display: block;
}
.cf-loc {
color: #66676c;
flex-wrap: wrap;
align-items: center;
gap: 2px 6px;
margin-top: 6px;
font-size: 13px;
line-height: 1.3;
display: flex;
}
.cf-loc-d {
background-color: #2f9e6e;
border-radius: 50%;
width: 7px;
height: 7px;
margin-right: 2px;
box-shadow: 0 0 0 3px #2f9e6e26;
}
.cf-loc-t {
color: #66676c;
}
.cf-loc-s {
color: #b5b5b8;
}
.cf-clock {
color: #3b5bdb;
font-weight: 500;
}
.tp-hero {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr) 340px;
align-items: end;
column-gap: 80px;
margin-top: 56px;
display: grid;
}
.tp-hl {
justify-items: start;
display: grid;
}
.tp-buy {
box-shadow: none;
background-color: #0000;
border-radius: 22px;
padding: 28px 0 0;
display: grid;
}
.tp-price {
color: #0d0e10;
letter-spacing: -.05em;
align-items: flex-start;
font-size: 56px;
font-weight: 500;
line-height: 1;
display: flex;
}
.tp-cur {
letter-spacing: -.02em;
margin-top: 6px;
margin-right: 2px;
font-size: 28px;
}
.tp-amt {
color: #0d0e10;
}
.tp-once {
color: #66676c;
margin-top: 8px;
font-size: 14px;
}
.tp-buy-b {
margin-top: 22px;
}
.tp-prev {
justify-self: center;
margin-top: 18px;
}
.tp-frame {
margin-top: 0;
}
.tp-bar {
grid-template-rows: auto;
grid-template-columns: 1fr auto;
}
.tp-url {
justify-self: start;
}
.tp-hint {
color: #66676c;
font-size: 13px;
}
.tp-view {
aspect-ratio: 16 / 10;
background-color: #ecebe6;
height: auto;
position: relative;
overflow: hidden;
}
.tp-long {
width: 100%;
height: auto;
display: block;
}
.tp-cover {
object-fit: cover;
object-position: 50% 0%;
width: 100%;
height: 100%;
display: block;
}
.tp-body {
grid-template-columns: minmax(0, 1fr);
max-width: none;
margin-top: 112px;
}
.tp-rt {
color: #2b2c30;
}
.tp-in {
display: grid;
}
.tp-in-k {
color: #0d0e10;
align-items: center;
column-gap: 10px;
font-size: 18px;
font-weight: 500;
display: flex;
}
.tp-in-k2 {
margin-top: 36px;
}
.tp-in-c {
color: #2f4bc4;
background-color: #e9edfb;
border-radius: 999px;
padding: 4px 9px;
font-size: 12px;
line-height: 1;
}
.tp-chips {
grid-column-gap: 10px;
grid-row-gap: 10px;
flex-wrap: wrap;
margin-top: 16px;
display: flex;
}
.tp-src {
display: none;
}
.tp-list {
color: #2b2c30;
max-width: 720px;
font-size: 18px;
line-height: 1.55;
}
.tp-for {
max-width: 720px;
}
.tp-more {
padding-top: 120px;
padding-bottom: 140px;
}
.tp-setup {
background-color: #e9edfb;
border-radius: 24px;
justify-content: space-between;
align-items: center;
gap: 20px 32px;
padding: 30px 34px;
display: flex;
}
.tp-setup-k {
color: #2f4bc4;
font-size: 13px;
font-weight: 500;
}
.tp-setup-t {
color: #0d0e10;
letter-spacing: -.02em;
max-width: 620px;
margin-top: 8px;
margin-bottom: 0;
font-size: 22px;
font-weight: 500;
line-height: 1.3;
}
.tp-setup-b {
flex-shrink: 0;
}
.tp-more-h {
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-end;
gap: 12px 24px;
margin-top: 120px;
margin-bottom: 32px;
display: flex;
}
.tp-more-t {
color: #0d0e10;
letter-spacing: -.04em;
margin-top: 0;
margin-bottom: 0;
font-size: 44px;
font-weight: 500;
line-height: 1.05;
}
.tp-top {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
align-items: start;
column-gap: 56px;
margin-top: 40px;
display: grid;
}
.tp-media {
flex-direction: column;
display: flex;
}
.tp-tabs {
align-items: center;
column-gap: 6px;
margin-top: 16px;
display: flex;
}
.tp-tab {
color: #66676c;
cursor: pointer;
background-color: #0000;
border-radius: 999px;
padding: 9px 16px;
font-size: 14px;
line-height: 1.2;
}
.tp-tabs-hint {
color: #9a9ba0;
margin-left: auto;
font-size: 13px;
}
.tp-info {
flex-direction: column;
display: flex;
position: sticky;
top: 112px;
}
.tp-info-head {
border-bottom: 1px solid #0d0e1014;
flex-direction: column;
align-items: flex-start;
padding-bottom: 28px;
display: flex;
}
.tp-inc {
flex-direction: column;
margin-top: 28px;
display: flex;
}
.tp-inc-k {
color: #66676c;
margin-bottom: 6px;
font-size: 13px;
}
.tp-inc-r {
border-bottom: 1px solid #0d0e1012;
grid-template-rows: auto;
grid-template-columns: 32px minmax(0, 1fr) auto;
align-items: center;
column-gap: 12px;
padding-top: 12px;
padding-bottom: 12px;
display: grid;
}
.tp-inc-ic {
color: #3b5bdb;
background-color: #e9edfb;
border-radius: 9px;
width: 32px;
height: 32px;
}
.tp-inc-t {
color: #0d0e10;
font-size: 15px;
}
.tp-inc-x {
flex-wrap: wrap;
justify-content: flex-end;
gap: 6px;
display: flex;
}
.rv {
margin-top: 56px;
}
.rv-feat {
background-color: #fff;
border-radius: 24px;
margin: 0;
padding: 64px 64px 40px;
position: relative;
box-shadow: 0 0 0 1px #0d0e100f;
}
.rv-mark {
opacity: .18;
color: #3b5bdb;
font-size: 120px;
line-height: 1;
position: absolute;
top: 14px;
left: 54px;
}
.rv-feat-q {
color: #0d0e10;
letter-spacing: -.02em;
border-left-width: 0;
max-width: 900px;
margin: 0;
padding: 0;
font-size: 44px;
font-weight: 400;
line-height: 1.16;
position: relative;
}
.rv-hl {
color: #0d0e10;
background-color: #3b5bdb21;
border-radius: 6px;
padding-left: 4px;
padding-right: 4px;
}
.rv-feat-who {
text-align: left;
border-top: 1px solid #0d0e1014;
flex-wrap: wrap;
align-items: center;
gap: 12px 16px;
margin-top: 48px;
padding-top: 24px;
display: flex;
}
.rv-av {
object-fit: cover;
border-radius: 999px;
flex-shrink: 0;
width: 40px;
height: 40px;
}
.rv-av-l {
object-fit: cover;
border-radius: 999px;
flex-shrink: 0;
width: 52px;
height: 52px;
}
.rv-n {
color: #0d0e10;
font-size: 15px;
font-weight: 500;
line-height: 1.3;
}
.rv-r {
color: #66676c;
margin-top: 2px;
font-size: 13px;
line-height: 1.4;
}
.rv-ml {
color: #66676c;
letter-spacing: .04em;
text-transform: uppercase;
margin-left: auto;
font-family: Geist Mono;
font-size: 11px;
}
.rv-ms {
color: #66676c;
letter-spacing: .04em;
text-transform: uppercase;
flex-basis: 100%;
font-family: Geist Mono;
font-size: 11px;
}
.rv-go {
color: #3b5bdb;
margin-left: 24px;
font-size: 14px;
}
.rv-grid {
grid-template-rows: auto;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 16px;
margin-top: 16px;
display: grid;
}
.rv-c {
background-color: #fff;
border-radius: 20px;
flex-direction: column;
justify-content: space-between;
margin: 0;
padding: 32px;
display: flex;
box-shadow: 0 0 0 1px #0d0e100f;
}
.rv-q {
color: #0d0e10;
letter-spacing: -.01em;
border-left-width: 0;
margin: 0;
padding: 0;
font-size: 20px;
line-height: 1.45;
}
.rv-who {
text-align: left;
border-top: 1px solid #0d0e1014;
flex-wrap: wrap;
align-items: center;
gap: 10px 12px;
margin-top: 32px;
padding-top: 20px;
display: flex;
}
.rv-ph-av {
color: #66676c;
background-color: #eceae4;
border-radius: 999px;
flex-shrink: 0;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
font-size: 13px;
font-weight: 500;
display: flex;
}
.rv-tag {
color: #8a5a00;
background-color: #fff1d6;
border-radius: 999px;
margin-left: 8px;
padding: 2px 8px;
}
.cx-split {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr);
align-items: start;
column-gap: 56px;
display: grid;
}
.cx-media, .cx-aside {
min-width: 0;
}
.cx-q, .cx-qs {
display: none;
}
.cx-qs-t, .cx-qs-n, .cx-qs-r, .cx-qs-p {
display: block;
}
.jr-wrap {
margin-top: 56px;
}
.jr-c {
color: #0d0e10;
text-decoration: none;
display: block;
}
.jr-fr {
background-color: #fff;
border-radius: 24px;
padding: 8px;
}
.jr-img {
border-radius: 16px;
width: 100%;
display: block;
}
.jr-b {
margin-top: 20px;
}
.jr-m {
color: #66676c;
column-gap: 10px;
font-size: 13px;
display: flex;
}
.jr-date, .jr-rt {
display: block;
}
.jr-t {
margin-top: 10px;
margin-bottom: 0;
font-size: 24px;
font-weight: 500;
line-height: 1.2;
}
.jr-tt {
display: inline;
}
.jr-ex {
color: #66676c;
margin-top: 10px;
margin-bottom: 0;
font-size: 15px;
line-height: 1.55;
}
.jr-ft {
justify-content: space-between;
align-items: center;
margin-top: 18px;
display: flex;
}
.jr-au {
color: #66676c;
font-size: 13px;
}
.jr-go {
border-radius: 999px;
width: 44px;
height: 44px;
}
.jr-slug {
display: none;
}
.jp-sec {
padding-bottom: clamp(64px, 8vw, 112px);
}
.jp-top {
text-align: left;
max-width: 860px;
margin-left: auto;
margin-right: auto;
}
.jp-back {
grid-column-gap: 8px;
grid-row-gap: 8px;
color: #55565c;
align-items: center;
margin-bottom: 32px;
font-size: 14px;
text-decoration: none;
display: inline-flex;
}
.jp-meta {
grid-column-gap: 10px;
grid-row-gap: 10px;
color: #6b6c72;
letter-spacing: .02em;
flex-wrap: wrap;
align-items: center;
margin-bottom: 20px;
font-size: 13px;
display: flex;
}
.jp-h {
color: #0d0e10;
letter-spacing: -.03em;
margin-top: 0;
margin-bottom: 20px;
font-size: clamp(36px, 4.6vw, 64px);
font-weight: 500;
line-height: 1.06;
}
.jp-lede {
color: #55565c;
max-width: 720px;
margin-top: 0;
margin-bottom: 0;
font-size: clamp(18px, 1.5vw, 21px);
line-height: 1.55;
}
.jp-fr {
background-color: #fff;
border-radius: 28px;
max-width: 1120px;
margin-top: clamp(40px, 5vw, 64px);
margin-left: auto;
margin-right: auto;
padding: 8px;
}
.jp-img {
border-radius: 20px;
width: 100%;
height: auto;
display: block;
}
.jp-col {
max-width: 720px;
margin-top: clamp(48px, 6vw, 80px);
margin-left: auto;
margin-right: auto;
}
.jp-end {
grid-column-gap: 16px;
grid-row-gap: 16px;
border-top: 1px solid #0d0e101a;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
max-width: 720px;
margin-top: 64px;
margin-left: auto;
margin-right: auto;
padding-top: 32px;
display: flex;
}
.jp-end-t {
color: #0d0e10;
letter-spacing: -.01em;
margin-top: 0;
margin-bottom: 0;
font-size: 20px;
}
.jp-more {
padding-top: 0;
}
.jp-more-h {
grid-column-gap: 16px;
grid-row-gap: 16px;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-end;
margin-bottom: 40px;
display: flex;
}
.jp-more-t {
color: #0d0e10;
letter-spacing: -.025em;
margin-top: 0;
margin-bottom: 0;
font-size: clamp(28px, 3vw, 40px);
font-weight: 500;
line-height: 1.1;
}
.ab-facts {
grid-column-gap: 8px;
grid-row-gap: 8px;
grid-template-rows: auto;
grid-template-columns: repeat(4, minmax(0, 1fr));
margin-top: clamp(40px, 5vw, 64px);
display: grid;
}
.ab-fact {
grid-column-gap: 10px;
grid-row-gap: 10px;
background-color: #fff;
border-radius: 20px;
flex-direction: column;
padding: 28px 24px;
display: flex;
}
.ab-fact-n {
color: #0d0e10;
letter-spacing: -.03em;
font-size: clamp(28px, 2.6vw, 40px);
font-weight: 500;
line-height: 1.05;
}
.ab-fact-l {
color: #55565c;
font-size: 14px;
line-height: 1.45;
}
.ab-sec {
padding-top: clamp(72px, 8vw, 120px);
}
.ab-people {
grid-column-gap: 28px;
grid-row-gap: 28px;
grid-template-rows: auto;
grid-template-columns: repeat(2, minmax(0, 1fr));
display: grid;
}
.ab-person {
grid-column-gap: 22px;
grid-row-gap: 22px;
flex-direction: column;
display: flex;
}
.ab-ph-fr {
background-color: #fff;
border-radius: 24px;
padding: 8px;
}
.ab-ph {
aspect-ratio: 4 / 3;
object-fit: cover;
object-position: 50% 25%;
border-radius: 16px;
width: 100%;
height: auto;
display: block;
}
.ab-p-b {
grid-column-gap: 6px;
grid-row-gap: 6px;
flex-direction: column;
display: flex;
}
.ab-p-n {
color: #0d0e10;
letter-spacing: -.02em;
margin-top: 0;
margin-bottom: 0;
font-size: clamp(22px, 2vw, 28px);
font-weight: 500;
line-height: 1.2;
}
.ab-p-r {
color: #3b5bdb;
letter-spacing: .02em;
font-size: 14px;
}
.ab-p-t {
color: #55565c;
max-width: 520px;
margin-top: 8px;
margin-bottom: 0;
font-size: 16px;
line-height: 1.65;
}
.ab-steps {
grid-column-gap: 8px;
grid-row-gap: 8px;
grid-template-rows: auto;
grid-template-columns: repeat(3, minmax(0, 1fr));
display: grid;
}
.ab-step {
grid-column-gap: 12px;
grid-row-gap: 12px;
background-color: #fff;
border-radius: 20px;
flex-direction: column;
padding: 28px;
display: flex;
}
.ab-step-i {
color: #6b6c72;
letter-spacing: .04em;
font-size: 13px;
}
.ab-step-t {
color: #0d0e10;
letter-spacing: -.015em;
margin-top: 8px;
margin-bottom: 0;
font-size: 21px;
font-weight: 500;
line-height: 1.25;
}
.ab-step-p {
color: #55565c;
margin-top: 0;
margin-bottom: 0;
font-size: 15px;
line-height: 1.65;
}
.ab-end {
grid-column-gap: 16px;
grid-row-gap: 16px;
border-top: 1px solid #0d0e101a;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
margin-top: clamp(40px, 5vw, 64px);
padding-top: 28px;
display: flex;
}
.ab-end-t {
color: #0d0e10;
margin-top: 0;
margin-bottom: 0;
font-size: 18px;
}
.ab-end-l {
grid-column-gap: 28px;
grid-row-gap: 28px;
flex-wrap: wrap;
display: flex;
}
.lg-sec {
padding-bottom: clamp(64px, 8vw, 112px);
}
.lg-col {
max-width: 720px;
margin-left: auto;
margin-right: auto;
}
.lg-k {
color: #3b5bdb;
letter-spacing: .04em;
background-color: #9db0ff38;
border-radius: 999px;
margin-bottom: 20px;
padding: 6px 12px;
font-size: 12px;
display: inline-flex;
}
.lg-h1 {
color: #0d0e10;
letter-spacing: -.03em;
margin-top: 0;
margin-bottom: 12px;
font-size: clamp(36px, 4.6vw, 60px);
font-weight: 500;
line-height: 1.06;
}
.lg-up {
color: #6b6c72;
margin-top: 0;
margin-bottom: 28px;
font-size: 13px;
}
.lg-lede {
color: #2b2c31;
margin-top: 0;
margin-bottom: 12px;
font-size: clamp(18px, 1.5vw, 20px);
line-height: 1.6;
}
.lg-h2 {
color: #0d0e10;
letter-spacing: -.015em;
margin-top: 48px;
margin-bottom: 14px;
font-size: clamp(22px, 2vw, 26px);
font-weight: 500;
line-height: 1.25;
}
.lg-p {
color: #3d3e44;
margin-top: 0;
margin-bottom: 16px;
font-size: 16px;
line-height: 1.7;
}
.lg-ul {
margin-top: 0;
margin-bottom: 18px;
padding-left: 20px;
}
.lg-li {
color: #3d3e44;
margin-bottom: 8px;
font-size: 16px;
line-height: 1.65;
}
.ab-tl {
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-rows: auto;
grid-template-columns: repeat(4, minmax(0, 1fr));
display: grid;
}
.ab-tl-i {
grid-column-gap: 12px;
grid-row-gap: 12px;
background-color: #fff;
border-radius: 20px;
flex-direction: column;
min-height: 0;
padding: 28px 26px 30px;
display: flex;
}
.ab-tl-now {
grid-column-gap: 12px;
grid-row-gap: 12px;
background-color: #3b5bdb;
border-radius: 20px;
flex-direction: column;
min-height: 0;
padding: 28px 26px 30px;
display: flex;
}
.ab-tl-k {
color: #2f4bc4;
letter-spacing: .02em;
background-color: #e9edfb;
border-radius: 999px;
width: fit-content;
margin-bottom: 0;
padding: 5px 11px;
font-size: 12px;
font-weight: 500;
}
.ab-tl-kw {
color: #fff;
letter-spacing: .02em;
background-color: #ffffff29;
border-radius: 999px;
width: fit-content;
margin-bottom: 0;
padding: 5px 11px;
font-size: 12px;
font-weight: 500;
}
.ab-tl-t {
color: #0d0e10;
letter-spacing: -.02em;
margin-top: 64px;
margin-bottom: 0;
font-size: 22px;
font-weight: 500;
line-height: 1.2;
}
.ab-tl-tw {
color: #fff;
letter-spacing: -.02em;
margin-top: 64px;
margin-bottom: 0;
font-size: 22px;
font-weight: 500;
line-height: 1.2;
}
.ab-tl-p {
color: #55565c;
margin-top: 0;
margin-bottom: 0;
font-size: 15px;
line-height: 1.6;
}
.ab-tl-pw {
color: #ffffffd6;
margin-top: 0;
margin-bottom: 0;
font-size: 15px;
line-height: 1.6;
}
.ab-team {
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-rows: auto;
grid-template-columns: repeat(4, minmax(0, 1fr));
display: grid;
}
.ab-tm {
background-color: #fff;
border-radius: 24px;
flex-direction: column;
padding: 8px;
transition: transform .45s cubic-bezier(.2, .7, .2, 1), box-shadow .45s cubic-bezier(.2, .7, .2, 1);
display: flex;
}
.ab-tm:hover {
transform: translateY(-8px);
box-shadow: 0 0 0 1px #0d0e1014, 0 30px 60px -32px #0d0e1047;
}
.ab-tm-ph {
aspect-ratio: 4 / 5;
background-color: #e9edfb;
border-radius: 18px;
overflow: hidden;
}
.ab-tm-ini {
aspect-ratio: 4 / 5;
background-color: #e9edfb;
border-radius: 18px;
justify-content: center;
align-items: center;
display: flex;
overflow: hidden;
}
.ab-tm-img {
object-fit: cover;
object-position: 50% 22%;
width: 100%;
height: 100%;
transition: transform .8s cubic-bezier(.2, .7, .2, 1);
display: block;
}
.ab-tm-ini-t {
color: #3b5bdb;
letter-spacing: -.02em;
font-family: Instrument Serif;
font-size: 132px;
font-style: italic;
line-height: 1;
transition: transform .8s cubic-bezier(.2, .7, .2, 1);
}
.ab-tm-b {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-direction: column;
flex-grow: 1;
padding: 20px 14px 16px;
display: flex;
}
.ab-tm-r {
color: #2f4bc4;
letter-spacing: .01em;
font-size: 13px;
font-weight: 500;
}
.ab-tm-n {
color: #0d0e10;
letter-spacing: -.02em;
margin-top: 0;
margin-bottom: 0;
font-size: 24px;
font-weight: 500;
line-height: 1.15;
}
.ab-tm-t {
color: #55565c;
margin-top: 2px;
margin-bottom: 0;
font-size: 15px;
line-height: 1.6;
}
.ab-tm-k {
color: #6b6c72;
letter-spacing: .04em;
text-transform: uppercase;
margin-top: auto;
padding-top: 16px;
font-size: 12px;
}
.ab-tags {
grid-column-gap: 6px;
grid-row-gap: 6px;
flex-wrap: nowrap;
display: flex;
}
.ab-tag {
color: #0d0e10;
white-space: nowrap;
background-color: #f5f4f0;
border-radius: 999px;
padding: 6px 11px;
font-size: 13px;
line-height: 1.2;
}
.ab-sec--last {
padding-bottom: 0;
}
.ab-hej {
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-rows: auto;
grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
display: grid;
}
.ab-clock {
grid-column-gap: 40px;
grid-row-gap: 40px;
color: #fff;
background-color: #3b5bdb;
border-radius: 24px;
flex-direction: column;
justify-content: space-between;
min-height: 380px;
padding: 32px 32px 30px;
display: flex;
}
.ab-clock-k {
color: #ffffffc7;
font-size: 14px;
font-weight: 500;
}
.ab-clock-t {
letter-spacing: -.055em;
font-variant-numeric: tabular-nums;
font-size: clamp(72px, 9vw, 136px);
font-weight: 500;
line-height: .9;
}
.ab-clock-s {
grid-column-gap: 10px;
grid-row-gap: 10px;
align-items: center;
display: flex;
}
.ab-live {
background-color: #fff;
border-radius: 50%;
flex: none;
width: 8px;
height: 8px;
}
.ab-clock-m {
font-size: 16px;
line-height: 1.4;
}
.ab-hej-r {
grid-column-gap: 10px;
grid-row-gap: 10px;
flex-direction: column;
display: flex;
}
.ab-go {
grid-column-gap: 20px;
grid-row-gap: 20px;
color: #0d0e10;
background-color: #fff;
border-radius: 20px;
flex: 1;
justify-content: space-between;
align-items: center;
padding: 24px 22px 24px 28px;
text-decoration: none;
transition: transform .45s cubic-bezier(.2, .7, .2, 1), box-shadow .45s cubic-bezier(.2, .7, .2, 1);
display: flex;
}
.ab-go:hover {
transform: translateY(-4px);
box-shadow: 0 0 0 1px #0d0e1014, 0 24px 48px -30px #0d0e104d;
}
.ab-go-b {
grid-column-gap: 6px;
grid-row-gap: 6px;
flex-direction: column;
display: flex;
}
.ab-go-t {
letter-spacing: -.02em;
font-size: 21px;
font-weight: 500;
line-height: 1.2;
}
.ab-go-p {
color: #55565c;
font-size: 15px;
line-height: 1.5;
}
.ab-go-a {
color: #fff;
background-color: #0d0e10;
border-radius: 50%;
flex: none;
justify-content: center;
align-items: center;
width: 44px;
height: 44px;
font-size: 18px;
transition: background-color .35s;
display: flex;
}
.ai-intro {
padding-top: clamp(110px, 10vw, 150px);
}
.ab-dial {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-direction: column;
display: flex;
}
.ab-dl {
background-color: #fff;
border-radius: 20px;
grid-template-rows: auto;
grid-template-columns: 110px minmax(0, 1fr) 110px minmax(0, 1fr);
align-items: center;
gap: 14px 28px;
padding: 26px 28px;
display: grid;
}
.ab-dl-l {
color: #0d0e10;
text-align: right;
font-size: 16px;
font-weight: 500;
}
.ab-dl-r {
color: #0d0e10;
font-size: 16px;
font-weight: 500;
}
.ab-dl-tr {
background-color: #e3e1da;
border-radius: 2px;
height: 2px;
position: relative;
}
.ab-dl-m {
cursor: grab;
touch-action: none;
background-color: #3b5bdb;
border-radius: 50%;
width: 26px;
height: 26px;
margin-top: -13px;
margin-left: -13px;
transition: left 1.2s cubic-bezier(.2, .7, .2, 1);
position: absolute;
top: 50%;
left: 50%;
box-shadow: 0 0 0 6px #3b5bdb29;
}
.ab-dl-n {
color: #55565c;
border-left: 1px solid #0d0e101a;
padding-left: 12px;
font-size: 15px;
line-height: 1.5;
}
.ab-dial-h {
color: #6b6c72;
text-align: center;
margin-top: 16px;
font-size: 13px;
}
.ab-no {
grid-column-gap: 8px;
grid-row-gap: 8px;
grid-template-rows: auto;
grid-template-columns: repeat(3, minmax(0, 1fr));
display: grid;
}
.ab-no-i {
grid-column-gap: 40px;
grid-row-gap: 40px;
background-color: #fff;
border-radius: 20px;
flex-direction: column;
justify-content: space-between;
min-height: 190px;
padding: 26px 28px 30px;
transition: transform .45s cubic-bezier(.2, .7, .2, 1);
display: flex;
}
.ab-no-i:hover {
transform: translateY(-6px)rotate(-1deg);
}
.ab-no-k {
color: #3b5bdb;
font-family: Instrument Serif;
font-size: 48px;
font-style: italic;
line-height: 1;
}
.ab-no-t {
color: #0d0e10;
letter-spacing: -.02em;
width: fit-content;
font-size: 22px;
font-weight: 500;
line-height: 1.25;
position: relative;
}
.ab-no-s {
background-color: #3b5bdb;
width: 0%;
height: 2px;
transition: width .9s cubic-bezier(.65, 0, .35, 1);
position: absolute;
top: 55%;
left: -4px;
}
.ab-chat {
background-color: #fff;
border-radius: 28px;
max-width: 720px;
margin-left: auto;
margin-right: auto;
padding: 10px 10px 18px;
}
.ab-chat-top {
grid-column-gap: 12px;
grid-row-gap: 12px;
border-bottom: 1px solid #0d0e1014;
align-items: center;
padding: 12px 14px 18px;
display: flex;
}
.ab-chat-av {
object-fit: cover;
object-position: 50% 20%;
border-radius: 50%;
width: 44px;
height: 44px;
}
.ab-chat-who {
grid-column-gap: 2px;
grid-row-gap: 2px;
flex-direction: column;
display: flex;
}
.ab-chat-n {
color: #0d0e10;
font-size: 16px;
font-weight: 500;
}
.ab-chat-s {
color: #2f4bc4;
font-size: 13px;
}
.ab-chat-b {
grid-column-gap: 10px;
grid-row-gap: 10px;
flex-direction: column;
min-height: 420px;
padding: 26px 14px 22px;
display: flex;
}
.ab-q {
color: #fff;
background-color: #0d0e10;
border-radius: 20px 20px 6px;
align-self: flex-end;
max-width: 78%;
padding: 12px 16px;
font-size: 16px;
line-height: 1.5;
}
.ab-a {
color: #0d0e10;
background-color: #f5f4f0;
border-radius: 20px 20px 20px 6px;
align-self: flex-start;
max-width: 78%;
padding: 12px 16px;
font-size: 16px;
line-height: 1.5;
}
.ab-chat-go {
color: #fff;
background-color: #3b5bdb;
border-radius: 999px;
width: fit-content;
margin-left: auto;
margin-right: auto;
padding: 13px 22px;
font-size: 15px;
font-weight: 500;
text-decoration: none;
transition: background-color .3s;
display: block;
}
.ab-chat-go:hover {
background-color: #0d0e10;
}
.ab-deck {
max-width: 580px;
height: 380px;
margin-left: auto;
margin-right: auto;
position: relative;
}
.ab-card {
grid-column-gap: 24px;
grid-row-gap: 24px;
color: #0d0e10;
cursor: pointer;
-webkit-user-select: none;
user-select: none;
background-color: #fff;
border-radius: 28px;
flex-direction: column;
justify-content: space-between;
padding: 36px 36px 38px;
transition: transform .7s cubic-bezier(.2, .7, .2, 1), opacity .5s;
display: flex;
position: absolute;
inset: 0;
box-shadow: 0 0 0 1px #0d0e100f, 0 30px 60px -36px #0d0e1052;
}
.ab-card-n {
color: #2f4bc4;
letter-spacing: .06em;
font-size: 12px;
}
.ab-card-t {
letter-spacing: -.04em;
font-size: clamp(30px, 3.4vw, 44px);
font-weight: 500;
line-height: 1.05;
}
.ab-card-p {
color: #55565c;
max-width: 420px;
font-size: 16px;
line-height: 1.55;
}
.ab-deck-h {
color: #6b6c72;
text-align: center;
margin-top: 40px;
font-size: 13px;
}
.ai-last {
padding-bottom: clamp(96px, 10vw, 140px);
}
.ab-desk {
grid-column-gap: 8px;
grid-row-gap: 8px;
grid-template-rows: auto;
grid-template-columns: repeat(4, minmax(0, 1fr));
display: grid;
}
.ab-tool {
grid-column-gap: 48px;
grid-row-gap: 48px;
color: #0d0e10;
background-color: #fff;
border-radius: 20px;
flex-direction: column;
justify-content: space-between;
min-height: 210px;
padding: 24px 24px 26px;
transition: background-color .35s, color .35s, transform .45s cubic-bezier(.2, .7, .2, 1);
display: flex;
}
.ab-tool:hover {
color: #fff;
background-color: #3b5bdb;
transform: translateY(-6px);
}
.ab-tool-you {
grid-column-gap: 48px;
grid-row-gap: 48px;
color: #fff;
background-color: #0d0e10;
border-radius: 20px;
flex-direction: column;
justify-content: space-between;
min-height: 210px;
padding: 24px 24px 26px;
transition: transform .45s cubic-bezier(.2, .7, .2, 1);
display: flex;
}
.ab-tool-you:hover {
transform: translateY(-6px)rotate(1deg);
}
.ab-tool-k {
opacity: .6;
letter-spacing: .05em;
text-transform: uppercase;
font-size: 12px;
}
.ab-tool-b {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-direction: column;
display: flex;
}
.ab-tool-n {
letter-spacing: -.03em;
font-size: 26px;
font-weight: 500;
line-height: 1.1;
}
.ab-tool-p {
opacity: .75;
font-size: 14px;
line-height: 1.5;
}
.ap-mt {
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-rows: auto;
grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr);
display: grid;
}
.ap-rows {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-direction: column;
display: flex;
}
.ap-row {
background-color: #fff;
border-radius: 20px;
grid-template-rows: auto;
grid-template-columns: 104px minmax(0, 1fr) 104px;
align-items: center;
column-gap: 28px;
padding: 34px 28px;
display: grid;
}
.ap-row-l {
color: #8a8b90;
text-align: right;
font-size: 16px;
font-weight: 500;
transition: color .3s;
}
.ap-row-r {
color: #8a8b90;
font-size: 16px;
font-weight: 500;
transition: color .3s;
}
.ap-tr {
cursor: pointer;
background-color: #ecebe6;
border-radius: 6px;
height: 6px;
position: relative;
}
.ap-fill {
background-color: #c9d3f8;
border-radius: 6px;
width: 0%;
position: absolute;
top: 0;
bottom: 0;
left: 50%;
}
.ap-us {
background-color: #fff;
border: 2px dashed #3b5bdb;
border-radius: 50%;
width: 30px;
height: 30px;
margin-top: -15px;
margin-left: -15px;
transition: left 1.2s cubic-bezier(.2, .7, .2, 1);
position: absolute;
top: 50%;
left: 50%;
}
.ap-us-t {
color: #fff;
white-space: nowrap;
background-color: #3b5bdb;
border-radius: 999px;
margin-bottom: 8px;
padding: 3px 8px;
font-size: 11px;
font-weight: 500;
position: absolute;
bottom: 100%;
left: 50%;
transform: translateX(-50%);
}
.ap-you {
z-index: 2;
cursor: grab;
touch-action: none;
background-color: #0d0e10;
border-radius: 50%;
width: 30px;
height: 30px;
margin-top: -15px;
margin-left: -15px;
position: absolute;
top: 50%;
left: 50%;
box-shadow: 0 0 0 5px #0d0e1014, 0 8px 18px -6px #0d0e1080;
}
.ap-you-t {
color: #0d0e10;
white-space: nowrap;
margin-top: 9px;
font-size: 11px;
font-weight: 500;
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%);
}
.ap-res {
grid-column-gap: 28px;
grid-row-gap: 28px;
color: #fff;
background-color: #3b5bdb;
border-radius: 24px;
flex-direction: column;
justify-content: space-between;
padding: 32px;
display: flex;
}
.ap-res-k {
color: #fffc;
font-size: 14px;
font-weight: 500;
}
.ap-res-m {
grid-column-gap: 10px;
grid-row-gap: 10px;
flex-direction: column;
display: flex;
}
.ap-res-n {
letter-spacing: -.06em;
font-size: clamp(84px, 9vw, 140px);
font-weight: 500;
line-height: .9;
}
.ap-res-s {
color: #ffffffb8;
font-size: 13px;
}
.ap-res-t {
max-width: 340px;
font-size: 19px;
line-height: 1.45;
}
.ap-res-f {
grid-column-gap: 18px;
grid-row-gap: 18px;
flex-wrap: wrap;
align-items: center;
display: flex;
}
.ap-res-go {
color: #0d0e10;
background-color: #fff;
border-radius: 999px;
padding: 13px 20px;
font-size: 15px;
font-weight: 500;
text-decoration: none;
transition: background-color .3s, color .3s;
}
.ap-res-go:hover {
color: #fff;
background-color: #0d0e10;
}
.ap-res-x {
color: #ffffffd1;
cursor: pointer;
font-size: 14px;
text-decoration: underline;
}
.ap-dsk {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-direction: column;
display: flex;
}
.ap-stg {
grid-column-gap: 8px;
grid-row-gap: 8px;
grid-template-rows: auto;
grid-template-columns: repeat(5, minmax(0, 1fr));
display: grid;
}
.ap-st {
grid-column-gap: 10px;
grid-row-gap: 10px;
color: #0d0e10;
cursor: pointer;
background-color: #fff;
border-radius: 16px;
align-items: baseline;
padding: 18px 20px;
transition: background-color .3s, color .3s;
display: flex;
position: relative;
overflow: hidden;
}
.ap-st:hover {
background-color: #e9edfb;
}
.ap-st-n {
opacity: .55;
letter-spacing: .06em;
font-size: 12px;
}
.ap-st-t {
letter-spacing: -.02em;
font-size: 19px;
font-weight: 500;
}
.ap-st-bar {
background-color: #3b5bdb;
width: 0%;
height: 3px;
position: absolute;
bottom: 0;
left: 0;
}
.ap-st-d {
color: #0d0e10;
background-color: #fff;
border-radius: 16px;
padding: 20px 22px;
font-size: 17px;
line-height: 1.5;
}
.ap-tools {
grid-column-gap: 8px;
grid-row-gap: 8px;
grid-template-rows: auto;
grid-template-columns: repeat(4, minmax(0, 1fr));
display: grid;
}
.ap-tl {
grid-column-gap: 44px;
grid-row-gap: 44px;
color: #0d0e10;
background-color: #fff;
border-radius: 20px;
flex-direction: column;
justify-content: space-between;
min-height: 196px;
padding: 22px 22px 24px;
transition: background-color .45s, color .45s, opacity .45s, transform .55s cubic-bezier(.2, .7, .2, 1);
display: flex;
}
.ap-tl-k {
opacity: .6;
letter-spacing: .05em;
text-transform: uppercase;
font-size: 12px;
}
.ap-tl-b {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-direction: column;
display: flex;
}
.ap-tl-n {
letter-spacing: -.03em;
font-size: 26px;
font-weight: 500;
line-height: 1.1;
}
.ap-tl-p {
opacity: .78;
font-size: 14px;
line-height: 1.5;
}
.ap-dk {
grid-column-gap: 32px;
grid-row-gap: 32px;
flex-direction: column;
align-items: center;
display: flex;
}
.ap-dk-st {
width: 100%;
max-width: 600px;
height: 400px;
position: relative;
}
.ap-cd {
color: #0d0e10;
cursor: grab;
-webkit-user-select: none;
user-select: none;
touch-action: pan-y;
background-color: #fff;
border-radius: 28px;
flex-direction: column;
justify-content: space-between;
padding: 34px 36px 36px;
transition: transform .5s cubic-bezier(.2, .7, .2, 1), opacity .4s;
display: flex;
position: absolute;
inset: 0;
box-shadow: 0 0 0 1px #0d0e100f, 0 30px 60px -34px #0d0e1059;
}
.ap-cd-h {
justify-content: space-between;
align-items: flex-start;
display: flex;
}
.ap-cd-n {
letter-spacing: -.02em;
font-family: Instrument Serif;
font-size: 76px;
font-style: italic;
line-height: .8;
}
.ap-cd-k {
opacity: .6;
letter-spacing: .06em;
text-transform: uppercase;
font-size: 12px;
}
.ap-cd-b {
grid-column-gap: 14px;
grid-row-gap: 14px;
flex-direction: column;
display: flex;
}
.ap-cd-t {
letter-spacing: -.04em;
font-size: clamp(30px, 3.4vw, 46px);
font-weight: 500;
line-height: 1.04;
}
.ap-cd-p {
opacity: .72;
max-width: 440px;
font-size: 16px;
line-height: 1.55;
}
.ap-dk-c {
grid-column-gap: 20px;
grid-row-gap: 20px;
align-items: center;
margin-top: 20px;
display: flex;
}
.ap-dk-b {
color: #0d0e10;
cursor: pointer;
background-color: #fff;
border-radius: 50%;
justify-content: center;
align-items: center;
width: 48px;
height: 48px;
font-size: 18px;
transition: background-color .3s, color .3s;
display: flex;
box-shadow: inset 0 0 0 1px #0d0e101f;
}
.ap-dk-b:hover {
color: #fff;
background-color: #0d0e10;
}
.ap-dots {
grid-column-gap: 6px;
grid-row-gap: 6px;
align-items: center;
display: flex;
}
.ap-dot {
cursor: pointer;
background-color: #0d0e102e;
border-radius: 999px;
width: 8px;
height: 8px;
transition: width .4s, background-color .4s;
}
.ap-dk-h {
color: #6b6c72;
margin-top: -14px;
font-size: 13px;
}
.ax-b {
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-rows: auto;
grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr);
display: grid;
}
.ax-b-steps {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-direction: column;
display: flex;
}
.ax-b-st {
grid-column-gap: 16px;
grid-row-gap: 16px;
color: #0d0e10;
cursor: pointer;
background-color: #fff;
border-radius: 18px;
flex: 1;
align-items: flex-start;
padding: 18px 20px;
transition: background-color .35s, color .35s;
display: flex;
}
.ax-b-st:hover {
background-color: #e9edfb;
}
.ax-b-n {
color: #55565c;
background-color: #f0efea;
border-radius: 50%;
flex: none;
justify-content: center;
align-items: center;
width: 30px;
height: 30px;
font-size: 11px;
transition: background-color .35s, color .35s;
display: flex;
}
.ax-b-tx {
grid-column-gap: 3px;
grid-row-gap: 3px;
flex-direction: column;
display: flex;
}
.ax-b-t {
letter-spacing: -.02em;
font-size: 18px;
font-weight: 500;
}
.ax-b-p {
opacity: .65;
font-size: 14px;
line-height: 1.4;
}
.ax-b-view {
background-color: #fff;
border-radius: 24px;
flex-direction: column;
padding: 8px;
display: flex;
}
.ax-b-bar {
grid-column-gap: 14px;
grid-row-gap: 14px;
align-items: center;
padding: 10px 12px 14px;
display: flex;
}
.ax-b-dots {
grid-column-gap: 6px;
grid-row-gap: 6px;
display: flex;
}
.ax-b-dot {
background-color: #e3e1da;
border-radius: 50%;
width: 10px;
height: 10px;
}
.ax-b-url {
color: #6b6c72;
background-color: #f5f4f0;
border-radius: 999px;
flex: 1;
padding: 7px 14px;
font-size: 12px;
}
.ax-b-live {
opacity: 0;
color: #fff;
background-color: #3b5bdb;
border-radius: 999px;
padding: 5px 10px;
font-size: 11px;
font-weight: 500;
transition: opacity .4s, transform .4s;
transform: scale(.8);
}
.ax-b-pg {
grid-column-gap: 22px;
grid-row-gap: 22px;
background-color: #fff;
border: 1px dashed #d6d4cc;
border-radius: 16px;
flex-direction: column;
flex: 1;
min-height: 420px;
padding: 22px 26px 26px;
transition: background-color .6s, border-color .6s, box-shadow .6s;
display: flex;
}
.ax-b-nav {
grid-column-gap: 18px;
grid-row-gap: 18px;
align-items: center;
display: flex;
}
.ax-b-logo {
border-radius: 6px;
font-size: 14px;
font-weight: 600;
transition: all .5s;
}
.ax-b-links {
grid-column-gap: 10px;
grid-row-gap: 10px;
flex: 1;
display: flex;
}
.ax-b-lk {
background-color: #e3e1da;
border-radius: 4px;
width: 44px;
height: 8px;
transition: background-color .5s;
}
.ax-b-cta {
border: 1px solid #d6d4cc;
border-radius: 999px;
padding: 8px 14px;
font-size: 12px;
transition: all .5s;
}
.ax-b-hero {
grid-column-gap: 12px;
grid-row-gap: 12px;
flex-direction: column;
align-items: flex-start;
max-width: 520px;
display: flex;
}
.ax-b-h {
border-radius: 6px;
font-size: 22px;
line-height: 1.1;
transition: all .6s;
}
.ax-b-em {
transition: all .6s;
}
.ax-b-sub {
color: #55565c;
border-radius: 6px;
font-size: 14px;
line-height: 1.5;
transition: all .5s;
}
.ax-b-btns {
grid-column-gap: 8px;
grid-row-gap: 8px;
display: flex;
}
.ax-b-btn, .ax-b-btn2 {
border: 1px solid #d6d4cc;
border-radius: 999px;
padding: 8px 14px;
font-size: 12px;
transition: all .5s;
}
.ax-b-img {
border: 1px dashed #d6d4cc;
border-radius: 12px;
height: 120px;
transition: all .6s;
}
.ax-b-cards {
grid-column-gap: 8px;
grid-row-gap: 8px;
grid-template-rows: auto;
grid-template-columns: repeat(3, minmax(0, 1fr));
display: grid;
}
.ax-b-card {
border: 1px dashed #d6d4cc;
border-radius: 10px;
height: 64px;
transition: all .6s;
}
.ax-q {
grid-column-gap: 28px;
grid-row-gap: 28px;
background-color: #fff;
border-radius: 28px;
flex-direction: column;
max-width: 760px;
min-height: 400px;
margin-left: auto;
margin-right: auto;
padding: 32px 34px 34px;
display: flex;
}
.ax-q-top {
grid-column-gap: 12px;
grid-row-gap: 12px;
flex-direction: column;
display: flex;
}
.ax-q-k {
color: #6b6c72;
font-size: 13px;
}
.ax-q-i {
font-weight: 500;
}
.ax-q-bar {
background-color: #ecebe6;
border-radius: 4px;
height: 4px;
overflow: hidden;
}
.ax-q-fill {
background-color: #3b5bdb;
width: 0%;
height: 100%;
transition: width .6s cubic-bezier(.2, .7, .2, 1);
}
.ax-q-step {
grid-column-gap: 22px;
grid-row-gap: 22px;
flex-direction: column;
display: none;
}
.ax-q-t {
letter-spacing: -.035em;
font-size: clamp(26px, 3vw, 38px);
font-weight: 500;
line-height: 1.1;
}
.ax-q-os {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-direction: column;
display: flex;
}
.ax-q-o {
color: #0d0e10;
cursor: pointer;
background-color: #f5f4f0;
border-radius: 16px;
justify-content: space-between;
align-items: center;
padding: 18px 20px;
font-size: 17px;
transition: background-color .3s, color .3s, transform .3s;
display: flex;
}
.ax-q-o:hover {
background-color: #e9edfb;
transform: translateX(4px);
}
.ax-q-res {
grid-column-gap: 18px;
grid-row-gap: 18px;
flex-direction: column;
display: none;
}
.ax-q-rk {
color: #2f4bc4;
font-size: 13px;
font-weight: 500;
}
.ax-q-rn {
letter-spacing: -.05em;
font-size: clamp(44px, 6vw, 76px);
font-weight: 500;
line-height: .95;
}
.ax-q-rp {
color: #0d0e10;
max-width: 560px;
font-size: 18px;
line-height: 1.5;
}
.ax-q-rx {
color: #55565c;
max-width: 560px;
font-size: 15px;
line-height: 1.5;
}
.ax-q-ra {
grid-column-gap: 12px;
grid-row-gap: 12px;
flex-wrap: wrap;
align-items: center;
margin-top: 6px;
display: flex;
}
.ax-q-go {
color: #fff;
background-color: #0d0e10;
border-radius: 999px;
padding: 13px 20px;
font-size: 15px;
font-weight: 500;
text-decoration: none;
transition: background-color .3s;
}
.ax-q-go:hover {
background-color: #3b5bdb;
}
.ax-q-go2 {
color: #0d0e10;
background-color: #fff;
border-radius: 999px;
padding: 13px 20px;
font-size: 15px;
font-weight: 500;
text-decoration: none;
box-shadow: inset 0 0 0 1px #0d0e1026;
}
.ax-q-re {
color: #6b6c72;
cursor: pointer;
margin-left: 8px;
font-size: 14px;
text-decoration: underline;
}
.ax-k {
grid-column-gap: 40px;
grid-row-gap: 40px;
color: #fff;
cursor: pointer;
-webkit-user-select: none;
user-select: none;
background-color: #3b5bdb;
border-radius: 28px;
flex-direction: column;
justify-content: space-between;
min-height: 460px;
padding: clamp(36px, 6vw, 80px);
display: flex;
overflow: hidden;
}
.ax-k-l {
letter-spacing: -.05em;
font-size: clamp(34px, 5vw, 72px);
font-weight: 500;
line-height: 1;
}
.ax-k-w {
letter-spacing: -.02em;
min-height: 2.2em;
font-family: Instrument Serif;
font-size: clamp(52px, 8.4vw, 128px);
font-style: italic;
line-height: 1.05;
}
.ax-k-f {
color: #ffffffbf;
justify-content: space-between;
align-items: center;
font-size: 13px;
display: flex;
}
.ax-k-c {
font-variant-numeric: tabular-nums;
}
.ax-k-h {
opacity: .9;
}
.ax-s {
grid-column-gap: 14px;
grid-row-gap: 14px;
flex-direction: column;
display: flex;
}
.ax-s-view {
aspect-ratio: 16 / 9;
background-color: #fff;
border-radius: 24px;
position: relative;
overflow: hidden;
}
.ax-s-img {
object-fit: cover;
width: 100%;
height: 100%;
display: block;
}
.ax-s-grid {
opacity: 0;
pointer-events: none;
position: absolute;
inset: 0;
}
.ax-s-tag {
color: #fff;
background-color: #0d0e10;
border-radius: 999px;
padding: 8px 14px;
font-size: 13px;
font-weight: 500;
position: absolute;
top: 18px;
left: 18px;
}
.ax-s-live {
opacity: 0;
color: #fff;
background-color: #3b5bdb;
border-radius: 999px;
padding: 8px 14px;
font-size: 13px;
font-weight: 500;
transition: opacity .4s, transform .4s;
position: absolute;
top: 18px;
right: 18px;
transform: scale(.8);
}
.ax-s-ctl {
background-color: #fff;
border-radius: 20px;
padding: 30px 32px 22px;
}
.ax-s-tr {
cursor: pointer;
background-color: #ecebe6;
border-radius: 6px;
height: 6px;
margin-left: 6px;
margin-right: 6px;
position: relative;
}
.ax-s-fill {
background-color: #3b5bdb;
border-radius: 6px;
width: 0%;
position: absolute;
top: 0;
bottom: 0;
left: 0;
}
.ax-s-h {
cursor: grab;
touch-action: none;
background-color: #0d0e10;
border-radius: 50%;
width: 26px;
height: 26px;
margin-top: -13px;
margin-left: -13px;
position: absolute;
top: 50%;
left: 0%;
box-shadow: 0 0 0 6px #0d0e1014;
}
.ax-s-ms {
grid-template-rows: auto;
grid-template-columns: repeat(5, minmax(0, 1fr));
margin-top: 22px;
display: grid;
}
.ax-s-m {
opacity: .45;
cursor: pointer;
transition: opacity .3s;
}
.ax-s-mk {
color: #2f4bc4;
font-size: 12px;
font-weight: 500;
}
.ax-s-mt {
margin-top: 3px;
font-size: 15px;
font-weight: 500;
}
.ax-s-cs {
color: #0d0e10;
border-bottom: 1px solid #0d0e10;
align-self: flex-start;
font-size: 15px;
font-weight: 500;
text-decoration: none;
}
.ax-p {
grid-column-gap: 22px;
grid-row-gap: 26px;
grid-template-rows: auto;
grid-template-columns: repeat(3, minmax(0, 1fr));
display: grid;
}
.ax-pc {
aspect-ratio: 3 / 2;
cursor: pointer;
transition: transform .5s cubic-bezier(.2, .7, .2, 1);
position: relative;
}
.ax-pc-in {
transition: transform .8s cubic-bezier(.2, .7, .2, 1);
position: absolute;
inset: 0;
}
.ax-pc-f, .ax-pc-b {
color: #0d0e10;
background-color: #fff;
border-radius: 18px;
flex-direction: column;
justify-content: space-between;
padding: 22px 24px;
display: flex;
position: absolute;
inset: 0;
box-shadow: 0 0 0 1px #0d0e100f, 0 24px 48px -30px #0d0e1066;
}
.ax-pc-top {
justify-content: space-between;
align-items: flex-start;
display: flex;
}
.ax-pc-pl {
opacity: .75;
font-size: 13px;
font-weight: 500;
}
.ax-pc-st {
opacity: .6;
border-style: dashed;
border-width: 1.5px;
border-radius: 4px;
justify-content: center;
align-items: center;
width: 44px;
height: 52px;
font-size: 12px;
font-weight: 600;
display: flex;
}
.ax-pc-g {
font-family: Instrument Serif;
font-size: clamp(48px, 5vw, 72px);
font-style: italic;
line-height: .9;
}
.ax-pc-from {
opacity: .7;
font-size: 13px;
}
.ax-pc-bt {
letter-spacing: -.02em;
max-width: 58%;
font-size: 22px;
font-weight: 500;
}
.ax-pc-bp {
color: #55565c;
max-width: 58%;
font-size: 14px;
line-height: 1.5;
}
.ax-pc-a {
color: #3b5bdb;
width: fit-content;
font-size: 14px;
font-weight: 500;
text-decoration: none;
}
.ax-pc-pm {
color: #3b5bdb;
text-align: center;
letter-spacing: .08em;
border: 1.5px dashed #3b5bdb80;
border-radius: 50%;
justify-content: center;
align-items: center;
width: 80px;
height: 80px;
padding: 12px;
font-size: 8px;
display: flex;
position: absolute;
top: 22px;
right: 22px;
transform: rotate(-14deg);
}
.aw {
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-rows: auto;
grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
display: grid;
}
.aw-rows {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-direction: column;
display: flex;
}
.aw-row {
cursor: pointer;
background-color: #fff;
border-radius: 20px;
grid-template-rows: auto;
grid-template-columns: 100px minmax(0, 1fr) 100px;
align-items: center;
column-gap: 26px;
padding: 30px 26px;
transition: box-shadow .3s, transform .3s;
display: grid;
box-shadow: inset 0 0 0 1.5px #3b5bdb00;
}
.aw-row:hover {
transform: translateX(4px);
}
.aw-l {
color: #9a9ba0;
text-align: right;
font-size: 15px;
font-weight: 500;
}
.aw-r {
color: #0d0e10;
font-size: 15px;
font-weight: 500;
transition: color .3s;
}
.aw-tr {
background-color: #ecebe6;
border-radius: 4px;
height: 4px;
position: relative;
}
.aw-fill {
background-color: #c9d3f8;
border-radius: 4px;
width: 0%;
transition: width 1.3s cubic-bezier(.2, .7, .2, 1);
position: absolute;
top: 0;
bottom: 0;
left: 0;
}
.aw-dot {
background-color: #3b5bdb;
border-radius: 50%;
width: 22px;
height: 22px;
margin-top: -11px;
margin-left: -11px;
transition: left 1.3s cubic-bezier(.2, .7, .2, 1);
position: absolute;
top: 50%;
left: 0%;
box-shadow: 0 0 0 5px #3b5bdb26;
}
.aw-card {
grid-column-gap: 28px;
grid-row-gap: 28px;
color: #fff;
background-color: #3b5bdb;
border-radius: 24px;
flex-direction: column;
justify-content: space-between;
min-height: 420px;
padding: 32px;
display: flex;
}
.aw-c-k {
color: #fffc;
font-size: 14px;
font-weight: 500;
}
.aw-c-b {
grid-column-gap: 14px;
grid-row-gap: 14px;
flex-direction: column;
display: flex;
}
.aw-c-n {
font-family: Instrument Serif;
font-size: 88px;
font-style: italic;
line-height: .8;
}
.aw-c-t {
letter-spacing: -.035em;
font-size: clamp(28px, 2.8vw, 38px);
font-weight: 500;
line-height: 1.08;
}
.aw-c-p {
color: #ffffffe0;
max-width: 380px;
font-size: 17px;
line-height: 1.55;
}
.aw-c-f {
justify-content: space-between;
align-items: center;
display: flex;
}
.aw-c-c {
color: #ffffffbf;
font-size: 13px;
}
.aw-nx {
color: #0d0e10;
cursor: pointer;
background-color: #fff;
border-radius: 50%;
justify-content: center;
align-items: center;
width: 44px;
height: 44px;
font-size: 18px;
transition: transform .3s;
display: flex;
}
.aw-nx:hover {
transform: translateX(3px);
}
.pcs {
grid-column-gap: 28px;
grid-row-gap: 36px;
grid-template-rows: auto;
grid-template-columns: repeat(3, minmax(0, 1fr));
padding-top: 6px;
display: grid;
}
.pc {
aspect-ratio: 3 / 2;
cursor: pointer;
transition: transform .5s cubic-bezier(.2, .7, .2, 1);
position: relative;
}
.pc-in {
transition: transform .9s cubic-bezier(.2, .7, .2, 1);
position: absolute;
inset: 0;
}
.pc-f {
background-color: #fff;
border-radius: 10px;
padding: 8px;
position: absolute;
inset: 0;
box-shadow: 0 1px 2px #0d0e1014, 0 26px 50px -30px #0d0e1080;
}
.pc-ph {
background-color: #0d0e10;
border-radius: 4px;
width: 100%;
height: 100%;
position: relative;
overflow: hidden;
}
.pc-img {
filter: saturate(.85) brightness(.92);
object-fit: cover;
object-position: 50% 0%;
width: 100%;
height: 100%;
transition: transform .8s cubic-bezier(.2, .7, .2, 1);
display: block;
}
.pc-sh {
background-image: linear-gradient(#0d0e1014 0%, #0d0e1059 40%, #0d0e10e6 80%);
position: absolute;
inset: 0;
}
.pc-txt {
color: #fff;
position: absolute;
bottom: 16px;
left: 18px;
right: 18px;
}
.pc-gf {
opacity: .9;
letter-spacing: .18em;
text-transform: uppercase;
font-size: 10px;
font-weight: 600;
}
.pc-gr {
white-space: nowrap;
margin-top: 4px;
font-family: Instrument Serif;
font-size: clamp(38px, 3.4vw, 54px);
font-style: italic;
line-height: .95;
}
.pc-loc {
opacity: .92;
margin-top: 6px;
font-size: 13px;
font-weight: 500;
}
.pc-stp {
background-color: #fff;
width: 54px;
height: 64px;
padding: 5px;
position: absolute;
top: 12px;
right: 12px;
transform: rotate(4deg);
}
.pc-stp-in {
grid-column-gap: 3px;
grid-row-gap: 3px;
color: #3b5bdb;
background-color: #e9edfb;
border: 1px solid #3b5bdb;
flex-direction: column;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
display: flex;
}
.pc-stp-c {
font-family: Instrument Serif;
font-size: 22px;
font-style: italic;
line-height: 1;
}
.pc-stp-v {
letter-spacing: .12em;
text-transform: uppercase;
font-size: 7px;
font-weight: 600;
}
.pc-hq {
background-color: #3b5bdb;
border-radius: 4px;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
display: flex;
position: relative;
overflow: hidden;
}
.pc-mark {
width: 26%;
height: auto;
margin-bottom: 24%;
}
.pc-b {
background-color: #3b5bdb;
border-radius: 10px;
padding: 7px;
position: absolute;
inset: 0;
box-shadow: 0 1px 2px #0d0e1014, 0 26px 50px -30px #0d0e1080;
}
.pc-bin {
grid-column-gap: 16px;
grid-row-gap: 16px;
background-color: #fbf9f4;
border-radius: 5px;
grid-template-rows: auto;
grid-template-columns: minmax(0, 1.1fr) 1px minmax(0, 1fr);
width: 100%;
height: 100%;
padding: 18px 18px 16px;
display: grid;
}
.pc-msg {
grid-column-gap: 10px;
grid-row-gap: 10px;
flex-direction: column;
justify-content: space-between;
display: flex;
}
.pc-m {
color: #1f2a5c;
font-family: Instrument Serif;
font-size: 19px;
font-style: italic;
line-height: 1.3;
}
.pc-sig {
color: #3b5bdb;
font-family: Instrument Serif;
font-size: 17px;
font-style: italic;
}
.pc-div {
background-color: #0d0e1026;
}
.pc-adr {
grid-column-gap: 7px;
grid-row-gap: 7px;
flex-direction: column;
justify-content: flex-end;
display: flex;
position: relative;
}
.pc-st2 {
color: #3b5bdb;
background-color: #fff;
justify-content: center;
align-items: center;
width: 42px;
height: 50px;
padding: 4px;
font-family: Instrument Serif;
font-size: 17px;
font-style: italic;
display: flex;
position: absolute;
top: 0;
right: 0;
}
.pc-pm {
color: #3b5bdbcc;
text-align: center;
letter-spacing: .1em;
border: 1.5px solid #3b5bdb8c;
border-radius: 50%;
justify-content: center;
align-items: center;
width: 58px;
height: 58px;
padding: 8px;
font-size: 6.5px;
font-weight: 600;
line-height: 1.35;
display: flex;
position: absolute;
top: 10px;
right: 34px;
transform: rotate(-12deg);
}
.pc-to {
color: #0d0e10;
border-bottom: 1px solid #0d0e1033;
padding-bottom: 5px;
font-size: 14px;
font-weight: 600;
}
.pc-ln {
color: #55565c;
border-bottom: 1px solid #0d0e1033;
padding-bottom: 5px;
font-size: 12px;
}
.pc-a {
color: #3b5bdb;
width: fit-content;
margin-top: 4px;
font-size: 13px;
font-weight: 600;
text-decoration: none;
}
.pcs-h {
color: #6b6c72;
text-align: center;
margin-top: 30px;
font-size: 13px;
}
.ak-cta {
color: #fff;
-webkit-user-select: none;
user-select: none;
background-color: #3b5bdb;
border-radius: 28px;
flex-direction: column;
justify-content: space-between;
padding: 34px 36px 36px;
transition: transform .5s cubic-bezier(.2, .7, .2, 1), opacity .4s;
display: flex;
position: absolute;
inset: 0;
box-shadow: 0 30px 60px -34px #3b5bdbb3;
}
.ak-cta-k {
opacity: .75;
letter-spacing: .06em;
text-transform: uppercase;
font-size: 12px;
}
.ak-cta-t {
letter-spacing: -.04em;
max-width: 460px;
font-size: clamp(30px, 3.4vw, 44px);
font-weight: 500;
line-height: 1.05;
}
.ak-cta-f {
grid-column-gap: 10px;
grid-row-gap: 10px;
flex-wrap: wrap;
align-items: center;
display: flex;
}
.ak-go {
color: #0d0e10;
background-color: #fff;
border-radius: 999px;
padding: 14px 20px;
font-size: 15px;
font-weight: 500;
text-decoration: none;
transition: background-color .3s, color .3s;
}
.ak-go:hover {
color: #fff;
background-color: #0d0e10;
}
.ak-go2 {
color: #fff;
border-radius: 999px;
padding: 14px 20px;
font-size: 15px;
font-weight: 500;
text-decoration: none;
transition: box-shadow .3s;
box-shadow: inset 0 0 0 1px #ffffff80;
}
.ak-go2:hover {
box-shadow: inset 0 0 0 1px #fff;
}
.ak-re {
color: #fffc;
cursor: pointer;
margin-left: 6px;
font-size: 14px;
text-decoration: underline;
}
.st {
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
display: grid;
}
.st-list {
grid-column-gap: 6px;
grid-row-gap: 6px;
flex-direction: column;
display: flex;
}
.st-li {
grid-column-gap: 16px;
grid-row-gap: 16px;
color: #0d0e10;
background-color: #fff;
border-radius: 16px;
flex: 1;
grid-template-rows: auto;
grid-template-columns: 150px minmax(0, 1fr);
align-items: baseline;
padding: 18px 20px;
transition: background-color .3s, color .3s, transform .3s;
display: grid;
}
.st-li-n {
letter-spacing: -.02em;
font-size: 18px;
font-weight: 500;
}
.st-li-p {
opacity: .7;
font-size: 14px;
line-height: 1.45;
}
.st-stage {
background-color: #fff;
border-radius: 24px;
justify-content: center;
align-items: center;
min-height: 540px;
display: flex;
position: relative;
overflow: hidden;
}
.st-orb {
aspect-ratio: 1;
width: 420px;
max-width: 80%;
position: relative;
}
.st-r2 {
border: 1px dashed #0d0e1029;
border-radius: 50%;
position: absolute;
inset: 0;
}
.st-r1 {
border: 1px dashed #0d0e1029;
border-radius: 50%;
position: absolute;
inset: 14%;
}
.st-chip {
grid-column-gap: 7px;
grid-row-gap: 7px;
color: #0d0e10;
white-space: nowrap;
cursor: pointer;
background-color: #fff;
border-radius: 999px;
align-items: center;
padding: 9px 14px;
font-size: 14px;
font-weight: 500;
transition: background-color .3s, color .3s, opacity .3s;
display: flex;
position: absolute;
top: 0;
left: 0;
box-shadow: 0 0 0 1px #0d0e1014, 0 10px 24px -14px #0d0e1073;
}
.st-chip-d {
background-color: #3b5bdb;
border-radius: 50%;
width: 7px;
height: 7px;
}
.st-chip-t {
line-height: 1;
}
.st-core {
z-index: 1;
aspect-ratio: auto;
background-color: #fff;
border-radius: 14px;
flex-direction: column;
justify-content: flex-start;
align-items: stretch;
width: 44%;
display: flex;
position: absolute;
top: 50%;
left: 50%;
overflow: hidden;
transform: translate(-50%, -50%);
box-shadow: 0 0 0 1px #0d0e1014, 0 30px 60px -30px #0d0e1059, 0 0 90px 10px #3b5bdb2e;
}
.st-mark {
width: 58%;
height: auto;
}
.st-cap {
color: #6b6c72;
text-align: center;
font-size: 13px;
position: absolute;
bottom: 20px;
left: 20px;
right: 20px;
}
.ff {
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-rows: auto;
grid-template-columns: minmax(0, .85fr) minmax(0, 1.4fr);
display: grid;
}
.ff-l {
grid-column-gap: 22px;
grid-row-gap: 22px;
color: #fff;
background-color: #0d0e10;
border-radius: 24px;
flex-direction: column;
padding: 32px;
display: flex;
}
.ff-l-k {
color: #9db0ff;
font-size: 13px;
font-weight: 500;
}
.ff-l-t {
letter-spacing: -.035em;
font-size: clamp(26px, 2.6vw, 34px);
font-weight: 500;
line-height: 1.1;
}
.ff-ans {
grid-column-gap: 12px;
grid-row-gap: 12px;
flex-direction: column;
margin-top: auto;
display: flex;
}
.ff-a {
grid-column-gap: 14px;
grid-row-gap: 14px;
border-top: 1px solid #ffffff24;
justify-content: space-between;
align-items: center;
padding-top: 12px;
display: flex;
}
.ff-a-k {
color: #ffffff8c;
font-size: 13px;
}
.ff-a-v {
text-align: right;
font-size: 14px;
font-weight: 500;
transition: color .3s;
}
.ff-bar {
background-color: #ffffff24;
border-radius: 4px;
height: 4px;
overflow: hidden;
}
.ff-fill {
background-color: #3b5bdb;
width: 0%;
height: 100%;
transition: width .6s cubic-bezier(.2, .7, .2, 1);
}
.ff-r {
background-color: #fff;
border-radius: 24px;
flex-direction: column;
min-height: 540px;
padding: 32px 32px 28px;
display: flex;
}
.ff-step {
grid-column-gap: 20px;
grid-row-gap: 20px;
flex-direction: column;
flex: 1;
display: none;
}
.ff-q-n {
color: #2f4bc4;
font-size: 13px;
font-weight: 500;
}
.ff-q {
letter-spacing: -.035em;
font-size: clamp(26px, 2.8vw, 36px);
font-weight: 500;
line-height: 1.1;
}
.ff-os {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-direction: column;
display: flex;
}
.ff-o {
grid-column-gap: 3px;
grid-row-gap: 3px;
color: #0d0e10;
cursor: pointer;
background-color: #f5f4f0;
border-radius: 16px;
flex-direction: column;
padding: 16px 20px;
transition: background-color .3s, color .3s, transform .3s;
display: flex;
}
.ff-o:hover {
background-color: #e9edfb;
transform: translateX(4px);
}
.ff-o-t {
letter-spacing: -.01em;
font-size: 17px;
font-weight: 500;
}
.ff-o-s {
opacity: .65;
font-size: 14px;
}
.ff-back {
color: #6b6c72;
cursor: pointer;
width: fit-content;
margin-top: auto;
font-size: 14px;
}
.ff-res {
grid-column-gap: 18px;
grid-row-gap: 18px;
flex-direction: column;
flex: 1;
display: none;
}
.ff-r-k {
color: #2f4bc4;
background-color: #e9edfb;
border-radius: 999px;
width: fit-content;
padding: 5px 11px;
font-size: 12px;
font-weight: 500;
}
.ff-r-n {
letter-spacing: -.05em;
font-size: clamp(40px, 5vw, 64px);
font-weight: 500;
line-height: .95;
}
.ff-r-p {
color: #0d0e10;
max-width: 520px;
font-size: 17px;
line-height: 1.55;
}
.ff-why {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-direction: column;
display: flex;
}
.ff-w {
color: #55565c;
font-size: 15px;
line-height: 1.5;
}
.ff-ctas {
grid-column-gap: 10px;
grid-row-gap: 10px;
flex-wrap: wrap;
align-items: center;
margin-top: auto;
padding-top: 8px;
display: flex;
}
.ff-go {
color: #fff;
background-color: #3b5bdb;
border-radius: 999px;
padding: 15px 22px;
font-size: 15px;
font-weight: 500;
text-decoration: none;
transition: background-color .3s;
}
.ff-go:hover {
background-color: #0d0e10;
}
.ff-go2 {
color: #0d0e10;
border-radius: 999px;
padding: 15px 22px;
font-size: 15px;
font-weight: 500;
text-decoration: none;
transition: box-shadow .3s;
box-shadow: inset 0 0 0 1px #0d0e102e;
}
.ff-go2:hover {
box-shadow: inset 0 0 0 1px #0d0e10;
}
.ff-re {
color: #6b6c72;
cursor: pointer;
margin-left: 6px;
font-size: 14px;
text-decoration: underline;
}
.cx-in {
color: #0d0e10;
background-color: #f5f4f0;
border: 1px solid #0d0e1000;
border-radius: 14px;
outline-style: none;
width: 100%;
padding: 15px 16px;
font-size: 16px;
line-height: 1.35;
transition: border-color .2s, background-color .2s, box-shadow .2s;
display: block;
}
.cx-in:focus {
background-color: #fff;
border-color: #3b5bdb;
box-shadow: 0 0 0 4px #3b5bdb1f;
}
.cx-ta {
color: #0d0e10;
resize: vertical;
background-color: #f5f4f0;
border: 1px solid #0d0e1000;
border-radius: 14px;
outline-style: none;
width: 100%;
min-height: 120px;
padding: 15px 16px;
font-size: 16px;
line-height: 1.5;
transition: border-color .2s, background-color .2s, box-shadow .2s;
display: block;
}
.cx-ta:focus {
background-color: #fff;
border-color: #3b5bdb;
box-shadow: 0 0 0 4px #3b5bdb1f;
}
.cx-lab {
color: #0d0e10;
margin-bottom: 8px;
font-size: 14px;
font-weight: 500;
display: block;
}
.cx-opt {
color: #8a8b90;
margin-left: 6px;
font-weight: 400;
}
.cx-f {
flex-direction: column;
display: flex;
}
.cx-row-1 {
grid-column-gap: 14px;
grid-row-gap: 14px;
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
display: grid;
}
.cx-chips {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-wrap: wrap;
display: flex;
}
.cx-chip {
color: #0d0e10;
cursor: pointer;
-webkit-user-select: none;
user-select: none;
background-color: #fff;
border-radius: 999px;
padding: 11px 16px;
font-size: 15px;
line-height: 1.2;
transition: background-color .2s, color .2s, box-shadow .2s;
box-shadow: inset 0 0 0 1px #0d0e1024;
}
.cx-chip:hover {
box-shadow: inset 0 0 0 1px #0d0e10;
}
.cx-btn {
grid-column-gap: 10px;
grid-row-gap: 10px;
color: #fff;
cursor: pointer;
background-color: #0d0e10;
border-radius: 999px;
justify-content: center;
align-items: center;
padding: 16px 26px;
font-size: 16px;
font-weight: 500;
line-height: 1.2;
text-decoration: none;
transition: background-color .3s, transform .2s;
display: inline-flex;
}
.cx-btn:hover {
background-color: #3b5bdb;
}
.cx-btn2 {
grid-column-gap: 10px;
grid-row-gap: 10px;
color: #0d0e10;
cursor: pointer;
background-color: #fff;
border-radius: 999px;
justify-content: center;
align-items: center;
padding: 16px 26px;
font-size: 16px;
font-weight: 500;
line-height: 1.2;
text-decoration: none;
transition: box-shadow .3s;
display: inline-flex;
box-shadow: inset 0 0 0 1px #0d0e102e;
}
.cx-btn2:hover {
box-shadow: inset 0 0 0 1px #0d0e10;
}
.cx-link {
color: #3b5bdb;
cursor: pointer;
font-size: 15px;
font-weight: 500;
text-decoration: none;
}
.cx-ash {
grid-column-gap: 12px;
grid-row-gap: 12px;
align-items: center;
display: flex;
}
.cx-av {
object-fit: cover;
object-position: 50% 20%;
border-radius: 50%;
flex: none;
width: 44px;
height: 44px;
}
.cx-who {
grid-column-gap: 2px;
grid-row-gap: 2px;
flex-direction: column;
display: flex;
}
.cx-nm {
color: #0d0e10;
font-size: 16px;
font-weight: 500;
}
.cx-st {
color: #55565c;
font-size: 13px;
}
.cx-fb {
grid-column-gap: 22px;
grid-row-gap: 10px;
color: #55565c;
flex-wrap: wrap;
align-items: center;
font-size: 14px;
display: flex;
}
.cx-copy {
grid-column-gap: 8px;
grid-row-gap: 8px;
color: #0d0e10;
cursor: pointer;
align-items: center;
font-size: 15px;
font-weight: 500;
display: inline-flex;
}
.cx-priv {
color: #8a8b90;
font-size: 12.5px;
line-height: 1.5;
}
.cx-gap {
grid-column-gap: 18px;
grid-row-gap: 18px;
flex-direction: column;
display: flex;
}
.ca {
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-rows: auto;
grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
display: grid;
}
.ca-card {
background-color: #fff;
border-radius: 24px;
flex-direction: column;
min-height: 580px;
padding: 10px;
display: flex;
}
.ca-top {
border-bottom: 1px solid #0d0e1014;
justify-content: space-between;
align-items: center;
padding: 14px 16px 16px;
display: flex;
}
.ca-step {
color: #6b6c72;
font-size: 13px;
}
.ca-log {
grid-column-gap: 10px;
grid-row-gap: 10px;
flex-direction: column;
flex: 1;
max-height: 420px;
padding: 24px 14px;
display: flex;
overflow-y: auto;
}
.ca-ctl {
border-top: 1px solid #0d0e1014;
min-height: 76px;
padding: 12px;
}
.ca-side {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-direction: column;
display: flex;
}
.ca-s-k {
color: #6b6c72;
padding: 6px 4px 4px;
font-size: 13px;
font-weight: 500;
}
.ca-opt {
grid-column-gap: 4px;
grid-row-gap: 4px;
color: #0d0e10;
cursor: pointer;
background-color: #fff;
border-radius: 20px;
flex-direction: column;
padding: 22px 24px;
text-decoration: none;
transition: transform .3s, box-shadow .3s;
display: flex;
}
.ca-opt:hover {
transform: translateY(-3px);
box-shadow: 0 20px 40px -28px #0d0e1059;
}
.ca-o-t {
letter-spacing: -.02em;
font-size: 19px;
font-weight: 500;
}
.ca-o-p {
color: #55565c;
font-size: 14px;
}
.ca-promise {
grid-column-gap: 12px;
grid-row-gap: 12px;
background-color: #e9edfb;
border-radius: 20px;
flex-direction: column;
margin-top: auto;
padding: 22px 24px;
display: flex;
}
.ca-pr {
color: #1f2a5c;
font-size: 14px;
line-height: 1.45;
}
.cb {
grid-column-gap: 10px;
grid-row-gap: 10px;
flex-direction: column;
display: flex;
}
.cb-hd {
grid-column-gap: 16px;
grid-row-gap: 16px;
background-color: #fff;
border-radius: 20px;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
padding: 18px 22px;
display: flex;
}
.cb-hd-t {
color: #55565c;
font-size: 15px;
}
.cb-tabs {
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-rows: auto;
grid-template-columns: repeat(3, minmax(0, 1fr));
display: grid;
}
.cb-tab {
grid-column-gap: 6px;
grid-row-gap: 6px;
color: #0d0e10;
cursor: pointer;
background-color: #fff;
border-radius: 20px;
flex-direction: column;
padding: 22px 24px;
transition: background-color .3s, color .3s, transform .3s;
display: flex;
}
.cb-tab:hover {
transform: translateY(-3px);
}
.cb-tab-k {
color: #2f4bc4;
letter-spacing: .04em;
text-transform: uppercase;
background-color: #e9edfb;
border-radius: 999px;
width: fit-content;
padding: 4px 10px;
font-size: 11px;
font-weight: 600;
}
.cb-tab-t {
letter-spacing: -.03em;
margin-top: 10px;
font-size: 24px;
font-weight: 500;
}
.cb-tab-p {
opacity: .7;
font-size: 14px;
}
.cb-pan {
background-color: #fff;
border-radius: 24px;
padding: 32px;
display: none;
}
.cb-form {
max-width: 780px;
}
.cb-send {
grid-column-gap: 18px;
grid-row-gap: 18px;
flex-wrap: wrap;
align-items: center;
display: flex;
}
.cb-call {
grid-column-gap: 32px;
grid-row-gap: 32px;
grid-template-rows: auto;
grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
display: grid;
}
.cb-c-l {
grid-column-gap: 16px;
grid-row-gap: 16px;
flex-direction: column;
display: flex;
}
.cb-c-t {
letter-spacing: -.02em;
font-size: 22px;
font-weight: 500;
}
.cb-days {
grid-column-gap: 8px;
grid-row-gap: 8px;
grid-template-rows: auto;
grid-template-columns: repeat(5, minmax(0, 1fr));
display: grid;
}
.cb-c-r {
grid-column-gap: 12px;
grid-row-gap: 12px;
background-color: #f5f4f0;
border-radius: 18px;
flex-direction: column;
padding: 22px;
display: flex;
}
.cb-c-k {
color: #2f4bc4;
font-size: 13px;
font-weight: 500;
}
.cb-li {
color: #0d0e10;
font-size: 15px;
line-height: 1.5;
}
.cb-mail {
grid-column-gap: 20px;
grid-row-gap: 20px;
flex-direction: column;
align-items: flex-start;
display: flex;
}
.cb-m-big {
letter-spacing: -.04em;
word-break: break-all;
font-size: clamp(26px, 4vw, 52px);
font-weight: 500;
}
.cb-m-acts {
grid-column-gap: 10px;
grid-row-gap: 10px;
flex-wrap: wrap;
display: flex;
}
.cb-m-tip {
color: #55565c;
max-width: 560px;
font-size: 15px;
line-height: 1.55;
}
.cc {
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-rows: auto;
grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
align-items: start;
display: grid;
}
.cc-form {
background-color: #fff;
border-radius: 24px;
padding: 32px;
}
.cc-hints {
grid-column-gap: 6px;
grid-row-gap: 6px;
flex-wrap: wrap;
margin-bottom: 10px;
display: flex;
}
.cc-hint {
color: #2f4bc4;
cursor: pointer;
background-color: #e9edfb;
border-radius: 999px;
padding: 6px 11px;
font-size: 13px;
transition: background-color .2s;
}
.cc-hint:hover {
background-color: #d8e0fa;
}
.cc-send {
grid-column-gap: 16px;
grid-row-gap: 16px;
flex-wrap: wrap;
align-items: center;
display: flex;
}
.cc-fb-t {
color: #55565c;
}
.cc-note {
grid-column-gap: 18px;
grid-row-gap: 18px;
background-color: #fbf9f4;
border-radius: 24px;
flex-direction: column;
padding: 26px 26px 24px;
display: flex;
position: sticky;
top: 110px;
box-shadow: 0 0 0 1px #0d0e100f, 0 30px 60px -40px #0d0e1066;
}
.cc-n-top {
border-bottom: 1px solid #0d0e101a;
padding-bottom: 16px;
}
.cc-n-nm {
color: #0d0e10;
font-family: Instrument Serif;
font-size: 24px;
font-style: italic;
line-height: 1;
}
.cc-lines {
flex-direction: column;
display: flex;
}
.cc-l {
grid-column-gap: 12px;
grid-row-gap: 12px;
border-bottom: 1px dashed #3b5bdb4d;
grid-template-rows: auto;
grid-template-columns: 84px minmax(0, 1fr);
padding: 11px 0;
display: grid;
}
.cc-l-k {
color: #8a8b90;
padding-top: 3px;
font-size: 13px;
}
.cc-l-v {
color: #1f2a5c;
word-break: break-word;
font-family: Instrument Serif;
font-size: 18px;
font-style: italic;
line-height: 1.3;
}
.cc-meter {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-direction: column;
display: flex;
}
.cc-m-t {
color: #55565c;
font-size: 13px;
}
.cc-pct {
color: #0d0e10;
font-weight: 600;
}
.cc-bar {
background-color: #0d0e1014;
border-radius: 4px;
height: 4px;
overflow: hidden;
}
.cc-fill {
background-color: #3b5bdb;
width: 0%;
height: 100%;
transition: width .4s;
}
.cc-eta {
color: #fff;
background-color: #3b5bdb;
border-radius: 14px;
padding: 14px 16px;
font-size: 14px;
line-height: 1.45;
}
.cd {
grid-column-gap: 10px;
grid-row-gap: 10px;
flex-direction: column;
max-width: 920px;
margin-left: auto;
margin-right: auto;
display: flex;
}
.cd-paper {
background-color: #fbf9f4;
border-radius: 22px;
padding: 46px 50px 36px;
position: relative;
box-shadow: 0 0 0 1px #0d0e100f, 0 30px 60px -40px #0d0e1073;
}
.cd-top {
grid-column-gap: 20px;
grid-row-gap: 20px;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 24px;
display: flex;
}
.cd-to {
color: #6b6c72;
letter-spacing: .06em;
text-transform: uppercase;
padding-top: 6px;
font-size: 12px;
font-weight: 600;
}
.cd-stamp {
background-color: #fff;
flex: none;
width: 74px;
height: 88px;
padding: 6px;
transform: rotate(3deg);
}
.cd-ph {
object-fit: cover;
object-position: 50% 20%;
width: 100%;
height: 100%;
display: block;
}
.cd-txt {
color: #1f2a5c;
font-family: Instrument Serif;
font-size: clamp(22px, 2.4vw, 30px);
line-height: 1.8;
}
.cd-hi {
margin-bottom: 4px;
font-style: italic;
display: block;
}
.cd-t {
font-style: normal;
}
.cd-in {
color: #3b5bdb;
max-width: 100%;
font-family: Instrument Serif;
font-style: italic;
line-height: 1.3;
font-size: inherit;
background-color: #3b5bdb00;
border-bottom: 2px dashed #3b5bdb73;
border-radius: 0;
outline-style: none;
padding: 0 4px;
transition: border-color .2s, background-color .2s;
display: inline-block;
}
.cd-in:focus {
background-color: #3b5bdb0f;
border-bottom-color: #3b5bdb;
}
.cd-ps {
grid-column-gap: 6px;
grid-row-gap: 6px;
border-top: 1px dashed #0d0e1026;
flex-direction: column;
margin-top: 22px;
padding-top: 18px;
display: flex;
}
.cd-ps-k {
color: #6b6c72;
font-size: 13px;
}
.cd-ps-in {
color: #3b5bdb;
resize: vertical;
background-color: #fff0;
border-bottom: 2px dashed #3b5bdb59;
border-radius: 0;
outline-style: none;
width: 100%;
min-height: 64px;
padding: 4px 0;
font-family: Instrument Serif;
font-size: 20px;
font-style: italic;
display: block;
}
.cd-foot {
grid-column-gap: 16px;
grid-row-gap: 16px;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
margin-top: 28px;
display: flex;
}
.cd-sign {
color: #55565c;
font-size: 14px;
}
.cd-alt {
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-rows: auto;
grid-template-columns: repeat(3, minmax(0, 1fr));
display: grid;
}
.cd-a {
grid-column-gap: 4px;
grid-row-gap: 4px;
color: #0d0e10;
cursor: pointer;
background-color: #fff;
border-radius: 18px;
flex-direction: column;
padding: 18px 20px;
text-decoration: none;
display: flex;
}
.cd-a-k {
color: #6b6c72;
font-size: 12px;
}
.cd-a-t {
font-size: 16px;
font-weight: 500;
}
.ce {
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-rows: auto;
grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
display: grid;
}
.ce-l {
grid-column-gap: 22px;
grid-row-gap: 22px;
color: #fff;
background-color: #3b5bdb;
border-radius: 24px;
flex-direction: column;
padding: 32px;
display: flex;
}
.ce-who {
grid-column-gap: 16px;
grid-row-gap: 16px;
align-items: center;
display: flex;
}
.ce-ph {
object-fit: cover;
object-position: 50% 20%;
border-radius: 50%;
width: 72px;
height: 72px;
box-shadow: 0 0 0 4px #ffffff40;
}
.ce-nm {
font-size: 20px;
font-weight: 500;
}
.ce-rl {
color: #ffffffc7;
font-size: 14px;
}
.ce-t {
letter-spacing: -.035em;
font-size: clamp(26px, 2.6vw, 34px);
font-weight: 500;
line-height: 1.1;
}
.ce-days {
grid-column-gap: 8px;
grid-row-gap: 8px;
grid-template-rows: auto;
grid-template-columns: repeat(5, minmax(0, 1fr));
display: grid;
}
.ce-f {
grid-column-gap: 22px;
grid-row-gap: 12px;
flex-wrap: wrap;
align-items: center;
display: flex;
}
.ce-any {
color: #fff;
border-bottom: 1px solid #ffffff80;
font-size: 15px;
font-weight: 500;
text-decoration: none;
}
.ce-tel {
color: #ffffffd9;
font-size: 15px;
text-decoration: none;
}
.ce-st {
color: #fffc;
margin-top: auto;
font-size: 13px;
}
.ce-r {
background-color: #fff;
border-radius: 24px;
padding: 32px;
}
.ce-r-t {
letter-spacing: -.03em;
font-size: 24px;
font-weight: 500;
}
.ce-mail {
grid-column-gap: 4px;
grid-row-gap: 4px;
border-top: 1px solid #0d0e1014;
flex-direction: column;
padding-top: 16px;
display: flex;
}
.ce-m-k {
color: #6b6c72;
font-size: 13px;
}
.cs-1 {
background-color: #fff;
border-radius: 28px;
max-width: 780px;
margin-left: auto;
margin-right: auto;
padding: clamp(24px, 3.4vw, 44px);
}
.cs-top {
grid-column-gap: 14px;
grid-row-gap: 14px;
border-bottom: 1px solid #eeede8;
align-items: center;
margin-bottom: 26px;
padding-bottom: 22px;
display: flex;
}
.cs-av {
object-fit: cover;
object-position: 50% 20%;
border-radius: 50%;
flex: none;
width: 48px;
height: 48px;
}
.cs-who {
grid-column-gap: 4px;
grid-row-gap: 4px;
flex-direction: column;
display: flex;
}
.cs-hi {
color: #0d0e10;
letter-spacing: -.01em;
font-size: 17px;
font-weight: 500;
line-height: 1.3;
}
.cs-sub {
color: #6b6c72;
font-size: 13px;
}
.cs-form {
grid-column-gap: 22px;
grid-row-gap: 22px;
flex-direction: column;
display: flex;
}
.cs-row-1 {
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr;
display: grid;
}
.cs-f {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-direction: column;
display: flex;
}
.cs-opt {
color: #9a9ba0;
margin-left: 6px;
font-weight: 400;
}
.cs-foot {
grid-column-gap: 20px;
grid-row-gap: 20px;
flex-wrap: wrap;
align-items: center;
padding-top: 4px;
display: flex;
}
.cs-alt {
color: #6b6c72;
font-size: 14px;
line-height: 1.6;
}
.cfx-steps {
flex-direction: column;
margin-top: 28px;
margin-bottom: 28px;
display: flex;
}
.cfx-st {
grid-column-gap: 14px;
grid-row-gap: 14px;
padding-top: 9px;
padding-bottom: 9px;
display: flex;
position: relative;
}
.cfx-n {
z-index: 1;
color: #55565c;
background-color: #fff;
border-radius: 50%;
flex: none;
justify-content: center;
align-items: center;
width: 28px;
height: 28px;
font-size: 13px;
font-weight: 500;
transition: all .35s;
display: flex;
position: relative;
box-shadow: inset 0 0 0 1px #0d0e1024;
}
.cfx-tx {
grid-column-gap: 2px;
grid-row-gap: 2px;
flex-direction: column;
padding-top: 3px;
display: flex;
}
.cfx-t {
color: #0d0e10;
letter-spacing: -.01em;
font-size: 15.5px;
font-weight: 500;
line-height: 1.35;
}
.cfx-d {
color: #6b6c72;
font-size: 13.5px;
line-height: 1.45;
}
.sw {
flex-direction: column;
width: 100%;
display: flex;
}
.sw-bar {
grid-column-gap: 6px;
grid-row-gap: 6px;
background-color: #f5f4f0;
border-bottom: 1px solid #eeede8;
align-items: center;
padding: 7px 9px;
display: flex;
}
.sw-dots {
background-image: radial-gradient(circle, #d4d3ce 2.6px, #0000 3px);
background-repeat: repeat-x;
background-size: 9px 6px;
flex: none;
width: 26px;
height: 6px;
}
.sw-url {
color: #8a8b90;
text-overflow: ellipsis;
white-space: nowrap;
background-color: #fff;
border-radius: 999px;
flex: 1;
min-width: 0;
padding: 2px 8px;
font-family: Geist Mono;
font-size: 9.5px;
line-height: 1.4;
position: relative;
overflow: hidden;
}
.sw-body {
grid-column-gap: 6px;
grid-row-gap: 6px;
flex-direction: column;
padding: 10px 10px 30px;
display: flex;
position: relative;
}
.sw-nav {
background-color: #eeede8;
border-radius: 3px;
width: 42%;
height: 5px;
transition: background-color .35s;
}
.sw-h {
background-color: #0d0e10;
border-radius: 3px;
width: 86%;
height: 9px;
transition: all .4s cubic-bezier(.2, .7, .2, 1);
}
.sw-h2 {
background-color: #0d0e10;
border-radius: 3px;
width: 58%;
height: 9px;
transition: all .4s cubic-bezier(.2, .7, .2, 1);
}
.sw-btn {
background-color: #3b5bdb;
border-radius: 999px;
width: 32%;
height: 10px;
margin-top: 2px;
transition: all .4s cubic-bezier(.2, .7, .2, 1);
}
.sw-img {
background-image: linear-gradient(135deg, #e9edfb, #c9d2ff);
border-radius: 6px;
height: 30px;
transition: all .4s cubic-bezier(.2, .7, .2, 1);
}
.sw-chat {
opacity: 0;
color: #fff;
white-space: nowrap;
background-color: #0d0e10;
border-radius: 10px 10px 2px;
padding: 5px 8px;
font-size: 9px;
line-height: 1.2;
transition: all .4s cubic-bezier(.2, .7, .2, 1);
position: absolute;
top: 8px;
right: 8px;
transform: translateY(6px)scale(.9);
}
.sw-note {
color: #2f4bc4;
white-space: nowrap;
background-color: #e9edfb;
border-radius: 999px;
padding: 4px 9px;
font-size: 9.5px;
font-weight: 500;
line-height: 1.2;
transition: background-color .35s, color .35s;
position: absolute;
bottom: 8px;
left: 50%;
transform: translateX(-50%);
}
.rx-dock-chat {
color: #fff;
background-color: #ffffff2e;
border-radius: 999px;
flex: none;
width: 30px;
height: 30px;
padding: 7px;
}
.rx-faq-g {
color: #66676c;
letter-spacing: .08em;
text-transform: uppercase;
padding-top: 36px;
padding-bottom: 6px;
font-family: Geist Mono;
font-size: 12px;
line-height: 1;
}
.cta-sec {
padding-top: 24px;
padding-bottom: clamp(88px, 11vw, 152px);
}
.cta {
color: #fff;
grid-row-gap: clamp(28px, 4vw, 64px);
grid-column-gap: clamp(28px, 4vw, 64px);
background-color: #0d0e10;
border-radius: clamp(24px, 3vw, 36px);
grid-template-rows: auto;
grid-template-columns: 1.25fr 1fr;
align-items: center;
padding: clamp(32px, 5vw, 72px) clamp(24px, 5vw, 72px);
display: grid;
position: relative;
overflow: hidden;
}
.cta-k {
grid-column-gap: 8px;
grid-row-gap: 8px;
color: #c9d2ff;
background-color: #ffffff14;
border-radius: 999px;
align-items: center;
padding: 7px 12px;
font-size: 13px;
line-height: 1;
display: inline-flex;
}
.cta-dot {
background-color: #3ddc84;
border-radius: 999px;
width: 8px;
height: 8px;
}
.cta-h {
color: #fff;
letter-spacing: -.045em;
margin-top: 20px;
margin-bottom: 0;
font-size: clamp(34px, 4.2vw, 58px);
font-weight: 500;
line-height: 1.02;
}
.cta-em {
font-family: Instrument Serif;
font-style: italic;
font-weight: 400;
}
.cta-p {
color: #ffffffa8;
max-width: 520px;
margin-top: 18px;
margin-bottom: 0;
font-size: 17px;
line-height: 1.55;
}
.cta-proof {
grid-column-gap: 14px;
grid-row-gap: 14px;
align-items: center;
margin-top: 28px;
display: flex;
}
.cta-avs {
display: flex;
}
.cta-av {
object-fit: cover;
border-radius: 999px;
width: 36px;
height: 36px;
margin-left: -8px;
box-shadow: 0 0 0 2px #0d0e10;
}
.cta-av-1 {
margin-left: 0;
}
.cta-pt {
color: #ffffffb3;
font-size: 14px;
line-height: 1.35;
}
.cta-pt-b {
color: #fff;
font-weight: 500;
}
.cta-r {
grid-column-gap: 12px;
grid-row-gap: 12px;
background-color: #ffffff0f;
border-radius: 22px;
flex-direction: column;
padding: clamp(20px, 2.4vw, 32px);
display: flex;
}
.cta-r-k {
color: #fff9;
font-size: 14px;
}
.cta-wa {
grid-column-gap: 12px;
grid-row-gap: 12px;
color: #fff;
background-color: #ffffff14;
border-radius: 999px;
justify-content: space-between;
align-items: center;
padding: 14px 20px;
font-size: 15px;
font-weight: 500;
text-decoration: none;
display: flex;
}
.cta-wa:hover {
background-color: #25d3662e;
}
.cta-wa-d {
background-color: #25d366;
border-radius: 999px;
width: 10px;
height: 10px;
}
.cta-msg {
color: #ffffffb3;
font-size: 14px;
text-decoration: underline;
}
.cta-msg:hover {
color: #fff;
}
.cta-b {
justify-content: space-between;
width: 100%;
}
.nl-sec {
padding-top: 0;
padding-bottom: 24px;
}
.nl {
grid-row-gap: clamp(24px, 4vw, 64px);
grid-column-gap: clamp(24px, 4vw, 64px);
background-color: #fff;
border-radius: clamp(24px, 3vw, 36px);
grid-template-rows: auto;
grid-template-columns: 1.1fr 1fr;
align-items: center;
padding: clamp(28px, 4vw, 56px) clamp(24px, 4vw, 56px);
display: grid;
box-shadow: 0 0 0 1px #0d0e1014;
}
.nl-k {
grid-column-gap: 8px;
grid-row-gap: 8px;
color: #2f4bc4;
background-color: #e9edfb;
border-radius: 999px;
align-items: center;
padding: 7px 12px;
font-size: 13px;
line-height: 1;
display: inline-flex;
}
.nl-dot {
background-color: #3b5bdb;
border-radius: 999px;
width: 8px;
height: 8px;
}
.nl-h {
color: #0d0e10;
letter-spacing: -.04em;
margin-top: 18px;
margin-bottom: 0;
font-size: clamp(28px, 3.2vw, 44px);
font-weight: 500;
line-height: 1.05;
}
.nl-em {
font-family: Instrument Serif;
font-style: italic;
font-weight: 400;
}
.nl-p {
color: #66676c;
max-width: 480px;
margin-top: 14px;
margin-bottom: 0;
font-size: 16px;
line-height: 1.55;
}
.nl-pts {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-wrap: wrap;
margin-top: 16px;
display: flex;
}
.nl-pt {
color: #3a3b40;
background-color: #f5f4f0;
border-radius: 999px;
padding: 6px 10px;
font-size: 13px;
line-height: 1;
}
.fa-acts, .fa-low, .fa-mid, .fa-top, .fo-act, .fo-act-pri, .fo-act-wa, .fo-avs, .fo-bar, .fo-cols, .fo-dot, .fo-em, .fo-h, .fo-in, .fo-k, .fo-logo, .fo-logos, .fo-nl, .fo-p, .fo-proof, .fo-pt, .fo-sep, .fo-st, .rx-clock-1, .rx-copy-w {
box-sizing: border-box;
}
.rx-h1-plain {
font-style: normal;
}
.rx-new-badge {
z-index: 4;
grid-column-gap: 8px;
grid-row-gap: 8px;
pointer-events: none;
color: #fff;
letter-spacing: .02em;
background-color: #3b5bdb;
border-radius: 999px;
align-items: center;
padding: 9px 15px 9px 13px;
font-size: 13px;
font-weight: 500;
line-height: 1;
display: none;
position: absolute;
top: 16px;
left: 16px;
box-shadow: 0 0 0 3px #fffffff2, 0 14px 30px -10px #3b5bdbe6;
}
.rx-nd {
background-color: #fff;
border-radius: 50%;
width: 7px;
height: 7px;
position: relative;
}
.rx-new-t {
line-height: 1;
}
.rx-cs {
max-width: 1180px;
margin-left: auto;
margin-right: auto;
padding-top: 44px;
padding-bottom: 4vh;
position: relative;
}
.rx-cs-card {
grid-column-gap: 36px;
grid-row-gap: 36px;
transform-origin: 50% 0;
color: #0d0e10;
background-color: #fff;
border-radius: 30px;
grid-template-rows: auto;
grid-template-columns: 1fr 1.12fr;
min-height: 500px;
margin-bottom: 12vh;
padding: 14px 14px 14px 44px;
text-decoration: none;
display: grid;
position: sticky;
top: 14vh;
box-shadow: 0 1px 2px #0d0e100a, 0 0 0 1px #0d0e100d, 0 40px 70px -40px #0d0e104d;
}
.rx-cs-card--2 {
top: calc(14vh + 16px);
}
.rx-cs-card--3 {
top: calc(14vh + 32px);
}
.rx-cs-card--4 {
margin-bottom: 0;
top: calc(14vh + 48px);
}
.rx-cs-l {
flex-direction: column;
padding-top: 30px;
padding-bottom: 30px;
display: flex;
}
.rx-cs-top {
grid-column-gap: 16px;
justify-content: space-between;
align-items: baseline;
display: flex;
}
.rx-cs-ind {
color: #3b5bdb;
letter-spacing: -.01em;
font-family: Instrument Serif;
font-size: 26px;
font-style: italic;
line-height: 1;
}
.rx-cs-n {
color: #66676c;
letter-spacing: .08em;
font-family: Geist Mono;
font-size: 11px;
}
.rx-cs-t {
color: #0d0e10;
letter-spacing: -.035em;
margin-top: 22px;
margin-bottom: 0;
font-size: 38px;
font-weight: 500;
line-height: 1.06;
}
.rx-cs-d {
color: #66676c;
max-width: 46ch;
margin-top: 18px;
margin-bottom: 0;
font-size: 16.5px;
line-height: 1.55;
}
.rx-cs-meta {
grid-column-gap: 20px;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr;
margin-top: auto;
padding-top: 32px;
display: grid;
}
.rx-cs-ml {
color: #66676c;
letter-spacing: .08em;
text-transform: uppercase;
font-family: Geist Mono;
font-size: 11px;
}
.rx-cs-mv {
letter-spacing: -.02em;
margin-top: 6px;
font-size: 20px;
font-weight: 500;
line-height: 1.2;
}
.rx-cs-who {
grid-column-gap: 14px;
background-color: #f5f4f0;
border-radius: 18px;
align-items: center;
margin-top: 24px;
padding: 10px 12px 10px 10px;
display: flex;
}
.rx-cs-av {
object-fit: cover;
border-radius: 999px;
flex: none;
width: 46px;
height: 46px;
}
.rx-cs-av--t {
color: #fff;
letter-spacing: .04em;
background-color: #3b5bdb;
justify-content: center;
align-items: center;
font-family: Geist Mono;
font-size: 13px;
display: flex;
}
.rx-cs-wt {
flex: 1;
min-width: 0;
}
.rx-cs-wn {
font-size: 15.5px;
font-weight: 600;
line-height: 1.25;
}
.rx-cs-wr {
color: #66676c;
font-size: 14px;
line-height: 1.35;
}
.rx-cs-go {
color: #fff;
white-space: nowrap;
background-color: #0d0e10;
border-radius: 999px;
flex: none;
align-items: center;
height: 38px;
padding-left: 16px;
padding-right: 16px;
font-size: 13.5px;
font-weight: 500;
display: flex;
}
.rx-cs-v {
background-color: #eceae4;
border-radius: 22px;
min-height: 100%;
position: relative;
overflow: hidden;
}
.rx-cs-img {
object-fit: cover;
object-position: 50% 0%;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.rx-sv {
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr;
margin-top: 44px;
display: grid;
}
.rx-sv-c {
color: #0d0e10;
background-color: #fff;
border-radius: 24px;
flex-direction: column;
min-height: 300px;
padding: 32px 34px;
display: flex;
box-shadow: 0 1px 2px #0d0e100a, 0 0 0 1px #0d0e100d;
}
.rx-sv-top {
justify-content: space-between;
align-items: center;
display: flex;
}
.rx-sv-n {
color: #3b5bdb;
letter-spacing: .06em;
font-family: Geist Mono;
font-size: 12px;
}
.rx-sv-new {
color: #fff;
letter-spacing: .06em;
text-transform: uppercase;
background-color: #3b5bdb;
border-radius: 999px;
align-items: center;
height: 24px;
padding-left: 10px;
padding-right: 10px;
font-family: Geist Mono;
font-size: 11px;
display: flex;
}
.rx-sv-t {
letter-spacing: -.03em;
margin-top: 40px;
margin-bottom: 0;
font-size: 30px;
font-weight: 500;
line-height: 1.1;
}
.rx-sv-d {
color: #66676c;
max-width: 48ch;
margin-top: 14px;
margin-bottom: 0;
font-size: 16px;
line-height: 1.55;
}
.rx-sv-tags {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-wrap: wrap;
margin-top: auto;
padding-top: 28px;
display: flex;
}
.rx-sv-tag {
color: #3a3b40;
letter-spacing: .06em;
text-transform: uppercase;
background-color: #f5f4f0;
border-radius: 999px;
align-items: center;
height: 28px;
padding-left: 12px;
padding-right: 12px;
font-family: Geist Mono;
font-size: 11px;
display: flex;
}
.rx-qs {
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-rows: auto;
grid-template-columns: 1.25fr 1fr;
margin-top: 44px;
display: grid;
}
.rx-qs-l {
background-color: #fff;
border-radius: 28px;
flex-direction: column;
padding: 36px 40px;
display: flex;
box-shadow: 0 1px 2px #0d0e100a, 0 0 0 1px #0d0e100d;
}
.rx-qs-k {
color: #66676c;
letter-spacing: .08em;
text-transform: uppercase;
font-family: Geist Mono;
font-size: 11px;
}
.rx-qs-list {
flex-direction: column;
margin-top: 18px;
display: flex;
}
.rx-qs-li {
grid-column-gap: 16px;
border-top: 1px solid #0d0e1014;
align-items: center;
padding-top: 16px;
padding-bottom: 16px;
display: flex;
}
.rx-qs-ck {
color: #3b5bdb;
letter-spacing: .06em;
flex: none;
font-family: Geist Mono;
font-size: 12px;
}
.rx-qs-lt {
color: #0d0e10;
letter-spacing: -.02em;
font-size: 19px;
font-weight: 500;
line-height: 1.3;
}
.rx-qs-note {
color: #66676c;
margin-top: auto;
margin-bottom: 0;
padding-top: 24px;
font-size: 15px;
line-height: 1.55;
}
.rx-qs-r {
color: #f5f4f0;
background-color: #0d0e10;
border-radius: 28px;
flex-direction: column;
padding: 36px 40px;
display: flex;
}
.rx-qs-k2 {
color: #9db0ff;
letter-spacing: .08em;
text-transform: uppercase;
font-family: Geist Mono;
font-size: 11px;
}
.rx-qs-p {
letter-spacing: -.05em;
margin-top: 18px;
font-size: 88px;
font-weight: 500;
line-height: 1;
}
.rx-qs-s {
color: #b8bcc8;
max-width: 36ch;
margin-top: 18px;
margin-bottom: 0;
font-size: 16px;
line-height: 1.55;
}
.rx-qs-btns {
grid-column-gap: 10px;
grid-row-gap: 10px;
flex-wrap: wrap;
margin-top: auto;
padding-top: 32px;
display: flex;
}
.rx-qs-b1 {
color: #fff;
background-color: #3b5bdb;
border-radius: 999px;
align-items: center;
height: 48px;
padding-left: 22px;
padding-right: 22px;
font-size: 15px;
font-weight: 500;
text-decoration: none;
display: flex;
}
.rx-qs-b2 {
color: #f5f4f0;
background-color: #1d1f24;
border-radius: 999px;
align-items: center;
height: 48px;
padding-left: 22px;
padding-right: 22px;
font-size: 15px;
font-weight: 500;
text-decoration: none;
display: flex;
}
.rx-fd {
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-rows: auto;
grid-template-columns: .8fr 1.2fr;
margin-top: 44px;
display: grid;
}
.rx-fd-ph {
background-color: #eceae4;
border-radius: 28px;
min-height: 460px;
position: relative;
overflow: hidden;
}
.rx-fd-img {
object-fit: cover;
object-position: 50% 20%;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.rx-fd-b {
background-color: #fff;
border-radius: 28px;
flex-direction: column;
padding: 44px 48px;
display: flex;
box-shadow: 0 1px 2px #0d0e100a, 0 0 0 1px #0d0e100d;
}
.rx-fd-q {
color: #0d0e10;
letter-spacing: -.015em;
margin-top: 0;
margin-bottom: 0;
font-family: Instrument Serif;
font-size: 34px;
font-style: italic;
line-height: 1.18;
}
.rx-fd-p {
color: #66676c;
max-width: 56ch;
margin-top: 22px;
margin-bottom: 0;
font-size: 17px;
line-height: 1.6;
}
.rx-fd-facts {
grid-column-gap: 20px;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr 1fr;
margin-top: auto;
padding-top: 36px;
display: grid;
}
.rx-fd-f {
border-top: 1px solid #0d0e1014;
padding-top: 14px;
}
.rx-fd-fl {
color: #66676c;
letter-spacing: .08em;
text-transform: uppercase;
font-family: Geist Mono;
font-size: 11px;
}
.rx-fd-fv {
letter-spacing: -.02em;
margin-top: 6px;
font-size: 18px;
font-weight: 500;
}
.rx-fd-sig {
margin-top: 28px;
}
.rx-fd-sn {
font-size: 16px;
font-weight: 600;
}
.rx-fd-sr {
color: #66676c;
font-size: 14px;
}
.rx-hb {
grid-column-gap: 12px;
background-color: #fff;
border-radius: 999px;
align-items: center;
margin-bottom: 28px;
padding: 6px 18px 6px 6px;
display: inline-flex;
box-shadow: 0 0 0 1px #0d0e100f, 0 8px 24px -14px #0d0e1040;
}
.rx-hb-avs {
display: flex;
}
.rx-hb-av {
object-fit: cover;
border: 2px solid #fff;
border-radius: 999px;
width: 32px;
height: 32px;
margin-left: -8px;
}
.rx-hb-t {
text-align: left;
flex-direction: column;
display: flex;
}
.rx-hb-st {
color: #f5a524;
letter-spacing: 1.5px;
font-size: 12px;
line-height: 1;
}
.rx-hb-l {
color: #0d0e10;
margin-top: 3px;
font-size: 13.5px;
font-weight: 500;
line-height: 1.2;
}
.rx-hb-sc {
color: #66676c;
font-size: 12px;
font-weight: 500;
line-height: 1;
}
.pd {
color: #0d0e10;
background-color: #f5f4f0;
}
.pd-top {
padding-top: 148px;
}
.pd-wrap {
max-width: 1240px;
margin-left: auto;
margin-right: auto;
padding-left: 32px;
padding-right: 32px;
}
.pd-head {
flex-direction: column;
align-items: flex-start;
max-width: 920px;
display: flex;
}
.pd-back {
color: #5b5d63;
align-items: center;
margin-bottom: 28px;
font-size: 14px;
line-height: 1.2;
text-decoration: none;
display: inline-flex;
}
.pd-tags {
grid-column-gap: 8px;
grid-row-gap: 8px;
flex-wrap: wrap;
margin-bottom: 22px;
display: flex;
}
.pd-tag {
color: #3d3f45;
background-color: #fff;
border-radius: 999px;
padding: 8px 12px;
font-size: 13px;
line-height: 1;
}
.pd-h1 {
letter-spacing: -.045em;
margin-top: 0;
margin-bottom: 0;
font-size: 76px;
font-weight: 500;
line-height: 1;
}
.pd-lede {
color: #45474d;
max-width: 760px;
margin-top: 22px;
margin-bottom: 0;
font-size: 22px;
line-height: 1.45;
}
.pd-acts {
grid-column-gap: 26px;
grid-row-gap: 14px;
flex-wrap: wrap;
align-items: center;
margin-top: 32px;
display: flex;
}
.pd-live {
color: #fff;
background-color: #0d0e10;
border-radius: 999px;
align-items: center;
height: 48px;
padding-left: 22px;
padding-right: 22px;
font-size: 15px;
font-weight: 500;
text-decoration: none;
display: inline-flex;
}
.pd-jump {
color: #0d0e10;
font-size: 15px;
text-decoration: underline;
}
.pd-meta {
border-top: 1px solid #0d0e101a;
grid-template-rows: auto;
grid-template-columns: repeat(4, minmax(0, 1fr));
margin-top: 56px;
display: grid;
}
.pd-mi {
padding-top: 20px;
padding-right: 24px;
}
.pd-mk {
color: #7a7c82;
margin-bottom: 8px;
font-size: 13px;
line-height: 1.3;
}
.pd-mv {
color: #0d0e10;
font-size: 16px;
line-height: 1.45;
}
.pd-hero {
background-color: #e9e7e1;
border-radius: 24px;
margin-top: 48px;
overflow: hidden;
}
.pd-hero-img, .pd-cover-img {
width: 100%;
height: auto;
display: block;
}
.pd-stats {
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-rows: auto;
grid-template-columns: repeat(3, minmax(0, 1fr));
margin-top: 16px;
display: grid;
}
.pd-stat {
background-color: #fff;
border-radius: 20px;
padding: 28px;
}
.pd-sv {
color: #0d0e10;
letter-spacing: -.04em;
font-size: 48px;
font-weight: 500;
line-height: 1;
}
.pd-sl {
color: #5b5d63;
margin-top: 12px;
font-size: 15px;
line-height: 1.45;
}
.pd-story {
padding-top: 120px;
padding-bottom: 40px;
}
.pd-grid {
grid-column-gap: 80px;
grid-row-gap: 80px;
grid-template-rows: auto;
grid-template-columns: 220px minmax(0, 1fr);
align-items: start;
display: grid;
}
.pd-toc {
flex-direction: column;
display: flex;
position: sticky;
top: 120px;
}
.pd-toc-k {
color: #7a7c82;
margin-bottom: 12px;
font-size: 13px;
}
.pd-toc-a {
color: #7a7c82;
border-left: 2px solid #0d0e101a;
padding-top: 8px;
padding-bottom: 8px;
padding-left: 14px;
font-size: 15px;
line-height: 1.3;
text-decoration: none;
}
.pd-body {
grid-column-gap: 88px;
grid-row-gap: 88px;
flex-direction: column;
max-width: 760px;
display: flex;
}
.pd-sec {
scroll-margin-top: 110px;
}
.pd-sk {
color: #3b5bdb;
margin-bottom: 14px;
font-size: 13px;
font-weight: 500;
line-height: 1.3;
}
.pd-h2 {
letter-spacing: -.035em;
margin-top: 0;
margin-bottom: 24px;
font-size: 40px;
font-weight: 500;
line-height: 1.08;
}
.pd-rt {
color: #2d2f34;
font-size: 18px;
line-height: 1.65;
}
.pd-steps {
font-size: 18px;
}
.pd-gal {
padding-top: 80px;
padding-bottom: 40px;
scroll-margin-top: 90px;
}
.pd-gal-head {
max-width: 760px;
margin-bottom: 40px;
margin-left: 300px;
}
.pd-gal-hint {
color: #7a7c82;
margin-top: 0;
margin-bottom: 0;
font-size: 15px;
line-height: 1.5;
}
.pd-gal-rt {
font-size: 15px;
}
.pd-screens {
grid-column-gap: 16px;
grid-row-gap: 16px;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr;
display: grid;
}
.pd-scr {
background-color: #e9e7e1;
border-radius: 20px;
width: 100%;
height: auto;
display: block;
}
.pd-scr-full {
grid-column: 1 / -1;
}
.pd-res {
padding-top: 120px;
padding-bottom: 120px;
scroll-margin-top: 90px;
}
.pd-res-grid {
grid-column-gap: 64px;
grid-row-gap: 64px;
grid-template-rows: auto;
grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
align-items: start;
display: grid;
}
.pd-res-l {
min-width: 0;
}
.pd-credits {
grid-column-gap: 24px;
grid-row-gap: 24px;
border-top: 1px solid #0d0e101a;
grid-template-rows: auto;
grid-template-columns: 1fr 1fr;
margin-top: 40px;
padding-top: 24px;
display: grid;
}
.pd-cr {
min-width: 0;
}
.pd-cv {
color: #2d2f34;
font-size: 15px;
line-height: 1.55;
}
.pd-q {
background-color: #fff;
border-radius: 24px;
padding: 40px;
position: sticky;
top: 120px;
}
.pd-qt {
color: #0d0e10;
letter-spacing: -.01em;
margin-top: 0;
margin-bottom: 0;
font-size: 22px;
line-height: 1.45;
}
.pd-qw {
grid-column-gap: 14px;
grid-row-gap: 14px;
align-items: center;
margin-top: 28px;
display: flex;
}
.pd-qp {
object-fit: cover;
border-radius: 50%;
flex-shrink: 0;
width: 48px;
height: 48px;
}
.pd-qi {
min-width: 0;
}
.pd-qn {
font-size: 15px;
font-weight: 500;
line-height: 1.3;
}
.pd-qr {
color: #7a7c82;
margin-top: 2px;
font-size: 14px;
line-height: 1.4;
}
.pr-more {
grid-column-gap: 24px;
grid-row-gap: 24px;
background-color: #fff;
border-radius: 24px;
justify-content: space-between;
align-items: center;
margin-top: 48px;
padding: 28px 32px;
display: flex;
}
.pr-more-txt {
grid-column-gap: 4px;
grid-row-gap: 4px;
flex-direction: column;
display: flex;
}
.pr-more-h {
color: #0d0e10;
margin-top: 0;
margin-bottom: 0;
font-size: 18px;
font-weight: 500;
line-height: 1.4;
}
.pr-more-p {
color: #7a7c82;
margin-top: 0;
margin-bottom: 0;
font-size: 15px;
line-height: 1.55;
}
@media screen and (max-width: 991px) {
.rx-btn.rx-btn--ink.rx-btn--in-menu {
justify-content: space-between;
margin: 10px 6px 4px;
}
.rx-burger {
display: flex;
}
.rx-menu {
grid-column-gap: 2px;
grid-row-gap: 2px;
opacity: 0;
pointer-events: none;
background-color: #fff;
border-radius: 24px;
flex-direction: column;
padding: 12px;
transition: opacity .4s, transform .5s cubic-bezier(.2, .7, .2, 1);
display: flex;
position: absolute;
top: 74px;
left: 16px;
right: 16px;
transform: translateY(-8px)scale(.98);
box-shadow: 0 0 0 1px #0d0e1014, 0 30px 60px -32px #0d0e1047;
}
.rx-ml {
letter-spacing: -.02em;
border-radius: 14px;
padding: 14px 16px;
font-size: 20px;
font-weight: 500;
}
.rx-ml:hover {
background-color: var(--background);
}
.rx-nav-cta, .rx-nav-links {
display: none;
}
.rx-wall {
grid-template-columns: repeat(3, minmax(0, 1fr));
height: 540px;
}
.rx-card.rx-wk, .rx-card.rx-wk.rx-wk--7, .rx-card.rx-wk.rx-wk--5 {
grid-column: span 12;
}
.rx-card.rx-ct, .rx-card.rx-rvs {
grid-template-columns: 1fr;
}
.rx-head-g {
grid-column-gap: 20px;
grid-row-gap: 20px;
grid-template-columns: 1fr;
}
.rx-media.rx-media--in-wk.rx-media--in-wk--7, .rx-media.rx-media--in-wk.rx-media--in-wk--5 {
aspect-ratio: 16 / 11;
flex: none;
min-height: 0;
}
.rx-paths, .rx-band {
grid-template-columns: 1fr;
}
.rx-tpls {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.rx-wk, .rx-wk--5, .rx-wk--7 {
grid-column: span 12;
}
.rx-facts, .rx-revs, .rx-ct {
grid-template-columns: 1fr;
}
.rx-bento {
grid-template-columns: 1fr 1fr;
}
.rx-bt.rx-bt--tall, .rx-bt--tall {
grid-row: span 1;
min-height: 340px;
}
.rx-tabs {
grid-template-columns: 1fr;
}
.rx-tabs-r {
min-height: 420px;
}
.rx-rvs {
grid-template-columns: 1fr;
}
.rx-rvs-r {
order: -1;
min-height: 340px;
}
.rx-faq2 {
grid-template-columns: 1fr;
}
.rx-faq2-l {
position: static;
}
.wb-tpl-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.rx-fl-line {
width: 1px;
height: auto;
inset: 56px auto 88px 55px;
box-shadow: 1px 0 #fffffff2;
}
.rx-fl-fill {
background-image: linear-gradient(#3b5bdb33, #3b5bdb);
width: 100%;
height: 0%;
}
.rx-fl-n {
grid-column-gap: 0px;
grid-template-columns: 1fr;
min-height: 260px;
padding: 28px 28px 30px;
display: grid;
top: 96px;
}
.rx-fl-ic {
grid-column-gap: 10px;
border-radius: 20px;
grid-area: 1 / 1 / 2 / 2;
place-self: start;
width: max-content;
min-width: 64px;
height: 64px;
margin-bottom: 22px;
padding-left: 18px;
padding-right: 18px;
}
.rx-fl-num {
margin-top: 0;
}
.rx-fl-t {
margin-top: 8px;
font-size: 32px;
}
.rx-fl-steps {
grid-column-gap: 0px;
grid-row-gap: 14px;
grid-template-columns: 1fr;
}
.cf-card {
grid-template-columns: 1fr;
}
.cf-h2 {
font-size: 52px;
}
.rx-logos {
grid-template-columns: 1fr 1fr 1fr;
margin-left: 32px;
margin-right: 32px;
}
.rx-lg-c.rx-lg-c--label {
grid-column: span 3 / span 3;
height: 72px;
padding-left: 18px;
}
.rx-pr-pin {
grid-row-gap: 0px;
grid-template-columns: 1fr;
align-content: start;
padding-top: 0;
}
.rx-pr-l {
z-index: 6;
background-color: #f5f4f0;
padding-top: 14px;
padding-bottom: 18px;
top: 72px;
}
.rx-pr-i {
box-shadow: none;
border-top-style: none;
padding-top: 0;
padding-bottom: 0;
}
.rx-pr-t {
font-size: 26px;
}
.rx-pr-r {
order: 0;
}
.rx-pr-deck {
max-width: 320px;
}
.rx-pr-card {
margin-bottom: 26vh;
top: 230px;
}
.cs-title {
font-size: 58px;
}
.cs-facts {
grid-template-rows: auto;
grid-template-columns: 1fr 1fr;
}
.cs-body {
row-gap: 56px;
margin-top: 72px;
}
.cs-row {
grid-template-rows: auto;
grid-template-columns: 1fr;
}
.pr {
grid-template-rows: auto;
grid-template-columns: 40px 0 minmax(0, 1fr) minmax(0, .6fr) 44px;
}
.pr-name {
font-size: 30px;
}
.pr-plat, .pr-yr {
display: none;
}
.cx-title {
font-size: 64px;
}
.cx-body {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
row-gap: 56px;
margin-top: 80px;
}
.cx-side {
position: relative;
top: 0;
}
.cx-prog {
display: none;
}
.cx-main {
row-gap: 72px;
}
.cx-shot {
width: 640px;
}
.tp-hero {
grid-template-rows: auto;
grid-template-columns: 1fr;
row-gap: 32px;
}
.tp-view {
height: auto;
}
.tp-top {
grid-template-rows: auto;
grid-template-columns: 1fr;
row-gap: 40px;
}
.tp-info {
position: static;
}
.rv-feat {
padding: 48px 40px 32px;
}
.rv-feat-q {
font-size: 34px;
}
.rv-ml {
flex-basis: 100%;
margin-left: 0;
}
.rv-go {
margin-left: 0;
}
.rv-grid {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
}
.cx-split {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
row-gap: 40px;
}
.ab-facts {
grid-template-rows: auto;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ab-steps {
grid-template-rows: auto;
grid-template-columns: 1fr;
}
.ab-tl, .ab-team {
grid-template-rows: auto;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ab-hej {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
}
.ab-clock {
min-height: 300px;
}
.ab-no, .ab-desk {
grid-template-rows: auto;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ap-mt {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
}
.ap-stg {
grid-template-rows: auto;
grid-template-columns: repeat(5, minmax(132px, 1fr));
overflow-x: auto;
}
.ap-tools {
grid-template-rows: auto;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.ax-b {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
}
.ax-b-steps {
flex-direction: row;
overflow-x: auto;
}
.ax-b-st {
min-width: 210px;
}
.ax-p {
grid-template-rows: auto;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.aw {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
}
.aw-card {
min-height: 0;
}
.pcs {
grid-template-rows: auto;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.pc-m {
font-size: 17px;
}
.st {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
}
.st-stage {
min-height: 460px;
}
.ff {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
}
.ff-r {
min-height: 0;
}
.ca, .cb-tabs, .cb-call, .cc {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
}
.cc-note {
position: static;
}
.ce {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
}
.cta, .nl {
grid-template-rows: auto;
grid-template-columns: 1fr;
}
}
@media screen and (max-width: 767px) {
.rx-btn {
height: 52px;
}
.rx-btn.rx-btn--ink.rx-btn--2l, .rx-btn.rx-btn--light.rx-btn--2l {
justify-content: space-between;
}
.rx-logo {
width: 136px;
}
.rx-logo.rx-logo--in-ft {
width: 160px;
}
.rx-dock {
padding: 0 10px;
bottom: 10px;
}
.rx-dock-b {
flex: 1;
padding: 0 8px;
}
.rx-dock-home {
display: none;
}
.rx-dock-in {
justify-content: space-between;
width: 100%;
}
.rx-dock-me {
padding: 0 4px;
}
.rx-dock-me-t {
display: none;
}
.rx-dock-seg {
flex: 1;
}
.rx-hero {
padding-top: 120px;
padding-bottom: 56px;
}
.rx-hero-sub {
font-size: 17px;
}
.rx-wall {
grid-column-gap: 10px;
grid-row-gap: 10px;
grid-template-columns: repeat(2, minmax(0, 1fr));
height: 420px;
margin-top: 48px;
padding: 0 10px;
}
.rx-wall-track {
grid-column-gap: 10px;
grid-row-gap: 10px;
}
.rx-wrap {
padding: 0 18px;
}
.rx-clients {
grid-column-gap: 14px;
grid-row-gap: 14px;
flex-direction: column;
align-items: flex-start;
padding: 22px 0;
}
.rx-clients-l {
padding-left: 0;
}
.rx-marq {
width: 100%;
}
.rx-card.rx-rev {
padding: 26px;
}
.rx-card.rx-ask2 {
padding-bottom: 130px;
}
.rx-paths {
border-radius: 24px;
padding: 6px;
}
.rx-band-c {
flex-direction: column;
align-items: flex-start;
padding: 24px;
}
.rx-tpls {
border-radius: 24px;
grid-template-columns: 1fr;
padding: 6px;
}
.rx-work {
border-radius: 24px;
padding: 6px;
}
.rx-proc {
grid-template-columns: 1fr;
}
.rx-rev {
padding: 26px;
}
.rx-prices {
border-radius: 24px;
grid-template-columns: 1fr;
padding: 6px;
}
.rx-a-p {
padding-right: 0;
}
.rx-qa.rx-qa--c {
padding: 0 18px;
}
.rx-brief, .rx-me {
padding: 24px;
}
.rx-strip {
grid-template-columns: 1fr;
}
.rx-ft {
border-radius: 24px 24px 0 0;
padding-top: 72px;
}
.rx-ft-bot {
flex-direction: column;
align-items: flex-start;
}
.rx-ft-cols {
grid-template-columns: 1fr 1fr;
}
.rx-ft-top {
grid-template-columns: 1fr;
}
.rx-bento {
border-radius: 24px;
grid-template-columns: 1fr;
padding: 6px;
}
.rx-bt {
padding: 24px;
}
.rx-bt.rx-bt--tall, .rx-bt--tall {
padding: 10px;
}
.rx-tabs-r {
min-height: 460px;
}
.rx-tp-card {
width: calc(100% - 24px);
padding: 18px;
bottom: 12px;
left: 12px;
}
.rx-rvs-l {
padding: 24px 20px 20px;
}
.rx-rvs-stack {
min-height: 340px;
}
.rx-ask2 {
padding-bottom: 130px;
}
.rx-qa--c {
padding: 0 18px;
}
.rx-ft-mail-v {
word-break: break-all;
}
.rx-btn--2l {
justify-content: space-between;
}
.rx-eyebrow {
margin-bottom: 24px;
font-size: 12.5px;
}
.rx-hero-ctas {
flex-direction: column;
align-items: stretch;
width: 100%;
max-width: 360px;
}
.rx-proof {
grid-column-gap: 18px;
grid-row-gap: 14px;
margin-top: 32px;
}
.rx-proof-d {
display: none;
}
.wb-section {
padding-top: 112px;
padding-bottom: 88px;
}
.wb-container {
padding-left: 18px;
padding-right: 18px;
}
.wb-tpl-grid {
grid-row-gap: 44px;
grid-template-columns: minmax(0, 1fr);
}
.wb-tpl-name {
font-size: 26px;
}
.rx-lens {
width: 168px;
height: 168px;
margin-top: -84px;
margin-left: -84px;
}
.rx-lens-g {
width: 40px;
height: 40px;
margin-bottom: 8px;
}
.rx-lens-t {
font-size: 17px;
}
.rx-rc-item {
width: 240px;
min-width: 240px;
}
.rx-rc {
padding: 6px;
}
.rx-fl-n {
border-radius: 20px;
min-height: 240px;
padding: 22px 20px 24px;
top: 84px;
}
.rx-fl-d {
font-size: 16px;
}
.rx-fl-steps {
padding: 6px;
}
.cf-card {
border-radius: 24px;
margin-top: 28px;
padding: 6px;
}
.cf-l {
padding: 32px 22px 28px;
}
.cf-h2 {
font-size: 40px;
}
.cf-who {
grid-row-gap: 14px;
flex-direction: column;
align-items: flex-start;
}
.cf-ph {
aspect-ratio: 4 / 3;
width: 100%;
height: auto;
}
.cf-r {
padding: 28px 18px 24px;
}
.cf-row {
grid-template-columns: 1fr;
}
.cf-btn {
width: 100%;
}
.rx-logos {
margin-top: 20px;
margin-left: 18px;
margin-right: 18px;
}
.rx-lg-c {
height: 88px;
}
.rx-lg-img {
max-width: 64%;
max-height: 24px;
}
.rx-pr-deck {
max-width: 300px;
}
.rx-pr-card {
border-radius: 24px;
padding: 20px;
}
.rx-pr-ct {
font-size: 20px;
}
.cs {
padding-top: 130px;
}
.cs-title {
font-size: 42px;
}
.cs-lede {
font-size: 18px;
}
.cs-cover {
border-radius: 20px;
}
.cs-k {
font-size: 24px;
}
.cs-rt {
font-size: 17px;
}
.cs-more-h {
flex-direction: column;
align-items: flex-start;
row-gap: 20px;
}
.cs-more-t {
font-size: 32px;
}
.cs-gal-1 {
grid-template-rows: auto;
grid-template-columns: 1fr;
margin-top: 72px;
}
.cs-shot {
border-radius: 16px;
}
.cs-shot--wide {
grid-column: span 1 / span 1;
}
.pr {
grid-template-rows: auto;
grid-template-columns: 96px minmax(0, 1fr) 36px;
column-gap: 16px;
padding-top: 20px;
padding-bottom: 20px;
}
.pr-n {
display: none;
}
.pr-thumb {
width: 96px;
}
.pr-name {
font-size: 22px;
}
.pr-desc {
margin-top: 4px;
font-size: 14px;
}
.pr-ind {
display: none;
}
.pr-go {
width: 36px;
height: 36px;
}
.cx {
padding-top: 124px;
}
.cx-title {
font-size: 44px;
}
.cx-lede {
font-size: 18px;
}
.cx-frame {
border-radius: 16px;
margin-top: 40px;
}
.cx-bar {
grid-template-rows: auto;
grid-template-columns: 44px 1fr 0;
height: 40px;
padding-left: 12px;
padding-right: 12px;
}
.cx-dot {
width: 8px;
height: 8px;
}
.cx-url {
min-width: 0;
font-size: 11px;
}
.cx-view {
aspect-ratio: 4 / 3;
}
.cx-sec-k {
font-size: 32px;
}
.cx-rt {
font-size: 17px;
}
.cx-sec--res {
padding: 28px 24px;
}
.cx-screens {
margin-top: 96px;
}
.cx-scr-t {
font-size: 32px;
}
.cx-shot {
border-radius: 14px;
width: 300px;
}
.tp-price {
font-size: 52px;
}
.tp-view {
height: auto;
overflow-y: hidden;
}
.tp-more {
padding-top: 80px;
padding-bottom: 100px;
}
.tp-setup {
flex-direction: column;
align-items: flex-start;
padding: 24px;
}
.tp-setup-t {
font-size: 19px;
}
.tp-more-h {
margin-top: 80px;
}
.tp-more-t {
font-size: 32px;
}
.rv {
margin-top: 36px;
}
.rv-feat {
border-radius: 20px;
padding: 40px 24px 24px;
}
.rv-mark {
font-size: 88px;
top: 14px;
left: 16px;
}
.rv-feat-q {
font-size: 27px;
}
.rv-c {
padding: 24px;
}
.rv-q {
font-size: 18px;
}
.ab-people {
grid-column-gap: 40px;
grid-row-gap: 40px;
grid-template-rows: auto;
grid-template-columns: 1fr;
}
.ab-tl {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
}
.ab-tl-i, .ab-tl-now {
min-height: 0;
}
.ab-team {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
}
.ab-tm-ini-t {
font-size: 110px;
}
.ab-clock {
padding: 26px 24px;
}
.ab-go {
padding: 22px 18px 22px 22px;
}
.ab-go-t {
font-size: 19px;
}
.ab-dl {
grid-template-rows: auto;
grid-template-columns: 78px minmax(0, 1fr) 78px;
column-gap: 16px;
padding: 22px 18px;
}
.ab-dl-l, .ab-dl-r {
font-size: 14px;
}
.ab-dl-n {
text-align: center;
border-left-width: 0;
grid-column: 1 / -1;
padding-left: 0;
}
.ab-no {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
}
.ab-no-i {
min-height: 150px;
}
.ab-chat-b {
min-height: 0;
}
.ab-q, .ab-a {
max-width: 88%;
}
.ab-deck {
height: 340px;
}
.ab-card {
padding: 28px 26px;
}
.ab-tool, .ab-tool-you {
min-height: 170px;
}
.ap-row {
grid-template-rows: auto;
grid-template-columns: 70px minmax(0, 1fr) 70px;
column-gap: 18px;
padding: 36px 16px;
}
.ap-row-l, .ap-row-r {
font-size: 13px;
}
.ap-res {
padding: 26px 24px;
}
.ap-tl {
min-height: 170px;
}
.ap-dk-st {
height: 360px;
}
.ap-cd {
padding: 28px 26px;
}
.ap-cd-n {
font-size: 60px;
}
.ax-b-pg {
min-height: 340px;
padding: 18px;
}
.ax-q {
padding: 24px 20px 26px;
}
.ax-s-ctl {
padding: 24px 16px 18px;
}
.ax-s-mk {
font-size: 11px;
}
.ax-s-mt {
font-size: 12px;
}
.ax-p {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
}
.aw-row {
grid-template-rows: auto;
grid-template-columns: 64px minmax(0, 1fr) 64px;
column-gap: 14px;
padding: 26px 16px;
}
.aw-l, .aw-r {
font-size: 13px;
}
.aw-card {
padding: 26px 24px;
}
.aw-c-n {
font-size: 64px;
}
.pcs {
grid-column-gap: 28px;
grid-row-gap: 28px;
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
}
.pc-bin {
grid-column-gap: 12px;
grid-row-gap: 12px;
padding: 14px;
}
.pc-m {
font-size: 16px;
}
.ak-cta {
padding: 28px 24px;
}
.st-li {
grid-column-gap: 4px;
grid-row-gap: 4px;
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
}
.st-stage {
min-height: 380px;
}
.st-chip {
padding: 7px 11px;
font-size: 12px;
}
.ff-l {
padding: 26px 22px;
}
.ff-r {
padding: 24px 20px;
}
.cx-row-1 {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
}
.ca-card {
min-height: 520px;
}
.cb-pan {
padding: 24px 20px;
}
.cb-days {
grid-template-rows: auto;
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.cc-form {
padding: 24px 20px;
}
.cd-paper {
padding: 28px 22px;
}
.cd-alt {
grid-template-rows: auto;
grid-template-columns: minmax(0, 1fr);
}
.ce-l {
padding: 26px 22px;
}
.ce-days {
grid-template-rows: auto;
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.ce-r {
padding: 26px 22px;
}
.cs-1 {
border-radius: 22px;
}
.cs-row-1 {
grid-template-rows: auto;
grid-template-columns: 1fr;
}
.pr-more {
grid-column-gap: 16px;
grid-row-gap: 16px;
flex-direction: column;
align-items: flex-start;
margin-top: 32px;
padding: 22px;
}
}