/* pluginsolarlondon.co.uk
   London's problem is not sunlight, it is permission. More flats, more leaseholds,
   more conservation areas and more balconies than anywhere else, and the balcony is
   the one surface the new rules exclude.

   Structure is a consent chain: who has to say yes, in order, before anything goes
   up. Nothing else in the network is built as a sequence of gatekeepers.

   Strong red and a deep blue on cool concrete, with a condensed display. Unused
   elsewhere. */

:root{
  --paper:#F0F1F4;
  --card:#FFFFFF;
  --ink:#10121A;
  --body-ink:#2E313C;
  --dim:#666B79;
  --rule:#D2D5DD;
  --red:#C8102E;
  --red-deep:#9C0C24;
  --blue:#003688;
  --yes:#19703F;
  --yes-bg:#EAF3EE;
  --no-bg:#FBECEE;
  --display:"Anton","Helvetica Neue",Arial,sans-serif;
  --body:"Mulish","Helvetica Neue",Arial,sans-serif;
  --meta:"Spline Sans Mono",ui-monospace,Menlo,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--body-ink);font-family:var(--body);font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased}
.wrap{max-width:68rem;margin:0 auto;padding:0 1.8rem}
@media(max-width:640px){.wrap{padding:0 1.15rem}}
h1,h2,h3{font-family:var(--display);color:var(--ink);margin:0;font-weight:400;letter-spacing:.005em;line-height:1.05;text-transform:uppercase}
p{margin:0 0 1.05rem;max-width:66ch}
a{color:var(--blue);font-weight:700;text-decoration:none}
a:hover{color:var(--red)}
.meta{font-family:var(--meta);font-size:.78rem}

header.mast{background:var(--card);border-bottom:1px solid var(--rule)}
.mast .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;min-height:4.1rem;flex-wrap:wrap}
.brand{font-family:var(--display);font-size:1.4rem;color:var(--ink);text-transform:uppercase}
.brand b{color:var(--red);font-weight:400}
.mast nav{display:flex;gap:1.3rem;font-size:.92rem;font-weight:700}
.mast nav a{color:var(--body-ink)}
.mast nav a:hover{color:var(--red)}
@media(max-width:760px){.mast nav{display:none}}

.hero{padding:3.25rem 0 2.5rem}
.hero-grid{display:grid;grid-template-columns:1.4fr .6fr;gap:3rem;align-items:start}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr;gap:2rem}}
.hero-grid>*{min-width:0}

