/* ==========================================================
   Residential Apartments in Sector 94 — page-scoped styles
   File: public/css/sector94-residential.css
   Loads AFTER nova-residences.css + comman-hero.css.
   Every rule is prefixed .s94- or scoped under .s94-page,
   so no other page or global style is affected.
   ========================================================== */

/* Numerals always in the sans face, never the serif */
.s94-num{font-family:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;font-variant-numeric:lining-nums tabular-nums;font-weight:600;letter-spacing:0;white-space:nowrap}
/* Sans digits sit taller than Cormorant caps, so trim them inside serif headings */
.s94-page h1 .s94-num,.s94-page h2 .s94-num{font-size:.88em;font-weight:700}

/* ---------- Hero (image hero, no video) ---------- */
.s94-hero .hero-video img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;display:block}
.s94-hero.hero-pv .hero-h1 .h1-name{white-space:normal;font-size:clamp(1.7rem,3.5vw,3rem)}
.s94-hero.hero-pv .hero-h1{margin-bottom:10px}
.s94-hero-tag{margin:0 0 18px;font-family:"Cormorant Garamond",serif;font-weight:600;line-height:1.25;color:#f5d67a;font-size:clamp(1.05rem,2vw,1.7rem)}
.s94-hero-tag>span{display:block}
.s94-hero-tag .s94-num{font-size:.88em;font-weight:700}
/* Selective ALL CAPS promotional line (Section 19 A4).
   Text is written in normal case and set in capitals by CSS, so screen
   readers and search snippets read it naturally. Used twice on the page. */
.s94-promo{display:inline-block;margin:0 0 12px;font-family:"Montserrat","DM Sans",sans-serif;font-size:.74rem;font-weight:700;letter-spacing:.18em;line-height:1.5;text-transform:uppercase;color:#e8cc7e;border-bottom:1px solid rgba(201,168,76,.45);padding-bottom:6px}
.s94-cta .s94-promo{margin-bottom:14px}
/* In-page anchors clear the fixed header */
.s94-page section[id]{scroll-margin-top:96px}
/* Breadcrumb links get a comfortable tap height */
.s94-hero .hero-breadcrumb a{display:inline-block;padding:10px 0}
.s94-hero.hero-pv .hero-breadcrumb{margin-bottom:2px}
.s94-note a{display:inline-block;padding:8px 0}
.s94-hero-sub{font-family:"DM Sans",sans-serif;font-size:1rem;line-height:1.55;color:#eef3ef;margin:0 0 22px;max-width:44ch}
.s94-cta-row{display:flex;flex-wrap:wrap;gap:12px}
.s94-btn{white-space:nowrap;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 24px;border-radius:999px;font-family:"Montserrat","DM Sans",sans-serif;font-size:.9rem;font-weight:700;line-height:1;text-decoration:none;border:1px solid transparent;transition:transform .2s ease,box-shadow .2s ease}
.s94-btn:hover{transform:translateY(-2px)}
.s94-btn:focus-visible{outline:3px solid #f5d67a;outline-offset:3px}
.s94-btn-gold{background:linear-gradient(135deg,#C9A84C 0%,#e8cc7e 100%);color:#0b1e14;box-shadow:0 8px 22px rgba(201,168,76,.28)}
.s94-btn-gold:hover{color:#0b1e14}
.s94-btn-wa{background:linear-gradient(135deg,#1B6B5A 0%,#157a40 100%);color:#fff;box-shadow:0 8px 22px rgba(27,107,90,.28)}
.s94-btn-wa:hover{color:#fff}
.s94-btn-line{background:transparent;border-color:#C9A84C;color:#f5d67a}
.s94-btn-line:hover{color:#fff}

/* ---------- Equal-size cards with matching outlines ---------- */
.s94-grid{display:grid;gap:16px;margin-top:28px}
.s94-grid-6{grid-template-columns:repeat(6,minmax(0,1fr))}
.s94-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.s94-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.s94-card{display:flex;flex-direction:column;justify-content:flex-start;height:100%;border:1px solid #2a4a35;border-radius:16px;padding:22px 16px;text-align:center;background:linear-gradient(160deg,#112a1c 0%,#0b1e14 100%)}
.s94-card-v{font-size:1.45rem;line-height:1.1;color:#e8cc7e;margin-bottom:8px}
.s94-card-l{font-family:"DM Sans",sans-serif;font-size:.8rem;line-height:1.35;color:#c9d8cf}

/* Link cards (browse by requirement / keep exploring) */
a.s94-link{display:flex;flex-direction:column;gap:6px;height:100%;border:1px solid #e0ede9;border-radius:16px;padding:20px 18px;background:linear-gradient(160deg,#ffffff 0%,#f0f7f3 100%);text-decoration:none;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
a.s94-link:hover{transform:translateY(-3px);border-color:#C9A84C;box-shadow:0 12px 28px rgba(11,30,20,.1)}
a.s94-link:focus-visible{outline:3px solid #1B6B5A;outline-offset:3px}
.s94-link-t{font-family:"DM Sans",sans-serif;font-size:.98rem;font-weight:700;line-height:1.3;color:#0b1e14}
.s94-link-s{font-family:"DM Sans",sans-serif;font-size:.82rem;line-height:1.4;color:#5a6b65}
.s94-link-go{margin-top:auto;padding-top:8px;font-family:"Montserrat","DM Sans",sans-serif;font-size:.76rem;font-weight:700;color:#1B6B5A}

/* Project grid: three equal cards */
.s94-page .project-card-link{display:block;height:100%;text-decoration:none}
.s94-page .project-card{height:100%}

/* ---------- Compare table ---------- */
.s94-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid #e0ede9;border-radius:16px;margin-top:24px}
.s94-table{width:100%;min-width:640px;border-collapse:collapse;background:#fff;font-family:"DM Sans",sans-serif}
.s94-table caption{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.s94-table thead tr{background:linear-gradient(135deg,#0b1e14 0%,#1B6B5A 100%)}
.s94-table th{padding:15px 18px;text-align:left;font-family:"Montserrat","DM Sans",sans-serif;font-size:.78rem;font-weight:700;color:#f5f0e8;background:transparent}
.s94-table td{padding:15px 18px;border-top:1px solid #e0ede9;font-size:.92rem;color:#1a2622;vertical-align:middle}
.s94-table tbody tr:nth-child(even) td{background:#faf6ed}
.s94-table td a{color:#0b1e14;font-weight:700;text-decoration:none;border-bottom:1px solid #C9A84C}
.s94-pill{display:inline-block;padding:5px 12px;border-radius:999px;font-size:.74rem;font-weight:700;white-space:nowrap}
.s94-pill-ready{background:#e6f4ec;color:#14574a}
.s94-pill-uc{background:#fdf1dc;color:#7a5b1f}
.s94-note{font-family:"DM Sans",sans-serif;font-size:.84rem;color:#5a6b65;margin:14px 0 0}
.s94-note a{color:#1B6B5A;font-weight:700;text-decoration:none}

/* ---------- Closing CTA panel ---------- */
.s94-cta{border:1px solid #2a4a35;border-radius:22px;padding:44px 24px;text-align:center;background:linear-gradient(135deg,#0b1e14 0%,#112a1c 55%,#1B6B5A 140%)}
.s94-cta h2{color:#f5f0e8;margin:0 0 10px}
.s94-cta h2 span{color:#e8cc7e}
.s94-cta p{font-family:"DM Sans",sans-serif;color:#e6efe9;margin:0 0 22px}
.s94-cta .s94-cta-row{justify-content:center}

/* ---------- Responsive ---------- */
@media (max-width:991.98px){
  .s94-grid-6{grid-template-columns:repeat(3,minmax(0,1fr))}
  .s94-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:767.98px){
  .s94-grid-3{grid-template-columns:1fr}
  .s94-hero-sub{font-size:.94rem}
  .s94-promo{font-size:.68rem;letter-spacing:.14em}
  .s94-cta-row .s94-btn{flex:1 1 140px}
  .s94-cta-row .s94-btn-gold{flex-basis:100%}
  .s94-cta{padding:34px 18px}
}
@media (max-width:575.98px){
  .s94-grid-6,.s94-grid-4{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .s94-card{padding:18px 10px}
  .s94-card-v{font-size:1.2rem}
}
/* Very narrow phones (under 360px): stop the 300px captcha forcing the hero wider than the screen */
@media (max-width:359.98px){
  .s94-hero .hero-grid>div{min-width:0}
  .s94-hero .psv-card{padding-left:10px;padding-right:10px}
  .s94-hero .psv-captcha{transform:scale(.86);transform-origin:left top}
}
@media (prefers-reduced-motion:reduce){
  .s94-btn,a.s94-link{transition:none}
  .s94-btn:hover,a.s94-link:hover{transform:none}
}

/* ==========================================================
   Hero enquiry card (psv-card) — same rules the hero form
   prints inline on the project pages, kept here so the
   Blade file stays clean. Includes the honeypot hide rule.
   ========================================================== */
.error { color: coral; }

.hp-field {
    display: none !important;
    visibility: hidden !important;
}

/* ---- animations ---- */
@keyframes psvShimmer{0%{background-position:0% 50%}100%{background-position:200% 50%}}
@keyframes psvSweep{0%{background-position:-150% 0,0 0}100%{background-position:250% 0,0 0}}
@keyframes psvTextShine{0%{background-position:0% 50%}100%{background-position:100% 50%}}
@keyframes psvSheen{0%,58%{transform:translateX(-150%) skewX(-18deg)}100%{transform:translateX(280%) skewX(-18deg)}}
@keyframes psvCornerPulse{0%,100%{opacity:.25}50%{opacity:.65}}
@keyframes psvFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}

.psv-card{
    --gold:#c9a84c; --gold-light:#e8cc7e; --gold-soft:rgba(201,168,76,.4); --gold-deep:#8f6c2a;
    --txt:#f2f5f9; --muted:#c3cdd9;
    position:relative; max-width:420px; width:100%;
    border:none; border-radius:26px;
    padding:14px 18px 34px; color:var(--txt); overflow:hidden; isolation:isolate;
    background:#0b1a2c;
    box-shadow:0 10px 40px rgba(0,0,0,.45);
}
/* gradient border — light-dark-light gold, like metal catching light (animated shimmer) */
.psv-card::before{
    content:""; position:absolute; inset:0; z-index:3; border-radius:26px;
    padding:1.5px; pointer-events:none;
    background:
        linear-gradient(110deg,transparent 32%,rgba(255,246,214,.95) 50%,transparent 68%) no-repeat,
        linear-gradient(145deg,
        var(--gold-light) 0%, rgba(201,168,76,.2) 16%, var(--gold) 34%,
        rgba(143,108,42,.15) 52%, var(--gold-light) 70%,
        rgba(143,108,42,.25) 86%, var(--gold) 100%);
    background-size:55% 100%,100% 100%;
    background-position:-150% 0,0 0;
    animation:psvSweep 3.6s linear infinite;
    -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite:xor;
    mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite:exclude;
}
/* background image is a real <img class="psv-bg"> so it can't be stripped by the minifier */
.psv-card .psv-bg{
    position:absolute; inset:0; z-index:-2;
    width:100% !important; height:100% !important;
    object-fit:cover; display:block; border:0; margin:0; padding:0;
    border-radius:26px; pointer-events:none;
}
/* double diagonal corner cut-lines (bottom only, small — button se door) */
.psv-corner{position:absolute; width:28px; height:28px; overflow:hidden; pointer-events:none; z-index:1;}
.psv-corner::before,.psv-corner::after{content:""; position:absolute; width:150%; height:2px;
    background:linear-gradient(90deg,transparent,var(--gold) 30%,var(--gold) 70%,transparent);}
.psv-corner::after{animation:psvCornerPulse 3.5s ease-in-out infinite;}
.psv-corner.bl{bottom:0; left:0;}
.psv-corner.bl::before{bottom:9px; left:-9px; transform:rotate(45deg);}
.psv-corner.bl::after{bottom:17px; left:-9px; transform:rotate(45deg); opacity:.4;}
.psv-corner.br{bottom:0; right:0;}
.psv-corner.br::before{bottom:9px; right:-9px; transform:rotate(-45deg);}
.psv-corner.br::after{bottom:17px; right:-9px; transform:rotate(-45deg); opacity:.4;}

/* dark blue overlay + golden glow at the top */
.psv-card::after{
    content:""; position:absolute; inset:0; z-index:-1;
    background:
        linear-gradient(180deg, rgba(201,168,76,.38) 0%, rgba(143,108,42,.2) 9%, rgba(8,17,31,.72) 28%, rgba(8,17,31,.65) 60%, rgba(5,11,21,.85) 100%);
}

/* no background image -> fully transparent card */
.psv-card.psv-noimg{background:transparent; box-shadow:none;}
.psv-card.psv-noimg::after{display:none;}

.psv-head{margin-bottom:10px; position:relative; z-index:2; text-align:center;}
.psv-head .psv-row{display:flex; align-items:center; justify-content:center; gap:10px;}
.psv-head .psv-logo{flex:0 0 auto; display:grid; place-items:center;
    border-right:1px solid var(--gold-soft); padding-right:10px; align-self:stretch;}
.psv-head .psv-logo svg{animation:psvFloat 3.2s ease-in-out infinite;}
.psv-card .psv-title{font-family:Georgia,'Times New Roman',Times,serif !important; font-size:1.45rem; line-height:1.15; margin:0; font-weight:700; letter-spacing:.3px; color:var(--txt);}
/* gold text shimmer on the accent words */
.psv-title em{font-style:normal; font-family:inherit !important; color:var(--gold);}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
.psv-title em{
    background:linear-gradient(100deg,var(--gold) 0%,#fff7d6 18%,var(--gold) 38%,var(--gold-light) 50%,var(--gold) 62%,#fff7d6 82%,var(--gold) 100%) !important;
    background-size:250% 100% !important; background-position:0% 50%;
    -webkit-background-clip:text !important; background-clip:text !important;
    -webkit-text-fill-color:transparent !important; color:transparent !important;
    animation:psvTextShine 2.2s linear infinite alternate;
}
}
.psv-card .psv-sub{margin:6px 0 0; font-family:Arial,Helvetica,sans-serif !important; font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); text-align:center;}

.psv-field{position:relative; margin-bottom:9px;}
.psv-field .psv-chip{position:absolute; left:7px; top:50%; transform:translateY(-50%);
    width:26px; height:26px; border-radius:13px; background:rgba(5,12,23,.7);
    display:grid; place-items:center; pointer-events:none; z-index:2;
    transition:box-shadow .25s ease, background .25s ease;}
.psv-field .psv-ic{color:var(--gold); width:14px; height:14px; display:block;
    transition:color .25s ease, transform .25s ease;}
/* icon lights up on focus */
.psv-field:focus-within .psv-chip{box-shadow:0 0 10px var(--gold-soft); background:rgba(10,20,36,.9);}
.psv-field:focus-within .psv-ic{color:var(--gold-light); transform:scale(1.12);}

/* gradient border wrap for inputs — static light/dark gold */
.psv-bwrap{position:relative; border-radius:19px; padding:1.2px;
    background:linear-gradient(120deg,
        rgba(232,204,126,.65) 0%, rgba(143,108,42,.15) 25%, rgba(201,168,76,.6) 50%,
        rgba(143,108,42,.12) 72%, rgba(232,204,126,.6) 100%);}

/* !important everywhere below: the page theme has global input/select
   styles that otherwise override this component */
.psv-card input:not([type=checkbox]):not(.hp-field),
.psv-card select{
    width:100% !important; height:36px !important; box-sizing:border-box !important; margin:0 !important;
    padding:0 14px 0 42px !important; border-radius:18px !important;
    background:linear-gradient(180deg,rgba(28,44,64,.6),rgba(8,17,31,.68)) !important;
    border:none !important;
    color:var(--txt) !important; font-size:.9rem !important;
    appearance:none !important; -webkit-appearance:none !important; outline:none !important;
    font-family:Arial,Helvetica,sans-serif !important;
    box-shadow:none !important;
    display:block !important;
}
.psv-card input::placeholder{color:var(--muted) !important; opacity:1 !important;}
.psv-card select:invalid{color:var(--muted) !important;}
.psv-card select option{color:#0b1a2c; background:#fff;}
.psv-card input:focus,.psv-card select:focus,
.psv-card input:valid,.psv-card select:valid{
    border:none !important; box-shadow:none !important;
}
.psv-bwrap:focus-within{
    background:linear-gradient(120deg,var(--gold-light),var(--gold) 50%,var(--gold-light));
}
.psv-captcha{margin-bottom:9px; min-height:65px;}

.psv-consent{display:flex; align-items:flex-start; gap:8px; margin-bottom:9px; font-size:.78rem; font-family:Arial,Helvetica,sans-serif; color:var(--txt); cursor:pointer;}
.psv-consent span{flex:1 1 auto; min-width:0;}
.psv-card .psv-consent input[type=checkbox]{
    flex:0 0 auto; appearance:none !important; -webkit-appearance:none !important;
    width:18px !important; height:18px !important; min-width:18px !important; max-width:18px !important;
    margin:0 !important; padding:0 !important; border-radius:6px !important; cursor:pointer;
    border:1.5px solid var(--gold) !important; background:rgba(5,12,23,.7) !important;
    display:inline-grid !important; place-items:center; box-shadow:none !important;
    transition:box-shadow .2s ease;
}
.psv-card .psv-consent input[type=checkbox]:focus-visible{box-shadow:0 0 8px var(--gold-soft) !important;}
.psv-card .psv-consent input[type=checkbox]::after{
    content:""; width:9px; height:5px;
    border-left:2px solid var(--gold); border-bottom:2px solid var(--gold);
    transform:rotate(-45deg) translate(1px,-1px) scale(.4); opacity:0;
    transition:opacity .15s ease, transform .22s cubic-bezier(.5,1.6,.4,1);
}
.psv-card .psv-consent input[type=checkbox]:checked::after{opacity:1;
    transform:rotate(-45deg) translate(1px,-1px) scale(1);}

.psv-card .psv-submit{
    display:flex !important; align-items:center; justify-content:center; gap:10px;
    width:100% !important; height:44px !important; border:0 !important; border-radius:22px !important; cursor:pointer;
    background:linear-gradient(105deg,var(--gold) 0%,var(--gold-light) 30%,var(--gold) 62%,var(--gold-deep) 100%) !important;
    color:#160f03 !important; font-size:.96rem !important; font-weight:700 !important; letter-spacing:.02em;
    font-family:Arial,Helvetica,sans-serif !important; position:relative; overflow:hidden;
    box-shadow:inset 0 1px 2px rgba(255,255,255,.4), 0 8px 22px rgba(0,0,0,.45) !important;
    text-transform:none !important;
    transition:filter .15s ease, transform .15s ease, box-shadow .15s ease;
}
/* light sheen sweeping across the button */
.psv-card .psv-submit::before{
    content:""; position:absolute; top:-30%; bottom:-30%; left:0; width:38%;
    background:linear-gradient(105deg,transparent,rgba(255,255,255,.5),transparent);
    transform:translateX(-150%) skewX(-18deg); pointer-events:none;
    animation:psvSheen 3.4s ease-in-out infinite;
}
.psv-card .psv-submit:hover{filter:brightness(1.06); color:#160f03 !important;
    transform:translateY(-1px);
    box-shadow:inset 0 1px 2px rgba(255,255,255,.4), 0 11px 26px rgba(0,0,0,.5) !important;}
.psv-card .psv-submit:active{transform:translateY(0);}
.psv-submit > svg{transition:transform .2s ease;}
.psv-card .psv-submit:hover > svg{transform:translate(3px,-3px);}
.psv-submit .psv-go{
    position:absolute; right:5px; top:50%; transform:translateY(-50%);
    width:34px; height:34px; border-radius:50%; display:grid; place-items:center;
    background:rgba(18,13,3,.94); color:var(--gold-light);
}
.psv-submit .psv-go svg{transition:transform .2s ease;}
.psv-card .psv-submit:hover .psv-go svg{transform:translateX(3px);}
.psv-card .alert{border-radius:16px; font-size:.84rem; position:relative; z-index:2; padding:9px 13px; margin-bottom:9px;}

@media (prefers-reduced-motion:reduce){
    .psv-card::before, .psv-title em,
    .psv-head .psv-logo svg, .psv-corner::after, .psv-card .psv-submit::before{
        animation:none !important;
    }
}

@media (max-width:430px){
    .psv-card{padding:13px 13px 32px;}
}
