/* NS Constructions – shared styles. Edit colours in :root / [data-theme=light]. */
:root{--bg:#0c0b09;--bg2:#161410;--tx:#f4efe6;--mut:#a89f8d;--gold:#c9a24b;--ink:#0c0b09;--line:#2b2820;--glass:rgba(22,20,16,.72);--r:6px}
[data-theme=light]{--bg:#faf8f3;--bg2:#fff;--tx:#17150f;--mut:#6b6455;--gold:#9a7424;--ink:#fff;--line:#e4dcc9;--glass:rgba(255,255,255,.78)}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}
body{font:16px/1.65 Jost,system-ui,sans-serif;background:var(--bg);color:var(--tx);transition:background .35s,color .35s}
h1,h2,h3{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;line-height:1.1}
h1{font-size:clamp(2.6rem,7vw,5rem)}h2{font-size:clamp(2rem,4vw,3rem)}h3{font-size:1.5rem}
a{color:inherit;text-decoration:none}img{max-width:100%}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.wrap{width:min(1180px,92%);margin:auto}.sec{padding:84px 0}.alt{background:var(--bg2)}
.sub{color:var(--mut);max-width:60ch;margin:12px 0 36px}
.grid{display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
.property-filters{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}



/*button*/
.btn {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    padding: 12px 26px;

    border: 1px solid var(--gold);
    background: linear-gradient(
        135deg,
        var(--gold),
        #f5d98a,
        var(--gold)
    );

    color: var(--ink);
    border-radius: var(--r);
    font: inherit;
    font-weight: 600;
    letter-spacing: 0.4px;

    cursor: pointer;
    position: relative;
    overflow: hidden;

    box-shadow:
        0 4px 15px rgba(212, 175, 55, 0.25),
        0 0 8px rgba(212, 175, 55, 0.12);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease,
        color 0.3s ease;
}

/* Premium hover effect */
.btn:hover {
    transform: translateY(-3px) scale(1.03);

    box-shadow:
        0 8px 25px rgba(212, 175, 55, 0.4),
        0 0 18px rgba(212, 175, 55, 0.35),
        0 0 35px rgba(212, 175, 55, 0.12);
}

/* Click effect */
.btn:active {
    transform: translateY(0) scale(0.97);
}

/* Outline button */
.btn.o {
    background: transparent;
    color: var(--gold);

    box-shadow:
        0 0 10px rgba(212, 175, 55, 0.08);
}

/* Outline hover glow */
.btn.o:hover {
    background: var(--gold);
    color: var(--ink);

    box-shadow:
        0 0 15px rgba(212, 175, 55, 0.5),
        0 0 30px rgba(212, 175, 55, 0.25);
}



.top{background:#000;color:#cfc7b4;font-size:.85rem;padding:6px 0}.top .wrap{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
header.nav{position:sticky;top:0;z-index:50;background:var(--glass);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
header .wrap{display:flex;align-items:center;justify-content:space-between;height:72px;gap:16px}
.logo{font-family:'Cormorant Garamond',serif;font-size:1.5rem;font-weight:700;line-height:1}.logo b{color:var(--gold)}.logo small{display:block;font:400 .65rem Jost;color:var(--mut)}
nav ul{display:flex;gap:28px;list-style:none;padding:0}
nav a{position:relative;padding:6px 0}nav a::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--gold);transition:width .3s}
nav a:hover::after,nav a[aria-current]::after{width:100%}
.ibtn{background:none;border:1px solid var(--line);color:var(--tx);width:40px;height:40px;border-radius:50%;cursor:pointer;font-size:1.05rem}
.theme-icon,.menu-icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;display:block}
.theme-icon-dark{display:none}
[data-theme="light"] .theme-icon-light{display:none}
[data-theme="light"] .theme-icon-dark{display:block}
.burger{display:none}
@media(max-width:880px){.burger{display:block}.cta-nav{padding:7px 10px;font-size:.78rem;white-space:nowrap}
nav{position:absolute;top:72px;left:0;right:0;background:var(--bg2);max-height:0;overflow:hidden;transition:max-height .35s}
nav.open{max-height:360px;border-bottom:1px solid var(--line)}nav ul{flex-direction:column;padding:18px 6%;gap:14px}}
@media(max-width:480px){header .wrap{gap:8px}.logo{font-size:1.1rem;gap:6px!important}.logo img{max-height:36px!important}.logo small{display:none}.nav .wrap>div{gap:5px!important}.cta-nav{padding:6px 8px;font-size:.72rem}.ibtn{width:36px;height:36px;flex:0 0 36px}}
.hero{position:relative;min-height:calc(100vh - 110px);display:grid;align-items:center;overflow:hidden;color:#f4efe6}
.hero.sm{min-height:380px}
.about-hero{background-image:linear-gradient(rgba(0,0,0,.6),rgba(0,0,0,.6)),url("../company.jpg");background-size:cover;background-position:center}
.hero.about-hero::before{background:rgba(0,0,0,.12)}
.slide{position:absolute;inset:0;opacity:0;transition:opacity 1.2s;background-size:cover;background-position:center}.slide.on{opacity:1}
.hero::before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(90deg,rgba(0,0,0,.85),rgba(0,0,0,.35))}
.hero .wrap{position:relative;z-index:3;padding:60px 0}.hero p{max-width:52ch;margin:18px 0 28px;color:#d8d0bd}
.hero h1{animation:rise 1s both}.hero p,.hero .acts{animation:rise 1s .25s both}
@keyframes rise{from{opacity:0;transform:translateY(26px)}}
.tag{display:inline-block;margin-bottom:14px;padding:4px 14px;border:1px solid var(--gold);border-radius:99px;color:var(--gold);font-size:.85rem}
.ctl{position:absolute;z-index:4;bottom:28px;right:4%;display:flex;gap:10px;align-items:center}
.ctl .ibtn{color:#fff;border-color:#fff6}.dots{display:flex;gap:8px}.dots button{width:10px;height:10px;border-radius:50%;border:0;background:#fff6;cursor:pointer;transition:width .3s}.dots .on{background:var(--gold);width:26px;border-radius:6px}
.slabel{position:absolute;z-index:4;bottom:34px;left:4%;color:var(--gold);font-family:'Cormorant Garamond',serif;font-size:1.4rem}
.ph{background:linear-gradient(135deg,var(--c1,#3a2f17),var(--c2,#0c0b09))}
.properties-hero{min-height:440px;background:none;isolation:isolate;place-items:center}
.properties-hero::before{z-index:1;background:rgba(0,0,0,.6)}
.properties-hero__grid{position:absolute;inset:0;z-index:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:hidden}
.properties-hero__grid img{display:block;width:100%;height:100%;min-height:0;object-fit:cover}
.properties-hero__content{z-index:2;padding:50px 0!important;text-align:center}
.properties-hero__content h1,.properties-hero__content p{color:#fff}
.properties-hero__content p{max-width:62ch;margin:18px auto 0}
@media(max-width:700px){.properties-hero{min-height:500px}.properties-hero__grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}.properties-hero__grid img{min-height:0}.properties-hero__content{padding:36px 0!important}}
.search{margin-top:-50px;position:relative;z-index:5}
.search form{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));padding:22px;background:var(--glass);backdrop-filter:blur(16px);border:1px solid var(--line);border-radius:10px;box-shadow:0 20px 50px #0006}
label{font-size:.85rem;color:var(--mut);display:grid;gap:4px}
input,select,textarea{font:inherit;padding:11px 12px;background:var(--bg);color:var(--tx);border:1px solid var(--line);border-radius:var(--r);width:100%}
.card{background:var(--bg2);border:1px solid var(--line);border-radius:10px;overflow:hidden;display:flex;flex-direction:column;transition:transform .3s,box-shadow .3s,border-color .3s}
.card:hover{transform:translateY(-6px);box-shadow:0 18px 40px #0005;border-color:var(--gold)}
.card .im{width:100%;height:200px;overflow:hidden;position:relative}.card .im .ph{height:100%;transition:transform .6s}.card:hover .im .ph{transform:scale(1.07)}
.card .im .property-card-image{display:block;width:100%;height:100%;object-fit:cover;border-radius:10px 10px 0 0;transition:transform .6s}
.card:hover .im .property-card-image{transform:scale(1.04)}
.badge{position:absolute;top:12px;left:12px;z-index:1;background:#000c;color:var(--gold);padding:3px 12px;border-radius:99px;font-size:.8rem}
.card .bd{padding:18px;display:grid;gap:8px;flex:1}.price{color:var(--gold);font-size:1.25rem;font-weight:600}
.meta{display:flex;flex-wrap:wrap;gap:6px 16px;color:var(--mut);font-size:.88rem}.acts{display:flex;gap:10px;flex-wrap:wrap}.card .acts{margin-top:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center}.card .acts>a:last-child{grid-column:1/-1}
.card .acts .property-action{width:100%;padding:8px 10px;background:var(--gold);background-image:none;color:var(--ink);border-color:var(--gold);box-shadow:0 0 15px rgba(255,193,7,.48);transition:box-shadow .25s ease,transform .25s ease}
.card .acts .property-action:hover{background:var(--gold);color:var(--ink);box-shadow:0 0 25px rgba(255,193,7,.78);transform:translateY(-3px)}
.btn.s{padding:8px 14px;font-size:.88rem}
.nav .cta-nav{display:inline-flex!important;flex:0 0 auto;visibility:visible;opacity:1;background:#f2c94c!important;background-image:none!important;color:#17150f!important;border:1px solid #f2c94c;box-shadow:0 3px 12px rgba(242,201,76,.4);position:relative;z-index:2}
.nav .cta-nav:hover{background:#ffdc70!important;color:#17150f!important}
.split{display:grid;gap:40px;grid-template-columns:1fr 1fr;align-items:center}@media(max-width:800px){.split{grid-template-columns:1fr}}
.feat{padding:26px;border:1px solid var(--line);border-radius:10px;background:var(--bg2)}.feat i{font-style:normal;font-size:1.8rem}
.quote{border-left:3px solid var(--gold);padding:8px 0 8px 22px;color:var(--mut)}
.cta{background:linear-gradient(120deg,#000,#2a210f);color:#f4efe6;text-align:center;padding:70px 0}.cta p{margin:12px 0 26px;color:#cfc7b4}
.tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}.tabs .btn.on{background:var(--gold);color:var(--ink)}
.empty{grid-column:1/-1;text-align:center;padding:50px;border:1px dashed var(--line);border-radius:10px;color:var(--mut)}
#development .svcA{background:#fdfbf7;color:#1a1a1a;border:1px solid #d7bd78;padding:40px;border-radius:10px;box-shadow:0 10px 30px rgba(92,70,20,.12);transition:transform .3s ease,box-shadow .3s ease}
#development .svcA h2,#development .svcA p{color:#1a1a1a}
#development .svcA:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(92,70,20,.2)}
#development .svcA .btn{background:var(--gold);background-image:none;color:#17150f;border-color:var(--gold);box-shadow:0 4px 15px rgba(212,175,55,.42),0 0 14px rgba(255,193,7,.36);transition:transform .3s ease,box-shadow .3s ease}
#development .svcA .btn:hover{background:#f2c94c;color:#17150f;box-shadow:0 8px 24px rgba(212,175,55,.52),0 0 22px rgba(255,193,7,.58);transform:translateY(-3px)}
.svcB .feat{border-top:3px solid var(--gold)}#rental .feat{box-shadow:0 4px 6px rgba(0,0,0,.05);transition:all .3s ease}#rental .feat:hover{transform:translateY(-5px);box-shadow:0 12px 24px rgba(0,0,0,.12)}.svcC{background:var(--gold);color:#0c0b09;padding:40px;border-radius:10px}.svcC .btn{background:#0c0b09;color:#c9a24b;border-color:#0c0b09}
.stat{font:600 3rem 'Cormorant Garamond',serif;color:var(--gold)}
.about-stat.rv{transition:all .3s ease}
.about-stat.rv:hover{background:#ffc107;color:#111;box-shadow:0 0 20px rgba(255,255,255,.9);transform:translateY(-5px)}
.about-stat:hover .stat,.about-stat:hover .note{color:#111}
.about-principles .feat.rv{transition:all .3s ease}
.about-principles .feat.rv:hover{background:#ffc107;color:#111;box-shadow:0 0 20px rgba(255,255,255,.9);transform:translateY(-5px)}
.about-principles .feat:hover h3,.about-principles .feat:hover .note{color:#111}
.about-gallery .gallery-image{display:block;width:100%;height:230px;object-fit:cover;border-radius:10px}
dialog{max-width:540px;width:92%;background:var(--bg2);color:var(--tx);border:1px solid var(--gold);border-radius:10px;padding:26px;margin:auto}dialog::backdrop{background:#000a}
.err{color:#e0675a;font-size:.82rem;min-height:1em}.msg{padding:14px;border-radius:var(--r);margin-top:14px}.msg.ok{background:#1f4d2e;color:#d6f5df}.msg.bad{background:#5a2420;color:#ffe1dd}
details{border-bottom:1px solid var(--line);padding:14px 0}summary{cursor:pointer;font-weight:500}
.note{font-size:.82rem;color:var(--mut)}
footer{background:#000;color:#cfc7b4;padding:64px 0 24px}footer .grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}footer h4{color:var(--gold);margin-bottom:10px;font-weight:500}
footer li{list-style:none;margin:6px 0}footer ul{padding:0}footer a:hover{color:var(--gold)}.copy{border-top:1px solid #2b2820;margin-top:36px;padding-top:18px;font-size:.85rem}
.wa{position:fixed;right:20px;bottom:20px;z-index:60;width:56px;height:56px;border-radius:50%;background:#25d366;color:#fff;display:grid;place-items:center;font-size:1.6rem;box-shadow:0 8px 24px #0006;transition:transform .25s}.wa:hover{transform:scale(1.1)}
#up{position:fixed;right:24px;bottom:90px;z-index:60;opacity:0;pointer-events:none;transition:opacity .3s,transform .25s;width:44px;height:44px;padding:0;justify-content:center}#up.show{opacity:1;pointer-events:auto}
.rv{opacity:0;transform:translateY(22px);transition:opacity .7s,transform .7s}.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.rv{opacity:1;transform:none}}


/* Slider Container */
#slider {
    position: relative;
    width: 100%;
    height: 80vh;
    min-height: 400px;
    overflow: hidden;
    color: white;
}

/* Background Images */
#slider .slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.8s ease-in-out;
    z-index: 0;
}

#slider .slide.on {
    opacity: 1;
}

/* Main Content */
#slider .wrap {
    position: relative;
    z-index: 2;
}

/* Slide Title - Right Side Center */
#slider .slabel {
    position: absolute;
    right: 100px;
    top: 50%;
    transform: translateY(-50%);

    z-index: 3;
    text-align: right;
    color: #c69a35;
    font-size: 24px;
}

/* Slider Buttons and Dots - Right Side Center */
#slider .ctl {
    position: absolute;
    right: 24px;
    top: 50%;
    bottom: auto;
    left: auto;
    transform: translateY(-50%);

    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;

    z-index: 5;
}

/* Dots */
#slider .dots {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}

#slider .dots button {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 1px solid white;
    background: transparent;
    cursor: pointer;
}

#slider .dots button.on {
    background: white;
}

/* Previous / Next Buttons */
#slider .ibtn {
    width: 44px;
    height: 44px;
    border: 1px solid rgba(255, 255, 255, 0.65);
    border-radius: 50%;
    background: transparent;
    color: white;
    font-size: 24px;
    cursor: pointer;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    #slider .slabel {
        right: 75px;
        font-size: 18px;
    }

    #slider .ctl {
        right: 12px;
        gap: 8px;
    }

    #slider .ibtn {
        width: 36px;
        height: 36px;
    }
}



/* =========================================
   NS CONSTRUCTIONS - PROPERTY GRID
   Existing black & gold theme preserved
========================================= */

/* Featured Properties Section */
.s {
    padding: 85px 0;
    background: var(--bg);
}

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

.s h2 {
    margin-bottom: 12px;
    color: var(--tx);
}

.s .sub {
    color: var(--mut);
    margin-bottom: 32px;
}

/* Responsive Property Grid */
#r-feat {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 26px;
    width: 100%;
    align-items: stretch;
}

/* Property Card Box */
.property-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100%;
    overflow: hidden;

    background: var(--bg2);
    border: 1px solid var(--line);
    border-radius: 12px;

    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);

    transition:
        transform 0.35s ease,
        border-color 0.35s ease,
        box-shadow 0.35s ease;
}

/* Premium Hover Effect */
.property-card:hover {
    transform: translateY(-8px);
    border-color: var(--gold);

    box-shadow:
        0 18px 40px rgba(0, 0, 0, 0.3),
        0 0 18px rgba(201, 162, 75, 0.12);
}

/* Image Container */
.property-card .property-image {
    display: block;
    width: 100%;
    height: 240px;
    flex-shrink: 0;

    object-fit: cover;
    object-position: center;

    transition: transform 0.55s ease;
}

/* Image Zoom */
.property-card:hover .property-image {
    transform: scale(1.05);
}

/* Keep Image Inside Card */
.property-card {
    isolation: isolate;
}

.property-card .property-image {
    position: relative;
    z-index: -1;
}

/* Property Details Box */
.property-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;

    flex: 1;
    padding: 22px;
}

/* Property Title */
.property-content h3 {
    color: var(--tx);
    font-size: 1.55rem;
    line-height: 1.2;
    margin: 0;
}

/* Location */
.property-location {
    color: var(--mut);
    font-size: 0.92rem;
    margin: 0;
}

/* Property Description */
.property-content > p:not(.property-location):not(.property-price) {
    color: var(--mut);
    font-size: 0.95rem;
    margin: 0;
}

/* Price */
.property-price {
    color: var(--gold);
    font-size: 1.05rem;
    margin: 2px 0 4px;
}

.property-price strong {
    font-weight: 600;
}

/* Enquire Button */
.property-card .enquire-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    margin-top: auto;
    padding: 11px 18px;
    width: 100%;

    background: transparent;
    color: var(--gold);
    border: 1px solid var(--gold);
    border-radius: 6px;

    font: inherit;
    font-weight: 500;
    text-align: center;

    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease,
        box-shadow 0.3s ease;
}

.property-card .enquire-btn:hover {
    background: var(--gold);
    color: var(--ink);
    transform: translateY(-2px);
    box-shadow: 0 5px 18px rgba(201, 162, 75, 0.2);
}

/* Tablet: 2 Cards Per Row */
@media (max-width: 950px) {
    #r-feat {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 22px;
    }

    .property-card .property-image {
        height: 220px;
    }
}

/* Mobile: 1 Card Per Row */
@media (max-width: 600px) {
    .s {
        padding: 55px 0;
    }

    .s .w {
        width: 92%;
    }

    #r-feat {
        grid-template-columns: minmax(0, 1fr);
        gap: 22px;
    }

    .property-card .property-image {
        height: 235px;
    }

    .property-content {
        padding: 20px;
        gap: 10px;
    }

    .property-content h3 {
        font-size: 1.45rem;
    }

    .property-card:hover {
        transform: translateY(-3px);
    }
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
    .property-card,
    .property-image,
    .enquire-btn {
        transition: none;
    }
}

