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

/* ---------- tokens + reset ---------- */
.sj{
  --sj-forest:#14261F;
  --sj-moss:#2E4438;
  --sj-gold:#C4A052;      /* brand accent: rules, fills, borders */
  --sj-gold-text:#CBA95C; /* gold TEXT on dark grounds (AA on forest + moss) */
  --sj-gold-ink:#85641A;  /* gold TEXT on light grounds (AA on bone) */
  --sj-bone:#EDEAE3;
  --sj-stone:#3D4A44;
  --sj-line:#D6D2C8;
  --sj-ivory:#F4F1EA;
  --sj-r:2px;
  --sj-pad:clamp(1.25rem,5vw,2.5rem);
  --sj-sec:clamp(4rem,9vw,7.5rem);
  margin:0;
}
.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-gold);outline-offset:2px;border-radius:var(--sj-r)}
.sj-onlight :focus-visible,.sj [data-ground="light"] :focus-visible{outline-color:var(--sj-gold-ink)}

.sj-skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--sj-forest);color:var(--sj-ivory);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--bone{background:var(--sj-bone);color:var(--sj-stone)}
.sj-sec--forest{background:var(--sj-forest);color:var(--sj-ivory)}
.sj-sec--moss{background:var(--sj-moss);color:var(--sj-ivory)}

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

.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-forest)}
.sj-sec--forest .sj-h2,.sj-sec--moss .sj-h2{color:var(--sj-ivory)}
.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-stone);opacity:.8;max-width:70ch}
.sj-sec--forest .sj-note,.sj-sec--moss .sj-note{color:var(--sj-ivory);opacity:.7}
.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__name{font-family:'Bodoni Moda',Georgia,serif;font-weight:400;font-size:1.05rem;letter-spacing:.03em;color:var(--sj-ivory);white-space:nowrap}
.sj-header__mark{margin-right:auto;padding:.25rem}

.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:300;color:var(--sj-ivory);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-gold-text);border-bottom-color:var(--sj-gold)}

.sj-enquire{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;font-weight:400;color:var(--sj-ivory);padding:.45rem .1rem;border-bottom:1px solid transparent;transition:border-color .2s ease-out,background .2s ease-out,color .2s ease-out,padding .2s ease-out}
.sj-enquire:hover{border-bottom-color:var(--sj-gold)}

.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:1px;background:var(--sj-ivory);transition:transform .2s ease-out,opacity .2s ease-out}

/* scrolled state */
.sj-header.is-stuck{background:var(--sj-forest)}
.sj-header.is-stuck .sj-header__in{border-bottom-color:rgba(196,160,82,.34)}
.sj-header.is-stuck .sj-enquire{background:var(--sj-gold);color:var(--sj-forest);padding:.55rem 1.15rem;border-radius:var(--sj-r);border-bottom-color:transparent;font-weight:500}
.sj-header.is-stuck .sj-enquire:hover{background:var(--sj-gold-text)}

@media (min-width:900px){
  .sj-header.is-stuck .sj-nav{display:block}
}
@media (max-width:899px){
  .sj-header.is-stuck .sj-burger{display:flex}
  .sj-nav.is-open{display:block;position:absolute;top:100%;left:0;right:0;background:var(--sj-forest);border-bottom:1px solid rgba(196,160,82,.34)}
  .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 rgba(244,241,234,.10)}
  .sj-nav.is-open .sj-nav__list a.is-active{color:var(--sj-gold-text);border-bottom-color:var(--sj-gold)}
}

