/* ==========================================================================
   SANKIRT JASMINE — all rules scoped under .sj
   ========================================================================== */

/* ---------- tokens + reset ---------- */
.sj{
  --sj-white:#FFFFFF;     /* page ground */
  --sj-mist:#F6F8F7;      /* alternating sections */
  --sj-ink:#23282A;       /* body text            — 14.91:1 on white */
  --sj-maroon:#6E1A22;    /* brand: headings      — 11.45:1 on white */
  --sj-teal:#0F7B76;      /* brand: eyebrows      —  5.10:1 on white */
  --sj-gold:#C4A052;      /* DECORATIVE ONLY: hairlines, rules. 2.47:1 — never text */
  --sj-gold-deep:#8D6A22; /* button fills w/ white text — 4.98:1. (Spec's #A67C28 measured 3.79:1, fails AA) */
  --sj-mute:#5A6462;      /* secondary text       —  6.12:1 on white */
  --sj-ph:#6B7472;        /* form placeholders    —  4.81:1 on white */
  --sj-line:#E3E8E6;      /* borders */
  --sj-r:2px;
  --sj-pad:clamp(1.25rem,5vw,2.5rem);
  --sj-sec:clamp(4rem,9vw,7.5rem);
  margin:0;
  background:var(--sj-white);
  color:var(--sj-ink);
}
.sj :where(img,svg){max-width:100%}
.sj :where(img){height:auto}
.sj :where(h1,h2,h3,h4,p,ul,ol,figure,dl,dd,details,summary){margin:0}
.sj :where(ul,ol){padding:0;list-style:none}
.sj :where(button){font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
.sj :where(a){color:inherit;text-decoration:none}
.sj :where(table){border-collapse:collapse;width:100%}
.sj :where(input,select,textarea){font:inherit;color:inherit}

.sj [hidden]{display:none!important}

.sj :focus-visible{outline:2px solid var(--sj-teal);outline-offset:2px;border-radius:var(--sj-r)}

.sj-skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--sj-maroon);color:#fff;padding:.75rem 1.25rem;border:1px solid var(--sj-gold)}
.sj-skip:focus{left:.75rem;top:.75rem}

.sj-vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- shared layout ---------- */
.sj-wrap{width:100%;max-width:1200px;margin:0 auto;padding-inline:var(--sj-pad)}
.sj-sec{padding-block:var(--sj-sec);scroll-margin-top:84px}
.sj-sec--white{background:var(--sj-white);color:var(--sj-ink)}
.sj-sec--mist{background:var(--sj-mist);color:var(--sj-ink)}

.sj-eyebrow{font-family:'Jost',sans-serif;font-weight:400;font-size:.74rem;letter-spacing:.22em;text-transform:uppercase;color:var(--sj-teal);line-height:1.4}

.sj-h2{font-family:'Bodoni Moda',Georgia,'Times New Roman',serif;font-weight:500;font-size:clamp(1.8rem,3.2vw,2.8rem);line-height:1.15;letter-spacing:.005em;margin-top:.6rem;color:var(--sj-maroon)}
.sj-h3{font-family:'Jost',sans-serif;font-weight:500;font-size:1.15rem;letter-spacing:.02em;line-height:1.35}
.sj-rule{width:64px;height:1px;background:var(--sj-gold);border:0;margin:1.5rem 0 0}
.sj-lede{max-width:66ch;margin-top:1.5rem}
.sj-lede p+p{margin-top:1rem}
.sj-note{font-size:.78rem;line-height:1.6;color:var(--sj-mute);max-width:70ch}
.sj-num{font-variant-numeric:tabular-nums}

/* ---------- header ---------- */
.sj-header{position:fixed;top:0;left:0;right:0;z-index:90;transition:background .2s ease-out,border-color .2s ease-out}
.sj-header__in{display:flex;align-items:center;gap:1rem;max-width:1200px;margin:0 auto;padding:1rem var(--sj-pad);border-bottom:1px solid transparent;transition:border-color .2s ease-out}
.sj-header__mark{margin-right:auto;padding:.25rem;display:flex;align-items:center}
.sj-header__logo{display:block;width:auto;height:48px}
@media (max-width:700px){.sj-header__logo{height:40px}}

.sj-nav{display:none}
.sj-nav__list{display:flex;gap:1.6rem}
.sj-nav__list a{font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;font-weight:400;color:var(--sj-ink);padding:.4rem 0;border-bottom:1px solid transparent;transition:border-color .2s ease-out,color .2s ease-out}
.sj-nav__list a:hover{border-bottom-color:var(--sj-gold)}
.sj-nav__list a.is-active{color:var(--sj-teal);border-bottom-color:var(--sj-teal)}

