* {
    box-sizing:border-box}

html {
    scroll-behavior:smooth;
    scroll-padding-top:94px}

body {
    margin:0;
    background:#fff;
    color:#25231f;
    font-family:'Manrope',sans-serif;
    font-size:16px;
    line-height:1.65}

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

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

img {
    max-width:100%;
    display:block}

.container {
    width:min(1380px,calc(100% - 80px));
    margin:auto}

h1,h2,h3,p {
    margin-top:0}

h1,h2,.value-quote {
    font-family:'Playfair Display',Georgia,serif;
    font-weight:500;
    letter-spacing:-.035em;
    line-height:1.15}

h1 {
    font-size:clamp(54px,5.6vw,90px)}

h2 {
    font-size:clamp(38px,3.5vw,57px);
    margin-bottom:20px}

h3 {
    font-size:19px;
    line-height:1.3}

.eyebrow {
    color:#956b49;
    letter-spacing:.24em;
    font-size:12px;
    font-weight:800;
    margin-bottom:14px}

.btn {
    border:none;
    border-radius:7px;
    display:inline-flex;
    justify-content:center;
    align-items:center;
    gap:22px;
    background:#976b47;
    color:white;
    padding:15px 24px;
    font-size:14px;
    font-weight:800;
    white-space:nowrap;
    cursor:pointer;
    transition:.25s}

.btn:hover {
    background:#704629;
    transform:translateY(-2px)}

