@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&family=PT+Serif:wght@400;700&display=swap');

:root { --bg:#eef4f4; --ink:#1f3433; --line:#788786; --muted:#5f7473; --sage:#bdd3ba; --ivory:#eae7d6; --salmon:#cbb7b4; }
* { box-sizing:border-box; }
body { margin:0; overflow:hidden; background:#101817; font-family:Manrope,Arial,sans-serif; color:var(--ink); }
.slide { display:none; position:relative; width:100vw; height:100vh; overflow:hidden; background:var(--bg); padding:7vh 9vw; }
.slide.active { display:block; }
.grid { position:absolute; inset:0; opacity:.32; background-image:linear-gradient(rgba(120,135,134,.15) 1px,transparent 1px),linear-gradient(90deg,rgba(120,135,134,.15) 1px,transparent 1px); background-size:52px 52px; mask-image:linear-gradient(90deg,transparent,black 20%,black 80%,transparent); }
.content { position:relative; z-index:1; max-width:1000px; }
h1 { max-width:880px; margin:0 0 3.5vh; font-size:clamp(42px,6vw,88px); line-height:1.04; letter-spacing:-.06em; font-weight:700; }
h2 { margin:-2vh 0 5vh; color:var(--muted); font-family:'PT Serif',Georgia,serif; font-size:clamp(26px,3vw,44px); font-weight:400; }
p, li { max-width:900px; font-size:clamp(21px,2.2vw,34px); line-height:1.38; }
p { margin:0 0 2.2vh; }
ul { padding-left:1.2em; margin:2vh 0; }
li { margin:.65em 0; }
blockquote { max-width:900px; margin:5vh 0 0; padding:1.8vh 2vw; border-left:5px solid var(--salmon); background:rgba(234,231,214,.6); font-family:'PT Serif',Georgia,serif; font-size:clamp(24px,2.6vw,38px); line-height:1.3; }
.page { position:absolute; z-index:2; right:4vw; bottom:3vh; color:var(--muted); font-size:18px; letter-spacing:.12em; }
.notes { display:none; position:absolute; z-index:3; width:30vw; right:3vw; top:3vh; padding:18px; background:rgba(31,52,51,.94); color:#fff; font-size:15px; line-height:1.4; border-radius:4px; }
.show-notes .notes { display:block; }
.help { position:fixed; z-index:4; bottom:2vh; left:3vw; color:#dfe8e7; font-size:13px; opacity:.75; }
.layout-split .content { max-width:680px; }
.layout-statement .content { max-width:850px; padding-top:11vh; }
.layout-flow .content { padding-top:12vh; }
.layout-flow p:first-of-type { font-size:clamp(25px,3.2vw,48px); color:#355b59; font-weight:600; word-spacing:.4em; }
.layout-three .content { max-width:none; display:grid; grid-template-columns:repeat(3,1fr); gap:3vw; }
.layout-three h1 { grid-column:1/-1; }
.layout-three h2 { margin:0; padding-top:4vh; border-top:2px solid var(--line); color:var(--ink); font-family:Manrope,Arial,sans-serif; font-size:clamp(26px,3vw,44px); font-weight:700; }
.layout-three h2 + p { font-size:clamp(19px,2vw,28px); }
.layout-raft .content { max-width:49vw; }
.raft-photo { position:absolute; z-index:0; right:0; top:0; height:100%; width:47vw; object-fit:cover; object-position:56% 55%; filter:saturate(.78) contrast(.95); }
.layout-raft:after { content:''; position:absolute; z-index:0; top:0; right:42vw; width:17vw; height:100%; background:linear-gradient(90deg,var(--bg),transparent); }
.layout-raft-bottom { padding:5vh 9vw 0; }
.layout-raft-bottom .content { max-width:940px; height:55vh; }
.layout-raft-bottom .raft-photo { position:absolute; z-index:0; inset:auto 0 0 0; width:100vw; height:40vh; object-fit:cover; object-position:50% 68%; filter:saturate(.8) contrast(.96); }
.layout-raft-bottom .page { color:rgba(255,255,255,.9); text-shadow:0 1px 5px rgba(0,0,0,.55); }
.layout-raft-contain .content { max-width:51vw; padding-top:8vh; }
.layout-raft-contain .raft-photo { position:absolute; z-index:0; top:5vh; right:4vw; width:42vw; height:88vh; object-fit:contain; object-position:center; background:var(--ivory); filter:saturate(.84) contrast(.97); }
.layout-questions .content { max-width:none; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:7vw; }
.layout-questions h1 { grid-column:1/-1; }
.layout-questions p { margin:1.5vh 0 4vh; font-size:clamp(20px,2vw,30px); }
.layout-qr-only .content { max-width:none; text-align:center; }
.layout-qr-only h1 { margin:0; font-size:clamp(28px,3.2vw,48px); letter-spacing:-.04em; }
.layout-qr-only p { margin:.5vh auto 0; font-size:clamp(17px,1.6vw,25px); color:var(--muted); }
.layout-qr-only .qr { position:absolute; z-index:1; left:50%; top:12vh; width:min(80vh,76vw); height:min(80vh,76vw); transform:translateX(-50%); background:#fff; padding:0; }
.layout-mapping .content { max-width:1100px; }
table { width:100%; border-collapse:collapse; margin-top:4vh; font-size:clamp(18px,1.9vw,28px); }
th { text-align:left; background:var(--sage); }
th,td { padding:1.8vh 1.5vw; border-bottom:1px solid rgba(120,135,134,.45); }
.layout-closing .content { padding-top:13vh; max-width:960px; }
.layout-closing p { font-family:'PT Serif',Georgia,serif; font-size:clamp(28px,3vw,46px); line-height:1.3; }
@media (max-width:700px) {
  .slide { padding:9vh 7vw; }
  .layout-three .content,.layout-questions .content { display:block; }
  .layout-three h2 { margin-top:5vh; }
  .raft-photo { opacity:.28; width:100vw; }
  .layout-raft .content,.layout-raft-bottom .content { max-width:100%; }
  .layout-raft-bottom .raft-photo { opacity:1; height:36vh; object-position:50% 68%; }
  .layout-raft-contain .content { max-width:100%; padding-top:4vh; }
  .layout-raft-contain .raft-photo { opacity:1; top:auto; right:4vw; bottom:3vh; width:42vw; height:46vh; }
  .layout-qr-only .qr { top:16vh; width:76vw; height:76vw; }
  .help { display:none; }
}
