@font-face {
font-family: 'Marcellus';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(//thegardenorganicsalon.com/wp-content/themes/astra-child/assets/fonts/marcellus-400.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Jost';
font-style: normal;
font-weight: 300 600;
font-display: swap;
src: url(//thegardenorganicsalon.com/wp-content/themes/astra-child/assets/fonts/jost-300-600.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root {
--forest: #28301f;
--forest-2: #323c28;
--forest-3: #1d2416;
--olive: #4a5639;
--sage: #a3ad8c;
--sage-soft: #e6e9dc;
--cream: #f7f2e9;
--sand: #efe6d4;
--paper: #fffdf8;
--brass: #c6a26a;
--brass-light: #d8bb88;
--bronze: #7a5a24;
--ink: #1f2619;
--text: #474e40;
--on-dark: #e9e6da;
--on-dark-soft: #c3c8b6;
--serif: 'Marcellus', 'Iowan Old Style', Georgia, serif;
--sans: 'Jost', 'Avenir Next', 'Segoe UI', system-ui, sans-serif;
--wrap: 1240px;
--gutter: clamp(20px, 4.4vw, 48px);
--head: 92px;
--shadow-sm: 0 1px 2px rgba(31, 38, 25, .06), 0 4px 10px rgba(31, 38, 25, .06);
--shadow: 0 2px 4px rgba(31, 38, 25, .06), 0 10px 24px rgba(31, 38, 25, .08), 0 28px 56px rgba(31, 38, 25, .1);
--shadow-dark: 0 2px 6px rgba(0, 0, 0, .18), 0 18px 40px rgba(0, 0, 0, .28);
--ease: cubic-bezier(.22, .61, .36, 1);
}
*,
*::before,
*::after {
box-sizing: border-box;
}
html {
scroll-behavior: smooth;
scroll-padding-top: calc(var(--head) + 12px);
-webkit-text-size-adjust: 100%;
}
body.ax-site {
margin: 0;
background: var(--cream);
color: var(--text);
font-family: var(--sans);
font-size: 1.0625rem;
font-weight: 400;
line-height: 1.7;
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
}
.ax-site :where(img) {
display: block;
max-width: 100%;
height: auto;
}
.ax-site :where(figure) {
margin: 0;
}
.ax-site :where(a) {
color: inherit;
}
.ax-site :where(p) {
margin: 0 0 1.1em;
}
.ax-site :where(h1, h2, h3) {
margin: 0;
font-family: var(--serif);
font-weight: 400;
color: var(--ink);
letter-spacing: -.005em;
text-wrap: balance;
}
.ax-site :where(ul, ol) {
margin: 0;
padding: 0;
list-style: none;
}
.ax-site :where(button) {
font: inherit;
box-shadow: none;
}
.ax-i {
width: 1.15em;
height: 1.15em;
flex: none;
fill: currentColor;
}
.ax-sr {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden;
clip: rect(0 0 0 0);
white-space: nowrap;
}
.ax-break {
overflow-wrap: anywhere;
}
.ax-skip {
position: absolute;
left: 12px;
top: -60px;
z-index: 400;
padding: 10px 16px;
border-radius: 8px;
background: var(--brass);
color: var(--forest);
font-weight: 500;
text-decoration: none;
}
.ax-skip:focus {
top: 12px;
}
.ax-wrap {
width: 100%;
max-width: calc(var(--wrap) + var(--gutter) * 2);
margin: 0 auto;
padding: 0 var(--gutter);
}
.ax-eyebrow {
display: inline-flex;
align-items: center;
gap: 12px;
margin: 0 0 18px;
color: var(--bronze);
font-family: var(--sans);
font-size: .8rem;
font-weight: 500;
letter-spacing: .22em;
line-height: 1.4;
text-transform: uppercase;
}
.ax-h2 {
margin-bottom: 22px !important;
font-size: clamp(2rem, 1.2rem + 2.6vw, 3.1rem);
line-height: 1.12;
}
.ax-btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: .65em;
min-height: 54px;
padding: .85em 1.7em;
border: 1px solid transparent;
border-radius: 999px;
font-family: var(--sans);
font-size: .9rem;
font-weight: 500;
letter-spacing: .12em;
line-height: 1.2;
text-align: center;
text-decoration: none;
text-transform: uppercase;
cursor: pointer;
transition: background-color .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease);
}
.ax-btn .ax-i {
width: 1.05em;
height: 1.05em;
}
.ax-btn--sm {
min-height: 46px;
padding: .7em 1.4em;
font-size: .82rem;
}
.ax-btn--brass {
background: var(--brass);
color: var(--forest);
}
.ax-btn--forest {
background: var(--forest);
color: var(--cream);
}
.ax-btn--line {
border-color: rgba(198, 162, 106, .7);
background: transparent;
color: var(--cream);
}
.ax-btn--line .ax-i {
color: var(--brass);
}
.ax-arrow-link {
display: inline-flex;
align-items: center;
gap: .55em;
color: var(--bronze);
font-size: .88rem;
font-weight: 500;
letter-spacing: .14em;
text-decoration: none;
text-transform: uppercase;
}
.ax-arrow-link .ax-i {
transition: transform .25s var(--ease);
}
.ax-site a:focus-visible,
.ax-site button:focus-visible,
.ax-site summary:focus-visible {
outline: 2px solid var(--brass);
outline-offset: 3px;
}
@media (hover: hover) and (pointer: fine) {
.ax-btn--brass:hover {
background: var(--brass-light);
transform: translateY(-1px);
}
.ax-btn--forest:hover {
background: var(--olive);
transform: translateY(-1px);
}
.ax-btn--line:hover {
border-color: var(--brass);
background: rgba(198, 162, 106, .12);
}
.ax-arrow-link:hover .ax-i {
transform: translateX(4px);
}
}
.ax-arch {
position: relative;
overflow: hidden;
border-radius: 999px 999px 10px 10px;
}
.ax-arch img {
width: 100%;
height: 100%;
object-fit: cover;
}
.ax-ghost {
position: absolute;
z-index: 0;
border: 1px solid var(--brass);
border-radius: 999px 999px 10px 10px;
pointer-events: none;
}
.ax-ring {
position: relative;
border-radius: 50%;
}
.ax-ring img {
width: 100%;
height: 100%;
border-radius: 50%;
object-fit: cover;
}
.ax-ring::before {
content: '';
position: absolute;
inset: -14px;
border: 1.5px dashed var(--brass);
border-radius: 50%;
animation: ax-spin 60s linear infinite;
pointer-events: none;
}
@keyframes ax-spin {
to {
transform: rotate(360deg);
}
}
.ax-util {
background: var(--forest-3);
color: var(--on-dark-soft);
font-size: .84rem;
line-height: 1.3;
}
.ax-util__row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
min-height: 42px;
}
.ax-util p {
display: flex;
align-items: center;
gap: 8px;
margin: 0;
}
.ax-util .ax-i {
width: 1rem;
height: 1rem;
color: var(--brass);
}
.ax-util__meta {
gap: 18px !important;
}
.ax-util__meta a {
display: inline-flex;
align-items: center;
gap: 8px;
color: var(--on-dark);
text-decoration: none;
white-space: nowrap;
}
.ax-util__social {
padding: 4px;
}
.ax-header {
position: sticky;
top: 0;
z-index: 200;
background: var(--forest);
transition: box-shadow .3s var(--ease);
}
.ax-header.is-scrolled {
box-shadow: 0 10px 30px rgba(0, 0, 0, .22);
}
.ax-header__row {
display: flex;
align-items: center;
gap: 28px;
min-height: var(--head);
}
.ax-logo,
.ax-footer__logo {
text-decoration: none;
}
.ax-logo {
flex: none;
display: block;
margin-right: auto;
}
.ax-logo img {
width: auto;
height: 66px;
}
.ax-nav {
display: flex;
align-items: center;
gap: 6px;
}
.ax-nav a {
position: relative;
padding: 10px 14px;
color: var(--on-dark);
font-size: .86rem;
font-weight: 500;
letter-spacing: .16em;
text-decoration: none;
text-transform: uppercase;
transition: color .2s var(--ease);
}
.ax-nav a::after {
content: '';
position: absolute;
left: 14px;
right: 14px;
bottom: 4px;
height: 1px;
background: var(--brass);
transform: scaleX(0);
transform-origin: left;
transition: transform .3s var(--ease);
}
.ax-nav a[aria-current='page'] {
color: var(--brass);
}
@media (hover: hover) and (pointer: fine) {
.ax-nav a:hover {
color: var(--brass-light);
}
.ax-nav a:hover::after {
transform: scaleX(1);
}
}
.ax-header__actions {
display: flex;
align-items: center;
gap: 22px;
margin-left: 10px;
}
.ax-header__phone {
display: inline-flex;
align-items: center;
gap: 10px;
color: var(--on-dark);
font-size: 1rem;
font-weight: 500;
letter-spacing: .02em;
text-decoration: none;
white-space: nowrap;
}
.ax-header__phone .ax-i {
color: var(--brass);
}
.ax-header__call,
.ax-menu-btn {
display: none;
align-items: center;
justify-content: center;
width: 46px;
height: 46px;
padding: 0;
border: 1px solid rgba(198, 162, 106, .55);
border-radius: 50%;
background: transparent;
color: var(--brass);
cursor: pointer;
}
.ax-header__call .ax-i,
.ax-menu-btn .ax-i {
width: 22px;
height: 22px;
}
.ax-menu-btn__close,
.ax-menu-btn[aria-expanded='true'] .ax-menu-btn__open {
display: none;
}
.ax-menu-btn__open,
.ax-menu-btn[aria-expanded='true'] .ax-menu-btn__close {
display: inline-flex;
}
.ax-menu {
position: absolute;
top: 100%;
left: 0;
right: 0;
max-height: calc(100dvh - var(--ax-menu-top, var(--head)));
overflow-y: auto;
overscroll-behavior: contain;
border-top: 1px solid rgba(198, 162, 106, .25);
background: var(--forest);
box-shadow: 0 20px 40px rgba(0, 0, 0, .3);
}
html.ax-menu-open {
scrollbar-gutter: stable;
}
html.ax-menu-open body {
overflow: hidden;
}
.ax-menu[hidden] {
display: none;
}
.ax-menu nav {
display: flex;
flex-direction: column;
padding-top: 10px;
padding-bottom: 26px;
}
.ax-menu nav > a {
padding: 14px 0;
border-bottom: 1px solid rgba(233, 230, 218, .1);
color: var(--cream);
font-family: var(--serif);
font-size: 1.45rem;
text-decoration: none;
}
.ax-menu__buttons {
display: grid;
gap: 12px;
margin-top: 22px;
}
.ax-hero {
position: relative;
overflow: hidden;
padding: clamp(48px, 7vw, 96px) 0 clamp(150px, 15vw, 210px);
background: radial-gradient(ellipse 70% 80% at 78% 30%, #36422b 0%, rgba(54, 66, 43, 0) 70%), var(--forest);
color: var(--on-dark);
}
.ax-hero__sprig {
position: absolute;
left: -120px;
bottom: -60px;
width: min(640px, 70vw);
opacity: .05;
transform: rotate(-12deg);
pointer-events: none;
}
.ax-hero__grid {
position: relative;
z-index: 1;
display: grid;
grid-template-columns: 1.08fr .92fr;
align-items: center;
gap: clamp(40px, 6vw, 88px);
}
.ax-hero .ax-eyebrow {
display: flex;
margin-bottom: 24px;
color: var(--brass);
font-size: .82rem;
line-height: 1.5;
}
.ax-hero__title {
color: var(--cream) !important;
font-size: clamp(2.5rem, 1.3rem + 4vw, 4.5rem);
line-height: 1.06;
}
.ax-hero__sub {
max-width: 33em;
margin: 30px 0 38px !important;
padding-left: 22px;
border-left: 2px solid var(--brass);
color: var(--on-dark-soft);
font-size: 1.12rem;
line-height: 1.7;
}
.ax-hero__ctas {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 18px 30px;
}
.ax-hero__phone {
display: inline-flex;
align-items: center;
gap: 14px;
color: var(--cream);
font-size: 1.25rem;
font-weight: 500;
text-decoration: none;
}
.ax-hero__phone small {
display: block;
color: var(--on-dark-soft);
font-size: .72rem;
font-weight: 500;
letter-spacing: .18em;
line-height: 1.3;
text-transform: uppercase;
}
.ax-hero__phone-ic {
display: inline-flex;
align-items: center;
justify-content: center;
width: 52px;
height: 52px;
border: 1px solid rgba(198, 162, 106, .6);
border-radius: 50%;
color: var(--brass);
}
.ax-hero__art {
position: relative;
justify-self: end;
width: min(100%, 470px);
padding: 0 0 40px 40px;
}
.ax-hero__art .ax-ghost {
top: -26px;
right: -26px;
width: calc(100% - 40px);
height: calc(100% - 40px);
}
.ax-hero__main {
z-index: 1;
aspect-ratio: 720 / 940;
box-shadow: var(--shadow-dark);
}
.ax-hero__round {
position: absolute;
z-index: 2;
left: 0;
bottom: 0;
width: 42%;
aspect-ratio: 1;
border: 6px solid var(--forest);
box-shadow: var(--shadow-dark);
}
.ax-curve {
position: absolute;
left: 0;
right: 0;
bottom: -1px;
z-index: 1;
width: 100%;
height: clamp(56px, 8vw, 116px);
overflow: visible;
}
.ax-curve__fill {
fill: var(--cream);
}
.ax-curve__line {
fill: none;
stroke: var(--brass);
stroke-width: 1.5;
vector-effect: non-scaling-stroke;
opacity: .8;
}
.ax-strip {
position: relative;
z-index: 3;
margin-top: calc(clamp(56px, 8vw, 116px) * -1 - 24px);
}
.ax-strip__list {
display: grid;
grid-template-columns: repeat(3, 1fr);
border-radius: 22px;
background: var(--paper);
box-shadow: var(--shadow);
}
.ax-strip__list li {
display: flex;
align-items: flex-start;
gap: 18px;
padding: 30px 32px;
color: var(--text);
font-size: .97rem;
line-height: 1.6;
}
.ax-strip__list li + li {
box-shadow: inset 1px 0 0 var(--sand);
}
.ax-strip__list strong {
display: block;
margin-bottom: 4px;
color: var(--ink);
font-family: var(--serif);
font-size: 1.25rem;
font-weight: 400;
line-height: 1.3;
}
.ax-badge {
display: inline-flex;
align-items: center;
justify-content: center;
flex: none;
width: 54px;
height: 54px;
border-radius: 50%;
background: var(--forest);
color: var(--brass);
}
.ax-badge .ax-i {
width: 24px;
height: 24px;
}
.ax-story {
padding: clamp(80px, 10vw, 140px) 0;
}
.ax-story__grid {
display: grid;
grid-template-columns: .95fr 1.05fr;
align-items: center;
gap: clamp(48px, 7vw, 110px);
}
.ax-story__art {
position: relative;
width: min(100%, 520px);
padding: 0 90px 70px 0;
}
.ax-story__art .ax-ghost--left {
top: 30px;
left: -28px;
width: calc(100% - 90px);
height: calc(100% - 70px);
}
.ax-story__main {
z-index: 1;
aspect-ratio: 640 / 820;
box-shadow: var(--shadow);
}
.ax-story__inset {
position: absolute;
z-index: 2;
right: 0;
bottom: 0;
width: 58%;
aspect-ratio: 460 / 330;
overflow: hidden;
border: 3px solid var(--cream);
border-radius: 18px;
box-shadow: var(--shadow);
}
.ax-story__inset img {
width: 100%;
height: 100%;
object-fit: cover;
}
.ax-story__badge {
position: absolute;
z-index: 3;
top: 38px;
right: 44px;
width: 104px;
height: 104px;
border: 6px solid var(--cream);
border-radius: 50%;
box-shadow: var(--shadow);
}
.ax-story__text {
max-width: 36em;
}
.ax-story__text .ax-arrow-link {
margin-top: 10px;
}
.ax-services {
position: relative;
overflow: hidden;
padding: clamp(80px, 10vw, 140px) 0 clamp(90px, 11vw, 160px);
background: var(--forest);
color: var(--on-dark-soft);
}
.ax-services__sprig {
position: absolute;
right: -160px;
top: -80px;
width: min(720px, 80vw);
opacity: .045;
transform: rotate(18deg) scaleX(-1);
pointer-events: none;
}
.ax-services .ax-wrap {
position: relative;
z-index: 1;
}
.ax-services .ax-eyebrow {
color: var(--brass);
}
.ax-services .ax-h2,
.ax-services h3 {
color: var(--cream);
}
.ax-services__head {
display: grid;
grid-template-columns: 1.1fr .9fr;
align-items: end;
gap: 24px 64px;
margin-bottom: 56px;
}
.ax-services__head .ax-h2 {
margin-bottom: 0 !important;
}
.ax-services__head > p {
margin: 0 0 6px;
font-size: 1.05rem;
}
.ax-consult {
display: grid;
grid-template-columns: 1.05fr 1fr;
overflow: hidden;
border-radius: 24px;
background: var(--forest-2);
box-shadow: var(--shadow-dark);
}
.ax-consult__img {
position: relative;
min-height: 100%;
}
.ax-consult__img img {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
.ax-consult__body {
padding: clamp(32px, 4.4vw, 60px);
}
.ax-consult__label {
margin-bottom: 10px !important;
color: var(--brass);
font-size: .78rem;
font-weight: 500;
letter-spacing: .2em;
text-transform: uppercase;
}
.ax-consult h3 {
margin-bottom: 18px;
font-size: clamp(1.8rem, 1.3rem + 1.4vw, 2.4rem);
line-height: 1.15;
}
.ax-consult .ax-btn {
margin-top: 10px;
}
.ax-svc-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 40px 28px;
margin-top: 72px;
}
.ax-svc {
display: flex;
flex-direction: column;
}
.ax-svc__img {
aspect-ratio: 4 / 5;
margin-bottom: 26px;
box-shadow: var(--shadow-dark);
}
.ax-svc__img img {
transition: transform .6s var(--ease);
}
.ax-svc h3 {
margin-bottom: 12px;
font-size: 1.55rem;
line-height: 1.2;
}
.ax-svc > p {
font-size: .98rem;
line-height: 1.65;
}
.ax-svc__list {
display: grid;
gap: 6px;
margin: 4px 0 24px !important;
padding: 18px 0 0 !important;
border-top: 1px solid rgba(198, 162, 106, .28);
color: var(--on-dark);
font-size: .9rem;
line-height: 1.45;
}
.ax-svc__list li {
position: relative;
padding-left: 18px;
}
.ax-svc__list li::before {
content: '';
position: absolute;
left: 0;
top: .58em;
width: 6px;
height: 6px;
border-radius: 50%;
background: var(--brass);
}
.ax-svc .ax-arrow-link {
margin-top: auto;
color: var(--brass);
}
@media (hover: hover) and (pointer: fine) {
.ax-svc:hover .ax-svc__img img {
transform: scale(1.04);
}
}
.ax-spa {
overflow: hidden;
padding: clamp(80px, 10vw, 140px) 0;
background: var(--sand);
}
.ax-spa__grid {
display: grid;
grid-template-columns: 1fr 1.05fr;
align-items: center;
gap: clamp(48px, 7vw, 100px);
}
.ax-spa__text {
max-width: 34em;
}
.ax-spa__listhead {
margin: 30px 0 6px !important;
color: var(--bronze);
font-size: .8rem;
font-weight: 500;
letter-spacing: .2em;
text-transform: uppercase;
}
.ax-spa__list {
margin: 0 0 28px !important;
}
.ax-spa__list li {
display: flex;
align-items: center;
gap: 16px;
padding: 16px 0;
border-bottom: 1px solid rgba(122, 90, 36, .22);
color: var(--ink);
font-family: var(--serif);
font-size: 1.4rem;
line-height: 1.3;
}
.ax-spa__list li::before {
content: '';
flex: none;
width: 18px;
height: 22px;
background: url(//thegardenorganicsalon.com/wp-content/themes/astra-child/assets/img/sprig-brass.png) center / contain no-repeat;
}
.ax-spa__text .ax-btn {
margin-top: 8px;
}
.ax-spa__art {
position: relative;
width: min(100%, 560px);
justify-self: end;
padding: 20px 0 110px 70px;
}
.ax-spa__main {
z-index: 1;
aspect-ratio: 1;
box-shadow: var(--shadow);
}
.ax-spa__a,
.ax-spa__b {
position: absolute;
z-index: 2;
overflow: hidden;
border: 3px solid var(--sand);
border-radius: 18px;
box-shadow: var(--shadow);
}
.ax-spa__a img,
.ax-spa__b img {
width: 100%;
height: 100%;
object-fit: cover;
}
.ax-spa__a {
left: 0;
bottom: 30px;
width: 38%;
aspect-ratio: 1;
}
.ax-spa__b {
right: -10px;
bottom: 0;
width: 46%;
aspect-ratio: 4 / 3;
}
.ax-spa__sprig {
position: absolute;
top: 0;
left: 10px;
width: 74px;
height: auto;
opacity: .9;
transform: rotate(-18deg);
}
.ax-products {
padding: clamp(80px, 10vw, 140px) 0;
background: var(--sage-soft);
}
.ax-products__head {
max-width: 680px;
margin: 0 auto 56px;
text-align: center;
}
.ax-products__head .ax-eyebrow {
justify-content: center;
}
.ax-products__head > p:last-child {
margin: 0;
font-size: 1.05rem;
}
.ax-prod-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 30px;
}
.ax-prod {
overflow: hidden;
border-radius: 20px;
background: var(--paper);
box-shadow: var(--shadow-sm);
transition: transform .35s var(--ease), box-shadow .35s var(--ease);
}
.ax-prod__img {
aspect-ratio: 64 / 46;
overflow: hidden;
}
.ax-prod__img img {
width: 100%;
height: 100%;
object-fit: cover;
}
.ax-prod__body {
padding: 28px 30px 32px;
}
.ax-prod__kind {
margin-bottom: 6px !important;
color: var(--bronze);
font-size: .76rem;
font-weight: 500;
letter-spacing: .2em;
text-transform: uppercase;
}
.ax-prod h3 {
margin-bottom: 12px;
font-size: 1.7rem;
line-height: 1.2;
}
.ax-prod__body > p:last-child {
margin: 0;
font-size: .98rem;
line-height: 1.65;
}
@media (hover: hover) and (pointer: fine) {
.ax-prod:hover {
transform: translateY(-4px);
box-shadow: var(--shadow);
}
}
.ax-steps {
padding: clamp(80px, 10vw, 140px) 0;
}
.ax-steps__grid {
display: grid;
grid-template-columns: .9fr 1.1fr;
align-items: center;
gap: clamp(48px, 7vw, 110px);
}
.ax-steps__art {
position: relative;
width: min(100%, 480px);
padding: 30px 30px 0 0;
}
.ax-steps__art .ax-ghost {
top: 0;
right: 0;
width: calc(100% - 30px);
height: calc(100% - 30px);
}
.ax-steps__main {
z-index: 1;
aspect-ratio: 600 / 760;
box-shadow: var(--shadow);
}
.ax-steps__list {
margin: 12px 0 34px !important;
}
.ax-steps__list li {
position: relative;
display: flex;
gap: 24px;
padding-bottom: 30px;
}
.ax-steps__list li:last-child {
padding-bottom: 0;
}
.ax-steps__list li:not(:last-child)::before {
content: '';
position: absolute;
left: 27px;
top: 60px;
bottom: 6px;
border-left: 1.5px dashed rgba(122, 90, 36, .45);
}
.ax-steps__num {
display: inline-flex;
align-items: center;
justify-content: center;
flex: none;
width: 56px;
height: 56px;
border: 1px solid var(--brass);
border-radius: 50%;
background: var(--paper);
color: var(--bronze);
font-family: var(--serif);
font-size: 1.5rem;
line-height: 1;
}
.ax-steps__list h3 {
margin: 10px 0 8px;
font-size: 1.45rem;
line-height: 1.25;
}
.ax-steps__list p {
margin: 0;
}
.ax-steps__list a,
.ax-faq a {
color: var(--bronze);
font-weight: 500;
text-decoration: none;
white-space: nowrap;
}
.ax-faq {
padding: clamp(80px, 10vw, 140px) 0;
background: var(--sand);
}
.ax-faq__grid {
display: grid;
grid-template-columns: .85fr 1.15fr;
align-items: start;
gap: clamp(40px, 6vw, 96px);
}
.ax-faq__side {
position: sticky;
top: calc(var(--head) + 30px);
}
.ax-faq__img {
margin-top: 34px;
overflow: hidden;
border-radius: 20px;
box-shadow: var(--shadow);
}
.ax-faq__list {
display: grid;
gap: 14px;
}
.ax-qa {
border-radius: 18px;
background: var(--paper);
box-shadow: var(--shadow-sm);
}
.ax-qa summary {
position: relative;
display: block;
padding: 24px 76px 24px 28px;
color: var(--ink);
font-family: var(--serif);
font-size: 1.25rem;
line-height: 1.35;
cursor: pointer;
list-style: none;
}
.ax-qa summary::-webkit-details-marker {
display: none;
}
.ax-qa__icon {
position: absolute;
right: 24px;
top: 50%;
width: 34px;
height: 34px;
margin-top: -17px;
border: 1px solid var(--brass);
border-radius: 50%;
transition: background-color .25s var(--ease), transform .3s var(--ease);
}
.ax-qa__icon::before,
.ax-qa__icon::after {
content: '';
position: absolute;
left: 50%;
top: 50%;
width: 12px;
height: 1.5px;
margin: -.75px 0 0 -6px;
background: var(--bronze);
}
.ax-qa__icon::after {
transform: rotate(90deg);
transition: transform .3s var(--ease);
}
.ax-qa[open] .ax-qa__icon {
background: var(--brass);
transform: rotate(180deg);
}
.ax-qa[open] .ax-qa__icon::after {
transform: rotate(0deg);
}
.ax-qa__a {
padding: 0 28px 24px;
}
.ax-qa__a p {
margin: 0;
}
.ax-visit {
padding: clamp(110px, 12vw, 170px) 0 clamp(80px, 10vw, 130px);
}
.ax-visit__panel {
position: relative;
display: grid;
grid-template-columns: 1.25fr .75fr;
align-items: end;
gap: clamp(32px, 5vw, 72px);
padding: clamp(40px, 5.5vw, 76px);
border-radius: 30px;
background: radial-gradient(ellipse 60% 90% at 0% 100%, #36422b 0%, rgba(54, 66, 43, 0) 70%), var(--forest);
color: var(--on-dark-soft);
box-shadow: var(--shadow);
}
.ax-visit__bg {
position: absolute;
inset: 0;
overflow: hidden;
border-radius: inherit;
pointer-events: none;
}
.ax-visit__sprig {
position: absolute;
left: 30%;
bottom: -120px;
width: 520px;
opacity: .045;
transform: rotate(-24deg);
pointer-events: none;
}
.ax-visit__text {
position: relative;
z-index: 1;
}
.ax-visit .ax-eyebrow {
color: var(--brass);
}
.ax-visit .ax-h2 {
color: var(--cream);
}
.ax-visit__text > p {
max-width: 34em;
font-size: 1.08rem;
}
.ax-visit__ctas {
display: flex;
flex-wrap: wrap;
gap: 14px;
margin: 30px 0 38px;
}
.ax-visit__contact {
display: grid;
grid-template-columns: repeat(2, auto);
justify-content: start;
gap: 18px 36px;
padding-top: 30px !important;
border-top: 1px solid rgba(198, 162, 106, .25);
}
.ax-visit__contact li {
display: flex;
align-items: center;
gap: 14px;
min-width: 0;
}
.ax-visit__contact small {
display: block;
color: var(--on-dark-soft);
font-size: .72rem;
font-weight: 500;
letter-spacing: .18em;
line-height: 1.4;
text-transform: uppercase;
}
.ax-visit__contact a {
color: var(--cream);
font-weight: 500;
text-decoration: none;
}
.ax-visit__ic {
display: inline-flex;
align-items: center;
justify-content: center;
flex: none;
width: 46px;
height: 46px;
border: 1px solid rgba(198, 162, 106, .55);
border-radius: 50%;
color: var(--brass);
}
.ax-visit__ic .ax-i {
width: 20px;
height: 20px;
}
.ax-visit__img {
z-index: 1;
align-self: stretch;
width: 100%;
min-height: 440px;
margin-top: calc(clamp(40px, 5.5vw, 76px) * -1 - 70px);
box-shadow: var(--shadow-dark);
}
.ax-footer {
position: relative;
overflow: hidden;
padding: clamp(64px, 8vw, 96px) 0 0;
background: var(--forest-3);
color: var(--on-dark-soft);
font-size: .95rem;
}
.ax-footer__sprig {
position: absolute;
right: -100px;
bottom: -80px;
width: 520px;
opacity: .04;
transform: rotate(-10deg);
pointer-events: none;
}
.ax-footer__grid {
position: relative;
z-index: 1;
display: grid;
grid-template-columns: 1.45fr .8fr 1.1fr 1.2fr;
gap: 40px;
}
.ax-footer__logo img {
width: auto;
height: 62px;
}
.ax-footer__tag {
max-width: 23em;
margin: 22px 0 24px !important;
line-height: 1.65;
}
.ax-footer__head {
margin-bottom: 18px !important;
color: var(--brass);
font-family: var(--serif);
font-size: 1.2rem;
}
.ax-footer__list {
display: grid;
gap: 12px;
}
.ax-footer__list a,
.ax-footer__list span {
display: inline-flex;
align-items: flex-start;
gap: 10px;
color: var(--on-dark);
line-height: 1.5;
text-decoration: none;
}
.ax-footer__list span span {
display: block;
}
.ax-footer__list .ax-i {
width: 18px;
height: 18px;
margin-top: 3px;
color: var(--brass);
}
@media (hover: hover) and (pointer: fine) {
.ax-footer__list a:hover,
.ax-footer__base a:hover,
.ax-util__meta a:hover {
color: var(--brass-light);
}
}
.ax-footer__base {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
gap: 10px 24px;
margin-top: 64px;
padding: 26px 0 30px;
border-top: 1px solid rgba(233, 230, 218, .1);
font-size: .86rem;
}
.ax-footer__base a {
color: var(--on-dark);
text-decoration: underline;
text-decoration-color: rgba(233, 230, 218, .45);
text-underline-offset: 3px;
}
.ax-actionbar {
position: fixed;
right: 22px;
bottom: 22px;
z-index: 250;
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 12px;
}
.ax-actionbar a {
display: flex;
align-items: center;
flex-direction: row-reverse;
overflow: hidden;
width: 56px;
height: 56px;
border-radius: 999px;
color: var(--forest);
text-decoration: none;
box-shadow: 0 6px 18px rgba(0, 0, 0, .22);
transition: width .3s var(--ease), background-color .25s var(--ease);
}
.ax-actionbar .is-book {
background: var(--brass);
}
.ax-actionbar .is-call {
border: 1px solid rgba(198, 162, 106, .6);
background: var(--forest);
color: var(--brass);
}
.ax-actionbar .ax-i {
flex: none;
width: 54px;
height: 22px;
}
.ax-actionbar span {
font-size: .82rem;
font-weight: 500;
letter-spacing: .14em;
text-transform: uppercase;
white-space: nowrap;
opacity: 0;
transition: opacity .2s var(--ease);
}
@media (min-width: 1025px) and (hover: hover) {
.ax-actionbar a:hover {
width: max-content;
}
.ax-actionbar a:hover span {
padding-inline-start: 1.2rem;
opacity: 1;
}
}
@media (min-width: 1025px) {
.ax-actionbar a:focus-visible {
width: max-content;
}
.ax-actionbar a:focus-visible span {
padding-inline-start: 1.2rem;
opacity: 1;
}
}
.ax-totop {
position: fixed;
left: 22px;
bottom: 22px;
z-index: 250;
display: inline-flex;
align-items: center;
justify-content: center;
width: 50px;
height: 50px;
padding: 0;
border: 1px solid rgba(198, 162, 106, .6);
border-radius: 50%;
background: var(--forest);
color: var(--brass);
cursor: pointer;
opacity: 0;
visibility: hidden;
transform: translateY(10px);
transition: opacity .3s var(--ease), transform .3s var(--ease), visibility .3s;
}
.ax-totop.is-visible {
opacity: 1;
visibility: visible;
transform: none;
}
.ax-totop .ax-i {
width: 20px;
height: 20px;
}
.ax-js [data-ax-reveal] > * {
opacity: 0;
translate: 0 24px;
transition: opacity .8s var(--ease), translate .8s var(--ease);
}
.ax-js [data-ax-reveal].is-in > * {
opacity: 1;
translate: 0 0;
}
@media (min-width: 1101px) {
.ax-svc-grid {
padding-bottom: 56px;
}
.ax-svc:nth-child(even) {
transform: translateY(56px);
}
}
@media (max-width: 1180px) {
.ax-nav,
.ax-header__phone {
display: none;
}
.ax-menu-btn {
display: inline-flex;
}
.ax-header__row {
gap: 14px;
}
}
@media (max-width: 1100px) {
.ax-svc-grid {
grid-template-columns: repeat(2, 1fr);
gap: 56px 32px;
}
.ax-footer__grid {
grid-template-columns: 1fr 1fr;
}
.ax-visit__contact {
grid-template-columns: minmax(0, 1fr);
}
}
@media (max-width: 1024px) {
.ax-actionbar {
flex-direction: row;
right: 16px;
bottom: 16px;
gap: 0;
padding: 5px;
border-radius: 999px;
background: var(--forest-3);
box-shadow: 0 8px 24px rgba(0, 0, 0, .3);
}
.ax-actionbar a {
flex-direction: row;
width: auto;
height: 46px;
padding: 0 18px 0 14px;
gap: 8px;
box-shadow: none;
}
.ax-actionbar .is-call {
border: 0;
background: transparent;
}
.ax-actionbar .ax-i {
width: 20px;
height: 20px;
}
.ax-actionbar span {
opacity: 1;
}
.ax-totop {
left: 16px;
bottom: 21px;
width: 46px;
height: 46px;
}
.ax-footer__base {
padding-bottom: 96px;
}
}
@media (max-width: 960px) {
.ax-hero__grid,
.ax-story__grid,
.ax-spa__grid,
.ax-steps__grid,
.ax-faq__grid {
grid-template-columns: minmax(0, 1fr);
}
.ax-hero__text {
max-width: 640px;
}
.ax-hero__art {
justify-self: center;
width: min(100%, 420px);
}
.ax-strip__list {
grid-template-columns: minmax(0, 1fr);
}
.ax-strip__list li + li {
box-shadow: inset 0 1px 0 var(--sand);
}
.ax-story__art,
.ax-steps__art {
justify-self: center;
}
.ax-steps__art {
order: 2;
}
.ax-spa__art {
justify-self: center;
}
.ax-services__head {
grid-template-columns: minmax(0, 1fr);
}
.ax-consult {
grid-template-columns: minmax(0, 1fr);
}
.ax-consult__img {
aspect-ratio: 880 / 560;
}
.ax-faq__side {
position: static;
}
.ax-faq__img {
display: none;
}
.ax-visit {
padding-top: clamp(70px, 10vw, 110px);
}
.ax-visit__panel {
grid-template-columns: minmax(0, 1fr);
}
.ax-visit__img {
order: -1;
align-self: start;
min-height: 0;
aspect-ratio: 600 / 760;
width: min(100%, 360px);
margin: calc(clamp(40px, 5.5vw, 76px) * -1 - 50px) auto 0;
}
.ax-prod-grid {
grid-template-columns: minmax(0, 1fr);
max-width: 560px;
margin: 0 auto;
}
}
@media (max-width: 720px) {
:root {
--head: 76px;
}
body.ax-site {
font-size: 1rem;
}
.ax-logo img {
height: 52px;
}
.ax-header__actions {
display: none;
}
.ax-header__call {
display: inline-flex;
}
.ax-util {
font-size: .78rem;
}
.ax-util__row {
min-height: 38px;
}
.ax-util__note .ax-i,
.ax-util__social {
display: none !important;
}
.ax-util__meta .ax-i {
display: none;
}
.ax-hero__ctas {
flex-direction: column;
align-items: stretch;
}
.ax-hero__ctas .ax-btn {
width: 100%;
}
.ax-hero__phone {
justify-content: center;
}
.ax-hero__sub {
font-size: 1.04rem;
}
.ax-strip__list li {
padding: 24px 22px;
}
.ax-svc-grid {
grid-template-columns: minmax(0, 1fr);
max-width: 440px;
margin-left: auto;
margin-right: auto;
}
.ax-story__art {
padding: 0 56px 52px 0;
}
.ax-story__art .ax-ghost--left {
left: -14px;
width: calc(100% - 56px);
height: calc(100% - 52px);
}
.ax-story__badge {
top: 22px;
right: 22px;
width: 78px;
height: 78px;
border-width: 4px;
}
.ax-spa__art {
padding: 16px 0 90px 34px;
}
.ax-spa__sprig {
width: 52px;
}
.ax-spa__list li {
font-size: 1.22rem;
}
.ax-qa summary {
padding: 20px 66px 20px 22px;
font-size: 1.12rem;
}
.ax-qa__icon {
right: 18px;
}
.ax-qa__a {
padding: 0 22px 22px;
}
.ax-visit__ctas .ax-btn {
width: 100%;
}
.ax-footer__grid {
grid-template-columns: minmax(0, 1fr);
gap: 0;
text-align: center;
}
.ax-footer__brand {
display: flex;
flex-direction: column;
align-items: center;
padding-bottom: 34px;
}
.ax-footer__tag {
margin: 20px auto 24px !important;
}
.ax-footer__logo img {
height: 58px;
margin: 0 auto;
}
.ax-footer__col {
padding: 30px 0;
border-top: 1px solid rgba(198, 162, 106, .2);
}
.ax-footer__head {
margin-bottom: 14px !important;
}
.ax-footer__list {
justify-items: center;
gap: 10px;
}
.ax-footer__col--explore .ax-footer__list {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 4px 0;
}
.ax-footer__col--explore .ax-footer__list li + li::before {
content: '';
display: inline-block;
width: 4px;
height: 4px;
margin: 0 14px;
border-radius: 50%;
background: var(--brass);
vertical-align: middle;
}
.ax-footer__addr > span {
flex-direction: column;
align-items: center;
gap: 8px;
}
.ax-footer__addr .ax-i {
margin-top: 0;
}
.ax-footer__addr span span {
text-align: center;
}
.ax-footer__dir {
align-items: center !important;
margin-top: 6px;
padding: 8px 18px;
border: 1px solid rgba(198, 162, 106, .55);
border-radius: 999px;
font-size: .9rem;
}
.ax-footer__dir .ax-i {
margin-top: 0;
}
.ax-footer__col--contact .ax-footer__list a {
align-items: center;
}
.ax-footer__col--contact .ax-i {
margin-top: 0;
}
.ax-footer__base {
flex-direction: column;
align-items: center;
margin-top: 0;
text-align: center;
}
}
@media (max-width: 380px) {
.ax-util {
font-size: 11px;
}
.ax-util__meta {
gap: 10px !important;
}
.ax-logo img {
height: 46px;
}
.ax-hero .ax-eyebrow {
font-size: .72rem;
letter-spacing: .16em;
}
}
@media (prefers-reduced-motion: reduce) {
html {
scroll-behavior: auto;
}
.ax-ring::before {
animation: none;
}
.ax-js [data-ax-reveal] > *,
.ax-js [data-ax-reveal].is-in > * {
opacity: 1;
translate: none;
transition: none;
}
.ax-site *,
.ax-site *::before,
.ax-site *::after {
transition-duration: .01ms !important;
}
}
.ax-visit__email {
white-space: nowrap;
}
@media (max-width: 720px) {
.ax-visit__email {
white-space: normal;
overflow-wrap: anywhere;
}
}
@media (max-width: 720px) {
.ax-visit__panel {
padding: 34px 22px 30px;
border-radius: 24px;
}
.ax-visit__img {
margin-top: -84px;
}
.ax-visit__ctas .ax-btn,
.ax-hero__ctas .ax-btn {
padding-left: 1.2em;
padding-right: 1.2em;
letter-spacing: .1em;
}
}
@media (min-width: 1025px) {
.ax-footer__base {
padding-inline: max(0px, calc(96px - max(var(--gutter), (100vw - var(--wrap)) / 2)));
}
}
@media (max-width: 720px) {
.ax-hero__text,
.ax-story__text,
.ax-services__head,
.ax-consult__body,
.ax-svc,
.ax-spa__text,
.ax-prod__body,
.ax-steps__text,
.ax-faq__side,
.ax-visit__text {
text-align: center;
}
.ax-eyebrow,
.ax-hero .ax-eyebrow {
justify-content: center;
}
.ax-story__text,
.ax-spa__text {
margin-left: auto;
margin-right: auto;
}
.ax-hero__sub {
margin-left: auto !important;
margin-right: auto !important;
padding-left: 0;
border-left: 0;
}
.ax-hero__phone {
text-align: left;
}
.ax-strip__list li {
flex-direction: column;
align-items: center;
gap: 12px;
text-align: center;
}
.ax-svc {
align-items: center;
}
.ax-svc__img {
width: 100%;
}
.ax-svc__list {
justify-items: center;
width: 100%;
}
.ax-svc__list li {
padding-left: 0;
}
.ax-svc__list li::before {
position: static;
display: inline-block;
margin: 0 10px 0 0;
vertical-align: middle;
}
.ax-spa__list li {
justify-content: center;
}
.ax-steps__list li {
flex-direction: column;
align-items: center;
gap: 6px;
text-align: center;
}
.ax-steps__list li:not(:last-child)::before {
display: none;
}
.ax-steps__list h3 {
margin-top: 6px;
}
.ax-qa summary {
padding-left: 66px;
text-align: center;
}
.ax-qa__a {
text-align: center;
}
.ax-visit__ctas {
justify-content: center;
}
.ax-visit__contact {
justify-items: center;
}
.ax-visit__contact li {
flex-direction: column;
gap: 8px;
text-align: center;
}
}
.ax-hero--page {
padding: clamp(40px, 6vw, 84px) 0 clamp(110px, 12vw, 170px);
}
.ax-hero--page .ax-hero__grid {
grid-template-columns: 1.15fr .85fr;
}
.ax-hero--page .ax-hero__title {
font-size: clamp(2.3rem, 1.3rem + 3.2vw, 3.9rem);
line-height: 1.08;
}
.ax-hero--page .ax-hero__ctas {
margin-top: 36px;
}
.ax-hero--page .ax-hero__art {
width: min(100%, 400px);
padding: 0;
}
.ax-hero--page .ax-hero__art .ax-ghost {
width: 100%;
height: 100%;
}
.ax-hero--band {
padding: clamp(56px, 7vw, 96px) 0 clamp(110px, 12vw, 160px);
}
.ax-band__inner {
position: relative;
z-index: 1;
}
.ax-band__meta {
margin: 14px 0 0 !important;
color: var(--on-dark-soft);
font-size: 1rem;
letter-spacing: .02em;
}
.ax-row {
padding: clamp(72px, 9vw, 120px) 0;
}
.ax-row--alt {
background: var(--sand);
}
.ax-row__grid {
display: grid;
grid-template-columns: .85fr 1.15fr;
align-items: center;
gap: clamp(44px, 7vw, 100px);
}
.ax-row--alt .ax-row__grid {
grid-template-columns: 1.15fr .85fr;
}
.ax-row__art {
position: relative;
width: min(100%, 440px);
padding: 26px 26px 0 0;
}
.ax-row--alt .ax-row__art {
order: 2;
justify-self: end;
padding: 26px 0 0 26px;
}
.ax-row__art .ax-ghost {
top: 0;
right: 0;
width: calc(100% - 26px);
height: calc(100% - 26px);
}
.ax-row--alt .ax-row__art .ax-ghost {
right: auto;
left: 0;
}
.ax-row__img {
z-index: 1;
aspect-ratio: 600 / 760;
box-shadow: var(--shadow);
}
.ax-row__text {
max-width: 37em;
}
.ax-row__num {
margin: 0 0 10px !important;
color: var(--brass);
font-family: var(--serif);
font-size: clamp(2.4rem, 1.8rem + 2vw, 3.4rem);
line-height: 1;
}
.ax-row__list {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 8px 24px;
margin: 6px 0 28px !important;
padding: 20px 0 0 !important;
border-top: 1px solid rgba(122, 90, 36, .22);
color: var(--ink);
font-size: .96rem;
line-height: 1.45;
}
.ax-row__list li {
position: relative;
padding-left: 18px;
}
.ax-row__list li::before {
content: '';
position: absolute;
left: 0;
top: .55em;
width: 6px;
height: 6px;
border-radius: 50%;
background: var(--brass);
}
.ax-row__text .ax-btn {
margin-top: 8px;
}
.ax-faq--page {
background: var(--cream);
}
.ax-brand {
padding: clamp(72px, 9vw, 120px) 0;
}
.ax-brand--alt {
background: var(--sage-soft);
}
.ax-brand__grid {
display: grid;
grid-template-columns: 1fr 1fr;
align-items: center;
gap: clamp(44px, 6vw, 90px);
}
.ax-brand--alt .ax-brand__art {
order: 2;
}
.ax-brand__art {
position: relative;
padding: 0 64px 64px 0;
}
.ax-brand__img {
overflow: hidden;
aspect-ratio: 4 / 3;
border-radius: 22px;
box-shadow: var(--shadow);
}
.ax-brand__img img,
.ax-brand__inset img {
width: 100%;
height: 100%;
object-fit: cover;
}
.ax-brand__inset {
position: absolute;
right: 0;
bottom: 0;
width: 44%;
aspect-ratio: 420 / 320;
overflow: hidden;
border: 3px solid var(--cream);
border-radius: 16px;
box-shadow: var(--shadow);
}
.ax-brand--alt .ax-brand__inset {
border-color: var(--sage-soft);
}
.ax-brand__text .ax-h2 {
font-size: clamp(1.9rem, 1.3rem + 1.8vw, 2.7rem);
}
.ax-brand__lead {
color: var(--ink);
font-size: 1.16rem;
line-height: 1.6;
}
.ax-brand__qa {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 24px;
margin-top: clamp(44px, 5vw, 64px);
}
.ax-mini-qa {
position: relative;
padding: 28px 30px 30px 88px;
border-radius: 20px;
background: var(--paper);
box-shadow: var(--shadow-sm);
}
.ax-mini-qa__num {
position: absolute;
left: 28px;
top: 26px;
display: inline-flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
border: 1px solid var(--brass);
border-radius: 50%;
color: var(--bronze);
font-family: var(--serif);
font-size: 1.15rem;
line-height: 1;
}
.ax-mini-qa h3 {
margin: 4px 0 10px !important;
font-size: 1.25rem;
line-height: 1.35;
}
.ax-mini-qa p {
margin: 0;
font-size: .98rem;
line-height: 1.65;
}
.ax-cta {
padding: clamp(72px, 9vw, 120px) 0;
}
.ax-cta--tight {
padding-top: clamp(24px, 3vw, 40px);
}
.ax-cta__panel {
position: relative;
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: center;
gap: 28px 48px;
padding: clamp(36px, 5vw, 64px);
border-radius: 28px;
background: radial-gradient(ellipse 60% 90% at 0% 100%, #36422b 0%, rgba(54, 66, 43, 0) 70%), var(--forest);
color: var(--on-dark-soft);
box-shadow: var(--shadow);
}
.ax-cta__bg {
position: absolute;
inset: 0;
overflow: hidden;
border-radius: inherit;
pointer-events: none;
}
.ax-cta__sprig {
position: absolute;
right: 4%;
bottom: -140px;
width: 440px;
opacity: .05;
transform: rotate(-20deg);
}
.ax-cta__text,
.ax-cta__btns {
position: relative;
z-index: 1;
}
.ax-cta .ax-h2 {
margin-bottom: 12px !important;
color: var(--cream);
font-size: clamp(1.8rem, 1.2rem + 1.8vw, 2.6rem);
}
.ax-cta__text p {
max-width: 36em;
margin: 0;
font-size: 1.06rem;
}
.ax-cta__btns {
display: flex;
flex-wrap: wrap;
gap: 12px;
}
.ax-reach {
padding: clamp(64px, 8vw, 110px) 0 clamp(24px, 3vw, 40px);
}
.ax-reach__grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 24px;
}
.ax-reach__card {
position: relative;
padding: 34px 28px 32px;
border-radius: 22px;
background: var(--paper);
box-shadow: var(--shadow-sm);
}
.ax-reach__num {
position: absolute;
top: 26px;
right: 28px;
color: var(--brass);
font-family: var(--serif);
font-size: 1.5rem;
line-height: 1;
}
.ax-reach__card .ax-badge {
margin-bottom: 20px;
}
.ax-reach__card h2 {
margin-bottom: 8px !important;
font-size: 1.45rem;
line-height: 1.25;
}
.ax-reach__card p {
margin: 0 0 12px;
color: var(--text);
}
.ax-reach__card p a {
color: var(--ink);
font-weight: 500;
text-decoration: none;
}
.ax-legal {
padding: clamp(56px, 7vw, 100px) 0 clamp(72px, 9vw, 120px);
}
.ax-prose {
max-width: 760px;
margin: 0 auto;
}
.ax-prose h2 {
margin: 44px 0 12px !important;
font-size: 1.55rem;
line-height: 1.3;
}
.ax-prose h2:first-child {
margin-top: 0 !important;
}
.ax-prose ul {
margin: 0 0 1.1em !important;
padding-left: 1.3em !important;
list-style: disc;
}
.ax-prose li {
margin-bottom: .35em;
}
.ax-prose li::marker {
color: var(--brass);
}
.ax-prose a {
color: var(--bronze);
font-weight: 500;
text-decoration: none;
}
.ax-dot {
margin: 0 10px;
color: var(--brass);
}
@media (hover: hover) and (pointer: fine) {
.ax-reach__card p a:hover,
.ax-prose a:hover {
color: var(--bronze);
text-decoration: underline;
}
}
@media (max-width: 1100px) {
.ax-reach__grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 960px) {
.ax-hero--page .ax-hero__grid,
.ax-row__grid,
.ax-row--alt .ax-row__grid,
.ax-brand__grid {
grid-template-columns: minmax(0, 1fr);
}
.ax-hero--page .ax-hero__art {
width: min(100%, 360px);
}
.ax-row__art,
.ax-row--alt .ax-row__art {
order: 0;
justify-self: center;
width: min(100%, 400px);
}
.ax-row__text {
max-width: 640px;
}
.ax-brand--alt .ax-brand__art {
order: 0;
}
.ax-brand__art {
width: min(100%, 600px);
justify-self: center;
}
.ax-brand__qa {
grid-template-columns: minmax(0, 1fr);
}
.ax-cta__panel {
grid-template-columns: minmax(0, 1fr);
}
}
@media (max-width: 720px) {
.ax-band__inner,
.ax-row__text,
.ax-brand__text,
.ax-cta__panel,
.ax-reach__card,
.ax-mini-qa {
text-align: center;
}
.ax-row__text,
.ax-brand__text {
margin-left: auto;
margin-right: auto;
}
.ax-row__list {
grid-template-columns: minmax(0, 1fr);
justify-items: center;
}
.ax-row__list li {
padding-left: 0;
}
.ax-row__list li::before {
position: static;
display: inline-block;
margin: 0 10px 0 0;
vertical-align: middle;
}
.ax-brand__art {
padding: 0 34px 44px 0;
}
.ax-mini-qa {
padding: 26px 22px 28px;
}
.ax-mini-qa__num {
position: static;
margin: 0 auto 12px;
}
.ax-cta__panel {
padding: 34px 22px 30px;
border-radius: 24px;
}
.ax-cta__btns {
flex-direction: column;
align-items: stretch;
}
.ax-cta__btns .ax-btn {
padding-left: 1.2em;
padding-right: 1.2em;
letter-spacing: .1em;
}
.ax-cta__btns .ax-btn {
width: 100%;
}
.ax-reach__grid {
grid-template-columns: minmax(0, 1fr);
}
.ax-reach__card .ax-badge {
margin-left: auto;
margin-right: auto;
}
.ax-prose {
text-align: center;
}
.ax-prose ul {
padding-left: 0 !important;
list-style-position: inside;
}
}
.ax-row__img,
.ax-brand__img,
.ax-reach__card {
min-width: 0;
}
.ax-site #page {
display: block;
}
.ax-site .site-content > .ast-container {
display: block;
max-width: none;
padding: 0;
}
.ax-site #primary {
width: 100%;
margin: 0;
padding: 0;
}
.ax-site .site-main > article {
margin: 0;
padding: 0;
}
.ax-site picture {
display: contents;
}
.ax-site picture > source {
display: none;
}
.admin-bar .ax-header {
top: 32px;
}
@media (max-width: 782px) {
.admin-bar .ax-header {
top: 46px;
}
}
@media (max-width: 600px) {
.admin-bar .ax-header {
top: 0;
}
}
:root {
font-size: 100%;
}
.ax-site a.ax-btn--brass:is(:hover, :focus),
.ax-site a.ax-skip:is(:hover, :focus) {
color: var(--forest);
}
.ax-site a.ax-btn--forest:is(:hover, :focus),
.ax-site a.ax-btn--line:is(:hover, :focus),
.ax-site a.ax-hero__phone:is(:hover, :focus) {
color: var(--cream);
}
.ax-site a.ax-arrow-link:is(:hover, :focus) {
color: var(--bronze);
}
.ax-site .ax-svc a.ax-arrow-link:is(:hover, :focus),
.ax-site a.ax-header__call:is(:hover, :focus) {
color: var(--brass);
}
.ax-site a.ax-header__phone:is(:hover, :focus) {
color: var(--on-dark);
}
.ax-site a.ax-logo:is(:hover, :focus),
.ax-site a.ax-footer__logo:is(:hover, :focus) {
color: inherit;
}
.ax-site button.ax-menu-btn:is(:hover, :focus, :active) {
border-color: rgba(198, 162, 106, .55);
background: transparent;
color: var(--brass);
}
.ax-site button.ax-totop:is(:hover, :focus, :active) {
border-color: rgba(198, 162, 106, .6);
background: var(--forest);
color: var(--brass);
}
html:root {
--ast-global-color-0: #28301f;
--ast-global-color-1: #7a5a24;
--ast-global-color-2: #1f2619;
--ast-global-color-3: #474e40;
--ast-global-color-4: #fffdf8;
--ast-global-color-5: #f7f2e9;
--ast-global-color-6: #1d2416;
--ast-global-color-7: #e2d8c4;
--ast-global-color-8: #1f2619;
background: var(--forest-3);
}
.ax-site {
-webkit-tap-highlight-color: transparent;
}
.ax-site ::selection {
background: var(--brass);
color: var(--forest);
}
.ax-site .site-content .error-404 {
padding: clamp(80px, 10vw, 140px) var(--gutter);
background: transparent;
text-align: center;
}
.ax-site .error-404 .page-sub-title {
color: var(--ink);
}
.ax-site .error-404 .search-field {
border: 1px solid #e2d8c4;
background: var(--paper);
color: var(--ink);
}
.ax-site .error-404 .search-field:focus {
border-color: var(--brass);
outline: none;
}
.ax-site .error-404 .search-submit,
.ax-site .error-404 .search-submit svg {
color: var(--bronze);
fill: var(--bronze);
}