/* Alivias Housing — site styles */

/* Self-hosted fonts: Fraunces + Inter (variable, latin + latin-ext).
   Urdu and Punjabi text renders in the visitor's system fonts, as before. */
@font-face{font-family:"Fraunces";font-style:normal;font-display:swap;font-weight:100 900;
  src:url("../fonts/fraunces-latin-opsz-normal.woff2") format("woff2-variations");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Fraunces";font-style:normal;font-display:swap;font-weight:100 900;
  src:url("../fonts/fraunces-latin-ext-opsz-normal.woff2") format("woff2-variations");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Inter";font-style:normal;font-display:swap;font-weight:100 900;
  src:url("../fonts/inter-latin-opsz-normal.woff2") format("woff2-variations");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-display:swap;font-weight:100 900;
  src:url("../fonts/inter-latin-ext-opsz-normal.woff2") format("woff2-variations");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --pine:#340958; --deep:#250640; --forest:#5B2D86; --moss:#7E52A8;
  --sage:#C4B2DD; --ochre:#F1A814; --ochre-d:#C58508; --paper:#F7F5FB; --paper-2:#FBFAFE;
  --ink:#251B33; --muted:#5F5570; --line:#E5DFEE; --ochre-text:#8A5F0B; --gold:#F2D8A0;
  --serif:"Fraunces","Liberation Serif",Georgia,serif;
  --sans:"Inter","Helvetica Neue",Arial,sans-serif;
  --wrap:1180px; --radius:14px; --shadow:0 10px 30px rgba(37,6,64,.10);
  --shadow-sm:0 4px 14px rgba(37,6,64,.08);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--paper);
  font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--serif);color:var(--pine);line-height:1.12;margin:0 0 .5em;font-weight:600}
h1{font-size:clamp(2.1rem,5vw,3.5rem);letter-spacing:-.5px}
h2{font-size:clamp(1.6rem,3.4vw,2.5rem)}
h3{font-size:1.3rem}
p{margin:0 0 1rem}
a{color:var(--forest)}
a[href^="mailto:"]{overflow-wrap:anywhere}
img{max-width:100%;display:block}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 22px}
.section{padding:72px 0}
.section.tight{padding:48px 0}
.center{text-align:center}
.lead{font-size:1.2rem;color:var(--forest);line-height:1.6}
.eyebrow{font-family:var(--serif);font-style:italic;font-weight:500;font-size:1.05rem;
  color:var(--ochre-text);margin-bottom:10px}
[dir="rtl"] .eyebrow,[dir="rtl"] .badge,:lang(pa) .eyebrow,:lang(pa) .badge{font-style:normal}
.muted{color:var(--muted)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.5em;font-family:var(--sans);font-weight:600;
  font-size:1rem;padding:.85em 1.5em;border-radius:999px;border:2px solid transparent;
  cursor:pointer;text-decoration:none;transition:.18s;white-space:nowrap}