/* Responsive layouts */
@media (max-width: 768px) {
    body{overflow-x:hidden}
    .wrap{width:92%}
    .sec{padding:56px 0}
    .grid,
    .split,
    footer .grid,
    .property-filters,
    .search form,
    #r-feat{grid-template-columns:minmax(0,1fr)!important}
    .grid{gap:20px}
    .split{gap:28px}
    #r-feat{gap:20px}
    .acts{flex-direction:column;align-items:stretch}
    .acts .btn{width:100%}
    .card .acts{grid-template-columns:minmax(0,1fr)}
    .property-card{min-width:0;width:100%}
    .hero.sm{min-height:340px}
    .hero .wrap{padding:44px 0}
    #slider{min-height:540px}
    #slider .wrap{padding-right:48px}
    .search{margin-top:-28px}
    .search form{padding:18px}
    .tabs{display:grid;grid-template-columns:1fr;gap:10px}
    .tabs .btn{width:100%}
    .btn{min-height:44px}
    button,.ibtn{min-width:44px;min-height:44px}
    .ibtn{width:44px;height:44px;flex:0 0 44px}
    nav a{display:block;padding:12px 0}
    nav ul{gap:4px}
    .feat{padding:22px}
    #development .svcA,.svcC{padding:28px}
    .about-gallery .gallery-image{height:220px}
    .property-content{min-width:0}
    .property-card .property-image{width:100%;max-width:100%;object-fit:cover}
    input:not([type="checkbox"]),select,textarea{min-height:44px}
    dialog{padding:20px}
    footer{padding:48px 0 20px}
    #map, #map iframe{max-width:100%}
}

