:root {
--green:#173F35;
    --cream:#F5F0E6;
    --gold:#C59B5F;
    --white:#fff;
    --char:#202522;
    --muted:#65706b;
    --line:#ded9cf;
    --shadow:0 20px 60px rgba(23,63,53,.12);
    --radius:24px}

* {
box-sizing:border-box;
    margin:0;
    padding:0}

html {
scroll-behavior:smooth}

body {
font-family:"DM Sans",sans-serif;
    color:var(--char);
    background:var(--cream);
    line-height:1.7}

a {
color:inherit;
    text-decoration:none}

button,input,textarea,select {
font:inherit}

.container {
width:min(1180px,92%);
    margin:auto}

.site-header {
position:sticky;
    top:0;
    z-index:100;
    background:rgba(245,240,230,.92);
    backdrop-filter:blur(16px);
    border-bottom:1px solid rgba(23,63,53,.08)}

.navbar {
min-height:78px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px}

.brand {
display:flex;
    align-items:center;
    gap:10px;
    font-size:21px;
    font-weight:600;
    color:var(--green)}

.brand b {
font-family:"Playfair Display";
    font-weight:700}

.brand-icon {
width:38px;
    height:38px;
    display:grid;
    place-items:center;
    background:var(--green);
    color:var(--gold);
    border-radius:12px;
    font-size:22px}

.nav-links {
display:flex;
    align-items:center;
    gap:35px;
    font-size:18px;
    font-weight:600}

.nav-links>a:not(.btn) {
transition:.25s}

.nav-links>a:not(.btn):hover {
color:var(--gold)}

.menu-toggle {
display:none;
    border:0;
    background:none;
    font-size:26px;
    color:var(--green)}

.btn {
display:inline-flex;
    justify-content:center;
    align-items:center;
    border:0;
    border-radius:999px;
    padding:14px 23px;
    font-weight:700;
    cursor:pointer;
    transition:.3s;
    gap:8px}

.btn-gold {
background:var(--gold);
    color:var(--white);
    box-shadow:0 10px 25px rgba(197,155,95,.25)}

.btn-gold:hover {
transform:translateY(-3px);
    filter:brightness(1.05)}

.btn-dark {
background:var(--green);
    color:var(--white)}

.btn-dark:hover {
transform:translateY(-3px)}

.hero {
min-height:calc(100vh - 78px);
    display:flex;
    align-items:center;
    position:relative;
    overflow:hidden;
    background:var(--green);
    color:var(--white)}

.hero:before {
content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(circle at 85% 20%,rgba(197,155,95,.25),transparent 35%),radial-gradient(circle at 15% 85%,rgba(255,255,255,.06),transparent 30%)}

.hero-grid {
display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:70px;
    align-items:center;
    padding:100px 0}

.eyebrow {
font-size:12px;
    letter-spacing:2px;
    font-weight:800;
    color:var(--gold);
    display:inline-block;
    margin-bottom:18px}

.hero h1,h1,h2 {
font-family:"Playfair Display",serif;
    line-height:1.08}

.hero h1 {
font-size:clamp(48px,6vw,78px);
    letter-spacing:-2px}

.hero h1 em,h2 em,h1 em {
color:var(--gold);
    font-style:normal}

.hero-copy>p {
font-size:18px;
    color:#dfe9e4;
    max-width:590px;
    margin:28px 0}

.hero-actions {
display:flex;
    align-items:center;
    gap:28px;
    flex-wrap:wrap}

.text-link {
font-weight:700}

.text-link span {
color:var(--gold);
    font-size:20px}

