:root{
  --green:#214e38;--ink:#173226;--paper:#faf7ee;--line:#ddd7ca;
  --soft:#edf2eb;--gold:#a77d2c
}
body{color:var(--ink);font-family:Arial,sans-serif;line-height:1.75}
a{color:inherit;text-decoration:none}

.aboutPage{
  padding:52px clamp(24px,3vw,52px) 90px;
}
.aboutLayout{
  display:grid;
  grid-template-columns:minmax(0,1050px) minmax(280px,340px);
  justify-content:space-between;
  gap:clamp(42px,5vw,84px);
  align-items:start;
}
.aboutContent{min-width:0}
.aboutContent>.eyebrow{
  margin:0 0 14px;
  letter-spacing:.2em;
  color:#537260;
  font:700 12px/1.4 Arial,sans-serif
}
.aboutContent>h1{
  margin:0 0 20px;
  font:500 clamp(48px,5vw,72px)/1.05 Georgia,serif;
  letter-spacing:.01em;
  scroll-margin-top:86px
}
.aboutContent>.lead{
  max-width:940px;
  margin:0 0 24px;
  font:22px/1.68 Georgia,serif;
  color:#233e34
}
.aboutContent section{scroll-margin-top:86px}
.aboutContent h2{
  margin:52px 0 14px;
  font:500 32px/1.2 Georgia,serif;
  scroll-margin-top:86px
}
.aboutContent p{
  max-width:1050px;
  margin:0 0 18px;
  font:18px/1.85 Arial,sans-serif;
  color:#30483f
}
.note{
  max-width:1050px;
  margin:30px 0 42px;
  padding:20px 22px;
  border-left:5px solid var(--gold);
  background:#fff4cf;
  font:17px/1.75 Arial,sans-serif
}
.note strong{display:inline-block;margin-bottom:5px;color:#173226}
.aboutContent h3{
  margin:28px 0 14px;
  font:600 22px/1.35 Georgia,serif;
  color:#214e38
}
.sensorLine{
  display:flex;
  align-items:baseline;
  gap:24px;
  max-width:1050px;
  margin:0 0 8px !important
}
.sensorLine strong{
  flex:0 0 190px;
  color:#214e38;
  font-weight:700
}
.sensorLine span{
  min-width:0
}

/* Right-side table of contents */
.aboutToc{
  position:relative;
  min-width:0;
}
.aboutTocInner{
  position:sticky;
  top:92px;
  padding:26px 26px 24px;
  background:#f2f0e7;
  border:1px solid var(--line);
  border-top:4px solid #426f5d;
  border-radius:10px;
}
.aboutTocEyebrow{
  margin:0 0 13px;
  color:#537260;
  font:700 12px/1.3 Arial,sans-serif;
  letter-spacing:.2em
}
.aboutToc nav{
  display:grid;
}
.aboutToc nav a{
  display:block;
  padding:11px 0;
  border-top:1px solid #d8d2c6;
  color:#25473a;
  font:17px/1.5 Arial,sans-serif
}
.aboutToc nav a:first-child{border-top:0}
.aboutToc nav a:hover,
.aboutToc nav a:focus-visible{
  color:#0f5a3e;
  text-decoration:underline;
  text-underline-offset:3px
}

@media(max-width:1050px){
  .aboutLayout{
    grid-template-columns:minmax(0,1fr) 280px;
    gap:34px
  }
}
@media(max-width:820px){
  .aboutPage{padding:36px 18px 64px}
  .aboutLayout{display:flex;flex-direction:column}
  .aboutToc{order:-1;width:100%}
  .aboutTocInner{position:static}
  .aboutToc nav{
    grid-template-columns:1fr 1fr;
    column-gap:20px
  }
  .aboutContent>h1{font-size:44px}
  .aboutContent>.lead{font-size:20px}
  .aboutContent h2{font-size:28px}
  .sensorLine{display:block}
  .sensorLine strong{display:block;margin-bottom:2px}
}
@media(max-width:520px){
  .aboutToc nav{grid-template-columns:1fr}
}

/* About page hierarchy and readability — 2026-09-06 */
.aboutContent{
  font-size:20px;
  line-height:1.72;
}
.aboutContent p{
  font-size:20px;
  line-height:1.72;
}
.aboutContent>.lead{
  font-size:20px;
  line-height:1.72;
}
.aboutContent h1{
  margin:14px 0 28px;
  font:600 46px/1.18 Georgia,serif;
}
.aboutContent h2{
  margin:40px 0 16px;
  font:600 28px/1.28 Georgia,serif;
}
.aboutContent h3{
  font-size:22px;
}
.aboutContent .sensorLine{
  font-size:20px;
  line-height:1.65;
}
.aboutLayout{
  grid-template-columns:minmax(0,1fr) minmax(320px,380px) !important;
}
.aboutToc{
  min-width:0;
}
.aboutTocInner{
  padding:28px 28px 26px !important;
}
.aboutTocEyebrow{
  font-size:13px !important;
}
.aboutToc nav a{
  font-size:18px !important;
  line-height:1.5 !important;
  padding:9px 0 !important;
}
@media(max-width:1180px){
  .aboutLayout{
    grid-template-columns:minmax(0,1fr) 320px !important;
  }
}
@media(max-width:900px){
  .aboutLayout{
    grid-template-columns:1fr !important;
  }
  .aboutToc nav a{
    font-size:17px !important;
  }
}

/* PlantEnvLab shared heading scale — 2026-09-06 */
.aboutContent>.eyebrow,
.aboutTocEyebrow{
  font-size:13px !important;
  line-height:1.4 !important;
}
.aboutContent>h1{
  font-size:48px !important;
  line-height:1.12 !important;
}
.aboutContent h2{
  font-size:29px !important;
  line-height:1.30 !important;
}
.aboutContent h3{
  font-size:22px !important;
  line-height:1.35 !important;
}

/* About title typography alignment with the rest of PlantEnvLab */
.aboutContent>h1{
  font-family:Georgia,"Times New Roman",serif !important;
  font-weight:500 !important;
  letter-spacing:-.03em !important;
}
.aboutContent h2{
  font-family:Georgia,"Times New Roman",serif !important;
  font-weight:500 !important;
  letter-spacing:0 !important;
}

/* PlantEnvLab Work02 v13 — About page title before contents, 2026-09-07 */
.aboutPageHeader{
  max-width:1050px;
  margin:0 0 28px;
}
.aboutPageHeader>.eyebrow{
  margin:0 0 14px;
  letter-spacing:.2em;
  color:#537260;
  font:700 12px/1.4 Arial,sans-serif;
}
.aboutPageHeader>h1{
  margin:0;
  font:500 clamp(48px,5vw,72px)/1.05 Georgia,serif;
  letter-spacing:.01em;
  scroll-margin-top:86px;
}

@media(max-width:820px){
  .aboutPageHeader{
    width:100%;
    max-width:none;
    margin-bottom:28px;
  }
  .aboutPageHeader>h1{
    font-size:44px;
  }
  .aboutToc{
    order:0;
    width:100%;
  }
  .aboutContent{
    order:1;
  }
}