@media (max-width: 480px) {
    .wrap{width:calc(100% - 32px)}
    .sec{padding:48px 0}
    h1{font-size:clamp(2.1rem,9vw,2.6rem)}
    h2{font-size:clamp(1.65rem,7vw,2rem)}
    h3{font-size:1.3rem}
    .hero.sm{min-height:310px}
    .hero .wrap{padding:36px 0}
    #slider{min-height:520px}
    #slider .wrap{padding-right:44px}
    #slider .slabel{right:64px;left:16px;bottom:24px;text-align:left;font-size:1.1rem}
    #slider .ctl{right:8px;gap:6px}
    .top .wrap{align-items:flex-start;flex-direction:column;gap:2px}
    header .wrap{height:72px;gap:8px}
    .logo{font-size:1.05rem;gap:6px!important;min-width:0}
    .logo img{max-width:40px;max-height:40px!important;object-fit:contain}
    .logo small{display:none}
    .nav .wrap>div{gap:5px!important}
    .cta-nav{font-size:.72rem;padding:8px 10px;min-height:44px}
    .ibtn{width:44px;height:44px;flex:0 0 44px}
    nav{top:72px}
    nav.open{max-height:360px}
    .properties-hero{min-height:460px}
    .properties-hero__grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}
    .properties-hero__content{padding:30px 0!important}
    .property-card .property-image{height:210px}
    .property-content{padding:18px;gap:10px}
    .card .bd{padding:16px}
    .card .im{height:190px}
    .card .acts{gap:10px}
    .card .acts .property-action{padding:8px 10px}
    .feat{padding:18px}
    #development .svcA,.svcC{padding:22px}
    .about-stat .stat{font-size:2.5rem}
    .about-gallery .gallery-image{height:200px}
    .cta{padding:48px 0}
    .cta .acts{flex-direction:column;align-items:stretch}
    .cta .acts .btn{width:100%}
    .search{margin-top:-18px}
    .search form{padding:14px}
    .dialog,.dialog[open],dialog{width:calc(100% - 24px);max-width:540px;padding:18px}
    #up{right:16px;bottom:82px}
    .wa{right:16px;bottom:16px}
}

