:root{
    --ink:#18241f;
    --muted:#69736d;
    --cream:#f7f6f0;
    --white:#fff;
    --green:#174c7b;
    --lime:#e31e28;
    --line:#e8e9e2;
    --serif:Georgia,"Times New Roman",serif;
    --sans:"DM Sans",sans-serif;
    --display:"Manrope",sans-serif
}
*{
    box-sizing:border-box
}
html{
    scroll-behavior:smooth
}
body{
    margin:0;
    color:var(--ink);
    background:var(--cream);
    font-family:var(--sans);
    -webkit-font-smoothing:antialiased
}
a{
    color:inherit;
    text-decoration:none
}
.container{
    width:min(1160px,calc(100% - 64px));
    margin:0 auto
}
.announcement{
    height:36px;
    background:#e8eddd;
    color:#495b4e;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    font-size:11px;
    letter-spacing:.035em
}
.announcement-dot{
    width:6px;
    height:6px;
    border-radius:50%;
    background:#779340
}
.site-header{
    position:relative;
    z-index:10;
    background:var(--cream)
}
.nav-wrap{
    height:84px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-bottom:1px solid rgba(24,36,31,.09)
}
.brand{
    display:flex;
    align-items:center;
    gap:11px
}
.brand-mark{
    width:30px;
    height:30px;
    position:relative;
    display:flex;
    align-items:flex-end;
    gap:3px
}
.brand-mark span{
    display:block;
    width:7px;
    background:var(--green);
    border-radius:5px 5px 2px 2px;
    transform:skew(-24deg)
}
.brand-mark span:nth-child(1){
    height:15px
}
.brand-mark span:nth-child(2){
    height:24px
}
.brand-mark span:nth-child(3){
    height:19px
}
.brand-name{
    font:800 19px var(--display);
    letter-spacing:-.07em
}
.brand-name span{
    display:block;
    font:600 8px var(--sans);
    letter-spacing:.31em;
    text-transform:uppercase;
    margin-top:1px;
    color:#6d776e
}
.main-nav{
    display:flex;
    align-items:center;
    gap:37px;
    font-size:12px;
    font-weight:600
}
.main-nav>a:not(.nav-cta){
    color:#505a54;
    transition:color .2s
}
.main-nav>a:not(.nav-cta):hover{
    color:#9ab943
}
.nav-cta{
    display:flex;
    align-items:center;
    gap:16px;
    background:var(--green);
    color:#fff;
    padding:13px 18px;
    border-radius:4px
}
.nav-cta span{
    color:var(--lime)
}
.menu-toggle{
    display:none
}
.hero{
    position:relative;
    overflow:hidden;
    background:#f4f4ec;
    padding:78px 0 0
}
.hero:before{
    content:"";
    position:absolute;
    left:-170px;
    top:130px;
    width:420px;
    height:420px;
    border:1px solid #e4e8d9;
    border-radius:50%
}
.hero:after{
    content:"";
    position:absolute;
    left:-80px;
    top:219px;
    width:240px;
    height:240px;
    border:1px solid #e4e8d9;
    border-radius:50%
}
.hero-glow{
    position:absolute;
    right:0;
    top:-140px;
    width:600px;
    height:680px;
    background:radial-gradient(ellipse,#e9edd8 0%,rgba(233,237,216,0) 69%)
}
.hero-grid{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:.92fr 1.08fr;
    align-items:center;
    min-height:463px
}
.hero-copy{
    padding:0 0 38px 4px
}
.eyebrow{
    display:flex;
    align-items:center;
    gap:11px;
    color:#788472;
    font-size:9px;
    font-weight:700;
    letter-spacing:.17em
}
.eyebrow-line{
    height:1px;
    width:24px;
    background:#829776
}
.hero h1,.section h2{
    font:600 clamp(48px,5vw,69px)/1.07 var(--display);
    letter-spacing:-.065em;
    margin:25px 0 18px
}
.hero h1 em,.section h2 em{
    font-family:var(--serif);
    font-weight:400;
    letter-spacing:-.06em;
    color:#829a4d
}
.hero-lead{
    max-width:390px;
    color:#68736c;
    font-size:14px;
    line-height:1.8;
    margin:0
}
.hero-actions{
    display:flex;
    align-items:center;
    gap:28px;
    margin-top:29px
}
.button{
    display:inline-flex;
    align-items:center;
    justify-content:space-between;
    gap:27px;
    border:0;
    padding:15px 19px;
    font:700 11px var(--sans);
    cursor:pointer;
    border-radius:3px;
    transition:transform .2s,background .2s
}
.button:hover{
    transform:translateY(-2px)
}
.button-dark{
    background:var(--green);
    color:white
}
.button-dark span{
    color:var(--lime);
    font-size:15px
}
.text-link{
    font-size:11px;
    font-weight:700;
    color:#47554d
}
.text-link span{
    padding-left:7px;
    color:#829a4d
}
.hero-note{
    display:flex;
    align-items:center;
    gap:12px;
    margin-top:38px;
    color:#7b857a;
    font-size:10px;
    line-height:1.6
}
.hero-note strong{
    color:#39473e
}
.note-icon{
    display:grid;
    place-items:center;
    width:30px;
    height:30px;
    border:1px solid #d7dec9;
    border-radius:50%;
    color:#869d4f;
    font-size:16px
}
.hero-art{
    position:relative;
    height:465px;
    display:flex;
    align-items:center;
    justify-content:center
}
.family-art{
    position:absolute;
    width:min(100%,535px);
    height:auto;
    bottom:8px;
    z-index:2;
    overflow:visible
}
.art-orbit{
    position:absolute;
    left:50%;
    top:49%;
    border:1px solid rgba(124,151,79,.18);
    border-radius:50%;
    transform:translate(-50%,-50%)
}
.orbit-one{
    width:380px;
    height:380px
}
.orbit-two{
    width:310px;
    height:310px
}
.sun{
    position:absolute;
    top:42px;
    right:75px;
    width:87px;
    height:87px;
    border-radius:50%;
    background:#e8d49e;
    opacity:.68
}
.hill-back{
    fill:#e5ebd3
}
.hill-front{
    fill:#d4e0bb
}
.house-shadow{
    fill:#e5dfca
}
.house-roof{
    fill:#334f42
}
.house{
    fill:#f3f0e2
}
.window{
    fill:#d5dfb8
}
.door{
    fill:#9cb16d
}
.door-knob{
    fill:#f6efcf
}
.person-one{
    fill:#a0b875
}
.person-two{
    fill:#547b66
}
.skin{
    fill:#dba879
}
.hair{
    fill:#4a4037
}
.hair-two{
    fill:#614a3b
}
.plant{
    fill:none;
    stroke:#718d55;
    stroke-width:5;
    stroke-linecap:round
}
.pot{
    fill:#b79970
}
.spark{
    fill:#94a961
}
.spark-cross{
    stroke:#94a961;
    stroke-width:2
}
.art-label{
    position:absolute;
    z-index:3;
    display:flex;
    gap:10px;
    align-items:center;
    background:rgba(255,255,250,.93);
    padding:12px 15px;
    box-shadow:0 8px 28px #314b2910;
    border:1px solid #ebede4;
    border-radius:5px
}
.label-top{
    left:1%;
    top:89px
}
.label-bottom{
    right:-1%;
    bottom:86px
}
.label-icon{
    width:32px;
    height:32px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#eef2df;
    color:#718d55;
    font-size:20px
}
.label-icon.heart{
    background:#f5ebe0;
    color:#b47e60
}
.art-label small,.art-label strong{
    display:block
}
.art-label small{
    font-size:9px;
    color:#8a9288;
    margin-bottom:3px
}
.art-label strong{
    font-size:10px
}
.art-caption{
    position:absolute;
    z-index:3;
    bottom:20px;
    right:42px;
    font:italic 12px var(--serif);
    color:#69745e
}
.hero-bottom{
    height:59px;
    border-top:1px solid #e1e4d9;
    display:flex;
    align-items:center;
    justify-content:space-between;
    color:#8b9387;
    font-size:8px;
    font-weight:700;
    letter-spacing:.13em
}
.bottom-line{
    height:1px;
    width:50px;
    background:#d9dfce
}
.section{
    padding:105px 0
}
.solutions{
    background:#fff
}
.section-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    margin-bottom:41px
}
.section-heading .eyebrow{
    margin-bottom:15px
}
.section h2{
    font-size:46px;
    margin:0
}
.section-heading>p{
    max-width:340px;
    margin:0 0 4px;
    color:#7a837c;
    font-size:12px;
    line-height:1.8
}
.solution-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:13px
}
.solution-card{
    position:relative;
    min-height:325px;
    padding:19px 19px 18px;
    overflow:hidden;
    border-radius:5px;
    display:flex;
    flex-direction:column;
    transition:transform .25s
}
.solution-card:hover{
    transform:translateY(-5px)
}
.card-car{
    background:#f0f2e9
}
.card-home{
    background:#f7f0e9
}
.card-health{
    background:#edf2ef
}
.card-life{
    background:#f1f0e9
}
.card-number{
    font-size:8px;
    font-weight:700;
    letter-spacing:.14em;
    color:#7e887e
}
.solution-icon{
    position:absolute;
    right:16px;
    top:15px;
    font-size:14px;
    color:#71816c
}
.card-drawing{
    height:115px;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center
}
.car-body{
    position:absolute;
    bottom:37px;
    width:125px;
    height:37px;
    background:#526c5d;
    border-radius:25px 36px 10px 9px
}
.car-body:before{
    content:"";
    position:absolute;
    width:67px;
    height:29px;
    left:25px;
    top:-22px;
    background:#78917a;
    clip-path:polygon(19% 0,78% 0,100% 100%,0 100%)
}
.wheel{
    position:absolute;
    z-index:1;
    bottom:26px;
    width:24px;
    height:24px;
    border:6px solid #283d34;
    background:#d5d5c1;
    border-radius:50%
}
.wheel-a{
    margin-left:-70px
}
.wheel-b{
    margin-left:70px
}
.mini-house{
    font:120px/1 var(--serif);
    color:#a78a6d;
    transform:translateY(-2px)
}
.home-spark{
    position:absolute;
    right:54px;
    top:12px;
    color:#b29c6c;
    font-size:24px
}
.health-drawing>span{
    font:100px/1 var(--sans);
    color:#7d9a84
}
.health-drawing i{
    position:absolute;
    font-style:normal;
    font-size:37px;
    color:#d79572;
    right:60px;
    top:36px
}
.life-sun{
    font-size:64px;
    color:#b6aa71
}
.life-line{
    position:absolute;
    bottom:27px;
    width:140px;
    height:30px;
    border-top:2px solid #84936c;
    border-radius:50%
}
.card-copy{
    margin-top:auto
}
.card-copy h3{
    font:700 16px var(--display);
    letter-spacing:-.04em;
    margin:0 0 8px
}
.card-copy p{
    font-size:10px;
    color:#737c73;
    line-height:1.7;
    margin:0 0 15px
}
.card-link{
    font-size:9px;
    font-weight:700
}
.card-link b{
    padding-left:6px;
    color:#8aa34d
}
.about{
    background:var(--cream);
    padding-top:112px;
    padding-bottom:112px
}
.about-grid{
    display:grid;
    grid-template-columns:.93fr 1.07fr;
    gap:98px;
    align-items:center
}
.about-visual{
    height:430px;
    position:relative;
    display:grid;
    place-items:center
}
.about-shape{
    width:345px;
    height:345px;
    border-radius:48% 52% 46% 54%;
    background:#e8edda;
    position:relative;
    display:grid;
    place-items:center;
    transform:rotate(-8deg)
}
.about-shape:before{
    content:"";
    position:absolute;
    inset:25px;
    border:1px solid #d5dfc3;
    border-radius:50%
}
.about-ring{
    position:absolute;
    width:245px;
    height:245px;
    border:1px solid #b7c99d;
    border-radius:50%
}
.about-ring:before,.about-ring:after{
    content:"";
    position:absolute;
    border-radius:50%;
    background:#8da45f
}
.about-ring:before{
    width:9px;
    height:9px;
    right:14px;
    top:42px
}
.about-ring:after{
    width:6px;
    height:6px;
    left:24px;
    bottom:23px
}
.about-stamp{
    width:158px;
    height:158px;
    display:grid;
    place-content:center;
    text-align:center;
    border:1px solid #91a779;
    border-radius:50%;
    transform:rotate(8deg);
    font:800 18px var(--display);
    letter-spacing:.02em;
    color:#365243
}
.about-stamp small{
    font:700 9px var(--sans);
    letter-spacing:.23em;
    margin-top:6px
}
.about-star{
    position:absolute;
    right:57px;
    top:59px;
    font-size:28px;
    color:#9eaf76;
    transform:rotate(8deg)
}
.about-orbit-dot{
    position:absolute;
    left:25px;
    top:97px;
    width:13px;
    height:13px;
    background:#d2a77a;
    border-radius:50%
}
.about-side-note{
    position:absolute;
    right:0;
    bottom:49px;
    color:#829078;
    font-size:9px;
    line-height:1.7;
    letter-spacing:.16em;
    font-weight:700
}
.about-side-note span{
    color:#9bb25e;
    font-size:18px
}
.about-copy .eyebrow{
    margin-bottom:17px
}
.about-copy h2{
    font-size:49px;
    line-height:1.1;
    margin-bottom:20px
}
.about-copy>p{
    font-size:12px;
    color:#6c776f;
    line-height:1.95;
    max-width:480px;
    margin:0 0 29px
}
.about-points{
    border-top:1px solid #e1e4da
}
.about-points>div{
    display:grid;
    grid-template-columns:43px 1fr;
    align-items:center;
    padding:12px 0;
    border-bottom:1px solid #e1e4da
}
.about-points>div>span{
    font:italic 13px var(--serif);
    color:#92a56a
}
.about-points p{
    margin:0;
    font-size:10px;
    line-height:1.7;
    color:#778078
}
.about-points strong{
    font-size:11px;
    color:#334239
}
.contact-section{
    background:#183d33;
    color:white;
    position:relative;
    overflow:hidden;
    padding:90px 0
}
.contact-section:before{
    content:"";
    position:absolute;
    width:590px;
    height:590px;
    border:1px solid #ffffff12;
    border-radius:50%;
    left:-200px;
    top:-245px
}
.contact-section:after{
    content:"";
    position:absolute;
    width:410px;
    height:410px;
    border:1px solid #ffffff12;
    border-radius:50%;
    left:-110px;
    top:-155px
}
.contact-grid{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:1fr .83fr;
    gap:100px;
    align-items:center
}
.eyebrow-light{
    color:#b9c8ae
}
.eyebrow-light .eyebrow-line{
    background:#b9c8ae
}
.contact-copy h2{
    font-size:54px;
    margin:22px 0 17px;
    color:white
}
.contact-copy h2 em{
    color:#d4e781
}
.contact-copy>p{
    font-size:12px;
    line-height:1.9;
    color:#c1cec6;
    max-width:365px
}
.contact-location{
    display:flex;
    align-items:center;
    gap:12px;
    margin-top:38px
}
.location-icon{
    display:grid;
    place-items:center;
    width:36px;
    height:36px;
    border:1px solid #ffffff3b;
    border-radius:50%;
    color:#d4e781;
    font-size:19px
}
.contact-location small,.contact-location strong{
    display:block
}
.contact-location small{
    font-size:8px;
    letter-spacing:.13em;
    color:#a8baae;
    margin-bottom:4px
}
.contact-location strong{
    font-size:11px
}
.form-card{
    background:#fff;
    color:var(--ink);
    padding:29px 31px 26px;
    border-radius:5px;
    box-shadow:0 18px 50px #102d2530
}
.form-heading{
    display:flex;
    justify-content:space-between;
    font-size:8px;
    font-weight:700;
    letter-spacing:.13em;
    color:#899188
}
.form-step{
    color:#7f984d
}
.form-step i{
    font-style:normal;
    color:#b8beb4
}
.form-card h3{
    font:700 24px var(--display);
    letter-spacing:-.055em;
    margin:19px 0 4px
}
.form-card>p{
    font-size:10px;
    color:#879087;
    margin:0 0 18px
}
.form-card form>label:not(.consent){
    display:block;
    font-size:9px;
    font-weight:700;
    color:#556157;
    margin-bottom:12px
}
.form-card input[type=text],.form-card input[type=tel],.form-card select{
    display:block;
    width:100%;
    height:40px;
    margin-top:6px;
    padding:0 11px;
    border:1px solid #e2e6df;
    background:#fbfcf9;
    border-radius:3px;
    font:10px var(--sans);
    color:#38443d;
    outline:none
}
.form-card input:focus,.form-card select:focus{
    border-color:#9caf77
}
.form-card input::placeholder{
    color:#afb6ae
}
.consent{
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin:6px 0 14px;
    color:#798279;
    font-size:9px;
    line-height:1.5
}
.consent input{
    accent-color:#536f50;
    margin:1px 0 0
}
.button-accent{
    width:100%;
    background:#d8ed8c;
    color:#233329;
    padding:13px 15px;
    font-size:10px
}
.button-accent span{
    font-size:15px
}
.privacy-note{
    display:block;
    text-align:center;
    margin-top:11px;
    color:#98a097;
    font-size:8px
}
.form-message{
    font-size:10px;
    line-height:1.5;
    padding:10px 12px;
    margin:0 0 13px;
    border-radius:3px
}
.is-success{
    background:#edf5df;
    color:#42613c
}
.is-error{
    background:#fbefea;
    color:#92543e
}
.site-footer{
    background:#f7f6f0
}
.footer-top{
    height:91px;
    border-bottom:1px solid #e5e7df;
    display:flex;
    align-items:center;
    justify-content:space-between
}
.brand-footer .brand-mark span{
    background:#174c7b
}
.footer-top>p{
    font:italic 15px var(--serif);
    color:#859078
}
.back-top{
    font-size:10px;
    font-weight:600;
    color:#647066
}
.footer-bottom{
    height:51px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    color:#929a91;
    font-size:9px
}
.footer-bottom a{
    color:#56655a
}
.footer-bottom b{
    color:#91a957;
    padding-left:5px
}

