/* Round 26 (9 Nov): the film is the whole hero (full width, behind), the text block sits on the page's left edge over a plain dark gradient.
   The film plays once, holds its last frame, then the research ring draws round the lit home (hero-r25.js).
   No haze: one flat scrim behind the nav, one plain gradient behind the text (#7). Credentials, door buttons and text wrap tidied (#25 #26 #27).
   Credentials row styles come from here (hero-r20.css is no longer loaded). */
.h25{position:relative;display:flex;align-items:center;min-height:var(--hh);background:var(--night);color:#F6F4EE;overflow:hidden}
.h25-film{position:absolute;inset:0;margin:0;overflow:hidden;background:var(--night)}
.h25-film video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 50%;display:block}
.h25-film:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(rgba(11,44,37,.55),rgba(11,44,37,.55)) top/100% 72px no-repeat,linear-gradient(90deg,#0B2C25 0,rgba(11,44,37,.88) 24%,rgba(11,44,37,.5) 40%,rgba(11,44,37,0) 55%)}
.h25-side{position:relative;z-index:2;width:100%;max-width:calc(720px + var(--edge));padding:112px 0 56px var(--edge);min-width:0}
.h25 .lbl{margin:0}
.h25 h1{font-size:var(--t4);line-height:1.08;margin-top:14px;text-wrap:balance;color:#F6F4EE;max-width:600px}
.h25 h1 em{display:block}
.h25 .lead{font:400 var(--t1)/1.4 var(--f-text);margin-top:18px;max-width:560px;color:rgba(246,244,238,.92);text-wrap:pretty}
.h25 .c-row{margin-top:20px;padding:0;border:0;display:flex;flex-direction:column;gap:8px;max-width:400px}
.h25 .lead+.c-row{margin-top:28px}
.h25 .btn.big{min-height:72px;padding:0 24px;font-size:var(--t1);font-weight:600;border-radius:4px;gap:14px;justify-content:space-between;width:100%;max-width:none;background:var(--mint);color:var(--green);box-shadow:none;transition:background .25s var(--ease)}
.h25 .btn.big i{font-style:normal;transition:transform .25s var(--ease)}
.h25 .btn.big:hover{background:#A3D8BF}
.h25 .btn.big:hover i{transform:translateX(6px)}
.h25 .btn.ghost.big{background:rgba(11,44,37,.55);color:#F6F4EE;box-shadow:inset 0 0 0 1.5px rgba(246,244,238,.75)}
.h25 .btn.ghost.big:hover{background:rgba(246,244,238,.14)}
.h25 a:focus-visible{outline:3px solid var(--mint);outline-offset:4px}
/* one short line under each door; the old caps label and the "no broker yet" line are gone */
.h25 .next{margin:0;font:400 var(--s)/1.45 var(--f-text);color:rgba(246,244,238,.92);text-wrap:pretty}
.h25 .next b,.h25 .nb{display:none}
/* credentials (#25): four equal columns on the block's left edge, one 1 px divider, every label two lines at most */
.h25 .creds{list-style:none;margin:36px 0 0;padding:0;max-width:720px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:24px;row-gap:20px}
.h25 .creds li{position:relative;border:0;padding:0;min-width:0;display:flex;flex-direction:column}
.h25 .creds li+li::before{content:'';position:absolute;left:-12px;top:4px;bottom:4px;width:1px;background:rgba(143,203,176,.4)}
.h25 .creds b{display:block;font:300 var(--t2)/1 var(--f-disp);color:#F6F4EE;font-variant-numeric:tabular-nums;white-space:nowrap}
.h25 .creds b .st{display:inline-block;color:var(--mint);font-size:var(--s);letter-spacing:.08em;margin-left:6px;vertical-align:.4em}
.h25 .creds span:not(.st){display:block;margin-top:8px;font:400 var(--s)/1.3 var(--f-text);color:rgba(246,244,238,.88);max-width:none;text-wrap:balance}
/* the research ring (hero-r25.js builds it inside .h25-ring once the film has ended) */
.h25-ring{position:absolute;inset:0;pointer-events:none}
.h25-ring .rsvg{position:absolute;left:0;top:0;overflow:visible}
.h25-ring .rc{fill:none;stroke:#8FCBB0;stroke-width:1.5;stroke-dashoffset:var(--len,1000);transform-box:fill-box;transform-origin:center;transform:rotate(-90deg);transition:stroke-dashoffset .8s var(--ease)}
.h25-ring .rl{fill:none;stroke:#8FCBB0;stroke-width:1;stroke-dashoffset:var(--ll,28);transition:stroke-dashoffset .6s var(--ease) calc(.8s + var(--i,0)*.12s)}
.h25-ring .rd{fill:#8FCBB0;opacity:0;transition:opacity .6s var(--ease) calc(.8s + var(--i,0)*.12s)}
.h25-ring .rt{position:absolute;box-sizing:border-box;padding:5px 10px;border-radius:4px;background:rgba(11,44,37,.86);color:#F6F4EE;font:600 var(--s)/1.25 var(--f-text);opacity:0;transform:translateY(16px);transition:opacity .6s var(--ease) calc(.8s + var(--i,0)*.12s),transform .6s var(--ease) calc(.8s + var(--i,0)*.12s)}
.h25-ring.on .rc,.h25-ring.on .rl{stroke-dashoffset:0}
.h25-ring.on .rd{opacity:1}
.h25-ring.on .rt{opacity:1;transform:none}
.h25-ring.now *{transition:none!important}
@media (max-width:1100px){
  /* film on top (about 56% of the screen), the text on solid night green below */
  .h25{display:block;min-height:0}
  .h25-film{position:relative;inset:auto;height:clamp(400px,56svh,560px)}
  .h25-film:after{background:linear-gradient(rgba(11,44,37,.55),rgba(11,44,37,.55)) top/100% 60px no-repeat}
  .h25-side{max-width:none;padding:32px var(--edge) 48px}
  .h25 h1{font-size:44px;margin-top:10px}
  .h25 .lead{font-size:var(--t0);margin-top:12px}
  .h25 .lead+.c-row{margin-top:24px}
  .h25 .c-row{max-width:420px}
  .h25 .creds{margin-top:32px;max-width:none}
}
@media (max-width:600px){
  .h25 h1{font-size:var(--t4)}
  .h25 .c-row{max-width:none}
  /* 390: two by two, the same 1 px divider between the two columns */
  .h25 .creds{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;row-gap:20px}
  .h25 .creds li:nth-child(odd)::before{display:none}
}
@media (prefers-reduced-motion:reduce){.h25 .btn.big,.h25 .btn.big i,.h25-ring *{transition:none!important}}

/* r26 broker-only (Pat 9 Nov "just have one green button"): one door, its long label on one line on desktop, a centred two-line button on phones */
.h25 .c-row,.cls .c-row{max-width:none}
.h25 .c-row .btn.big,.cls .c-row .btn.big{align-self:flex-start;width:auto;white-space:nowrap;line-height:1.2;padding-left:32px;padding-right:32px}
@media (max-width:600px){.h25 .c-row .btn.big,.cls .c-row .btn.big{align-self:stretch;white-space:normal;text-align:center;justify-content:center;padding:14px 24px;line-height:1.3}}
