/* =====================================================================
   Zahra Alkanz Realty LLC — master theme (all inner pages)
   Same fonts, colours, header and footer as the homepage.
   ===================================================================== */

/* ---- Fonts (hosted on our own server, folder: fonts/) ---- */


/* ---- One palette for the whole site ---- */
:root{
  --navy:#0F2A4A;--navy2:#1B3D66;--navy-deep:#051935;
  --gold:#C9A24A;--gold-deep:#A07E41;--gold-hi:#FCE5A7;--gold-soft:#F5ECD7;
  --sky:#7CC3E8;--brown:#7A4A1E;--bg:#F7F5F0;--ink:#1F1F1F;--muted:#5c5f66;--line:#E6DFCF;
  /* Vastu page names mapped onto the same palette */
  --ivory:#F7F5F0;--paper:#FFFFFF;--ink-soft:#4A4F57;--gold-pale:#F5ECD7;--gold-line:#E2D3AE;--sand:#EFEAE0;
  --f-head:'Cormorant Garamond',Didot,Georgia,serif;
  --f-display:'Jost','Segoe UI',Arial,sans-serif;
  --f-body:'Jost','Segoe UI',Arial,sans-serif;
  --f-brand:'Cinzel',Georgia,serif;
  --f-num:'Jost','Segoe UI',Arial,sans-serif;
}

/* ---- Typography ---- */
body.zk{font-family:var(--f-body);background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}
body.zk h1,body.zk h2,body.zk h3,body.zk h4{font-family:var(--f-head);font-weight:500;letter-spacing:-.005em}
body.zk h1 em,body.zk h2 em{font-style:italic;color:var(--gold-deep)}
body.zk .hero h1{font-size:clamp(2.1rem,4.8vw,3.4rem);line-height:1.1}
body.zk h2.sec,body.zk .lead-sec h2{font-size:clamp(1.7rem,3.3vw,2.4rem);color:var(--navy)}
body.zk .card h3{font-size:1.4rem;color:var(--navy)}
body.zk .eyebrow,body.zk .kicker,body.zk .tag,body.zk .role,body.zk .brand-mark,body.zk .brand-sub,body.zk .cover-meta{font-family:var(--zk-head);letter-spacing:.14em}
body.zk .price,body.zk .permit,body.zk .stat b{font-family:var(--f-num)}
body.zk table th{font-family:var(--f-display);font-weight:700;letter-spacing:.02em}
body.zk .card a,body.zk main a[href]:not(.btn){font-family:inherit}
body.zk .card > a:last-child,body.zk .read,body.zk .more{font-family:var(--f-display);font-weight:700;color:var(--navy)}

