/* =========================================================
   JewarPlots.in — Design Tokens
   Palette: Aviation navy, runway gold, soil terracotta, paper
   Type: Fraunces (display) / Inter (body) / IBM Plex Mono (data)
   ========================================================= */
:root{
  --navy:        #0B1F3A;
  --navy-2:      #102A4C;
  --charcoal:    #161B22;
  --gold:        #C9962E;
  --gold-soft:   #E4B85C;
  --terracotta:  #A85C32;
  --paper:       #F7F4EC;
  --paper-2:     #EFE9DB;
  --green:       #3F7D58;
  --ink:         #1B1B1A;
  --muted:       #6B6459;
  --line:        #DED5C2;
  --radius:      2px;
  --container-pad: clamp(1.25rem, 4vw, 3rem);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  color:var(--ink);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
}
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; }
}

h1,h2,h3,h4, .jp-display{
  font-family:'Fraunces', Georgia, serif;
  font-optical-sizing:auto;
  letter-spacing:-0.01em;
  color:var(--navy);
  font-weight:600;
}
.jp-mono{
  font-family:'IBM Plex Mono', ui-monospace, SFMono-Regular, monospace;
}
a{ color:inherit; text-decoration:none; }
:focus-visible{
  outline:3px solid var(--gold);
  outline-offset:2px;
}
img{ max-width:100%; display:block; }
.container-xl{ max-width:1280px; margin-inline:auto; padding-inline:var(--container-pad); }

/* Eyebrow label used above section headings — encodes "section type", not decoration */
.jp-eyebrow{
  font-family:'IBM Plex Mono', monospace;
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--terracotta);
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  margin-bottom:.85rem;
}
.jp-eyebrow::before{
  content:"";
  width:28px; height:1px;
  background:var(--terracotta);
  display:inline-block;
}

/* Runway centerline divider — dashed gold rule, used sparingly between major sections */
.jp-runway-rule{
  height:0;
  border-top:2px dashed var(--gold);
  opacity:.55;
  margin:0;
}

section{ padding-block: clamp(3.25rem, 7vw, 6rem); }