@media(max-width:900px){
    .container{
    width:min(100% - 44px,700px)
}
.hero{
    padding-top:54px
}
.hero-grid{
    grid-template-columns:1fr 1fr;
    min-height:415px
}
.hero h1{
    font-size:51px
}
.hero-art{
    height:400px
}
.art-label{
    transform:scale(.88)
}
.label-top{
    left:-2%;
    top:54px
}
.label-bottom{
    right:-7%;
    bottom:65px
}
.hero-bottom{
    font-size:7px
}
.bottom-line{
    width:25px
}
.solution-grid{
    grid-template-columns:repeat(2,1fr)
}
.solution-card{
    min-height:310px
}
.about-grid{
    gap:44px
}
.about-visual{
    height:350px
}
.about-shape{
    width:290px;
    height:290px
}
.about-ring{
    width:210px;
    height:210px
}
.about-stamp{
    width:140px;
    height:140px
}
.about-copy h2{
    font-size:43px
}
.contact-grid{
    gap:45px
}
.contact-copy h2{
    font-size:48px
}

}

@media(max-width:640px){
    .container{
    width:calc(100% - 38px)
}
.announcement{
    font-size:9px;
    height:33px
}
.nav-wrap{
    height:69px
}
.brand-name{
    font-size:17px
}
.menu-toggle{
    display:flex;
    flex-direction:column;
    gap:5px;
    width:38px;
    height:38px;
    align-items:center;
    justify-content:center;
    background:#e9eddf;
    border:0;
    border-radius:50%;
    z-index:12
}
.menu-toggle span{
    width:15px;
    height:1px;
    background:#294236;
    transition:transform .2s
}
.menu-toggle[aria-expanded=true] span:first-child{
    transform:translateY(3px) rotate(45deg)
}
.menu-toggle[aria-expanded=true] span:last-child{
    transform:translateY(-3px) rotate(-45deg)
}
.main-nav{
    display:none;
    position:absolute;
    top:69px;
    left:0;
    right:0;
    background:#f7f6f0;
    padding:18px 20px 23px;
    border-bottom:1px solid var(--line);
    align-items:stretch;
    gap:0;
    box-shadow:0 15px 25px #263a2410
}
.main-nav.is-open{
    display:flex;
    flex-direction:column
}
.main-nav>a:not(.nav-cta){
    padding:13px 0;
    border-bottom:1px solid #e7e9e1
}
.nav-cta{
    margin-top:14px;
    justify-content:space-between
}
.hero{
    padding-top:43px
}
.hero-grid{
    display:flex;
    flex-direction:column;
    align-items:stretch
}
.hero-copy{
    padding:0
}
.eyebrow{
    font-size:8px
}
.hero h1{
    font-size:49px;
    margin:19px 0 14px
}
.hero-lead{
    font-size:12px;
    max-width:340px
}
.hero-actions{
    gap:17px;
    margin-top:22px
}
.button{
    padding:14px 15px;
    gap:17px
}
.text-link{
    font-size:10px
}
.hero-note{
    margin-top:21px
}
.hero-art{
    height:330px;
    margin-top:0
}
.family-art{
    width:390px;
    max-width:110%;
    bottom:0
}
.orbit-one{
    width:280px;
    height:280px
}
.orbit-two{
    width:230px;
    height:230px
}
.sun{
    width:58px;
    height:58px;
    top:37px;
    right:35px
}
.label-top{
    left:0;
    top:36px;
    transform:scale(.78);
    transform-origin:left top
}
.label-bottom{
    right:-16px;
    bottom:57px;
    transform:scale(.78);
    transform-origin:right bottom
}
.art-caption{
    font-size:10px;
    right:10px;
    bottom:6px
}
.hero-bottom{
    height:auto;
    min-height:54px;
    gap:8px;
    justify-content:center;
    font-size:6px;
    letter-spacing:.08em
}
.hero-bottom span:nth-of-type(n+4){
    display:none
}
.bottom-line{
    width:15px
}
.section{
    padding:69px 0
}
.section-heading{
    display:block;
    margin-bottom:27px
}
.section-heading .eyebrow{
    margin-bottom:13px
}
.section h2{
    font-size:38px
}
.section-heading>p{
    margin-top:12px;
    font-size:11px
}
.solution-grid{
    gap:9px
}
.solution-card{
    min-height:290px;
    padding:15px 13px
}
.card-drawing{
    height:104px
}
.card-copy h3{
    font-size:14px
}
.card-copy p{
    font-size:9px
}
.about{
    padding-top:69px;
    padding-bottom:69px
}
.about-grid{
    display:flex;
    flex-direction:column;
    gap:32px;
    align-items:stretch
}
.about-visual{
    height:280px
}
.about-shape{
    width:245px;
    height:245px
}
.about-shape:before{
    inset:17px
}
.about-ring{
    width:185px;
    height:185px
}
.about-stamp{
    width:120px;
    height:120px;
    font-size:15px
}
.about-star{
    right:39px;
    top:38px
}
.about-side-note{
    right:11px;
    bottom:14px;
    font-size:8px
}
.about-copy h2{
    font-size:42px
}
.about-copy>p{
    font-size:11px
}
.contact-section{
    padding:66px 0
}
.contact-grid{
    grid-template-columns:1fr;
    gap:32px
}
.contact-copy h2{
    font-size:47px;
    margin:18px 0 13px
}
.contact-copy>p{
    font-size:11px
}
.contact-location{
    margin-top:23px
}
.form-card{
    padding:23px 20px
}
.form-card h3{
    font-size:22px
}
.footer-top{
    height:74px
}
.footer-top>p{
    font-size:12px
}
.back-top{
    font-size:9px
}
.footer-bottom{
    height:auto;
    min-height:55px;
    gap:8px;
    flex-wrap:wrap;
    padding:13px 0;
    font-size:8px
}
.footer-bottom span:nth-child(2){
    display:none
}

}

@media(prefers-reduced-motion:reduce){
    html{
    scroll-behavior:auto
}
*,*:before,*:after{
    transition:none!important
}

}

.health-plus{
    font:100px/1 var(--sans);
    color:#7d9a84
}
.health-heart{
    position:absolute;
    font-style:normal;
    font-size:37px;
    color:#d79572;
    right:60px;
    top:36px
}