/* ---------- hero ---------- */
.sj-hero__scrim{position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse 66% 66% at 50% 56%,rgba(20,38,31,.74) 0%,rgba(20,38,31,.66) 42%,rgba(20,38,31,.32) 70%,rgba(20,38,31,0) 90%)}
.sj-hero__in{position:relative;z-index:2;padding:5.5rem var(--sj-pad) 5rem;display:flex;flex-direction:column;align-items:center}
.sj-hero__logo{width:auto;height:64px;opacity:.42;margin-bottom:48px}
.sj-hero__h1{font-family:'Bodoni Moda',Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(3rem,8vw,6.5rem);line-height:1;letter-spacing:.01em;color:var(--sj-ivory)}
.sj-hero__rule{display:block;width:1px;height:56px;background:var(--sj-gold);margin:32px 0}
.sj-hero__tag{font-family:'Jost',sans-serif;font-weight:300;font-size:.82rem;letter-spacing:.34em;text-transform:uppercase;color:var(--sj-gold-text);margin:0}
.sj-hero__place{font-family:'Jost',sans-serif;font-weight:300;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(244,241,234,.65);margin-top:64px}
.sj-hero__cue{position:absolute;left:50%;bottom:28px;z-index:2;width:1px;height:40px;background:var(--sj-gold);transform:translateX(-50%);transform-origin:top center;animation:sj-cue 2.6s ease-in-out infinite}
@keyframes sj-cue{0%,100%{opacity:.25;transform:translateX(-50%) scaleY(.45)}50%{opacity:1;transform:translateX(-50%) scaleY(1)}}

@media (max-width:700px){
  .sj-hero__scrim{background:radial-gradient(ellipse 92% 58% at 50% 56%,rgba(20,38,31,.80) 0%,rgba(20,38,31,.72) 46%,rgba(20,38,31,.36) 74%,rgba(20,38,31,0) 94%)}
}
@media (max-width:520px){
  .sj-hero__logo{height:52px;margin-bottom:36px}
  .sj-hero__place{margin-top:48px}
}


/* ================= 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);color:var(--sj-forest);border:1px solid var(--sj-gold)}
.sj-btn--gold:hover{background:#D2B166;border-color:#D2B166}
.sj-btn--ghost{background:transparent;color:var(--sj-forest);border:1px solid var(--sj-line);font-weight:400}
.sj-btn--ghost:hover{border-color:var(--sj-gold-ink);color:var(--sj-gold-ink)}
.sj-sec--forest .sj-btn--ghost,.sj-sec--moss .sj-btn--ghost{color:var(--sj-ivory);border-color:rgba(244,241,234,.28)}
.sj-sec--forest .sj-btn--ghost:hover,.sj-sec--moss .sj-btn--ghost:hover{border-color:var(--sj-gold);color:var(--sj-gold-text)}
.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-stone);opacity:.75;margin-top:.5rem}
.sj-sec--forest .sj-ai,.sj-sec--moss .sj-ai{color:var(--sj-ivory);opacity:.6}
.sj-ai--on{position:absolute;left:8px;bottom:8px;margin:0;padding:.2rem .45rem;background:rgba(20,38,31,.72);color:var(--sj-ivory);opacity:1;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 rgba(196,160,82,.42);border-radius:var(--sj-r);padding:.5rem 1rem;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sj-gold-text);font-weight:400}

/* ================= 5.2 stat strip ================= */
.sj-stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:3rem;border-top:1px solid rgba(244,241,234,.16)}
.sj-stat{padding:1.75rem 1rem;text-align:center;border-right:1px solid rgba(244,241,234,.16)}
.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-ivory);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-gold-text);margin-top:.5rem}
.sj-stats--dev{grid-template-columns:repeat(5,1fr);margin-top:3.5rem;border-color:rgba(244,241,234,.18)}
.sj-stats--dev .sj-stat{border-color:rgba(244,241,234,.18)}
@media (max-width:820px){
  .sj-stats,.sj-stats--dev{grid-template-columns:repeat(2,1fr)}
  .sj-stat{border-bottom:1px solid rgba(244,241,234,.16)}
  .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-ink);color:var(--sj-gold-ink)}