.sj-enquire{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:#fff;background:var(--sj-gold-deep);padding:.55rem 1.15rem;border-radius:var(--sj-r);transition:background .2s ease-out}
.sj-enquire:hover{background:#7A5C1D}

.sj-burger{display:none;width:44px;height:44px;align-items:center;justify-content:center;flex-direction:column;gap:5px}
.sj-burger__bar{display:block;width:22px;height:1.5px;background:var(--sj-ink);transition:transform .2s ease-out,opacity .2s ease-out}

/* scrolled state — white bar, hairline underneath */
.sj-header{background:var(--sj-white)}
.sj-header.is-stuck{box-shadow:0 1px 12px rgba(35,40,42,.06)}
.sj-header.is-stuck .sj-header__in{border-bottom-color:var(--sj-line)}

@media (min-width:900px){
  .sj-header .sj-nav{display:block}
}
@media (max-width:899px){
  .sj-header .sj-burger{display:flex}
  .sj-nav.is-open{display:block;position:absolute;top:100%;left:0;right:0;background:var(--sj-white);border-bottom:1px solid var(--sj-line);box-shadow:0 12px 24px rgba(35,40,42,.08)}
  .sj-nav.is-open .sj-nav__list{flex-direction:column;gap:0;padding:.5rem var(--sj-pad) 1.25rem}
  .sj-nav.is-open .sj-nav__list a{display:block;padding:.7rem 0;border-bottom:1px solid var(--sj-line)}
  .sj-nav.is-open .sj-nav__list a.is-active{color:var(--sj-teal);border-bottom-color:var(--sj-teal)}
}

/* ---------- hero ---------- */
.sj-hero__band{position:relative;z-index:2;background:var(--sj-white)}
.sj-hero__in{width:100%;max-width:1200px;margin:0 auto;padding:clamp(2.5rem,5vw,4rem) var(--sj-pad) clamp(2.5rem,5vw,3.5rem);display:flex;flex-direction:column;align-items:center}
.sj-hero__logo{width:auto;height:72px;margin-bottom:28px}
.sj-hero__h1{font-family:'Bodoni Moda',Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(2.6rem,7vw,5.25rem);line-height:1.02;letter-spacing:.01em;color:var(--sj-maroon);text-align:center}
.sj-hero__rule{display:block;width:1px;height:44px;background:var(--sj-gold);margin:24px 0}
.sj-hero__tag{font-family:'Jost',sans-serif;font-weight:400;font-size:.82rem;letter-spacing:.34em;text-transform:uppercase;color:var(--sj-teal);margin:0;text-align:center}
.sj-hero__place{font-family:'Jost',sans-serif;font-weight:400;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--sj-mute);margin-top:28px;text-align:center}

@media (max-width:700px){
  .sj-hero__logo{height:56px;margin-bottom:20px}
  .sj-hero__rule{margin:18px 0}
  .sj-hero__place{margin-top:20px}
}
@media (max-width:520px){
  .sj-hero__logo{height:50px;margin-bottom:18px}
}


/* ================= buttons ================= */
.sj-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:44px;padding:.75rem 1.5rem;border-radius:var(--sj-r);font-size:.82rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;line-height:1.2;text-align:center;cursor:pointer;transition:background .2s ease-out,color .2s ease-out,border-color .2s ease-out}
.sj-btn--gold{background:var(--sj-gold-deep);color:#fff;border:1px solid var(--sj-gold-deep)}
.sj-btn--gold:hover{background:#7A5C1D;border-color:#7A5C1D}
.sj-btn--ghost{background:transparent;color:var(--sj-maroon);border:1px solid var(--sj-line);font-weight:400}
.sj-btn--ghost:hover{border-color:var(--sj-gold-deep);color:var(--sj-gold-deep)}
.sj-btn--wa{background:#1FA855;color:#fff;border:1px solid #1FA855}
.sj-btn--wa:hover{background:#188945;border-color:#188945}

.sj-ai{display:inline-block;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sj-mute);margin-top:.5rem}
.sj-ai--on{position:absolute;left:8px;bottom:8px;margin:0;padding:.2rem .45rem;background:rgba(255,255,255,.9);color:var(--sj-ink);border:1px solid var(--sj-line);border-radius:var(--sj-r)}

/* ================= 5.1 trust pills ================= */
.sj-trust{padding-block:clamp(2.5rem,5vw,3.5rem)}
.sj-pills{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center}
.sj-pill{border:1px solid var(--sj-gold);border-radius:var(--sj-r);padding:.5rem 1rem;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sj-teal);font-weight:500;background:var(--sj-white)}

/* ================= 5.2 stat strip ================= */
.sj-stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:3rem;border-top:1px solid var(--sj-line)}
.sj-stat{padding:1.75rem 1rem;text-align:center;border-right:1px solid var(--sj-line)}
.sj-stat:last-child{border-right:0}
.sj-stat__v{font-family:'Bodoni Moda',Georgia,serif;font-weight:500;font-size:2.4rem;line-height:1.1;color:var(--sj-maroon);overflow-wrap:normal;word-break:normal;min-inline-size:0}
.sj-stat__v--rera{font-size:1.15rem;letter-spacing:.02em;padding-top:.75rem}
.sj-stat__l{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sj-teal);margin-top:.5rem}
.sj-stats--dev{grid-template-columns:repeat(5,1fr);margin-top:3.5rem;border-color:var(--sj-line)}
.sj-stats--dev .sj-stat{border-color:var(--sj-line)}
@media (max-width:820px){
  .sj-stats,.sj-stats--dev{grid-template-columns:repeat(2,1fr)}
  .sj-stat{border-bottom:1px solid var(--sj-line)}
  .sj-stat:nth-child(2n){border-right:0}
  .sj-stats--dev .sj-stat:last-child{grid-column:1/-1;border-right:0}
}
@media (max-width:520px){
  .sj-stat{padding:1.5rem .6rem}
  .sj-stat__v{font-size:1.95rem;white-space:nowrap}
  /* the registration number is one indivisible token — give it the full row rather than break it */
  .sj-stats>.sj-stat:last-child{grid-column:1/-1;border-right:0;border-bottom:0}
  .sj-stats>.sj-stat:nth-last-child(2){border-right:0}
  .sj-stat__v--rera{font-size:1.15rem;white-space:nowrap;padding-top:0}
}

