/* OMERVIA v19 — clarity-first prologue before the cinematic property journey. */
.clarity-hero{
  position:relative;
  z-index:3;
  min-height:100svh;
  display:grid;
  place-items:center;
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(circle at 74% 24%,rgba(126,228,195,.085),transparent 30%),
    radial-gradient(circle at 18% 78%,rgba(242,168,75,.055),transparent 25%),
    linear-gradient(180deg,#051a19 0%,#031413 68%,#020d0e 100%);
}
.clarity-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    linear-gradient(rgba(245,240,231,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(245,240,231,.025) 1px,transparent 1px);
  background-size:88px 88px;
  -webkit-mask-image:linear-gradient(180deg,transparent 2%,#000 24%,#000 72%,transparent 100%);
  mask-image:linear-gradient(180deg,transparent 2%,#000 24%,#000 72%,transparent 100%);
}
.clarity-hero::after{
  content:"";
  position:absolute;
  z-index:-1;
  width:min(68vw,980px);
  aspect-ratio:1;
  right:-18vw;
  top:8vh;
  border:1px solid rgba(126,228,195,.085);
  transform:rotate(45deg);
  box-shadow:0 0 0 72px rgba(126,228,195,.014),0 0 0 148px rgba(126,228,195,.008);
  pointer-events:none;
}
.clarity-shell{
  width:min(88vw,1240px);
  margin-inline:auto;
  padding:clamp(104px,14vh,150px) 0 clamp(112px,15vh,160px);
}
.clarity-brand{
  display:inline-flex;
  align-items:center;
  gap:14px;
  color:#f7f1e8;
  font-size:clamp(1rem,1.1vw,1.14rem);
  font-weight:800;
  letter-spacing:.18em;
}
.clarity-brand .brand-mark{width:30px;height:30px}
.clarity-kicker{
  margin:clamp(54px,8vh,86px) 0 18px;
  color:#8ee4cc;
  font:700 .72rem/1.35 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.clarity-title{
  margin:0;
  max-width:10.8ch;
  color:#f7f1e8;
  font:400 clamp(4.4rem,8.1vw,8.8rem)/.9 Georgia,"Times New Roman",serif;
  letter-spacing:-.06em;
  text-wrap:balance;
}
.clarity-lede{
  max-width:62ch;
  margin:clamp(28px,4vh,42px) 0 0;
  color:#bdd0cb;
  font-size:clamp(1.05rem,1.35vw,1.28rem);
  line-height:1.62;
}
.clarity-lede strong{color:#eef5f2;font-weight:650}
.clarity-actions{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-top:34px;
}
.clarity-actions .button-ghost{background:rgba(245,240,231,.025)}
.clarity-clarifier{
  margin:22px 0 0;
  color:#76948d;
  font-size:.82rem;
  line-height:1.55;
}
.clarity-scroll{
  position:absolute;
  left:50%;
  bottom:28px;
  transform:translateX(-50%);
  display:inline-flex;
  align-items:center;
  gap:13px;
  min-height:44px;
  color:#809d96;
  font:700 .66rem/1 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.clarity-scroll i{
  position:relative;
  width:34px;
  height:1px;
  background:linear-gradient(90deg,#78dfc1,rgba(120,223,193,.18));
}
.clarity-scroll i::after{
  content:"";
  position:absolute;
  right:0;
  top:-3px;
  width:6px;
  height:6px;
  border-right:1px solid #78dfc1;
  border-bottom:1px solid #78dfc1;
  transform:rotate(45deg);
}
.clarity-scroll:hover,.clarity-scroll:focus-visible{color:#dff1eb}
.clarity-scroll:focus-visible{outline:2px solid #83e5c8;outline-offset:6px;border-radius:999px}
.clarity-hero + .story{margin-top:0}
.post-story-intro-v10 .eyebrow{color:#91e4cb}

@media(max-width:780px){
  .clarity-hero{min-height:100svh;place-items:start center}
  .clarity-hero::before{background-size:58px 58px}
  .clarity-hero::after{width:112vw;right:-66vw;top:16vh}
  .clarity-shell{width:min(88vw,620px);padding:104px 0 126px}
  .clarity-brand{font-size:.92rem}
  .clarity-kicker{margin-top:58px;font-size:.66rem;max-width:30ch}
  .clarity-title{max-width:10.5ch;font-size:clamp(3.4rem,16vw,5.4rem);line-height:.91}
  .clarity-lede{font-size:1rem;line-height:1.62;max-width:36ch}
  .clarity-actions{display:grid;grid-template-columns:1fr;width:100%;margin-top:30px}
  .clarity-actions .button{width:100%;min-height:52px}
  .clarity-clarifier{max-width:34ch;font-size:.78rem}
  .clarity-scroll{bottom:18px;width:min(88vw,620px);justify-content:space-between;font-size:.59rem}
}
@media(max-width:360px){
  .clarity-shell{width:88vw;padding-top:92px}
  .clarity-title{font-size:clamp(3rem,15vw,4.3rem)}
  .clarity-kicker{margin-top:46px}
}
@media(prefers-reduced-motion:reduce){
  .clarity-hero *{scroll-behavior:auto!important}
}

/* v19 semantic bridge heading: the new clarity hero owns the page H1. */
.post-story-intro-v10 h2{
  max-width:12ch;
  margin:0 auto;
  color:var(--v7-ink);
  font-family:var(--display);
  font-size:clamp(4.8rem,9.4vw,10.5rem);
  font-weight:400;
  line-height:.84;
  letter-spacing:-.07em;
  text-wrap:balance;
}
@media(max-width:780px){
  .post-story-intro-v10 h2{
    max-width:9ch;
    margin-inline:0;
    font-size:clamp(4rem,18vw,6.2rem);
  }
}

/* v19.1 — one-screen clarity fit after real viewport QA. */
.clarity-hero{height:100svh;min-height:700px}
.clarity-shell{padding:72px 0 92px}
.clarity-kicker{margin-top:38px;margin-bottom:14px}
.clarity-title{max-width:11ch;font-size:clamp(4rem,7.15vw,7.7rem);line-height:.91}
.clarity-lede{margin-top:24px;max-width:64ch}
.clarity-actions{margin-top:28px}
.clarity-clarifier{margin-top:17px}
@media(max-width:780px){
  .clarity-hero{height:100svh;min-height:720px}
  .clarity-shell{padding:58px 0 90px}
  .clarity-kicker{margin-top:34px;margin-bottom:12px;font-size:.64rem}
  .clarity-title{font-size:clamp(3.15rem,14.5vw,4.8rem);line-height:.92}
  .clarity-lede{margin-top:20px;font-size:.98rem;line-height:1.55}
  .clarity-actions{margin-top:24px;gap:10px}
  .clarity-actions .button{min-height:50px}
  .clarity-clarifier{margin-top:14px;font-size:.75rem;line-height:1.45}
}
@media(max-width:360px){
  .clarity-hero{min-height:700px}
  .clarity-shell{padding:48px 0 84px}
  .clarity-kicker{margin-top:28px}
  .clarity-title{font-size:clamp(2.8rem,14vw,4rem)}
}