.btn-primary{background:var(--ochre);color:#241035;border-color:var(--ochre)}
.btn-primary:hover{background:var(--ochre-text);border-color:var(--ochre-text);color:#fff}
.btn-pine{background:var(--pine);color:var(--paper);border-color:var(--pine)}
.btn-pine:hover{background:var(--deep)}
.btn-ghost{background:transparent;color:var(--pine);border-color:var(--sage)}
.btn-ghost:hover{border-color:var(--pine);background:rgba(52,9,88,.05)}
.btn-light{background:var(--paper);color:var(--pine);border-color:var(--paper)}
.btn-light:hover{background:#fff}
.btn-lg{padding:1em 1.8em;font-size:1.05rem}

/* header */
.site-header{position:sticky;top:0;z-index:60;background:rgba(247,245,251,.85);
  backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid transparent;transition:.25s}
.site-header.scrolled{background:rgba(247,245,251,.97);border-bottom-color:var(--line);box-shadow:var(--shadow-sm)}
.nav{display:flex;align-items:center;gap:18px;height:74px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;margin-right:auto}
.brand img{height:60px;width:auto}
.nav-links{display:flex;align-items:center;gap:4px;list-style:none;margin:0;padding:0}
.nav-links a{font-family:var(--sans);font-weight:600;color:var(--pine);text-decoration:none;
  padding:.5em .9em;border-radius:8px;font-size:.98rem}
.nav-links a:hover,.nav-links a.active{background:rgba(52,9,88,.07)}
.nav-actions{display:flex;align-items:center;gap:10px}
.lang{position:relative}
.lang-btn{display:inline-flex;align-items:center;gap:6px;background:transparent;border:1.5px solid var(--sage);
  color:var(--pine);border-radius:999px;padding:.45em .8em;font:inherit;font-weight:600;font-size:.9rem;cursor:pointer}
.lang-menu{position:absolute;right:0;top:120%;background:#fff;border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--shadow);padding:6px;min-width:170px;display:none}
.lang-menu.open{display:block}
.lang-menu a{display:block;padding:.55em .8em;border-radius:8px;text-decoration:none;color:var(--ink);font-weight:600;font-size:.92rem}
.lang-menu a:hover{background:var(--paper)}
.lang-menu a span{color:var(--muted);font-weight:400;font-size:.82rem}
.hamburger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}
.hamburger span{width:24px;height:2.5px;background:var(--pine);border-radius:2px;transition:.2s}
.mnav-lang{display:none}
.mnav-lang a span{color:var(--muted);font-weight:400;font-size:.85em}

/* hero */
.hero{background:linear-gradient(160deg,#340958,#250640 70%);color:var(--paper);position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;right:-60px;bottom:-60px;width:380px;height:380px;
  background:radial-gradient(circle,rgba(196,178,221,.18),transparent 70%);pointer-events:none}
.hero .wrap{position:relative;z-index:2;padding-top:84px;padding-bottom:84px}
.hero h1{color:var(--paper);max-width:16ch}
.hero p{color:var(--sage);font-size:1.25rem;max-width:54ch}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.badge{display:inline-block;font-family:var(--serif);font-style:italic;font-weight:500;
  color:var(--gold);font-size:1.1rem;margin-bottom:16px}

/* trust strip */
.trust{background:var(--deep);color:var(--sage);padding:18px 0}
.trust .row{display:flex;flex-wrap:wrap;gap:14px 38px;justify-content:center;align-items:center;
  font-weight:600;font-size:.95rem}
.trust .row span{display:inline-flex;align-items:center;gap:9px}
.trust .row span:before{content:"";flex:none;width:15px;height:15px;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%23C4B2DD' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") center/15px no-repeat}
.trust svg{flex:none}

/* grids & cards */
.grid{display:grid;gap:24px}
.g-2{grid-template-columns:repeat(2,1fr)}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-4{grid-template-columns:repeat(4,1fr)}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow-sm);color:var(--ink)}
.card h3{margin-top:6px}
.card .ic{width:46px;height:46px;border-radius:12px;background:rgba(52,9,88,.07);
  display:grid;place-items:center;color:var(--pine);margin-bottom:6px}
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.audience{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.aud-card{position:relative;border-radius:18px;padding:34px;color:var(--paper);overflow:hidden;
  display:flex;flex-direction:column;min-height:230px}
.aud-card.landlord{background:linear-gradient(150deg,#5B2D86,#340958)}
.aud-card.resident{background:linear-gradient(150deg,#7E52A8,#5B2D86)}
.aud-card h3{color:var(--paper);font-size:1.5rem}
.aud-card p{color:rgba(247,245,251,.85)}
.aud-card .btn{margin-top:auto;align-self:flex-start}

/* big guarantee block */
.promise{background:var(--pine);color:var(--sage);border-radius:16px;padding:36px 38px;box-shadow:var(--shadow-sm)}
.promise h2,.promise h3{color:var(--paper);margin-bottom:.2em}
.promise .eyebrow{color:var(--gold)}
.promise .lead{color:var(--sage)}
.promise a{color:var(--gold)}
.promise .terms{font-size:.86rem;color:var(--sage);margin-top:10px}
.promise .checklist li:before{background:rgba(247,245,251,.13) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23F2D8A0' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") center/14px no-repeat}
.steps{counter-reset:s;display:grid;gap:22px}
.step{display:flex;gap:18px;align-items:flex-start}
.step .n{counter-increment:s;flex:none;width:46px;height:46px;border-radius:50%;background:var(--pine);
  color:var(--paper);font-family:var(--serif);font-size:1.25rem;display:grid;place-items:center}
.step .n:before{content:counter(s)}
.stat{font-family:var(--serif);font-size:2.4rem;color:var(--pine);line-height:1}
.checklist{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.checklist li{padding-left:34px;position:relative}
.checklist li:before{content:"";position:absolute;left:0;top:2px;width:22px;height:22px;border-radius:50%;
  background:rgba(91,45,134,.12) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%235B2D86' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") center/14px no-repeat}

/* sections variants */
.section.pine{background:var(--pine);color:var(--paper)}
.section.pine h2,.section.pine h3{color:var(--paper)}
.section.pine p{color:var(--sage)}
.section.pine .checklist li:before{background:rgba(247,245,251,.13) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23F2D8A0' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") center/14px no-repeat}
.section.sage{background:#F0EBF8}
.faq details{background:#fff;border:1px solid var(--line);border-radius:12px;margin-bottom:12px;padding:6px 20px}
.faq summary{font-family:var(--serif);font-size:1.12rem;color:var(--pine);cursor:pointer;padding:14px 0;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";float:right;color:var(--ochre-text);font-size:1.4rem;line-height:1}
.faq details[open] summary:after{content:"–"}
.faq p{padding-bottom:14px;margin:0}

/* forms */
.form{background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px;box-shadow:var(--shadow-sm)}
.form label{display:block;font-weight:600;color:var(--pine);margin:14px 0 6px;font-size:.95rem}
.form input,.form select,.form textarea{width:100%;padding:.8em .9em;border:1.5px solid var(--line);
  border-radius:10px;font:inherit;background:var(--paper-2);color:var(--ink)}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--moss);background:#fff}
.form .row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-step{display:none}.form-step.active{display:block}
.form .progress{display:flex;gap:8px;margin-bottom:18px}
.form .progress i{height:5px;flex:1;background:var(--line);border-radius:3px}
.form .progress i.on{background:var(--ochre)}

/* footer */
.site-footer{background:var(--deep);color:var(--sage);padding:60px 0 26px}
.site-footer a{color:var(--sage);text-decoration:none}
.site-footer a:hover{color:#fff}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
.foot-grid h4{color:var(--paper);font-family:var(--sans);font-size:.8rem;letter-spacing:1.5px;text-transform:uppercase}
.foot-grid ul{list-style:none;padding:0;margin:0;display:grid;gap:9px}
.site-footer img{height:60px;margin-bottom:14px}
.legal{border-top:1px solid rgba(196,178,221,.25);margin-top:36px;padding-top:20px;font-size:.82rem;color:#9B8BB0;line-height:1.7}

/* utilities */
.mt0{margin-top:0}.mb0{margin-bottom:0}
.pill{display:inline-block;background:rgba(52,9,88,.07);color:var(--forest);font-weight:600;
  padding:.3em .8em;border-radius:999px;font-size:.85rem}
.skip{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip:focus{position:fixed;width:auto;height:auto;left:16px;top:10px;padding:10px 16px;margin:0;clip:auto;overflow:visible;background:#fff;color:var(--pine);border-radius:8px;z-index:100}
[dir="rtl"] .skip:focus{left:auto;right:16px}

/* RTL (Urdu) */
[dir="rtl"] .nav .brand{margin-right:0;margin-left:auto}
[dir="rtl"] .faq summary:after{float:left}
[dir="rtl"] .checklist li{padding-left:0;padding-right:34px}
[dir="rtl"] .checklist li:before{left:auto;right:0}

/* responsive */
@media(max-width:900px){
  .nav-links,.nav-actions .lang{display:none}
  .hamburger{display:flex}
  .nav.open .nav-links{display:flex;position:absolute;top:74px;left:0;right:0;flex-direction:column;
    background:var(--paper);border-bottom:1px solid var(--line);padding:14px;gap:4px;box-shadow:var(--shadow)}
  .nav.open .nav-links a{padding:.8em 1em}
  .brand img{height:46px}
  .mnav-lang{display:list-item}
  .nav-links li:not(.mnav-lang)+.mnav-lang{border-top:1px solid var(--line);margin-top:8px;padding-top:10px}
  .mnav-lang a{display:block}
  .mnav-lang a[aria-current]{background:rgba(52,9,88,.07);border-radius:8px}
  .split,.audience,.g-3,.g-4,.g-2,.form .row2,.foot-grid{grid-template-columns:1fr}
  .g-4{grid-template-columns:1fr 1fr}
  .section{padding:52px 0}
}
@media(max-width:560px){.g-4{grid-template-columns:1fr}.hero .wrap{padding-top:56px;padding-bottom:56px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
:focus-visible{outline:3px solid var(--forest);outline-offset:2px;border-radius:4px}

/* Floating WhatsApp button (all pages, all languages) */
.fab{position:fixed;bottom:18px;inset-inline-end:18px;z-index:55}
.fab .wa{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;
  background:#25D366;box-shadow:0 8px 22px rgba(37,6,64,.30);
  transition:transform .18s ease,box-shadow .18s ease}
.fab .wa:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(37,6,64,.36)}
.fab .wa:focus-visible{outline:3px solid var(--forest);outline-offset:3px}
@media(max-width:560px){.fab{bottom:14px;inset-inline-end:14px}.fab .wa{width:52px;height:52px}}
@media(prefers-reduced-motion:reduce){.fab .wa:hover{transform:none}}