/* ================= 5.3 overview ================= */
.sj-over{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(2rem,5vw,4.5rem);align-items:start}
.sj-more{margin-top:1.75rem}
.sj-more__btn{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;padding:.7rem 1.35rem;border:1px solid var(--sj-line);border-radius:var(--sj-r);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;list-style:none;transition:border-color .2s ease-out,color .2s ease-out}
.sj-more__btn::-webkit-details-marker{display:none}
.sj-more__btn::after{content:"+";font-size:1rem;line-height:1}
.sj-more[open] .sj-more__btn::after{content:"\2013"}
.sj-more__btn:hover{border-color:var(--sj-gold-deep);color:var(--sj-gold-deep)}
.sj-more__body{margin-top:1.25rem}
.sj-over__art{display:grid;grid-template-columns:repeat(6,1fr);gap:1.25rem}
.sj-over__fig{margin:0}
.sj-over__fig img{width:100%;display:block;border-radius:var(--sj-r)}
.sj-over__fig--a{grid-column:1/7}
.sj-over__fig--b{grid-column:1/4;margin-top:1.25rem}
.sj-over__fig--c{grid-column:4/7;margin-top:3.25rem}
@media (max-width:900px){
  .sj-over{grid-template-columns:1fr}
  .sj-over__art{margin-top:.5rem}
}

/* ================= aerial band ================= */
.sj-band{background:var(--sj-mist);line-height:0}
.sj-band img{width:100%;height:clamp(220px,32vw,420px);object-fit:cover;object-position:center 42%;display:block}

/* ================= 5.4 six ideas ================= */
.sj-ideas{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:3rem}
.sj-idea{padding:1.75rem 1.5rem 1.75rem 0;border-top:1px solid var(--sj-line)}
.sj-idea p{margin-top:.5rem;font-size:.95rem;color:var(--sj-mute);max-width:34ch}
@media (max-width:860px){.sj-ideas{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.sj-ideas{grid-template-columns:1fr}}

/* ================= 5.5 amenities ================= */
.sj-sec--tight{padding-top:0}
.sj-amen{display:grid;grid-template-columns:repeat(4,1fr);margin-top:3rem;border-top:1px solid var(--sj-line);border-left:1px solid var(--sj-line)}
.sj-amen__i{display:flex;align-items:center;gap:.85rem;padding:1.25rem 1rem;border-right:1px solid var(--sj-line);border-bottom:1px solid var(--sj-line);font-size:.92rem;line-height:1.35}
.sj-amen__ic{flex:0 0 auto;width:26px;height:26px;color:var(--sj-teal)}
.sj-amen__ic svg{width:100%;height:100%;display:block}
@media (max-width:900px){.sj-amen{grid-template-columns:repeat(3,1fr)}}
@media (max-width:640px){.sj-amen{grid-template-columns:repeat(2,1fr)}.sj-amen__i{font-size:.85rem;padding:1rem .75rem;gap:.6rem}}

/* ================= 5.6 residences table ================= */
.sj-tbl{margin-top:2.5rem;border-top:1px solid var(--sj-line)}
.sj-tbl th,.sj-tbl td{text-align:left;padding:1.1rem .9rem;border-bottom:1px solid var(--sj-line);vertical-align:middle}
.sj-tbl thead th{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;font-weight:400;color:var(--sj-teal);padding-block:.85rem}
.sj-tbl tbody th{font-family:'Jost',sans-serif;font-weight:500;font-size:1.05rem;color:var(--sj-maroon)}
.sj-tbl__p{font-weight:500;color:var(--sj-maroon)}
.sj-tbl td:last-child{text-align:right;white-space:nowrap}
.sj-tbl__note{margin-top:1rem}
@media (max-width:760px){
  .sj-tbl,.sj-tbl thead,.sj-tbl tbody,.sj-tbl tr,.sj-tbl th,.sj-tbl td{display:block;width:100%}
  .sj-tbl thead{display:none}
  .sj-tbl{border-top:0}
  .sj-tbl tbody tr{border:1px solid var(--sj-line);border-radius:var(--sj-r);padding:1rem;margin-bottom:1rem}
  .sj-tbl tbody th,.sj-tbl td{border-bottom:0;padding:.3rem 0}
  .sj-tbl td[data-th]::before{content:attr(data-th);display:block;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sj-teal);margin-bottom:.15rem}
  .sj-tbl td:last-child{text-align:left;margin-top:.85rem;white-space:normal}
  .sj-tbl td:last-child .sj-btn{width:100%}
}