@media (max-width: 768px) {
    .dots button,
    #slider .dots button{width:44px;height:44px;min-width:44px;min-height:44px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent}
    .dots button::before,
    #slider .dots button::before{content:"";display:block;width:10px;height:10px;border-radius:50%;background:#ffffff66;transition:all .3s ease}
    .dots button.on,
    #slider .dots button.on{width:44px;height:44px;background:transparent}
    .dots button.on::before,
    #slider .dots button.on::before{width:26px;height:10px;border-radius:6px;background:var(--gold)}
}

.contact-page-background{background-image:linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.8)),url("../phone.jpg");background-size:cover;background-position:center;background-repeat:no-repeat;color:#fff}
.contact-page-background .hero{background:transparent}
.contact-page-background .hero::before{background:transparent}
.contact-panel{padding:80px 20px;background:transparent;color:#fff}
.contact-panel h2,.contact-panel h3,.contact-panel p,.contact-panel label,.contact-panel details,.contact-panel summary,.contact-panel #ci,.contact-panel .note,.contact-panel .err,.contact-panel a:not(.btn){color:#fff}
.contact-panel input:not([type="checkbox"]),.contact-panel select,.contact-panel textarea{background:rgba(12,11,9,.82);border-color:rgba(255,255,255,.42);color:#fff}
.contact-panel input::placeholder,.contact-panel textarea::placeholder{color:rgba(255,255,255,.72)}
.contact-panel input[type="checkbox"]{accent-color:var(--gold)}
@media(max-width:768px){.contact-panel{padding:56px 16px}}
@media(max-width:480px){.contact-panel{padding:48px 12px}}

/* Compact Contact page layout */
.contact-page-background>.hero.sm{min-height:190px}
.contact-page-background>.hero .wrap{padding:28px 0}
.contact-panel{padding:42px 20px}
.contact-panel .split{grid-template-columns:minmax(0,450px) minmax(0,1fr);gap:40px;align-items:start}
.contact-panel .split>.rv:first-child{width:100%;max-width:450px}
.contact-form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px!important}
.contact-form-grid>label:nth-of-type(7),.contact-form-grid>label:nth-of-type(8),.contact-form-grid>#e-consent,.contact-form-grid>button{grid-column:1/-1}
.contact-form-grid input:not([type="checkbox"]),.contact-form-grid select{height:40px;min-height:40px;padding:7px 10px}
.contact-form-grid textarea{height:72px;min-height:72px;padding:7px 10px}
.contact-form-grid input[type="checkbox"]{width:18px!important;height:18px;min-height:18px!important;flex:0 0 18px;margin-top:3px!important}
.contact-panel #map{min-height:130px!important;margin:14px 0!important}
.contact-panel #map iframe{height:140px!important}
.contact-panel details{padding:9px 0}
@media(max-width:768px){
    .contact-page-background>.hero.sm{min-height:170px}
    .contact-panel{padding:34px 16px}
    .contact-panel .split{grid-template-columns:minmax(0,1fr);gap:26px}
    .contact-panel .split>.rv:first-child{max-width:none}
    .contact-form-grid{grid-template-columns:minmax(0,1fr)}
    .contact-form-grid>label,.contact-form-grid>#e-consent,.contact-form-grid>button{grid-column:1}
    .contact-form-grid input:not([type="checkbox"]),.contact-form-grid select{min-height:44px}
    .contact-form-grid textarea{height:80px;min-height:80px}
}
@media(max-width:480px){
    .contact-page-background>.hero.sm{min-height:150px}
    .contact-page-background>.hero .wrap{padding:20px 0}
    .contact-panel{padding:28px 12px}
    .contact-panel .split{gap:22px}
}

/* Shared, accessible social links used in the footer and contact page. */
.social-links{display:flex;align-items:center;gap:10px}
.social-icon{display:inline-grid;place-items:center;width:40px;height:40px;border:1px solid var(--gold);border-radius:50%;color:var(--gold);transition:transform .25s ease,background-color .25s ease,color .25s ease}
.social-icon svg{display:block;width:24px;height:24px;max-width:100%;flex:0 0 24px}
.social-icon:hover,.social-icon:focus-visible{background:var(--gold);color:var(--ink);transform:translateY(-2px)}
.contact-social{margin-top:16px}
.contact-social h3{margin-bottom:8px}