.rw-contact-page {
background: var(--rw-color-white);
padding: clamp(42px, 5vw, 76px) 0 0;
}
.rw-contact-shell {
padding-bottom: clamp(64px, 8vw, 112px);
}
.rw-contact-page .rw-breadcrumbs {
align-items: center;
color: var(--rw-color-muted);
display: flex;
font-size: 0.72rem;
gap: 9px;
margin-bottom: clamp(34px, 4vw, 58px);
}
.rw-contact-page .rw-breadcrumbs a {
color: inherit;
text-decoration: none;
}
.rw-contact-intro {
margin-bottom: clamp(32px, 4vw, 54px);
max-width: 760px;
}
body.rw-site .rw-contact-intro h1 {
font-size: clamp(2.55rem, 4.4vw, 4.75rem);
letter-spacing: -0.045em;
line-height: 0.98;
margin: 0 0 20px;
}
.rw-contact-intro p {
color: var(--rw-color-muted);
font-size: clamp(0.95rem, 1.15vw, 1.08rem);
line-height: 1.75;
margin: 0;
max-width: 720px;
}
.rw-contact-notice {
border: 1px solid var(--rw-color-border);
margin-bottom: 22px;
padding: 16px 18px;
}
.rw-contact-notice--success {
background: #f2f7f1;
border-color: #bfd1bc;
}
.rw-contact-notice--error {
background: #fbf1f0;
border-color: #dfc2bf;
}
.rw-contact-main {
align-items: start;
display: grid;
gap: clamp(22px, 3.2vw, 48px);
grid-template-columns: minmax(0, 1.62fr) minmax(300px, 0.9fr);
}
.rw-contact-form,
.rw-contact-details,
.rw-contact-faq {
border: 1px solid var(--rw-color-border);
}
.rw-contact-form {
padding: clamp(24px, 3.2vw, 48px);
}
body.rw-site .rw-contact-form h2,
body.rw-site .rw-contact-faq h2,
body.rw-site .rw-contact-banner h2 {
font-size: clamp(1.35rem, 2vw, 1.9rem);
letter-spacing: -0.025em;
line-height: 1.12;
margin: 0;
}
.rw-contact-form h2 {
margin-bottom: 30px !important;
}
.rw-contact-form__grid {
display: grid;
gap: 22px 18px;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.rw-contact-field {
min-width: 0;
}
.rw-contact-field--wide {
grid-column: 1 / -1;
}
.rw-contact-field label {
color: var(--rw-color-text);
display: block;
font-size: 0.78rem;
font-weight: 550;
margin-bottom: 9px;
}
.rw-contact-field label span {
color: var(--rw-color-muted);
font-weight: 400;
}
body.rw-site .rw-contact-field input,
body.rw-site .rw-contact-field select,
body.rw-site .rw-contact-field textarea {
background: #fff;
border: 1px solid var(--rw-color-border);
border-radius: 0;
box-shadow: none;
color: var(--rw-color-text);
font: inherit;
margin: 0;
min-height: 50px;
padding: 13px 14px;
width: 100%;
}
body.rw-site .rw-contact-field textarea {
min-height: 170px;
resize: vertical;
}
body.rw-site .rw-contact-field input:focus,
body.rw-site .rw-contact-field select:focus,
body.rw-site .rw-contact-field textarea:focus {
border-color: var(--rw-color-text);
outline: 0;
}
.rw-contact-consent {
align-items: flex-start;
display: flex;
font-size: 0.75rem;
gap: 10px;
line-height: 1.5;
margin: 20px 0;
}
.rw-contact-consent input {
flex: 0 0 auto;
margin: 3px 0 0;
}
.rw-contact-consent a {
text-decoration: underline;
}
body.rw-site .rw-contact-submit {
width: 100%;
}
.rw-contact-honeypot {
height: 0;
left: -9999px;
overflow: hidden;
position: absolute;
width: 0;
}
.rw-contact-details {
display: grid;
gap: 0;
}
.rw-contact-detail {
align-items: flex-start;
color: var(--rw-color-text);
display: grid;
gap: 18px;
grid-template-columns: 34px minmax(0, 1fr);
min-height: 112px;
padding: 26px 28px;
text-decoration: none;
}
.rw-contact-detail + .rw-contact-detail {
border-top: 1px solid var(--rw-color-border);
}
.rw-contact-detail__icon {
display: inline-flex;
height: 32px;
width: 32px;
}
.rw-contact-detail__icon svg {
fill: none;
height: 100%;
stroke: currentColor;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 1.35;
width: 100%;
}
.rw-contact-detail strong,
.rw-contact-detail small {
display: block;
}
.rw-contact-detail strong {
font-size: 0.88rem;
margin-bottom: 8px;
}
.rw-contact-detail small {
color: var(--rw-color-muted);
font-size: 0.82rem;
line-height: 1.65;
}
.rw-contact-detail:hover strong,
.rw-contact-detail:hover small {
color: var(--rw-color-text);
}
.rw-contact-route {
display: inline-block;
font-size: 0.78rem;
margin-top: 10px;
text-decoration: underline;
}
.rw-contact-lower {
display: grid;
gap: clamp(22px, 3vw, 34px);
grid-template-columns: minmax(300px, 0.82fr) minmax(0, 1.45fr);
margin-top: clamp(34px, 4vw, 56px);
}
.rw-contact-faq {
padding: clamp(24px, 3vw, 38px);
}
.rw-contact-faq h2 {
margin-bottom: 22px !important;
}
.rw-contact-faq__list {
border: 1px solid var(--rw-color-border);
}
.rw-contact-faq-item + .rw-contact-faq-item {
border-top: 1px solid var(--rw-color-border);
}
.rw-contact-faq-item summary {
align-items: center;
cursor: pointer;
display: flex;
font-size: 0.81rem;
gap: 16px;
justify-content: space-between;
list-style: none;
padding: 17px 16px;
}
.rw-contact-faq-item summary::-webkit-details-marker {
display: none;
}
.rw-contact-faq-item__plus {
display: inline-flex;
flex: 0 0 18px;
height: 18px;
transition: transform var(--rw-transition);
width: 18px;
}
.rw-contact-faq-item__plus svg {
fill: none;
height: 100%;
stroke: currentColor;
stroke-width: 1.4;
width: 100%;
}
.rw-contact-faq-item[open] .rw-contact-faq-item__plus {
transform: rotate(45deg);
}
.rw-contact-faq-item__answer {
color: var(--rw-color-muted);
font-size: 0.79rem;
line-height: 1.7;
padding: 0 44px 18px 16px;
}
.rw-contact-banner {
background: #eee7df;
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(280px, 0.95fr);
min-height: 100%;
overflow: hidden;
}
.rw-contact-banner__content {
align-items: flex-start;
display: flex;
flex-direction: column;
justify-content: center;
padding: clamp(34px, 4vw, 62px);
}
.rw-contact-banner__content > p {
color: var(--rw-color-muted);
font-size: 0.86rem;
line-height: 1.75;
margin: 16px 0 24px;
max-width: 430px;
}
.rw-contact-banner__instagram {
align-items: center;
color: var(--rw-color-text);
display: inline-flex;
font-size: 0.76rem;
gap: 12px;
line-height: 1.45;
margin-top: 24px;
text-decoration: none;
}
.rw-contact-banner__instagram svg {
fill: none;
height: 30px;
stroke: currentColor;
stroke-width: 1.35;
width: 30px;
}
.rw-contact-banner__instagram strong {
text-decoration: underline;
}
.rw-contact-banner__media {
min-height: 360px;
}
.rw-contact-banner__media img {
display: block;
height: 100% !important;
object-fit: cover;
width: 100%;
}
.rw-contact-page .rw-home-benefits {
margin-top: 0;
}
@media (max-width: 1024px) {
.rw-contact-main,
.rw-contact-lower {
grid-template-columns: 1fr;
}
.rw-contact-details {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.rw-contact-detail + .rw-contact-detail {
border-top: 0;
}
.rw-contact-detail:nth-child(2n) {
border-left: 1px solid var(--rw-color-border);
}
.rw-contact-detail:nth-child(n + 3) {
border-top: 1px solid var(--rw-color-border);
}
.rw-contact-detail--address {
grid-column: 1 / -1;
}
}
@media (max-width: 767px) {
.rw-contact-page {
padding-top: 30px;
}
.rw-contact-page .rw-breadcrumbs {
margin-bottom: 28px;
}
.rw-contact-form__grid,
.rw-contact-details,
.rw-contact-banner {
grid-template-columns: 1fr;
}
.rw-contact-detail:nth-child(2n) {
border-left: 0;
}
.rw-contact-detail + .rw-contact-detail,
.rw-contact-detail:nth-child(n + 3) {
border-top: 1px solid var(--rw-color-border);
}
.rw-contact-banner__media {
aspect-ratio: 4 / 3;
min-height: 0;
order: -1;
}
.rw-contact-banner__content {
padding: 32px 24px 38px;
}
}
@media (max-width: 479px) {
.rw-contact-form,
.rw-contact-faq {
padding: 22px 18px;
}
.rw-contact-detail {
padding: 22px 18px;
}
}