/* ---- Buttons ---- */
body.zk .btn,body.zk .btn-wa,body.zk button,body.zk form button,body.zk input[type=submit]{font-family:var(--f-display);font-weight:700;letter-spacing:.01em}
body.zk .btn-wa,body.zk form button,body.zk .wa-float,body.zk .cta .btn{background:var(--gold);color:var(--navy);border-radius:10px}
body.zk .btn-wa:hover,body.zk form button:hover,body.zk .cta .btn:hover{background:var(--gold-deep);color:#fff}

/* Main action buttons in forms: same gold as the homepage */
body.zk .send{background:var(--gold);color:var(--navy);border-radius:10px;font-family:var(--f-display);font-weight:700}
body.zk .send:hover{background:var(--gold-deep);color:#fff}
body.zk main{padding-top:56px}

/* ---- Cards & banners: one look everywhere ---- */
body.zk .card{border-radius:16px;border:1px solid var(--line);box-shadow:0 8px 28px rgba(15,42,74,.07)}
body.zk .hero,body.zk .cta{background:linear-gradient(135deg,var(--navy-deep) 0%,var(--navy) 55%,var(--navy2) 100%)}
body.zk .hero .eyebrow{color:var(--gold-hi)}
body.zk .cta h3{font-family:var(--f-head);font-weight:500;font-size:1.6rem}
body.zk input,body.zk select,body.zk textarea{font-family:var(--f-body)}
body.zk label{font-family:var(--f-display);font-weight:600}

/* ---- Vastu page: brought onto the same palette ---- */
body.zk.vastu h1,body.zk.vastu h2,body.zk.vastu h3{color:var(--navy)}
body.zk.vastu .cover{background:var(--bg)}
body.zk.vastu .card{border-top:3px solid var(--gold)}
body.zk.vastu .card .num{font-family:var(--f-head);color:var(--gold-deep)}

/* =====================================================================
   HEADER — identical on every page
   ===================================================================== */
header.zh{position:sticky;top:0;z-index:60;background:#fff;border-bottom:3px solid var(--gold);box-shadow:0 2px 12px rgba(15,42,74,.08);padding:0;text-align:left}
.zh-wrap{width:min(1200px,100% - 40px);margin:0 auto}
header.zh .zh-nav{display:flex;align-items:center;justify-content:space-between;min-height:80px;gap:16px;position:relative}
.zk-logo{display:inline-flex;align-items:center;gap:11px;text-decoration:none;flex-shrink:0}
.zk-logo img{height:52px;width:52px;border-radius:9px;border:1.5px solid var(--gold);display:block;box-shadow:0 1px 4px rgba(15,42,74,.18)}
.zk-word{display:flex;flex-direction:column;line-height:1.15}
.zk-word b{font-family:var(--f-brand);font-weight:700;font-size:1.06rem;letter-spacing:.08em;color:var(--navy);white-space:nowrap}
.zk-word i{font-family:var(--f-brand);font-style:normal;font-weight:600;font-size:.56rem;letter-spacing:.2em;color:var(--gold-deep);white-space:nowrap;margin-top:3px}
header.zh nav{display:block}
header.zh nav ul{display:flex;gap:18px;list-style:none;margin:0;padding:0;font:700 .84rem var(--f-display);letter-spacing:.01em;color:var(--navy);flex-wrap:nowrap}
header.zh nav li{white-space:nowrap}
header.zh nav a{position:relative;padding:6px 0;color:var(--navy);text-decoration:none}
header.zh nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .25s}
header.zh nav a:hover,header.zh nav a.on{color:var(--gold-deep)}
header.zh nav a:hover::after,header.zh nav a.on::after{transform:scaleX(1)}
header.zh .zh-cta{display:flex;align-items:center;gap:8px}
header.zh .zh-btn{display:inline-flex;align-items:center;padding:10px 16px;border-radius:10px;background:var(--gold);color:var(--navy);font:700 .9rem var(--f-display);text-decoration:none;white-space:nowrap}
header.zh .zh-btn:hover{background:var(--gold-deep);color:#fff}
header.zh .zh-burger{display:none;background:none;border:0;padding:8px;cursor:pointer}
header.zh .zh-burger span{display:block;width:24px;height:2px;background:var(--navy);margin:5px 0}
@media (max-width:1280px){
  header.zh nav{display:none}
  header.zh .zh-burger{display:block}
  header.zh nav.open{display:block;position:absolute;top:100%;left:-20px;right:-20px;background:#fff;border-bottom:3px solid var(--gold);padding:16px 24px;box-shadow:0 10px 24px rgba(15,42,74,.12)}
  header.zh nav.open ul{flex-direction:column;gap:14px;font-size:1rem}
}
@media (max-width:600px){
  header.zh .zh-btn{display:none}
  .zk-word i{display:none}
  .zk-word b{font-size:.9rem}
  .zk-logo img{height:44px;width:44px}
}

/* =====================================================================
   FOOTER — identical on every page
   ===================================================================== */
footer.zf{background:var(--navy);color:#C9D6E6;border-bottom:7px solid var(--brown);padding:0;text-align:left;font-family:var(--f-display);font-size:14px;margin:0}
footer.zf .zf-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:36px;padding:66px 0 44px}
footer.zf .zk-word b{color:#fff}
footer.zf .zk-word i{color:#E6CE8C}
footer.zf h4{font:800 12px var(--f-display);letter-spacing:.14em;color:var(--gold-hi);margin:0 0 16px}
footer.zf a{display:block;margin-bottom:9px;font:600 14.5px var(--f-display);color:#DCE5F0;text-decoration:none}
footer.zf a:hover{color:var(--sky)}
footer.zf p{font:500 14px/1.6 var(--f-display);margin:16px 0 0;max-width:28em;color:#C9D6E6}
footer.zf .zf-legal{border-top:1px solid #2A4568;padding:18px 0;font:500 13px var(--f-display);color:#9FB3CC;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
footer.zf .zf-note{font:400 12.5px var(--f-body);color:#9FB3CC;padding:0 0 18px;margin:0}
@media (max-width:980px){footer.zf .zf-grid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){footer.zf .zf-grid{grid-template-columns:1fr}}

/* Floating WhatsApp button, same everywhere */
body.zk .wa-float{background:var(--gold);color:var(--navy);box-shadow:0 6px 20px rgba(15,42,74,.28)}

/* ===== Calm, crisp reading layer ===== */
body.zk{font-size:16.5px;line-height:1.75;color:#2a2f38;text-rendering:optimizeLegibility}
body.zk p,body.zk li{color:#4a505b}
body.zk .hero p,body.zk .cta p{color:#DCE5F0}
body.zk .eyebrow,body.zk .kicker,body.zk .tag,body.zk .role,body.zk .cover-meta{font-family:var(--zk-head)!important;font-weight:700;letter-spacing:.12em}
header.zh nav ul{font:600 .9rem var(--f-body)!important;letter-spacing:0!important}
body.zk input,body.zk select,body.zk textarea,body.zk button{font-family:var(--f-body)}