:root{
    --marine:#16324A; --marine-deep:#0E2436; --stucco:#FDFBF7;
    --tile:#C05A3A; --sea:#A9C3D4; --ink:#2E3B47; --gray:#6C7A87; --sand:#F5EFE4;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{font-family:'Montserrat',sans-serif;color:var(--ink);background:var(--stucco);line-height:1.65}
  img{display:block;max-width:100%}
  a{color:inherit}
  .wrap{max-width:1100px;margin:0 auto;padding:0 24px}
  .eyebrow{font-size:.72rem;font-weight:700;letter-spacing:.32em;text-transform:uppercase;color:var(--tile)}
  h2{font-size:clamp(1.6rem,4vw,2.3rem);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--marine);line-height:1.25;margin:.5rem 0 1rem}
  .serif{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:500}
  .tile-divider{display:flex;align-items:center;gap:10px;margin:1.1rem 0}
  .tile-divider::before,.tile-divider::after{content:"";height:1px;width:52px;background:var(--tile)}
  .tile-divider span{width:9px;height:9px;background:var(--tile);transform:rotate(45deg)}
  .btn{display:inline-block;padding:.95rem 1.9rem;font-weight:700;font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;border:1.5px solid transparent;transition:all .2s ease}
  .btn-tile{background:var(--tile);color:var(--stucco)}
  .btn-tile:hover{background:#a94c30}
  .btn-ghost{border-color:var(--sea);color:var(--stucco)}
  .btn-ghost:hover{background:rgba(169,195,212,.15)}
  .btn-marine{background:var(--marine);color:var(--stucco)}
  .btn-marine:hover{background:var(--marine-deep)}

  /* NAV */
  nav{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(14,36,54,.92);backdrop-filter:blur(8px)}
  .nav-in{max-width:1100px;margin:0 auto;padding:14px 24px;display:flex;align-items:center;justify-content:space-between}
  .logo{display:flex;align-items:center;gap:12px;text-decoration:none}
  .logo-arch{width:30px;height:38px;border:2px solid var(--sea);border-bottom:none;border-radius:15px 15px 0 0;position:relative}
  .logo-arch::after{content:"";position:absolute;inset:4px 4px 0;border:1.5px solid var(--tile);border-bottom:none;border-radius:11px 11px 0 0}
  .logo span{color:var(--stucco);font-weight:700;font-size:.82rem;letter-spacing:.22em}
  .nav-links{display:flex;gap:26px;align-items:center;list-style:none}
  .nav-links a{color:var(--sea);text-decoration:none;font-size:.74rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
  .nav-links a:hover{color:var(--stucco)}
  .nav-call{border:1.5px solid var(--tile);color:var(--stucco)!important;padding:.5rem 1rem}
  @media(max-width:760px){.nav-links li:not(.keep){display:none}}

  /* HERO */
  header{min-height:100svh;display:flex;align-items:center;justify-content:center;text-align:center;position:relative;
    background:linear-gradient(rgba(14,36,54,.55),rgba(14,36,54,.72)),url('images/hero-sunset.jpg') center 65%/cover no-repeat;padding:110px 24px 70px}
  .hero-arch{border:2px solid var(--sea);border-bottom:none;border-radius:200px 200px 0 0;padding:clamp(2.4rem,6vw,4rem) clamp(1.4rem,5vw,3.5rem) 0;position:relative;max-width:640px}
  .hero-arch::after{content:"";position:absolute;inset:10px 10px 0;border:1.5px solid var(--tile);border-bottom:none;border-radius:190px 190px 0 0;pointer-events:none}
  .hero-arch .eyebrow{color:var(--sea)}
  h1{color:var(--stucco);font-size:clamp(2.1rem,7vw,3.6rem);font-weight:700;letter-spacing:.1em;text-transform:uppercase;line-height:1.18;margin:.9rem 0 .4rem}
  h1 em{font-style:normal;color:var(--sea)}
  .hero-sub{color:var(--sea);font-size:clamp(1.15rem,3vw,1.5rem);margin-bottom:1.8rem}
  .hero-ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;padding-bottom:2.6rem}
  .hero-name{color:var(--stucco);font-size:.78rem;font-weight:600;letter-spacing:.26em;text-transform:uppercase;margin-top:.4rem}
  .hero-name small{display:block;color:var(--sea);font-weight:500;letter-spacing:.16em;font-size:.66rem;margin-top:6px}

  /* SECTIONS */
  section{padding:clamp(3.6rem,8vw,6rem) 0}
  .grid2{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(2rem,5vw,4rem);align-items:center}
  @media(max-width:820px){.grid2{grid-template-columns:1fr}}
  .arch-photo{border-radius:999px 999px 0 0;overflow:hidden;border:10px solid #fff;box-shadow:0 18px 50px rgba(22,50,74,.18)}
  .arch-photo img{width:100%;height:100%;object-fit:cover;aspect-ratio:3/4}
  .pull{background:var(--sand);border-left:4px solid var(--tile);padding:1.2rem 1.4rem;margin-top:1.6rem}
  .pull p{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:600;font-size:1.35rem;color:var(--marine);line-height:1.4}

  .band{background:var(--marine);color:var(--stucco)}
  .band h2{color:var(--stucco)}
  .band .sec-head p{color:var(--sea)}
  .sec-head{text-align:center;max-width:640px;margin:0 auto 3rem}
  .sec-head .tile-divider{justify-content:center}
  .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
  @media(max-width:820px){.cards{grid-template-columns:1fr;max-width:440px;margin:0 auto}}
  .card{background:var(--marine-deep);border:1px solid rgba(169,195,212,.25);border-radius:130px 130px 0 0;padding:3rem 1.7rem 2.2rem;text-align:center;transition:transform .25s ease,border-color .25s ease}
  .card:hover{transform:translateY(-6px);border-color:var(--tile)}
  .card h3{font-size:1rem;letter-spacing:.24em;text-transform:uppercase;color:var(--stucco);margin-bottom:.9rem}
  .card p{color:var(--sea);font-size:.92rem}
  .card .mini{margin-top:1.2rem;display:inline-block;color:var(--tile);font-size:.72rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;text-decoration:none}

  .hoods{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
  @media(max-width:960px){.hoods{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:520px){.hoods{grid-template-columns:1fr;max-width:400px;margin:0 auto}}
  .hood{position:relative;border-radius:120px 120px 0 0;overflow:hidden;aspect-ratio:3/4.2}
  .hood img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
  .hood:hover img{transform:scale(1.05)}
  .hood .tag{position:absolute;left:0;right:0;bottom:0;padding:2.2rem 1rem .95rem;background:linear-gradient(transparent,rgba(14,36,54,.9));color:var(--stucco)}
  .hood .tag b{display:block;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase}
  .hood .tag span{font-size:.76rem;color:var(--sea)}
  a.hood{text-decoration:none;display:block;cursor:pointer}
  .hood .explore{opacity:0;transform:translateY(4px);transition:opacity .25s ease,transform .25s ease;
    font-size:.68rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--tile);margin-top:6px}
  .hood:hover .explore{opacity:1;transform:none}
  .hood:hover img{transform:scale(1.05)}

  /* ---- neighborhood detail pages ---- */
  .n-hero{min-height:46vh;display:flex;align-items:flex-end;position:relative;padding:110px 0 3rem;
    background-size:cover;background-position:center}
  .n-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(14,36,54,.35),rgba(14,36,54,.82))}
  .n-hero .wrap{position:relative;z-index:1}
  .n-crumb{color:var(--sea);font-size:.75rem;font-weight:600;letter-spacing:.1em;text-decoration:none}
  .n-crumb:hover{color:var(--stucco)}
  .n-hero h1{color:var(--stucco);font-size:clamp(2rem,6vw,3.1rem);font-weight:700;letter-spacing:.06em;
    text-transform:uppercase;margin:.8rem 0 .3rem}
  .n-hero p{color:var(--sea);font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.2rem}
  .n-body{max-width:760px}
  .n-body p{margin-bottom:1.1rem}
  .n-highlights{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin:2rem 0}
  @media(max-width:640px){.n-highlights{grid-template-columns:1fr}}
  .n-highlights div{border-left:3px solid var(--tile);padding-left:1rem}
  .n-highlights b{display:block;color:var(--marine);font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;margin-bottom:.3rem}
  .n-cta{background:var(--marine);color:var(--stucco);border-radius:0;padding:2.4rem;text-align:center;margin-top:2.5rem}
  .n-cta h3{color:var(--stucco);font-size:1.3rem;letter-spacing:.08em;text-transform:uppercase;margin-bottom:.6rem}
  .n-cta p{color:var(--sea);margin-bottom:1.3rem}
  .n-other{display:flex;gap:12px;flex-wrap:wrap;margin-top:2.5rem}
  .n-other a{font-size:.78rem;font-weight:600;color:var(--marine);text-decoration:none;border:1px solid var(--sea);padding:.5rem 1rem}
  .n-other a:hover{background:var(--sand)}

  /* ---- testimonials (template, off-page until real reviews exist) ---- */
  .testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
  @media(max-width:820px){.testi-grid{grid-template-columns:1fr;max-width:460px;margin:0 auto}}
  .testi-card{background:var(--stucco);padding:1.8rem 1.6rem;border-top:3px solid var(--tile)}
  .testi-stars{color:var(--tile);letter-spacing:2px;margin-bottom:.7rem;font-size:.95rem}
  .testi-card p{font-family:'Cormorant Garamond',serif;font-style:italic;color:var(--ink);font-size:1.05rem;margin-bottom:1rem}
  .testi-name{font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--marine)}

  .search-strip{background:linear-gradient(rgba(22,50,74,.82),rgba(22,50,74,.82)),url('images/relax-sign.jpg') center/cover;color:var(--stucco);text-align:center}
  .search-strip h2{color:var(--stucco)}
  .search-strip p{color:var(--sea);max-width:560px;margin:0 auto 1.6rem}

  .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem)}
  @media(max-width:820px){.contact-grid{grid-template-columns:1fr}}
  .contact-info a.big{display:block;color:var(--stucco);font-size:clamp(1.5rem,4vw,2rem);font-weight:700;letter-spacing:.06em;text-decoration:none;margin:.4rem 0}
  .contact-info a.big:hover{color:var(--sea)}
  .contact-info p{color:var(--sea)}
  form{display:grid;gap:14px}
  label{font-size:.7rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--sea)}
  input,textarea,select{width:100%;padding:.85rem 1rem;background:rgba(253,251,247,.06);border:1px solid rgba(169,195,212,.35);color:var(--stucco);font-family:inherit;font-size:.95rem}
  input:focus,textarea:focus,select:focus{outline:2px solid var(--tile);outline-offset:1px}
  select{appearance:none}
  option{color:var(--ink)}

  footer{background:var(--marine-deep);color:var(--sea);padding:2.6rem 0;font-size:.78rem;text-align:center}
  footer .foot-name{color:var(--stucco);font-weight:700;letter-spacing:.24em;text-transform:uppercase;font-size:.85rem;margin-bottom:.6rem}
  footer p{max-width:640px;margin:.35rem auto}

  .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
  .reveal.in{opacity:1;transform:none}
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto}
    .reveal{opacity:1;transform:none;transition:none}
    .hood img,.card{transition:none}
  }