/* Masar Works home (page-specific). Tokens, type and components come from /masar/*.css. */
.tnav{display:flex;gap:var(--s2);font-size:var(--fs-s)}.tnav a{color:var(--muted);text-decoration:none;display:inline-flex;align-items:center;min-height:var(--tap);padding:0 var(--s3);border-radius:var(--r-s);transition:color var(--dur-2) var(--ease)}.tnav a:hover{color:var(--ink)}
@media (max-width:760px){.tnav{display:none}}
.tcta{display:none}@media (max-width:760px){.tcta{display:inline-flex}}
.hero{padding:var(--s7) 0 var(--s6);background:radial-gradient(900px 420px at 85% -20%,var(--teal-soft),transparent 60%)}
.herogrid{display:grid;gap:var(--s6);align-items:center}
@media (min-width:900px){.herogrid{grid-template-columns:1.25fr 1fr}}
.hero h1{max-width:15ch}.lede{font-size:1.15rem;color:var(--muted);max-width:56ch}
.cta{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s5)}
.facts{list-style:none;margin:var(--s6) 0 0;padding:var(--s4) 0 0;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:var(--s2) var(--s5);color:var(--muted);font-size:var(--fs-s)}.facts b{color:var(--ink);font-weight:600}
.route{width:100%;max-width:440px;height:auto;justify-self:center}
.sec{padding:var(--s7) 0}.sec.alt{background:var(--surface-2)}
.sub{color:var(--muted);max-width:60ch}
.grid{list-style:none;margin:var(--s5) 0 0;padding:0;display:grid;gap:var(--s4);grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.pcard{display:flex;flex-direction:column;gap:6px;height:100%;padding:var(--s5);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-l);box-shadow:var(--sh-1);color:var(--ink);text-decoration:none;transition:transform var(--dur-2) var(--ease),box-shadow var(--dur-2) var(--ease),border-color var(--dur-2) var(--ease)}
a.pcard:hover{transform:translateY(-3px);box-shadow:var(--sh-2);border-color:color-mix(in srgb,var(--teal) 40%,var(--line))}
.pcard .tag{display:inline-grid;place-items:center;width:44px;height:44px;margin-bottom:var(--s2);border-radius:var(--r-m);background:var(--teal-soft);color:var(--teal);font-weight:700;font-size:.8rem;letter-spacing:.04em}
.pcard b{font-size:1.15rem}.pcard span{color:var(--muted);font-size:.95rem}.pcard em{margin-top:auto;padding-top:var(--s3);font-style:normal;font-size:.85rem;font-weight:600;color:var(--teal)}
.pcard.soon{border-style:dashed;background:transparent;box-shadow:none}.pcard.soon .tag{background:var(--surface-2);color:var(--muted)}.pcard.soon em{color:var(--muted)}
.pillars{list-style:none;margin:var(--s5) 0 0;padding:0;display:grid;gap:var(--s4);grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.pillars h3{margin-bottom:var(--s2)}.pillars p{margin:0;color:var(--muted)}
.biz{display:grid;gap:var(--s4);margin-top:var(--s5);grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.tick{list-style:none;margin:var(--s4) 0 0;padding:0}.tick li{position:relative;padding-inline-start:28px;margin-bottom:var(--s2)}.tick li::before{content:"";position:absolute;inset-inline-start:2px;top:.55em;width:12px;height:7px;border-inline-start:2.5px solid var(--teal);border-bottom:2.5px solid var(--teal);transform:rotate(-45deg)}
.mh{margin-top:var(--s6)}
.mods{list-style:none;margin:var(--s4) 0 0;padding:0;display:grid;gap:var(--s3);grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.mods li{padding:var(--s4);border:1px solid var(--line);border-radius:var(--r-m);background:var(--surface);display:flex;flex-direction:column;gap:2px}.mods span{color:var(--muted);font-size:var(--fs-s)}
.mods li.soon{border-style:dashed;background:transparent}
.founder{max-width:720px}
.two{display:grid;gap:var(--s6);grid-template-columns:1fr}@media (min-width:860px){.two{grid-template-columns:1fr 1.1fr;align-items:start}}
.muted{color:var(--muted);font-size:var(--fs-s)}.enq .btn{width:100%}.fine{margin:var(--s3) 0 0;font-size:var(--fs-xs);color:var(--muted)}.field small{font-weight:400;color:var(--muted)}
.enq select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 20px) 55%,calc(100% - 14px) 55%;background-size:6px 6px;background-repeat:no-repeat}
[dir=rtl] .enq select,.enq select:dir(rtl){background-position:20px 55%,14px 55%}
@media print{.hero,.sec.alt{background:none}.route,.enq{display:none}}
@media (max-width:899px){.route{max-width:240px;justify-self:start}}
@media (max-width:420px){.tcta{display:none}}