:where([data-etch-element="container"]) {
  inline-size: 100%;
  display: flex;
  flex-direction: column;
  max-inline-size: var(--content-width, 1366px);
  align-self: center; margin-inline: auto;
}
:where([data-etch-element="flex-div"]) {
  inline-size: 100%;
  display: flex;
  flex-direction: column;
}
:where([data-etch-element="iframe"]) {
  inline-size: 100%;
  height: auto;
 aspect-ratio: 16/9;
}
:where([data-etch-element="section"]) {
  inline-size: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.sub {
  
display:block;font-weight:700;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--stone);margin-bottom:18px
}
.btn {
  
display: inline-flex; align-items: center; justify-content: center; gap: 10px; font: 500 15px/1 var(--text); letter-spacing: 0.04em; padding: 17px 28px; border: 0px; cursor: pointer; background: var(--sand); color: var(--midnight); text-decoration: none; transition: background 0.2s;
&:hover{background: rgb(255, 255, 255);}
&:focus-visible{outline: 2px solid var(--stone); outline-offset: 3px;}
}
.top {
  
position: absolute; left: 0px; right: 0px; top: env(safe-area-inset-top,0px); z-index: 5;
& img{width: 190px; margin-left: -14px; max-width: none;}
& a.link{color: var(--sand); font-size: 14px; letter-spacing: 0.06em; text-decoration: none; border-bottom: 1px solid var(--stone); padding-bottom: 3px;}
& nav{display: flex; gap: 26px; flex-wrap: wrap;}
& .wrap{display: flex; justify-content: space-between; align-items: center; padding-top: 22px; padding-bottom: 22px;}
@media (max-width: 800px){& img{width: 145px;}}
@media (max-width: 800px){& nav{gap: 12px;}}
@media (max-width: 800px){& a.link{font-size: 12px;}}
@media (max-width: 600px){& nav a:first-child{display: none;}}
@media (max-width: 600px){& img{width: 150px;}}
}
.hero {
  
background: var(--midnight); color: var(--mist); position: relative; overflow: hidden; padding: 150px 0px 110px;
& .v{position: absolute; right: -140px; top: 30px; width: min(820px, 90vw); opacity: 0.12; pointer-events: none;}
& h1{color: rgb(255, 255, 255);}
& .intro{font-size: 20px; line-height: 1.55; color: var(--sand); max-width: 30em; margin: 28px 0px 34px;}
& .suburbs{display: flex; flex-wrap: wrap; gap: 8px 22px; font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--stone); font-weight: 700; border-top: 1px solid rgba(166, 150, 136, 0.5); padding-top: 20px; max-width: 560px;}
& .sub{color: var(--sand);}
& .wrap{position: relative; display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 72px; align-items: start;}
@media (max-width: 960px){padding: 118px 0px 72px;}
@media (max-width: 960px){& .wrap{grid-template-columns: 1fr; gap: 44px;}}
@media (max-width: 800px){padding-top: 150px;}
}
.cover {
  
margin-top: 44px; width: 230px; box-shadow: rgba(0, 0, 0, 0.45) 0px 30px 60px; transform: rotate(-2.5deg);
@media (max-width: 960px){display: none;}
}
.formcard {
  
background: var(--card); color: var(--body); padding: 40px 38px 34px; position: relative;
& h2{font-size: 32px; margin-bottom: 8px;}
& .small{font-size: 14px; color: var(--muted); margin-bottom: 22px; margin-top: 12px;}
& .btn{width: 100%; background: var(--midnight); color: rgb(255, 255, 255); font-size: 16px;}
& .btn:hover{background: rgb(44, 55, 61);}
&.sent form{display: none;}
&.sent .done{display: block;}
@media (max-width: 600px){padding: 30px 22px 26px; margin: 0px -4px;}
}
.row {
  
display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
@media (max-width: 600px){grid-template-columns: 1fr;}
}
.field {
  
display: flex; flex-direction: column; margin-bottom: 14px;
& label{font-size: 13px; font-weight: 500; color: var(--ink); margin-bottom: 6px;}
& input{font: 400 16px var(--text); color: var(--ink); background: transparent; border-top: 0px; border-right: 0px; border-left: 0px; border-image: none; border-bottom: 1px solid var(--line); padding: 10px 2px; border-radius: 0px; appearance: none;}
& select{font: 400 16px var(--text); color: var(--ink); background: transparent; border-top: 0px; border-right: 0px; border-left: 0px; border-image: none; border-bottom: 1px solid var(--line); padding: 10px 2px; border-radius: 0px; appearance: none; background-image: linear-gradient(45deg,transparent 50%,var(--stone) 50%),linear-gradient(135deg,var(--stone) 50%,transparent 50%); background-position: calc(100% - 14px) 52%, calc(100% - 9px) 52%; background-size: 5px 5px; background-repeat: no-repeat;}
& input:focus{border-bottom-color: var(--stone); outline: none;}
& select:focus{border-bottom-color: var(--stone); outline: none;}
& select option{color: rgb(29, 37, 41);}
&.bad input{border-bottom-color: rgb(154, 59, 46);}
&.bad select{border-bottom-color: rgb(154, 59, 46);}
}
.chips {
  
display:flex;flex-wrap:wrap;gap:8px
}
.consent {
  
display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.5; color: var(--muted); margin: 6px 0px 20px;
& input{margin-top: 3px; accent-color: var(--midnight); width: 16px; height: 16px; flex: 0 0 auto;}
& a{text-decoration: underline;}
}
.err {
  
color:#9A3B2E;font-size:13px;margin:-6px 0 12px;min-height:0
}
.done {
  
display: none;
& h2{margin-bottom: 12px;}
& .btn{margin: 18px 0px 14px;}
}
.alt {
  
background:var(--bg-alt)
}
.warm {
  
background:var(--bg-warm)
}
.two {
  
display: grid; grid-template-columns: 1fr 1fr; gap: 64px;
@media (max-width: 960px){grid-template-columns: 1fr; gap: 44px;}
}
.lead {
  
font-size:21px;line-height:1.5;color:var(--ink);max-width:34em
}
.chapters {
  
display: grid; grid-template-columns: repeat(3, 1fr); gap: 0px; margin-top: 56px; border-top: 1px solid var(--line);
&>div{padding: 30px 30px 34px 0px; border-bottom: 1px solid var(--line);}
& .n{font-family: var(--display); font-size: 40px; color: var(--stone); line-height: 1; margin-bottom: 14px;}
& h3{font-size: 22px; margin-bottom: 10px;}
& p{font-size: 16px; margin: 0px;}
@media (max-width: 960px){grid-template-columns: 1fr 1fr;}
@media (max-width: 600px){grid-template-columns: 1fr;}
@media (max-width: 600px){&>div{padding-right: 0px;}}
}
.photo {
  
position: relative; min-height: 520px; background-size: cover; background-position: center 60%;
& .cap{position: absolute; right: 16px; bottom: 12px; font-size: 12px; color: rgb(255, 255, 255); opacity: 0.85;}
@media (max-width: 960px){min-height: 320px;}
}
.stats {
  
display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; margin-top: 56px;
@media (max-width: 960px){grid-template-columns: 1fr; gap: 28px;}
}
.stat {
  
& .big{font-family:var(--display);font-size:clamp(40px,4.4vw,60px);color:var(--ink);line-height:1;margin-bottom:12px}
& p{font-size:16px}
}
.subs {
  
display: grid; grid-template-columns: repeat(5, 1fr); gap: 0px; margin-top: 52px; border-top: 1px solid var(--line);
&>div{padding: 26px 22px 26px 0px; border-right: 1px solid var(--line);}
&>div+div{padding-left: 22px;}
&>div:last-child{border-right: 0px;}
& h3{font-size: 24px; margin-bottom: 8px;}
& .m{font-size: 13px; letter-spacing: 0.06em; color: var(--stone); font-weight: 500; margin-bottom: 10px;}
& p{font-size: 15px; margin: 0px;}
@media (max-width: 960px){grid-template-columns: 1fr 1fr;}
@media (max-width: 960px){&>div{border-right: 0px; padding: 22px 0px; border-bottom: 1px solid var(--line);}}
@media (max-width: 960px){&>div+div{border-right: 0px; padding: 22px 0px; border-bottom: 1px solid var(--line);}}
@media (max-width: 960px){&>div:nth-child(2n+1){padding-right: 20px;}}
@media (max-width: 600px){grid-template-columns: 1fr;}
}
.projects {
  
display: grid; grid-template-columns: 1.25fr 1fr; gap: 24px; margin-top: 52px;
@media (max-width: 960px){grid-template-columns: 1fr; gap: 44px;}
}
.proj {
  
position: relative; display: flex; flex-direction: column;
& .face{display: flex; align-items: center; justify-content: center; padding: 48px;}
& .meta{display: flex; justify-content: space-between; gap: 16px; padding: 18px 0px 0px; font-size: 15px;}
& .meta b{font-weight: 500; color: var(--ink);}
& .st{font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700; color: var(--stone); white-space: nowrap;}
@media (max-width: 600px){& .face{padding: 34px;}}
}
.pj-jac {
  
grid-row: span 2;
& .face{padding: 0px; flex: 1 1 0%; min-height: 420px; background-size: cover; background-position: center center; align-items: flex-end; justify-content: flex-start;}
& .face span{background: rgb(245, 241, 236); padding: 20px 26px;}
& .face img{height: 34px;}
@media (max-width: 960px){grid-row: auto;}
}
.projects-r {
  
display:grid;gap:24px
}
.cta {
  
background: var(--midnight); color: var(--mist); padding: 110px 0px; position: relative; overflow: hidden;
& h2{color: rgb(255, 255, 255);}
& .v{position: absolute; left: -120px; bottom: -60px; width: 520px; opacity: 0.1;}
@media (max-width: 960px){padding: 76px 0px;}
}
.people {
  
display: grid; grid-template-columns: 1fr 1fr; gap: 32px; margin-top: 36px;
&>div{border-top: 1px solid rgba(166, 150, 136, 0.5); padding-top: 18px; font-size: 16px;}
& .nm{font-family: var(--display); font-size: 24px; color: rgb(255, 255, 255); margin-bottom: 2px;}
& .rl{font-size: 13px; color: var(--stone); margin-bottom: 10px;}
@media (max-width: 600px){grid-template-columns: 1fr;}
}
.c-layout {
  
display: grid; grid-template-columns: minmax(0px, 1.15fr) minmax(0px, 0.85fr); gap: 48px; align-items: start; margin-top: 56px;
& input[type="range"]{width: 100%; margin: 12px 0px 2px; accent-color: rgb(166, 150, 136);}
& details{border: 1px solid var(--line); padding: 0px 16px; margin: 4px 0px 18px;}
& summary{cursor: pointer; padding: 14px 0px; font-weight: 500; color: var(--ink); font-size: 15px;}
& details[open] summary{border-bottom: 1px solid var(--line); margin-bottom: 16px;}
@media (max-width: 960px){grid-template-columns: 1fr; gap: 36px;}
}
.c-step {
  
border-top: 1px solid var(--line); padding: 28px 0px 8px;
&:first-child{border-top: 0px; padding-top: 0px;}
& h3{font-size: 26px; margin-bottom: 6px;}
& .c-hint{color: var(--muted); font-size: 15px; margin-bottom: 18px;}
}
.c-grid {
  
display: grid; grid-template-columns: 1fr 1fr; gap: 4px 22px;
@media (max-width: 600px){grid-template-columns: 1fr 1fr; grid-template-columns: 1fr;}
}
.c-f {
  
display: flex; flex-direction: column; margin-bottom: 16px;
&.full{grid-column: 1 / -1;}
& label{font-size: 14px; font-weight: 500; color: var(--ink); margin-bottom: 6px; display: flex; justify-content: space-between; gap: 10px;}
& label small{font-weight: 300; color: var(--muted); font-size: 13px;}
}
.c-money {
  
position: relative;
&::before{content: "$"; position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--muted); font-size: 16px; pointer-events: none;}
&.pct::before{content: "%"; left: auto; right: 12px;}
& input{width: 100%; font: 400 17px var(--text); color: var(--ink); background: var(--field); border: 1px solid var(--line); padding: 12px 12px 12px 26px; border-radius: 0px; appearance: none;}
&.pct input{padding: 12px 30px 12px 12px;}
& input:focus{outline: none; border-color: var(--stone); box-shadow: rgba(166, 150, 136, 0.25) 0px 0px 0px 3px;}
}
.c-chips {
  
display:flex;flex-wrap:wrap;gap:8px;margin-top:10px
}
.c-chip {
  
font: 400 14px var(--text); color: var(--body); background: transparent; border: 1px solid var(--line); padding: 7px 13px; cursor: pointer;
&:hover{border-color: var(--stone);}
&[aria-pressed="true"]{background: var(--ink); color: var(--bg); border-color: var(--ink);}
}
.c-toggle {
  
display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border: 1px solid var(--line); cursor: pointer; margin-bottom: 12px; font-size: 15px; line-height: 1.45;
& input{width: 18px; height: 18px; margin-top: 2px; accent-color: rgb(29, 37, 41); flex: 0 0 auto;}
& b{font-weight: 500; color: var(--ink); display: block;}
}
.c-res {
  
position: sticky; top: 20px; background: var(--res-bg); color: var(--res-body); padding: 34px 32px 30px;
& .sub{color: rgb(166, 150, 136);}
@media (max-width: 960px){position: static;}
@media (max-width: 600px){padding: 28px 22px; margin: 0px -20px;}
}
.c-big {
  
font-family:var(--display);font-size:clamp(44px,5vw,60px);line-height:1.02;color:var(--res-ink);margin:2px 0 6px
}
.c-note {
  
font-size:14px;margin-bottom:22px
}
.c-row {
  
display: flex; justify-content: space-between; gap: 16px; padding: 9px 0px; border-bottom: 1px solid var(--res-line); font-size: 15px;
& b{font-weight: 500; color: var(--res-ink); white-space: nowrap; font-variant-numeric: tabular-nums;}
&.total{border-bottom: 0px; border-top: 1px solid rgb(166, 150, 136); margin-top: 4px; padding-top: 12px;}
&.total span{font-weight: 600; color: var(--res-ink);}
&.total b{font-weight: 600; color: var(--res-ink);}
}
.c-mini {
  
display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 24px 0px 22px;
&>div{border-top: 1px solid var(--res-line); padding-top: 12px;}
& .n{font-family: var(--display); font-size: 28px; color: var(--res-ink); line-height: 1.1;}
& p{font-size: 13px; margin: 4px 0px 0px; line-height: 1.45;}
@media (max-width: 600px){grid-template-columns: 1fr 1fr;}
}
.c-cta {
  
display: block; text-align: center; text-decoration: none; font: 500 15px/1 var(--text); letter-spacing: 0.03em; padding: 17px 20px; background: rgb(230, 214, 198); color: rgb(29, 37, 41); margin-top: 8px;
&.alt{background: transparent; color: var(--res-ink); border: 1px solid rgb(166, 150, 136);}
}
.c-fine {
  
font-size:12px;line-height:1.5;opacity:.8;margin:16px 0 0
}
.c-short {
  
color:#E6B8A8
}
.cmp-wrap {
  
overflow-x:auto;margin-top:48px
}
.cmp {
  
width: 100%; border-collapse: collapse; min-width: 620px; font-size: 16px;
& th{text-align: left; vertical-align: top; padding: 16px 20px 16px 0px; border-bottom: 1px solid var(--line);}
& td{text-align: left; vertical-align: top; padding: 16px 20px 16px 0px; border-bottom: 1px solid var(--line);}
& thead th{font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--stone); font-weight: 700; border-bottom: 1px solid var(--stone);}
& tbody th{font-weight: 500; color: var(--ink); width: 22%;}
}
.rates {
  
display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 40px;
@media (max-width: 960px){grid-template-columns: 1fr;}
}
.rate {
  
padding: 30px 32px;
&.t{background: var(--bg-warm);}
&.a{background: var(--bg-alt);}
& p{margin: 0px; font-size: 16px;}
}
.rn {
  
font-family: var(--display); font-size: clamp(32px, 3.4vw, 46px); color: var(--ink); line-height: 1.05; margin-bottom: 12px;
& small{display: block; font-family: var(--text); font-size: 13px; color: var(--muted); margin-top: 6px;}
}
.whyt {
  
display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px 40px; margin-top: 20px;
& b{display: block; font-weight: 600; color: var(--ink); margin-bottom: 4px;}
& p{margin: 0px; font-size: 16px;}
@media (max-width: 960px){grid-template-columns: 1fr;}
}
.dev-brand {
  
display: flex; align-items: center; gap: 26px; margin: 4px 0px 24px; padding-bottom: 22px; border-bottom: 1px solid var(--p-line);
@media (max-width: 600px){flex-direction: column; align-items: flex-start; gap: 16px;}
}
.dev-by {
  
display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding-left: 26px; border-left: 1px solid var(--p-accent);
& span{font-size: 10px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--p-body);}
@media (max-width: 600px){padding-left: 0px; border-left: 0px; padding-top: 14px; border-top: 1px solid var(--p-accent);}
}
.es-brand {
  
display: flex; align-items: center; gap: 26px; margin: 4px 0px 24px; padding-bottom: 22px; border-bottom: 1px solid var(--p-line);
@media (max-width: 600px){flex-direction: column; align-items: flex-start; gap: 16px;}
}
.es-dev {
  
display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding-left: 26px; border-left: 1px solid rgb(168, 140, 94);
& span{font-size: 10px; letter-spacing: 0.24em; text-transform: uppercase; color: rgb(83, 80, 75);}
& .es-sub{color: rgb(168, 140, 94); font-size: 9px;}
@media (max-width: 600px){padding-left: 0px; border-left: 0px; padding-top: 14px; border-top: 1px solid rgb(168, 140, 94);}
}
.gal4 {
  
display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 1.55fr 1fr; gap: 8px; height: 600px; position: relative;
&>div{background-size: cover; background-position: center center; position: relative;}
& .g1{grid-column: 1 / -1;}
& .gl{position: absolute; left: 10px; bottom: 10px; background: rgba(245, 241, 236, 0.92); color: rgb(59, 46, 57); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700; padding: 6px 10px;}
@media (max-width: 960px){height: 480px;}
@media (max-width: 600px){height: 400px; grid-template-columns: 1fr 1fr; grid-template-rows: 1.4fr 1fr 1fr;}
@media (max-width: 600px){& .g1{grid-column: 1 / -1;}}
@media (max-width: 600px){&>div:nth-child(4){grid-column: 1 / -1;}}
}
.pen-pair {
  
display: grid; grid-template-columns: 1.4fr 1fr; gap: 10px; margin-top: 44px;
& figure{margin: 0px;}
& figure div{height: 340px; background-size: cover; background-position: center center;}
& figcaption{font-size: 13px; color: var(--muted); margin-top: 8px;}
@media (max-width: 960px){grid-template-columns: 1fr;}
@media (max-width: 960px){& figure div{height: 240px;}}
}
.single {
  
position: relative; min-height: 600px; background-size: cover; background-position: center center;
@media (max-width: 960px){min-height: 420px;}
@media (max-width: 600px){min-height: 320px;}
}
.es-card {
  
position: absolute; right: 16px; bottom: 16px; background: rgb(237, 232, 226); padding: 20px 24px; text-align: center;
& img{display: block; margin: 0px auto;}
@media (max-width: 600px){right: 12px; bottom: 12px; padding: 14px 16px;}
@media (max-width: 600px){& img:first-child{width: 110px !important;}}
}
.pj-nav {
  
display: grid; grid-template-columns: repeat(5, 1fr); margin-top: 48px; border-top: 1px solid var(--line);
& a{display: block; text-decoration: none; padding: 20px 20px 4px 0px;}
& b{display: block; font-family: var(--display); font-weight: 400; font-size: 24px; color: var(--ink);}
& span{font-size: 13px; color: var(--muted);}
& a:hover b{text-decoration: underline 1px; text-underline-offset: 5px;}
@media (max-width: 960px){grid-template-columns: 1fr 1fr 1fr;}
}
.feat {
  
background: var(--p-bg); color: var(--p-body); padding: 96px 0px; border-top: 1px solid var(--p-line);
&.rev .media{order: 2;}
& .body p{font-size: 16.5px;}
& .wrap{display: grid; grid-template-columns: 1.08fr 0.92fr; gap: 64px; align-items: center;}
@media (max-width: 960px){padding: 64px 0px;}
@media (max-width: 960px){&.rev .media{order: 0;}}
@media (max-width: 960px){& .wrap{grid-template-columns: 1fr; gap: 36px;}}
}
.gal {
  
display: grid; grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; gap: 8px; height: 600px; position: relative;
&>div{background-size: cover; background-position: center center;}
& .g1{grid-row: span 2;}
@media (max-width: 960px){height: 420px;}
@media (max-width: 600px){height: 340px; grid-template-columns: 1fr 1fr; grid-template-rows: 2fr 1fr;}
@media (max-width: 600px){& .g1{grid-area: auto / span 2;}}
}
.gcap {
  
position:absolute;right:12px;bottom:10px;font-size:11px;color:#fff;opacity:.85
}
.lp {
  
min-height: 600px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 40px; position: relative;
@media (max-width: 960px){min-height: 380px;}
@media (max-width: 600px){min-height: 320px; padding: 28px;}
@media (max-width: 600px){& img[alt^="ALURÉ"]{width: 210px !important;}}
@media (max-width: 600px){& img[alt^="Ernest"]{width: 210px !important;}}
@media (max-width: 600px){& img[alt^="Vaucluse"]{width: 210px !important;}}
}
.sw {
  
display: flex; gap: 8px; margin-top: 34px;
& i{width: 26px; height: 26px; display: block;}
}
.ftop {
  
margin-bottom:20px
}
.ptag {
  
display:inline-block;font-weight:700;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--p-accent);border:1px solid var(--p-accent);padding:7px 12px
}
.addr {
  
font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--p-accent);margin:14px 0 18px
}
.fh {
  
font-family:var(--display);font-weight:400;font-size:clamp(26px,2.6vw,34px);line-height:1.15;color:var(--p-ink);margin:0 0 16px
}
.fx {
  
display: grid; grid-template-columns: 1fr 1fr; margin: 26px 0px 22px; border-top: 1px solid var(--p-line);
&>div{padding: 13px 16px 13px 0px; border-bottom: 1px solid var(--p-line);}
& dt{font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700; color: var(--p-accent); margin-bottom: 3px;}
& dd{margin: 0px; font-size: 17px; color: var(--p-ink); font-weight: 400;}
@media (max-width: 600px){grid-template-columns: 1fr;}
}
.why {
  
& b{display:block;font-weight:600;color:var(--p-ink);font-size:15px;margin-bottom:8px}
& ul{margin:0;padding:0;list-style:none}
& li{position:relative;padding-left:20px;margin-bottom:6px;font-size:15.5px}
& li:before{content:"";position:absolute;left:0;top:.72em;width:10px;height:1px;background:var(--p-accent)}
}
.by {
  
font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--p-body);margin:22px 0 0;display:flex;align-items:center
}
.acts {
  
display:flex;flex-wrap:wrap;gap:12px;margin-top:26px
}
.pbtn {
  
font: 500 15px/1 var(--text); letter-spacing: 0.03em; padding: 16px 24px; border: 1px solid var(--p-ink); background: var(--p-ink); color: var(--p-bg); cursor: pointer; display: inline-block; text-decoration: none; text-align: center;
&:hover{opacity: 0.9;}
&.ghost{background: transparent; color: var(--p-ink);}
@media (max-width: 600px){width: 100%;}
}
.home-hero {
  
& .wrap{align-items:center}
}
.home-photo {
  
& img{width:100%;aspect-ratio:4/5;object-fit:cover}
@media(max-width:800px){& img{aspect-ratio:16/9}}
}
.guide-card {
  
display: grid; grid-template-columns: 1fr 1fr; background: var(--sand); color: var(--midnight);
@media (max-width: 800px){grid-template-columns: 1fr;}
}
.guide-card-image {
  
& img{width:100%;height:100%;min-height:360px;object-fit:cover}
@media(max-width:800px){& img{min-height:0;aspect-ratio:16/9}}
}
.guide-card-copy {
  
padding: clamp(24px, 5vw, 64px);
& h2{color: var(--midnight); margin-bottom: 24px;}
& .btn{background: var(--midnight); color: white;}
& .sub{color: var(--slate);}
}
.three {
  
display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px;
@media (max-width: 800px){grid-template-columns: 1fr;}
}
.small-heading {
  
font-size:28px;margin-bottom:16px
}
.digital-note {
  
margin-top:32px;font-size:16px;color:var(--sand)
}
.guide-hero {
  
& .wrap{display:block}
& h1{max-width:13ch}
}
.guide-actions {
  
display: flex; gap: 24px; align-items: center; flex-wrap: wrap; margin-top: 36px;
& .link{color: var(--sand);}
}
.image-panel {
  
position: relative; overflow: hidden;
&>.panel-image{position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover;}
&>.cap{z-index: 1;}
}
.honey {
  
position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden
}
.privacy-link {
  
text-align:center;padding:20px
}
.va-2510480ac {
  background-position:center 55%
}
.va-87e190a7f {
  max-width:16em
}
.va-e75897da0 {
  font-size:13px;color:var(--muted);margin-top:36px
}
.va-6a1fd8640 {
  font-family:var(--text);font-size:15px;color:var(--muted)
}
.va-226444d36 {
  font-size:14px
}
.va-60a8ac0d9 {
  margin:56px 0 8px
}
.va-516c282ad {
  font-size:13px;color:var(--muted);margin-top:30px
}
.va-090fbe662 {
  padding-bottom:64px
}
.va-702a7d6f2 {
  --p-bg:#F5F1EC;--p-ink:#3B2E39;--p-body:#5E5560;--p-accent:#52404F;--p-line:rgba(82,64,79,.2)
}
.va-74b70bc1d {
  background-position:62% 40%
}
.va-1ec43d45d {
  background-position:62% center
}
.va-ce371605a {
  background-position:40% center
}
.va-63519e2d2 {
  background-position:50% center
}
.va-b836cd6be {
  width:auto;height:44px;margin-bottom:14px
}
.va-bab11f142 {
  width:auto;height:40px
}
.va-e1b570984 {
  width:auto;height:15px;display:inline-block;vertical-align:-3px;margin-left:8px
}
.va-5d508bd24 {
  --p-bg:#F3F2ED;--p-ink:#181712;--p-body:#515B50;--p-accent:#515B50;--p-line:rgba(81,91,80,.22)
}
.va-23c3fc271 {
  width:180px;display:block
}
.va-84800e57f {
  width:auto;height:20px;display:inline-block;vertical-align:-3px;margin-left:8px
}
.va-3c767ba4d {
  --p-bg:#EDE8E2;--p-ink:#3E3B36;--p-body:#53504B;--p-accent:#A88C5E;--p-line:rgba(168,140,94,.35)
}
.va-1ba2e2b1a {
  background-position:center 45%
}
.va-aa11de5a0 {
  color:#53504B
}
.va-242ddc0ad {
  background-position:center 60%
}
.va-1b119339a {
  width:230px;display:block
}
.va-940e7e201 {
  --p-bg:#EFE9DD;--p-ink:#2A3A47;--p-body:#3D2F22;--p-accent:#8B6F47;--p-line:rgba(201,183,154,.8)
}
.va-288b428ac {
  background-position:center 62%
}
.va-2617801c3 {
  color:#2A3A47
}
.va-c5704a3fa {
  background-position:45% center
}
.va-77718929e {
  width:240px;display:block
}
.va-636267883 {
  --p-bg:#F6F3EC;--p-ink:#34383B;--p-body:#6A7076;--p-accent:#95A171;--p-line:rgba(106,112,118,.22)
}
.va-4e1dbf993 {
  color:#34383B
}
.va-aef2e482c {
  background-position:30% center
}
.va-ad64b3d12 {
  width:200px;display:block
}
.va-2a9495ecb {
  position:relative
}
.va-3a09c0a99 {
  font-size:19px;color:var(--sand);margin-top:22px;max-width:30em
}
.va-92c18f6bd {
  margin-top:16px
}
.va-4fcd2a197 {
  margin-top:16px;background:transparent;color:var(--sand);border:1px solid var(--stone)
}
.va-f70d72536 {
  margin-top:28px;font-size:16px
}
.va-ab79ea2b8 {
  margin:0
}
.wrap {
  
max-width: 1180px; margin: 0px auto; padding: 0px 28px;
@media (max-width: 600px){padding: 0px 20px;}
}