/* order-r23.css - the r23 section order: #office, #results, the team + group photo, the short #why, #subscribe over the city film.
   Kit only: sizes 14 / 17 / 20 / 28 / 36 / 56 (and 88 for the one figure per section), colours #114136 #F6F4EE #8FCBB0, corners 4 and 16. */

/* ---------- shared ---------- */
.office,.results,.why.w23,.subs{--ew:1356px}
.office .in,.results .in,.subs .in{max-width:var(--ew);margin:0 auto}
.office h2,.results h2,.subs h2{margin-top:12px;font-size:var(--t4)}

/* ---------- OFFICE (light) ---------- */
.office{background:var(--soft);padding:96px var(--edge) 96px}
.office .ofr{display:grid;grid-template-columns:5fr 7fr;gap:64px;align-items:stretch}
.office .oft{display:flex;flex-direction:column;align-items:flex-start}
.office .lead{max-width:520px}
.office .oadr{list-style:none;margin-top:28px;font-size:var(--t1);line-height:1.4}
.office .oadr li+li{margin-top:12px}
.office .oadr a{font-weight:600;text-decoration:none;border-bottom:1px solid var(--mint)}
.office .oadr a:hover{border-color:var(--green)}
.office .ocall{margin-top:32px}
.office .omap{position:relative;border-radius:16px;overflow:hidden;min-height:440px;background:var(--tint2)}
.office .omap iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;z-index:2;background:transparent}
.office .ofb{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;justify-content:center;gap:8px;padding:32px;font-size:var(--t1);line-height:1.4}
.office .ofb b{font:600 14px/1.2 var(--f-text);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.office .ofb a{font-weight:600;color:var(--green);text-decoration:none;border-bottom:1px solid var(--green);align-self:flex-start;font-size:var(--t0)}
.office .omap.nomap iframe{display:none}
.office .omap.nomap .ofb{z-index:3}

/* ---------- RESULTS (dark green) ---------- */
.results{background:var(--green);color:#F6F4EE;padding:96px var(--edge)}
.results .lead{color:rgba(246,244,238,.86)}
.results .rq{margin:48px 0 0;max-width:none}
.results .rq blockquote{max-width:none;font:300 var(--t2)/1.3 var(--f-disp);letter-spacing:-.01em;color:#F6F4EE;quotes:none}
.results .rq figcaption{margin-top:20px;font-size:var(--t0);line-height:1.4;color:rgba(246,244,238,.86)}
.results .rq figcaption strong{display:block;font-weight:600;color:#F6F4EE}

/* ---------- TEAM: 11 portraits + the group photo, one section ---------- */
.teamsec.t23{padding:96px var(--edge)}
.teamsec.t23 .tmh .lead{max-width:420px;margin-top:14px}
.teamsec.t23 .pp:before{display:none}
.teamsec.t23 .pp img{aspect-ratio:8/7;-webkit-mask-image:none;mask-image:none;object-position:50% 0;background:var(--tint)}
.teamsec.t23 .tg{grid-template-columns:repeat(6,1fr);gap:40px 16px;margin-top:64px}
.teamsec.t23 .ptile{aspect-ratio:1/1;display:flex;flex-direction:column;justify-content:flex-end;padding:0 0 4px}
.teamsec.t23 .ptile p{font:300 var(--t2)/1.2 var(--f-disp);letter-spacing:-.01em;color:var(--ink);max-width:220px}

/* ---------- WHY (short): one heading, six one-line rows, one tiny line ---------- */
.why.w23{background:var(--soft);padding:64px var(--edge)}
.why.w23 .hd2 h2{margin-top:12px}
.w23-list{list-style:none;max-width:var(--ew);margin:32px auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:0 32px}
.w23-list li{display:block;padding:20px 0 0;border-top:1px solid rgba(17,65,54,.16)}
.w23-list h3{font:300 28px/1.15 var(--f-disp);letter-spacing:-.01em}
.w23-list p{margin-top:8px;font-size:17px;line-height:1.35;color:var(--ink)}
.w23-src{max-width:var(--ew);margin:16px auto 0;font-size:var(--s);line-height:1.5;color:var(--muted)}

/* ---------- SUBSCRIBE: the email call to action over the city film ---------- */
.subs{position:relative;overflow:hidden;isolation:isolate;color:#F6F4EE;background:#07130F url(subscribe/city-drone-poster.jpg) center/cover no-repeat;padding:96px var(--edge)}
.subs video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.subs .sov{position:absolute;inset:0;z-index:1;background:rgba(7,19,15,.8)}
.subs .in{position:relative;z-index:2}
.subs .sgrid{display:grid;grid-template-columns:5fr 7fr;gap:64px;align-items:start}
.subs .lbl{color:var(--mint)}
.subs .lead{color:rgba(246,244,238,.92);margin-top:16px;max-width:520px}
.subs form{display:grid;grid-template-columns:1fr 1fr;gap:20px 16px}
.subs .sf{display:flex;flex-direction:column;gap:8px;min-width:0}
.subs .sf label{font:600 14px/1.2 var(--f-text);letter-spacing:.14em;text-transform:uppercase;color:var(--mint)}
.subs .sf input[type=text],.subs .sf input[type=email]{font:400 var(--t0)/1.2 var(--f-text);min-height:52px;padding:0 16px;border:1px solid rgba(246,244,238,.35);border-radius:4px;background:#F6F4EE;color:#114136;width:100%}
.subs .sf input::placeholder{color:#3F5F54}
.subs .sf input:focus-visible,.subs .sbtn:focus-visible,.subs .scons input:focus-visible{outline:3px solid var(--mint);outline-offset:2px}
.subs .scons{grid-column:1/-1;display:flex;gap:12px;align-items:flex-start;font-size:var(--t0);line-height:1.4;color:#F6F4EE}
.subs .scons input{width:22px;height:22px;margin-top:1px;flex:0 0 22px;accent-color:#8FCBB0}
.subs .sgo{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:16px 24px;align-items:center}
.subs .sbtn{cursor:pointer;min-height:52px;padding:0 32px}
.subs .snote{font-size:var(--t0);color:rgba(246,244,238,.9)}
.subs .sthx{grid-column:1/-1;font:300 var(--t2)/1.25 var(--f-disp);letter-spacing:-.01em;color:#F6F4EE;padding:8px 0}
.subs .sthx[hidden]{display:none}
.subs.done form .sf,.subs.done form .scons,.subs.done form .sgo{display:none}
@media (prefers-reduced-motion:reduce){.subs video{display:none}}

/* ---------- footer: columns on the page grid (5fr / 7fr, the right half split in two), one link colour ---------- */
.ft .ftg{grid-template-columns:calc((100% - 64px)*5/12 + 64px) calc((100% - 64px)*7/24 + 8px) 1fr;gap:0}
.ft .fts2 h3{margin-top:0}
.ft a,.ft li a,.ft .ft-map,.ft .ftbase a{color:#F6F4EE}
.ft .ftbase{display:grid;grid-template-columns:calc((100% - 64px)*5/12 + 64px) calc((100% - 64px)*7/24 + 8px) 1fr;gap:0;align-items:center}
.ft .ftbase .paid{grid-column:1/-1}
.ft .ftbase .legal{gap:24px}

/* ---------- joins and dots ---------- */
.thr .tn,.thr .tn.dk,.thr .tn.lt{background:#8FCBB0;border:2px solid #114136;box-shadow:none}
.thr .tn.dk.on,.thr .tn.lt.on,.thr .tn.on{background:#8FCBB0;border-color:#114136;box-shadow:0 0 0 6px rgba(143,203,176,.35)}
body.atsubs .sticky{transform:translateY(100%)!important}

/* ---------- tablet and phone ---------- */
@media (max-width:1100px){
  .teamsec.t23 .tg{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:860px){
  .office .ofr,.subs .sgrid{grid-template-columns:1fr;gap:32px}
  .office,.results,.teamsec.t23,.subs{padding:64px var(--edge)}
  .why.w23{padding:64px var(--edge)}
  .office .omap{min-height:320px;order:2}
  .results .rq{margin-top:48px}
  .teamsec.t23 .tg{grid-template-columns:repeat(2,1fr);gap:28px 14px;margin-top:40px}
  .w23-list{grid-template-columns:1fr;gap:0}
  .w23-list li{padding:20px 0 20px}
  .w23-list li:last-child{border-bottom:1px solid rgba(17,65,54,.16)}
  .ft .ftg,.ft .ftbase{grid-template-columns:1fr;gap:36px}
  .subs form{grid-template-columns:1fr}
}
@media (max-width:600px){
  .subs h2{font-size:var(--t3)}
  .office .oadr{font-size:var(--t0)}
  .subs .sbtn{width:100%;justify-content:center}
}