/* ================= 5.7 estimator ================= */
.sj-est{margin-top:clamp(3rem,6vw,4.5rem);border:1px solid var(--sj-line);border-radius:var(--sj-r);padding:clamp(1.5rem,4vw,2.5rem);max-width:640px}
.sj-est__h{color:var(--sj-maroon)}
.sj-est__ctrl{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.25rem}
.sj-chip{min-height:44px;padding:.6rem 1.15rem;border:1px solid var(--sj-line);border-radius:var(--sj-r);font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;transition:background .2s ease-out,border-color .2s ease-out,color .2s ease-out}
.sj-chip:hover{border-color:var(--sj-gold-deep)}
.sj-chip.is-on{background:var(--sj-teal);border-color:var(--sj-teal);color:#fff;font-weight:500}
.sj-est__rows{margin-top:1.75rem}
.sj-est__r{display:flex;justify-content:space-between;gap:1rem;padding:.7rem 0;border-bottom:1px solid var(--sj-line);font-size:.95rem}
.sj-est__r dt{color:var(--sj-mute)}
.sj-est__r dd{font-variant-numeric:tabular-nums;font-weight:500;color:var(--sj-ink);white-space:nowrap}
.sj-est__r--tot{border-bottom:0;border-top:1px solid var(--sj-maroon);margin-top:.35rem;padding-top:.9rem}
.sj-est__r--tot dt{font-weight:500;color:var(--sj-maroon);text-transform:uppercase;letter-spacing:.1em;font-size:.78rem;align-self:center}
.sj-est__r--tot dd{font-family:'Bodoni Moda',Georgia,serif;font-size:1.6rem}
.sj-est__msg{padding:.9rem 0;font-size:.95rem}
.sj-est__note{margin:1.25rem 0 1.5rem}

/* ================= 5.8 floor plans ================= */
.sj-tabs{margin-top:2.5rem}
.sj-tabs__list{display:flex;flex-wrap:wrap;gap:.35rem;border-bottom:1px solid var(--sj-line)}
.sj-tab{min-height:44px;padding:.7rem 1.1rem;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--sj-mute);border-bottom:2px solid transparent;transition:color .2s ease-out,border-color .2s ease-out}
.sj-tab:hover{color:var(--sj-ink)}
.sj-tab.is-on{color:var(--sj-teal);border-bottom-color:var(--sj-teal)}
.sj-panel{padding-top:2rem}
.sj-panel:focus-visible{outline:2px solid var(--sj-teal);outline-offset:4px}

.sj-plan{position:relative;background:var(--sj-white);border:1px solid var(--sj-line);border-radius:var(--sj-r);padding:1rem}
.sj-plan__imgs{display:grid;gap:1rem}
.sj-plan__imgs--multi{grid-template-columns:repeat(3,1fr)}
.sj-plan__z{display:block;width:100%;padding:0;cursor:default}
.sj-plan__z img{width:100%;display:block;border-radius:var(--sj-r);transition:filter .3s ease-out}
.sj-plan.is-locked .sj-plan__z img{filter:blur(7px)}
.sj-plan:not(.is-locked) .sj-plan__z{cursor:zoom-in}
.sj-lock{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;text-align:center;padding:1.5rem;background:rgba(255,255,255,.72);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);border-radius:var(--sj-r)}
.sj-lock__h{font-family:'Bodoni Moda',Georgia,serif;font-size:1.5rem;color:var(--sj-maroon)}
.sj-lock__p{font-size:.92rem;color:var(--sj-ink);max-width:38ch;margin-bottom:.75rem}
.sj-plans__wa{margin-top:1.75rem}
@media (max-width:760px){
  .sj-plan__imgs--multi{grid-template-columns:1fr}
  .sj-tabs__list{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain}
  .sj-tabs__list::-webkit-scrollbar{display:none}
  .sj-tab{flex:0 0 auto;white-space:nowrap}
}

/* ================= 5.9 specifications ================= */
.sj-specs{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.5rem,3vw,2.25rem);margin-top:3rem}
.sj-spec{border-top:1px solid var(--sj-line);padding-top:1.25rem}
.sj-spec__fig{position:relative;margin:0 0 1rem}
.sj-spec__fig img{width:100%;aspect-ratio:16/8;object-fit:cover;display:block;border-radius:var(--sj-r)}
.sj-spec__fig .sj-ai{position:absolute;left:8px;bottom:8px;margin:0;padding:.2rem .45rem;background:rgba(255,255,255,.9);color:var(--sj-ink);border:1px solid var(--sj-line);border-radius:var(--sj-r)}
.sj-spec p{margin-top:.5rem;font-size:.95rem}
@media (max-width:900px){.sj-specs{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.sj-specs{grid-template-columns:1fr}}

/* ================= 5.10 gallery ================= */
.sj-gal{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:112px;grid-auto-flow:row dense;gap:1rem;margin-top:3rem}
.sj-gal__i{display:flex;flex-direction:column;grid-row:span 2;min-height:0}
.sj-gal__i--tall{grid-row:span 3}
.sj-gal__b{position:relative;display:block;width:100%;flex:1 1 auto;min-height:0;cursor:zoom-in;border-radius:var(--sj-r);overflow:hidden}
.sj-gal__b img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .2s ease-out}
.sj-gal__b:hover img{transform:scale(1.02)}
.sj-gal__c{flex:0 0 auto;font-size:.76rem;color:var(--sj-mute);margin-top:.5rem;letter-spacing:.04em;line-height:1.4}
@media (max-width:900px){.sj-gal{grid-template-columns:repeat(2,1fr);grid-auto-rows:104px}}
@media (max-width:520px){.sj-gal{grid-template-columns:1fr;grid-auto-rows:auto}.sj-gal__i,.sj-gal__i--tall{grid-row:auto}.sj-gal__b{aspect-ratio:4/3;flex:0 0 auto}}

/* ================= 5.11 facade break ================= */
.sj-break{position:relative;text-align:center;background:var(--sj-white);overflow:hidden}
.sj-break__media{line-height:0}
.sj-break__media img{width:100%;height:clamp(260px,38vw,460px);object-fit:cover;object-position:center 32%;display:block}
.sj-break__in{position:relative;z-index:2;padding:clamp(2.5rem,6vw,4rem) var(--sj-pad);max-width:52rem;margin:0 auto}
.sj-break__in .sj-h2{margin-top:.75rem}
.sj-break__p{margin-top:1.25rem;color:var(--sj-mute);max-width:60ch;margin-inline:auto}