.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-forest);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 rgba(244,241,234,.16)}
.sj-idea p{margin-top:.5rem;font-size:.95rem;color:rgba(244,241,234,.78);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 rgba(244,241,234,.16);border-left:1px solid rgba(244,241,234,.16)}
.sj-amen__i{display:flex;align-items:center;gap:.85rem;padding:1.25rem 1rem;border-right:1px solid rgba(244,241,234,.16);border-bottom:1px solid rgba(244,241,234,.16);font-size:.92rem;line-height:1.35}
.sj-amen__ic{flex:0 0 auto;width:26px;height:26px;color:var(--sj-gold)}
.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-gold-ink);padding-block:.85rem}
.sj-tbl tbody th{font-family:'Jost',sans-serif;font-weight:500;font-size:1.05rem;color:var(--sj-forest)}
.sj-tbl__p{font-weight:500;color:var(--sj-forest)}
.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-gold-ink);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-forest)}
.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-ink)}
.sj-chip.is-on{background:var(--sj-gold);border-color:var(--sj-gold);color:var(--sj-forest);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-stone)}
.sj-est__r dd{font-variant-numeric:tabular-nums;font-weight:500;color:var(--sj-forest);white-space:nowrap}
.sj-est__r--tot{border-bottom:0;border-top:1px solid var(--sj-forest);margin-top:.35rem;padding-top:.9rem}
.sj-est__r--tot dt{font-weight:500;color:var(--sj-forest);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 rgba(244,241,234,.18)}
.sj-tab{min-height:44px;padding:.7rem 1.1rem;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(244,241,234,.72);border-bottom:2px solid transparent;transition:color .2s ease-out,border-color .2s ease-out}
.sj-tab:hover{color:var(--sj-ivory)}
.sj-tab.is-on{color:var(--sj-gold-text);border-bottom-color:var(--sj-gold)}
.sj-panel{padding-top:2rem}
.sj-panel:focus-visible{outline:2px solid var(--sj-gold);outline-offset:4px}

.sj-plan{position:relative;background:#F7F5F0;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(20,38,31,.66);border-radius:var(--sj-r)}
.sj-lock__h{font-family:'Bodoni Moda',Georgia,serif;font-size:1.5rem;color:var(--sj-ivory)}
.sj-lock__p{font-size:.92rem;color:rgba(244,241,234,.86);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(20,38,31,.72);color:var(--sj-ivory);opacity:1;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-gold-text);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;min-height:clamp(340px,48vw,520px);display:flex;align-items:center;justify-content:center;text-align:center;background:var(--sj-forest);overflow:hidden}
.sj-break__media{position:absolute;inset:0;z-index:0}
.sj-break__media img{width:100%;height:100%;object-fit:cover;object-position:center 32%;display:block}
.sj-break__veil{position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse 76% 70% at 50% 52%,rgba(20,38,31,.80) 0%,rgba(20,38,31,.70) 46%,rgba(20,38,31,.46) 76%,rgba(20,38,31,.34) 100%)}
.sj-break__in{position:relative;z-index:2;padding:clamp(3rem,7vw,5rem) var(--sj-pad);max-width:52rem}
.sj-break__in .sj-eyebrow{color:var(--sj-gold-text)}
.sj-break__in .sj-h2{color:var(--sj-ivory);margin-top:.75rem}
.sj-break__p{margin-top:1.25rem;color:rgba(244,241,234,.88)}