/* the glance panel, right of the headline */
.plate{background:var(--ink);color:#D8DBE3;padding:1.4rem 1.5rem}
.plate h2{font-size:1.05rem;color:#fff;margin-bottom:1rem;letter-spacing:.02em}
.plate dl{margin:0;display:grid;gap:.95rem}
.plate dt{font-family:var(--meta);font-size:.7rem;letter-spacing:.05em;text-transform:uppercase;color:#8A90A0;margin-bottom:.15rem}
.plate dd{margin:0;font-size:.95rem;color:#EDEFF3;line-height:1.4}
.plate dd b{font-family:var(--display);font-size:1.65rem;color:#fff;display:block;line-height:1;margin-bottom:.1rem}
.plate dd b span{font-family:var(--body);font-size:.78rem;font-weight:400;color:#8A90A0;letter-spacing:0;margin-left:.35rem}
.plate .flag{color:#FF8095}
.plate .src{font-family:var(--meta);font-size:.66rem;color:#787E90;margin:1.2rem 0 0;line-height:1.5}
h1{font-size:clamp(2.6rem,5.4vw,4.2rem);max-width:16ch}
h1 em{font-style:normal;color:var(--red)}
.stand{font-size:1.12rem;color:var(--dim);max-width:54ch;margin:1.3rem 0 0}

/* the consent chain, this site's signature */
.chain{margin-top:2.25rem}
.gate{display:grid;grid-template-columns:3.2rem 1fr 13.5rem;gap:1.4rem;align-items:start;background:var(--card);border:1px solid var(--rule);border-bottom:0;padding:1.35rem 1.4rem}
.gate:last-child{border-bottom:1px solid var(--rule)}
.gate>*{min-width:0}
@media(max-width:860px){.gate{grid-template-columns:3.2rem 1fr;gap:1.1rem}
  .gate .who{grid-column:2;grid-row:1;margin-bottom:.4rem}
  .gate .body{grid-column:2;grid-row:2}}
@media(max-width:560px){.gate{grid-template-columns:1fr;gap:.45rem}
  .gate .who,.gate .body{grid-column:1;grid-row:auto}}
.gate .n{font-family:var(--display);font-size:1.9rem;color:var(--red);line-height:.9}
.gate h3{font-size:1.25rem;margin-bottom:.45rem}
.gate p{font-size:.94rem;margin:0 0 .6rem;color:var(--dim);max-width:58ch}
.gate p:last-child{margin-bottom:0}
.who{font-family:var(--meta);font-size:.72rem;line-height:1.45;color:var(--blue);background:var(--paper);padding:.55rem .7rem}
@media(max-width:860px){.who{display:inline-block}}

section{padding:3.25rem 0}
section.alt{background:var(--card);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
h2{font-size:clamp(1.9rem,3.2vw,2.6rem);margin-bottom:.8rem}
.lede{font-size:1.06rem;color:var(--dim);max-width:58ch}

table{width:100%;border-collapse:collapse;margin:1.7rem 0 0;font-size:.95rem;background:var(--card)}
th,td{text-align:left;padding:.7rem .85rem;border:1px solid var(--rule);vertical-align:top}
th{background:var(--ink);color:#fff;font-family:var(--display);font-weight:400;font-size:.88rem;letter-spacing:.02em}
td.num{text-align:right;font-family:var(--meta);white-space:nowrap}
tr.no td{background:var(--no-bg)}
tr.yes td{background:var(--yes-bg)}
@media(max-width:560px){table{display:block;overflow-x:auto}}

.callout{border:1px solid var(--rule);background:var(--card);padding:1.2rem 1.35rem;margin-top:1.8rem;max-width:66ch}
.callout b{display:block;font-family:var(--display);font-size:1.05rem;color:var(--red-deep);margin-bottom:.4rem;text-transform:uppercase}
.callout p{margin:0;font-size:.95rem}
.callout.good{background:var(--yes-bg);border-color:#C3DED0}
.callout.good b{color:var(--yes)}

form{background:var(--card);border:1px solid var(--rule);padding:1.6rem}
.fg{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:start}
@media(max-width:880px){.fg{grid-template-columns:1fr;gap:1.75rem}}
label{display:block;font-family:var(--body);font-size:.84rem;font-weight:700;margin-bottom:.35rem;color:var(--ink)}
input,select{width:100%;font:inherit;font-size:1rem;padding:.7rem .8rem;border:1px solid var(--rule);background:var(--paper);color:var(--ink);border-radius:0}
input:focus,select:focus{outline:2px solid var(--red);outline-offset:1px}
.field{margin-bottom:1rem}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:520px){.row2{grid-template-columns:1fr}}
.btn{display:block;width:100%;background:var(--red);color:#fff;font-family:var(--display);font-weight:400;font-size:1.15rem;letter-spacing:.02em;padding:.8rem 1.3rem;border:0;cursor:pointer;text-transform:uppercase}
.btn:hover{background:var(--red-deep)}
.hp{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.note{font-size:.86rem;color:var(--dim);margin:.85rem 0 0}

footer{background:var(--ink);color:#989DAC;padding:2.75rem 0 3.25rem;font-size:.9rem}
footer .wrap{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:2.5rem}
@media(max-width:820px){footer .wrap{grid-template-columns:1fr;gap:1.6rem}}
footer h4{font-family:var(--meta);font-size:.74rem;text-transform:uppercase;color:#797E91;margin:0 0 .7rem}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
footer a{color:#DDE0E8;font-weight:600}
footer a:hover{color:#fff}
.foot-note{grid-column:1/-1;border-top:1px solid #262A36;margin-top:2rem;padding-top:1.3rem;font-size:.82rem;color:#797E91}
