body[data-page=unpattern]{--bg:#11110f;--surface:#252019;--body:#ccc7bd;--line:#524638;--accent:#e5a27b}
body[data-page=unpattern] h1{font-size:60.5px;line-height:1.13;max-width:1140px}
body[data-page=unpattern] .hero-description p{font-size:21px;line-height:32.5px}
body[data-page=unpattern] h2{font-size:47.5px;line-height:1.15;max-width:none}
body[data-page=unpattern] .hero{min-height:750px;height:900px;max-height:100svh}
.unpattern-intro h2{margin-bottom:100px}
.edge-grid{display:grid;grid-template-columns:minmax(0,580px) minmax(0,1fr);gap:110px;align-items:center}
body[data-page=unpattern] .edge-grid p{font-size:18px;line-height:29.7px;margin-bottom:40px}
body[data-page=unpattern] .edge-grid p:last-child{margin:0}
.edge-grid strong{font-weight:700}
.semantic-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;align-items:start;margin-top:85px}
.semantic-card{background:#29251f;--line:#675343;min-width:0}
.semantic-card summary{position:relative;padding:28px 22px 30px}
.semantic-card figure{height:170px;margin:0 0 28px;display:flex;align-items:center}
.semantic-card img{display:block;width:100%;height:100%;object-fit:contain}
.semantic-card h3{font:400 27px/1.23 Georgia,'Times New Roman',serif;letter-spacing:-.025em;margin:0 0 20px}
.semantic-card summary p{font-size:17px;line-height:23px;padding-right:30px;margin:0;min-height:46px}
.semantic-card .disclosure{position:absolute;right:16px;bottom:24px;color:var(--accent)}
.semantic-detail{padding:27px 22px 32px;border-top:1px solid #675343}
.semantic-detail p{font-size:17px;line-height:28px;margin:0 0 28px}
.semantic-detail p:last-child{margin:0}
.knowledge-tracks{margin-top:100px}
.track-row{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:start}
.track-row+.track-row{margin-top:112px}
.track-main,.track-detail{background:#302a23}
.track-main{position:relative;padding:28px 30px 35px}
.track-main .step{font:12px/1.5 'Courier New',monospace;color:#bca48a;letter-spacing:.15em;margin-bottom:34px}
.track-main h3{font:400 34px/1.23 Georgia,'Times New Roman',serif;margin:0 0 25px;letter-spacing:-.025em}
.track-main p{font-size:20px;line-height:28px;margin:0;padding-right:20px}
.track-main strong{font-weight:700}
.track-detail{padding:var(--body-offset,125px) 28px 35px;border-left:2px solid #d49b76}
.track-detail p{font-size:20px;line-height:29.7px;margin:0 0 29.7px}
.track-detail p:last-child{margin:0}
.track-toggle{position:absolute;right:20px;bottom:18px;padding:0;border:0;background:transparent;color:var(--accent)}
.track-toggle[aria-expanded=true] .disclosure{transform:rotate(45deg)}
@media(max-width:1100px){.edge-grid{gap:65px;grid-template-columns:1.1fr .9fr}.semantic-cards{gap:22px}.track-main,.track-detail{padding-inline:24px}.track-main h3{font-size:34px}}
@media(max-width:800px){.edge-grid{grid-template-columns:1fr;gap:45px}.semantic-cards{grid-template-columns:1fr;max-width:560px;margin-inline:auto}.semantic-card figure{height:190px}.track-row{grid-template-columns:1fr}.track-detail{padding:28px 24px 35px;border-left:0;border-top:2px solid #d49b76}.track-row+.track-row{margin-top:72px}.unpattern-intro h2{margin-bottom:55px}}
@media(max-width:600px){body[data-page=unpattern] .hero{height:auto;min-height:800px;max-height:none}body[data-page=unpattern] .hero-copy{position:relative;inset:auto;transform:none;padding:200px 24px 100px}body[data-page=unpattern] h1{font-size:42px}body[data-page=unpattern] h2{font-size:36px}.track-main h3{font-size:30px}.knowledge-tracks{margin-top:55px}.semantic-cards{margin-top:55px}}
body[data-page=unpattern] .closing h2{font-size:46px;line-height:53px}

/* Intro art sits behind the first passage, flush with the left edge. */
.unpattern-intro { position: relative; isolation: isolate; overflow: clip; }
.unpattern-intro h2 { position: relative; margin-bottom: clamp(54px, 8vw, 108px); }
.edge-grid { display: block; }
.edge-grid .prose { max-width: min(600px, 100%); padding-bottom: 30px; }
.edge-art {
  position: absolute;
  z-index: -1;
  top: clamp(60px, 7vw, 104px);
  left: 0;
  width: min(61vw, 880px);
  opacity: .43;
  pointer-events: none;
  mask-image: linear-gradient(90deg, #000 56%, transparent 100%);
}
.edge-art img { display: block; width: 100%; height: auto; }
body[data-page=unpattern] .edge-grid p { margin-bottom: 22px; }
body[data-page=unpattern] .edge-grid p:last-child { margin-bottom: 0; }
.semantic-cards { gap: clamp(24px, 4.2vw, 60px); margin-top: 66px; }
.semantic-card { background: transparent; border-bottom: 1px solid #494949; }
.semantic-card summary { padding: 0 0 22px; }
.semantic-card figure { margin-bottom: 16px; }
.semantic-card .disclosure { right: 0; bottom: 22px; }
.semantic-detail { padding: 22px 0; border-top-color: #494949; }
.knowledge-tracks { margin-top: 65px; }
.track-row { display: block; border-bottom: 1px solid #494949; }
.track-row + .track-row { margin-top: 0; }
.track-main, .track-detail { background: transparent; }
.track-main {
  display: grid;
  grid-template-columns: minmax(0, .97fr) minmax(0, 1.65fr);
  padding: 32px 0;
}
.track-main .step { margin-bottom: 13px; }
.track-main h3 { font-size: clamp(23px, 2.7vw, 30px); font-weight: 700; margin: 0; padding-right: 20px; }
.track-summary { border-left: 1px solid #82906a; padding: 18px 54px 0 28px; }
.track-main p, .track-detail p { font-size: 18px; line-height: 1.5; padding: 0; }
.track-main p + p { margin-top: 14px; }
.track-toggle { bottom: 27px; right: 10px; }
.track-detail { border: 0; border-top: 1px solid #494949; padding: 28px 0 32px; }
.track-detail p { margin-bottom: 19px; }
@media (max-width: 800px) {
  .edge-art { width: max(65vw, 420px); }
  .semantic-cards { margin-top: 42px; }
  .track-main { grid-template-columns: 1fr; gap: 18px; }
  .track-summary { padding: 0 48px 0 16px; }
  .track-toggle { right: 0; }
}