/* ================= 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:rgba(20,38,31,.82);color:var(--sj-ivory);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-stone)}
.sj-loc__tabs .sj-tab:hover{color:var(--sj-forest)}
.sj-loc__tabs .sj-tab.is-on{color:var(--sj-gold-ink);border-bottom-color:var(--sj-gold)}
.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-gold-ink);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-gold-text)}
.sj-port{display:grid;grid-template-columns:repeat(4,1fr);margin-top:1.25rem;border-top:1px solid rgba(244,241,234,.18);border-left:1px solid rgba(244,241,234,.18)}
.sj-port li{padding:1.1rem 1rem;border-right:1px solid rgba(244,241,234,.18);border-bottom:1px solid rgba(244,241,234,.18);font-size:.95rem}
.sj-lead{margin-top:2rem;padding-top:1.25rem;border-top:1px solid rgba(244,241,234,.18);font-size:.8rem;color:rgba(244,241,234,.8)}
@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-forest)}
.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-gold-ink)}
.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-ivory)}
.sj-partner__r{font-size:.85rem;color:var(--sj-gold-text);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-gold-text);border-bottom:1px solid rgba(196,160,82,.4);transition:border-color .2s ease-out}
.sj-partner__tel a:hover{border-bottom-color:var(--sj-gold)}
.sj-partner__p{margin-top:1.25rem;max-width:60ch;color:rgba(244,241,234,.85)}
.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-forest);font-size:1.4rem}
.sj-inline .sj-formhost{margin-top:2rem;max-width:640px}

/* ================= form ================= */
.sj-form{display:grid;gap:1.1rem}
.sj-f{display:flex;flex-direction:column;gap:.4rem}
.sj-f__lb{font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;font-weight:400}
.sj-f__in,.sj-f__sel{width:100%;min-height:46px;padding:.7rem .85rem;background:#fff;border:1px solid var(--sj-line);border-radius:var(--sj-r);color:var(--sj-stone);font-size:1rem;transition:border-color .2s ease-out}
.sj-f__in:hover,.sj-f__sel:hover{border-color:#B9B4A7}
.sj-f__sel{appearance:none;background-image:linear-gradient(45deg,transparent 50%,#7A8079 50%),linear-gradient(135deg,#7A8079 50%,transparent 50%);background-position:calc(100% - 20px) 21px,calc(100% - 14px) 21px;background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:2.5rem}
.sj-f__hint{font-size:.74rem;opacity:.75}
.sj-f__err{font-size:.78rem;color:#B3261E;min-height:0}
.sj-f.is-bad .sj-f__in,.sj-f.is-bad .sj-f__sel{border-color:#B3261E}
.sj-f__tel{display:flex;align-items:stretch}
.sj-f__cc{display:flex;align-items:center;padding:0 .75rem;background:#F3F1EB;border:1px solid var(--sj-line);border-right:0;border-radius:var(--sj-r) 0 0 var(--sj-r);font-size:.95rem;color:var(--sj-stone)}
.sj-f__tel .sj-f__in{border-radius:0 var(--sj-r) var(--sj-r) 0}
.sj-f--hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.sj-f__cons{display:flex;align-items:flex-start;gap:.65rem;font-size:.82rem;line-height:1.55;cursor:pointer}
.sj-f__cons input{flex:0 0 auto;width:18px;height:18px;margin-top:2px;accent-color:var(--sj-gold-ink)}
.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;opacity:.75;line-height:1.5}
.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}

/* form on dark grounds (modal + popup) */
.sj-ondark .sj-f__lb{color:var(--sj-gold-text)}
.sj-ondark .sj-f__hint,.sj-ondark .sj-form__fine{color:rgba(244,241,234,.72)}
.sj-ondark .sj-f__cons{color:rgba(244,241,234,.9)}
.sj-ondark .sj-f__err{color:#F2B8B5}
.sj-ondark .sj-form__sum{background:rgba(179,38,30,.16);border-color:#F2B8B5;color:#F2B8B5}
.sj-ondark .sj-done__h{color:var(--sj-ivory)}
.sj-ondark .sj-done__p,.sj-ondark .sj-done__alt{color:rgba(244,241,234,.88)}
.sj-ondark .sj-f__cons input{accent-color:var(--sj-gold)}

/* ================= 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(10,20,16,.72)}
.sj-modal__card,.sj-pop__card{position:relative;z-index:1;width:min(520px,100%);max-height:88vh;overflow-y:auto;background:var(--sj-forest);color:var(--sj-ivory);border:1px solid rgba(196,160,82,.5);border-radius:var(--sj-r);padding:clamp(1.5rem,4vw,2.25rem);box-shadow:0 18px 60px rgba(0,0,0,.45)}
.sj-modal__x,.sj-lb__x{position:absolute;top:10px;right:10px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:var(--sj-ivory);border-radius:var(--sj-r);transition:background .2s ease-out}
.sj-modal__x:hover,.sj-lb__x:hover{background:rgba(244,241,234,.12)}
.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-ivory);padding-right:2.5rem}
.sj-pop__p{margin-top:.75rem;font-size:.92rem;color:rgba(244,241,234,.85)}
.sj-modal .sj-formhost,.sj-pop .sj-formhost{margin-top:1.5rem}

.sj-lb{padding:0;background:rgba(10,20,16,.94)}
.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(244,241,234,.85);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:var(--sj-ivory);background:rgba(20,38,31,.6);border-radius:var(--sj-r);transition:background .2s ease-out}
.sj-lb__nav:hover{background:rgba(20,38,31,.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-forest);border:2px solid var(--sj-gold);box-shadow:0 6px 20px rgba(0,0,0,.28);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);border:2px solid var(--sj-forest)}
.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-forest);color:var(--sj-ivory);border:1px solid rgba(196,160,82,.5);border-radius:8px 8px 2px 8px;font-size:.85rem;line-height:1.4;box-shadow:0 6px 20px rgba(0,0,0,.28);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-forest);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%}

/* ================= 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-bone);border:1px solid rgba(196,160,82,.5);border-radius:var(--sj-r);box-shadow:0 18px 50px rgba(0,0,0,.34);overflow:hidden}
.sj-bot__hd{display:flex;align-items:center;gap:.65rem;padding:.7rem .75rem;background:var(--sj-forest);color:var(--sj-ivory)}
.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-gold-text)}
.sj-bot__x{margin-left:auto;width:36px;height:36px;display:flex;align-items:center;justify-content:center;color:var(--sj-ivory);border-radius:var(--sj-r)}
.sj-bot__x:hover{background:rgba(244,241,234,.14)}
.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:#F7F5F0;border:1px solid var(--sj-line);color:var(--sj-stone);border-radius:8px 8px 8px 2px}
.sj-msg--me{align-self:flex-end;background:var(--sj-gold);color:var(--sj-forest);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-forest);transition:background .2s ease-out,border-color .2s ease-out}
.sj-qr:hover{background:var(--sj-forest);border-color:var(--sj-forest);color:var(--sj-ivory)}
.sj-bot__ft{padding:.5rem .85rem;background:#fff;border-top:1px solid var(--sj-line);font-size:.7rem;color:var(--sj-stone);opacity:.8}
@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-forest);color:var(--sj-ivory);padding-block:clamp(3rem,6vw,4.5rem) 2rem}
.sj-foot__cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:clamp(1.5rem,4vw,3rem)}
.sj-foot__n{font-family:'Bodoni Moda',Georgia,serif;font-size:1.35rem;color:var(--sj-ivory)}
.sj-foot__h{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--sj-gold-text)}
.sj-foot__t{margin-top:.75rem;font-size:.85rem;color:rgba(244,241,234,.78);line-height:1.6;max-width:40ch}
.sj-foot__l{margin-top:.85rem}
.sj-foot__l li{padding:.28rem 0;font-size:.88rem;color:rgba(244,241,234,.82)}
.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-gold-text);border-bottom-color:var(--sj-gold)}
.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 rgba(244,241,234,.16)}
.sj-foot__fine p{font-size:.75rem;line-height:1.6;color:rgba(244,241,234,.66)}
.sj-foot__fh{font-size:.75rem!important;letter-spacing:.1em;text-transform:uppercase;color:var(--sj-gold-text)!important;margin-bottom:.4rem}
.sj-foot__cp{margin-top:2rem;padding-top:1.5rem;border-top:1px solid rgba(244,241,234,.16);font-size:.75rem;color:rgba(244,241,234,.66)}
@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}}

/* 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 forest 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-forest)}
@media (min-width:430px){
  .sj-modal .sj-form,.sj-pop .sj-form{grid-template-columns:1fr 1fr}
  .sj-modal .sj-form>*,.sj-pop .sj-form>*{grid-column:1/-1}
  .sj-modal .sj-form>[data-f="looking"],.sj-pop .sj-form>[data-f="looking"]{grid-column:1/2}
  .sj-modal .sj-form>[data-f="purpose"],.sj-pop .sj-form>[data-f="purpose"]{grid-column:2/3}
}

/* ---------- 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}
  .sj-hero__cue{animation:none!important;opacity:.7}
}