.btn-outline {
    background:rgba(255,255,255,.85);
    color:#7d5638;
    border:1px solid #a98567}

.btn-outline:hover {
    color:white}

.topbar {
    background:#936944;
    color:#fff;
    font-size:12px}

.topinner {
    display:flex;
    justify-content:space-between;
    gap:20px;
    padding:7px 0}

.site-header {
    position:sticky;
    top:0;
    z-index:30;
    background:rgba(255,255,255,.97);
    box-shadow:0 2px 15px #0000000a}

.nav {
    height:82px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px}

.logo {
    display:flex;
    align-items:center;
    gap:10px;
    flex-shrink:0}

.logo-star {
    font-size:43px;
    line-height:1;
    color:#9d744e;
    transform:rotate(-12deg)}

.logo b {
    display:block;
    line-height:1;
    font-size:23px;
    letter-spacing:.06em}

.logo small {
    display:block;
    font-size:10px;
    letter-spacing:.3em;
    font-weight:800;
    margin-top:5px}

.nav nav {
    display:flex;
    align-items:center;
    gap:24px}

.nav nav a {
    font-size:13px;
    font-weight:750;
    white-space:nowrap;
    transition:.2s}

.nav nav a:hover,.nav nav a.active {
    color:#9b6b43}

.menu-toggle {
    display:none;
    border:0;
    background:none;
    font-size:29px}

.hero {
    min-height:675px;
    position:relative;
    overflow:hidden;
    background:#f6f3ee;
    display:flex;
    flex-direction:column;
    justify-content:space-between}

.hero-photo {
    position:absolute;
    inset:0 0 0 38%;
    background:url('https://images.pexels.com/photos/6249432/pexels-photo-6249432.jpeg?auto=compress&cs=tinysrgb&w=2000') center center/cover no-repeat}

.hero-shade {
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,#fff 0%,#fffffff5 29%,#ffffffb5 45%,#ffffff00 78%)}

.hero-content {
    position:relative;
    z-index:1;
    padding-top:125px;
    padding-bottom:90px}

.hero-content h1 {
    max-width:780px;
    color:#362013;
    margin-bottom:24px}

.hero-content h1 em {
    font-style:normal;
    color:#8c5e3e}

.hero-content p {
    font-size:19px;
    line-height:1.7;
    max-width:540px;
    color:#4b4b4b}

.hero-actions {
    display:flex;
    gap:15px;
    margin-top:30px}

.hero-features {
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    background:#ffffffee;
    margin-bottom:24px;
    box-shadow:0 9px 35px #24160917}

.hero-features>div {
    min-height:94px;
    display:flex;
    justify-content:center;
    align-items:center;
    gap:17px;
    border-right:1px solid #e6dbd0;
    color:#966a48;
    font-size:36px}

.hero-features>div:last-child {
    border:0}

.hero-features span {
    font-size:14px;
    color:#2b2927;
    line-height:1.35;
    font-weight:800}

.section {
    padding:100px 0}

.section-small {
    padding:70px 0}

.section-header {
    display:flex;
    justify-content:space-between;
    align-items:end;
    gap:25px;
    margin-bottom:34px}

.section-header h2 {
    margin-bottom:14px}

.section-header p {
    max-width:660px;
    font-size:16px;
    color:#67625e;
    margin:0}

.text-link {
    color:#94633e;
    font-size:14px;
    font-weight:800;
    white-space:nowrap}

.product-grid,.projects-grid {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:18px}

.product-card,.project-card,.service-card {
    background:white;
    box-shadow:0 6px 30px #2525250e;
    border:1px solid #ebe7e1;
    border-radius:8px;
    overflow:hidden;
    transition:.25s}

.product-card:hover,.project-card:hover,.service-card:hover {
    transform:translateY(-5px);
    box-shadow:0 12px 32px #2525251a}

.product-card img {
    height:190px;
    width:100%;
    object-fit:cover}

.card-info {
    padding:16px;
    position:relative}

.card-info h3 {
    font-size:15px;
    margin-bottom:9px;
    padding-right:20px}

.card-info p {
    color:#77716d;
    font-size:12px;
    line-height:1.5;
    margin:0}

.card-info>a {
    position:absolute;
    right:10px;
    top:13px;
    border:1px solid #d9baa0;
    color:#94633e;
    width:24px;
    height:24px;
    display:grid;
    place-items:center;
    border-radius:50%}

.about {
    display:grid;
    grid-template-columns:1fr 1.05fr;
    min-height:530px;
    background:#f9f8f6}

.about-image img {
    height:100%;
    width:100%;
    object-fit:cover}

.about-copy {
    align-self:center;
    max-width:730px;
    padding:65px clamp(35px,5vw,90px)}

.about-copy p {
    max-width:580px;
    color:#67625e;
    font-size:17px}

.benefits {
    display:flex;
    gap:28px;
    flex-wrap:wrap;
    margin:34px 0}

.benefits>div {
    display:flex;
    align-items:center;
    gap:10px;
    font-size:13px;
    font-weight:800;
    line-height:1.4}

.benefits b {
    color:#9a6846;
    font-size:29px}

.center-heading {
    text-align:center;
    max-width:850px;
    margin:0 auto 43px}

.center-heading p {
    color:#76706b}

.services {
    background:#fcfaf8}

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

.service-card img {
    width:100%;
    height:210px;
    object-fit:cover}

.service-card>div {
    padding:22px}

.service-card p {
    font-size:14px;
    color:#756c66;
    min-height:48px}

.service-card a {
    color:#956943;
    font-size:14px;
    font-weight:800}

.stats {
    background:#eee8e1;
    padding:37px 0}

.stats-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr)}

.stats-grid>div {
    display:flex;
    justify-content:center;
    align-items:center;
    gap:16px;
    border-right:1px solid #d6c8ba}

.stats-grid>div:last-child {
    border:0}

.stats strong {
    color:#805031;
    font-size:37px;
    line-height:1}

.stats span {
    font-size:13px;
    font-weight:800;
    line-height:1.4}

.project-card img {
    width:100%;
    height:150px;
    object-fit:cover}

.project-card h3 {
    font-size:14px;
    margin:0;
    padding:12px}

.photo-note,.fine-print {
    font-size:12px;
    color:#79716a;
    margin:15px 0 0}

.process {
    background:#faf7f3}

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

.process-grid>div {
    position:relative;
    padding:0 16px 0 63px}

.process-grid b {
    position:absolute;
    left:0;
    top:0;
    width:47px;
    height:47px;
    border-radius:50%;
    background:#f0e6db;
    display:grid;
    place-items:center;
    color:#a16a44}

.process-grid h3 {
    margin-bottom:8px}

.process-grid p {
    font-size:14px;
    color:#77706a}

.two-col {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:85px}

.feedback p {
    color:#77706a}

.value-quote {
    font-size:clamp(30px,3vw,46px);
    color:#92663f;
    margin:45px 0}

.faq details {
    border:1px solid #e9e0d8;
    border-radius:5px;
    padding:15px 20px;
    margin-top:10px}

.faq summary {
    cursor:pointer;
    font-weight:800;
    font-size:14px}

.faq details p {
    font-size:14px;
    margin:15px 0 0}

.quote-banner {
    background:linear-gradient(90deg,#25150de8,#583b29a8),url('https://images.pexels.com/photos/6249432/pexels-photo-6249432.jpeg?auto=compress&cs=tinysrgb&w=2000') center/cover;
    padding:43px 0;
    color:#fff}

.quote-content {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px}

.quote-content h2 {
    margin:0 0 8px}

.quote-content p {
    margin:0}

.quote-banner .eyebrow {
    color:#efd5bb}

.btn-light {
    background:#fff;
    color:#845333}

.btn-light:hover {
    background:#e9d9c7;
    color:#704629}

.contact-section {
    background:#f8f6f3}

.contact-grid {
    display:grid;
    grid-template-columns:1fr 1.35fr .85fr;
    align-items:stretch;
    min-height:425px}

.contact-copy {
    padding:65px 26px 65px 0}

.contact-copy p {
    color:#70675e}

.contact-detail {
    font-weight:700;
    margin-top:24px;
    color:#845333;
    overflow-wrap:anywhere}

.contact-form {
    align-self:center;
    padding:32px;
    background:white;
    box-shadow:0 7px 40px #0000000d;
    border-radius:9px;
    margin:35px 28px 35px 0}

.contact-form label {
    font-size:12px;
    font-weight:800;
    color:#655a50;
    display:block;
    margin-bottom:14px}

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

.contact-form input,.contact-form textarea,.contact-form select {
    display:block;
    width:100%;
    margin-top:7px;
    border:1px solid #e3ddd5;
    border-radius:5px;
    padding:11px 13px;
    font-size:14px;
    background:#fff;
    color:#333}

.contact-form input:focus,.contact-form textarea:focus,.contact-form select:focus {
    outline:2px solid #c4a182}

.full {
    width:100%}

.form-status {
    font-size:12px;
    margin:8px 0 0}

.contact-photo {
    background:url('https://images.pexels.com/photos/14183118/pexels-photo-14183118.jpeg?auto=compress&cs=tinysrgb&w=2000') center/cover}

.footer {
    background:#181818;
    color:white}

.footer-grid {
    padding:60px 0;
    display:grid;
    grid-template-columns:1.5fr repeat(4,1fr);
    gap:38px}

.footer p {
    max-width:270px;
    font-size:13px;
    color:#bbb;
    line-height:1.8;
    margin-top:20px}

.footer h3 {
    font-family:'Manrope',sans-serif;
    font-size:14px;
    font-weight:800}

.footer-grid>div>a:not(.logo) {
    display:block;
    font-size:13px;
    color:#bbb;
    margin:10px 0}

.footer-grid a:hover {
    color:#c9a37b}

.footer-logo b,.footer-logo small {
    color:#fff}

.copyright {
    border-top:1px solid #333;
    padding:20px 0;
    display:flex;
    justify-content:space-between;
    font-size:12px;
    color:#aaa}

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

.reveal.visible {
    opacity:1;
    transform:translateY(0)}

@media(max-width:1200px) {
    .nav nav {
    gap:13px}

.nav nav a {
    font-size:12px}

.product-grid,.projects-grid {
    grid-template-columns:repeat(3,1fr)}

.product-card img {
    height:220px}

.contact-grid {
    grid-template-columns:1fr 1.4fr}

.contact-photo {
    display:none}

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

}

@media(max-width:860px) {
    .container {
    width:min(100% - 34px,700px)}

.topbar {
    display:none}

.nav {
    height:74px}

.menu-toggle {
    display:block;
    margin-left:auto}

.nav nav {
    position:absolute;
    top:74px;
    left:0;
    right:0;
    background:white;
    padding:20px 25px;
    box-shadow:0 20px 25px #0002;
    display:none;
    flex-direction:column;
    align-items:start;
    gap:18px}

.nav nav.open {
    display:flex}

.header-cta {
    display:none}

.hero {
    min-height:700px}

.hero-photo {
    inset:0;
    background-position:60% center;
    opacity:.65}

.hero-shade {
    background:linear-gradient(90deg,#fffffff5,#ffffffa8 72%,#ffffff70)}

.hero-content {
    padding-top:95px;
    padding-bottom:50px}

.hero-content p {
    max-width:550px}

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

.hero-features>div {
    border-bottom:1px solid #e6dbd0}

.section {
    padding:72px 0}

.about {
    grid-template-columns:1fr}

.about-image {
    height:370px}

.about-copy {
    max-width:none;
    padding:55px 30px}

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

.two-col {
    grid-template-columns:1fr;
    gap:45px}

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

.contact-grid {
    grid-template-columns:1fr}

.contact-copy {
    padding-bottom:0}

.contact-form {
    margin:25px 0 45px}

.stats-grid {
    grid-template-columns:repeat(2,1fr);
    row-gap:20px}

.stats-grid>div:nth-child(2) {
    border:0}

}

@media(max-width:550px) {
    body {
    font-size:15px}

.container {
    width:calc(100% - 32px)}

h1 {
    font-size:clamp(43px,11vw,58px)}

h2 {
    font-size:37px}

.logo b {
    font-size:18px}

.logo-star {
    font-size:36px}

.hero {
    min-height:690px}

.hero-content {
    padding-top:86px}

.hero-content p {
    font-size:16px}

.hero-actions {
    flex-direction:column;
    align-items:flex-start}

.hero-features>div {
    font-size:24px;
    gap:10px;
    min-height:76px}

.hero-features span {
    font-size:11px}

.section-header {
    display:block}

.section-header .text-link {
    display:inline-block;
    margin-top:16px}

.product-grid,.projects-grid,.service-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px}

.product-card img {
    height:140px}

.card-info {
    padding:10px}

.card-info h3 {
    font-size:14px}

.card-info p {
    font-size:11px}

.service-card img {
    height:125px}

.service-card>div {
    padding:14px}

.service-card h3 {
    font-size:16px}

.service-card p {
    font-size:12px}

.project-card img {
    height:110px}

.project-card h3 {
    font-size:12px}

.about-image {
    height:270px}

.about-copy {
    padding:45px 19px}

.benefits {
    gap:17px}

.process-grid {
    grid-template-columns:1fr}

.quote-content {
    display:block}

.quote-content .btn {
    margin-top:25px}

.form-row {
    grid-template-columns:1fr;
    gap:0}

.contact-form {
    padding:20px}

.footer-grid {
    grid-template-columns:1fr 1fr;
    gap:25px}

.footer-grid>div:first-child {
    grid-column:1/-1}

.copyright {
    gap:15px;
    flex-wrap:wrap}

}

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

.reveal {
    opacity:1;
    transform:none}

}

/* Increased legibility for the premium typography */
.product-card .card-info p,.service-card p,.process-grid p,.faq details p,.footer-grid>div>a:not(.logo) {
    font-size:15px;
    line-height:1.65}

.product-card .card-info h3,.project-card h3 {
    font-size:17px}

@media(max-width:550px) {
    .card-info p,.service-card p {
    font-size:13px!important;
    line-height:1.5}

.card-info h3,.project-card h3 {
    font-size:15px!important}

}

/* Official brand assets and contact strip;
     original white-and-bronze palette retained. */
.logo img  {
    
    width: 198px;
    max-width: 100%;
    height: 67px;
    object-fit: contain;
    object-position: left center;
}

.footer-logo img  {
    
    width: 205px;
    height: 83px;
}

.topinner  {
    
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.topinner a  {
    
    font-size: 12px;
    font-weight: 650;
}

.topinner a:hover  {
    
    text-decoration: underline;
}

.contact-detail  {
    
    line-height: 1.6;
}

@media (max-width: 860px)  {
    
    .logo img  {
     width: 174px;
     height: 60px;
     }

}