/* ==========================================================================
   Platinum 9 World Tower — main stylesheet
   Loaded async; the above-the-fold subset is inlined in index.php <head>.
   Palette is taken from the logo: deep navy wordmark and rose-copper arches.
   Copper is darkened for buttons and text so white-on-copper and
   copper-on-paper both clear WCAG AA.
   ========================================================================== */

:root{
  --ink:#0A1624;       /* logo navy                               */
  --ink2:#132238;      /* raised dark                             */
  --ink3:#1B2D47;      /* hover on dark                           */
  --mist:#F6F2EF;      /* page ground, warm paper                 */
  --mist2:#EFE7E3;     /* alternate section                       */
  --paper:#fff;
  --copper:#BB968E;    /* logo arches — hairlines and icons       */
  --copper-d:#8A5A4D;  /* action — 5.7:1 with white text          */
  --copper-dd:#744A3F; /* action hover                            */
  --copper-t:#85574A;  /* copper as text on light — 5.4:1 on mist */
  --copper-l:#D6B6AC;  /* copper as text on dark                  */
  --stone:#4F5A68;
  --line:#E3D8D3;
  --wrap:1180px;
  --r:2px;
}

/* ---------- primitives ---------- */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.w-100{width:100%}
.fine{font-size:.8125rem;line-height:1.6;color:var(--stone);margin:.6rem 0 0}
.eyebrow{color:var(--copper-t)}
.sec-dark .eyebrow,.hero .eyebrow,.ftr .eyebrow,.modal-hd .eyebrow,.panel-dark .eyebrow{color:var(--copper-l)}
.lnk{color:var(--copper-t);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.lnk:hover{color:var(--copper-dd)}
.lnk-l{color:var(--copper-l);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.lnk-l:hover{color:#fff}
.ic{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.5;flex:none}
.ic-lg{width:26px;height:26px;stroke:var(--copper-t)}
.btn .ic{width:18px;height:18px}
:focus-visible{outline:2px solid var(--copper);outline-offset:3px}

/* ---------- section frame ---------- */
.sec{padding:clamp(3.75rem,8vw,7rem) 0}
.sec-tight{padding:clamp(3rem,6vw,5rem) 0}
.sec-mist{background:var(--mist2)}
.sec-dark{background:var(--ink);color:#DCE2EA}
.wrap-narrow{width:min(100% - 2rem,780px)}
.shead{max-width:62ch;margin:0 0 2.5rem}
.shead h2{font-size:clamp(1.75rem,4.4vw,2.75rem);margin:.7rem 0 0;text-wrap:balance}
.sec-dark .shead h2,.sec-dark h3{color:#fff}
.lede{margin:1rem 0 0;font-weight:300;font-size:1.06rem;color:var(--stone);max-width:58ch}
.sec-dark .lede{color:#B4BECB}
.note{margin:2rem 0 0;font-size:.8125rem;line-height:1.65;color:var(--stone);max-width:80ch}
.note-c{text-align:center;margin-inline:auto;margin-top:1.4rem}
.sec-dark .note{color:#98A3B2}
.h-sm{font-size:1.2rem;margin:1.9rem 0 .5rem}
.body{margin:1rem 0 0;font-weight:300;color:#36414F;max-width:62ch}
.center-cta{display:flex;justify-content:center;margin-top:2.5rem}

/* ---------- signature: arch divider (from the logo's arches) ---------- */
.strand{display:block;height:26px;margin:0 0 2.75rem;
  background:
    linear-gradient(var(--line),var(--line)) left center/calc(50% - 22px) 1px no-repeat,
    linear-gradient(var(--line),var(--line)) right center/calc(50% - 22px) 1px no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 26' fill='none' stroke='%23BB968E' stroke-width='1.1'%3E%3Cpath d='M5 25V10a4 4 0 0 1 8 0v15M11 25V10a4 4 0 0 1 8 0v15M8 25V11.5a4 4 0 0 1 8 0V25'/%3E%3C/svg%3E") center/24px 26px no-repeat;
}

/* ---------- grids ---------- */
.grid-2,.grid-3{display:grid;gap:1.25rem}
.gap-lg{gap:1.75rem}
.split{display:grid;gap:2.25rem}
@media(min-width:768px){
  .grid-2{grid-template-columns:1fr 1fr}
  .grid-3{grid-template-columns:repeat(2,1fr)}
  .split{grid-template-columns:1.2fr .8fr;gap:3.5rem;align-items:start}
  .split-form{grid-template-columns:1fr 1fr}
}
@media(min-width:992px){.grid-3{grid-template-columns:repeat(3,1fr)}}

/* ---------- cards ---------- */
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:1.6rem 1.5rem;position:relative}
.card::before{content:"";position:absolute;left:1.5rem;top:0;width:28px;height:2px;background:var(--copper)}
.card h3{font-size:1.18rem;margin:0 0 .55rem}
.card p{margin:0;font-size:.95rem;color:var(--stone);font-weight:300}
.card-c{text-align:center}
.card-c::before{left:50%;margin-left:-14px}
.card-c .ic-lg{margin:0 auto .8rem}
.card-c h3{font-size:1.05rem;letter-spacing:.02em}
.sec-dark .card{background:var(--ink2);border-color:rgba(255,255,255,.1)}
.sec-dark .card p{color:#AEB8C6}

/* ---------- specification blocks ---------- */
.spec{background:var(--ink2);border:1px solid rgba(255,255,255,.1);border-radius:var(--r);overflow:hidden}
.spec img{width:100%;aspect-ratio:760/494;object-fit:cover}
.spec-b{padding:1.6rem 1.5rem 1.75rem}
.spec-b h3{font-size:1.5rem;margin:0 0 .5rem}
.spec-b>p{margin:0 0 1.2rem;font-size:.95rem;color:#AEB8C6;font-weight:300}
.dl{margin:0;display:grid;gap:0}
.dl>div{display:flex;justify-content:space-between;gap:1rem;padding:.7rem 0;border-top:1px solid rgba(255,255,255,.1);font-size:.9rem}
.dl dt{color:#98A3B2;margin:0}
.dl dd{margin:0;text-align:right;color:#fff}

/* ---------- gallery ---------- */
.gal{display:grid;gap:.75rem;grid-template-columns:1fr}
@media(min-width:600px){.gal{grid-template-columns:1fr 1fr}}
@media(min-width:992px){.gal{grid-template-columns:repeat(3,1fr)}}
.gal-i{padding:0;border:0;background:var(--mist2);cursor:zoom-in;border-radius:var(--r);overflow:hidden;display:block;line-height:0}
.gal-i img{width:100%;aspect-ratio:760/494;object-fit:cover;transition:transform .6s cubic-bezier(.2,.6,.2,1),filter .4s}
.gal-i:hover img{transform:scale(1.045);filter:brightness(1.05)}
.gal-i:focus-visible{outline-offset:2px}

/* ---------- panels ---------- */
.panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:1.7rem 1.6rem}
.panel-dark{background:var(--ink);border-color:var(--ink);color:#DCE2EA}
.dev-logo{width:140px;height:auto;margin:0 auto 1.4rem}
.ticks{list-style:none;margin:1.4rem 0 1.6rem;padding:0}
.ticks li{position:relative;padding-left:1.7rem;margin-bottom:.65rem;font-size:.95rem;font-weight:300}
.ticks li::before{content:"";position:absolute;left:0;top:.52em;width:9px;height:5px;border:1px solid var(--copper);border-width:0 0 1px 1px;transform:rotate(-45deg)}
.ticks-l li{color:#CDD4DE}
.privacy-note{display:flex;gap:.6rem;align-items:flex-start;font-size:.85rem;font-weight:300;color:#AEB8C6;margin:0}
.privacy-note .ic{stroke:var(--copper-l);margin-top:.15em}
.privacy-note a{color:var(--copper-l)}

/* ---------- pricing table ---------- */
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--paper);color:var(--ink)}
.tbl{width:100%;border-collapse:collapse;min-width:640px}
.tbl th,.tbl td{text-align:left;padding:1.15rem 1.25rem;border-bottom:1px solid var(--line);font-weight:400;vertical-align:middle}
.tbl thead th{font-size:.6875rem;letter-spacing:.16em;text-transform:uppercase;color:var(--stone);background:#FAF7F5}
.tbl tbody th{font-family:Marcellus,Georgia,serif;font-size:1.15rem;color:var(--ink)}
.tbl-d{display:block;margin-top:.2rem;font:300 .8125rem/1.45 Jost,sans-serif;color:var(--stone);max-width:36ch}
.tbl tbody tr:last-child th,.tbl tbody tr:last-child td{border-bottom:0}
.tbl tbody tr:hover{background:#FCFAF9}
.tbl td{color:var(--stone);font-weight:300;white-space:nowrap}
.pr{font-family:Marcellus,Georgia,serif;font-size:1.25rem;color:var(--ink)!important;white-space:nowrap}
.pr span{display:block;font-family:Jost,sans-serif;font-size:.6875rem;letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}

/* ---------- location ---------- */
.h-list{font-size:1.2rem;margin:0 0 1rem}
.dist{list-style:none;margin:0;padding:0}
.dist li{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.95rem 0;border-bottom:1px solid var(--line)}
.dist li:first-child{border-top:1px solid var(--line)}
.dist span{display:flex;align-items:center;gap:.7rem;font-weight:300;color:#36414F}
.dist .ic{stroke:var(--copper-t)}
.dist b{font-family:Marcellus,Georgia,serif;font-weight:400;font-size:1.2rem;color:var(--ink);white-space:nowrap}
.dist-sm li{padding:.75rem 0}
.dist-sm b{font-size:1.05rem}
.addr{display:flex;gap:.6rem;align-items:flex-start;margin:1.5rem 0 1rem;font-size:.92rem;font-weight:300;color:#36414F}
.addr .ic{stroke:var(--copper-t);margin-top:.2em}

/* ---------- amenities ---------- */
.amen{list-style:none;margin:0;padding:0;display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;grid-template-columns:1fr 1fr}
@media(min-width:768px){.amen{grid-template-columns:repeat(3,1fr)}}
@media(min-width:992px){.amen{grid-template-columns:repeat(4,1fr)}}
.amen li{display:flex;align-items:center;gap:.75rem;background:var(--paper);padding:1.15rem 1.1rem;font-size:.92rem;font-weight:300;line-height:1.4}
.amen .ic{stroke:var(--copper-t)}

/* ---------- key highlights ---------- */
.shead-c{max-width:none;text-align:center;margin-inline:auto}
.khs{list-style:none;margin:0;padding:0;display:grid;gap:1px;background:rgba(255,255,255,.12);
     border:1px solid rgba(255,255,255,.12);border-radius:var(--r);overflow:hidden;
     grid-template-columns:1fr 1fr}
@media(min-width:768px){.khs{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1100px){.khs{grid-template-columns:repeat(6,1fr)}}
.khs li{background:var(--ink2);padding:1.7rem 1rem 1.5rem;text-align:center;transition:background .3s}
.khs li:hover{background:var(--ink3)}
.khs .ic{width:22px;height:22px;stroke:var(--copper);margin:0 auto .85rem}
.kn{display:block;font-family:Marcellus,Georgia,serif;font-size:clamp(1.9rem,5.2vw,2.5rem);line-height:1;color:#fff}
.kn i{font-style:normal;font-family:Jost,sans-serif;font-size:.42em;color:var(--copper-l);margin-left:.15em;letter-spacing:.04em;vertical-align:.35em}
.ku{display:block;margin-top:.6rem;font-size:.688rem;letter-spacing:.16em;text-transform:uppercase;color:var(--copper-l)}
.kd{display:block;margin-top:.5rem;font-size:.8125rem;line-height:1.5;font-weight:300;color:#A5B0BE}

/* ---------- "Artistic Impression" stamp on every render ---------- */
.ai{position:relative;overflow:hidden}
.ai::after{content:"Artistic Impression";position:absolute;right:0;bottom:0;z-index:2;
  padding:.3rem .6rem;font:400 .625rem/1 Jost,sans-serif;letter-spacing:.08em;
  color:rgba(255,255,255,.94);background:rgba(10,22,36,.66);border-radius:2px 0 0 0;
  pointer-events:none}

/* ---------- floor plans (locked) ---------- */
.plan{position:relative;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#F3EEEB}
.plan>img{width:100%;aspect-ratio:900/640;object-fit:cover;filter:blur(7px) saturate(.85);transform:scale(1.08)}
.plan-lock{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:.35rem;text-align:center;padding:1.5rem;background:rgba(10,22,36,.66)}
.plan-lock .ic-lg{stroke:var(--copper-l);margin-bottom:.4rem}
.plan-lock h3{font-size:1.45rem;color:#fff}
.plan-lock p{margin:0 0 1.1rem;font-size:.875rem;font-weight:300;color:#DCE2EA}
.plan-alt{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.9rem;margin-top:1.75rem}
.plan-alt p{margin:0;font-size:.95rem;font-weight:300;color:var(--stone)}

/* ---------- consent block under the submit button ---------- */
.consent{margin:1.1rem 0 0;padding-top:1.05rem;border-top:1px solid var(--line)}
.consent label{font-size:.75rem;line-height:1.55;color:var(--stone)}

/* ---------- link-styled button (pricing table) ---------- */
.lnk-btn{background:none;border:0;padding:0;cursor:pointer;font:500 .9rem Jost,sans-serif;
  color:var(--copper-t);text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.lnk-btn:hover{color:var(--copper-dd)}

/* ---------- FAQ accordion ---------- */
.acc{border-top:1px solid var(--line)}
.acc-i{border-bottom:1px solid var(--line)}
.acc-i h3{margin:0;font-family:Jost,sans-serif}
.acc-q{width:100%;display:flex;align-items:flex-start;justify-content:space-between;gap:1.25rem;
  background:none;border:0;padding:1.35rem 0;cursor:pointer;text-align:left;
  font:400 1.04rem/1.45 Jost,sans-serif;color:var(--ink)}
.acc-q:hover{color:var(--copper-t)}
.acc-x{margin-top:.22em;stroke:var(--copper-t);transition:transform .3s}
.acc-q[aria-expanded=true] .acc-x{transform:rotate(45deg)}
.acc-a p{margin:0;padding:0 3rem 1.5rem 0;font-size:.97rem;font-weight:300;color:#36414F}

/* ---------- forms ---------- */
.form-card{background:var(--paper);border-radius:var(--r);padding:1.75rem 1.6rem 1.9rem;color:var(--ink);border-top:3px solid var(--copper)}
.fld{margin-bottom:1.05rem}
.fld label{display:block;font-size:.75rem;letter-spacing:.13em;text-transform:uppercase;color:var(--stone);margin-bottom:.45rem}
.fld input[type=text],.fld input[type=tel],.fld select{
  width:100%;padding:.85rem .9rem;font:400 1rem Jost,sans-serif;color:var(--ink);
  background:#fff;border:1px solid #CFC3BD;border-radius:var(--r);appearance:none}
.fld input:focus,.fld select:focus{border-color:var(--copper-d);outline:0;box-shadow:0 0 0 3px rgba(138,90,77,.16)}
.fld input[aria-invalid=true]{border-color:#B3261E}
.phone{display:grid;grid-template-columns:104px 1fr;gap:.5rem}
.phone select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m7 10 5 5 5-5' fill='none' stroke='%234F5A68' stroke-width='1.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .4rem center;background-size:18px;padding-right:1.6rem}
.fld-chk{display:grid;grid-template-columns:auto 1fr;gap:.65rem;align-items:start;margin-bottom:0}
.fld-chk input{width:17px;height:17px;margin-top:.22em;accent-color:var(--copper-d)}
.fld-chk label{text-transform:none;letter-spacing:0;font-size:.75rem;line-height:1.55;margin:0;color:var(--stone)}
.fld-chk .err{grid-column:1/-1}
.err{margin:.4rem 0 0;font-size:.8125rem;color:#B3261E}
.alert{background:#FDECEA;border:1px solid #F3C6C1;color:#8C1D18;padding:.85rem 1rem;border-radius:var(--r);font-size:.875rem;margin-bottom:1.1rem}
.btn-line{border-color:#CFC3BD;color:var(--ink);background:transparent}
.btn-line:hover{border-color:var(--ink);background:var(--paper)}
.btn-line-l{border-color:rgba(255,255,255,.55);color:#fff}
.btn-line-l:hover{background:rgba(255,255,255,.12)}

/* ---------- final CTA band ---------- */
.cta-band{background:var(--copper-d);color:#fff;padding:clamp(2.75rem,6vw,4.25rem) 0}
.cta-in{display:grid;gap:1.75rem;align-items:center}
.cta-in h2{font-size:clamp(1.6rem,4vw,2.35rem);color:#fff;text-wrap:balance}
.cta-in p{margin:.7rem 0 0;font-weight:300;color:#F6E9E4;max-width:52ch}
.cta-btns{display:flex;flex-wrap:wrap;gap:.7rem}
.cta-btns .btn-primary{background:var(--ink);color:#fff}
.cta-btns .btn-primary:hover{background:var(--ink3)}
@media(min-width:768px){.cta-in{grid-template-columns:1.3fr .7fr}.cta-btns{justify-content:flex-end}}

/* ---------- footer ---------- */
.ftr{background:var(--ink);color:#AEB8C6;padding:clamp(3rem,6vw,4.5rem) 0 2rem;font-size:.9rem}
.ftr-top{display:grid;gap:2rem;padding-bottom:2.25rem;border-bottom:1px solid rgba(255,255,255,.12)}
.ftr-tag{margin:1rem 0 0;font-weight:300;max-width:44ch;color:#98A3B2}
.ftr-nav{display:grid;grid-template-columns:1fr 1fr;gap:.65rem 1.5rem;align-content:start}
.ftr-nav a{color:#CDD4DE;text-decoration:none;font-size:.875rem}
.ftr-nav a:hover{color:var(--copper-l)}
@media(min-width:768px){.ftr-top{grid-template-columns:1.2fr .8fr}}
.rera{padding:2.25rem 0;border-bottom:1px solid rgba(255,255,255,.12)}
.rera-list{list-style:none;margin:1.1rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:1.25rem}
.rera-list li{text-align:center;font-size:.6875rem;letter-spacing:.06em;color:#98A3B2}
.rera-list img{background:#fff;padding:5px;border-radius:var(--r);margin:0 auto .45rem}
.rera .fine{color:#98A3B2;margin-top:1.1rem}
.disc{margin:2rem 0 0;font-size:.75rem;line-height:1.75;color:#8C97A6}
.ftr-bot{display:flex;flex-wrap:wrap;gap:.75rem 1.5rem;justify-content:space-between;align-items:center;margin-top:2rem;padding-top:1.4rem;border-top:1px solid rgba(255,255,255,.12);font-size:.8125rem;color:#8C97A6}
.ftr-bot p{margin:0}
.ftr-bot nav{display:flex;flex-wrap:wrap;gap:1.25rem}
.ftr-bot a{color:#AEB8C6;text-decoration:none}
.ftr-bot a:hover{color:var(--copper-l)}

/* ---------- modal ---------- */
.modal{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:1.1rem}
.modal[hidden]{display:none}
.modal-bd{position:absolute;inset:0;background:rgba(6,13,22,.74);backdrop-filter:blur(2px)}
.modal-cd{position:relative;width:min(100%,430px);max-height:92svh;overflow-y:auto;background:var(--paper);border-radius:var(--r);box-shadow:0 24px 60px rgba(6,13,22,.45)}
.modal-hd{background:var(--ink);color:#fff;padding:1.5rem 1.5rem 1.35rem;text-align:center;border-bottom:2px solid var(--copper)}
.modal-hd img{margin:0 auto .6rem}
.modal-bdy{padding:1.5rem 1.5rem 1.6rem}
.modal-cd h2{font-size:1.5rem;margin:.5rem 0 0;color:#fff;text-wrap:balance}
.modal-p{margin:.5rem 0 0;font-size:.9rem;font-weight:300;color:#B4BECB}
.modal-x{position:absolute;top:.35rem;right:.55rem;z-index:3;background:none;border:0;font-size:1.9rem;line-height:1;color:#B4BECB;cursor:pointer;padding:.25rem .45rem}
.modal-x:hover{color:#fff}

/* ---------- lightbox ---------- */
.lb{position:fixed;inset:0;z-index:130;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.5rem;padding:1rem;background:rgba(6,13,22,.95)}
.lb[hidden]{display:none}
.lb-f{margin:0;justify-self:center;max-width:100%}
.lb-f img{max-width:min(100%,1200px);max-height:78svh;width:auto;height:auto;border-radius:var(--r)}
.lb-f figcaption{margin-top:.85rem;text-align:center;font-size:.8125rem;color:#B4BECB;max-width:60ch;margin-inline:auto}
.lb-x{position:absolute;top:.5rem;right:.9rem;background:none;border:0;color:#fff;font-size:2.2rem;line-height:1;cursor:pointer}
.lb-nav{background:none;border:0;color:#fff;font-size:2.6rem;line-height:1;cursor:pointer;padding:.4rem .7rem;opacity:.75}
.lb-nav:hover{opacity:1}

/* ---------- scroll reveal (transform + opacity only: no layout shift) ---------- */
.reveal{opacity:0;transform:translate3d(0,18px,0)}
.reveal.in{opacity:1;transform:none;transition:opacity .75s cubic-bezier(.2,.6,.2,1),transform .75s cubic-bezier(.2,.6,.2,1)}
@media(prefers-reduced-motion:reduce){
  .reveal,.reveal.in{opacity:1;transform:none;transition:none}
  .gal-i img,.acc-x{transition:none}
  html{scroll-behavior:auto}
}
html{scroll-behavior:smooth;scroll-padding-top:84px}