.hero-trust {
display:flex;
    gap:20px;
    flex-wrap:wrap;
    margin-top:38px;
    font-size:13px;
    color:#c8d8d1}

.hero-card {
background:rgba(255,255,255,.08);
    padding:12px;
    border:1px solid rgba(255,255,255,.13);
    border-radius:28px;
    box-shadow:0 30px 80px rgba(0,0,0,.18)}

.hero-image,.about-photo,.loan-photo {
min-height:510px;
    border-radius:20px;
    background:linear-gradient(145deg,rgba(23,63,53,.05),rgba(197,155,95,.15)),url("https://i.pinimg.com/736x/61/09/0e/61090e6afd27e8edf47abbcba5b10abf.jpg") center/cover}

.image-label {
padding:30px;
    min-height:510px;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    background:linear-gradient(transparent 40%,rgba(23,63,53,.8));
    border-radius:20px}

.image-label small {
letter-spacing:2px;
    color:#ead6b2}

.image-label strong {
font-family:"Playfair Display";
    font-size:32px;
    line-height:1.15;
    margin-top:8px}

.hero-stat {
display:flex;
    gap:20px;
    align-items:center;
    padding:18px 10px 5px}

.hero-stat strong {
color:var(--gold)}

.hero-stat span {
font-size:13px;
    color:#c8d8d1}

.section {
padding:110px 0}

.about {
background:var(--white)}

.two-col {
display:grid;
    grid-template-columns:1fr 1fr;
    gap:90px;
    align-items:center}

.about-visual {
position:relative}

.about-photo {
min-height:560px;
    background-image:url("https://i.pinimg.com/1200x/03/61/ad/0361ad971295e4eceada578388e13c62.jpg")}

.experience-badge {
position:absolute;
    right:-25px;
    bottom:30px;
    background:var(--gold);
    color:var(--white);
    padding:22px 25px;
    border-radius:18px;
    box-shadow:var(--shadow);
    display:flex;
    gap:14px;
    align-items:center}

.experience-badge strong {
font:700 42px "Playfair Display"}

.experience-badge span {
font-size:12px;
    line-height:1.3}

.section-copy h2,.section-heading h2 {
font-size:clamp(38px,4vw,56px);
    margin-bottom:24px}

.section-copy p,.section-heading p {
color:var(--muted);
    margin-bottom:18px}

.check-list {
display:grid;
    gap:10px;
    margin:25px 0 30px;
    color:var(--green);
    font-weight:600}

.values {
background:var(--cream)}

.centered {
text-align:center;
    max-width:760px;
    margin:0 auto 55px}

.value-grid {
display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px}

.value-card {
background:var(--white);
    padding:32px;
    border-radius:var(--radius);
    min-height:240px;
    border:1px solid var(--line);
    transition:.3s}

.value-card:hover,.feature-card:hover,.service-card:hover,.review-card:hover {
transform:translateY(-7px);
    box-shadow:var(--shadow)}

.value-card span {
color:var(--gold);
    font-weight:800}

.value-card h3 {
font:700 25px "Playfair Display";
    margin:20px 0 10px}

.value-card p {
color:var(--muted);
    font-size:14px}

.feature {
background:var(--white)}

.feature-grid,.service-grid,.review-grid {
display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px}

.feature-card {
padding:30px;
    border:1px solid var(--line);
    border-radius:var(--radius);
    transition:.3s}

.feature-icon {
width:50px;
    height:50px;
    border-radius:15px;
    background:var(--cream);
    color:var(--gold);
    display:grid;
    place-items:center;
    font-size:23px;
    margin-bottom:22px}

.feature-card h3,.service-card h3 {
font:700 23px "Playfair Display";
    margin-bottom:8px}

.feature-card p,.service-card p {
font-size:14px;
    color:var(--muted)}

.process {
background:var(--green);
    color:var(--white)}

.process .section-heading p {
color:#c8d8d1}

.process-grid {
display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px}

.process-step {
padding:28px;
    border-left:1px solid rgba(255,255,255,.18);
    position:relative}

.process-step b {
color:var(--gold);
    font-size:14px}

.process-step h3 {
font:700 23px "Playfair Display";
    margin:18px 0 8px}

.process-step p {
color:#c8d8d1;
    font-size:14px}

.services {
background:var(--cream)}

.service-card {
background:var(--white);
    padding:30px;
    border-radius:var(--radius);
    border:1px solid var(--line);
    transition:.3s}

.service-card>div {
font-size:35px;
    margin-bottom:15px}

.loan {
background:var(--white)}

.loan-photo {
min-height:500px;
    background-image:url("https://i.pinimg.com/736x/94/e8/b1/94e8b171b32348132445028405ccd9cb.jpg")}

.loan-visual {
position:relative}

.floating-note {
position:absolute;
    bottom:25px;
    left:-25px;
    background:var(--green);
    color:white;
    padding:20px 24px;
    border-radius:18px;
    display:grid}

.floating-note strong {
font:700 20px "Playfair Display"}

.floating-note span {
font-size:12px;
    color:#c8d8d1}

.booking {
background:var(--cream)}

.booking-grid,.contact-grid {
display:grid;
    grid-template-columns:.8fr 1.2fr;
    gap:70px;
    align-items:center}

.contact-mini {
display:flex;
    gap:15px;
    margin-top:30px}

.contact-mini span {
font-size:25px}

.contact-mini small {
display:block;
    color:var(--muted)}

.form-card {
background:var(--white);
    padding:34px;
    border-radius:var(--radius);
    box-shadow:var(--shadow)}

label {
display:grid;
    gap:7px;
    font-size:13px;
    font-weight:700;
    margin-bottom:18px}

input,textarea,select {
width:100%;
    border:1px solid var(--line);
    background:#fcfbf8;
    border-radius:12px;
    padding:13px 14px;
    outline:none;
    color:var(--char)}

input:focus,textarea:focus,select:focus {
border-color:var(--gold);
    box-shadow:0 0 0 3px rgba(197,155,95,.12)}

textarea {
resize:vertical}

.form-row {
display:grid;
    grid-template-columns:1fr 1fr;
    gap:15px}

.faq {
background:var(--white)}

.faq-grid {
display:grid;
    grid-template-columns:.7fr 1.3fr;
    gap:70px}

.faq-list {
display:grid;
    gap:12px}

.faq-list details {
background:var(--cream);
    border:1px solid var(--line);
    border-radius:16px;
    padding:18px 20px}

.faq-list summary {
font-weight:700;
    cursor:pointer;
    list-style:none;
    position:relative;
    padding-right:25px}

.faq-list summary:after {
content:"+";
    position:absolute;
    right:0;
    color:var(--gold);
    font-size:22px}

.faq-list details[open] summary:after {
content:"−"}

.faq-list p {
color:var(--muted);
    font-size:14px;
    padding-top:12px}

.reviews {
background:var(--cream)}

.review-card {
background:var(--white);
    padding:30px;
    border-radius:var(--radius);
    border:1px solid var(--line);
    transition:.3s}

.stars {
color:var(--gold);
    letter-spacing:2px;
    margin-bottom:18px}

.review-card p {
color:var(--muted);
    font-size:14px;
    margin-bottom:20px}

.review-card strong {
display:block}

.review-card small {
color:var(--muted)}

.contact {
background:var(--green);
    color:var(--white)}

.contact-copy p {
color:#c8d8d1}

.contact-details {
display:grid;
    gap:18px;
    margin-top:30px}

.contact-details>div {
display:flex;
    gap:14px}

.contact-details span {
font-size:20px}

.contact-details p {
margin:0}

.contact-details b {
display:block;
    color:white}

.contact .form-card {
color:var(--char)}

.site-footer {
background:#102c25;
    color:#d6e1dc;
    padding:70px 0 0}

.footer-grid {
display:grid;
    grid-template-columns:1.4fr .8fr .9fr 1.2fr;
    gap:45px;
    padding-bottom:55px}

.footer-brand {
color:white;
    margin-bottom:18px}

.site-footer p {
color:#aebdb7;
    font-size:13px}

.site-footer h4 {
color:white;
    margin-bottom:18px}

.site-footer>div a:not(.brand) {
display:block;
    color:#aebdb7;
    font-size:13px;
    margin:8px 0}

.site-footer a:hover {
color:var(--gold)!important}

.subscribe-form {
display:flex;
    margin:16px 0 8px}

.subscribe-form input {
border-radius:10px 0 0 10px;
    border:0;
    background:white}

.subscribe-form button {
width:50px;
    border:0;
    background:var(--gold);
    color:white;
    border-radius:0 10px 10px 0;
    cursor:pointer}

.unsubscribe {
font-size:11px!important;
    text-decoration:underline}

.footer-bottom {
border-top:1px solid rgba(255,255,255,.1);
    padding:20px 0;
    display:flex;
    justify-content:space-between;
    gap:20px;
    font-size:12px;
    color:#8fa19a}

.footer-bottom span:last-child {
display:flex;
    gap:20px}

.inner-hero {
background:var(--green);
    color:white;
    padding:90px 0}

.inner-hero h1 {
font-size:clamp(45px,6vw,70px)}

.inner-hero p {
color:#c8d8d1;
    margin-top:15px}

.legal {
background:var(--white)}

.narrow {
max-width:850px}

.legal h2 {
font-size:28px;
    margin:35px 0 10px}

.legal p {
color:var(--muted);
    margin-bottom:12px}

.centered-page {
text-align:center;
    min-height:65vh;
    display:grid;
    place-items:center}

.inline-form {
text-align:left;
    max-width:600px;
    margin:30px auto}

.reveal {
opacity:0;
    transform:translateY(22px);
    transition:opacity .7s ease,transform .7s ease}

.reveal.visible {
opacity:1;
    transform:none}

@media(max-width:950px) {
.nav-links {
display:none;
        position:absolute;
        top:78px;
        left:0;
        right:0;
        background:var(--cream);
        padding:20px;
        flex-direction:column;
        align-items:stretch;
        border-bottom:1px solid var(--line)    }

.nav-links.open {
display:flex    }

.menu-toggle {
display:block    }

.hero-grid,.two-col,.booking-grid,.contact-grid,.faq-grid {
grid-template-columns:1fr;
        gap:45px    }

.value-grid {
grid-template-columns:repeat(2,1fr)    }

.process-grid {
grid-template-columns:repeat(2,1fr)    }

.feature-grid,.service-grid,.review-grid {
grid-template-columns:repeat(2,1fr)    }

.footer-grid {
grid-template-columns:repeat(2,1fr)    }

.hero {
min-height:auto    }

.hero-grid {
padding:75px 0    }

.about-photo {
min-height:430px    }

.hero-image {
min-height:430px    }

.image-label {
min-height:430px    }

}

@media(max-width:600px) {
.section {
padding:75px 0    }

.hero h1 {
font-size:46px    }

.hero-grid {
padding:60px 0    }

.value-grid,.process-grid,.feature-grid,.service-grid,.review-grid,.footer-grid,.form-row {
grid-template-columns:1fr    }

.two-col {
gap:35px    }

.experience-badge {
right:10px    }

.floating-note {
left:10px    }

.footer-bottom {
flex-direction:column    }

.footer-bottom span:last-child {
flex-direction:column;
        gap:5px    }

.nav-cta {
display:none    }

.hero-trust {
font-size:11px;
        gap:10px    }

.form-card {
padding:23px    }

}