/* ================= 5.12 location ================= */
.sj-loc{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(2rem,4vw,3.5rem);margin-top:2.5rem;align-items:start}
.sj-loc__z{position:relative;display:block;width:100%;cursor:zoom-in;border:1px solid var(--sj-line);border-radius:var(--sj-r);overflow:hidden;background:#fff}
.sj-loc__z img{width:100%;display:block}
.sj-loc__cue{position:absolute;right:10px;bottom:10px;padding:.35rem .7rem;background:var(--sj-maroon);color:#fff;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;border-radius:var(--sj-r)}
.sj-loc__tabs .sj-tabs__list{border-bottom-color:var(--sj-line)}
.sj-loc__tabs .sj-tab{color:var(--sj-mute)}
.sj-loc__tabs .sj-tab:hover{color:var(--sj-ink)}
.sj-loc__tabs .sj-tab.is-on{color:var(--sj-teal);border-bottom-color:var(--sj-teal)}
.sj-tabs__list--sm .sj-tab{padding:.6rem .85rem;font-size:.74rem}
.sj-loc__b{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--sj-teal);padding-bottom:.75rem;border-bottom:1px solid var(--sj-line)}
.sj-loc__l li{padding:.7rem 0;border-bottom:1px solid var(--sj-line);font-size:.95rem}
.sj-loc__addr{margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid var(--sj-line);max-width:60ch;font-size:1rem}
.sj-loc__addr+.sj-btn{margin-top:1.25rem}
.sj-loc__note{margin-top:1.25rem}
@media (max-width:900px){.sj-loc{grid-template-columns:1fr}}

/* ================= 5.13 developer ================= */
.sj-port__h{margin-top:3rem;color:var(--sj-teal)}
.sj-port{display:grid;grid-template-columns:repeat(4,1fr);margin-top:1.25rem;border-top:1px solid var(--sj-line);border-left:1px solid var(--sj-line)}
.sj-port li{padding:1.1rem 1rem;border-right:1px solid var(--sj-line);border-bottom:1px solid var(--sj-line);font-size:.95rem}
.sj-lead{margin-top:2rem;padding-top:1.25rem;border-top:1px solid var(--sj-line);font-size:.8rem;color:var(--sj-mute)}
@media (max-width:820px){.sj-port{grid-template-columns:repeat(2,1fr)}}
@media (max-width:460px){.sj-port{grid-template-columns:1fr}}

/* ================= 5.14 FAQ ================= */
.sj-faq{margin-top:2.5rem;border-top:1px solid var(--sj-line);max-width:80ch}
.sj-q{border-bottom:1px solid var(--sj-line)}
.sj-q__s{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1.15rem 0;min-height:44px;cursor:pointer;list-style:none;font-family:'Jost',sans-serif;font-weight:500;font-size:1.02rem;color:var(--sj-maroon)}
.sj-q__s::-webkit-details-marker{display:none}
.sj-q__s::after{content:"+";flex:0 0 auto;font-size:1.2rem;line-height:1.2;color:var(--sj-teal)}
.sj-q[open] .sj-q__s::after{content:"\2013"}
.sj-q__a{padding-bottom:1.25rem;max-width:66ch}

/* ================= 5.15 channel partner ================= */
.sj-partner{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(1.5rem,4vw,3rem);align-items:start}
.sj-partner__photo{width:128px;height:128px;flex:0 0 auto;border:2px solid var(--sj-gold)}
.sj-partner__n{font-family:'Bodoni Moda',Georgia,serif;font-size:1.8rem;line-height:1.2;color:var(--sj-maroon)}
.sj-partner__r{font-size:.85rem;color:var(--sj-teal);letter-spacing:.08em;margin-top:.2rem}
.sj-partner .sj-h2{margin-top:1.25rem}
.sj-partner__tel{margin-top:1.25rem}
.sj-partner__tel a{font-family:'Bodoni Moda',Georgia,serif;font-size:clamp(1.6rem,3.4vw,2.2rem);color:var(--sj-maroon);border-bottom:1px solid var(--sj-gold);transition:border-color .2s ease-out}
.sj-partner__tel a:hover{border-bottom-color:var(--sj-maroon)}
.sj-partner__p{margin-top:1.25rem;max-width:60ch;color:var(--sj-mute)}
.sj-partner__btns{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.75rem}
@media (max-width:640px){.sj-partner{grid-template-columns:1fr}}

/* ================= 5.16 inline enquiry ================= */
.sj-inline__h{margin-top:.6rem;color:var(--sj-maroon);font-size:1.4rem}
.sj-inline .sj-formhost{margin-top:2rem;max-width:640px}

/* ================= form ================= */
.sj-form{display:grid;gap:1.35rem}
.sj-form__brand{display:flex;justify-content:center;margin-bottom:.25rem}
.sj-form__logo{display:block;width:auto;height:56px}
.sj-form__h{font-family:'Jost',sans-serif;font-weight:500;font-size:1.18rem;line-height:1.35;text-align:center;color:var(--sj-ink);letter-spacing:.01em}
.sj-form__h em{font-style:normal;color:var(--sj-maroon)}
.sj-f{display:flex;flex-direction:column;gap:.3rem}
/* underline-only: one hairline under each field, no box, no fill */
.sj-f__in{width:100%;min-height:46px;padding:.65rem .1rem;background:transparent;border:0;border-bottom:1px solid var(--sj-line);border-radius:0;color:var(--sj-ink);font-size:1rem;transition:border-color .2s ease-out}
.sj-f__in::placeholder{color:var(--sj-ph);opacity:1}
.sj-f__in:hover{border-bottom-color:var(--sj-mute)}
.sj-f__in:focus{outline:0;border-bottom-color:var(--sj-teal);border-bottom-width:2px;padding-bottom:calc(.65rem - 1px)}
.sj-f__err{font-size:.78rem;color:#B3261E;min-height:0}
.sj-f.is-bad .sj-f__in{border-bottom-color:#B3261E}
/* mobile: fixed +91 prefix with an inline-SVG India flag */
.sj-f__tel{display:flex;align-items:center;gap:.55rem;border-bottom:1px solid var(--sj-line);transition:border-color .2s ease-out}
.sj-f__tel:focus-within{border-bottom-color:var(--sj-teal);border-bottom-width:2px}
.sj-f.is-bad .sj-f__tel{border-bottom-color:#B3261E}
.sj-f__tel .sj-f__in{border-bottom:0;flex:1 1 auto;min-width:0}
.sj-f__tel .sj-f__in:focus{border-bottom:0;padding-bottom:.65rem}
.sj-f__cc{display:flex;align-items:center;gap:.4rem;flex:0 0 auto;padding:0;font-size:1rem;color:var(--sj-ink);white-space:nowrap}
.sj-f__flag{display:block;width:22px;height:15px;flex:0 0 auto;border:1px solid var(--sj-line);border-radius:1px}
.sj-f--hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.sj-form__sum{display:none;padding:.85rem 1rem;border:1px solid #B3261E;border-radius:var(--sj-r);background:#FDF3F2;color:#8C1D18;font-size:.85rem}
.sj-form__sum.is-on{display:block}
.sj-form__sum ul{margin-top:.35rem}
.sj-form__sum a{text-decoration:underline}
.sj-form .sj-btn{width:100%;margin-top:.35rem}
.sj-form__fine{font-size:.72rem;line-height:1.5;color:var(--sj-mute)}
.sj-done{text-align:left}
.sj-done__h{font-family:'Bodoni Moda',Georgia,serif;font-size:1.5rem;line-height:1.2}
.sj-done__p{margin-top:.75rem;font-size:.95rem}
.sj-done .sj-btn{margin-top:1.25rem}
.sj-done__alt{margin-top:1rem;font-size:.85rem}
.sj-done__alt a{border-bottom:1px solid currentColor}
.sj-done__h{color:var(--sj-maroon)}

/* ================= modal / popup / lightbox ================= */
.sj-modal,.sj-pop,.sj-lb{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:1.25rem}
.sj-modal__bd{position:absolute;inset:0;background:rgba(35,40,42,.55)}
.sj-modal__card,.sj-pop__card{position:relative;z-index:1;width:min(520px,100%);max-height:88vh;overflow-y:auto;background:var(--sj-white);color:var(--sj-ink);border:1px solid var(--sj-gold);border-radius:var(--sj-r);padding:clamp(1.5rem,4vw,2.25rem);box-shadow:0 18px 60px rgba(35,40,42,.22)}
.sj-modal__x{position:absolute;top:10px;right:10px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:var(--sj-ink);border-radius:var(--sj-r);transition:background .2s ease-out}
.sj-modal__x:hover{background:rgba(35,40,42,.07)}
.sj-lb__x{position:absolute;top:10px;right:10px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:#fff;border-radius:var(--sj-r);transition:background .2s ease-out}
.sj-lb__x:hover{background:rgba(255,255,255,.18)}
.sj-modal__x svg,.sj-lb__x svg{width:20px;height:20px}
.sj-modal__h,.sj-pop__h{font-family:'Bodoni Moda',Georgia,serif;font-weight:500;font-size:1.6rem;line-height:1.2;margin-top:.5rem;color:var(--sj-maroon);padding-right:2.5rem}
.sj-pop__p{margin-top:.75rem;font-size:.92rem;color:var(--sj-mute)}
.sj-modal .sj-formhost,.sj-pop .sj-formhost{margin-top:1.5rem}

.sj-lb{padding:0;background:rgba(35,40,42,.92)}
.sj-lb__card{position:relative;z-index:1;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3.5rem 1rem 4rem}
.sj-lb__img{max-width:min(1200px,94vw);max-height:78vh;object-fit:contain;background:#fff;border-radius:var(--sj-r)}
.sj-lb__cap{margin-top:1rem;font-size:.82rem;color:rgba(255,255,255,.9);text-align:center;padding-inline:1rem}
.sj-lb__nav{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;display:flex;align-items:center;justify-content:center;color:#fff;background:rgba(35,40,42,.6);border-radius:var(--sj-r);transition:background .2s ease-out}
.sj-lb__nav:hover{background:rgba(35,40,42,.9)}
.sj-lb__nav svg{width:22px;height:22px}
.sj-lb__nav--p{left:12px}
.sj-lb__nav--n{right:12px}
.sj-lb__x{top:14px;right:14px}

/* ================= floating buttons ================= */
.sj-fab-whatsapp{position:fixed;right:18px;bottom:92px;z-index:100;width:52px;height:52px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#25D366;color:#fff;box-shadow:0 6px 20px rgba(0,0,0,.28);transition:transform .2s ease-out}
.sj-fab-whatsapp svg{width:28px;height:28px}
.sj-fab-whatsapp:hover{transform:translateY(-2px)}
.sj-fab-chat{position:fixed;right:18px;bottom:calc(20px + env(safe-area-inset-bottom));z-index:100;width:60px;height:60px;border-radius:50%;background:var(--sj-white);border:2px solid var(--sj-gold);box-shadow:0 6px 20px rgba(35,40,42,.20);padding:0;transition:transform .2s ease-out}
.sj-fab-chat:hover{transform:translateY(-2px)}
.sj-fab-chat__dot{position:absolute;top:0;right:0;width:12px;height:12px;border-radius:50%;background:var(--sj-gold-deep);border:2px solid var(--sj-white)}
.sj-fab-chat.is-open .sj-fab-chat__dot{display:none}
.sj-teaser{position:fixed;right:88px;bottom:calc(30px + env(safe-area-inset-bottom));z-index:100;max-width:min(15rem,60vw);padding:.7rem .95rem;background:var(--sj-white);color:var(--sj-ink);border:1px solid var(--sj-gold);border-radius:8px 8px 2px 8px;font-size:.85rem;line-height:1.4;box-shadow:0 6px 20px rgba(35,40,42,.18);animation:sj-teaser .3s ease-out}
@keyframes sj-teaser{from{opacity:0;transform:translateX(8px)}to{opacity:1;transform:none}}

/* avatar — contain, per spec */
.sj-fab-chat__img,.sj-partner__photo,.sj-chatbot__avatar{border-radius:50%;overflow:hidden;background:var(--sj-white);display:flex;align-items:center;justify-content:center}
.sj-fab-chat__img img,.sj-partner__photo img,.sj-chatbot__avatar img{width:92%;height:92%;object-fit:contain;object-position:center center;border-radius:50%;display:block}
.sj-fab-chat__img{width:100%;height:100%}

/* Mobile: the FAB stack is viewport-anchored, so at rest it floats over the
   bottom of the hero copy and clips the tagline. Both the copy position and the
   FAB position scale with viewport height, so no amount of resizing separates
   them — hold the stack back until the first scroll instead. The header ENQUIRE
   button carries the CTA until then. */
@media (max-width:700px){
  .sj-fab-whatsapp,.sj-fab-chat{opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .28s ease-out,transform .28s ease-out,visibility .28s}
  .sj-fabs-on .sj-fab-whatsapp,.sj-fabs-on .sj-fab-chat{opacity:1;visibility:visible;transform:none}
  .sj-fabs-on .sj-fab-whatsapp:hover,.sj-fabs-on .sj-fab-chat:hover{transform:translateY(-2px)}
}

/* ================= chatbot ================= */
.sj-bot{position:fixed;right:18px;bottom:calc(92px + env(safe-area-inset-bottom));z-index:110;width:340px;height:480px;display:flex;flex-direction:column;background:var(--sj-white);border:1px solid var(--sj-line);border-radius:var(--sj-r);box-shadow:0 18px 50px rgba(35,40,42,.20);overflow:hidden}
.sj-bot__hd{display:flex;align-items:center;gap:.65rem;padding:.7rem .75rem;background:var(--sj-white);color:var(--sj-maroon);border-bottom:1px solid var(--sj-line)}
.sj-chatbot__avatar{width:36px;height:36px;flex:0 0 auto}
.sj-bot__id{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.sj-bot__n{font-weight:500;font-size:.9rem}
.sj-bot__r{font-size:.72rem;color:var(--sj-teal)}
.sj-bot__x{margin-left:auto;width:36px;height:36px;display:flex;align-items:center;justify-content:center;color:var(--sj-ink);border-radius:var(--sj-r)}
.sj-bot__x:hover{background:rgba(35,40,42,.07)}
.sj-bot__x svg{width:18px;height:18px}
.sj-bot__body{flex:1 1 auto;overflow-y:auto;padding:1rem .85rem;display:flex;flex-direction:column;gap:.6rem}
.sj-msg{max-width:86%;padding:.6rem .8rem;font-size:.88rem;line-height:1.5}
.sj-msg--bot{align-self:flex-start;background:var(--sj-mist);border:1px solid var(--sj-line);color:var(--sj-ink);border-radius:8px 8px 8px 2px}
.sj-msg--me{align-self:flex-end;background:var(--sj-gold-deep);color:#fff;border-radius:8px 8px 2px 8px;font-weight:500}
.sj-msg--typing{display:flex;gap:4px;align-items:center;padding:.7rem .8rem}
.sj-msg--typing span{width:6px;height:6px;border-radius:50%;background:#9BA39C;animation:sj-dot 1.1s ease-in-out infinite}
.sj-msg--typing span:nth-child(2){animation-delay:.15s}
.sj-msg--typing span:nth-child(3){animation-delay:.3s}
@keyframes sj-dot{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
.sj-bot__qr{display:flex;flex-wrap:wrap;gap:.4rem;padding:.6rem .85rem;border-top:1px solid var(--sj-line);background:#fff}
.sj-qr{min-height:36px;padding:.4rem .8rem;border:1px solid var(--sj-line);border-radius:999px;font-size:.8rem;color:var(--sj-maroon);transition:background .2s ease-out,border-color .2s ease-out}
.sj-qr:hover{background:var(--sj-maroon);border-color:var(--sj-maroon);color:#fff}
.sj-bot__ft{padding:.5rem .85rem;background:var(--sj-white);border-top:1px solid var(--sj-line);font-size:.7rem;color:var(--sj-mute)}
@media (max-width:480px){
  .sj-bot{right:0;left:0;bottom:0;top:0;width:100%;height:100%;border-radius:0;border:0}
}

/* ================= footer ================= */
.sj-foot{background:var(--sj-mist);color:var(--sj-ink);padding-block:clamp(3rem,6vw,4.5rem) 2rem;border-top:1px solid var(--sj-line)}
.sj-foot__cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:clamp(1.5rem,4vw,3rem)}
.sj-foot__logo{display:block;width:auto;height:56px;margin-bottom:1rem}
.sj-foot__h{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--sj-teal)}
.sj-foot__t{margin-top:.75rem;font-size:.85rem;color:var(--sj-mute);line-height:1.6;max-width:40ch}
.sj-foot__l{margin-top:.85rem}
.sj-foot__l li{padding:.28rem 0;font-size:.88rem;color:var(--sj-ink)}
.sj-foot__l a,.sj-foot__t a{border-bottom:1px solid transparent;transition:border-color .2s ease-out,color .2s ease-out}
.sj-foot__l a:hover,.sj-foot__t a:hover{color:var(--sj-maroon);border-bottom-color:var(--sj-gold)}
.sj-foot__cols>div+div{padding-left:clamp(0px,2vw,1.5rem);border-left:1px solid var(--sj-line)}
.sj-foot__fine{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.25rem,3vw,2.5rem);margin-top:3rem;padding-top:2rem;border-top:1px solid var(--sj-line)}
.sj-foot__fine p{font-size:.75rem;line-height:1.6;color:var(--sj-mute)}
.sj-foot__fh{font-size:.75rem!important;letter-spacing:.1em;text-transform:uppercase;color:var(--sj-teal)!important;margin-bottom:.4rem}
.sj-foot__cp{margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--sj-line);font-size:.75rem;color:var(--sj-mute)}
@media (max-width:860px){.sj-foot__cols{grid-template-columns:1fr 1fr}.sj-foot__fine{grid-template-columns:1fr}}
@media (max-width:520px){.sj-foot__cols{grid-template-columns:1fr}.sj-foot__cols>div+div{padding-left:0;border-left:0}}

/* body scroll lock */
.sj-lock-scroll{overflow:hidden}

/* ---------- no-JS fallback ---------- */
.sj-nojs{margin-top:2rem;padding:1.5rem;border:1px solid var(--sj-line);border-radius:var(--sj-r)}
.sj-nojs__p{max-width:52ch}
.sj-nojs__btns{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.25rem}

/* ---------- editorial splits: heading rail left, content right ----------
   Below 1000px these collapse back to the stacked single-column order. */
@media (min-width:1000px){
  #faq .sj-wrap,#enquire .sj-wrap{display:grid;grid-template-columns:minmax(0,20rem) minmax(0,1fr);column-gap:clamp(2.5rem,5vw,5rem);align-items:start}
  #faq .sj-eyebrow,#enquire .sj-eyebrow{grid-column:1;grid-row:1}
  #faq .sj-h2,#enquire .sj-inline__h{grid-column:1;grid-row:2}
  #faq .sj-rule,#enquire .sj-rule{grid-column:1;grid-row:3}
  #faq .sj-faq{grid-column:2;grid-row:1/5;margin-top:0;max-width:none}
  #enquire .sj-formhost,#enquire noscript{grid-column:2;grid-row:1/5}
  #enquire .sj-form{max-width:34rem}
}

/* estimator: choice on the left, the money on the right */
.sj-est__cta{margin-top:2rem}
.sj-est__out .sj-est__rows{margin-top:1.75rem}
@media (min-width:860px){
  .sj-est{max-width:none;display:grid;grid-template-columns:minmax(0,21rem) minmax(0,1fr);grid-template-rows:auto 1fr;column-gap:clamp(2rem,4vw,3.5rem)}
  .sj-est__side{grid-column:1;grid-row:1}
  .sj-est__cta{grid-column:1;grid-row:2;align-self:start;justify-self:start}
  .sj-est__out{grid-column:2;grid-row:1/3}
  .sj-est__out .sj-est__rows{margin-top:0}
}

/* gallery: staggered seams, but every column resolves on the same baseline */
@media (min-width:900px){
  .sj-gal{grid-auto-flow:row}
  .sj-gal__i,.sj-gal__i--tall{grid-row:auto}
  .sj-gal__i:nth-child(1){grid-column:1;grid-row:1/4}
  .sj-gal__i:nth-child(2){grid-column:2;grid-row:1/3}
  .sj-gal__i:nth-child(3){grid-column:3;grid-row:1/4}
  .sj-gal__i:nth-child(4){grid-column:4;grid-row:1/3}
  .sj-gal__i:nth-child(5){grid-column:1;grid-row:4/6}
  .sj-gal__i:nth-child(6){grid-column:2;grid-row:3/6}
  .sj-gal__i:nth-child(7){grid-column:3;grid-row:4/6}
  .sj-gal__i:nth-child(8){grid-column:4;grid-row:3/6}
}

/* ---------- overlay form: CTA stays reachable ---------- */
.sj-modal__card,.sj-pop__card{max-height:min(88svh,940px)}
.sj-pop .sj-form{gap:.85rem}
.sj-pop .sj-modal__h,.sj-pop .sj-pop__h{font-size:1.45rem}
.sj-pop .sj-formhost{margin-top:1.15rem}
/* the card scrolls, so pin submit to its bottom edge — the white shadow masks copy passing beneath */
.sj-modal .sj-form>[type="submit"],.sj-pop .sj-form>[type="submit"]{position:sticky;bottom:0;z-index:2;box-shadow:0 -16px 16px -8px var(--sj-white)}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  .sj *,.sj *::before,.sj *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .sj-hero__media img{transform:none!important;animation:none!important}
}