/* ---------- Buttons ---------- */
.btn-jp-gold{
  background:var(--gold);
  border:1px solid var(--gold);
  color:var(--navy);
  font-weight:600;
  border-radius:var(--radius);
  padding:.85rem 1.6rem;
  letter-spacing:.01em;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn-jp-gold:hover{ background:var(--gold-soft); color:var(--navy); transform:translateY(-1px); box-shadow:0 8px 20px rgba(201,150,46,.35); }
.btn-jp-outline{
  background:transparent;
  border:1px solid rgba(247,244,236,.55);
  color:var(--paper);
  border-radius:var(--radius);
  padding:.85rem 1.6rem;
  font-weight:600;
  transition:.15s ease;
}
.btn-jp-outline:hover{ background:rgba(247,244,236,.12); color:#fff; border-color:#fff; }
.btn-jp-navy{
  background:var(--navy);
  color:var(--paper);
  border:1px solid var(--navy);
  border-radius:var(--radius);
  padding:.85rem 1.6rem;
  font-weight:600;
  transition:.15s ease;
}
.btn-jp-navy:hover{ background:var(--navy-2); color:#fff; }
.btn-jp-whatsapp{
  background:#1FAA59;
  color:#fff;
  border-radius:var(--radius);
  padding:.85rem 1.6rem;
  font-weight:600;
  display:inline-flex; align-items:center; gap:.55rem;
  transition:.15s ease;
}
.btn-jp-whatsapp:hover{ background:#178a47; color:#fff; }

/* ---------- Navbar ---------- */
.jp-navbar{
  background:rgba(11,31,58,.96);
  backdrop-filter:saturate(140%) blur(6px);
  padding-block:.7rem;
  transition:padding .2s ease, box-shadow .2s ease;
}
.jp-navbar.is-scrolled{ padding-block:.4rem; box-shadow:0 6px 24px rgba(0,0,0,.25); }
.jp-navbar .navbar-brand{
  font-family:'Fraunces', serif;
  font-weight:700;
  color:var(--paper);
  font-size:1.3rem;
  display:flex; align-items:center; gap:.5rem;
}
.jp-navbar .navbar-brand small{
  display:block;
  font-family:'IBM Plex Mono', monospace;
  font-size:.6rem;
  letter-spacing:.18em;
  color:var(--gold-soft);
  font-weight:500;
}
.jp-navbar .nav-link{
  color:rgba(247,244,236,.82) !important;
  font-weight:500;
  font-size:.93rem;
  padding-inline:.85rem !important;
}
.jp-navbar .nav-link:hover, .jp-navbar .nav-link:focus{ color:#fff !important; }
.jp-nav-call{
  font-family:'IBM Plex Mono', monospace;
  font-size:.85rem;
  color:var(--gold-soft);
  border:1px solid rgba(228,184,92,.45);
  border-radius:var(--radius);
  padding:.45rem .9rem;
  display:inline-flex; align-items:center; gap:.5rem;
}
.jp-nav-call:hover{ background:rgba(228,184,92,.1); color:var(--gold-soft); }

/* ---------- Hero ---------- */
.jp-hero{
  background:
    radial-gradient(900px 500px at 85% -10%, rgba(201,150,46,.16), transparent 60%),
    linear-gradient(180deg, var(--navy) 0%, var(--navy-2) 100%);
  color:var(--paper);
  position:relative;
  overflow:hidden;
  padding-top:clamp(5.5rem, 10vw, 7.5rem);
}
.jp-hero::after{
  content:"";
  position:absolute; inset:auto 0 0 0; height:1px;
  background:linear-gradient(90deg, transparent, rgba(228,184,92,.5), transparent);
}
.jp-hero h1{
  color:#fff;
  font-size:clamp(2.1rem, 4.4vw, 3.4rem);
  line-height:1.08;
}
.jp-hero h1 em{ font-style:normal; color:var(--gold-soft); }
.jp-hero p.lead{
  color:rgba(247,244,236,.85);
  font-size:clamp(1rem, 1.3vw, 1.15rem);
  max-width:46ch;
}
.jp-badge-row{ display:flex; flex-wrap:wrap; gap:.9rem 1.4rem; margin-top:1.6rem; }
.jp-badge{
  display:flex; align-items:center; gap:.5rem;
  font-size:.82rem; color:rgba(247,244,236,.85);
  font-family:'IBM Plex Mono', monospace;
}
.jp-badge i{ color:var(--gold-soft); }

/* Blueprint plot-grid decorative SVG backdrop */
.jp-blueprint{
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(247,244,236,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(247,244,236,.05) 1px, transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.9), transparent 85%);
  pointer-events:none;
}

/* ---------- Flight board (signature element) ---------- */
.jp-board{
  background:var(--charcoal);
  border:1px solid rgba(228,184,92,.25);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:0 30px 60px rgba(0,0,0,.35);
}
.jp-board-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:.7rem 1.1rem;
  background:rgba(228,184,92,.08);
  border-bottom:1px dashed rgba(228,184,92,.3);
  font-family:'IBM Plex Mono', monospace;
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--gold-soft);
}
.jp-board-head .jp-dot{ width:7px; height:7px; border-radius:50%; background:var(--green); display:inline-block; margin-right:.5rem; box-shadow:0 0 0 3px rgba(63,125,88,.25); }
.jp-board-row{
  display:flex; align-items:baseline; justify-content:space-between;
  padding:.85rem 1.1rem;
  border-bottom:1px solid rgba(247,244,236,.06);
  font-family:'IBM Plex Mono', monospace;
}
.jp-board-row:last-child{ border-bottom:none; }
.jp-board-label{ color:rgba(247,244,236,.6); font-size:.78rem; letter-spacing:.04em; }
.jp-board-value{
  color:var(--gold-soft);
  font-size:1.15rem;
  font-weight:600;
  letter-spacing:.03em;
}
.jp-board-value.is-flip{ animation:jpFlip .5s steps(6) 1; }
@keyframes jpFlip{
  0%{ opacity:0; transform:translateY(-6px); filter:blur(2px); }
  100%{ opacity:1; transform:translateY(0); filter:blur(0); }
}

/* ---------- Trust / E-E-A-T strip ---------- */
.jp-trust{
  background:var(--paper-2);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.jp-trust .jp-stat{ text-align:center; }
.jp-trust .jp-stat .num{
  font-family:'Fraunces', serif;
  font-weight:700;
  font-size:clamp(1.6rem,3vw,2.2rem);
  color:var(--navy);
}
.jp-trust .jp-stat .lbl{
  font-family:'IBM Plex Mono', monospace;
  font-size:.7rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--muted);
}

/* ---------- Byline / reviewed-by bar (E-E-A-T) ---------- */
.jp-byline{
  display:flex; flex-wrap:wrap; gap:.5rem 1.5rem; align-items:center;
  font-size:.85rem; color:var(--muted);
  border-left:3px solid var(--gold);
  padding:.75rem 1rem;
  background:#fff;
}
.jp-byline strong{ color:var(--navy); }

/* ---------- Section heading pattern ---------- */
.jp-section-head h2{ font-size:clamp(1.6rem,3vw,2.3rem); margin-bottom:.6rem; }
.jp-section-head p{ color:var(--muted); max-width:62ch; }

/* ---------- Cards ---------- */
.jp-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  height:100%;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.jp-card:hover{ transform:translateY(-4px); box-shadow:0 18px 34px rgba(11,31,58,.1); border-color:rgba(201,150,46,.4); }
.jp-card-media{
  aspect-ratio:4/3;
  background:
    repeating-linear-gradient(45deg, rgba(11,31,58,.05) 0 2px, transparent 2px 18px),
    linear-gradient(145deg, var(--navy-2), var(--navy));
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  color:rgba(247,244,236,.65);
  text-align:center;
  position:relative;
}
.jp-card-media i{ font-size:1.8rem; color:var(--gold-soft); margin-bottom:.4rem; }
.jp-card-media span{ font-family:'IBM Plex Mono', monospace; font-size:.68rem; letter-spacing:.08em; padding-inline:1rem; }
.jp-card-media .jp-plot-tag{
  position:absolute; top:.7rem; left:.7rem;
  background:var(--gold); color:var(--navy);
  font-family:'IBM Plex Mono', monospace;
  font-size:.66rem; font-weight:600; letter-spacing:.05em;
  padding:.25rem .55rem; border-radius:2px;
}
.jp-card-body{ padding:1.3rem; }
.jp-card-body h3{ font-size:1.15rem; margin-bottom:.3rem; }
.jp-card-meta{ display:flex; flex-wrap:wrap; gap:.6rem 1rem; font-size:.8rem; color:var(--muted); margin:.6rem 0 1rem; }
.jp-card-meta span{ display:flex; align-items:center; gap:.35rem; }
.jp-card-meta i{ color:var(--terracotta); }
.jp-price-tag{ font-family:'IBM Plex Mono', monospace; color:var(--green); font-weight:600; }

/* ---------- Why-invest icon tiles ---------- */
.jp-tile{
  display:flex; gap:1rem; align-items:flex-start;
  padding:1.4rem;
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  height:100%;
}
.jp-tile .jp-tile-icon{
  flex:0 0 auto;
  width:46px; height:46px;
  border-radius:50%;
  background:var(--navy);
  color:var(--gold-soft);
  display:flex; align-items:center; justify-content:center;
  font-size:1.15rem;
}
.jp-tile h3{ font-size:1.02rem; margin-bottom:.3rem; }
.jp-tile p{ color:var(--muted); font-size:.92rem; margin-bottom:0; }

/* ---------- Pricing table ---------- */
.jp-price-table{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.jp-price-table table{ margin-bottom:0; }
.jp-price-table thead th{
  background:var(--navy); color:var(--paper);
  font-family:'IBM Plex Mono', monospace; font-size:.74rem; letter-spacing:.08em; text-transform:uppercase;
  font-weight:500; border:none; padding:.95rem 1rem;
}
.jp-price-table td{ padding:.95rem 1rem; vertical-align:middle; border-color:var(--line); font-size:.93rem; }
.jp-price-table tr:last-child td{ border-bottom:none; }

/* ---------- Map / location ---------- */
.jp-map-frame{ border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; filter:grayscale(.15); }
.jp-distance-list li{
  display:flex; justify-content:space-between; gap:1rem;
  padding:.7rem 0; border-bottom:1px dashed var(--line);
  font-size:.93rem;
}
.jp-distance-list li:last-child{ border-bottom:none; }
.jp-distance-list .val{ font-family:'IBM Plex Mono', monospace; color:var(--navy); font-weight:600; }

/* ---------- Testimonials ---------- */
.jp-quote{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:1.5rem; height:100%; }
.jp-quote .stars{ color:var(--gold); letter-spacing:.1em; margin-bottom:.6rem; }
.jp-quote p{ color:var(--ink); font-size:.95rem; }
.jp-quote footer{ font-family:'IBM Plex Mono', monospace; font-size:.78rem; color:var(--muted); margin-top:.9rem; }

/* ---------- FAQ (accordion override) ---------- */
.jp-faq .accordion-item{ border:1px solid var(--line); border-radius:var(--radius) !important; overflow:hidden; margin-bottom:.7rem; }
.jp-faq .accordion-button{
  font-family:'Fraunces', serif; font-weight:600; color:var(--navy);
  background:#fff; padding:1.1rem 1.3rem;
}
.jp-faq .accordion-button:not(.collapsed){ background:var(--paper-2); color:var(--navy); box-shadow:none; }
.jp-faq .accordion-button:focus{ box-shadow:none; outline:3px solid var(--gold); outline-offset:-3px; }
.jp-faq .accordion-button::after{ filter:none; }
.jp-faq .accordion-body{ font-size:.93rem; color:var(--muted); padding:0 1.3rem 1.3rem; }

/* ---------- Disclaimer / legal ---------- */
.jp-legal{ background:var(--paper-2); border:1px dashed var(--terracotta); border-radius:var(--radius); padding:1.4rem 1.6rem; font-size:.85rem; color:var(--muted); }
.jp-legal h3{ font-size:1rem; color:var(--terracotta); margin-bottom:.5rem; }

/* ---------- Contact ---------- */
.jp-contact{ background:var(--navy); color:var(--paper); position:relative; overflow:hidden; }
.jp-contact .form-control, .jp-contact .form-select{
  background:rgba(247,244,236,.06);
  border:1px solid rgba(247,244,236,.22);
  color:#fff;
  border-radius:var(--radius);
  padding:.75rem .9rem;
}
.jp-contact .form-control::placeholder{ color:rgba(247,244,236,.45); }
.jp-contact .form-control:focus, .jp-contact .form-select:focus{
  background:rgba(247,244,236,.09); border-color:var(--gold); box-shadow:0 0 0 .2rem rgba(201,150,46,.18); color:#fff;
}
.jp-contact label{ font-size:.82rem; color:rgba(247,244,236,.75); margin-bottom:.35rem; }
.jp-contact-card{ background:rgba(247,244,236,.05); border:1px solid rgba(247,244,236,.15); border-radius:var(--radius); padding:1.5rem; }
.jp-contact-card .row-item{ display:flex; gap:.85rem; align-items:flex-start; margin-bottom:1.1rem; }
.jp-contact-card .row-item i{ color:var(--gold-soft); font-size:1.1rem; margin-top:.15rem; }
.jp-contact-card .row-item small{ display:block; color:rgba(247,244,236,.55); font-size:.74rem; letter-spacing:.05em; text-transform:uppercase; font-family:'IBM Plex Mono', monospace; }

/* ---------- Footer ---------- */
.jp-footer{ background:var(--charcoal); color:rgba(247,244,236,.7); }
.jp-footer h4{ color:#fff; font-size:1.02rem; margin-bottom:1rem; }
.jp-footer a{ color:rgba(247,244,236,.65); }
.jp-footer a:hover{ color:var(--gold-soft); }
.jp-footer-bottom{ border-top:1px solid rgba(247,244,236,.1); font-size:.8rem; color:rgba(247,244,236,.45); }

/* ---------- Floating utilities ---------- */
.jp-float-whatsapp{
  position:fixed; right:1.1rem; bottom:1.1rem; z-index:1050;
  width:56px; height:56px; border-radius:50%;
  background:#1FAA59; color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:1.5rem; box-shadow:0 10px 26px rgba(0,0,0,.3);
  transition:transform .15s ease;
}
.jp-float-whatsapp:hover{ transform:scale(1.07); color:#fff; }

.jp-mobile-callbar{
  position:fixed; left:0; right:0; bottom:0; z-index:1040;
  display:none;
  background:var(--navy);
  border-top:1px solid rgba(228,184,92,.35);
}
.jp-mobile-callbar a{
  flex:1; text-align:center; padding:.85rem .5rem;
  font-weight:600; font-size:.85rem;
  display:flex; align-items:center; justify-content:center; gap:.45rem;
}
@media (max-width:767.98px){
  .jp-mobile-callbar{ display:flex; }
  body{ padding-bottom:58px; }
}

.jp-backtotop{
  position:fixed; right:1.1rem; bottom:5.3rem; z-index:1049;
  width:42px; height:42px; border-radius:50%;
  background:#fff; border:1px solid var(--line); color:var(--navy);
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:.2s ease; box-shadow:0 8px 20px rgba(0,0,0,.15);
}
.jp-backtotop.is-visible{ opacity:1; visibility:visible; transform:translateY(0); }
