:root{
      --bg-main:#f7efe3;
      --bg-alt:#dfc7aa;
      --bg-card:#f3e4cf;
      --text-main:#3b2b1a;
      --text-muted:#5d4b37;
      --accent:#b98b5b;
      --accent-dark:#8b6234;
      --border-soft:rgba(0,0,0,0.08);
      --radius-lg:18px;
      --shadow-soft:0 10px 25px rgba(0,0,0,0.12);
    }

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

    body{
      font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
      background:var(--bg-main);
      color:var(--text-main);
      line-height:1.6;
    }

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

    a{
      color:var(--accent-dark);
      text-decoration:none;
    }

    .page-wrap{
      max-width:1200px;
      margin:0 auto;
      background:var(--bg-main);
    }

    .section{
      padding:3rem 1.5rem;
    }

    @media(min-width:768px){
      .section{
        padding:4rem 2rem;
      }
    }

    .section-narrow{
      max-width:1100px;
      margin:0 auto;
    }

    .section-title{
      font-family:Georgia,"Times New Roman",serif;
      font-size:2.4rem;
      margin-bottom:1.5rem;
      letter-spacing:.03em;
    }

    .section-subtitle{
      font-size:1.05rem;
      color:var(--text-muted);
      max-width:720px;
    }

    .pill-label{
      display:inline-block;
      padding:.2rem .8rem;
      border-radius:999px;
      border:1px solid var(--border-soft);
      background:rgba(255,255,255,0.5);
      font-size:.8rem;
      text-transform:uppercase;
      letter-spacing:.1em;
      margin-bottom:.75rem;
    }

    /* HERO */

    .hero{
      position:relative;
      color:#fff;
      overflow:hidden;
      border-bottom:1px solid var(--border-soft);
    }

    .hero-media{
      position:relative;
      height:70vh;
      min-height:420px;
      max-height:720px;
      display:flex;
      align-items:flex-end;
      justify-content:flex-start;
      background:#000;
    }

    .hero-media img{
      width:100%;
      height:100%;
      object-fit:cover;
      opacity:.78;
    }

    .hero-overlay{
      position:absolute;
      inset:0;
      background:linear-gradient(90deg,rgba(0,0,0,0.7),rgba(0,0,0,0.25),rgba(0,0,0,0.0));
      pointer-events:none;
    }

    .hero-content{
      position:absolute;
      inset:0;
      padding:2rem 1.5rem 3rem;
      display:flex;
      flex-direction:column;
      justify-content:flex-end;
      max-width:900px;
    }

    @media(min-width:768px){
      .hero-content{
        padding:3rem 3rem 3.5rem;
      }
    }

    .hero-title{
      font-family:Georgia,"Times New Roman",serif;
      font-size:2.4rem;
      line-height:1.1;
      margin-bottom:.75rem;
    }

    @media(min-width:768px){
      .hero-title{
        font-size:3.1rem;
      }
    }

    .hero-summary{
      font-size:1rem;
      max-width:600px;
      margin-bottom:1.5rem;
    }

    .hero-meta{
      display:flex;
      flex-wrap:wrap;
      gap:.8rem 1.5rem;
      font-size:.95rem;
      margin-bottom:1.75rem;
    }

    .hero-meta span{
      opacity:.85;
    }

    .hero-actions{
      display:flex;
      flex-wrap:wrap;
      gap:.75rem;
    }

    .btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      padding:.75rem 1.6rem;
      border-radius:999px;
      font-size:.95rem;
      font-weight:600;
      border:none;
      cursor:pointer;
      text-decoration:none;
      transition:transform .15s ease,box-shadow .15s ease,background .15s ease,color .15s ease;
      white-space:nowrap;
    }

    .btn-primary{
      background:#f9f3ea;
      color:var(--accent-dark);
      box-shadow:0 10px 25px rgba(0,0,0,0.28);
    }

    .btn-primary:hover{
      transform:translateY(-1px);
      box-shadow:0 14px 32px rgba(0,0,0,0.35);
    }

    .btn-ghost{
      background:rgba(0,0,0,0.35);
      color:#fff;
      border:1px solid rgba(255,255,255,0.6);
      backdrop-filter:blur(4px);
    }

    .btn-ghost:hover{
      background:rgba(0,0,0,0.5);
    }

    /* PROPERTY OVERVIEW */

    .overview{
      background:var(--bg-alt);
      border-bottom:1px solid var(--border-soft);
    }

    .overview-grid{
      display:grid;
      gap:1.25rem;
      margin-bottom:2rem;
    }

    @media(min-width:720px){
      .overview-grid{
        grid-template-columns:repeat(4,minmax(0,1fr));
      }
    }

    .overview-card{
      background:rgba(255,255,255,0.75);
      border-radius:var(--radius-lg);
      padding:1.4rem 1rem;
      text-align:center;
      box-shadow:0 4px 12px rgba(0,0,0,0.06);
      border:1px solid rgba(255,255,255,0.8);
    }

    .overview-value{
      font-family:Georgia,"Times New Roman",serif;
      font-size:2rem;
      margin-bottom:.3rem;
    }

    .overview-label{
      text-transform:uppercase;
      letter-spacing:.18em;
      font-size:.75rem;
      margin-bottom:.35rem;
      color:var(--text-muted);
    }

    .overview-note{
      font-size:.9rem;
      color:var(--text-muted);
    }

    .overview-details{
      display:grid;
      gap:2rem;
    }

    @media(min-width:820px){
      .overview-details{
        grid-template-columns:1.2fr 1fr;
        align-items:flex-start;
      }
    }

    .list-bullets{
      padding-left:1.3rem;
      font-size:.95rem;
    }

    .list-bullets li+li{
      margin-top:.4rem;
    }

    .label-heading{
      font-weight:600;
      margin-bottom:.6rem;
      text-transform:uppercase;
      letter-spacing:.08em;
      font-size:.8rem;
      color:var(--text-muted);
    }

    /* INTERIOR FEATURES */

    .interior-layout{
      display:grid;
      gap:2rem;
      align-items:start;
    }

    @media(min-width:980px){
      .interior-layout{
        grid-template-columns:1.15fr 1fr;
      }
    }

    .feature-grid{
      display:grid;
      gap:1.4rem;
    }

    @media(min-width:720px){
      .feature-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
      }
    }

    .feature-card{
      background:var(--bg-card);
      border-radius:var(--radius-lg);
      padding:1.4rem 1.3rem;
      box-shadow:0 6px 18px rgba(0,0,0,0.08);
      border:1px solid rgba(255,255,255,0.9);
    }

    .feature-card h3{
      font-family:Georgia,"Times New Roman",serif;
      font-size:1.1rem;
      margin-bottom:.5rem;
    }

    .feature-card p{
      font-size:.95rem;
      color:var(--text-muted);
    }

    .quote-strip{
      margin-top:1.5rem;
      padding:1.3rem 1.5rem;
      border-left:4px solid var(--accent);
      border-radius:0 14px 14px 0;
      background:rgba(255,255,255,0.8);
      font-style:italic;
      color:var(--text-muted);
      font-size:.95rem;
    }

    .interior-photo{
      border-radius:var(--radius-lg);
      overflow:hidden;
      box-shadow:var(--shadow-soft);
      border:1px solid rgba(255,255,255,0.9);
    }

    /* BATHROOMS & BALCONY */

    .split-layout{
      display:grid;
      gap:2rem;
      align-items:center;
    }

    @media(min-width:960px){
      .split-layout{
        grid-template-columns:1.1fr 1fr;
      }
    }

    .text-block h3{
      font-family:Georgia,"Times New Roman",serif;
      font-size:1.4rem;
      margin-bottom:.4rem;
    }

    .text-block p{
      font-size:.95rem;
      color:var(--text-muted);
      margin-bottom:1rem;
    }

    .text-block p:last-child{
      margin-bottom:0;
    }

    /* INVESTMENT SECTION */

    .investment{
      background:var(--bg-main);
      border-top:1px solid var(--border-soft);
      border-bottom:1px solid var(--border-soft);
    }

    .investment-grid{
      display:grid;
      gap:2rem;
      margin-top:1.5rem;
      margin-bottom:2rem;
    }

    @media(min-width:880px){
      .investment-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
      }
    }

    .donut-card{
      text-align:center;
    }

    .donut-wrap{
      width:180px;
      height:180px;
      margin:0 auto 1rem;
      border-radius:50%;
      border:10px solid rgba(0,0,0,0.04);
      display:flex;
      align-items:center;
      justify-content:center;
      background:
        radial-gradient(circle at center,#f7efe3 55%,transparent 56%),
        conic-gradient(var(--accent) 0 var(--percent),rgba(0,0,0,0.06) var(--percent) 100%);
      box-shadow:0 10px 25px rgba(0,0,0,0.12);
    }

    .donut-value{
      font-family:Georgia,"Times New Roman",serif;
      font-size:2.2rem;
      color:var(--accent-dark);
    }

    .donut-label{
      font-weight:600;
      margin-bottom:.4rem;
      font-size:1.05rem;
    }

    .donut-text{
      font-size:.94rem;
      color:var(--text-muted);
    }

    .investment-note{
      padding:1.25rem 1.5rem;
      background:rgba(255,255,255,0.85);
      border-radius:var(--radius-lg);
      border-left:4px solid var(--accent);
      font-size:.95rem;
      color:var(--text-muted);
      box-shadow:0 6px 18px rgba(0,0,0,0.08);
    }

    .investment-note b{
      color:var(--text-main);
    }

    /* AMENITIES */

    .amenities{
      background:var(--bg-alt);
      border-bottom:1px solid var(--border-soft);
    }

    .amenities-grid{
      display:grid;
      gap:2rem;
      margin-top:1.5rem;
    }

    @media(min-width:900px){
      .amenities-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
      }
    }

    .amenity-item{
      display:flex;
      align-items:flex-start;
      gap:1rem;
    }

    .amenity-icon{
      width:40px;
      height:40px;
      border-radius:999px;
      border:1px solid rgba(0,0,0,0.08);
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:1.2rem;
      background:rgba(255,255,255,0.8);
      flex-shrink:0;
    }

    .amenity-title{
      font-weight:600;
      font-size:1.02rem;
      margin-bottom:.2rem;
    }

    .amenity-text{
      font-size:.95rem;
      color:var(--text-muted);
    }

    /* LOCATION / NEIGHBORHOOD */

    .two-col{
      display:grid;
      gap:2rem;
      margin-top:1.5rem;
    }

    @media(min-width:900px){
      .two-col{
        grid-template-columns:1.2fr 1fr;
      }
    }

    .badge-list{
      padding-left:1.3rem;
      font-size:.95rem;
    }

    .badge-list li+li{
      margin-top:.35rem;
    }

    .address-card{
      background:var(--bg-card);
      border-radius:var(--radius-lg);
      padding:1.4rem 1.5rem;
      box-shadow:0 6px 18px rgba(0,0,0,0.08);
      border:1px solid rgba(255,255,255,0.9);
      font-size:.95rem;
    }

    .address-card b{
      display:block;
      margin-bottom:.2rem;
    }

    /* PHOTO GALLERY */

    .gallery-grid{
      display:grid;
      gap:1.5rem;
      margin-top:1.5rem;
      margin-bottom:1.5rem;
    }

    @media(min-width:900px){
      .gallery-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
      }
    }

    .gallery-item{
      border-radius:var(--radius-lg);
      overflow:hidden;
      box-shadow:var(--shadow-soft);
      border:1px solid rgba(255,255,255,0.9);
    }

    .virtual-tour{
      font-size:.95rem;
      color:var(--text-muted);
      max-width:720px;
    }

    .virtual-tour a{
      font-weight:600;
    }

    /* CONTACT SECTION */

    .contact{
      background:var(--bg-main);
      border-top:1px solid var(--border-soft);
    }

    .contact-grid{
      display:grid;
      gap:1.75rem;
      margin-top:1.5rem;
    }

    @media(min-width:900px){
      .contact-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
      }
    }

    .contact-card{
      background:rgba(255,255,255,0.9);
      border-radius:var(--radius-lg);
      padding:1.8rem 1.6rem;
      box-shadow:0 6px 20px rgba(0,0,0,0.08);
      border:1px solid rgba(255,255,255,0.95);
      font-size:.95rem;
    }

    .contact-card h3{
      font-family:Georgia,"Times New Roman",serif;
      font-size:1.3rem;
      margin-bottom:.75rem;
    }

    .contact-name{
      font-weight:700;
      margin-bottom:.15rem;
    }

    .contact-role{
      margin-bottom:.35rem;
    }

    .contact-line{
      margin-bottom:.25rem;
    }

    .contact-line span{
      font-weight:600;
    }

    .contact-note{
      margin-top:.75rem;
      font-size:.9rem;
      color:var(--text-muted);
    }

    .text-sm{
      font-size:.88rem;
    }

    .mt-1{margin-top:.5rem;}
    .mt-2{margin-top:1rem;}
    .mt-3{margin-top:1.5rem;}

    /* RESPONSIVE TWEAKS */

    @media(max-width:600px){
      .hero-title{
        font-size:2rem;
      }
      .overview-value{
        font-size:1.7rem;
      }
      .hero-media{
        height:60vh;
      }
    }